:root{--ink: #f1ece1;--muted: rgba(241, 236, 225, .62);--panel: rgba(20, 18, 16, .58);--line: rgba(255, 255, 255, .12);--active: #f1ece1;--active-ink: #141210;--mono: ui-monospace, "SF Mono", "Cascadia Mono", Consolas, monospace}body[data-tone=light]{--ink: #1c1a17;--muted: rgba(28, 26, 23, .6);--panel: rgba(250, 247, 240, .66);--line: rgba(0, 0, 0, .1);--active: #1c1a17;--active-ink: #f6f2ea}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#09090b}canvas{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}.boot{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;max-width:min(420px,calc(100vw - 32px));font:12px/1.6 ui-monospace,SF Mono,Cascadia Mono,Consolas,monospace;color:#f1ece199;text-align:center}.boot.failed{color:#f1ece1}.ui{position:fixed;inset:0;overflow:hidden;pointer-events:none;font-family:var(--mono);color:var(--ink)}.ui>*{pointer-events:auto}.title{position:absolute;top:16px;left:16px;max-width:330px;padding:12px 14px;border-radius:12px;background:var(--panel);border:1px solid var(--line);pointer-events:none;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.title p{margin:0}.brand{font-size:14px;font-weight:700;letter-spacing:.02em}.meta{margin-top:2px!important;font-size:11px;color:var(--muted)}.hint{margin-top:10px!important;font-size:12px;line-height:1.5;color:var(--muted)}.word{position:absolute;top:18px;right:20px;display:flex;gap:10px;align-items:center;padding:10px 14px;border-radius:12px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);animation:rise .35s ease}.word[hidden]{display:none}.word .swatch{width:12px;height:12px;border-radius:3px;background:var(--word)}.word strong{display:block;font-size:13px}.word small{display:block;font-size:10px;color:var(--muted)}.variants{position:absolute;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translate(-50%);display:flex;gap:4px;padding:5px;border-radius:16px;max-width:calc(100vw - 32px);box-sizing:border-box;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.variants button{font:inherit;color:var(--ink);background:transparent;border:0;border-radius:11px;cursor:pointer;padding:8px 14px;min-width:0;display:flex;flex-direction:column;align-items:center;gap:2px;transition:background .2s,color .2s}.variants button span{font-size:12px;font-weight:700;white-space:nowrap}.variants button small{font-size:10px;color:var(--muted);white-space:nowrap}.variants button:hover{background:var(--line)}.variants button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.variants button[aria-current=true]{background:var(--active);color:var(--active-ink)}.variants button[aria-current=true] small{color:inherit;opacity:.7}.grain,.vignette{position:absolute;pointer-events:none!important;opacity:0;transition:opacity .4s}.grain{inset:-50%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");animation:grain .9s steps(4) infinite}.vignette{inset:0;background:radial-gradient(ellipse at 50% 45%,transparent 45%,rgba(0,0,0,.55) 100%)}body[data-tone=dark] .grain{opacity:.09}body[data-tone=dark] .vignette{opacity:1}@keyframes grain{0%{transform:translate(0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}}.veil{position:absolute;inset:0;background:#09090b;opacity:0;transition:opacity .3s ease;pointer-events:none}.veil.on{opacity:1}@keyframes rise{0%{opacity:0;transform:translateY(-6px)}}@media(max-width:620px){.variants button{padding:7px 8px;flex:1 1 0}.variants button small{display:none}.variants button span{font-size:11px}.title{right:16px;max-width:none;padding:10px 12px}.word{top:auto;bottom:calc(max(18px,env(safe-area-inset-bottom)) + 62px);right:16px}.hint{font-size:11px}}@media(max-width:400px){.variants button span{font-size:10px;letter-spacing:-.02em}}@media(prefers-reduced-motion:reduce){.veil,.variants button{transition:none}.grain,.word{animation:none}}