:root{--ink-900: #090c11;--ink-850: #0d1117;--ink-800: #11161e;--ink-750: #161c26;--ink-700: #1d2531;--line: rgba(255, 255, 255, .07);--line-strong: rgba(255, 255, 255, .14);--text: #eaf0f7;--text-dim: #9aa8b8;--text-faint: #586575;--chalk: #c6ff45;--chalk-soft: rgba(198, 255, 69, .16);--amber: #ffc24b;--red: #ff5d6c;--home: #4a93ff;--away: #ff7a4d;--font-display: "Bricolage Grotesque", system-ui, sans-serif;--font-body: "Hanken Grotesk", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace;--radius: 14px;--radius-sm: 10px}*{box-sizing:border-box}button,select,input{touch-action:manipulation}html,body{margin:0;padding:0}body{font-family:var(--font-body);color:var(--text);background-color:var(--ink-900);background-image:radial-gradient(1100px 560px at 78% -12%,rgba(198,255,69,.07),transparent 60%),radial-gradient(900px 520px at 6% -6%,rgba(74,147,255,.08),transparent 58%);background-attachment:fixed;min-height:100vh;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(circle at 50% 30%,#000 0%,transparent 75%);mask-image:radial-gradient(circle at 50% 30%,#000 0%,transparent 75%);opacity:.5}.app{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:max(30px,env(safe-area-inset-top)) max(28px,env(safe-area-inset-right)) 60px max(28px,env(safe-area-inset-left))}.masthead{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px 20px;padding-bottom:18px;margin-bottom:22px;border-bottom:1px solid var(--line);animation:rise .6s cubic-bezier(.2,.7,.2,1) both}.modeswitch{display:inline-flex;padding:4px;gap:4px;background:var(--ink-800);border:1px solid var(--line);border-radius:999px}.modeswitch button{font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);background:transparent;border:none;padding:10px 16px;border-radius:999px;cursor:pointer;transition:color .15s ease,background .15s ease}.modeswitch button[data-active=true]{color:var(--ink-900);background:var(--chalk);font-weight:700}.modeswitch button:not([data-active=true]):hover{color:var(--text)}.board-mode{animation:rise .5s cubic-bezier(.2,.7,.2,1) .06s both}.app--board{height:100vh;display:flex;flex-direction:column;overflow:hidden;padding-top:max(18px,env(safe-area-inset-top));padding-bottom:max(14px,env(safe-area-inset-bottom))}@supports (height: 100dvh){.app--board{height:100dvh}}.app--board .masthead{flex:0 0 auto;margin-bottom:12px;padding-bottom:12px}.app--board .wordmark__title{font-size:20px}.app--board .board-mode{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}.app--board .brief{flex:0 0 auto;margin-bottom:10px}.app--board .panel__title{font-size:19px}.app--board .brief .panel__summary{font-size:12.5px;line-height:1.4;margin:4px 0 0}.app--board .boardbar{flex:0 0 auto;margin-bottom:10px}.app--board .board{flex:1 1 auto;min-height:0;max-width:none;margin:0;border:none;box-shadow:none;border-radius:0}.app--board .board svg{width:100%;height:100%}.boardbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-bottom:16px}.formpick{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim)}.formpick__dot{width:9px;height:9px;border-radius:50%}.formpick select{font-family:var(--font-mono);font-size:13px;color:var(--text);background:var(--ink-800);border:1px solid var(--line-strong);border-radius:8px;padding:6px 10px;cursor:pointer}.formpick select:focus{outline:none;border-color:var(--chalk)}.reset-btn{margin-left:auto;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--text);background:var(--ink-800);border:1px solid var(--line-strong);border-radius:8px;padding:8px 14px;cursor:pointer;transition:border-color .15s ease,color .15s ease}.reset-btn:hover{border-color:var(--chalk);color:var(--chalk)}.field--draggable{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.field--draggable text{user-select:none;-webkit-user-select:none}.token{-webkit-tap-highlight-color:transparent}.masthead__left{display:flex;align-items:center;gap:16px}.masthead__right{display:flex;align-items:center;gap:12px}.menu-toggle{flex:0 0 auto;width:44px;height:44px;border-radius:var(--radius-sm);border:1px solid var(--line-strong);background:var(--ink-800);color:var(--text);display:grid;place-items:center;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .12s ease}.menu-toggle:hover{border-color:var(--chalk);color:var(--chalk);transform:translateY(-1px)}.menu-toggle svg{width:20px;height:20px}.wordmark{display:flex;align-items:center;gap:12px}.wordmark__dot{width:12px;height:12px;border-radius:50%;background:var(--chalk);box-shadow:0 0 14px 2px var(--chalk-soft);animation:pulse 2.4s ease-in-out infinite}.wordmark__title{font-family:var(--font-display);font-weight:800;font-size:clamp(22px,3vw,32px);letter-spacing:-.02em;line-height:1;margin:0}.wordmark__title em{font-style:normal;color:var(--chalk)}.eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--text-faint)}.masthead__meta{text-align:right;display:grid;gap:4px}.scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#04060999;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:fade .25s ease both}.sidebar{position:fixed;top:0;left:0;bottom:0;width:min(320px,86vw);z-index:50;background:linear-gradient(180deg,var(--ink-850),var(--ink-900));border-right:1px solid var(--line-strong);box-shadow:40px 0 80px -40px #000000e6;transform:translate(-105%);transition:transform .32s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;padding:20px 16px}.sidebar.open{transform:translate(0)}.sidebar__head{display:flex;align-items:center;justify-content:space-between;padding:0 4px 16px;margin-bottom:12px;border-bottom:1px solid var(--line)}.sidebar__list{display:flex;flex-direction:column;gap:10px;overflow-y:auto;scrollbar-width:thin}.settings-drawer{position:fixed;top:0;right:0;bottom:0;width:min(340px,88vw);z-index:50;background:linear-gradient(180deg,var(--ink-850),var(--ink-900));border-left:1px solid var(--line-strong);box-shadow:-40px 0 80px -40px #000000e6;transform:translate(105%);transition:transform .32s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;padding:20px 16px}.settings-drawer.open{transform:translate(0)}.settings-section{padding-top:6px}.settings-section__label{font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-faint);padding:0 4px 8px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 4px;border-bottom:1px solid var(--line);font-size:14.5px;color:var(--text);cursor:pointer}.setting-row--static{cursor:default}.seg{display:inline-flex;padding:3px;gap:3px;background:var(--ink-700);border:1px solid var(--line);border-radius:8px}.seg button{font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;color:var(--text-dim);background:transparent;border:none;padding:8px 14px;border-radius:6px;cursor:pointer;transition:color .15s ease,background .15s ease}.seg button[data-active=true]{background:var(--chalk);color:var(--ink-900);font-weight:700}.seg button:not([data-active=true]):hover{color:var(--text)}.toggle{position:relative;flex:0 0 auto;width:44px;height:24px}.toggle input{position:absolute;opacity:0;width:0;height:0}.toggle__slider{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:999px;background:var(--ink-700);border:1px solid var(--line-strong);transition:.2s ease}.toggle__slider:before{content:"";position:absolute;width:18px;height:18px;left:2px;top:50%;transform:translateY(-50%);border-radius:50%;background:var(--text-dim);transition:.2s ease}.toggle input:checked+.toggle__slider{background:var(--chalk-soft);border-color:var(--chalk)}.toggle input:checked+.toggle__slider:before{transform:translate(20px,-50%);background:var(--chalk)}.icon-btn{width:40px;height:40px;border-radius:8px;border:1px solid var(--line);background:transparent;color:var(--text-dim);display:grid;place-items:center;cursor:pointer;transition:color .15s ease,border-color .15s ease}.icon-btn:hover{color:var(--text);border-color:var(--line-strong)}.icon-btn svg{width:18px;height:18px}.scenario-card{width:100%;text-align:left;padding:13px 15px;border-radius:var(--radius-sm);border:1px solid var(--line);background:linear-gradient(180deg,var(--ink-800),var(--ink-850));color:var(--text);cursor:pointer;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.scenario-card:hover{transform:translate(3px);border-color:var(--line-strong)}.scenario-card[data-active=true]{border-color:var(--chalk);box-shadow:0 0 0 1px var(--chalk),0 8px 30px -12px var(--chalk-soft);background:linear-gradient(180deg,rgba(198,255,69,.08),var(--ink-850))}.scenario-card__level{font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--chalk);display:block;margin-bottom:5px}.scenario-card__title{font-family:var(--font-display);font-weight:600;font-size:15px;line-height:1.15;letter-spacing:-.01em;display:block}.brief{margin-bottom:18px;animation:rise .6s cubic-bezier(.2,.7,.2,1) .06s both}.brief__head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}.brief .panel__summary{max-width:70ch}.board{animation:rise .6s cubic-bezier(.2,.7,.2,1) .12s both;position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line-strong);box-shadow:0 30px 60px -30px #000c,0 0 0 1px #0006,inset 0 1px #ffffff0d;max-width:min(100%,100vh);margin-inline:auto}.board svg{display:block;width:100%}.transport{max-width:min(100%,100vh);margin-inline:auto}@supports (height: 100dvh){.board,.transport{max-width:min(100%,100dvh)}}.transport{display:flex;align-items:center;flex-wrap:wrap;gap:14px 16px;margin-top:16px}.play-btn{flex:0 0 auto;width:50px;height:50px;border-radius:50%;border:none;display:grid;place-items:center;background:var(--chalk);color:var(--ink-900);cursor:pointer;transition:transform .15s ease,box-shadow .2s ease;box-shadow:0 0 0 0 var(--chalk-soft)}.play-btn:hover{transform:scale(1.06);box-shadow:0 0 24px 2px var(--chalk-soft)}.play-btn svg{width:20px;height:20px}.scrubber{position:relative;flex:1;min-width:180px;height:26px;display:flex;align-items:center}.scrubber__track{position:absolute;right:0;bottom:0;left:0;top:50%;transform:translateY(-50%);height:6px;border-radius:999px;background:var(--ink-700);pointer-events:none}.scrubber__fill{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:linear-gradient(90deg,rgba(198,255,69,.5),var(--chalk))}.scrubber__tick{position:absolute;top:50%;width:2px;height:12px;transform:translate(-50%,-50%);background:var(--line-strong);border-radius:2px}.scrubber__head{position:absolute;top:50%;width:14px;height:14px;border-radius:50%;transform:translate(-50%,-50%);background:#fff;box-shadow:0 0 0 3px #c6ff454d,0 0 16px 2px var(--chalk-soft);pointer-events:none}.scrubber input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;margin:0;opacity:0;cursor:pointer}.timecode{flex:0 0 auto;font-family:var(--font-mono);font-size:13px;color:var(--text-dim);letter-spacing:.02em;font-variant-numeric:tabular-nums}.timecode b{color:var(--text)}.possession{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;color:var(--text-dim);text-transform:uppercase;white-space:nowrap}.possession__dot{width:9px;height:9px;border-radius:50%}.panel{animation:rise .6s cubic-bezier(.2,.7,.2,1) .18s both}.panel__title{font-family:var(--font-display);font-weight:700;font-size:clamp(20px,2.4vw,26px);line-height:1.08;letter-spacing:-.02em;margin:0 0 8px}.panel__summary{color:var(--text-dim);font-size:14.5px;line-height:1.5;margin:0 0 16px}.tags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px}.tag{font-family:var(--font-mono);font-size:11px;letter-spacing:.03em;color:var(--chalk);background:var(--chalk-soft);border:1px solid rgba(198,255,69,.22);border-radius:999px;padding:3px 10px}.readout{margin-top:22px;max-width:880px;animation:rise .6s cubic-bezier(.2,.7,.2,1) .18s both}.caption{position:relative;background:linear-gradient(180deg,var(--ink-800),var(--ink-850));border:1px solid var(--line);border-left:3px solid var(--chalk);border-radius:var(--radius-sm);padding:15px 16px 16px;min-height:96px;overflow:hidden}.caption__label{font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-faint);display:flex;align-items:center;gap:7px;margin-bottom:8px}.caption__label:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--chalk);box-shadow:0 0 10px 1px var(--chalk-soft)}.caption__body{font-size:16px;line-height:1.45;color:var(--text);animation:capIn .45s cubic-bezier(.2,.7,.2,1) both}.decision{margin-top:16px;background:linear-gradient(180deg,rgba(255,194,75,.08),var(--ink-850));border:1px solid rgba(255,194,75,.3);border-radius:var(--radius-sm);padding:15px 16px;animation:capIn .4s ease both}.decision__prompt{font-family:var(--font-display);font-weight:600;font-size:15px;margin-bottom:11px;color:var(--amber)}.option{display:block;width:100%;text-align:left;margin:7px 0;padding:10px 12px;border-radius:var(--radius-sm);border:1px solid var(--line-strong);background:var(--ink-800);color:var(--text);font-family:var(--font-body);font-size:14px;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .12s ease}.option:hover{transform:translate(3px);border-color:var(--amber)}.option[data-chosen=true]{border-color:var(--amber);background:#ffc24b1a}.option__outcome{margin-top:9px;font-size:13.5px;line-height:1.45;color:var(--text-dim);border-top:1px dashed var(--line-strong);padding-top:9px;animation:capIn .35s ease both}@keyframes rise{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes capIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes fade{0%{opacity:0}to{opacity:1}}@keyframes pulse{0%,to{box-shadow:0 0 14px 2px var(--chalk-soft);opacity:1}50%{box-shadow:0 0 22px 5px var(--chalk-soft);opacity:.8}}
