:root{--bg:#04101a;--bg2:#071628;--panel:#0a1627;--line:rgba(255,255,255,.08);--text:#eef3f9;--muted:#9cb0c7;--accent:var(--mfe-custom-primary,#22c55e);--accent-dark:var(--mfe-custom-primary-dark,#16a34a);--danger:#ef4444;--warn:#f59e0b;--shadow:0 20px 50px rgba(0,0,0,.34);color-scheme:dark;color-scheme:dark;}
*{box-sizing:border-box} html,body{width:100%;min-height:100%;margin:0} body{font-family:Arial,Helvetica,sans-serif;color:var(--text);background:radial-gradient(circle at 15% 12%,rgba(34,197,94,.10),transparent 24%),radial-gradient(circle at 86% 10%,rgba(59,130,246,.10),transparent 24%),linear-gradient(145deg,var(--bg),var(--bg2) 58%,#020814);overflow:hidden} button,input,select,textarea{font:inherit} a{color:inherit;text-decoration:none}
.live-app{height:100svh;width:100%;display:grid;grid-template-rows:auto 1fr;gap:10px;padding:10px;overflow:hidden}
.live-top{min-height:70px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.025));box-shadow:var(--shadow);display:grid;grid-template-columns:minmax(220px,1fr) auto;gap:10px;align-items:center;padding:10px 14px;overflow:hidden}
.live-title{display:flex;align-items:center;gap:12px;min-width:0} .live-logo{width:44px;height:44px;border-radius:14px;object-fit:cover;flex:none} h1{font-size:clamp(22px,2.2vw,32px);line-height:1.02;margin:0;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .live-sub{font-size:12px;color:var(--muted);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-actions{display:flex;gap:8px;align-items:center;justify-content:flex-end;min-width:0;flex-wrap:nowrap}
.btn,.select,.input,.textarea{border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.045);color:var(--text);border-radius:14px;outline:none} .btn{min-height:40px;padding:0 13px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;cursor:pointer;white-space:nowrap} .btn.primary{border-color:rgba(34,197,94,.30);background:linear-gradient(180deg,rgba(34,197,94,.26),rgba(22,163,74,.17))} .btn.danger{border-color:rgba(239,68,68,.30);background:rgba(239,68,68,.13)} .btn.warn{border-color:rgba(245,158,11,.30);background:rgba(245,158,11,.13)} .select,.input{height:40px;padding:0 12px;min-width:0} .textarea{min-height:70px;padding:10px 12px;resize:vertical;width:100%}
.live-grid{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:10px;overflow:hidden}
.console{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:10px;overflow:hidden}
.panel,.clock-card{border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.022));box-shadow:var(--shadow);overflow:hidden}
.clock-card{padding:10px 12px;display:grid;grid-template-columns:210px minmax(220px,1fr) auto;gap:10px;align-items:center} .clock-label,.kicker{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#8de5ad;font-weight:950} .clock-value{font-size:clamp(40px,6vw,74px);font-weight:950;line-height:.9;text-align:center} .clock-controls{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.field-card{min-height:0;padding:10px;display:grid;grid-template-rows:auto minmax(0,1fr);gap:8px;overflow:hidden} .card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px} .card-title{font-size:20px;font-weight:950;margin:2px 0 0} .hint{font-size:12px;color:var(--muted);line-height:1.35;margin-top:4px;max-width:860px}.pitch-stage{min-height:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:24px;background:radial-gradient(circle at 50% 50%,rgba(34,197,94,.10),transparent 58%)}
.pitch-board{position:relative;height:100%;width:auto;aspect-ratio:105/68;max-width:100%;min-height:0;border-radius:24px;overflow:hidden;border:1px solid rgba(187,247,208,.32);background:linear-gradient(90deg,rgba(14,100,48,.98),rgba(21,128,61,.96) 48%,rgba(16,107,50,.98));box-shadow:inset 0 0 0 2px rgba(255,255,255,.065),inset 0 0 60px rgba(2,6,23,.18),0 18px 42px rgba(0,0,0,.22);cursor:crosshair;touch-action:manipulation}
.pitch-board .grass{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 7.14%,rgba(0,0,0,.025) 7.14% 14.28%);mix-blend-mode:soft-light}.pitch-board:before{content:"";position:absolute;inset:5%;border:2px solid rgba(255,255,255,.58);border-radius:10px;pointer-events:none}.pitch-board:after{content:"";position:absolute;left:50%;top:5%;bottom:5%;width:2px;background:rgba(255,255,255,.58);transform:translateX(-50%);pointer-events:none}.center-circle{position:absolute;left:50%;top:50%;width:17.45%;aspect-ratio:1;border:2px solid rgba(255,255,255,.56);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}.center-spot,.penalty-spot{position:absolute;width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.68);transform:translate(-50%,-50%);pointer-events:none}.center-spot{left:50%;top:50%}.penalty-spot.left{left:15.5%;top:50%}.penalty-spot.right{left:84.5%;top:50%}.penalty-box{position:absolute;top:20.35%;width:16.5%;height:59.3%;border:2px solid rgba(255,255,255,.50);pointer-events:none}.penalty-box.left{left:5%;border-left:none}.penalty-box.right{right:5%;border-right:none}.six-box{position:absolute;top:36.55%;width:5.25%;height:26.9%;border:2px solid rgba(255,255,255,.48);pointer-events:none}.six-box.left{left:5%;border-left:none}.six-box.right{right:5%;border-right:none}.goal{position:absolute;top:44.8%;width:1.8%;height:10.4%;border:2px solid rgba(255,255,255,.46);pointer-events:none}.goal.left{left:3.2%;border-right:none}.goal.right{right:3.2%;border-left:none}.penalty-arc{position:absolute;top:36.2%;width:17.4%;height:27.0%;border:2px solid rgba(255,255,255,.42);border-radius:50%;pointer-events:none}.penalty-arc.left{left:5.8%;clip-path:inset(0 0 0 50%)}.penalty-arc.right{right:5.8%;clip-path:inset(0 50% 0 0)}.corner-arc{position:absolute;width:26px;height:26px;border:2px solid rgba(255,255,255,.38);pointer-events:none}.corner-arc.tl{left:5%;top:5%;border-right:none;border-bottom:none;border-radius:10px 0 0 0}.corner-arc.tr{right:5%;top:5%;border-left:none;border-bottom:none;border-radius:0 10px 0 0}.corner-arc.bl{left:5%;bottom:5%;border-right:none;border-top:none;border-radius:0 0 0 10px}.corner-arc.br{right:5%;bottom:5%;border-left:none;border-top:none;border-radius:0 0 10px 0}
.event-marker{position:absolute;transform:translate(-50%,-50%);width:24px;height:24px;border-radius:50%;background:#86efac;color:#04101a;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:950;z-index:6;border:2px solid rgba(4,16,26,.62);box-shadow:0 0 0 4px rgba(134,239,172,.18);cursor:pointer}
.tags-drawer{padding:12px;display:none;grid-template-rows:auto auto minmax(0,1fr);gap:10px;min-height:0;max-height:36vh} .tags-drawer.open{display:grid} .tag-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.75fr) auto;gap:8px} .tag-groups{min-height:0;overflow:auto;display:grid;gap:10px;padding-right:4px} .tag-group{display:grid;gap:8px} .tag-group-title{font-size:12px;color:#8de5ad;font-weight:950;letter-spacing:.08em;text-transform:uppercase} .tag-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px} .tag-wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px;align-items:center} .tag-btn,.player-choice{min-height:42px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:var(--text);font-size:12px;font-weight:950;text-align:left;padding:8px 10px;cursor:pointer} .tag-btn.is-selected,.player-choice.is-selected{border-color:rgba(34,197,94,.35);background:rgba(34,197,94,.16)} .tag-tools{display:flex;gap:3px} .mini{width:28px;height:28px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:var(--text);cursor:pointer}
.side{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:10px;align-content:start;overflow:hidden} .event-card{padding:12px;display:flex;flex-direction:column;gap:10px;min-height:0} .event-list{min-height:0;overflow:auto;display:grid;gap:8px;padding-right:4px} .event-item{border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.035);border-radius:16px;padding:10px;display:grid;gap:8px} .event-main{display:flex;gap:10px;align-items:flex-start;justify-content:space-between} .event-time{font-size:18px;font-weight:950;color:#86efac;white-space:nowrap} .event-text{min-width:0;flex:1} .event-tag{font-weight:950} .event-meta{font-size:12px;color:var(--muted);line-height:1.35;margin-top:3px} .event-row-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap} .event-row-actions .btn{min-height:30px;font-size:11px;padding:0 9px;border-radius:10px} .status{font-size:12px;color:var(--muted);line-height:1.4;min-height:18px} .status.error{color:#fecaca}
.overlay{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(2,8,20,.72);backdrop-filter:blur(12px)} .overlay.open{display:flex} .overlay-card{width:min(1180px,calc(100vw - 28px));max-height:calc(100svh - 28px);border:1px solid rgba(255,255,255,.10);border-radius:28px;background:linear-gradient(180deg,rgba(10,22,39,.98),rgba(4,16,26,.98));box-shadow:0 30px 90px rgba(0,0,0,.55);display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:12px;padding:14px;overflow:hidden} .overlay-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px} .overlay-title{font-size:24px;font-weight:950;margin:2px 0} .overlay-grid{min-height:0;display:grid;grid-template-columns:1.15fr .85fr;gap:12px;overflow:hidden} .overlay-section{min-height:0;border:1px solid rgba(255,255,255,.07);border-radius:20px;background:rgba(255,255,255,.03);padding:12px;overflow:hidden;display:flex;flex-direction:column;gap:10px} .overlay-scroll{min-height:0;overflow:auto;display:grid;gap:10px;padding-right:4px} .player-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .event-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px} .event-fields .full{grid-column:1/-1} .overlay-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.blocked{height:100svh;display:flex;align-items:center;justify-content:center;padding:20px;text-align:center} .blocked-card{max-width:620px;border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:28px;padding:28px;box-shadow:var(--shadow)}
@media(hover:hover){.btn,.tag-btn,.player-choice{transition:transform .18s ease,filter .18s ease,box-shadow .18s ease}.event-marker{transition:filter .18s ease,box-shadow .18s ease}.btn:hover,.tag-btn:hover,.player-choice:hover{transform:translateY(-1px);filter:brightness(1.06)}.event-marker:hover{transform:translate(-50%,-50%);filter:brightness(1.06)}}
@media(max-width:1180px){body{overflow:auto} .live-app{height:auto;min-height:100svh;overflow:visible} .live-grid{grid-template-columns:1fr;overflow:visible} .console{grid-template-rows:auto minmax(520px,72svh) auto;overflow:visible} .pitch-board{height:min(72svh,640px);min-height:0} .side{overflow:visible} .event-list{max-height:440px} .tag-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.live-app{padding:8px;gap:8px} .live-top{grid-template-columns:1fr;padding:10px;border-radius:22px} .live-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%} .live-actions .btn,.live-actions .select{width:100%;min-width:0} .clock-card{grid-template-columns:1fr;text-align:center;border-radius:22px} .clock-controls{display:grid;grid-template-columns:1fr 1fr;width:100%} .console{grid-template-rows:auto minmax(640px,80svh) auto} .pitch-stage{align-items:stretch}.pitch-board{width:100%;height:auto;aspect-ratio:68/105;min-height:640px;border-radius:20px}.pitch-board .grass{background:repeating-linear-gradient(180deg,rgba(255,255,255,.035) 0 7.14%,rgba(0,0,0,.025) 7.14% 14.28%)} .pitch-board:after{left:5%;right:5%;top:50%;height:2px;width:auto;bottom:auto;transform:translateY(-50%)} .center-circle{width:26%;} .penalty-box{left:20.35%!important;right:auto!important;width:59.3%;height:16.5%}.penalty-box.left{top:5%;border-left:2px solid rgba(255,255,255,.50);border-top:none}.penalty-box.right{top:auto;bottom:5%;border-right:2px solid rgba(255,255,255,.50);border-bottom:none}.six-box{left:36.55%!important;right:auto!important;width:26.9%;height:5.25%}.six-box.left{top:5%;border-left:2px solid rgba(255,255,255,.48);border-top:none}.six-box.right{top:auto;bottom:5%;border-right:2px solid rgba(255,255,255,.48);border-bottom:none}.goal{left:44.8%!important;right:auto!important;width:10.4%;height:1.8%}.goal.left{top:3.2%;border-right:2px solid rgba(255,255,255,.46);border-bottom:none}.goal.right{top:auto;bottom:3.2%;border-left:2px solid rgba(255,255,255,.46);border-top:none}.penalty-spot.left{left:50%;top:15.5%}.penalty-spot.right{left:50%;top:84.5%}.penalty-arc{left:36.55%!important;right:auto!important;width:26.9%;height:17.42%}.penalty-arc.left{top:6.79%;clip-path:inset(84.45% 0 0 0)}.penalty-arc.right{top:auto;bottom:6.79%;clip-path:inset(0 0 84.45% 0)}.corner-arc.tl{left:5%;top:5%}.corner-arc.tr{right:5%;top:5%}.corner-arc.bl{left:5%;bottom:5%}.corner-arc.br{right:5%;bottom:5%} .card-head{display:grid} .tag-form{grid-template-columns:1fr} .tag-grid{grid-template-columns:1fr} .overlay{padding:8px;align-items:stretch} .overlay-card{width:100%;max-height:none;height:calc(100svh - 16px);border-radius:22px} .overlay-grid{grid-template-columns:1fr;overflow:auto} .overlay-section{min-height:260px} .player-grid{grid-template-columns:1fr} .event-fields{grid-template-columns:1fr} h1{white-space:normal}}

.select option{background:#0a1627;color:#eef3f9}.overlay-zone-readonly{min-height:50px;padding:0 16px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);display:flex;align-items:center;font-weight:800;color:#dbeafe}.sub-card{display:grid;gap:14px}.sub-grid{display:grid;grid-template-columns:1fr;gap:10px}.field-card.is-tags-open .pitch-stage{display:none}.tags-drawer{display:none}.tags-drawer.open{display:grid;min-height:560px}.overlay-grid{grid-template-columns:1.25fr .95fr}.overlay-section .event-fields{display:grid;grid-template-columns:1fr;gap:12px}@media (max-width:1100px){.overlay-grid{grid-template-columns:1fr}}


/* v5 live tagging refinements */
.side{grid-template-rows:auto minmax(0,1fr)!important;align-content:start!important;}
.sub-card{padding:12px 14px!important;gap:8px!important;align-self:start!important;height:auto!important;min-height:0!important;max-height:none!important;}
.sub-card .card-head{display:flex!important;align-items:flex-start!important;gap:8px!important;}
.sub-card .card-title{font-size:17px!important;line-height:1.12!important;margin:0!important;}
.sub-card .kicker{font-size:10px!important;}
.sub-grid{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;align-items:stretch!important;}
.sub-card .select{width:100%!important;height:38px!important;min-height:38px!important;font-size:13px!important;border-radius:13px!important;}
.sub-card .btn{width:100%!important;min-height:38px!important;font-size:13px!important;border-radius:13px!important;}
.sub-card .status{min-height:13px!important;font-size:11px!important;margin-top:0!important;}
.event-card{min-height:0!important;}
.event-list{min-height:0!important;}
.penalty-arc{top:36.55%!important;width:17.42%!important;height:26.9%!important;border-color:rgba(255,255,255,.48)!important;}
.penalty-arc.left{left:6.79%!important;clip-path:inset(0 0 0 84.45%)!important;}
.penalty-arc.right{right:6.79%!important;clip-path:inset(0 84.45% 0 0)!important;}
@media(max-width:900px){.side{grid-template-rows:auto auto!important}.sub-card .card-title{font-size:16px!important;}}

/* v6 timeline alignment */
.live-grid{align-items:stretch!important;}
.console{height:100%!important;}
.side{height:100%!important;max-height:100%!important;align-self:stretch!important;grid-template-rows:var(--live-clock-row, auto) minmax(0,1fr)!important;}
.sub-card{align-self:start!important;justify-self:stretch!important;}
.event-card{height:100%!important;min-height:0!important;align-self:stretch!important;}


/* v8 side alignment fix */
.live-grid{align-items:stretch!important;}
.console{height:100%!important;min-height:0!important;}
.side{height:100%!important;max-height:100%!important;align-self:stretch!important;display:grid!important;grid-template-rows:auto minmax(0,1fr)!important;align-content:stretch!important;gap:10px!important;overflow:hidden!important;}
.sub-card{position:relative!important;z-index:2!important;align-self:start!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:hidden!important;}
.event-card{position:relative!important;z-index:1!important;height:auto!important;min-height:0!important;align-self:stretch!important;overflow:hidden!important;}
.event-list{min-height:0!important;overflow-y:auto!important;}


/* v11 theme + timeline scrollbar + export modal */
.event-list::-webkit-scrollbar,.tag-groups::-webkit-scrollbar,.overlay-scroll::-webkit-scrollbar{width:10px}
.event-list::-webkit-scrollbar-track,.tag-groups::-webkit-scrollbar-track,.overlay-scroll::-webkit-scrollbar-track{background:rgba(255,255,255,.04);border-radius:999px}
.event-list::-webkit-scrollbar-thumb,.tag-groups::-webkit-scrollbar-thumb,.overlay-scroll::-webkit-scrollbar-thumb{background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 42%, transparent), rgba(255,255,255,.12));border-radius:999px;border:2px solid transparent;background-clip:padding-box}
.event-list,.tag-groups,.overlay-scroll{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--accent) 45%, rgba(255,255,255,.12)) rgba(255,255,255,.04)}
.live-export-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(2,6,23,.68);backdrop-filter:blur(10px);z-index:1300;padding:24px}
.live-export-modal.open{display:flex}
.live-export-card{width:min(560px,calc(100vw - 32px));border-radius:24px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(180deg,#0f172a 0%,#020617 100%);box-shadow:0 28px 70px rgba(0,0,0,.45);padding:22px;color:#e5e7eb;display:grid;gap:16px}
.live-export-kicker{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#86efac;font-weight:950}
.live-export-title{font-size:24px;line-height:1.1;font-weight:950;margin:0}
.live-export-copy{color:#9ca3af;font-size:13px;line-height:1.45;margin:0}
.live-export-grid{display:grid;gap:10px}
.live-export-check{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.035);border-radius:16px;font-weight:800;color:#dbeafe}
.live-export-check input{width:18px;height:18px;accent-color:var(--accent)}
.live-export-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.live-export-modal .input{width:100%;height:44px;background:rgba(255,255,255,.045);border-radius:16px}
@media(max-width:640px){.live-export-actions{display:grid;grid-template-columns:1fr}.live-export-actions .btn{width:100%}}


/* v22 mobile pitch + tag manager overlay */
.tags-overlay{position:fixed;inset:0;z-index:1250;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(2,8,20,.72);backdrop-filter:blur(12px)}
.tags-overlay.open{display:flex}
.tags-overlay .tags-drawer{width:min(920px,calc(100vw - 28px));max-height:calc(100svh - 28px);min-height:min(560px,calc(100svh - 28px));display:grid!important;grid-template-rows:auto auto minmax(0,1fr);gap:12px;padding:14px;border:1px solid rgba(255,255,255,.10);border-radius:28px;background:linear-gradient(180deg,rgba(10,22,39,.98),rgba(4,16,26,.98));box-shadow:0 30px 90px rgba(0,0,0,.55);overflow:hidden}
.tags-overlay .card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.tags-overlay .tag-groups{min-height:0;max-height:none;overflow:auto}
.field-card.is-tags-open .pitch-stage{display:flex!important}
@media(max-width:760px){
  .console{grid-template-rows:auto auto auto!important}
  .field-card{grid-template-rows:auto auto!important;min-height:0!important}
  .pitch-stage{align-items:center!important;justify-content:center!important;height:auto!important;min-height:0!important;overflow:visible!important;padding:0!important}
  .pitch-board{width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:68/105!important;border-radius:20px!important}
  .penalty-arc{display:none!important}
  .tags-overlay{padding:8px;align-items:stretch}
  .tags-overlay .tags-drawer{width:100%;height:calc(100svh - 16px);max-height:none;min-height:0;border-radius:22px}
  .tags-overlay .tag-form{grid-template-columns:1fr!important}
  .tags-overlay .tag-grid{grid-template-columns:1fr!important}
}


/* v23 theme sync + canonical pitch coordinates */
html[data-mfe-theme="base"]{
  --accent:#22c55e;--accent-dark:#16a34a;--accent-rgb:34,197,94;
  --mfe-card-bg:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.022));
  --mfe-card-bg-strong:linear-gradient(180deg,rgba(10,22,39,.98),rgba(4,16,26,.98));
  --mfe-input-bg:rgba(255,255,255,.045);--mfe-input-border:rgba(255,255,255,.09);
  --mfe-scroll-track:rgba(255,255,255,.04);--mfe-scroll-thumb:rgba(34,197,94,.42);--mfe-scroll-thumb-hover:rgba(34,197,94,.62);
}
html[data-mfe-theme="light"]{
  color-scheme:light;
  --bg:#eef4f1;--bg2:#f8fafc;--panel:#ffffff;--line:rgba(15,23,42,.13);
  --text:#102018;--muted:#5b6b7c;--accent:#16a34a;--accent-dark:#15803d;--accent-rgb:22,163,74;
  --shadow:0 18px 42px rgba(15,23,42,.12);
  --mfe-card-bg:linear-gradient(180deg,rgba(255,255,255,.96),rgba(247,250,252,.90));
  --mfe-card-bg-strong:linear-gradient(180deg,rgba(255,255,255,1),rgba(241,245,249,.96));
  --mfe-input-bg:rgba(255,255,255,.96);--mfe-input-border:rgba(15,23,42,.16);
  --mfe-accent-bg:rgba(22,163,74,.12);--mfe-accent-bg-strong:rgba(22,163,74,.20);--mfe-accent-border:rgba(22,163,74,.30);--mfe-accent-text:#064e3b;
  --mfe-scroll-track:rgba(15,23,42,.05);--mfe-scroll-thumb:rgba(22,163,74,.40);--mfe-scroll-thumb-hover:rgba(22,163,74,.58);
}
html[data-mfe-theme="gray"]{
  color-scheme:dark;
  --bg:#111315;--bg2:#1d2024;--panel:#171a1f;--line:rgba(255,255,255,.09);
  --text:#f3f4f6;--muted:#a8b0bb;--accent:#d1d5db;--accent-dark:#9ca3af;--accent-rgb:209,213,219;
  --shadow:0 18px 42px rgba(0,0,0,.38);
  --mfe-card-bg:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  --mfe-card-bg-strong:linear-gradient(180deg,rgba(24,27,32,.98),rgba(13,15,18,.98));
  --mfe-input-bg:rgba(255,255,255,.05);--mfe-input-border:rgba(255,255,255,.11);
  --mfe-accent-bg:rgba(209,213,219,.10);--mfe-accent-bg-strong:rgba(209,213,219,.18);--mfe-accent-border:rgba(209,213,219,.26);--mfe-accent-text:#f8fafc;
  --mfe-scroll-track:rgba(255,255,255,.04);--mfe-scroll-thumb:rgba(209,213,219,.32);--mfe-scroll-thumb-hover:rgba(209,213,219,.50);
}
html[data-mfe-theme="custom"]{
  color-scheme:dark;
  --bg:#04101a;--bg2:#071628;--panel:#0a1627;--line:rgba(255,255,255,.08);
  --text:#eef3f9;--muted:#9cb0c7;--accent:var(--mfe-custom-primary,#22c55e);--accent-dark:var(--mfe-custom-primary-dark,#16a34a);--accent-rgb:var(--mfe-custom-primary-rgb,34,197,94);
  --mfe-card-bg:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.022));
  --mfe-card-bg-strong:linear-gradient(180deg,rgba(10,22,39,.98),rgba(4,16,26,.98));
  --mfe-input-bg:rgba(255,255,255,.045);--mfe-input-border:rgba(255,255,255,.09);
  --mfe-accent-bg:rgba(var(--accent-rgb),.12);--mfe-accent-bg-strong:rgba(var(--accent-rgb),.22);--mfe-accent-border:rgba(var(--accent-rgb),.30);--mfe-accent-text:#ffffff;
  --mfe-scroll-track:rgba(255,255,255,.04);--mfe-scroll-thumb:rgba(var(--accent-rgb),.42);--mfe-scroll-thumb-hover:rgba(var(--accent-rgb),.62);
}
html[data-mfe-theme] body{color:var(--text)!important;scrollbar-color:var(--mfe-scroll-thumb) var(--mfe-scroll-track)}
html[data-mfe-theme="light"] body{background:radial-gradient(circle at 15% 12%,rgba(22,163,74,.10),transparent 24%),radial-gradient(circle at 86% 10%,rgba(37,99,235,.08),transparent 24%),linear-gradient(145deg,var(--bg) 0%,var(--bg2) 58%,#e2e8f0 100%)!important}
html[data-mfe-theme="gray"] body{background:radial-gradient(circle at 15% 12%,rgba(209,213,219,.08),transparent 24%),radial-gradient(circle at 86% 10%,rgba(148,163,184,.08),transparent 24%),linear-gradient(145deg,var(--bg) 0%,var(--bg2) 58%,#090a0c 100%)!important}
html[data-mfe-theme="custom"] body{background:radial-gradient(circle at 15% 12%,rgba(var(--accent-rgb),.10),transparent 24%),radial-gradient(circle at 86% 10%,rgba(59,130,246,.10),transparent 24%),linear-gradient(145deg,var(--bg) 0%,var(--bg2) 58%,#020814 100%)!important}
html[data-mfe-theme]:not([data-mfe-theme="base"]) .live-top,
html[data-mfe-theme]:not([data-mfe-theme="base"]) .panel,
html[data-mfe-theme]:not([data-mfe-theme="base"]) .clock-card,
html[data-mfe-theme]:not([data-mfe-theme="base"]) .event-item,
html[data-mfe-theme]:not([data-mfe-theme="base"]) .overlay-section,
html[data-mfe-theme]:not([data-mfe-theme="base"]) .tags-overlay .tags-drawer,
html[data-mfe-theme]:not([data-mfe-theme="base"]) .overlay-card,
html[data-mfe-theme]:not([data-mfe-theme="base"]) .live-export-card,
html[data-mfe-theme]:not([data-mfe-theme="base"]) .game-settings-card{border-color:var(--line)!important;background:var(--mfe-card-bg)!important;color:var(--text)!important;box-shadow:var(--shadow)!important}
html[data-mfe-theme]:not([data-mfe-theme="base"]) .overlay-card,
html[data-mfe-theme]:not([data-mfe-theme="base"]) .tags-overlay .tags-drawer,
html[data-mfe-theme]:not([data-mfe-theme="base"]) .live-export-card,
html[data-mfe-theme]:not([data-mfe-theme="base"]) .game-settings-card{background:var(--mfe-card-bg-strong)!important}
html[data-mfe-theme] .btn,
html[data-mfe-theme] .select,
html[data-mfe-theme] .input,
html[data-mfe-theme] .textarea,
html[data-mfe-theme] .tag-btn,
html[data-mfe-theme] .player-choice,
html[data-mfe-theme] .mini,
html[data-mfe-theme] .live-export-check,
html[data-mfe-theme] .overlay-zone-readonly,
html[data-mfe-theme] .live-scoreboard,
html[data-mfe-theme] .settings-option span{background:var(--mfe-input-bg)!important;border-color:var(--mfe-input-border)!important;color:var(--text)!important}
html[data-mfe-theme] .btn.primary,
html[data-mfe-theme] .settings-option input:checked+span,
html[data-mfe-theme] .tag-btn.is-selected,
html[data-mfe-theme] .player-choice.is-selected{background:var(--mfe-accent-bg-strong,rgba(var(--accent-rgb),.20))!important;border-color:var(--mfe-accent-border,rgba(var(--accent-rgb),.30))!important;color:var(--mfe-accent-text,#fff)!important}
html[data-mfe-theme] .clock-label,
html[data-mfe-theme] .kicker,
html[data-mfe-theme] .tag-group-title,
html[data-mfe-theme] .live-export-kicker,
html[data-mfe-theme] .event-time{color:var(--accent)!important}
html[data-mfe-theme] .live-sub,
html[data-mfe-theme] .hint,
html[data-mfe-theme] .event-meta,
html[data-mfe-theme] .live-export-copy,
html[data-mfe-theme] .status{color:var(--muted)!important}
html[data-mfe-theme] .event-marker{background:color-mix(in srgb,var(--accent) 58%,white)!important;box-shadow:0 0 0 4px rgba(var(--accent-rgb),.18)!important}
html[data-mfe-theme] .pitch-stage{background:radial-gradient(circle at 50% 50%,rgba(var(--accent-rgb),.10),transparent 58%)!important}
html[data-mfe-theme] select option{background:var(--panel)!important;color:var(--text)!important}
html[data-mfe-theme] .live-export-check input{accent-color:var(--accent)!important}
html[data-mfe-theme] .event-list,
html[data-mfe-theme] .tag-groups,
html[data-mfe-theme] .overlay-scroll{scrollbar-width:thin!important;scrollbar-color:var(--mfe-scroll-thumb) var(--mfe-scroll-track)!important}
html[data-mfe-theme] .event-list::-webkit-scrollbar-track,
html[data-mfe-theme] .tag-groups::-webkit-scrollbar-track,
html[data-mfe-theme] .overlay-scroll::-webkit-scrollbar-track{background:var(--mfe-scroll-track)!important;border-radius:999px}
html[data-mfe-theme] .event-list::-webkit-scrollbar-thumb,
html[data-mfe-theme] .tag-groups::-webkit-scrollbar-thumb,
html[data-mfe-theme] .overlay-scroll::-webkit-scrollbar-thumb{background:var(--mfe-scroll-thumb)!important;border-radius:999px;border:2px solid transparent;background-clip:padding-box}
html[data-mfe-theme] .event-list::-webkit-scrollbar-thumb:hover,
html[data-mfe-theme] .tag-groups::-webkit-scrollbar-thumb:hover,
html[data-mfe-theme] .overlay-scroll::-webkit-scrollbar-thumb:hover{background:var(--mfe-scroll-thumb-hover)!important;background-clip:padding-box}
html[data-mfe-theme="light"] .pitch-board{border-color:rgba(22,163,74,.35);box-shadow:inset 0 0 0 2px rgba(255,255,255,.18),0 18px 42px rgba(15,23,42,.16)}


/* v25 player event filter */
.player-filter-card{padding:12px 14px!important;display:grid!important;gap:8px!important;align-self:start!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:hidden!important;position:relative!important;z-index:2!important}
.player-filter-card .card-head{display:flex!important;align-items:flex-start!important;gap:8px!important}
.player-filter-card .card-title{font-size:17px!important;line-height:1.12!important;margin:0!important}
.player-filter-card .kicker{font-size:10px!important}
.player-filter-grid{display:grid;grid-template-columns:1fr;gap:8px;align-items:stretch}
.player-filter-card .select{width:100%!important;height:38px!important;min-height:38px!important;font-size:13px!important;border-radius:13px!important}
.player-filter-card .status{min-height:13px!important;font-size:11px!important;margin-top:0!important}
.side{grid-template-rows:auto auto minmax(0,1fr)!important}
@media(max-width:900px){.side{grid-template-rows:auto auto auto!important}.player-filter-card .card-title{font-size:16px!important}}



/* v30 tag group colours + editable group colour UX */
.tag-group-title{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;flex-wrap:wrap!important}
.tag-group-name{display:inline-flex;align-items:center;gap:8px;min-width:0}
.tag-group-actions{display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end}.group-rename-btn{flex:0 0 auto}
.tag-color-dot{width:10px;height:10px;border-radius:999px;display:inline-flex;flex:0 0 auto;background:var(--tag-color,#94a3b8);box-shadow:0 0 0 3px var(--tag-color-ring,rgba(148,163,184,.18))}
.group-color-control{display:inline-flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:900}
.group-color-picker{appearance:none;-webkit-appearance:none;width:34px;height:28px;min-width:34px;padding:0!important;border-radius:10px;border:1px solid var(--mfe-input-border,rgba(255,255,255,.13))!important;background:var(--mfe-input-bg,rgba(255,255,255,.05))!important;cursor:pointer;overflow:hidden}
.group-color-picker::-webkit-color-swatch-wrapper{padding:3px}.group-color-picker::-webkit-color-swatch{border:0;border-radius:7px}.group-color-picker::-moz-color-swatch{border:0;border-radius:7px}
.tag-btn.mlt-colorized{border-color:var(--tag-color-border)!important;background:var(--tag-color-bg)!important;color:var(--tag-color-text,var(--text))!important;box-shadow:inset 3px 0 0 var(--tag-color)!important}
.tag-btn.mlt-colorized.is-selected{border-color:var(--tag-color)!important;background:var(--tag-color-bg-strong)!important;color:var(--tag-color-text,var(--text))!important;box-shadow:0 0 0 2px var(--tag-color-ring), inset 4px 0 0 var(--tag-color)!important}
.event-item.mlt-colorized{border-left:4px solid var(--tag-color)!important}
.event-marker{background:var(--event-color,color-mix(in srgb,var(--accent) 58%,white))!important;box-shadow:0 0 0 4px var(--event-ring,rgba(var(--accent-rgb),.18))!important;color:var(--event-text,#04101a)!important}
html[data-mfe-theme] .event-marker{background:var(--event-color,color-mix(in srgb,var(--accent) 58%,white))!important;box-shadow:0 0 0 4px var(--event-ring,rgba(var(--accent-rgb),.18))!important;color:var(--event-text,#04101a)!important}
.event-tag{display:flex;align-items:center;gap:8px}


/* v41 period buttons + played-time tracking */
.period-control{display:grid;gap:8px;min-width:0}
.period-buttons{display:grid;grid-template-columns:1fr;gap:6px;min-width:0}
.period-btn{min-height:34px;padding:0 10px;border-radius:12px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:var(--text);font-size:12px;font-weight:950;cursor:pointer;text-align:center;white-space:nowrap}
.period-btn.is-active{border-color:rgba(var(--accent-rgb,34,197,94),.36);background:linear-gradient(180deg,rgba(var(--accent-rgb,34,197,94),.22),rgba(var(--accent-rgb,34,197,94),.12));box-shadow:0 0 0 3px rgba(var(--accent-rgb,34,197,94),.10)}
.period-btn.is-running::after{content:' •';font-weight:950}
@media(max-width:760px){.period-buttons{grid-template-columns:1fr 1fr 1fr}.period-btn{white-space:normal;line-height:1.15;min-height:42px}.clock-card{gap:12px!important}}


/* Match score and canonical game settings */
.clock-settings{display:grid;gap:8px;min-width:0;align-self:center}
.clock-main{display:grid;gap:4px;justify-items:center;align-items:center;min-width:0}
.clock-match-strip{display:grid;grid-template-columns:max-content minmax(150px,1fr);gap:8px;align-items:stretch;width:min(430px,100%);height:32px;margin:0 auto}
.live-scoreboard{box-sizing:border-box;width:max-content;min-width:max-content;max-width:100%;height:32px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.045);border-radius:12px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 10px;white-space:nowrap}
.score-label{font-size:8px;line-height:1;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:950}
.score-value{display:inline-flex;align-items:center;gap:5px;font-size:19px;line-height:1;font-weight:950;color:var(--text)}
.score-value strong{min-width:13px;text-align:center}
.game-settings-btn{height:32px;min-height:32px!important;max-width:100%;overflow:hidden;text-overflow:ellipsis;font-size:12px!important;border-radius:12px!important;padding:0 11px!important}
@media(max-width:900px){.clock-card{grid-template-columns:1fr!important}.clock-settings{grid-template-columns:1fr;align-items:stretch}.clock-match-strip{width:min(360px,100%)}}
@media(max-width:560px){.clock-match-strip{grid-template-columns:max-content minmax(0,1fr);width:100%}.score-label{display:none}.live-scoreboard{padding-inline:10px}}

/* Game settings modal */
.game-settings-overlay{position:fixed;inset:0;z-index:1400;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(2,8,20,.74);backdrop-filter:blur(12px)}
.game-settings-overlay.open{display:flex}
.game-settings-card{width:min(720px,calc(100vw - 28px));max-height:calc(100svh - 28px);overflow:auto;border:1px solid rgba(255,255,255,.10);border-radius:28px;background:linear-gradient(180deg,rgba(10,22,39,.99),rgba(4,16,26,.99));box-shadow:0 30px 90px rgba(0,0,0,.55);padding:18px;display:grid;gap:16px}
.game-settings-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.game-settings-title{font-size:25px;line-height:1.08;font-weight:950;margin:3px 0 0}
.game-settings-copy,.game-settings-help{font-size:12px;line-height:1.45;color:var(--muted);margin:6px 0 0}
.game-settings-body{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.settings-fieldset{min-width:0;margin:0;border:1px solid rgba(255,255,255,.08);border-radius:20px;background:rgba(255,255,255,.025);padding:13px}
.settings-fieldset legend{padding:0 7px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);font-weight:950}
.settings-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.match-type-options{grid-template-columns:repeat(2,minmax(0,1fr))}
.settings-option{position:relative;display:block;cursor:pointer;min-width:0}
.settings-option input{position:absolute;opacity:0;pointer-events:none}
.settings-option span{min-height:44px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(255,255,255,.04);display:flex;align-items:center;justify-content:center;padding:8px;text-align:center;font-size:12px;color:var(--text)}
.settings-option input:checked+span{border-color:rgba(var(--accent-rgb,34,197,94),.42);background:rgba(var(--accent-rgb,34,197,94),.18);box-shadow:0 0 0 3px rgba(var(--accent-rgb,34,197,94),.10)}
.game-settings-actions{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:9px;align-items:center}
.sub-mode-hint{min-height:0!important;margin:0!important;padding:7px 9px;border-radius:11px;background:rgba(var(--accent-rgb,34,197,94),.08);border:1px solid rgba(var(--accent-rgb,34,197,94),.14)}
.protected-tag-badge{display:inline-flex;align-items:center;min-height:24px;padding:0 8px;border-radius:999px;border:1px solid rgba(var(--accent-rgb,34,197,94),.20);background:rgba(var(--accent-rgb,34,197,94),.10);font-size:9px;letter-spacing:.07em;text-transform:uppercase;color:var(--accent);font-weight:950}
.tag-wrap.is-protected{grid-template-columns:minmax(0,1fr) 28px}
.protected-tag-lock{width:28px;height:28px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);display:flex;align-items:center;justify-content:center;font-size:8px;color:var(--muted)}
@media(max-width:720px){.game-settings-overlay{padding:8px;align-items:stretch}.game-settings-card{width:100%;max-height:none;height:calc(100svh - 16px);border-radius:22px}.game-settings-body{grid-template-columns:1fr}.game-settings-actions{grid-template-columns:1fr}.game-settings-actions .btn{width:100%}}

/* MFA safe root overscroll boundary — 2026-06-29
   Keeps normal wheel/touch scrolling. Only the document/root page containers stop browser rubber-band; inner cards/lists/tables are left free to pass wheel scroll to the page. */
html,
body{
  overscroll-behavior:none!important;
  overscroll-behavior-x:none!important;
  overscroll-behavior-y:none!important;
  scroll-behavior:auto!important;
}
.app,
.app-shell,
.shell,
.page-shell,
.page,
.main,
main,
.content,
.workspace,
.gps-page-shell{
  overscroll-behavior-y:none!important;
  overscroll-behavior-x:none!important;
  scroll-behavior:auto!important;
}
/* MFA wheel-safe inner scroll recovery — 2026-06-29
   Inner panels/lists/tables must not trap mouse-wheel scrolling at their edges; root containers above still stop the browser bounce. */
.panel,
.card,
.module,
.list,
.history-list,
.table-wrap,
.modal,
.modal-card,
.drawer,
.mobile-drawer,
.panel-roster .list,
.match-stats-list-inline,
.editor-scroll,
.preview-panel,
.daily-report-body,
.dropdown-menu,
.select-menu,
.roster-list{
  overscroll-behavior:auto!important;
  overscroll-behavior-x:auto!important;
  overscroll-behavior-y:auto!important;
}


/* Canonical PDF generation progress and save feedback. */
.live-pdf-progress-modal{position:fixed;inset:0;z-index:1500;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(2,8,20,.76);backdrop-filter:blur(12px)}
.live-pdf-progress-modal.open{display:flex}
.live-pdf-progress-card{width:min(520px,calc(100vw - 28px));border:1px solid rgba(255,255,255,.10);border-radius:26px;background:linear-gradient(180deg,rgba(10,22,39,.99),rgba(4,16,26,.99));box-shadow:0 30px 90px rgba(0,0,0,.55);padding:20px;display:grid;gap:13px;color:var(--text)}
.live-pdf-progress-title{font-size:24px;line-height:1.08;font-weight:950;margin:0}
.live-pdf-progress-copy{font-size:12px;line-height:1.45;color:var(--muted);margin:0}
.live-pdf-progress-track{height:12px;border-radius:999px;overflow:hidden;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.055);box-shadow:inset 0 1px 3px rgba(0,0,0,.28)}
.live-pdf-progress-bar{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 64%,#ffffff));transition:width .18s ease}
.live-pdf-progress-meta{display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:0;font-size:12px;color:var(--muted)}
.live-pdf-progress-meta span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.live-pdf-progress-meta strong{flex:0 0 auto;color:var(--text);font-size:14px}
.live-pdf-progress-card.is-error .live-pdf-progress-track{border-color:rgba(248,113,113,.48)}
.live-pdf-progress-card.is-error .live-pdf-progress-bar{background:#ef4444}
.live-pdf-progress-card.is-error .live-pdf-progress-meta span{color:#fecaca}
.live-save-toast{position:fixed;right:22px;bottom:22px;z-index:1600;max-width:min(420px,calc(100vw - 32px));padding:12px 16px;border-radius:14px;border:1px solid rgba(134,239,172,.42);background:rgba(2,8,20,.94);color:#dcffe8;font-size:13px;font-weight:850;line-height:1.35;box-shadow:0 18px 44px rgba(0,0,0,.42);opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .18s ease,transform .18s ease}
.live-save-toast.show{opacity:1;transform:translateY(0)}
.live-save-toast.is-error{border-color:rgba(248,113,113,.58);color:#fee2e2}
@media(max-width:640px){.live-pdf-progress-modal{padding:8px}.live-pdf-progress-card{width:100%;border-radius:22px}.live-save-toast{right:16px;bottom:16px;max-width:calc(100vw - 32px)}}