:root{font-family:Arial,Helvetica,sans-serif;color:#f4ead5;background:#101c18;color-scheme:dark;--gold:#d9b269;--muted:#b3b6a9;--forest:#101c18}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overscroll-behavior:none}body{overflow:hidden}button,input,summary{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;border-radius:5px;min-height:56px;color:var(--forest);font-weight:700;letter-spacing:.09em}button:focus-visible,a:focus-visible,summary:focus-visible,canvas:focus-visible{outline:3px solid #f4ead5;outline-offset:4px}button:disabled{opacity:.45;cursor:default}button:active{transform:translateY(1px)}[hidden]{display:none!important}#app{position:relative;width:100%;height:100%;height:100dvh;background:radial-gradient(ellipse at 50% 28%,#314234,#1d2d23,#101c18 80%)}#vessel{display:block;width:100%;height:100%;touch-action:none}#menu{position:absolute;inset:0;overflow-y:auto;overscroll-behavior:contain;background:radial-gradient(ellipse at 50% 18%,#314234,#101c18 75%);padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left))}.menu-inner{max-width:480px;margin:0 auto}.eyebrow{font-size:13px;letter-spacing:.35em;font-weight:700;color:var(--gold);text-align:center;margin:12px 0 16px}h1{font-family:Georgia,Times New Roman,serif;font-size:clamp(36px,9vw,52px);line-height:1.08;letter-spacing:.025em;text-align:center;margin:0}h1 em{font-style:normal;color:var(--gold);font-size:1.34em;letter-spacing:.12em}.intro{color:var(--muted);font-size:14px;line-height:1.6;text-align:center;max-width:300px;margin:20px auto 0}.role-preview{display:flex;height:clamp(190px,30dvh,270px);gap:28px;margin:26px 0 18px;align-items:center;justify-content:center}.role-preview canvas{height:100%;width:43%;max-width:190px}.roles{display:grid;grid-template-columns:1fr 1fr;gap:12px}.role-button{background:#d9b26914;border:1px solid rgba(217,178,105,.6);color:var(--gold);font-size:18px;min-height:70px}.role-button small{display:block;font-size:11px;color:var(--muted);font-weight:400;letter-spacing:0;margin-top:6px}.role-button[aria-pressed=true]{background:var(--gold);color:var(--forest)}.role-button[aria-pressed=true] small{color:#344034}#setup{padding-top:14px}.holding{font-size:15px;line-height:1.6;color:#f4ead5}.pairing{font-size:13px;line-height:1.55;color:var(--muted)}.notice{border-left:2px solid var(--gold);padding:6px 12px;color:var(--gold);font-size:13px;line-height:1.5}.check{font-size:14px;display:block;margin:18px 0}.check input{accent-color:var(--gold);width:18px;height:18px;vertical-align:middle;margin:0 8px 0 0}.check small{display:block;font-size:11px;color:var(--muted);padding:6px 0 0 30px;line-height:1.4}.volume-row{display:grid;grid-template-columns:130px 1fr;align-items:center;gap:12px;font-size:13px;min-height:42px}.volume-row input{width:100%;accent-color:var(--gold);min-height:32px}.primary{background:var(--gold);width:100%;margin-top:18px}.secondary{border:1px solid rgba(217,178,105,.5);color:var(--gold);background:transparent;width:100%;margin-top:10px}.small{font-size:11px;line-height:1.6;color:var(--muted)}.status{font-size:13px;line-height:1.55;text-align:center;color:var(--gold);min-height:20px}.credits{margin-top:30px;color:var(--muted);font-size:11px;line-height:1.6}.credits summary{padding:16px 0;cursor:pointer;color:var(--gold)}.credits a{color:var(--gold)}.cue,.toast{position:absolute;left:50%;transform:translate(-50%);margin:0;text-align:center;pointer-events:none;color:var(--gold);background:#101c18e6;padding:10px 16px;border-radius:5px;line-height:1.5;max-width:90%;width:max-content}.cue{top:max(16px,env(safe-area-inset-top));font-size:13px;font-weight:700;letter-spacing:.1em}.toast{bottom:max(26px,env(safe-area-inset-bottom));font-size:13px}.recovery{position:absolute;inset:0;z-index:4;display:grid;align-items:center;justify-content:center;padding:24px;background:#101c18e6;backdrop-filter:blur(8px)}.recovery>div{max-width:380px;width:100%}.recovery h2{font:32px Georgia,serif;line-height:1.2;text-align:center}.recovery p{font-size:14px;line-height:1.65;color:var(--muted)}.recovery .eyebrow{color:var(--gold);font-size:11px}.score{border-top:1px solid rgba(217,178,105,.25);padding:18px 0;margin-top:18px}.score h2{font:22px Georgia,serif;color:var(--gold);margin:0 0 10px}.score p{font-size:13px;line-height:1.6;margin:4px 0}.score strong{color:var(--gold)}.no-script{position:absolute;inset:10%;font-size:20px}@media(min-width:800px){.menu-inner{padding-top:20px}.role-preview{height:260px}}@media(prefers-reduced-motion:reduce){button:active{transform:none}}