:root{--bg: #07080d;--ink: #10141c;--panel: #171d2b;--brass: #d7b56a;--brass-deep: #8a6230;--teal: #3ee0c5;--magenta: #ff3d7a;--cream: #f6f0e4;--steel: #8d97a8;--danger: #ff5a3c;color-scheme:dark;font-family:Avenir Next,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;background:var(--bg);color:var(--cream);overflow:hidden;position:fixed;top:0;right:0;bottom:0;left:0;width:100%;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}button,input{font:inherit;color:inherit}.shell{height:100dvh;display:flex;justify-content:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.cabinet{width:min(480px,100%);height:100%;display:flex;flex-direction:column;position:relative;background:radial-gradient(120% 70% at 50% -10%,#3a3122 0%,transparent 42%),linear-gradient(180deg,#242018,#12151c 28%,#0b0d12);box-shadow:inset 0 0 0 2px var(--brass),inset 0 0 0 10px #1a140c}.cabinet:before,.cabinet:after{content:"";position:absolute;top:18px;bottom:18px;width:8px;border-radius:8px;pointer-events:none}.cabinet:before{left:6px;background:linear-gradient(#3ee0c5,transparent 80%);opacity:.45}.cabinet:after{right:6px;background:linear-gradient(#ff3d7a,transparent 80%);opacity:.4}.marquee{text-align:center;padding:12px 16px 4px}.marquee h1{margin:0;font-family:Impact,Arial Narrow,sans-serif;font-weight:400;letter-spacing:.14em;font-size:clamp(28px,8vw,46px);text-shadow:0 0 16px rgba(62,224,197,.45)}.marquee p{margin:2px 0 0;letter-spacing:.22em;font-size:11px;color:var(--brass)}.glass{flex:1;min-height:220px;margin:8px 16px 0;border-radius:18px;overflow:hidden;position:relative;background:#090c14;box-shadow:inset 0 0 0 2px #d7b56a8c,0 16px 30px #00000059}.hud{display:flex;justify-content:space-between;gap:8px;padding:8px 18px 0;font-family:Impact,Arial Narrow,sans-serif;letter-spacing:.06em;font-size:15px}.hud b{color:var(--brass);font-weight:400}.deck{display:grid;grid-template-columns:1fr 1fr;align-items:center;justify-items:center;gap:8px;padding:8px 12px 10px;min-height:128px}.joy,.up{width:min(128px,36vw);height:min(128px,36vw);min-width:96px;min-height:96px;border-radius:50%;touch-action:none}.joy{position:relative;background:radial-gradient(circle at 50% 40%,#2a3142,#12151c 70%);box-shadow:inset 0 0 0 3px #3a2a16,0 8px #07080c}.knob{position:absolute;left:50%;top:50%;width:46%;height:46%;margin:-23% 0 0 -23%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f0d7a0,#8a6230 72%);box-shadow:0 6px #3a2a14}.up{border:0;background:radial-gradient(circle at 50% 35%,#ff7a9a,var(--magenta) 55%,#8d1638);color:#fff;font-family:Impact,Arial Narrow,sans-serif;font-size:28px;letter-spacing:.08em;box-shadow:0 8px #5c1028,0 0 24px #ff3d7a59}.up.is-down{transform:translateY(4px);box-shadow:0 3px #5c1028}.keys{display:none;text-align:center;color:var(--steel);font-size:12px;padding-bottom:8px}@media (pointer: fine) and (min-width: 800px){.keys{display:block}}.sheet{display:flex;flex-direction:column;gap:8px;padding:8px 16px 12px}.sheet.scroll,.sheet.scroll.sheet{flex:1;min-height:0;overflow-y:auto;touch-action:pan-y;padding-bottom:28px}.cabinet.training .glass{flex:0 0 168px;min-height:140px}.ms{display:grid;grid-template-columns:44px minmax(0,1fr) auto 44px;gap:6px;align-items:center}.ms input[type=range]{grid-column:1 / -1;min-height:36px;width:100%}details.fold{border-radius:12px;background:#ffffff08;padding:4px 10px 8px}details.fold summary{min-height:44px;display:flex;align-items:center;color:var(--brass);letter-spacing:.06em}.note-box,video{width:100%;min-height:72px;border-radius:10px;border:1px solid #3a4256;background:#0d1018;padding:8px;touch-action:manipulation}.analysis{white-space:pre-wrap}.bars{display:flex;align-items:flex-end;gap:4px;height:72px}.bars i{display:block;width:12px;min-height:4px;background:var(--teal);border-radius:3px 3px 0 0}.file-btn{position:relative;overflow:hidden;display:grid;place-items:center}.file-btn input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0}.btn,.btn-ghost{min-height:48px;border-radius:12px;border:1px solid var(--brass);background:linear-gradient(#222838,#141924);color:var(--cream);letter-spacing:.08em;font-family:Impact,Arial Narrow,sans-serif;font-size:18px}.btn:active,.btn-ghost:active{transform:translateY(1px)}.btn.primary{background:linear-gradient(#1c4f49,#12332f);border-color:var(--teal)}.btn-ghost{background:transparent;min-height:44px;font-size:15px}.field{display:flex;flex-direction:column;gap:4px;font-size:13px;letter-spacing:.06em;color:var(--brass)}.field input,.field select{min-height:48px;border-radius:10px;border:1px solid #3a4256;background:#0d1018;padding:0 12px;touch-action:manipulation}.row{display:flex;gap:8px}.row>*{flex:1}.code{font-family:Impact,sans-serif;font-size:40px;letter-spacing:.24em;text-align:center;margin:0;color:var(--teal)}.note,.problem,.coach{margin:0;font-size:14px;line-height:1.35;color:var(--steel)}.problem{color:var(--danger)}.coach{margin:0 16px;padding:8px 10px;border-radius:10px;background:#3ee0c514;box-shadow:inset 0 0 0 1px #3ee0c559;color:var(--cream)}.players{display:grid;gap:6px}.player{display:flex;justify-content:space-between;padding:8px 10px;border-radius:10px;background:#ffffff08;border:1px solid #2a3142}.player.on{border-color:var(--teal)}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#07080d8c;display:grid;place-items:center;font-family:Impact,sans-serif;letter-spacing:.18em}.toggle{display:flex;align-items:center;justify-content:space-between;min-height:44px;gap:12px}.update{position:absolute;left:16px;right:16px;bottom:calc(12px + env(safe-area-inset-bottom))}@media (max-height: 680px){.marquee{padding:6px 10px 0}.marquee h1{font-size:26px}.btn{min-height:44px;font-size:16px}.sheet{gap:6px}.deck{min-height:108px}.joy,.up{min-width:84px;min-height:84px}}@media (min-width: 900px){.cabinet{height:min(100%,980px);margin:auto;border-radius:28px}}