:root{--grape-950:#170a30;--grape-900:#200f42;--grape-850:#281452;--grape-800:#321b63;--grape-700:#45297f;--grape-600:#5b3aa0;--ink:#fbf6ff;--ink-soft:#d9cdf5;--muted:#a493d3;--faint:#7563a8;--bubblegum:#ff4fa3;--bubblegum-deep:#c42a78;--lemon:#ffd43b;--lemon-deep:#c79a00;--sky:#4cc9ff;--sky-deep:#1784c0;--tangerine:#ff8a3d;--tangerine-deep:#c25414;--mint:#52f2b0;--mint-deep:#1aa874;--error:#ff4d5e;--error-deep:#b8122a;--accent:var(--bubblegum);--accent-deep:var(--bubblegum-deep);--accent-ink:var(--grape-950);--font-display:"Bungee", "Rubik", system-ui, sans-serif;--font-ui:"Rubik", system-ui, -apple-system, "Segoe UI", sans-serif;--text-xs:.75rem;--text-sm:.875rem;--text-md:1rem;--text-lg:1.25rem;--text-xl:1.5625rem;--text-2xl:1.953rem;--text-3xl:2.441rem;--text-4xl:3.052rem;--text-5xl:4.768rem;--space-2xs:2px;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:72px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--key-depth:6px;--ease-out:cubic-bezier(.22, 1, .36, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--dur-fast:.12s;--dur-base:.22s;--dur-slow:.42s;--max-width:1080px;--stage-width:920px;--header-height:68px}[data-accent=lemon]{--accent:var(--lemon);--accent-deep:var(--lemon-deep)}[data-accent=sky]{--accent:var(--sky);--accent-deep:var(--sky-deep)}[data-accent=tangerine]{--accent:var(--tangerine);--accent-deep:var(--tangerine-deep)}[data-accent=mint]{--accent:var(--mint);--accent-deep:var(--mint-deep)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;tab-size:4}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6}img,svg{max-width:100%;display:block}button,input,select,textarea{font:inherit;color:inherit;background:0 0;border:none;outline:none}button{cursor:pointer}a{color:inherit;text-decoration:none}ul,ol{list-style:none}html{background-color:var(--grape-950);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{font-family:var(--font-ui);font-size:var(--text-md);background-color:var(--grape-950);color:var(--ink);background-image:radial-gradient(1200px 600px at 85% -10%,#ff4fa324,#0000 60%),radial-gradient(900px 500px at -10% 110%,#4cc9ff1a,#0000 60%);background-attachment:fixed;flex-direction:column;min-height:100dvh;display:flex}.container{width:100%;max-width:var(--max-width);padding:0 var(--space-lg);margin:0 auto}.site-header{height:var(--header-height);justify-content:space-between;align-items:center;gap:var(--space-md);padding:0 var(--space-lg);max-width:calc(var(--max-width) + 2 * var(--space-lg));width:100%;margin:0 auto;display:flex}.logo{font-family:var(--font-display);color:var(--ink);align-items:center;gap:3px;font-size:1.05rem;line-height:1;display:inline-flex}.logo__key{background:var(--grape-800);width:1.55em;height:1.55em;box-shadow:inset 0 -3px 0 #00000059, 0 3px 0 var(--grape-950);transition:transform var(--dur-fast) var(--ease-out), background-color var(--dur-fast);border-radius:5px;place-items:center;display:inline-grid}.logo__key--brand{background:var(--bubblegum);color:var(--grape-950)}.logo__key--gap{width:.4em;box-shadow:none;background:0 0}.logo__key.is-pressed{background:var(--lemon);color:var(--grape-950);transform:translateY(3px);box-shadow:inset 0 -1px #00000059}.site-nav{align-items:center;gap:var(--space-xs);display:flex}.site-nav__link{padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);color:var(--muted);font-size:var(--text-sm);transition:color var(--dur-fast), background-color var(--dur-fast);font-weight:500}.site-nav__link:hover,.site-nav__link[aria-current=page]{color:var(--ink);background:var(--grape-850)}.icon-btn{min-width:40px;height:40px;padding:0 var(--space-sm);border-radius:var(--radius-md);color:var(--muted);font-size:var(--text-xs);transition:color var(--dur-fast), background-color var(--dur-fast);place-items:center;font-weight:700;display:inline-grid}.icon-btn:hover{color:var(--ink);background:var(--grape-850)}.icon-btn svg{width:20px;height:20px}.icon-btn[aria-pressed=false] .icon-on,.icon-btn[aria-pressed=true] .icon-off{display:none}main{padding:var(--space-lg) 0 var(--space-3xl);flex:1}.site-footer{padding:var(--space-lg);text-align:center;color:var(--faint);font-size:var(--text-xs)}.site-footer a{color:var(--muted)}.site-footer a:hover{color:var(--ink)}:focus-visible{outline:3px solid var(--lemon);outline-offset:3px;border-radius:var(--radius-sm)}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}[hidden]{display:none!important}::selection{background-color:var(--bubblegum);color:var(--grape-950)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--grape-950)}::-webkit-scrollbar-thumb{background:var(--grape-700);border-radius:4px}@media (width<=640px){.container,.site-header{padding:0 var(--space-md)}.site-nav__link--optional{display:none}.logo{gap:2px;font-size:.78rem}.icon-btn{min-width:34px;padding:0 4px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}.key{--key-face:var(--accent);--key-side:var(--accent-deep);--key-ink:var(--accent-ink);justify-content:center;align-items:center;gap:var(--space-sm);min-height:48px;padding:0 var(--space-lg);border-radius:var(--radius-md);background:var(--key-face);color:var(--key-ink);font-weight:700;font-size:var(--text-md);box-shadow:inset 0 2px 0 #ffffff59, 0 var(--key-depth) 0 var(--key-side), 0 calc(var(--key-depth) + 6px) 16px #00000059;transition:transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out), filter var(--dur-fast);-webkit-user-select:none;user-select:none;white-space:nowrap;display:inline-flex;position:relative;transform:translateY(0)}.key:hover{filter:brightness(1.06)}.key:active,.key.is-pressed{transform:translateY(calc(var(--key-depth) - 2px));box-shadow:inset 0 2px 0 #ffffff40, 0 2px 0 var(--key-side), 0 4px 8px #0000004d}.key:disabled{opacity:.5;cursor:not-allowed;transform:none}.key--quiet{--key-face:var(--grape-800);--key-side:var(--grape-950);--key-ink:var(--ink)}.key--lg{min-height:60px;padding:0 var(--space-xl);font-size:var(--text-lg)}.key--sm{min-height:38px;padding:0 var(--space-md);font-size:var(--text-sm);--key-depth:4px}.key--block{width:100%}kbd,.kbd{min-width:1.9em;height:1.9em;font-family:var(--font-ui);background:#170a302e;border-radius:5px;place-items:center;padding:0 .45em;font-size:.72em;font-weight:700;line-height:1;display:inline-grid;box-shadow:inset 0 -2px #0003}.hint{justify-content:center;gap:var(--space-md);color:var(--faint);font-size:var(--text-xs);flex-wrap:wrap;display:flex}.hint kbd{background:var(--grape-850);color:var(--muted);box-shadow:inset 0 -2px 0 var(--grape-950);margin-right:var(--space-xs)}.seg{border-radius:var(--radius-md);background:var(--grape-900);gap:2px;padding:4px;display:inline-flex}.seg__opt{min-height:34px;padding:0 var(--space-md);color:var(--muted);font-size:var(--text-sm);transition:color var(--dur-fast), background-color var(--dur-fast);border-radius:7px;font-weight:600}.seg__opt:hover{color:var(--ink)}.seg__opt[aria-checked=true]{background:var(--accent);color:var(--accent-ink)}.seg__opt:disabled{opacity:.4;cursor:not-allowed}.panel{background:var(--grape-900);border-radius:var(--radius-xl);padding:var(--space-xl)}.toast{left:50%;bottom:var(--space-xl);padding:var(--space-md) var(--space-lg);border-radius:var(--radius-md);background:var(--ink);color:var(--grape-950);font-weight:600;font-size:var(--text-sm);z-index:3000;animation:toast-in var(--dur-base) var(--ease-out);position:fixed;transform:translate(-50%);box-shadow:0 10px 30px #0006}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,20px)}}.pill{align-items:center;gap:var(--space-xs);font-size:var(--text-xs);background:var(--grape-800);color:var(--ink-soft);border-radius:999px;padding:4px 10px;font-weight:700;display:inline-flex}.pill--hot{background:var(--lemon);color:var(--grape-950)}.field{gap:var(--space-sm);flex-direction:column;display:flex}.field__label{font-size:var(--text-sm);color:var(--ink-soft);font-weight:600}.input{min-height:52px;padding:0 var(--space-md);border-radius:var(--radius-md);background:var(--grape-950);border:2px solid var(--grape-700);color:var(--ink);font-size:var(--text-lg);transition:border-color var(--dur-fast);font-weight:500}.input::placeholder{color:var(--faint)}.input:focus{border-color:var(--accent)}.input--error{border-color:var(--error);animation:.3s shake-x}.input--code{font-family:var(--font-display);letter-spacing:.3em;text-transform:uppercase;text-align:center}@keyframes shake-x{20%,60%{transform:translate(-5px)}40%,80%{transform:translate(5px)}}.chip{min-height:42px;padding:0 var(--space-md);border-radius:var(--radius-md);background:var(--grape-900);color:var(--muted);font-size:var(--text-sm);transition:color var(--dur-fast), background-color var(--dur-fast);font-weight:600}.chip:hover{color:var(--ink)}.chip[aria-checked=true]{background:var(--grape-700);color:var(--ink)}.chip[aria-checked=true]:before{content:"✓ ";color:var(--accent)}