:root{--bg: #0d1117;--panel: #161b22;--panel-2: #1f2630;--ink: #e8edf2;--muted: #8b97a6;--accent: #ffd23f;--accent-2: #2ecc71;--danger: #ff5a5a;--home: #c0392b;--away: #2c3e90;--font: "Arial Black", "Helvetica Neue", Arial, sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;width:100%;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif;overflow:hidden}button{font-family:inherit;cursor:pointer}.menu{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:radial-gradient(120% 80% at 50% -10%,#1d2b45 0%,var(--bg) 60%),repeating-linear-gradient(135deg,transparent 0 22px,rgba(255,255,255,.015) 22px 44px);text-align:center;padding:24px}.menu-mark{width:84px;height:84px;display:grid;place-items:center;font:900 36px/1 var(--font);color:#111;background:var(--accent);transform:skew(-8deg);box-shadow:6px 6px #0005;letter-spacing:-2px}.menu-title{font:900 clamp(34px,7vw,72px)/.9 var(--font);letter-spacing:-2px;margin:6px 0 0;text-transform:uppercase}.menu-title span{color:var(--accent);display:inline-block;padding:0 6px}.menu-sub{color:var(--muted);letter-spacing:3px;text-transform:uppercase;font-size:12px;margin:0}.menu-warn{color:#111;background:var(--accent);padding:8px 12px;font-size:13px;max-width:520px}.menu-nav{display:flex;flex-direction:column;gap:10px;margin-top:14px;width:min(320px,80vw)}.menu-item{display:block;text-decoration:none;color:var(--ink);background:var(--panel-2);border-left:6px solid var(--muted);padding:14px 18px;font:800 18px/1 var(--font);text-transform:uppercase;letter-spacing:1px;transition:transform .08s,background .15s,border-color .15s}.menu-item:hover{transform:translate(4px);background:#29323d;border-color:var(--accent)}.menu-item.primary{background:var(--away);border-color:var(--accent)}.menu-foot{color:var(--muted);font-size:12px;margin-top:18px}.btn,.btn-sm{border:none;color:var(--ink);background:var(--panel-2);padding:12px 18px;font-weight:800;text-transform:uppercase;letter-spacing:1px;text-decoration:none;display:inline-block;border-radius:2px}.btn{width:240px;margin:6px 0;text-align:center}.btn:hover,.btn-sm:hover{background:#2c3744}.btn-primary{background:var(--away)}.btn-ghost{background:transparent;outline:1px solid var(--muted)}.btn-sm{padding:7px 11px;font-size:12px}.btn-sm:disabled{opacity:.4;cursor:default}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:#05080cb8;z-index:30}.panel{background:var(--panel);padding:28px 34px;min-width:300px;display:flex;flex-direction:column;align-items:center;border-top:5px solid var(--accent);box-shadow:0 20px 60px #000a}.panel h2{font:900 26px var(--font);text-transform:uppercase;margin:0 0 14px;letter-spacing:1px}.hint{color:var(--muted);font-size:12px;margin-top:8px}.result-score{font:900 40px var(--font);margin:8px 0}.result-line{color:var(--accent);text-transform:uppercase;letter-spacing:2px;margin-bottom:12px}.game-screen{position:absolute;inset:0}.game-screen canvas{display:block}.hud{position:absolute;inset:0;pointer-events:none;z-index:10}.scoreboard{position:absolute;top:16px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;background:#0a0e14d1;padding:8px 14px;border-radius:3px;font:800 20px var(--font);letter-spacing:1px;border:1px solid #2c3744}.sb-team{padding:2px 8px}.sb-home{background:var(--home)}.sb-away{background:var(--away)}.sb-score{min-width:28px;text-align:center}.sb-clock{font-size:15px;color:var(--accent)}.sb-clock small{color:var(--muted);font-size:11px}.hud-bottom{position:absolute;left:18px;bottom:18px}.hud-player{background:#0a0e14d1;padding:6px 12px;font:800 14px var(--font);text-transform:uppercase;letter-spacing:1px;border-left:4px solid var(--accent)}.shot-bar{margin-top:6px;width:160px;height:10px;background:#0008;border:1px solid #2c3744}.shot-bar-fill{height:100%;background:linear-gradient(90deg,var(--accent-2),var(--accent),var(--danger))}.hud-note{position:absolute;right:14px;bottom:14px;color:var(--muted);font-size:11px;letter-spacing:1px;text-transform:uppercase}.input-probe{position:absolute;left:50%;bottom:14px;transform:translate(-50%);display:flex;gap:12px;align-items:center;z-index:25;pointer-events:none;background:#080b10e6;border:1px solid #2c3744;padding:6px 12px;font:700 13px/1 Consolas,monospace;color:var(--muted);border-radius:3px}.input-probe b{color:var(--ink)}.input-probe .on{color:var(--accent-2)}.input-probe .off{color:var(--danger)}.debug{position:absolute;top:12px;left:12px;z-index:20;pointer-events:auto}.debug-toggle{background:#0a0e14d9;color:var(--ink);border:1px solid #2c3744;padding:5px 9px;font-size:12px}.debug-body{margin-top:6px;background:#0a0e14eb;border:1px solid #2c3744;padding:10px;width:230px}.debug-grid{display:grid;grid-template-columns:1fr auto;gap:2px 8px;font-size:12px}.debug-grid b{color:var(--accent)}.debug-row{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;font-size:12px;align-items:center}.editor{position:absolute;inset:0;display:flex;flex-direction:column}.editor-toolbar{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--panel);border-bottom:1px solid #2c3744;flex-wrap:wrap}.editor-title{font:800 14px var(--font);text-transform:uppercase;letter-spacing:1px}.editor-schema{color:var(--muted);font-size:11px}.spacer{flex:1}.editor-banner{padding:8px 12px;font-size:13px;cursor:pointer}.editor-banner.is-error{background:var(--danger);color:#160000}.editor-banner.is-ok{background:var(--accent-2);color:#04210f}.editor-body{flex:1;display:grid;grid-template-columns:150px 1fr 300px;min-height:0}.editor-categories{background:var(--panel);border-right:1px solid #2c3744;display:flex;flex-direction:column;padding:8px;gap:4px;overflow:auto}.editor-categories button{background:transparent;color:var(--ink);border:none;text-align:left;padding:10px 12px;font:800 13px var(--font);text-transform:uppercase;letter-spacing:1px;border-left:4px solid transparent}.editor-categories button.active{background:var(--panel-2);border-left-color:var(--accent)}.editor-categories button.future{color:var(--muted);opacity:.6;cursor:default}.editor-cat-future{color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:1px;margin:12px 0 2px 8px}.editor-center{position:relative;min-width:0;background:#05080c}.editor-preview{position:absolute;inset:0}.editor-preview canvas{display:block}.editor-inspector{background:var(--panel);border-left:1px solid #2c3744;overflow-y:auto;padding:12px}.panel-section{margin-bottom:18px}.panel-section h3{font:800 12px var(--font);text-transform:uppercase;letter-spacing:1px;color:var(--accent);margin:14px 0 8px;border-bottom:1px solid #2c3744;padding-bottom:4px}.ctl{display:flex;flex-direction:column;gap:4px;margin-bottom:9px}.ctl-inline{flex-direction:row;align-items:center;justify-content:space-between}.ctl-label{font-size:12px;color:var(--muted);display:flex;justify-content:space-between}.ctl-label em{color:var(--ink);font-style:normal;font-weight:700}.ctl input[type=range]{width:100%;accent-color:var(--accent)}.ctl input[type=text]{background:var(--panel-2);border:1px solid #2c3744;color:var(--ink);padding:4px 6px;width:150px}.ctl select{background:var(--panel-2);border:1px solid #2c3744;color:var(--ink);padding:4px}.ctl input[type=color]{width:44px;height:26px;border:1px solid #2c3744;background:none}.settings{position:absolute;inset:0;overflow:auto;padding:0 0 40px}.settings-head{display:flex;align-items:center;gap:14px;padding:14px 20px;background:var(--panel);border-bottom:1px solid #2c3744}.settings-head h2{font:900 22px var(--font);text-transform:uppercase;margin:0}.settings-section{max-width:640px;margin:18px auto;padding:0 20px}.settings-section h3{font:800 13px var(--font);text-transform:uppercase;letter-spacing:1px;color:var(--accent)}.settings .row{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:14px}.muted{color:var(--muted);font-size:12px}.controls-table{width:100%;border-collapse:collapse;font-size:14px}.controls-table td{padding:6px 8px;border-bottom:1px solid #2c3744}.controls-table td:first-child{color:var(--accent);font-weight:700;width:160px}