
.tb{color:#173f50;font-family:system-ui,sans-serif;max-width:1250px;margin:auto}.tb *{box-sizing:border-box}.tb h2{font-size:clamp(24px,4vw,36px);margin:8px 0}.tb-intro>span{font-size:12px;letter-spacing:.15em}.tb p{line-height:1.5}.tb button,.tb-command-scroll button{min-height:44px;border:1px solid #b5cdd9;border-radius:8px;background:white;color:#173f50;padding:10px 12px;font:600 14px system-ui;cursor:pointer}.tb button[aria-pressed=true],.tb-command-scroll button[aria-pressed=true],.tb [data-save]{background:#12658c;color:white}.tb button:focus-visible,.tb-command-scroll button:focus-visible{outline:3px solid #d78c20;outline-offset:2px}.tb-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px}.tb-tools,.tb-options{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.tb-options button{flex:1 1 120px}.tb-court{display:block;width:100%;max-height:80vh;touch-action:none;user-select:none;margin:auto}.tb-court [data-player]{cursor:grab;outline:none;touch-action:none}.tb-court [data-player]:focus circle{stroke:#dc8c14;stroke-width:1.5}.tb-sidebar{background:white;border:1px solid #c9dde7;padding:0 14px;border-radius:12px;align-self:start;min-width:0}.tb label{display:block;font-size:14px;margin:0 0 14px}.tb input:not([type=file]),.tb select,.tb textarea{display:block;width:100%;min-width:0;min-height:44px;padding:10px;border:1px solid #b5cdd9;border-radius:7px;margin-top:6px;font:16px system-ui;color:#173f50;background:#f7fbfd}.tb-status{min-height:24px}.tb small,.tb-hint{color:#4b6777;font-size:13px}.tb summary{cursor:pointer;min-height:44px;padding:12px 0;font-size:14px}.tb-saving>summary{font-weight:700}.tb-saving[open]{padding-bottom:14px}.tb [data-labels]{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tb [hidden],.tb-command-scroll [hidden]{display:none!important}.tb-team-legend{display:flex;flex-wrap:wrap;gap:16px;font-weight:700;margin:12px 0}.tb-own{color:#2168a5}.tb-opponent{color:#b64c2c}.tb-rotation-control{display:grid;grid-template-columns:minmax(44px,1fr) 44px 40px 44px;gap:4px;align-items:center;margin:12px 0;padding:8px;border:1px solid #c5dce7;border-radius:10px;background:white}.tb-rotation-control button{padding:8px}.tb-rotation-control output{text-align:center;font-size:23px;font-weight:700}.tb-rotation-control small{grid-column:1/-1;text-align:center}.tb-rotation-control [data-edit-side]{background:#2168a5;color:white}.tb-more{position:relative}.tb-more>summary{background:white;border:1px solid #b5cdd9;border-radius:8px;padding:10px 12px;font-weight:600}.tb-more>div{position:absolute;z-index:12;right:0;min-width:200px;padding:8px;background:white;border:1px solid #c5dce7;border-radius:9px;box-shadow:0 4px 12px #173f5022;display:grid;gap:8px}
@media(max-width:760px){.tb-layout{grid-template-columns:1fr}.tb-court{max-height:none}.tb-tools>button{flex:1 1 100px}}
#modal.tactical-board-fullscreen{position:fixed;inset:0;width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;margin:0;border:0;border-radius:0;padding:0;background:#f0f8fc;overflow:auto;box-sizing:border-box}#modal.tactical-board-fullscreen #modal-body{padding:0 8px 6px;max-width:none;margin:auto}#modal.tactical-board-fullscreen #close-modal{display:none}.tb-live-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:5px;background:#f0f8fc;padding:5px 0;border-bottom:1px solid #c5dce7;box-sizing:border-box}.tb-live-header>label{margin:0;flex:0 0 105px;font-size:0}.tb-live-header>label select{width:105px;min-width:0;min-height:44px;padding:5px;font-size:13px;margin:0}.tb-live-header>#board-return-match{flex:none;min-height:44px;padding:8px 10px;font-size:13px;white-space:nowrap}.tb-command-scroll{display:flex;align-items:center;gap:4px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:thin;padding:2px 0}.tb-command-scroll>*{flex-shrink:0}.tb-command-scroll button{font-size:13px;padding:8px 9px;white-space:nowrap}.tb-command-scroll .tb-rotation-control{display:flex;gap:3px;padding:0;margin:0;border:0;background:transparent}.tb-command-scroll .tb-rotation-control button{padding:8px;min-width:36px}.tb-command-scroll .tb-rotation-control output{font-size:18px;min-width:28px}.tb-command-scroll .tb-more{margin:0}.tb-command-scroll .tb-more>summary{padding:11px 8px;min-height:44px;font-size:13px}.tb-command-scroll .tb-more>div{position:fixed;top:var(--tb-header-height,60px);right:8px}.tb-live{display:block;max-width:none}.tb-live .tb-intro,.tb-live>.tb-options,.tb-live>.tb-rotation-control,.tb-live .tb-layout>div:first-child>.tb-tools,.tb-live .tb-hint{display:none}.tb-live>.tb-team-legend{justify-content:center;gap:18px;margin:3px 0;font-size:12px;line-height:18px}.tb-live .tb-layout{display:block}.tb-live .tb-court{width:100%;max-width:none;max-height:calc(100dvh - var(--tb-header-height,60px) - 32px);margin:auto}.tb-live .tb-sidebar{display:none}.tb-live .tb-sidebar:has(.tb-saving[open]){display:block;position:fixed;z-index:11;right:8px;top:calc(var(--tb-header-height,60px) + 4px);width:min(360px,calc(100vw - 16px));max-height:calc(100dvh - var(--tb-header-height,60px) - 16px);overflow:auto;box-shadow:0 6px 25px #173f5033;padding:10px 14px}.tb-live .tb-saving>summary{display:none}.tb-live .tb-saving>button:first-child{float:right;margin-bottom:10px}.tb-live .tb-saving>label{clear:both}
@media(max-width:700px){.tb-live-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 6px;padding-top:max(4px,env(safe-area-inset-top))}.tb-live-header>label{grid-column:1;grid-row:1}.tb-live-header>label select{width:100%;max-width:220px}.tb-live-header>#board-return-match{grid-column:2;grid-row:1}.tb-command-scroll{grid-column:1/-1;grid-row:2;width:100%;padding:1px 0 3px}.tb-live .tb-court{max-height:calc(100dvh - var(--tb-header-height,105px) - 30px)}.tb-live>.tb-team-legend{font-size:11px;gap:10px}.tb-live .tb-sidebar:has(.tb-saving[open]){top:calc(var(--tb-header-height,105px) + 4px)}}

.tb-study-header{width:100%;margin-bottom:4px}.tb-study-header .tb-command-scroll{grid-column:1/-1;grid-row:1}.tb-study-header~.tb{padding-top:0}

/* Keep the teaching board directly below its page title. */
.content:has(#tactical-board) .page-title{margin-bottom:8px}.content:has(#tactical-board) #portal-message:empty{display:none}.content:has(#tactical-board){padding-top:16px}#tactical-board .tb-study-header{position:relative;top:auto}
.tb-command-scroll{flex-wrap:wrap;overflow-x:visible}.tb-command-scroll button{white-space:normal}.tb-command-scroll .tb-rotation-control{flex-shrink:0}

/* Compact commands and independent controls for each team. */
.tb-command-scroll{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}.tb-command-scroll button{white-space:nowrap;min-height:40px;padding:7px 9px}.tb-team-controls{display:flex;justify-content:space-between;gap:12px;margin:4px 0}.tb-side-controls{display:flex;align-items:center;gap:8px;min-width:0}.tb-side-controls.tb-own{margin-left:auto}.tb-mini-rotation,.tb-phases{display:flex;align-items:center;gap:2px}.tb-side-controls button{min-height:34px;padding:5px 7px;font-size:12px}.tb-mini-rotation output{min-width:26px;text-align:center;font-size:16px;font-weight:700}.tb-side-controls.tb-own button[aria-pressed=true]{background:#2168a5}.tb-side-controls.tb-opponent button[aria-pressed=true]{background:#bd5131}.tb-side-controls.tb-opponent{order:0}.tb-side-controls.tb-own{order:1}.tb-swapped .tb-opponent{order:1;margin-left:auto}.tb-swapped .tb-own{order:0;margin-left:0}.tb-live .tb-court{max-height:calc(100dvh - var(--tb-header-height,60px) - 60px)}
#tactical-board:fullscreen,#board:fullscreen{background:#f0f8fc;padding:8px;overflow:auto;height:100dvh;width:100vw;box-sizing:border-box}#tactical-board:fullscreen .tb-study-header,#board:fullscreen .tb-study-header{position:sticky;top:0}.tb-side-controls[hidden]{display:none!important}
@media(max-width:650px){.tb-team-controls{gap:8px}.tb-side-controls{flex-direction:column;gap:3px;flex:1}.tb-side-controls button{min-height:36px;min-width:32px}.tb-live .tb-court{max-height:calc(100dvh - var(--tb-header-height,60px) - 90px)}}

/* Center the controls over each actual half, including the shorter opponent side. */
.tb-team-controls{gap:0}.tb-side-controls{justify-content:center}.tb-side-controls.tb-own,.tb-swapped .tb-own{flex:9;margin-left:0}.tb-side-controls.tb-opponent,.tb-swapped .tb-opponent{flex:var(--tb-opponent-weight,9);margin-left:0}
/* Center the command row when it fits; keep the first control reachable when scrolling. */
.tb-command-scroll{justify-content:safe center}
.tb-drawing-dialog{width:min(540px,calc(100vw - 24px));max-height:90dvh;overflow:auto;border:1px solid #b5cdd9;border-radius:14px;background:#f7fbfd;color:#173f50;padding:20px;box-sizing:border-box;font:14px system-ui}.tb-drawing-dialog::backdrop{background:#102c4290}.tb-drawing-dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0;margin:0 0 14px;background:transparent}.tb-drawing-dialog h3{margin:0;font-size:22px}.tb-drawing-dialog button{min-height:44px;padding:9px 12px;border:1px solid #b5cdd9;border-radius:8px;background:white;color:#173f50;font:600 14px system-ui;cursor:pointer}.tb-drawing-dialog button[aria-pressed=true],.tb-drawing-dialog .tb-drawing-done{background:#12658c;color:white}.tb-drawing-types{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:18px}.tb-drawing-types button{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;white-space:normal}.tb-drawing-types span{font-size:26px;line-height:30px}.tb-drawing-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.tb-drawing-dialog label{display:block;font-size:14px;margin:0 0 10px}.tb-drawing-dialog input[type=color],.tb-drawing-dialog select{display:block;width:100%;min-height:44px;border:1px solid #b5cdd9;border-radius:6px;background:white;color:#173f50;padding:5px;margin-top:5px;font:16px system-ui}.tb-drawing-dialog .tb-check{display:flex;align-items:center;gap:8px;min-height:36px}.tb-drawing-dialog input[type=checkbox]{width:20px;height:20px;margin:0}.tb-drawing-dialog p{font-size:13px;line-height:1.5;color:#4b6777}.tb-drawing-dialog :focus-visible{outline:3px solid #d78c20;outline-offset:2px}.tb-command-scroll [data-drawing]{display:flex;align-items:center;justify-content:center;min-width:44px}.tb-drawing-dialog button:disabled,.tb-drawing-dialog input:disabled{opacity:.5}
.tb-command-scroll .tb-libero-button{background:#8350bb;color:white;min-width:40px;border-color:#7243a9;font-weight:800}.tb-libero-players{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}.tb-libero-players button{border-radius:50%;min-width:48px;min-height:48px;background:#2168a5;color:white}.tb-drawing-dialog h4{margin:18px 0 10px}
.tb-side-controls .tb-libero-button{background:#8350bb;color:white;min-width:36px;border-color:#7243a9;font-weight:800;margin-left:5px}.tb-drawing-dialog input[type=number]{display:block;width:100%;min-height:44px;border:1px solid #b5cdd9;border-radius:6px;background:white;color:#173f50;padding:8px;margin-top:5px;font:16px system-ui;box-sizing:border-box}
@media(max-width:650px){.tb-side-controls{display:grid;grid-template-columns:auto auto;justify-content:center}.tb-side-controls .tb-mini-rotation{grid-column:1;grid-row:1}.tb-side-controls .tb-libero-button{grid-column:2;grid-row:1;margin-left:3px}.tb-side-controls .tb-phases{grid-column:1/-1;grid-row:2;justify-content:center}}
.tb-expanded{position:fixed!important;inset:0!important;z-index:2500;width:100vw!important;height:100dvh!important;max-width:100vw!important;max-height:100dvh!important;padding:8px!important;margin:0!important;overflow:auto!important;background:#f0f8fc;box-sizing:border-box}.tb-orientation-hint{font:13px system-ui;color:#173f50;background:#e1f0f8;padding:6px 10px;margin:4px 0}.tb-expanded .tb-study-header{position:sticky!important;top:0!important}
/* Match each command group's centre to the court geometry, including SVG letterboxing. */
.tb-team-controls .tb-side-controls.tb-own{flex:var(--tb-own-weight,1) 1 0%;margin-left:0}.tb-team-controls .tb-side-controls.tb-opponent{flex:var(--tb-opponent-weight,1) 1 0%;margin-left:0}.tb-side-controls{flex-wrap:wrap}.tb-team-controls{box-sizing:border-box}
/* Compact drawing settings fit a phone without the manual angle field. */
.tb-drawing-dialog:has(.tb-drawing-footer){padding:14px}.tb-drawing-dialog:has(.tb-drawing-footer) header{margin-bottom:10px}.tb-drawing-dialog:has(.tb-drawing-footer) h3{font-size:21px}.tb-drawing-dialog:has(.tb-drawing-footer) .tb-drawing-types{gap:6px;margin-bottom:12px}.tb-drawing-dialog:has(.tb-drawing-footer) .tb-drawing-types button{padding:6px;min-height:60px;font-size:13px}.tb-drawing-dialog:has(.tb-drawing-footer) .tb-drawing-types span{font-size:23px;line-height:25px}.tb-drawing-dialog:has(.tb-drawing-footer) .tb-drawing-fields{gap:8px 12px}.tb-drawing-dialog:has(.tb-drawing-footer) .tb-drawing-fields label{margin-bottom:4px}.tb-drawing-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px}.tb-drawing-footer .tb-check{margin:0;gap:5px;font-size:12px;line-height:1.2}.tb-drawing-footer input[type=checkbox]{flex:none;width:18px;height:18px}.tb-drawing-footer .tb-drawing-done{margin-left:auto;padding:8px 10px}
@media(orientation:landscape) and (max-height:600px){.tb-drawing-dialog:has(.tb-drawing-footer){width:min(820px,calc(100vw - 24px));max-height:calc(100dvh - 16px);padding:12px}.tb-drawing-dialog:has(.tb-drawing-footer) .tb-drawing-types{grid-template-columns:repeat(6,minmax(0,1fr));margin-bottom:8px}.tb-drawing-dialog:has(.tb-drawing-footer) .tb-drawing-fields{grid-template-columns:repeat(4,minmax(0,1fr))}.tb-drawing-footer{margin-top:8px}}
@media(max-width:360px){.tb-drawing-footer{flex-wrap:wrap}.tb-drawing-footer .tb-drawing-done{margin:0 auto}}
.tb-court [data-shape-hit]{cursor:move;outline:none}.tb-court [data-shape-rotate]{cursor:grab;outline:none}.tb-court [data-shape-resize]{cursor:crosshair;outline:none}.tb-court [data-shape-resize]:focus-visible,.tb-court [data-shape-rotate]:focus-visible{stroke:#dc8c14;stroke-width:1}

/* Icon commands retain clear names for keyboard and screen-reader users. */
.tb-command-scroll .tb-icon-button{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;min-width:44px;width:44px;height:44px;min-height:44px;padding:9px;font-weight:800}
.tb-icon-button svg{display:block;width:23px;height:23px;pointer-events:none;flex:none}
.tb-command-scroll button:disabled{opacity:.38;cursor:default}
.tb-command-scroll [data-erase-shape]:not(:disabled){color:#9c3434;border-color:#c77777;background:#fff5f5}
