@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;600;700&family=Caveat:wght@500;700&family=IBM+Plex+Mono:wght@500&display=swap');
:root{--paper:#fbf9f4;--card:#fff;--surface:#f0eee9;--border:#c6c6cc;--ink:#151925;--text:#1b1c19;--muted:#46464c;--dim:#76777c;--red:#a23d32;--red-dark:#721b14;--highlight:#f3e1a0;--danger-bg:#fff0ee}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--text);font:400 16px/1.72 'Be Vietnam Pro',sans-serif;background-image:linear-gradient(rgba(21,25,37,.035) 1px,transparent 1px);background-size:100% 32px}a{color:var(--red-dark);font-weight:600;text-decoration-thickness:1.5px;text-underline-offset:3px}a:focus-visible{outline:3px solid var(--highlight);outline-offset:4px;border-radius:2px}.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:12px;z-index:10;background:var(--card);padding:10px;border:2px solid var(--ink)}header{background:rgba(251,249,244,.96);border-bottom:2px solid var(--ink);position:sticky;top:0;z-index:5}nav{max-width:920px;min-height:72px;margin:auto;padding:9px 24px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none;pointer-events:auto;cursor:pointer;user-select:none}.mark{width:40px;height:40px;font-size:0;background:transparent url('/drip-mark.svg?v=20260906-4') center/contain no-repeat !important;border:0 !important;border-radius:0 !important;display:block;box-shadow:none !important;flex-shrink:0}
.brand strong{font-size:19px}.brand span{font:500 12px 'IBM Plex Mono';color:var(--dim)}
.brand-tagline{display:inline-block;font:500 12px 'IBM Plex Mono';color:var(--dim)}
.navlinks{display:flex;gap:10px;font-size:13px;flex-wrap:wrap;align-items:center}
.lang-selector-wrap{position:relative;display:inline-flex}
.lang-btn{min-height:40px;display:inline-flex;align-items:center;gap:7px;padding:6px 12px;background:var(--card);border:1.5px solid var(--ink);border-radius:4px 9px 3px 7px;box-shadow:3px 3px 0 var(--ink);color:var(--ink);font:600 13px 'Be Vietnam Pro',sans-serif;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s}
.lang-btn:hover{background:var(--highlight);transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
.lang-badge{display:inline-flex;align-items:center;justify-content:center;width:24px;height:22px;border-radius:3px;font:700 11px 'IBM Plex Mono',monospace;border:1px solid var(--ink)}
.lang-arrow{transition:transform .2s ease}
.lang-btn[aria-expanded="true"] .lang-arrow{transform:rotate(180deg)}
.lang-modal-overlay{position:fixed;inset:0;background:rgba(21,25,37,.45);backdrop-filter:blur(2px);z-index:99;display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
.lang-modal-overlay.open{opacity:1;visibility:visible}
.lang-modal-card{width:100%;max-width:440px;background:var(--paper);border:2px solid var(--ink);border-radius:4px 12px 3px 10px;box-shadow:6px 6px 0 var(--ink);padding:24px;max-height:90vh;overflow-y:auto;transform:translateY(10px);transition:transform .2s}
.lang-modal-overlay.open .lang-modal-card{transform:translateY(0)}
.lang-modal-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px;padding-bottom:12px;border-bottom:2px solid var(--ink)}
.lang-modal-title{font-size:20px;font-weight:700;color:var(--ink);margin:0 0 4px}
.lang-modal-sub{font:500 12px 'IBM Plex Mono',monospace;color:var(--dim);text-transform:uppercase;letter-spacing:.05em;margin:0}
.lang-close-btn{background:var(--card);border:1.5px solid var(--ink);box-shadow:2px 2px 0 var(--ink);border-radius:4px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;cursor:pointer;line-height:1}
.lang-close-btn:hover{background:var(--highlight)}
.lang-list{display:flex;flex-direction:column;gap:10px}
.lang-row{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;background:var(--card);border:1.5px solid var(--ink);border-radius:6px;box-shadow:3px 3px 0 var(--ink);cursor:pointer;transition:transform .15s,box-shadow .15s,border-color .15s,background-color .15s;user-select:none}
.lang-row:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
.lang-row.selected{border-color:#00875a;background-color:rgba(0,135,90,.08)}
.lang-row-left{display:flex;align-items:center;gap:12px}
.lang-row-code{width:42px;height:42px;border-radius:4px;border:1.5px solid var(--ink);display:flex;align-items:center;justify-content:center;font:700 15px 'IBM Plex Mono',monospace;box-shadow:1.5px 1.5px 0 var(--ink)}
.lang-row-names{display:flex;flex-direction:column}
.lang-row-name{font-size:15px;font-weight:700;color:var(--ink)}
.lang-row-native{font-size:12px;color:var(--dim);margin-top:2px}
.lang-check-circle{width:24px;height:24px;border-radius:50%;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;transition:all .15s}
.lang-row.selected .lang-check-circle{border-color:#00875a;background:#00875a}
.lang-check-circle svg{display:none}
.lang-row.selected .lang-check-circle svg{display:block}.navlinks a{min-height:40px;display:inline-flex;align-items:center;padding:7px 14px;background:var(--card);border:1.5px solid var(--ink);border-radius:4px 9px 3px 7px;box-shadow:3px 3px 0 var(--ink);color:var(--ink);text-decoration:none;transition:transform .15s,box-shadow .15s,background .15s}.navlinks a:hover{background:var(--highlight);color:var(--red-dark);transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}.navlinks a:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}.navlinks a.active,.navlinks a[aria-current="page"]{background:var(--highlight);color:var(--red-dark);font-weight:700;box-shadow:2px 2px 0 var(--ink)}main{max-width:860px;margin:auto;padding:42px 24px 64px}.hero,.section,.footer-card{background:var(--card);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}.hero{padding:32px;border-radius:3px 12px 4px 9px;position:relative}.eyebrow{font:500 11px 'IBM Plex Mono';letter-spacing:.13em;text-transform:uppercase;color:var(--red)}h1,h2{line-height:1.28;margin:0;color:var(--ink)}h1{font-size:clamp(28px,5vw,42px);margin-top:9px;max-width:680px}h2{font-size:20px;margin-bottom:10px}.lead{font-size:17px;color:var(--muted);max-width:680px}.note{font:italic 700 15px/1.5 'Be Vietnam Pro',sans-serif;color:var(--red);transform:rotate(-1deg);display:inline-block;background:var(--highlight);padding:1px 9px;margin-top:8px}.toc{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0}.toc a{background:var(--surface);border:1.5px solid var(--ink);padding:8px 12px;text-decoration:none;font-size:13px}.sections{display:grid;gap:16px}.section{padding:24px;border-radius:2px 9px 3px 7px;box-shadow:3px 3px 0 var(--border)}.section p:last-child,.section ul:last-child{margin-bottom:0}.section-label{font:500 11px 'IBM Plex Mono';color:var(--red);text-transform:uppercase;letter-spacing:.1em;margin-bottom:7px}.callout{background:var(--surface);border-left:5px solid var(--red);padding:14px 16px;margin:16px 0}.warning{background:var(--danger-bg);border-color:var(--red-dark)}.button{display:inline-flex;min-height:48px;align-items:center;justify-content:center;padding:11px 18px;background:var(--paper);color:var(--red-dark);border:2px solid var(--red-dark);box-shadow:4px 4px 0 var(--red-dark);text-decoration:none;font-weight:700;margin:8px 4px 8px 0}.button:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--red-dark)}.button:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--red-dark)}.button.secondary{border-color:var(--ink);color:var(--ink);box-shadow:4px 4px 0 var(--ink)}footer{max-width:860px;margin:0 auto 48px;padding:0 24px}.footer-card{padding:20px 24px;background:var(--surface);display:flex;justify-content:space-between;gap:18px;align-items:center}.footer-links{display:flex;flex-wrap:wrap;gap:14px;font-size:13px}.mono{font-family:'IBM Plex Mono',monospace}.muted{color:var(--muted)}
@media(max-width:640px){nav{align-items:center;padding:12px 16px}.brand>span>span{display:none}.navlinks{gap:7px}.navlinks a{padding:7px 10px;font-size:12px;min-height:40px}main{padding:26px 16px 48px}.hero{padding:24px 20px}.section{padding:20px}.footer-card{align-items:flex-start;flex-direction:column}.button{width:100%;margin-right:0}}@media(max-width:390px){.brand>span{display:none}.mark{width:44px;height:44px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.mark{background-image:url('/drip-mark.svg?v=20260910-1')!important}