:root{color:#162033;background:#eef2f1;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:360px}button,input,textarea,select{font:inherit}button{border:1px solid #b6c2cf;border-radius:6px;background:#fff;color:#162033;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}.app-shell{min-height:100vh;display:flex;flex-direction:column}.board-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;background:#f8fafc;border-bottom:1px solid #d9e2ea}.board-toolbar h1{margin:0;font-size:20px;line-height:1.2}.board-toolbar p{margin:3px 0 0;color:#627084;font-size:13px}.toolbar-actions{display:flex;flex-wrap:wrap;gap:8px}.toolbar-actions button{min-height:36px;padding:0 12px}.trajectory-distance-control{display:inline-flex;align-items:center;min-height:36px;border:1px solid #b6c2cf;border-radius:6px;background:#fff;color:#46556a;font-size:12px;font-weight:900;overflow:hidden}.trajectory-distance-control button{min-width:32px;min-height:34px;padding:0;border:0;border-radius:0;background:#f8fafc}.trajectory-distance-control span{padding:0 9px;white-space:nowrap}.history-position{display:inline-flex;align-items:center;min-height:36px;padding:0 8px;color:#46556a;font-size:12px;font-weight:800;white-space:nowrap}.timeline-import-input{display:none}.replay-app-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:#e9eef4}.replay-import-panel{width:min(100%,520px);display:grid;gap:14px;padding:22px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;box-shadow:0 18px 45px #09142629}.replay-app-kicker{margin:0;color:#46556a;font-size:12px;font-weight:900;letter-spacing:0;text-transform:uppercase}.replay-import-panel h1{margin:0;font-size:28px;line-height:1.15}.replay-import-panel p{margin:0;color:#46556a;line-height:1.5}.replay-import-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.replay-import-actions button{min-height:38px;padding:0 14px;border-color:#155eef;background:#eaf1ff;color:#123c9c;font-weight:900}.replay-import-actions span{color:#46556a;font-size:12px;font-weight:800}.replay-import-error{color:#b42318;font-weight:800}.pause-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;display:grid;place-items:center;padding:18px;background:#0f172aad}.pause-menu{width:min(100%,960px);max-height:100%;display:grid;gap:14px;padding:16px;overflow:auto;border:1px solid #cbd5e1;border-radius:8px;background:#f8fafc;box-shadow:0 22px 60px #00000057}.pause-menu-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.pause-menu-header p{margin:0;color:#46556a;font-size:12px;font-weight:900;letter-spacing:0;text-transform:uppercase}.pause-menu-header h2{margin:2px 0 0;font-size:24px}.pause-menu-header button{min-height:36px;padding:0 14px;border-color:#155eef;background:#eaf1ff;color:#123c9c;font-weight:900}.pause-menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.pause-panel{min-width:0;display:grid;align-content:start;gap:10px;padding:12px;border:1px solid #d3dde7;border-radius:8px;background:#fff}.pause-panel h3{margin:0;font-size:17px}.pause-panel label{display:grid;gap:5px;color:#46556a;font-size:12px;font-weight:800}.pause-panel input,.pause-panel textarea{width:100%;border:1px solid #bbc7d4;border-radius:6px;padding:8px 9px;color:#162033;background:#fff;font-weight:500}.pause-panel textarea{resize:vertical}.pause-actions,.folder-file-list-header{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.pause-actions button,.folder-file-list button{min-height:30px;padding:0 9px;font-size:12px;font-weight:800}.folder-status{display:grid;gap:2px;padding:7px 8px;border-radius:6px;background:#eef2f7}.folder-status span,.folder-file-list-header span,.folder-file-row span{color:#627084;font-size:11px;font-weight:800}.folder-status strong,.folder-file-row strong{overflow-wrap:anywhere;color:#162033;font-size:12px}.folder-file-list{display:grid;gap:7px;max-height:260px;overflow:auto}.folder-file-list-header{justify-content:space-between}.folder-file-list p{margin:0;color:#627084;font-size:12px;font-weight:700}.folder-file-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;padding:8px;border:1px solid #d9e2ea;border-radius:6px;background:#f8fafc}.folder-file-row div{min-width:0;display:grid;gap:2px}.pause-status,.pause-error{margin:0;font-size:13px;font-weight:800}.pause-status{color:#256f45}.pause-error{color:#b42318}.replay-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;padding:18px;background:#0f172ab8}.replay-modal{min-width:0;max-height:100%;display:grid;grid-template-rows:auto auto auto auto minmax(0,1fr);gap:10px;padding:14px;overflow:auto;border:1px solid #cbd5e1;border-radius:8px;background:#f8fafc;box-shadow:0 22px 60px #0000005c}.replay-header,.replay-controls,.replay-context-strip{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.replay-header{justify-content:space-between}.replay-header h2{margin:0;font-size:20px}.replay-header p{margin:2px 0 0;color:#46556a;font-size:13px;font-weight:700}.replay-controls button{min-height:32px;padding:0 10px;font-size:12px;font-weight:800}.replay-position{color:#243044;font-size:12px;font-weight:900}.replay-context-strip{color:#334155;font-size:12px;font-weight:800}.replay-context-strip span{padding:4px 7px;border:1px solid #cbd5e1;border-radius:6px;background:#fff}.replay-beat-role.action{border-color:#b7791f;background:#fff3bf;color:#7c4a03}.replay-empty{margin:0;color:#46556a;font-size:13px;font-weight:700}.replay-board{min-width:0}.replay-board .pitch-scroll{max-height:none}.replay-board .player-piece,.replay-board .ball-token,.replay-board .momentum-marker{pointer-events:none}.match-flow-tracker{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:10px 18px;border-bottom:1px solid #d9e2ea;background:#fff}.match-flow-turn,.match-flow-turn-type,.match-flow-beats,.match-flow-initiative,.match-flow-pip-control{display:inline-flex;align-items:center;gap:6px}.match-flow-label{color:#46556a;font-size:11px;font-weight:900;letter-spacing:0;text-transform:uppercase}.match-flow-turn-type select{min-height:32px;border:1px solid #bbc7d4;border-radius:6px;padding:0 28px 0 9px;background:#fff;color:#162033;font-weight:700}.turn-number-button{min-width:42px;min-height:36px;padding:0 10px;border-color:#6f7f92;background:#f8fafc;font-size:18px;font-weight:900}.compact-adjust-button{min-width:30px;min-height:30px;padding:0 8px;font-weight:900}.beat-button-row,.pip-control-button-row{display:inline-flex;gap:4px}.beat-button{min-width:32px;min-height:30px;padding:0;border-color:#b6c2cf;background:#f8fafc;font-weight:900}.beat-button.action{border-color:#b7791f;background:#fff3bf;color:#7c4a03}.beat-button.is-active{border-color:#155eef;box-shadow:0 0 0 2px #155eef2e}.beat-button.action.is-active{border-color:#92400e;box-shadow:0 0 0 2px #92400e3d}.pip-control-button{min-width:44px;min-height:30px;padding:0 8px;border-color:#b6c2cf;background:#f8fafc;color:#263447;font-size:11px;font-weight:900}.pip-control-button.compromised{border-color:#b7791f;background:#fff7d6;color:#7c4a03}.pip-control-button.full{border-color:#256f45;background:#e7f6ec;color:#16502f}.pip-control-button.early{border-color:#155eef;background:#eaf1ff;color:#123c9c}.pip-control-button.is-active{border-color:#162033;box-shadow:0 0 0 2px #155eef33,inset 0 -3px #16203347}.initiative-display{min-width:58px;min-height:36px;display:inline-grid;place-items:center;padding:2px 9px;border-radius:6px;color:#fff;box-shadow:inset 0 0 0 1px #ffffff59}.initiative-display strong,.initiative-display span{line-height:1}.initiative-display strong{font-size:17px;font-weight:950}.initiative-display span{margin-top:2px;font-size:10px;font-weight:900;text-transform:uppercase}.initiative-display.red{background:#d92d20}.initiative-display.blue{background:#155eef}.toolbar-actions button[aria-pressed=true]{border-color:#155eef;background:#eaf1ff;color:#123c9c}.toolbar-actions>button:first-child{border-color:#256f45;background:#e7f6ec;color:#16502f;font-weight:800}.workspace{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;padding:16px;flex:1}.board-playtest-area{min-width:0;display:grid;grid-template-columns:118px minmax(760px,1fr) 118px;grid-template-areas:"red-roster pitch blue-roster";align-items:start;gap:10px}.pitch-shell{grid-area:pitch;min-width:0}.movement-roster{align-self:stretch;display:grid;align-content:start;gap:8px;min-width:0;padding:8px;border:1px solid #cfd9e4;border-radius:8px;background:#fff}.movement-roster.red{grid-area:red-roster;border-top:3px solid #d92d20}.movement-roster.blue{grid-area:blue-roster;border-top:3px solid #155eef}.movement-roster-header{display:flex;align-items:center;justify-content:space-between;gap:6px;color:#46556a;font-size:12px}.movement-roster-header strong{color:#162033;font-size:13px}.movement-roster-list{display:grid;gap:5px}.movement-roster-row{width:100%;min-height:34px;display:grid;grid-template-columns:16px minmax(16px,auto) minmax(0,1fr);align-items:center;gap:6px;padding:4px 6px;text-align:left;border-color:#c6d1dc;background:#fff}.movement-roster-row:hover,.movement-roster-row:focus-visible{border-color:#6f7f92}.movement-roster-row.is-moved{border-color:#aeb8c5;background:#eef2f7;color:#627084}.movement-check{position:relative;width:16px;aspect-ratio:1;border:1.5px solid #8a96a8;border-radius:4px;background:#fff}.movement-roster-row.is-moved .movement-check{border-color:#256f45;background:#256f45}.movement-roster-row.is-moved .movement-check:after{content:"";position:absolute;left:4px;top:1px;width:5px;height:9px;border:solid #ffffff;border-width:0 2px 2px 0;transform:rotate(45deg)}.movement-player-label{font-weight:900;line-height:1}.movement-player-id{overflow:hidden;color:#627084;font-size:10px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.pitch-scroll{overflow:auto;border:1px solid #c8d3dd;border-radius:8px;background:#1f3f2b;padding:10px}.pitch-stage{position:relative;width:min(100%,1400px);min-width:760px;margin:0 auto;-webkit-user-select:none;user-select:none}.pitch-artwork{display:block;width:100%;height:auto;border-radius:4px}.pitch-overlay,.debug-grid{position:absolute;top:0;right:0;bottom:0;left:0}.player-piece{--player-x: 0%;--player-y: 0%;--player-anchor-x: 0;--player-anchor-y: 0;--player-rotation: 0deg;--player-token-diameter: 2.55%;position:absolute;left:var(--player-x);top:var(--player-y);width:var(--player-token-diameter);aspect-ratio:1;padding:0;transform:translate(calc(-50% + var(--player-anchor-x) * 100%),calc(-50% + var(--player-anchor-y) * 100%)) rotate(var(--player-rotation));display:block;border:0;border-radius:50%;background:transparent;font-weight:800;font-size:clamp(11px,1.15vw,18px);line-height:1;box-shadow:0 3px 10px #09142633;touch-action:none;z-index:3}.player-token-image,.ball-token-image{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none}.player-piece.is-selected{outline:3px solid #ffd166;outline-offset:2px}.player-piece.is-dragging{z-index:5;opacity:.9;box-shadow:0 8px 22px #0914265c}.momentum-marker{--momentum-x: 0%;--momentum-y: 0%;position:absolute;left:var(--momentum-x);top:var(--momentum-y);width:1.35%;min-width:12px;aspect-ratio:1;transform:translate(-50%,-50%);display:grid;place-items:center;border:1.5px solid #1f2937;border-radius:50%;color:#111827;font-size:6.5px;font-weight:900;line-height:1;box-shadow:0 2px 8px #0914265c;touch-action:none;z-index:4}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.momentum-marker.bronze{background:#cd7f32}.momentum-marker.silver{background:#d7dee8}.momentum-marker.gold{background:#ffd166}.momentum-marker.pending{border-style:dashed;background-image:repeating-linear-gradient(135deg,rgb(255 255 255 / .28) 0 4px,transparent 4px 8px)}.momentum-marker.active{border-style:solid}.momentum-marker.is-dragging{z-index:7;box-shadow:0 7px 18px #09142666}.line-preview-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.line-preview-layer.pinned{z-index:1}.line-preview-layer.preview{z-index:2}.line-preview-tile{position:absolute;box-shadow:inset 0 0 0 1px #ffffff40}.line-preview-tile.preview{border:1.5px solid rgb(21 94 239 / .72);border-style:dashed;background:#155eef2b}.line-preview-tile.pinned{border:1.5px solid rgb(190 18 60 / .8);background:#be123c21}.line-preview-tile.preview.is-origin{border-color:#166534d9;background:#22c55e33}.line-preview-tile.preview.is-target{border-color:#92400edb;background:#fbbf243d}.line-preview-tile.pinned.is-origin{border-color:#15803de0;background:#16a34a33}.line-preview-tile.pinned.is-target{border-color:#9d174de6;background:#f472b633}.line-source-marker{position:absolute;border:2px solid rgb(22 101 52 / .95);background:#22c55e1f;box-shadow:inset 0 0 0 1px #ffffff73;pointer-events:none;z-index:2}.momentum-direction-choices{position:absolute;top:0;right:0;bottom:0;left:0;z-index:8}.momentum-direction-choices button{position:absolute;left:0;top:0;width:2.65%;min-width:24px;aspect-ratio:1;padding:0;transform:translate(-50%,-50%);border:0;background:transparent;box-shadow:none}.momentum-direction-choices button:after{content:"";display:block;width:8px;aspect-ratio:1;margin:auto;border:1px solid rgb(31 41 55 / .88);border-radius:50%;background:#ffffffe0;box-shadow:0 1px 4px #09142640}.momentum-direction-choices button:hover:after,.momentum-direction-choices button:focus-visible:after{border-color:#151515;background:#fff7d6;transform:scale(1.24)}.momentum-direction-choices button.is-active:after{background:#ffd166;border-color:#151515;transform:scale(1.28)}.momentum-popover{--popover-x: 50%;--popover-y: 50%;position:absolute;left:var(--popover-x);top:var(--popover-y);z-index:9;width:max-content;max-width:260px;display:grid;gap:8px;padding:10px 28px 10px 10px;transform:translate(-50%,calc(-100% - 18px));border:1px solid #9aa7b5;border-radius:8px;background:#fff;box-shadow:0 12px 28px #09142638}.momentum-popover-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.momentum-popover strong{font-size:13px}.momentum-popover-close{position:absolute;top:5px;right:5px;width:18px;min-height:18px;aspect-ratio:1;padding:0;border:0;background:transparent;color:#46556a;font-size:11px;font-weight:900;line-height:1}.momentum-popover-close:hover,.momentum-popover-close:focus-visible{background:#eef2f7}.momentum-control-row,.player-control-actions,.momentum-popover-actions{display:flex;flex-wrap:wrap;gap:5px}.momentum-control-row button,.player-control-actions button,.momentum-popover-actions button,.add-momentum-prompt button{min-height:28px;padding:0 8px;font-size:11px;font-weight:800}.momentum-control-row button.is-active{border-color:#155eef;background:#eaf1ff;color:#123c9c}.momentum-popover-direction-pad{display:grid;grid-template-columns:repeat(3,32px);grid-auto-rows:28px;gap:4px}.momentum-popover-direction-pad button{padding:0;font-size:10px;font-weight:900}.momentum-popover-direction-pad button.is-active{border-color:#151515;background:#ffd166}.direction-pad-spacer{display:block}.ball-token{--ball-x: 0%;--ball-y: 0%;position:absolute;left:var(--ball-x);top:var(--ball-y);width:1.35%;min-width:12px;aspect-ratio:1;padding:0;transform:translate(-50%,-50%);border:0;border-radius:50%;background:transparent;box-shadow:0 3px 9px #0914266b;touch-action:none;z-index:5}.ball-token.is-selected{outline:3px solid #ffd166;outline-offset:3px}.ball-token.is-dragging{z-index:6;opacity:.92;box-shadow:0 8px 20px #09142666}.ball-token.has-composite:after{content:"";position:absolute;top:-5px;right:-5px;bottom:-5px;left:-5px;border:2px solid #1f2937;border-radius:50%;pointer-events:none}.ball-token.has-composite.bronze:after{border-color:#cd7f32}.ball-token.has-composite.silver:after{border-color:#8a96a8}.ball-token.has-composite.gold:after{border-color:#e3a800}.ball-token.has-composite.pending:after{border-style:dashed}.ball-token.has-composite.active:after{border-style:solid}.tile-highlight{position:absolute;border:2px solid #ffd166;background:#ffd16647;pointer-events:none}.ball-anchor-guide{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.ball-anchor-dot{position:absolute;width:.75%;min-width:7px;aspect-ratio:1;transform:translate(-50%,-50%);border:1px solid rgb(21 21 21 / .82);border-radius:50%;background:#fffc;box-shadow:0 1px 4px #09142640}.ball-anchor-dot.is-active{background:#ffd166;border-color:#151515;transform:translate(-50%,-50%) scale(1.28)}.debug-grid{pointer-events:none}.debug-grid-cell{position:absolute;display:flex;align-items:flex-start;justify-content:flex-start;padding:2px;border-top:1px solid rgb(255 255 255 / .65);border-left:1px solid rgb(255 255 255 / .65);color:#0f172a;font-size:9px;font-weight:700;text-shadow:0 1px 2px rgb(255 255 255 / .8)}.debug-grid-cell:nth-child(30n){border-right:1px solid rgb(255 255 255 / .65)}.debug-grid-cell:nth-last-child(-n+30){border-bottom:1px solid rgb(255 255 255 / .65)}.board-status{display:flex;justify-content:space-between;gap:12px;min-height:40px;padding:10px 2px 0;color:#46556a;font-size:14px}.ball-anchor-panel{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:4px 2px 0;color:#46556a;font-size:13px;font-weight:700}.line-diagnostics{display:grid;gap:4px;padding:6px 2px 0;color:#46556a;font-size:12px}.line-source-controls{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.line-source-controls button{min-height:28px;padding:0 9px;font-size:11px;font-weight:800}.line-source-controls button[aria-pressed=true]{border-color:#155eef;background:#eaf1ff;color:#123c9c}.line-diagnostics code{display:block;max-width:100%;overflow-wrap:anywhere;color:#243044;font-size:11px;line-height:1.45}.anchor-pad{display:grid;grid-template-columns:repeat(3,34px);grid-auto-rows:30px;gap:4px}.anchor-pad button{padding:0;font-size:11px;font-weight:800}.anchor-pad button.is-active{border-color:#151515;background:#ffd166}@media (max-width: 980px){.workspace{grid-template-columns:1fr}}@media (max-width: 820px){.pause-menu-grid{grid-template-columns:1fr}}@media (max-width: 1320px){.board-playtest-area{grid-template-columns:1fr 1fr;grid-template-areas:"red-roster blue-roster" "pitch pitch"}.movement-roster-list{grid-template-columns:repeat(auto-fit,minmax(58px,1fr))}.movement-roster-row{grid-template-columns:16px minmax(16px,auto)}.movement-player-id{display:none}}@media (max-width: 640px){.board-toolbar{align-items:flex-start;flex-direction:column}.workspace{padding:10px}.pitch-scroll{padding:6px}.board-playtest-area{grid-template-columns:1fr;grid-template-areas:"red-roster" "blue-roster" "pitch"}}
