:root,:root[data-theme=dark]{color-scheme:dark;--bg:#0b1220;--panel:#141d30;--panel2:#1c2742;--ink:#eef3ff;--mut:#8fa0c4;--line:var(--line);--field:var(--field);--fieldline:var(--fieldline);--hdr2:#16244a;--acc:#21d07a;--acc2:#ffb020;--red:#ff4d5e;--blue:#3d8bff;--brand:#EE334E;--brand-ink:#FF6B7D;--on-brand:#ffffff;--r:16px}
:root[data-theme=light]{color-scheme:light;--bg:#f6f7fb;--panel:#ffffff;--panel2:#eceff6;--ink:#111827;--mut:#4b5563;--line:#d5dae6;--field:#ffffff;--fieldline:#b8c0d4;--hdr2:#fde8eb;--acc:#0b7a45;--acc2:#b45309;--red:#c8102e;--blue:#1d5fd1;--brand:#EE334E;--brand-ink:#B3132B;--on-brand:#ffffff}
:root[data-theme=light] header{background:linear-gradient(90deg,var(--panel),var(--hdr2))}:root[data-theme=light] .hero{color:#fff}:root[data-theme=light] .btn.pri,:root[data-theme=light] nav#tabs button.play span{color:#fff}
:root[data-theme=light] .playcard,:root[data-theme=light] .libcard{color:#fff}:root[data-theme=light] .msg.me{background:#d6f5e4}:root[data-theme=light] .msg.ann{background:#fff4dc}:root[data-theme=light] .btn.red{color:#fff}
.brandlogo{width:28px;height:28px;border-radius:6px;vertical-align:middle;margin-right:6px}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.35 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
header{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:10px 16px;background:linear-gradient(90deg,var(--bg),var(--hdr2));border-bottom:1px solid var(--line)}
.brand b{font-size:20px;letter-spacing:.5px;font-style:italic;text-transform:uppercase}.brand small{color:var(--mut);margin-left:8px}
body{min-height:100dvh;overflow-x:clip}
main{max-width:1100px;margin:0 auto;padding:14px 14px calc(110px + env(safe-area-inset-bottom));min-height:100dvh;-webkit-overflow-scrolling:touch}
nav#tabs{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;background:var(--field);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom);z-index:6}
nav#tabs button{flex:1;max-width:160px;background:none;border:0;color:var(--mut);padding:8px 0 10px;font-weight:700;font-size:12px;cursor:pointer}
nav#tabs button span{display:block;font-size:24px}nav#tabs button.on{color:var(--acc)}
nav#tabs button.play span{background:var(--acc);color:#04210f;border-radius:50%;width:56px;height:56px;line-height:56px;margin:-26px auto 2px;box-shadow:0 4px 18px #21d07a66;font-size:28px}
h2{margin:6px 0 12px;font-size:22px;text-transform:uppercase;font-style:italic}h3{margin:4px 0 8px;font-size:16px;color:var(--mut);text-transform:uppercase;letter-spacing:.5px}
.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.cols{display:grid;gap:14px}@media(min-width:900px){.cols{grid-template-columns:1.2fr 1fr}}
.card{background:var(--panel);border-radius:var(--r);padding:14px;border:1px solid var(--line)}
.hero{background:linear-gradient(135deg,#1d3b8a,#0f6e4a);border:0}.hero .big{font-size:26px;font-weight:800}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:48px;padding:10px 16px;border-radius:12px;border:0;background:var(--panel2);color:var(--ink);font-weight:700;font-size:15px;cursor:pointer}
.btn.pri{background:var(--acc);color:#04210f}.btn.warn{background:var(--acc2);color:#2a1a00}.btn.red{background:var(--red)}.btn.sm{min-height:36px;padding:6px 10px;font-size:13px}
.btn.on{outline:3px solid var(--acc)}.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.action{display:flex;gap:10px;align-items:center;padding:12px;border-radius:12px;background:var(--panel2);margin-bottom:8px;cursor:pointer}.action b{font-size:22px}
.av{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;flex:none}
.pl{display:flex;gap:10px;align-items:center;padding:8px;border-radius:12px;background:var(--panel2);margin-bottom:6px}
#bench .pl{touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}
.pl.sel{outline:3px solid var(--acc2)}.pl .num{margin-left:auto;font-weight:900;font-size:20px;color:var(--acc2)}
.chips{display:flex;gap:6px;flex-wrap:wrap}.chip{padding:6px 10px;border-radius:999px;background:var(--panel2);font-size:13px;cursor:pointer}
svg.field{width:100%;max-height:70vh;display:block;border-radius:14px}svg.field.drawing{touch-action:none}
.mk circle{stroke:#fff;stroke-width:.4;cursor:pointer}.mk text{font-size:4px;font-weight:800;fill:#fff;text-anchor:middle;pointer-events:none}
.mk.drop circle{stroke:var(--acc2);stroke-width:1.6}
.playgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}@media(max-width:500px){.playgrid{grid-template-columns:repeat(2,1fr)}}
.playcard{aspect-ratio:1.3;border-radius:12px;background:linear-gradient(160deg,#25386b,#142347);display:flex;align-items:flex-end;padding:8px;font-weight:800;font-size:13px;cursor:pointer;border:2px solid transparent;text-transform:uppercase}
.playcard.on{border-color:var(--acc);background:linear-gradient(160deg,#137a4b,#0d3d2a)}
.tap{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}@media(min-width:700px){.tap{grid-template-columns:repeat(4,1fr)}}
.tap button{min-height:84px;font-size:18px;border-radius:16px;border:0;font-weight:800;color:#fff;cursor:pointer;background:#24407e}.tap button:active{transform:scale(.96);background:var(--acc)}
.score{font-size:48px;font-weight:900;text-align:center}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.cal div{min-height:64px;background:var(--panel2);border-radius:8px;padding:4px;font-size:11px}
.cal .h{min-height:0;background:none;text-align:center;color:var(--mut)}.cal .o{opacity:.35}.cal .t{outline:2px solid var(--acc)}
.ev{display:block;border-radius:4px;padding:1px 4px;margin-top:2px;color:#fff;font-size:10px;white-space:nowrap;overflow:hidden;cursor:pointer}
.practice{background:var(--blue)}.game{background:var(--red)}.event{background:#9b5de5}.tournament{background:var(--acc2);color:#000}
.evrow{display:flex;gap:10px;align-items:center;padding:10px;border-radius:12px;background:var(--panel2);margin-bottom:6px;cursor:pointer}.evrow .bar{width:6px;align-self:stretch;border-radius:3px}
.msgs{max-height:55vh;overflow:auto;display:flex;flex-direction:column;gap:8px;padding:4px}
.msg{background:var(--panel2);padding:8px 12px;border-radius:14px;max-width:80%}.msg.me{align-self:flex-end;background:#1d5c3e}.msg small{color:var(--mut);display:block}
.msg.ann{max-width:100%;background:#3a2a05;border:1px solid var(--acc2)}
input,select,textarea{width:100%;min-height:44px;padding:8px 12px;border-radius:10px;border:1px solid var(--fieldline);background:var(--field);color:var(--ink);font-size:16px}
label{display:block;margin:8px 0 4px;color:var(--mut);font-size:13px}
#modal{position:fixed;inset:0;background:#000a;z-index:20;display:flex;align-items:flex-end;justify-content:center}#modal.hidden{display:none}
.sheet{background:var(--panel);width:100%;max-width:520px;max-height:90vh;overflow:auto;border-radius:20px 20px 0 0;padding:18px;position:relative}
@media(min-width:700px){#modal{align-items:center}.sheet{border-radius:20px}}
.close{position:absolute;right:10px;top:10px;background:none;border:0;color:var(--ink);font-size:22px;cursor:pointer}
.pcard{text-align:center;background:linear-gradient(160deg,#ffcc4d,#c78a00);color:#1a1000;border-radius:16px;padding:16px}.pcard .av{width:80px;height:80px;font-size:30px;margin:0 auto 8px}
.pcard .jn{font-size:40px;font-weight:900}.statg{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}.statg div{background:#0002;border-radius:8px;padding:6px;font-size:12px}.statg b{display:block;font-size:20px}
.icon{background:none;border:0;font-size:22px;cursor:pointer}.mut{color:var(--mut);font-size:13px}.hidden{display:none}
#toast{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);background:var(--acc);color:#04210f;padding:10px 18px;border-radius:999px;font-weight:800;opacity:0;transition:.3s;pointer-events:none;z-index:30}#toast.show{opacity:1}
.ghost{position:fixed;pointer-events:none;z-index:40;opacity:.85}
.qr{background:#fff;padding:12px;border-radius:12px;display:inline-block}.code{font-size:32px;font-weight:900;letter-spacing:6px;font-family:monospace}
.seg{display:inline-flex;background:var(--panel2);border-radius:12px;padding:3px}.seg button{border:0;background:none;color:var(--mut);padding:8px 14px;border-radius:10px;font-weight:700;cursor:pointer}.seg button.on{background:var(--acc);color:#04210f}
nav#tabs,header,.playcard,.tap{user-select:none;-webkit-user-select:none}
#bench{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:6px;max-height:320px;overflow:auto}#bench .pl{margin:0}

.ubadge{display:inline-block;padding:1px 7px;border-radius:6px;font-weight:800;font-size:12px}
.uhead{font-weight:800;text-transform:uppercase;margin:12px 0 6px;padding-left:8px;border-left:5px solid}
.pl.stripe{border-left:6px solid}.logo{flex:none;vertical-align:middle;object-fit:cover}#sportIcon{display:inline-flex;vertical-align:middle}
header{padding-top:calc(10px + env(safe-area-inset-top));padding-left:calc(16px + env(safe-area-inset-left));padding-right:calc(16px + env(safe-area-inset-right))}
nav#tabs{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
.btn.locked{background:#2a2f3d;color:#9aa;cursor:not-allowed;min-height:36px;font-size:13px;border:1px dashed #556}
.mk.mine circle{stroke:#fff;stroke-width:.9}.mk.mine text:last-child{fill:#F0E442}
.seg.sides{display:flex;flex-wrap:wrap;width:100%}.seg.sides button{flex:1;min-height:44px}
.meter{height:12px;background:var(--field);border-radius:6px;overflow:hidden;margin:6px 0}.meter div{height:100%}
table.rot{border-collapse:separate;border-spacing:3px;font-size:12px;width:100%}table.rot th{color:var(--mut);font-size:11px}table.rot td{background:var(--panel2);border-radius:6px;padding:6px 4px;text-align:center;white-space:nowrap;cursor:pointer;font-weight:700}table.rot td:first-child{text-align:left;cursor:default;background:none}table.rot .live{outline:2px solid #fff}
.mk{transition:transform .6s cubic-bezier(.3,.7,.2,1)}.mk.moving{transition:transform .7s linear}
#proutes.draw .rt{stroke-dasharray:200;stroke-dashoffset:200;animation:drawrt .9s ease-out forwards}@keyframes drawrt{to{stroke-dashoffset:0}}
.playcard{aspect-ratio:auto;flex-direction:column;align-items:stretch;gap:4px;padding:6px}.playcard .thumb{width:100%;height:64px;border-radius:6px;background:#0003}
.seg.cats{display:flex;flex-wrap:wrap}.legend{gap:10px;font-size:11px;color:var(--mut);margin-top:6px}.legend i{display:inline-block;width:14px;height:4px;margin-right:4px;vertical-align:middle}
@media(max-width:899px){.fieldcard{position:sticky;top:52px;z-index:3;padding:8px;box-shadow:0 8px 20px #000a}.fieldcard svg.field{max-height:36vh;width:auto;margin:0 auto}.fieldcard .legend{display:none}}
.transport{display:flex;gap:6px;align-items:center;margin-top:8px}.transport input[type=range]{flex:1;min-height:0;padding:0}.transport select{width:auto;min-height:36px;padding:4px}
svg.field.anim .mk{transition:none}.myjob{margin-top:8px;padding:10px;border-radius:10px;background:#3a3205;border:1px solid #F0E442}
.tools{gap:6px;margin-top:8px}.playcard small{font-size:10px;color:#bcd;font-weight:600;text-transform:none}
#modal.wide .sheet{max-width:980px}.libgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}.libcard{background:linear-gradient(160deg,#25386b,#142347);border-radius:12px;padding:8px;cursor:pointer;display:flex;flex-direction:column;gap:4px;font-size:13px}
.libcard .thumb.big{width:100%;height:150px}.libcard .mk,.thumb .mk{transition:none}svg.field.full{max-height:62vh}
#print{position:fixed;inset:0;background:#fff;color:#000;z-index:50;overflow:auto;padding:16px}#print .pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}#print.band .pgrid{grid-template-columns:repeat(4,1fr);gap:0}
#print .pcell{border:1px solid #000;padding:6px;display:flex;flex-direction:column;gap:4px;font-size:13px}#print.band .pcell{flex-direction:row;font-size:11px;padding:3px}#print .thumb{height:90px;background:#1f8a4c;border-radius:4px}.phead{font-size:16px;margin-bottom:8px;display:flex;align-items:center;gap:6px}
@media print{body>*:not(#print){display:none!important}#print{position:static}.noprint{display:none}}
.toolscard{margin-top:10px}@media(max-width:899px){.fieldcard svg.field{max-height:30vh}}
.filters{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:6px}.filters select{min-height:38px;font-size:14px}.sheet ul,.sheet ol{margin:4px 0 8px;padding-left:20px}
.hdot{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;font-size:11px;font-weight:900;flex:none;border:1px solid #000}
.pl .hdot{margin-left:-14px;margin-top:26px}.slegend{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:11px;color:var(--mut);margin-top:6px;align-items:center}.slegend b{color:var(--ink)}.slegend span{display:inline-flex;align-items:center;gap:4px}
/* full-screen viewer */
#modal.fs{align-items:stretch;justify-content:stretch;background:#05080f;z-index:60}
#modal.fs .sheet{max-width:none!important;width:100vw;height:100dvh;max-height:100dvh;border-radius:0;padding:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}
#modal.fs .close{position:fixed;top:max(8px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right));z-index:62;background:#0009;border-radius:50%;width:44px;height:44px;font-size:24px}
#modal.fs svg.field.full{display:block;width:100%;height:calc(100dvh - 150px);max-height:none;margin:0 auto}
#modal.fs .transport.overlay{position:sticky;bottom:0;z-index:61;background:#0b1220e6;padding:8px;border-radius:14px;backdrop-filter:blur(4px)}
#modal.fs .transport .btn{min-height:48px;min-width:48px;font-size:18px}
#modal.fs .libgrid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}#modal.fs .libcard .thumb.big{height:200px}
@media (orientation:landscape){#modal.fs svg.field.full{height:calc(100dvh - 90px)}}
/* bigger inline field */
.fieldcard svg.field{width:100%;max-height:78vh}
@media(max-width:899px){.fieldcard{position:static;box-shadow:none}.fieldcard svg.field{max-height:none;width:100%}}
/* no horizontal overflow */
html,body{max-width:100%;overflow-x:hidden}main,.card,.cols>*{min-width:0;max-width:100%}.cols{grid-template-columns:minmax(0,1fr)}@media(min-width:900px){.cols{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}}
.seg{max-width:100%;overflow-x:auto;scrollbar-width:none}.seg button{white-space:nowrap}.row{min-width:0}.row>*{min-width:0}
.transport{flex-wrap:wrap}.transport input[type=range]{min-width:120px}main h2{overflow-wrap:anywhere}.fieldcard .row b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
svg.field .mk .hit{fill:transparent}
.ghostbar{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:6px 0}.ghostbar select{flex:1;min-width:0;max-width:100%;min-height:44px}.ghostbar .btn{min-height:44px}
svg.field .mk circle.hit,.mk .hit{stroke:none!important}
#fullField .mk,#fullField .gmk{transition:none}#modal.fs .ghostbar{margin:4px 0}
#modal.fs .sheet:has(.ghostbar) svg.field.full{height:calc(100dvh - 205px)}@media (orientation:landscape){#modal.fs .sheet:has(.ghostbar) svg.field.full{height:calc(100dvh - 140px)}}
header .brand{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}header>span{white-space:nowrap;flex:none}@media(max-width:500px){.brand small{display:none}.brand b{font-size:17px}}
/* solid bottom nav (opaque, themed) */
:root,:root[data-theme=dark]{--nav-bg:#0e1628}:root[data-theme=light]{--nav-bg:#ffffff}
nav#tabs{background:var(--nav-bg)!important;opacity:1;z-index:40;isolation:isolate;border-top:1px solid var(--line);box-shadow:0 -4px 14px rgba(0,0,0,.18);padding-bottom:max(4px,env(safe-area-inset-bottom));backdrop-filter:none}
nav#tabs button.play span{position:relative;z-index:1;border:6px solid var(--nav-bg);box-sizing:content-box;margin-top:-32px}
nav#tabs button.play::before{content:"";position:absolute;left:50%;top:-22px;width:80px;height:40px;transform:translateX(-50%);background:var(--nav-bg);border-radius:40px 40px 0 0;border-top:1px solid var(--line);z-index:0}
nav#tabs button.play{position:relative}
main{padding-bottom:calc(140px + env(safe-area-inset-bottom))!important}
.playrow{display:flex;width:100%;min-height:56px;margin-top:10px;font-size:18px;letter-spacing:.5px;border-radius:14px;box-shadow:0 4px 14px rgba(33,208,122,.3)}
/* roles, referee, announcer, feed */
#modalBody .seg{flex-wrap:wrap;overflow:visible}#modalBody .seg button{flex:1 1 30%}
.rolegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.rolebtn{min-height:76px;border-radius:14px;border:2px solid var(--line);background:var(--panel2);color:var(--ink);font-weight:700;font-size:13px;cursor:pointer}.rolebtn span{display:block;font-size:26px}.rolebtn.on{border-color:var(--acc)}
.refsb .tm{text-align:center;flex:1}.refsb .tm b{display:block;font-size:40px;font-weight:900}.refsb small{color:var(--mut);display:block;font-size:12px}.refsb .clk{text-align:center}.refsb .clk b{font-size:30px;font-variant-numeric:tabular-nums}
.thumb-zone{margin-top:10px}.foulteam{display:flex;margin-bottom:6px}.foulteam button{flex:1}
.foulgrid,.scoregrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:8px}@media(min-width:700px){.foulgrid{grid-template-columns:repeat(4,1fr)}.scoregrid{grid-template-columns:repeat(4,1fr)}}
.fb{min-height:64px;border:0;border-radius:14px;background:var(--panel2);color:var(--ink);font-weight:800;font-size:15px;cursor:pointer;padding:6px}.fb:active{transform:scale(.97)}.fb.pri{background:var(--acc);color:#04210f}:root[data-theme=light] .fb.pri{color:#fff}.fb.sc{font-size:14px}
.board{background:#000;color:#fff;border-radius:18px;padding:16px;text-align:center}.board:fullscreen{display:flex;flex-direction:column;justify-content:center;border-radius:0}.bteams{display:flex;justify-content:space-between;align-items:center;gap:8px}.bteams>div{flex:1;min-width:0}.bteams small{display:block;font-size:14px;color:#cbd5e1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bteams b{font-size:clamp(44px,14vw,22vh);font-weight:900;line-height:1;font-variant-numeric:tabular-nums}.bmid b{font-size:clamp(22px,7vw,9vh)!important;color:#EE334E}.blast{margin-top:10px;font-size:clamp(14px,4vw,4vh);color:#F0E442}
.spec{padding:16px;max-width:900px;margin:auto}.spec .board{min-height:60vh;display:flex;flex-direction:column;justify-content:center}
.feed .fitem{padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}.feed .fitem small{display:block;color:var(--mut);font-size:11px}
.subgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.subp{min-height:56px;border-radius:12px;border:2px solid var(--line);background:var(--panel2);color:var(--ink);cursor:pointer;font-size:12px}.subp b{display:block;font-size:16px}.subp.out{border-color:var(--red);background:#ff4d5e33}
.chip.on{background:var(--acc);color:#04210f}
/* designer */
.dbar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:6px 0;font-size:13px}.dbar .btn.sm{min-height:44px}
.dcard{padding:6px}.dcard svg.dfield{max-height:none!important;width:100%;touch-action:manipulation}
.dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}.dthumb{background:var(--panel2);border-radius:12px;padding:6px;cursor:pointer;display:flex;flex-direction:column;gap:2px;font-size:13px}.dthumb svg{width:100%;height:120px;border-radius:8px}.dthumb small{color:var(--mut)}
@media(min-width:900px){.designer .dcard{max-width:520px}}
#modal{z-index:55}#modal.fs{z-index:60}#toast{z-index:70}
@media(min-width:700px){.designer .dcard svg.dfield{max-height:66vh!important;width:auto;height:66vh;margin:0 auto;display:block}}
#toast{bottom:calc(120px + env(safe-area-inset-bottom))!important}
.toolgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.toolbtn{min-height:64px;border-radius:12px;border:1px solid var(--line);background:var(--card2,var(--card));color:var(--ink);font:600 13px system-ui;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer}
.toolbtn span{font-size:22px}
.wxban{background:#b91c1c;color:#fff;border-radius:12px;padding:10px 12px;margin-bottom:10px;font-weight:700}
.wxban.warn{background:#b45309}
.od{color:#ef4444;font-weight:700}
.spstrip{display:flex;align-items:center;justify-content:center;gap:8px;padding:6px;margin-top:8px;border-top:1px solid var(--line);font-size:13px;opacity:.9}
.spstrip img{height:26px;max-width:90px;object-fit:contain}
.trmap{height:220px;border-radius:12px;overflow:hidden;margin:8px 0;background:var(--card2,#223)}
.kitbtn{display:block;width:100%;text-align:left;min-height:46px;margin:4px 0;padding:8px 12px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:15px system-ui}
.kitbtn.on{opacity:.7}
.fitem a{word-break:break-word}
.bmatch{border:1px solid var(--line);border-radius:10px;margin:6px 0;padding:4px 8px;background:var(--card)}
.bmatch>div{display:flex;justify-content:space-between;padding:4px 0;font-size:15px}
.bmatch>div+div{border-top:1px dashed var(--line)}
.bmatch .bw{font-weight:800;color:var(--ok,#22c55e)}
.tbl{width:100%;border-collapse:collapse;font-size:14px}.tbl td,.tbl th{padding:5px 4px;border-bottom:1px solid var(--line);text-align:left}
.tsc{min-width:36px;min-height:36px;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);font-weight:700}
.tsc.on{background:#EE334E;color:#fff;border-color:#EE334E}
.pbar{height:16px;border-radius:9px;background:var(--line);overflow:hidden;margin:8px 0}.pbar i{display:block;height:100%;background:linear-gradient(90deg,#22c55e,#16a34a)}
.tpanel{margin-bottom:12px}.tgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px;margin-top:8px}
.tcell{text-align:center;border:1px solid var(--line);border-radius:12px;padding:6px}.tcell b{display:block;font:800 30px ui-monospace,monospace;font-variant-numeric:tabular-nums}
.sconf{border-color:#ef4444!important;background:rgba(239,68,68,.12)}.ssel{outline:3px solid #EE334E}
.camwrap{position:relative;background:#000;border-radius:12px;overflow:hidden;aspect-ratio:16/9;max-width:100%}.camwrap video{width:100%;height:100%;object-fit:cover}.camwrap svg{position:absolute;inset:0;width:100%;height:100%}
.reel{position:relative;height:150px;border-radius:12px;background:linear-gradient(135deg,#0B1E3F,#EE334E);overflow:hidden;color:#fff}.rslide{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:30px;font-weight:800;opacity:0;animation:rs 1.2s both}.rslide:only-child{opacity:1;animation:none}.rslide small{font-size:14px;font-weight:600}@keyframes rs{0%{opacity:0;transform:scale(.8)}20%,80%{opacity:1;transform:scale(1)}100%{opacity:1}}
.cuehot{border:2px solid #EE334E}.lowc{border-color:#f59e0b!important;background:rgba(245,158,11,.12)}
.brow{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.bside{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1}
.tbadge{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;color:#fff;font-weight:900;letter-spacing:.5px;border:3px solid #fff;box-shadow:0 0 0 2px #000;flex:none;text-shadow:0 1px 2px #000}
.tbwrap{display:inline-flex;border-radius:50%;overflow:hidden;background:#fff;border:3px solid #fff;box-shadow:0 0 0 2px #000;flex:none}
.tlogo{width:100%;height:100%;object-fit:contain}
.hal{font-size:13px;font-weight:900;letter-spacing:2px;color:inherit}
.bsport{color:#EE334E;flex:none}
.swt{width:32px;height:32px;min-height:32px;border-radius:50%;border:2px solid var(--ink);padding:0}
/* #41 UX release: 44px targets, grouped tools, Play Book */
header .icon,.btn.sm,.btn.locked,.seg button,.chip,.toolbtn,.tgrph,.fb{min-height:44px;min-width:44px}
.chip{display:inline-flex;align-items:center}
.tgrp{border-top:1px solid var(--line,#ffffff22)}.tgrph{display:flex;width:100%;align-items:center;gap:8px;background:none;border:0;color:inherit;font:inherit;font-weight:700;padding:8px 2px;text-align:left}.tgrph span{flex:1}.tgrph small{opacity:.75}
@media(min-width:900px){.toolgrid{max-width:760px}}
.pbicon{vertical-align:middle}.playrow{gap:8px;align-items:center;justify-content:center}
nav#tabs button.play span{display:flex;align-items:center;justify-content:center;color:#fff}
nav#tabs button.play{font-size:11px;white-space:nowrap}
.tally{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:14px;margin:6px 0;width:100%}
.minusrow{flex-wrap:wrap;gap:6px}.minusrow .minus{flex:1;opacity:.9}
.ref-t{margin-top:10px}
:root[data-theme=light] .hdot{filter:saturate(1.3) brightness(.8)}
:root[data-theme=light] .num{color:#92400e}
input[type=checkbox]{min-width:44px!important;min-height:44px!important;accent-color:var(--acc)}
input[type=range]{min-height:44px}
select{min-height:44px}
#scrub,.transport input[type=range]{min-height:44px!important;height:44px!important}#speed,.transport select{min-height:44px!important;height:44px!important}
/* sheets sit above the tab bar and open at the top */
#modal{bottom:calc(76px + env(safe-area-inset-bottom))}
.sheet{max-height:calc(100dvh - 96px - env(safe-area-inset-bottom));overscroll-behavior:contain}
@media (min-width:900px){#modal{bottom:0}.sheet{max-height:90vh}}
.pill{display:inline-block;padding:2px 8px;border-radius:999px;background:var(--line);color:var(--ink);font-size:13px}
.hav{position:relative;display:inline-flex;flex:none;margin:3px}
.hico{position:absolute;right:-6px;bottom:-6px;min-width:18px;height:18px;padding:0 3px;border-radius:9px;font:800 12px/18px system-ui;font-style:normal;text-align:center;border:2px solid var(--bg,#fff);display:inline-block}
.h-green{background:#009E73;color:#fff}.h-yellow{background:#F0E442;color:#000}.h-red{background:#D55E00;color:#fff}.h-grey{background:#9AA0A6;color:#000}.h-greyred{background:repeating-linear-gradient(45deg,#9AA0A6 0 4px,#D55E00 4px 8px);color:#fff;text-shadow:0 0 2px #000}
#roster .hdot{display:none}
.ucoll{cursor:pointer;display:flex;align-items:center;gap:6px;min-height:44px}.ucoll::after{content:"▾";margin-left:auto;padding-right:8px}.ucoll[data-c="1"]::after{content:"▸"}
.hleg{margin:4px 0 8px;font-size:14px}.hleg summary{cursor:pointer;min-height:32px;font-weight:700}.hlrow{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:4px}.hlrow span{display:inline-flex;align-items:center;gap:4px}
.bci{display:inline-block;vertical-align:-.2em;flex:none}.bci .a,svg symbol .a{stroke:#EE334E}
symbol .a{stroke:#EE334E}symbol .f{fill:currentColor}symbol .a.f{fill:#EE334E}
#tabs .bci{width:24px;height:24px}
/* Play Book touch fixes */
#bench{max-height:none!important;overflow:visible!important}#bench .pl{touch-action:manipulation!important;cursor:pointer}
.row.tools .btn,.transport .btn,.playcard,#bench .pl{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.row.tools{gap:6px}.row.tools .btn{min-height:44px}
#psearch,.sheet input,.sheet select,.sheet textarea{font-size:16px}
#modal.fs{bottom:0}
#print{z-index:70}#print .pbar{position:sticky;top:-16px;margin:-16px -16px 10px;padding:10px 12px;background:#fff;border-bottom:1px solid #ddd;display:flex;gap:8px;align-items:center;z-index:2}
@media print{#print .pbar{display:none}}
/* Play Book sub-tabs (underline style) */
#view .seg.pbtabs{display:grid!important;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:0;padding:0;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;overflow:visible;width:100%}
#view .seg.pbtabs button{display:flex!important;flex-direction:column!important;flex:none!important;width:auto!important;align-items:center;justify-content:center;gap:3px;min-height:52px;min-width:0;padding:6px 2px;border:0;border-bottom:3px solid transparent;border-radius:0;background:transparent!important;color:var(--mut,#8a94a6);font-size:12.5px;font-weight:700;line-height:1.1;white-space:nowrap;box-shadow:none}
#view .seg.pbtabs button .bci{width:22px;height:22px}
#view .seg.pbtabs button .tl{max-width:100%;overflow:hidden;text-overflow:ellipsis}
#view .seg.pbtabs button.on{color:var(--txt,inherit)!important;border-bottom-color:#EE334E;background:transparent!important}
#view .seg.pbtabs button.hidden{display:none}
/* unit tabs + chips */
#view .seg.sides{display:flex;width:100%}#view .seg.sides button{flex:1 1 0;min-width:0;min-height:44px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13.5px;padding:8px 6px}
#view .seg.cats{display:flex;flex-wrap:nowrap;overflow-x:auto;max-width:100%;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent);padding-right:24px}
#view .seg.cats::-webkit-scrollbar{display:none}#view .seg.cats button{flex:0 0 auto;min-height:44px;white-space:nowrap}
#view .seg.pbtabs button.hidden{display:none!important}
#view .seg.pbtabs button .bci{display:block;margin:0 auto}#view .seg.pbtabs button .tl{display:block;text-align:center}
.hcoll>h3:first-child,.hcoll>h2:first-child,.hcoll h3[data-hc]{cursor:pointer;display:flex;align-items:center;gap:8px;min-height:44px;margin:0;flex-wrap:wrap}
.hcoll [data-hc]::after{content:"";margin-left:auto;width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .15s;order:9}
.hcoll.closed [data-hc]::after{transform:rotate(-45deg)}
.hcoll .hprev{flex-basis:100%;font-weight:500;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;order:10}.hcoll .hprev:empty{display:none}
.hcoll.closed>*:not(:has([data-hc])):not([data-hc]){display:none!important}
#view>.row.mut{font-size:13px;padding:2px 0}
.hcoll .hprev{text-transform:none;letter-spacing:0}
#devbar{position:fixed;top:calc(env(safe-area-inset-top) + 4px);left:50%;transform:translateX(-50%);z-index:80;display:flex;gap:8px;align-items:center;background:#7c3aed;color:#fff;padding:4px 10px;border-radius:999px;font-size:13px;box-shadow:0 2px 8px #0005;max-width:calc(100vw - 16px)}
#devbar select{font-size:16px;min-height:32px;border-radius:8px;margin-left:4px}#devbar button{background:transparent;color:#fff;border:1px solid #fff8;border-radius:8px;min-height:32px;padding:0 8px}
.ownerbox{display:block;margin:8px 0 12px}.ownerbox .btn{min-height:44px;position:static!important;transform:none!important}