:root{--hh-cream:#fde9c8;--hh-apricot:#f9b36a;--hh-persimmon:#e4643f;--hh-plum:#a03f63;--hh-violet:#4b3a72;--hh-indigo:#242a52;--hh-gradient:linear-gradient(90deg, #fde9c8 0%, #f9b36a 22%, #e4643f 45%, #a03f63 68%, #4b3a72 86%, #242a52 100%);--hh-warm:linear-gradient(90deg, #fde9c8 0%, #f9b36a 35%, #e4643f 70%, #a03f63 100%);--ink:#242a52cc;--ink-raised:#fde9c812;--text:var(--hh-cream);--muted:#c9b6e4;--accent:var(--hh-apricot);--accent-ink:#12121f;--line:#fde9c829;--sky:#cfe4f4;--title:var(--hh-cream);--title-shadow:#242a5299;--err:#f2a9b8;--font-display:"Alegreya", "Iowan Old Style", "Palatino Linotype", Georgia, serif;--font-ui:"Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}html,body{height:100%}[hidden]{display:none!important}body{background:var(--sky);color:var(--text);font-family:var(--font-ui);-webkit-font-smoothing:antialiased;margin:0;overflow:hidden}#scene{touch-action:none;cursor:grab;outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}#scene.dragging{cursor:grabbing}.vignette{pointer-events:none;background:radial-gradient(125% 95% at 50% 42%,#0000 58%,#181e344d 100%);transition:opacity .6s;position:fixed;inset:0}.loading{pointer-events:none;font-family:var(--font-display);color:var(--hh-cream);background:linear-gradient(#242a52 0%,#4b3a72 38%,#a03f63 68%,#e4643f 88%,#f9b36a 100%);place-items:center;font-size:22px;font-style:italic;transition:opacity .8s;display:grid;position:fixed;inset:0}.loading.done{opacity:0}.hud{pointer-events:none;color:var(--title);top:max(16px, env(safe-area-inset-top,0px));left:max(16px, env(safe-area-inset-left,0px));text-shadow:0 1px 12px var(--title-shadow), 0 0 2px #121e3a59;position:fixed}.hud p{margin:0}.hud-name{font-family:var(--font-display);font-size:22px;font-weight:700;line-height:1.15}.hud-name:after{content:"";background:var(--hh-warm);width:36px;height:2px;box-shadow:0 1px 6px var(--title-shadow);border-radius:2px;margin:4px 0 5px;display:block}.hud-line{font-variant-numeric:tabular-nums;font-size:13px;line-height:1.5}.start{background:radial-gradient(90% 80%,#242a5233,#242a528c);place-items:center;padding:16px;display:grid;position:fixed;inset:0}.start-card{box-sizing:border-box;background:linear-gradient(var(--ink), var(--ink)) padding-box, linear-gradient(165deg, #f9b36a99, #a03f6359 45%, #4b3a7240) border-box;-webkit-backdrop-filter:blur(16px)saturate(1.2);backdrop-filter:blur(16px)saturate(1.2);border:1px solid #0000;border-radius:16px;flex-direction:column;gap:10px;width:min(360px,100%);padding:24px;display:flex;box-shadow:0 16px 48px #12121f66}.eyebrow{letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0;font-size:11px;font-weight:600}.start-card h1{font-family:var(--font-display);color:var(--title);margin:0 0 8px;font-size:32px;font-weight:700;line-height:1.05}.start-card h1:after{content:"";background:var(--hh-warm);border-radius:3px;width:56px;height:3px;margin-top:12px;display:block}.label{letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:6px 0 0;font-size:11px;font-weight:600}.start-card input{font:inherit;color:var(--text);background:var(--ink-raised);border:1px solid var(--line);border-radius:10px;outline:none;padding:11px 12px;font-size:16px}.start-card input::placeholder{color:#b0b6c899}.start-card input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #f9b36a2e}.start-card input[aria-invalid=true]{border-color:var(--err)}.err{color:var(--err);margin:0;font-size:12.5px}.trade{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.trade small{color:var(--muted);font-size:12px}.btn{--face-top:#fbc98e;--face-bot:#f28a50;--rim:#e4643f;--lip:#a03f63;--outline:#3d1626;--lip-h:6px;--ow:3px;margin:0 0 calc(var(--lip-h) + var(--ow));border:var(--ow) solid var(--outline);cursor:pointer;font:inherit;letter-spacing:.02em;color:#fff7ea;text-shadow:0 2px 0 var(--outline), 2px 0 0 var(--outline), -2px 0 0 var(--outline), 0 -2px 0 var(--outline), 1.5px 1.5px 0 var(--outline), -1.5px 1.5px 0 var(--outline), 1.5px -1.5px 0 var(--outline), -1.5px -1.5px 0 var(--outline), 0 4px 0 var(--outline);background:linear-gradient(180deg, var(--face-top) 0%, var(--face-bot) 100%);box-shadow:inset 0 -7px 0 var(--rim),  inset 0 2px 0 #fff7ea80,  0 var(--lip-h) 0 0 var(--lip),  0 var(--lip-h) 0 var(--ow) var(--outline),  0 calc(var(--lip-h) + 8px) 14px #12121f59;-webkit-tap-highlight-color:transparent;border-radius:14px;justify-content:center;align-items:center;padding:12px 20px 15px;font-size:17px;font-weight:800;line-height:1.1;transition:transform 80ms,box-shadow 80ms,filter .15s;display:inline-flex;position:relative}.btn:before,.btn:after{content:"";pointer-events:none;background:#fffaf0d9;border-radius:99px;position:absolute;top:6px}.btn:before{width:30px;height:7px;left:12px}.btn:after{width:7px;height:7px;left:47px}.btn:hover{filter:brightness(1.06)saturate(1.05)}.btn:active,.btn[aria-pressed=true]:active{--lip-h:2px;transform:translateY(4px)}.btn:focus-visible{outline:3px solid var(--hh-cream);outline-offset:4px}.btn-warm{--face-top:#fbc98e;--face-bot:#f28a50;--rim:#e4643f;--lip:#a03f63;--outline:#3d1626}.btn-violet{--face-top:#c9b6e4;--face-bot:#9a80cc;--rim:#7e6bb0;--lip:#4b3a72;--outline:#1e1a2d}.btn-sm{--lip-h:4px;--ow:2.5px;text-shadow:0 1.5px 0 var(--outline), 1.5px 0 0 var(--outline), -1.5px 0 0 var(--outline), 0 -1.5px 0 var(--outline), 0 3px 0 var(--outline);border-radius:11px;padding:12px 14px 10px;font-size:14px}.btn-sm:before{width:16px;height:4px;top:4px;left:9px}.btn-sm:after{width:4px;height:4px;top:4px;left:28px}.btn-sm:active{--lip-h:1px;transform:translateY(3px)}.go{width:100%;margin-top:14px}.hud-goal{max-width:30ch;padding-left:12px;font-size:13.5px;font-weight:600;line-height:1.4;position:relative;margin-top:8px!important}.hud-goal:before{content:"";background:var(--accent);border-radius:2px;width:6px;height:6px;position:absolute;top:.5em;left:0;transform:rotate(45deg);box-shadow:0 0 8px #f9b36acc}.prompt{left:50%;bottom:max(28px, env(safe-area-inset-bottom,0px));pointer-events:none;background:var(--ink);border:1px solid var(--line);color:var(--text);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:999px;align-items:center;gap:10px;margin:0;padding:8px 16px 8px 8px;font-size:14.5px;font-weight:600;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 8px 24px #12121f4d}.prompt kbd{width:28px;height:26px;font:800 14px var(--font-ui);color:#fff7ea;text-shadow:0 1px #3d1626;background:linear-gradient(#fbc98e,#f28a50);border:2px solid #3d1626;border-radius:7px;place-items:center;margin-bottom:3px;display:grid;box-shadow:0 3px #a03f63,0 3px 0 2px #3d1626}.dialogue{left:50%;bottom:max(24px, env(safe-area-inset-bottom,0px));box-sizing:border-box;background:linear-gradient(var(--ink), var(--ink)) padding-box, linear-gradient(165deg, #f9b36a8c, #a03f634d 45%, #4b3a7233) border-box;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);cursor:pointer;border:1px solid #0000;border-radius:16px;width:min(680px,100% - 32px);padding:26px 24px 14px;position:fixed;transform:translate(-50%);box-shadow:0 16px 40px #12121f66}.speaker{font-family:var(--font-display);color:#fff7ea;text-shadow:0 1px #3d1626;background:linear-gradient(#fbc98e,#f28a50);border:2px solid #3d1626;border-radius:9px;margin:0;padding:4px 14px 6px;font-size:17px;font-weight:700;position:absolute;top:-14px;left:20px;box-shadow:0 3px #a03f63,0 3px 0 2px #3d1626}.speaker.player{text-shadow:0 1px #1e1a2d;background:linear-gradient(#c9b6e4,#9a80cc);border-color:#1e1a2d;box-shadow:0 3px #4b3a72,0 3px 0 2px #1e1a2d}.dlg-text{color:var(--text);min-height:3.2em;margin:0;font-size:17px;line-height:1.6}.dlg-hint{text-align:right;color:var(--muted);margin:8px 0 0;font-size:11.5px}.narration{cursor:pointer;background:#0d0c16;align-content:center;place-items:center;gap:18px;padding:24px;transition:opacity .9s;display:grid;position:fixed;inset:0}.narration.out{opacity:0;pointer-events:none}#narrLine{text-align:center;max-width:34ch;font-family:var(--font-display);color:var(--hh-cream);text-wrap:balance;opacity:0;margin:0;font-size:clamp(20px,2.6vw,28px);line-height:1.5;transition:opacity .8s,transform .8s;transform:translateY(6px)}#narrLine.show{opacity:1;transform:none}.narr-hint{text-align:center;color:#c9b6e48c;margin:0;font-size:12px;position:fixed;bottom:24px;left:0;right:0}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
