:root{color-scheme:light dark;--bg:#eff2ef;--text:#202c29;--muted:#50615a;--line:#c0cdc5;--accent:#21604b;--accent-text:#f4f7f4;--panel:#e1e8e2;--focus:#12563f}
@media(prefers-color-scheme:dark){:root{--bg:#111b18;--text:#e4ece5;--muted:#afc2b7;--line:#3d5248;--accent:#a4d0b3;--accent-text:#15281e;--panel:#1c2b23;--focus:#d4f6df}}
*{box-sizing:border-box}html{scroll-padding-top:24px}body{margin:0;background:var(--bg);color:var(--text);font:17px/1.55 "Segoe UI",Arial,sans-serif}a{color:inherit;text-underline-offset:4px}header,main,footer{width:min(1248px,calc(100% - 64px));margin-inline:auto}header{height:80px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:28px;font-weight:800;letter-spacing:-1px;text-decoration:none}nav{display:flex;gap:28px;font-size:14px}nav a{text-decoration:none}nav a:hover{text-decoration:underline}.hero{display:grid;grid-template-columns:.8fr 1.2fr;gap:58px;align-items:center;min-height:570px;padding:48px 0 60px}.hero h1{font-size:clamp(48px,5.5vw,76px);line-height:1.02;letter-spacing:-3px;font-weight:650;margin:0 0 26px}.hero p{max-width:350px;color:var(--muted);margin:0 0 28px;font-size:19px}.button,button{background:var(--accent);color:var(--accent-text);padding:12px 18px;min-height:44px;border:1px solid transparent;border-radius:4px;font:600 15px/1.3 "Segoe UI",sans-serif;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:10px;white-space:nowrap}.button:hover,button:hover{filter:brightness(.93)}button:disabled{cursor:default;opacity:.55}a:focus-visible,button:focus-visible,summary:focus-visible,canvas:focus-visible{outline:3px solid var(--focus);outline-offset:4px}figure{margin:0}figure img{width:100%;height:auto;display:block;border:1px solid var(--line);border-radius:4px}figcaption{font-size:13px;color:var(--muted);margin-top:12px}.play-section{padding:60px 0 76px;border-top:1px solid var(--line)}h2{font-size:clamp(28px,3vw,40px);font-weight:600;line-height:1.16;letter-spacing:-1px;margin:0 0 20px}.play-heading{max-width:640px;margin-bottom:32px}.play-heading p{color:var(--muted)}.play-layout{display:grid;grid-template-columns:minmax(280px,480px) minmax(300px,1fr);gap:70px;align-items:start}.wall-wrap{background:#15221d;border-radius:4px;overflow:hidden}.wall-wrap canvas{width:100%;height:auto;aspect-ratio:2/3;display:block;touch-action:pan-y}.wall-status{display:flex;justify-content:space-between;gap:12px;background:#1e3228;color:#deede1;padding:12px 16px;font:13px/1.3 Consolas,monospace}.controls{padding-top:8px;max-width:480px}h3{font-size:24px;line-height:1.25;margin:0 0 16px}h4{font-size:15px;margin:30px 0 12px}.controls p{color:var(--muted)}.hands{display:flex;gap:10px;margin-top:25px}.hands button{background:transparent;color:var(--text);border-color:var(--line);flex:1}.hands button[aria-pressed=true]{border-color:var(--accent);background:var(--accent);color:var(--accent-text)}kbd{font:12px/1.4 Consolas,monospace;opacity:.8}.hand-note{font-size:13px}.hold-buttons{display:flex;flex-wrap:wrap;gap:10px;min-height:48px}.hold-buttons button{min-width:48px;background:var(--panel);color:var(--text);border-color:var(--line)}.message{min-height:54px;font-size:15px}.actions{display:flex;flex-wrap:wrap;gap:12px;margin:25px 0}.actions button{background:transparent;border-color:var(--line);color:var(--text)}details{margin-top:30px;font-size:14px}summary{cursor:pointer}.research{padding:70px 0 80px;border-top:1px solid var(--line)}.research-copy{display:grid;grid-template-columns:1fr 1fr;gap:70px;max-width:1040px}.research-copy p{color:var(--muted);margin:0 0 20px}footer{display:flex;justify-content:space-between;gap:24px;border-top:1px solid var(--line);padding:24px 0 40px;font-size:14px;color:var(--muted)}@media(max-width:767px){header,main,footer{width:calc(100% - 32px)}header{height:70px}nav{gap:16px;font-size:12px}.hero{grid-template-columns:1fr;gap:32px;padding:30px 0 44px;min-height:0}.hero h1{font-size:50px}.hero p{font-size:17px;max-width:360px}.play-layout{grid-template-columns:1fr;gap:28px}.wall-wrap{max-width:440px;width:100%;margin:auto}.controls{max-width:none}.research-copy{grid-template-columns:1fr;gap:8px}.research,.play-section{padding:42px 0}.research h2{max-width:350px}footer{flex-wrap:wrap}.wall-status{font-size:12px}}
