:root{color:#f0f2e8;background:#031916;font-family:PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;font-synthesis:none;--ink: #f0f2e8;--muted: #93aaa2;--quiet: #5f7d74;--surface: #031c18;--surface-2: #062821;--surface-3: #0a342b;--line: rgba(184, 211, 197, .28);--line-strong: rgba(201, 224, 211, .56);--offense: #3f94e5;--offense-light: #7fc1ff;--defense: #f4933f;--holder: #f5b72d;--receiver: #62dc69;--danger: #ff725f;--ease-ui: cubic-bezier(.16, 1, .3, 1);--ease-step: cubic-bezier(.65, 0, .35, 1);--motion-step: 1.4s;--motion-route: 1.05s}*{box-sizing:border-box}html,body,#root{width:100%;min-width:320px;min-height:100%;margin:0}body{min-height:100dvh;overflow:hidden;background:var(--surface);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible{outline:2px solid #cfe6dc;outline-offset:2px}.app-shell{width:100vw;height:100dvh;min-height:620px;overflow:hidden;background:var(--surface);position:relative}.topbar{height:64px;display:flex;align-items:center;gap:22px;padding:0 24px 0 30px;border-bottom:1px solid var(--line);background:#031815;position:relative;z-index:40}.brand{font-size:21px;font-weight:760;letter-spacing:.02em;white-space:nowrap}.top-divider{width:1px;height:22px;background:var(--line-strong)}.tactic-title{display:flex;align-items:center;gap:8px;min-width:190px;font-size:17px;font-weight:600}.format-picker{position:relative}.format-button{min-height:40px;display:inline-flex;align-items:center;gap:5px;padding:0 10px;border:0;background:transparent;cursor:pointer;color:var(--ink);border-radius:7px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:15px}.format-button:hover{background:#ffffff0e}.format-menu{position:absolute;top:48px;left:-76px;width:260px;padding:14px;background:#08261f;border:1px solid var(--line-strong);border-radius:12px;box-shadow:0 18px 50px #00000057;z-index:90}.format-menu p{margin:0 0 10px;color:var(--muted);font-size:12px;letter-spacing:.1em}.format-menu>div{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.format-menu button{min-height:42px;border:1px solid var(--line);background:transparent;border-radius:7px;cursor:pointer}.format-menu button:hover{border-color:var(--holder);color:var(--holder)}.format-menu .custom-format{width:100%;margin-top:8px;color:var(--muted)}.save-state{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:14px;margin-right:auto}.save-state svg{color:#3ec67d}.history-actions{display:flex;align-items:center;gap:4px}.history-actions button,.info-menu-button{width:42px;height:42px;display:grid;place-items:center;border:0;border-radius:7px;background:transparent;cursor:pointer;color:var(--muted)}.history-actions button:hover:not(:disabled),.info-menu-button:hover,.info-menu-button.is-active{color:var(--ink);background:#ffffff0f}.history-actions button:disabled{opacity:.25;cursor:not-allowed}.present-button{min-height:44px;display:flex;align-items:center;gap:9px;padding:0 18px;color:var(--holder);border:1px solid var(--holder);border-radius:8px;background:transparent;font-weight:700;cursor:pointer}.present-button:hover{color:#1d1b11;background:var(--holder)}.presentation-header{position:absolute;z-index:70;top:0;left:0;right:0;height:64px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;padding:0 24px 0 30px;border-bottom:1px solid rgba(190,218,203,.22);background:#031815f0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);animation:presentation-reveal .22s var(--ease-ui) both}.presentation-title{min-width:0;display:flex;align-items:center;gap:12px}.presentation-title>span{padding:4px 7px;border-radius:4px;background:#f5b72d1f;color:var(--holder);font-size:11px;font-weight:760;letter-spacing:.08em;white-space:nowrap}.presentation-title b{overflow:hidden;font-size:19px;text-overflow:ellipsis;white-space:nowrap}.presentation-title em{color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;font-style:normal}.presentation-step-label{color:var(--muted);font-size:13px;letter-spacing:.06em}.presentation-step-label b{margin-left:8px;color:var(--holder);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:19px}.presentation-step-label span{margin-left:4px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.presentation-header>button{min-height:42px;justify-self:end;display:flex;align-items:center;gap:8px;padding:0 13px;border:1px solid var(--line-strong);border-radius:8px;background:#ffffff06;color:#d8e4de;cursor:pointer}.presentation-header>button:hover{border-color:var(--holder);color:var(--holder)}.presentation-mode .topbar,.presentation-mode .tool-rail,.presentation-mode .info-edge,.presentation-mode .info-drawer,.presentation-mode .timeline-bar,.presentation-mode .route-handle,.presentation-mode .route-editor-bar,.presentation-mode .draw-hint,.presentation-mode .player-popover{display:none}.presentation-mode .board-workspace{height:100dvh}.presentation-mode .field-boundary{top:96px;right:7%;bottom:96px;left:7%}.presentation-mode .attack-direction{top:71px}.presentation-mode .possession-legend{top:71px;right:7%;font-size:13px}.presentation-mode .player-token{--player-size: 34px;--figure-size: 54px;font-size:11px}.presentation-controls{position:absolute;z-index:70;left:50%;bottom:16px;translate:-50% 0;min-height:68px;display:flex;align-items:center;gap:18px;padding:8px 13px;border:1px solid var(--line-strong);border-radius:12px;background:#031815f2;box-shadow:0 16px 44px #00000057;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);animation:presentation-reveal .24s var(--ease-ui) both}.presentation-dots,.presentation-playback,.presentation-shortcuts{display:flex;align-items:center}.presentation-dots{gap:2px;padding-right:14px;border-right:1px solid var(--line)}.presentation-dots button{width:30px;height:42px;display:grid;place-items:center;padding:0;border:0;border-radius:6px;background:transparent;cursor:pointer}.presentation-dots button:after{content:"";width:8px;height:8px;border-radius:50%;background:var(--quiet);transition:width .18s var(--ease-ui),background .18s ease}.presentation-dots button.is-active:after{width:22px;border-radius:4px;background:var(--holder)}.presentation-dots button:disabled{cursor:default}.presentation-playback{gap:7px}.presentation-playback button{width:48px;height:48px;display:grid;place-items:center;border:1px solid transparent;border-radius:9px;background:#0a2b24;color:#dbe5df;cursor:pointer}.presentation-playback button:hover:not(:disabled){color:var(--holder);border-color:#f5b72d73}.presentation-playback button:disabled{opacity:.26;cursor:default}.presentation-playback .presentation-play{width:56px;height:52px;background:var(--holder);color:#211a08}.presentation-playback .presentation-play:hover:not(:disabled){color:#211a08;border-color:#ffe08a}.presentation-playback .playback-speed-button,.playback-actions .playback-speed-button{width:54px;color:#dbe5df;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;font-weight:800;letter-spacing:-.02em}.presentation-playback .playback-speed-button{margin-left:3px;border-color:var(--line)}.playback-actions .playback-speed-button{border:1px solid var(--line)}.presentation-shortcuts{gap:5px;color:var(--muted);font-size:11px;white-space:nowrap}.presentation-shortcuts span{margin-inline:2px}.presentation-shortcuts kbd{min-width:24px;padding:3px 5px;border:1px solid var(--line);border-bottom-color:var(--line-strong);border-radius:4px;background:#ffffff09;color:#c9d6cf;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;text-align:center}@keyframes presentation-reveal{0%{opacity:0}}.board-workspace{height:calc(100dvh - 64px);min-height:556px;position:relative}.field-canvas{width:100%;height:100%;overflow:hidden;position:relative;touch-action:none;-webkit-user-select:none;user-select:none;background:#062a23}.field-canvas.tool-run,.field-canvas.tool-pass,.field-canvas.tool-defense{cursor:crosshair}.field-canvas:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid rgba(167,204,185,.08);pointer-events:none}.field-boundary{position:absolute;top:30px;right:12.5%;bottom:142px;left:13.5%;border:2px solid rgba(224,234,222,.7);transform:perspective(1100px) rotateX(.9deg);pointer-events:none}.field-line{position:absolute;left:0;width:100%;height:1px;background:#e0eade6b}.endzone-top{top:12%}.midline{top:50%}.endzone-bottom{top:88%}.corner{position:absolute;width:12px;height:12px;border-color:var(--holder);opacity:.86}.corner-tl{top:-6px;left:-6px;border-top:2px solid;border-left:2px solid}.corner-tr{top:-6px;right:-6px;border-top:2px solid;border-right:2px solid}.corner-bl{bottom:-6px;left:-6px;border-bottom:2px solid;border-left:2px solid}.corner-br{bottom:-6px;right:-6px;border-bottom:2px solid;border-right:2px solid}.attack-direction{position:absolute;top:7px;left:50%;translate:-50% 0;z-index:3;min-height:22px;display:flex;align-items:center;padding:2px 7px 3px;color:#cbd8d1;font-size:14px;line-height:1;letter-spacing:.08em;white-space:nowrap}.possession-legend{position:absolute;z-index:3;top:7px;right:12.5%;min-height:22px;display:flex;align-items:center;gap:12px;padding:2px 4px;color:#cbd8d1;font-size:12px;line-height:1;pointer-events:none;white-space:nowrap}.possession-legend span{display:inline-flex;align-items:center;gap:5px}.possession-legend i{width:11px;height:11px;border:2px solid;border-radius:50%;background:transparent}.possession-legend i.receiver{border-color:var(--receiver)}.possession-legend i.holder{border-color:var(--holder)}.routes-layer{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:6}.routes-layer path:not([class$=head]){fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round}.route-visible,.route-draft{pointer-events:none;animation:route-enter .24s var(--ease-ui) both}.route-hit{pointer-events:stroke;cursor:pointer;stroke:transparent;stroke-width:16}.route-group.is-selected .route-visible{filter:drop-shadow(0 0 5px rgba(245,183,45,.9))}.route-group.is-selected .route-visible.pass-route{stroke:#edffbe}.route-group.is-selected .route-visible.run-route{stroke:#9bd0ff}.route-group.is-selected .route-visible.defense-route{stroke:#ffb06d}.route-draft{opacity:.82}.route-handle{position:absolute;z-index:11;width:30px;height:30px;translate:-50% -50%;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:#041f1ad1;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;opacity:.72;transition:opacity .15s ease,scale .15s ease,box-shadow .15s ease}.route-handle>span{width:8px;height:8px;border:2px solid var(--offense-light);border-radius:50%}.route-handle.pass>span{border-color:var(--receiver)}.route-handle.defense>span{border-color:var(--defense)}.route-handle.pass{cursor:grab}.route-handle.pass.is-dragging{cursor:grabbing}.route-handle:hover,.route-handle.is-selected,.route-handle.is-dragging{opacity:1;scale:1.16;box-shadow:0 0 0 2px var(--holder)}@keyframes route-enter{0%{opacity:0}}.pass-route{stroke:#c9ffca;stroke-width:4.2;filter:drop-shadow(0 0 4px rgba(98,220,105,.42))}.run-route{stroke:#63b3ff;stroke-width:3.7;stroke-dasharray:7 7}.defense-route{stroke:#ff874d;stroke-width:3.5;stroke-dasharray:6 6}.route-arrow-anchor{position:absolute;z-index:7;width:0;height:0;pointer-events:none;transform:rotate(var(--route-angle));transform-origin:0 0}.route-arrow-anchor>i{position:absolute;top:0;right:calc(-1px + var(--route-tip-offset, 0px));width:16px;height:11px;translate:0 -50%;clip-path:polygon(0 0,100% 50%,0 100%);background:var(--arrow-color);filter:drop-shadow(0 0 2px rgba(3,24,20,.9))}.route-arrow-anchor.pass{--arrow-color: #c9ffca}.route-arrow-anchor.run{--arrow-color: #63b3ff}.route-arrow-anchor.defense{--arrow-color: #ff874d}.route-arrow-anchor.is-draft{opacity:.82}.route-arrow-anchor.is-selected>i{filter:drop-shadow(0 0 3px rgba(245,183,45,.95))}.presentation-mode .route-arrow-anchor>i{width:18px;height:12px}.player-token{--token-color: var(--offense);--player-size: 28px;--figure-size: 48px;position:absolute;z-index:12;width:var(--player-size);height:var(--player-size);translate:-50% -50%;display:grid;place-items:center;border-radius:50%;border:2px solid #f4f7ee;background:var(--token-color);color:#fff;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;font-weight:800;cursor:grab;touch-action:none;box-shadow:0 3px #0000002e,0 8px 18px #0003;transition:box-shadow .15s ease,scale .15s ease}.field-canvas.tool-run .player-token.offense,.field-canvas.tool-pass .player-token.offense,.field-canvas.tool-defense .player-token.defense{cursor:crosshair;box-shadow:0 0 0 3px #f5b72d3d,0 8px 18px #0003}.app-shell.is-playing .player-token{transition:left var(--motion-step) var(--ease-step),top var(--motion-step) var(--ease-step),box-shadow .18s ease,scale .18s ease}.app-shell.is-playing .route-visible{animation-duration:var(--motion-route)}.player-token.defense{--token-color: var(--defense);color:#3b210e}.player-token:hover,.player-token.is-selected{scale:1.08;box-shadow:0 0 0 4px #eff4eb47,0 10px 24px #0000003d}.player-token:active{cursor:grabbing;scale:1.12}.player-token.is-holder{box-shadow:0 0 0 2px #6b5b22,0 0 0 5px var(--holder),0 0 16px #f5b72d6b}.player-token.is-receiver{box-shadow:0 0 0 2px #1d5c2e,0 0 0 5px var(--receiver),0 0 16px #62dc6975}.player-token.is-holder.is-selected,.player-token.is-receiver.is-selected{scale:1.08}.player-silhouette{position:absolute;z-index:1;left:50%;top:50%;width:var(--figure-size);height:var(--figure-size);pointer-events:none;transform:translate(-50%,-50%) rotate(var(--player-facing, 0deg));transition:transform .42s var(--ease-step)}.player-code{position:relative;z-index:3;pointer-events:none}.player-arm{position:absolute;z-index:1;top:50%;width:14px;height:4px;translate:0 -50%;border:1.5px solid #f4f7ee;border-radius:999px;background:var(--token-color)}.player-arm-left{left:0;rotate:7deg}.player-arm-right{right:0;rotate:-7deg}.player-arm b{position:absolute;top:50%;width:6px;height:6px;translate:0 -50%;border:1.5px solid #f4f7ee;border-radius:50%;background:var(--token-color)}.player-arm-left b{left:-4px}.player-arm-right b{right:-4px}.disc{position:absolute;z-index:4;top:50%;right:-17px;width:10px;height:10px;border:1.5px solid #fff4ee;border-radius:50%;background:#ef4444;transform:translateY(-50%);filter:drop-shadow(0 2px 2px rgba(0,0,0,.25))}.flight-disc{position:absolute;z-index:18;width:12px;height:12px;translate:-50% -50%;border:1.5px solid #fff4ee;border-radius:50%;background:#ef4444;pointer-events:none;box-shadow:0 0 0 3px #ef444429,0 3px 8px #00000057}.player-popover{position:absolute;z-index:35;width:180px;padding:9px;translate:38px -50%;border:1px solid var(--line-strong);border-radius:10px;background:#082720;box-shadow:0 18px 48px #0000005c}.player-popover.opens-left{translate:calc(-100% - 38px) -50%}.player-popover>div{display:flex;align-items:baseline;justify-content:space-between;padding:4px 5px 9px;border-bottom:1px solid var(--line);margin-bottom:5px}.player-popover b{font-size:14px}.player-popover span{color:var(--muted);font-size:11px}.player-popover button{width:100%;min-height:38px;display:flex;align-items:center;gap:8px;padding:0 8px;border:0;border-radius:6px;background:transparent;cursor:pointer;color:#cbd9d2;font-size:13px}.player-popover button:hover{background:#ffffff0f}.player-popover button.active-holder{color:var(--holder)}.player-popover button.active-receiver{color:var(--receiver)}.route-editor-bar,.draw-hint{position:absolute;z-index:34;top:42px;left:50%;translate:-50% 0;min-height:42px;display:flex;align-items:center;gap:9px;padding:6px 8px 6px 12px;border:1px solid var(--line-strong);border-radius:9px;background:#031c18f5;box-shadow:0 12px 34px #00000047;animation:toolbar-enter .18s var(--ease-ui) both}.route-editor-bar>span:not(.route-swatch){color:var(--muted);font-size:12px}.route-editor-bar b{font-size:13px}.route-editor-bar button{min-height:32px;display:flex;align-items:center;gap:5px;padding:0 9px;border:1px solid rgba(255,114,95,.38);border-radius:6px;background:transparent;color:#efaaa0;cursor:pointer}.route-editor-bar button:hover{color:var(--danger);border-color:var(--danger)}.route-swatch,.draw-hint>span{width:11px;height:11px;flex:0 0 auto;border-radius:50%;background:var(--offense-light)}.route-swatch.pass,.draw-hint.pass>span{background:var(--receiver)}.route-swatch.defense,.draw-hint.defense>span{background:var(--defense)}.draw-hint{color:#d5e1da;font-size:13px;pointer-events:none}@keyframes toolbar-enter{0%{opacity:0;translate:-50% -7px}}.tool-rail{position:absolute;z-index:30;top:17%;left:18px;width:86px;padding:10px 7px;display:flex;flex-direction:column;gap:4px;border:1px solid var(--line-strong);border-radius:12px;background:#031c18f5;box-shadow:0 14px 38px #00000040}.tool-button{min-height:70px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:1px solid transparent;border-radius:8px;background:transparent;color:#d7e1db;cursor:pointer}.tool-button span{font-size:13px}.tool-button:hover{background:#ffffff0b}.tool-button.is-active{color:var(--holder);border-color:var(--holder);background:#f5b72d0f}.tool-button.is-future{color:#9eb0a8}.info-edge{position:absolute;z-index:31;top:48%;right:0;width:44px;min-height:154px;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--line-strong);border-right:0;border-radius:12px 0 0 12px;background:#082720;cursor:pointer;transition:right .18s ease}.info-edge span{writing-mode:vertical-rl;letter-spacing:.18em;font-size:13px}.info-edge.is-open{right:336px}.info-drawer{position:absolute;z-index:32;top:0;right:0;bottom:126px;width:336px;overflow-y:auto;padding:20px;border-left:1px solid var(--line-strong);background:#061f1a;translate:100% 0;transition:translate .18s ease;box-shadow:-18px 0 40px #0000003d}.info-drawer.is-open{translate:0 0}.drawer-head{display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:16px}.drawer-head span{color:var(--holder);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;letter-spacing:.16em}.drawer-head h2{margin:5px 0 0;font-size:22px}.drawer-head button{width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:8px;background:transparent;cursor:pointer}.drawer-head button:hover{background:#ffffff0d}.drawer-section{padding:17px 0;border-top:1px solid var(--line)}.drawer-section label{display:block;margin:0 0 7px;color:var(--muted);font-size:12px}.drawer-section input{width:100%;height:44px;padding:0 12px;color:var(--ink);border:1px solid var(--line-strong);border-radius:7px;background:#082720;font-size:16px}.drawer-section input+label{margin-top:14px}.tactic-library-section{padding-top:15px}.library-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.library-heading h3{margin:0;font-size:15px}.library-heading p{margin:4px 0 0;color:var(--muted);font-size:11px}.new-tactic-button{min-height:40px;display:flex;align-items:center;gap:6px;padding:0 12px;border:1px solid rgba(245,183,45,.58);border-radius:7px;background:#f5b72d12;color:var(--holder);cursor:pointer;font-size:13px;font-weight:700}.new-tactic-button:hover{border-color:var(--holder);background:#f5b72d21}.tactic-list{max-height:310px;display:grid;gap:8px;overflow-y:auto;padding-right:2px;overscroll-behavior-y:contain;scrollbar-width:thin;scrollbar-color:rgba(245,183,45,.4) transparent}.tactic-card{overflow:hidden;border:1px solid var(--line);border-radius:9px;background:#08231d;transition:border-color .16s ease,background .16s ease}.tactic-card:hover{border-color:#c9e0d373}.tactic-card.is-active{border-color:#f5b72dcc;background:#f5b72d0e}.tactic-card-select{width:100%;min-height:76px;display:grid;grid-template-columns:1fr auto;gap:6px 10px;padding:11px 12px 9px;border:0;background:transparent;text-align:left;cursor:pointer}.tactic-card-select:hover .tactic-card-name b{color:var(--holder)}.tactic-card-name{min-width:0;display:flex;align-items:center;gap:7px}.tactic-card-name b{overflow:hidden;font-size:14px;text-overflow:ellipsis;white-space:nowrap}.tactic-card-name i{flex:0 0 auto;padding:2px 5px;border-radius:4px;background:#f5b72d24;color:var(--holder);font-size:9px;font-style:normal;font-weight:760;letter-spacing:.06em}.tactic-card-meta,.tactic-card-time{color:var(--muted);font-size:11px}.tactic-card-meta{grid-column:1;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.tactic-card-time{grid-column:2;grid-row:1 / span 2;align-self:end;white-space:nowrap}.tactic-rename-input{width:calc(100% - 20px)!important;height:42px!important;margin:10px 10px 9px;font-size:14px!important}.tactic-card-actions{display:flex;justify-content:flex-end;gap:2px;padding:3px 6px;border-top:1px solid rgba(184,211,197,.17)}.tactic-card-actions button{width:40px;height:38px;display:grid;place-items:center;border:0;border-radius:6px;background:transparent;color:var(--muted);cursor:pointer}.tactic-card-actions button:hover:not(:disabled){background:#ffffff0e;color:var(--ink)}.tactic-card-actions button:last-child:hover:not(:disabled){color:var(--danger)}.tactic-card-actions button:disabled{opacity:.25;cursor:not-allowed}.transfer-section{padding-block:16px}.transfer-title{margin-bottom:10px}.transfer-actions{display:grid;grid-template-columns:1fr;gap:8px}.transfer-actions button{min-width:0;min-height:72px;display:grid;grid-template-columns:23px minmax(0,1fr);grid-template-rows:auto auto;align-content:center;align-items:center;gap:3px 7px;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:#ffffff05;color:#dce6e0;text-align:left;cursor:pointer}.transfer-actions button:hover:not(:disabled){border-color:#f5b72db3;background:#f5b72d0e}.transfer-actions button:disabled{opacity:.55;cursor:wait}.transfer-actions button svg{grid-row:1 / span 2;color:var(--holder)}.transfer-actions button span{min-width:0;overflow:hidden;font-size:13px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.transfer-actions button small{min-width:0;overflow:hidden;color:var(--muted);font-size:10px;text-overflow:ellipsis;white-space:nowrap}.transfer-actions .png-export-button,.transfer-actions .video-export-button{min-height:58px}.transfer-actions .video-export-button{position:relative;overflow:hidden}.transfer-actions .video-export-button>*:not(.video-export-progress){position:relative;z-index:1}.transfer-actions .video-export-button.is-exporting{border-color:#f5b72dad;cursor:pointer}.video-export-progress{position:absolute;z-index:0;inset:0 auto 0 0;width:var(--export-progress);background:#f5b72d1f;pointer-events:none;transition:width .12s linear}.preset-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}.preset-row button{min-height:40px;border:1px solid var(--line);border-radius:6px;background:transparent;cursor:pointer;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.preset-row button:hover,.preset-row button.is-active{color:var(--holder);border-color:var(--holder)}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.section-title h3{margin:0;font-size:15px}.section-title span{color:var(--holder);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.count-row{min-height:50px;display:flex;align-items:center;gap:9px}.team-swatch{width:11px;height:11px;border-radius:50%}.team-swatch.offense{background:var(--offense)}.team-swatch.defense{background:var(--defense)}.count-label{color:#cad8d1;font-size:14px}.count-actions{margin-left:auto;display:flex;align-items:center;gap:4px}.count-actions button{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:6px;background:transparent;cursor:pointer}.count-actions button:hover:not(:disabled){border-color:var(--holder);color:var(--holder)}.count-actions button:disabled{opacity:.3}.count-actions b{min-width:28px;text-align:center;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.reset-button,.delete-button{width:100%;min-height:42px;margin-top:10px;border:1px solid var(--line);border-radius:7px;background:transparent;cursor:pointer;color:var(--muted)}.reset-button:hover{color:var(--ink);border-color:var(--line-strong)}.empty-copy{margin:0;color:var(--muted);font-size:13px;line-height:1.65}.state-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.state-buttons button{min-height:43px;display:flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);border-radius:7px;background:transparent;cursor:pointer}.state-buttons button.holder-active{color:var(--holder);border-color:var(--holder)}.state-buttons button.receiver-active{color:var(--receiver);border-color:var(--receiver)}.delete-button{display:flex;align-items:center;justify-content:center;gap:7px;color:#d59b90}.delete-button:hover{color:var(--danger);border-color:var(--danger)}.timeline-bar{position:absolute;z-index:38;left:50%;bottom:16px;translate:-50% 0;width:min(1060px,calc(100% - 230px));min-height:86px;display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line-strong);border-radius:12px;background:#031815f7;box-shadow:0 16px 44px #00000047}.step-count{min-width:84px;display:flex;align-items:baseline;gap:7px}.step-count b{color:var(--holder);font-size:15px}.step-count span{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px}.step-strip{min-width:120px;flex:1 1 auto;display:flex;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:rgba(245,183,45,.5) transparent}.step-card{width:110px;flex:0 0 110px;height:68px;position:relative;display:grid;grid-template-columns:24px 1fr;align-items:center;gap:6px;padding:8px;border:1px solid var(--line);border-radius:8px;background:#08231d;color:var(--ink);cursor:pointer;transition:border-color .16s ease,background .16s ease,opacity .16s ease}.step-card.is-active{border:2px solid var(--holder)}.step-card:hover:not(:disabled){border-color:#f5b72db3}.step-card:disabled{cursor:default;opacity:.72}.step-card>span{align-self:start;color:var(--holder);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.mini-field{height:50px;position:relative;border:1px solid rgba(190,218,203,.24);border-radius:3px;overflow:hidden}.mini-field i{position:absolute;width:4px;height:4px;translate:-50% -50%;border-radius:50%}.mini-field i.offense{background:var(--offense)}.mini-field i.defense{background:var(--defense)}.route-count{position:absolute;top:5px;right:5px;min-width:18px;height:18px;display:grid;place-items:center;border-radius:9px;background:var(--holder);color:#221a08;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;font-style:normal;font-weight:800}.playback-actions{display:flex;align-items:center;gap:4px;margin-left:auto}.playback-actions button{width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:8px;background:#0a2b24;cursor:pointer}.playback-actions .playback-speed-button{width:44px;font-size:12px}.playback-actions button:first-child{color:var(--ink);background:#12372f}.playback-actions button:hover{color:var(--holder)}.playback-actions button:disabled,.add-step-button:disabled{opacity:.3;cursor:not-allowed}.add-step-button{min-width:108px;height:42px;display:flex;align-items:center;justify-content:center;gap:6px;margin-left:2px;color:var(--holder);border:1px solid var(--holder);border-radius:8px;background:transparent;cursor:pointer;font-size:13px;font-weight:700}.add-step-button:hover{background:#f5b72d14}.add-step-button:hover:disabled{background:transparent}.author-signature{position:absolute;z-index:37;left:26px;bottom:calc(26px + env(safe-area-inset-bottom));color:#f5b72dc7;font-family:Snell Roundhand,Segoe Script,Bradley Hand,cursive;font-size:21px;font-style:italic;font-weight:600;line-height:1;pointer-events:none;transform:rotate(-4deg);transform-origin:left center;text-shadow:0 1px 0 rgba(0,0,0,.38);-webkit-user-select:none;user-select:none}.toast{position:fixed;z-index:120;left:50%;bottom:126px;translate:-50% 0;padding:11px 16px;border:1px solid var(--line-strong);border-radius:8px;background:#102e27;box-shadow:0 16px 40px #00000059;color:var(--ink);font-size:14px;animation:toast-in .18s ease-out both}@keyframes toast-in{0%{opacity:0;translate:-50% 8px}}.modal-backdrop{position:fixed;z-index:150;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:24px;background:#000a08bf}.confirm-dialog{width:min(420px,100%);padding:26px;border:1px solid var(--line-strong);border-radius:14px;background:#08231d;box-shadow:0 30px 90px #00000070}.dialog-player{width:48px;height:48px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:50%;background:var(--offense);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:800}.dialog-player.defense{color:#2d190b;background:var(--defense)}.dialog-tactic{width:48px;height:48px;display:grid;place-items:center;border:2px solid var(--holder);border-radius:9px;background:#f5b72d17;color:var(--holder)}.dialog-step{width:48px;height:48px;display:grid;place-items:center;border:2px solid var(--holder);border-radius:9px;background:#f5b72d17;color:var(--holder);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:20px;font-weight:800}.confirm-dialog h2{margin:18px 0 8px;font-size:22px}.confirm-dialog p{margin:0;color:var(--muted);font-size:14px;line-height:1.65}.confirm-dialog>div:last-child{display:flex;justify-content:flex-end;gap:8px;margin-top:22px}.confirm-dialog>div:last-child button{min-height:42px;padding:0 16px;border:1px solid var(--line);border-radius:7px;background:transparent;cursor:pointer}.confirm-dialog>div:last-child button.danger{color:#21120f;border-color:var(--danger);background:var(--danger);font-weight:700}@media(max-width:1240px){.topbar{gap:12px;padding-inline:18px}.presentation-header{padding-inline:18px}.presentation-title{gap:9px}.presentation-mode .player-token{--player-size: 32px;--figure-size: 52px;font-size:11px}.presentation-shortcuts{display:none}.brand{font-size:18px}.save-state span,.history-actions{display:none}.field-boundary{top:30px;right:11%;bottom:122px;left:12%}.tool-rail{left:12px;width:72px;top:11%;padding:7px 5px}.tool-button{min-height:59px}.tool-button span{font-size:12px}.player-token{--player-size: 26px;--figure-size: 46px;font-size:9px}.timeline-bar{width:min(880px,calc(100% - 190px));min-height:82px;padding:7px 9px}.step-card{width:100px;flex-basis:100px;height:66px}.mini-field{height:48px}.playback-actions button{width:36px;height:36px}.playback-actions .playback-speed-button{width:42px}.add-step-button{min-width:96px;height:40px}.info-drawer{bottom:118px}}@media(max-width:860px){.topbar,.presentation-header{height:58px;padding-inline:12px}.presentation-title>span,.presentation-title em,.presentation-header>button span{display:none}.presentation-title b{font-size:16px}.presentation-header>button{width:44px;padding:0;justify-content:center}.presentation-step-label{font-size:11px}.presentation-mode .attack-direction{top:65px}.presentation-mode .field-boundary{top:89px;right:7%;bottom:94px;left:7%}.presentation-mode .player-token{--player-size: 30px;--figure-size: 50px;font-size:10px}.presentation-controls{bottom:12px;min-height:62px;gap:10px;padding:6px 9px}.presentation-dots{padding-right:9px}.presentation-dots button{width:26px;height:40px}.presentation-playback button{width:44px;height:44px}.presentation-playback .presentation-play{width:50px;height:48px}.top-divider,.save-state,.history-actions{display:none}.tactic-title{min-width:0;font-size:15px}.present-button{margin-left:auto;padding-inline:13px}.board-workspace{height:calc(100dvh - 58px);grid-template-rows:minmax(0,1fr) 94px}.tool-rail{top:10%;width:70px;padding:6px 5px}.tool-button{min-height:58px}.tool-button span{font-size:12px}.player-token{--player-size: 24px;--figure-size: 44px;font-size:9px}.field-boundary{top:30px;right:10%;bottom:112px;left:11%}.timeline-bar{width:calc(100% - 96px);gap:6px;padding:6px 8px}.step-card{width:90px;flex-basis:90px;height:64px}.step-count{min-width:54px}.step-count b{display:none}.step-count span{font-size:13px}.playback-actions button{width:34px;height:34px}.playback-actions .playback-speed-button{width:40px}.add-step-button{min-width:44px;width:44px;height:38px;padding:0}.add-step-button span{display:none}.info-drawer{width:320px;bottom:110px}.info-edge.is-open{right:320px}.author-signature{left:12px;bottom:108px;font-size:18px}}@media(orientation:portrait)and (max-width:900px){.app-shell:after{content:"建议横屏使用战术板";position:fixed;z-index:300;left:50%;bottom:18px;translate:-50% 0;padding:9px 14px;border:1px solid var(--holder);border-radius:8px;background:#08231d;color:var(--holder);font-size:13px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
