@font-face{font-family:"Noto Kufi Arabic";src:url(/assets/kufi-800.44018eb483.woff2) format("woff2");font-weight:800;font-display:swap}@font-face{font-family:"Readex Pro";src:url(/assets/readex-400-600.1b469e7afb.woff2) format("woff2");font-weight:400 600;font-display:swap}@font-face{font-family:"Barlow Condensed";src:url(/assets/barlow-700-digits.4d7992e9ff.woff2) format("woff2");font-weight:700;font-display:swap}
/* v3 (audit W2.2): surfaces use role tokens (--ground/--raised/--sunken…, defined in v3.css); the build no longer re-maps colours with a regex.
   تيفو — the stand, not the app (site/DESIGN.md). The atom is one card: a flat square. Concrete ground, night-pitch
   scoreboard, chalk lines. Colour is semantic: pulse green = live only; dune = my team / selected; yellow and red = cards only.
   Kufi for signage, Readex for reading, Barlow Condensed for every number. Logical properties; digits always Western. */
:root{
  --concrete:#E9ECE7; --concrete-2:#DFE3DC; --night:#0A2620; --night-2:#123A31; --chalk:#F6F7F2; --ink:#0E1512;
  --dune:#B07A3B; --dune-soft:#B07A3B26; --pulse:#10A04B; --pulse-soft:#10A04B1F; --card-y:#F2C230; --card-r:#D8343F;
  --stone:#5C6660; --line:#CDD3CC; --line-2:#DCE0DA;
  --kufi:"Noto Kufi Arabic","Readex Pro",system-ui,sans-serif; --text:"Readex Pro",system-ui,sans-serif;--font-text:"Readex Pro",system-ui,sans-serif; --digits:"Barlow Condensed","Readex Pro",sans-serif;
  --gutter:clamp(1rem,.5rem + 2.2vw,2.5rem); --wide:1100px; color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--font-text);font-size:.97rem;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:hover{color:var(--dune)}
:focus-visible{outline:3px solid var(--dune);outline-offset:2px}
button,input,select{font:inherit;color:inherit}
.num,.dg{font-family:var(--digits);font-weight:700;font-variant-numeric:tabular-nums;unicode-bidi:isolate;white-space:nowrap;letter-spacing:.01em}
.lat{unicode-bidi:isolate}
.wrap{max-inline-size:var(--wide);margin-inline:auto;padding-inline:var(--gutter)}
.muted{color:var(--stone)}
.small{font-size:.82rem}

/* the card atom: live pulse is a card flipping */
.cardflip{display:inline-block;inline-size:.62rem;block-size:.62rem;background:var(--pulse);vertical-align:middle;margin-inline-end:.35rem;animation:flip 1.4s infinite}
@keyframes flip{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.15);background:var(--raised)}}
@media (prefers-reduced-motion:reduce){.cardflip{animation:none}}

/* header: night pitch with the mosaic mark */
.bar{background:var(--sunken);color:var(--chalk);position:sticky;top:0;z-index:20}
.bar .wrap{display:flex;align-items:center;gap:1.25rem;padding-block:.55rem}
.brand{display:flex;align-items:center;gap:.55rem;font-family:var(--kufi);font-weight:800;font-size:1.45rem;line-height:1;color:var(--chalk)}
.brand:hover{color:var(--chalk)}
.mark{display:grid;grid-template-columns:repeat(3,.42rem);gap:2px}
.mark i{inline-size:.42rem;block-size:.42rem;background:var(--raised)}
.mark i:nth-child(2),.mark i:nth-child(6),.mark i:nth-child(7){background:var(--pulse)}
.mark i:nth-child(3),.mark i:nth-child(5),.mark i:nth-child(8){background:var(--dune)}
.bar nav{display:flex;gap:1.1rem;margin-inline-start:auto;overflow-x:auto;scrollbar-width:none;font-size:.92rem}
.bar nav a{color:#B9C7C0;white-space:nowrap;padding-block:.35rem;border-block-end:2px solid transparent}
.bar nav a:hover{color:var(--chalk)}
.bar nav a[aria-current]{color:var(--chalk);border-block-end-color:var(--dune)}

/* signage */
h1{font-family:var(--kufi);font-weight:800;font-size:clamp(1.55rem,1.1rem + 2vw,2.5rem);line-height:1.35;margin:1.4rem 0 .2rem}
h2{font-family:var(--kufi);font-weight:800;font-size:1.02rem;margin:2.2rem 0 .6rem;display:flex;align-items:center;gap:.55rem}
h2::before{content:"";inline-size:.7rem;block-size:.7rem;background:var(--sunken);flex:none}
h3{font-family:var(--kufi);font-weight:800;font-size:.9rem;margin:1.2rem 0 .4rem}
.crumbs{font-size:.82rem;margin-block-start:1rem}
.crumbs a{color:var(--stone)}
.season{font-size:.85rem;color:var(--stone)}

/* tabs: chalk underline */
.tabs{display:flex;border-block-end:2px solid var(--line);overflow-x:auto;scrollbar-width:none;margin-block:1.1rem .4rem}
.tabs button{background:none;border:0;border-block-end:3px solid transparent;margin-block-end:-2px;padding:.55rem .95rem;cursor:pointer;color:var(--stone);white-space:nowrap;font-weight:600}
.tabs [aria-selected="true"]{color:var(--ink);border-block-end-color:var(--night)}
.chips{display:flex;gap:.3rem;overflow-x:auto;scrollbar-width:none;padding-block:.3rem .6rem}
.chips button{border:1px solid var(--line);background:var(--raised);min-inline-size:2.4rem;padding:.25rem .55rem;white-space:nowrap;cursor:pointer;font-family:var(--digits);font-weight:700;font-size:1rem}
.chips [aria-pressed="true"]{border-color:var(--night);background:var(--sunken);color:var(--chalk)}

/* the stand (home hero) */
.stand{position:relative;background:var(--sunken);color:var(--chalk);margin-inline:calc(var(--gutter) * -1);overflow:hidden}
@media (min-width:1100px){.stand{margin-inline:0}}
.stand canvas{display:block;inline-size:100%;block-size:clamp(11rem,34vw,20rem);touch-action:pan-y;cursor:crosshair}
.stand .cap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.75rem;padding:.7rem var(--gutter) .9rem;border-block-start:1px solid var(--night-2)}
.stand .cap a{color:var(--chalk)}
.stand .cap .h,.stand .cap .a{font-family:var(--kufi);font-weight:800;font-size:clamp(.95rem,.8rem + .8vw,1.3rem);display:flex;align-items:center;gap:.5rem;min-inline-size:0}
.stand .cap .a{justify-content:flex-end}
.stand .cap .mid{text-align:center;font-size:.8rem;color:#B9C7C0}
.stand .cap .mid .dg{display:block;font-size:1.6rem;color:var(--chalk);line-height:1.1}
.stand .cap .mid.live .dg{color:#5BE08F}
.stand .kicker{position:absolute;inset-block-start:.6rem;inset-inline-start:var(--gutter);font-size:.75rem;background:var(--sunken);padding:.1rem .45rem;color:#B9C7C0}

/* match rows: scoreboard chip + two sides */
.comp-block{margin-block-end:1.4rem}
.comp-head{display:flex;align-items:center;gap:.55rem;padding:.45rem 0;font-family:var(--kufi);font-weight:800;font-size:.88rem;border-block-end:2px solid var(--ink)}
.comp-head .grp{font-family:var(--font-text);font-weight:400;color:var(--stone);font-size:.8rem}
.comp-head .lv{margin-inline-start:auto;font-family:var(--font-text);font-weight:600;color:var(--pulse);font-size:.8rem}
.m{display:grid;grid-template-columns:1fr 4.2rem 1fr;align-items:center;gap:.6rem;padding:.6rem .15rem;border-block-end:1px solid var(--line-2);position:relative}
.m:hover{background:var(--sunken-2);color:inherit}
.m .t{display:flex;align-items:center;gap:.45rem;min-inline-size:0}
.m .t span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m .t.a{flex-direction:row-reverse}
.m .win{font-weight:600}
.m .lose{color:var(--stone)}
.chip{display:grid;justify-items:center;background:var(--sunken);color:var(--chalk);padding:.2rem .1rem;font-family:var(--digits);font-weight:700;font-size:1.15rem;line-height:1.15;min-block-size:2.35rem;align-content:center}
.chip small{font-family:var(--font-text);font-weight:400;font-size:.75rem;color:#B9C7C0;line-height:1.2}
.chip.up{background:var(--raised);color:var(--ink);border:1px solid var(--line)}
.chip.up small{color:var(--stone)}
.chip.live{background:var(--pulse);color:#fff}
.chip.live small{color:#E4F8EC}
.chip.off{background:var(--sunken-2);color:var(--stone);font-size:.8rem;font-family:var(--font-text)}
.m.mine::after{content:"";position:absolute;inset-block:.35rem;inset-inline-start:-.55rem;inline-size:.3rem;background:var(--dune)}
img.logo{inline-size:1.5rem;block-size:1.5rem;object-fit:contain;flex:none}
img.logo.lg{inline-size:3.6rem;block-size:3.6rem}
img.logo.sm{inline-size:1.15rem;block-size:1.15rem}
.empty{padding:1.5rem 0;color:var(--stone)}

/* day switcher */
.daynav{display:grid;grid-template-columns:2.6rem 1fr 2.6rem;align-items:stretch;margin-block:1.2rem .4rem;border:2px solid var(--ink)}
.daynav button{background:var(--raised);border:0;cursor:pointer;font-family:var(--digits);font-size:1.3rem}
.daynav button:hover{background:var(--sunken);color:var(--chalk)}
.daynav b{display:grid;place-items:center;font-family:var(--kufi);font-weight:800;font-size:.95rem;padding:.4rem;border-inline:2px solid var(--ink);line-height:1.5}
.daynav b small{font-family:var(--font-text);font-weight:400;color:var(--stone);font-size:.75rem}
.livecount{font-size:.85rem;color:var(--pulse);font-weight:600;min-block-size:1.2rem}

/* standings: a chalked table */
.tblwrap{overflow-x:auto}
table.st{inline-size:100%;border-collapse:collapse;font-size:.92rem}
table.st th{font-weight:400;color:var(--stone);font-size:.75rem;text-align:center;padding:.35rem .2rem;border-block-end:2px solid var(--ink)}
table.st td{padding:.42rem .2rem;border-block-end:1px dashed var(--line);text-align:center;font-family:var(--digits);font-weight:700;font-size:1.02rem}
table.st td.tm{text-align:start;font-family:var(--font-text);font-weight:400;font-size:.92rem;white-space:nowrap}
table.st td.tm a{display:inline-flex;align-items:center;gap:.45rem}
table.st td.rk{inline-size:2.2rem}
table.st td.rk span{display:inline-grid;place-items:center;inline-size:1.55rem;block-size:1.55rem}
table.st td.pts{font-size:1.15rem}
table.st tr.mine td{background:var(--dune-soft)}
table.st tr.live td.tm::after{content:"";display:inline-block;inline-size:.5rem;block-size:.5rem;background:var(--pulse);margin-inline-start:.4rem}
.form{display:inline-flex;gap:2px}
.form i{inline-size:1.05rem;block-size:1.05rem;font-style:normal;font-size:.75rem;display:grid;place-items:center;font-family:var(--font-text);font-weight:600}
.form .W{background:var(--chalk);color:var(--night)}.form .D{background:#9BA39E;color:#fff}.form .L{background:var(--inkbg);color:var(--chalk)}
.legend{display:flex;flex-wrap:wrap;gap:.9rem;font-size:.76rem;color:var(--stone);margin-block:.6rem}
.legend i{display:inline-block;inline-size:.75rem;block-size:.75rem;margin-inline-end:.35rem;vertical-align:-1px}
@media (max-width:560px){table.st .hx{display:none}}

/* leaders */
ol.lead{list-style:none;margin:0;padding:0}
ol.lead li{display:grid;grid-template-columns:2rem 1fr 2.6rem;gap:.5rem;align-items:center;padding:.5rem 0;border-block-end:1px dashed var(--line)}
ol.lead li b{font-family:var(--digits);font-size:1.3rem;text-align:center;background:var(--sunken);color:var(--chalk)}
ol.lead li:first-child b{background:var(--dune);color:#fff}
ol.lead li .who{display:flex;align-items:center;gap:.45rem;min-inline-size:0}
ol.lead li .who span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* match page: the scoreboard */
.board{background:var(--sunken);color:var(--chalk);margin-inline:calc(var(--gutter) * -1);display:grid;grid-template-columns:.55rem 1fr auto 1fr .55rem;align-items:center;gap:.8rem;padding-block:1.4rem 1rem}
@media (min-width:1100px){.board{margin-inline:0}}
.board .band{align-self:stretch;margin-block:-1.4rem -1rem;display:grid}
.board .band i{display:block}
.board .tm{display:grid;justify-items:center;gap:.45rem;font-family:var(--kufi);font-weight:800;font-size:clamp(.95rem,.8rem + .9vw,1.35rem);text-align:center;color:var(--chalk);line-height:1.4}
.board .sc{text-align:center}
.board .sc .dg{display:block;font-size:clamp(3rem,2.2rem + 4vw,5rem);line-height:1}
.board .sc .st{font-size:.85rem;color:#B9C7C0;display:block;margin-block-start:.35rem}
.board.live .sc .dg,.board.live .sc .st{color:#5BE08F}
.board .sc .pens{font-size:.8rem;color:#B9C7C0}
.timeline{background:var(--night-2);margin-inline:calc(var(--gutter) * -1);padding:.75rem var(--gutter) .5rem;color:#B9C7C0}
@media (min-width:1100px){.timeline{margin-inline:0}}
.tl{position:relative;block-size:2.6rem}
.tl .axis{position:absolute;inset-inline:0;inset-block-start:calc(50% - 1px);block-size:2px;background:#2D5A4E}
.tl .played{position:absolute;inset-inline-start:0;inset-block-start:calc(50% - 1px);block-size:2px;background:var(--raised)}
.tl .ht{position:absolute;inset-block:.3rem;inline-size:2px;background:#4B7A6D;transform:translateX(50%)}
.tl .ev{position:absolute;inline-size:.7rem;block-size:.7rem;transform:translateX(50%)}
.tl .ev.h{inset-block-start:.1rem}.tl .ev.a{inset-block-end:.1rem}
.tl .ev.goal{background:var(--raised)}.tl .ev.yellow{background:var(--card-y);inline-size:.5rem}.tl .ev.red{background:var(--card-r);inline-size:.5rem}
.tl-lbl{display:flex;justify-content:space-between;font-family:var(--digits);font-weight:700;font-size:.8rem}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(9.5rem,100%),1fr));border:2px solid var(--ink);margin:1rem 0 .5rem;background:var(--raised)}
.facts div{padding:.5rem .7rem;border-inline-end:1px solid var(--line);border-block-end:1px solid var(--line)}
.facts dt{font-size:.75rem;color:var(--stone)}
.facts dd{margin:0;font-weight:600;font-size:.9rem}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(16rem,100%),1fr));gap:.6rem;margin-block:.6rem}
.tile{display:grid;grid-template-columns:2.4rem 1fr;gap:.6rem;align-items:center;padding:.6rem .7rem;background:var(--raised);border:1px solid var(--line)}
.tile .ic{inline-size:2.4rem;block-size:2.4rem;display:grid;place-items:center;background:var(--sunken);color:var(--chalk);font-size:1.1rem}
.tile.pray .ic{background:var(--dune)}
.tile.hot{border:2px solid var(--card-r)}
.tile b{display:block;font-size:.9rem}
.tile span{font-size:.82rem;color:var(--stone)}
ul.ev{list-style:none;margin:0;padding:0}
ul.ev li{display:grid;grid-template-columns:1fr 3.2rem 1fr;align-items:center;gap:.5rem;padding:.45rem 0;border-block-end:1px dashed var(--line);font-size:.9rem}
ul.ev li .mn{text-align:center;font-family:var(--digits);font-weight:700;font-size:1.05rem}
ul.ev li .h{text-align:end}
ul.ev li.div{grid-template-columns:1fr;text-align:center;font-family:var(--kufi);font-weight:800;font-size:.78rem;background:var(--sunken);color:var(--chalk);border:0;margin-block:.3rem;padding:.3rem}
ul.ev .ico{display:inline-block;inline-size:.62rem;block-size:.85rem;vertical-align:-1px;margin-inline:.25rem}
ul.ev .ico.yellow{background:var(--card-y)}ul.ev .ico.red{background:var(--card-r)}
ul.ev .ico.goal{inline-size:.8rem;block-size:.8rem;background:var(--inkbg)}
ul.ev .ico.sub{inline-size:.8rem;block-size:.8rem;border:2px solid var(--stone)}
ul.ev .ico.miss{inline-size:.8rem;block-size:.8rem;border:2px solid var(--stone);position:relative}ul.ev .ico.miss::after{content:"✕";position:absolute;inset:-.2rem 0 0;font-size:.6rem;line-height:1;text-align:center;color:var(--stone)}
ul.ev .who{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.1rem .3rem}
ul.ev li .h .who{justify-content:flex-end}
ul.ev .sub{color:var(--stone);font-size:.78rem;display:block}
ul.ev .gs{white-space:nowrap;display:inline-block;font-family:var(--digits);font-weight:700;font-size:1.05rem;background:var(--sunken);color:var(--chalk);padding:0 .3rem;margin-inline:.25rem}
ul.ev .kind{color:var(--stone);font-size:.8rem}

/* lineups on a chalk pitch */
.pitch{position:relative;background:#0F3A2F;aspect-ratio:68/105;max-inline-size:26rem;margin:.6rem auto;border:2px solid var(--chalk);color:var(--chalk);overflow:hidden}
.pitch .half{position:absolute;inset-inline:0;inset-block-start:calc(50% - 1px);block-size:2px;background:#ffffff55}
.pitch .circle{position:absolute;inset-inline-start:37%;inset-block-start:calc(50% - 13%*68/105);inline-size:26%;aspect-ratio:1;border:2px solid #ffffff55;border-radius:50%}
.pitch .box{position:absolute;inset-inline-start:22%;inline-size:56%;block-size:14%;border:2px solid #ffffff55}
.pitch .box.t{inset-block-start:-2px}.pitch .box.b{inset-block-end:-2px}
.pitch .side{position:absolute;inset-inline-start:.4rem;font-size:.75rem;color:#ffffffaa;font-family:var(--kufi);font-weight:800}
.pitch .side.t{inset-block-start:.3rem}.pitch .side.b{inset-block-end:.3rem}
.pl{position:absolute;display:grid;justify-items:center;gap:1px;z-index:1;inline-size:4.4rem;transform:translate(-50%,-35%);text-align:center}
.pl b{inline-size:1.7rem;block-size:1.7rem;display:grid;place-items:center;font-family:var(--digits);font-size:1rem;background:var(--raised);color:var(--ink)}
.pl.away b{background:var(--inkbg);color:var(--chalk);outline:1px solid var(--chalk)}
.pl span{font-size:.75rem;line-height:1.15;text-shadow:0 1px 2px #000;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-inline-size:100%}
.pl .rt{font-size:.75rem;padding:0 .2rem}
.lu{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.lu h3{display:flex;justify-content:space-between;align-items:center}
.lu ul{list-style:none;margin:0;padding:0;font-size:.88rem}
.lu li{display:flex;gap:.5rem;padding:.28rem 0;border-block-end:1px dashed var(--line)}
.lu li .no{font-family:var(--digits);font-weight:700;inline-size:1.6rem}
.lu li .rt{margin-inline-start:auto}
.rt{font-family:var(--digits);font-weight:700;font-size:.82rem;padding:0 .3rem}
.rt.hi{background:var(--chalk);color:var(--night)}.rt.mid{background:var(--line);color:var(--ink)}.rt.lo{background:var(--sunken-2);color:var(--stone)}
@media (max-width:600px){.lu{grid-template-columns:1fr}}
.stat{display:grid;grid-template-columns:2.8rem 1fr 2.8rem;gap:.5rem;align-items:center;padding:.4rem 0}
.stat .l{grid-column:1/-1;text-align:center;color:var(--stone);font-size:.8rem;margin-block-end:-.35rem}
.stat .v{font-family:var(--digits);font-weight:700;font-size:1.1rem;text-align:center}
.stat .bar2{display:flex;gap:2px;block-size:.55rem}
.stat .bar2 i{display:block;background:var(--sunken)}
.stat .bar2 i + i{background:var(--dune)}
.h2hsum{display:grid;grid-template-columns:repeat(3,1fr);text-align:center;border:2px solid var(--ink);margin-block:.6rem;background:var(--raised)}
.h2hsum div{padding:.6rem;font-size:.85rem}
.h2hsum div + div{border-inline-start:1px solid var(--line)}
.h2hsum b{display:block;font-family:var(--digits);font-size:2rem;line-height:1.1}
.note{border:2px solid var(--ink);padding:.5rem .75rem;margin-block:.75rem;font-size:.88rem;background:var(--raised)}

/* team page: the club's colours as a card strip */
.th{background:var(--sunken);color:var(--chalk);margin-inline:calc(var(--gutter) * -1);padding:1.2rem var(--gutter) 0}
@media (min-width:1100px){.th{margin-inline:0}}
.th .in{display:flex;align-items:center;gap:1rem}
.th h1{margin:0;color:var(--chalk)}
.th p{margin:.2rem 0 0;color:#B9C7C0;font-size:.85rem}
.strip{display:grid;grid-template-columns:repeat(24,1fr);margin-block-start:1rem;block-size:.9rem}
.btnrow{display:flex;flex-wrap:wrap;gap:.5rem;margin-block:1rem}
.btn{display:inline-flex;align-items:center;gap:.45rem;border:2px solid var(--ink);background:var(--raised);color:var(--ink);padding:.4rem .9rem;cursor:pointer;font-size:.9rem;font-weight:600}
.btn.on{background:var(--dune);border-color:var(--dune);color:#fff}
.btn:hover{background:var(--sunken);border-color:var(--night);color:var(--chalk)}
.squad{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(15rem,100%),1fr));gap:0 1.5rem}
.squad div{display:flex;gap:.5rem;padding:.35rem 0;border-block-end:1px dashed var(--line);font-size:.9rem;align-items:center}
.squad .no{font-family:var(--digits);font-weight:700;inline-size:1.6rem}
.squad .x{margin-inline-start:auto;font-family:var(--digits);font-weight:700;font-size:.9rem;color:var(--stone)}
.flag{font-size:.75rem;color:var(--stone);border:1px solid var(--line);padding:0 .25rem;font-family:var(--digits)}

/* competitions + my team */
.comps{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(16rem,100%),1fr));gap:0 1.5rem}
.comps a{display:flex;justify-content:space-between;align-items:center;padding:.55rem 0;border-block-end:1px dashed var(--line)}
.mine-card{background:var(--raised);border:2px solid var(--dune);padding:.8rem 1rem;margin-block:1rem;display:grid;gap:.35rem}
.mine-card .h{display:flex;align-items:center;gap:.6rem;font-family:var(--kufi);font-weight:800}
.mine-card .h small{font-family:var(--font-text);font-weight:600;font-size:.75rem;background:var(--dune);color:#fff;padding:0 .35rem}
.mine-card .lbl{font-size:.75rem;color:var(--stone);margin-block-start:.3rem}

.foot{background:var(--sunken);color:#B9C7C0;margin-block-start:4rem;font-size:.82rem}
.foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem 1.5rem;padding-block:1.6rem}
.foot a{color:var(--chalk)}
.updated{font-family:var(--digits);font-weight:700}

/* ---- phase 2: the numbers */
.blk{margin-block-end:1.5rem}
.blk h2 small{font-family:var(--font-text);font-weight:400;font-size:.75rem;color:var(--stone);margin-inline-start:auto}
.secnav{position:sticky;top:3.1rem;z-index:5;background:var(--ground);padding-block:.4rem;border-block-end:1px solid var(--line)}
.secnav a{border:1px solid var(--line);background:var(--raised);padding:.2rem .6rem;white-space:nowrap;font-size:.85rem}
.src{font-size:.76rem;color:var(--stone);margin:.4rem 0 0;max-inline-size:60ch}
.src a{text-decoration:underline}
a.tl{display:inline-flex;align-items:center;gap:.4rem;min-inline-size:0}
a.tl span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pbar{display:block;block-size:.3rem;background:var(--line-2);margin-block-start:.15rem}
.pbar i{display:block;block-size:100%;background:var(--sunken)}
.pbar.gold i{background:var(--chalk)}.pbar.bad i{background:var(--card-r)}
table.sim td{min-inline-size:4.2rem}
.pv{display:block;line-height:1.1}
.ok{background:var(--pulse);color:#fff;padding:0 .35rem;font-family:var(--font-text);font-size:.75rem}
.no{background:var(--inkbg);color:var(--chalk);padding:0 .35rem;font-family:var(--font-text);font-size:.75rem}
.probs{margin-block:.8rem}
.pr3{display:flex;gap:2px;block-size:.9rem}
.pr3 i{display:block}.pr3 i.d{background:#9BA39E}
.pr3l{display:flex;justify-content:space-between;gap:.5rem;font-size:.8rem;margin-block-start:.3rem}
.pr3l b{font-size:1rem}
.wt{display:grid;grid-template-columns:3.2rem 1fr;align-items:center;gap:.5rem;border-block-end:1px solid var(--line-2)}
.wt .m{border:0}
.wt .ws{display:grid;justify-items:center;background:var(--sunken);color:var(--chalk);padding:.25rem 0}
.wt .ws b{font-family:var(--digits);font-size:1.3rem;line-height:1}
.wt .ws small{font-size:.75rem;color:#B9C7C0}
.wt .tags{grid-column:2;display:flex;flex-wrap:wrap;gap:.3rem;padding-block-end:.5rem}
.wt .tags i{font-style:normal;font-size:.75rem;background:var(--dune-soft);padding:0 .4rem}
.bump svg,.rchart svg,.clock svg{display:block;inline-size:100%;block-size:auto;background:var(--raised);border:1px solid var(--line)}
.bump path,.rchart path{fill:none;stroke-width:2.5}
.bump .bl text{font-family:var(--font-text);font-size:11px;fill:var(--ink)}
.bump .bl:hover path{stroke-width:5}
.ax{font-family:var(--digits);font-weight:700;font-size:11px;fill:var(--stone)}
.rchart line.base{stroke:var(--line);stroke-dasharray:4 4}
.clock{max-inline-size:22rem}
.clock line{stroke:var(--night);stroke-width:3}
.clock line.st{stroke:var(--dune)}
.clock .ring{fill:none;stroke:var(--line)}
.clock text{font-family:var(--digits);font-weight:700;font-size:12px;fill:var(--stone)}
.clock p{margin:.4rem 0 0}
.two{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
@media (max-width:600px){.two{grid-template-columns:1fr}}
.thermo{display:grid;gap:.1rem}
.th1{display:grid;grid-template-columns:minmax(7rem,11rem) 1fr 2.4rem;gap:.2rem .6rem;align-items:center;padding:.3rem 0;border-block-end:1px dashed var(--line)}
.th1 small{grid-column:1/-1;font-size:.75rem}
.tbar{display:block;block-size:.75rem;background:var(--line-2)}
.tbar i{display:block;block-size:100%}
.th1 b{font-size:1.1rem;text-align:center}
ul.facts-l{margin:0;padding-inline-start:1.1rem;font-size:.9rem}
ul.facts-l li{margin-block:.3rem}
.rec{background:var(--chalk);color:var(--night);font-size:.75rem;padding:0 .35rem;font-weight:600}
.up{color:var(--pulse)}.dn{color:var(--card-r)}
.lk-up{color:var(--pulse)}.lk-dn{color:var(--card-r)}
details.more{margin-block:.6rem}
details.more summary{cursor:pointer;font-weight:600;padding:.3rem 0}
.scen p{margin:.3rem 0}
.scn3{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-block:.5rem;text-align:center;font-size:.85rem}
.scn3 div{padding:.5rem .3rem;background:var(--raised);border:1px solid var(--line)}
.scn3 b{display:block;font-family:var(--kufi);font-weight:800;font-size:.8rem}
.scn3 .w{border-color:var(--pulse)}.scn3 .l{border-color:var(--ink)}
.pitch.half{aspect-ratio:68/60}
.pitch.half .box.b{block-size:22%}
.pl .tn{font-size:.75rem;color:#ffffffbb}
/* Tifo player cards: a card held up in the stand */
.tcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr));gap:.6rem}
.tcard{position:relative;display:grid;justify-items:center;gap:.15rem;padding:.6rem .5rem .5rem;background:var(--sunken);color:var(--chalk);border-block-start:.45rem solid var(--c1);text-align:center}
.tcard:hover{color:var(--chalk);outline:3px solid var(--c2)}
.tcard .ov{font-family:var(--digits);font-weight:700;font-size:2.1rem;line-height:1}
.tcard .rl{font-size:.75rem;color:#B9C7C0}
.tcard b{font-size:.85rem;line-height:1.3;max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tcard .pts6{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;inline-size:100%;margin-block-start:.25rem}
.tcard .pts6 i{font-style:normal;font-size:.75rem;color:#B9C7C0;display:grid;background:var(--night-2);padding:.15rem 0}
.tcard .pts6 em{font-style:normal;font-family:var(--digits);font-weight:700;font-size:.95rem;color:var(--chalk)}
.tcard.big{max-inline-size:14rem;margin-inline:auto}
.pstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(6.5rem,1fr));border:2px solid var(--ink);background:var(--raised);margin-block:1rem}
.pstats div{padding:.5rem;text-align:center;border-inline-end:1px solid var(--line)}
.pstats b{display:block;font-family:var(--digits);font-size:1.6rem;line-height:1.1}
.pstats span{font-size:.75rem;color:var(--stone)}

ol.lead li .who{flex-wrap:wrap;row-gap:0}
ol.lead li .who > .muted{white-space:normal;flex-basis:100%;font-size:.76rem}
.shotmap{max-inline-size:26rem}
.shotmap svg{display:block;inline-size:100%;block-size:auto}
.shotmap .pitchbg{fill:#0F3A2F}.shotmap .ln{fill:none;stroke:#ffffff55;stroke-width:2}.shotmap .goal{stroke:var(--chalk);stroke-width:4}
.shotmap circle.g{fill:var(--pulse);stroke:#fff;stroke-width:1.5}.shotmap circle.m{fill:none;stroke:#ffffffaa;stroke-width:1.5}
.h2hrow{display:grid;grid-template-columns:5.5rem 1fr;align-items:center;gap:.4rem}
.h2hrow .m{border:0}
.h2hrow{border-block-end:1px solid var(--line-2)}
#wi-m .wi{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem;padding:.45rem 0;border-block-end:1px dashed var(--line)}
#wi-m .wi .a{justify-self:end}
#wi-m .pick{display:grid;grid-template-columns:repeat(3,2.4rem);gap:2px}
#wi-m .pick button{border:1px solid var(--line);background:var(--raised);padding:.3rem 0;cursor:pointer;font-size:.8rem;font-weight:600}
#wi-m .pick button[aria-pressed="true"]{background:var(--sunken);color:var(--chalk);border-color:var(--night)}
.mv{font-size:.75rem;margin-inline-start:.3rem}
.mv.up{color:var(--pulse)}.mv.dn{color:var(--card-r)}
/* compare */
.cmpsel{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-block:1rem}
.cmpsel input,.cmpsel select{inline-size:100%;padding:.45rem;border:2px solid var(--ink);background:var(--raised)}
.radar svg{display:block;inline-size:100%;max-inline-size:24rem;margin:auto}
.radar .grid{fill:none;stroke:var(--line)}.radar text{font-size:11px;fill:var(--stone);font-family:var(--font-text)}
.radar .pa{fill-opacity:.25;stroke-width:2.5}
.cmpt{display:grid;grid-template-columns:3.2rem 1fr 3.2rem;gap:.4rem;align-items:center;padding:.3rem 0;border-block-end:1px dashed var(--line);font-size:.85rem}
.cmpt b{font-family:var(--digits);font-size:1.05rem;text-align:center}
.cmpt span{text-align:center;color:var(--stone)}
.cmpt b.w{background:none;color:var(--chalk);font-weight:800;text-decoration:underline 2px}
/* ---- phase 3 */
.chip.hot{}
.catchup{background:var(--raised);border:2px solid var(--ink);border-inline-start:.5rem solid var(--dune);padding:.6rem .8rem;margin-block:.8rem}
.catchup b{font-family:var(--kufi);font-weight:800;font-size:.85rem}
.catchup p{margin:.2rem 0;font-size:.92rem}
.tools{display:flex;flex-wrap:wrap;gap:.5rem;margin-block:.6rem}
.spoil{margin-inline-start:.5rem;background:none;border:1px solid #B9C7C0;color:#B9C7C0;font-size:.75rem;padding:.15rem .45rem;cursor:pointer;white-space:nowrap}
.spoil[aria-pressed="true"]{background:var(--dune);border-color:var(--dune);color:#fff}
.nospoil .chip:not(.up):not(.shown),.nospoil .board .sc .dg:not(.shown),.nospoil .stand .cap .mid .dg,.nospoil ul.ev,.nospoil .catchup,.nospoil .timeline,.nospoil .gs{filter:blur(7px);cursor:pointer}
.nospoil .stand canvas{filter:blur(10px)}
.cd{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:var(--sunken);color:var(--chalk);padding:.7rem 1rem;margin-block:1rem;border-inline-start:.5rem solid var(--chalk)}
.cd b{font-family:var(--kufi);font-weight:800}
.cd .dg{font-size:1.6rem}
.cd a{color:var(--chalk)}
/* majlis TV (22, 131) */
body[data-page="tv"]{background:var(--sunken);color:var(--chalk)}
body[data-page="tv"] .foot{margin-block-start:1rem}
.tvbar{display:flex;align-items:center;gap:1rem;margin-block:1rem}
.tvbar h1{margin:0;color:var(--chalk)}
.tvbar .btn{margin-inline-start:auto}
.tvgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(22rem,100%),1fr));gap:.8rem}
.tvgrid.pin{grid-template-columns:repeat(auto-fit,minmax(min(26rem,100%),1fr))}
.tvt{background:var(--night-2);padding:1rem;display:grid;gap:.5rem;border-block-start:.4rem solid var(--night-2)}
.tvt.live{border-block-start-color:var(--pulse)}
.tvt .cmp{font-size:.8rem;color:#B9C7C0}
.tvt .row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.6rem}
.tvt .tn{font-family:var(--kufi);font-weight:800;font-size:clamp(1rem,.8rem + 1vw,1.6rem);display:flex;align-items:center;gap:.5rem;color:var(--chalk)}
.tvt .tn.a{flex-direction:row-reverse}
.tvt .big{font-family:var(--digits);font-weight:700;font-size:clamp(2.4rem,1.6rem + 3vw,4.2rem);line-height:1;text-align:center;white-space:nowrap}
.tvt.live .big{color:#5BE08F}
.tvt .st{text-align:center;color:#B9C7C0;font-size:.9rem}
.tvt ul{list-style:none;margin:0;padding:0;font-size:.85rem;color:#DDE4DF;max-block-size:14rem;overflow:auto}
.tvt li{padding:.2rem 0;border-block-end:1px solid #2D5A4E}
body[data-page="tv"] img.logo{inline-size:2.2rem;block-size:2.2rem}
/* studio (152) */
.studio canvas{inline-size:100%;block-size:auto;display:block;border:2px solid var(--ink)}
.studio .cmpsel{grid-template-columns:1fr 2fr}
/* 3D lineup pitch (103) */
.p3d{position:relative;margin-block:.6rem;background:var(--sunken)}
.p3d canvas{display:block;inline-size:100%}
.p3tip{position:absolute;inset-block-start:.6rem;inset-inline-start:.6rem;background:var(--raised);color:var(--ink);border:2px solid var(--ink);padding:.35rem .6rem;font-size:.85rem;z-index:2;max-inline-size:70%}
.p3tip b{font-family:var(--digits);font-size:1.1rem}
/* phase 4/5 */
.ai{background:var(--raised);border:2px solid var(--ink);border-inline-start:.5rem solid var(--pulse);padding:.7rem .9rem;margin-block:.8rem}
.ai b{font-family:var(--kufi);font-weight:800}
.ai p{margin:.35rem 0}
.ai ul.prev{margin:0;padding:0;list-style:none}
.ai ul.prev li{padding:.3rem 0;border-block-end:1px dashed var(--line)}
.ai ul.prev b{font-size:.78rem;background:var(--sunken);color:var(--chalk);padding:0 .35rem;margin-inline-end:.3rem}
.aisrc{font-size:.75rem;color:var(--stone)}
ol.thread{padding-inline-start:1.2rem}
ol.thread li{margin-block:.5rem;padding:.5rem;background:var(--raised);border:1px solid var(--line)}
ol.thread p{margin:0 0 .3rem}
.btn.copy{font-size:.78rem;padding:.2rem .6rem}
.press ul{padding-inline-start:1.1rem}
.press li{margin-block:.2rem}
.dist select{border:1px solid var(--line);background:var(--raised);font-size:.85rem}
.wk{border-block-end:1px solid var(--line-2);padding-block-start:.4rem}
.wk .m{border:0}
audio{inline-size:100%;margin-block:.4rem}
@media print{.bar,.foot,.tabs,.tools,.board,.timeline,.facts,.tiles,.btnrow,#catchup,.probs{display:none!important}[data-pane]{display:block!important}[data-pane]:not([data-pane="press"]){display:none!important}body{background:#fff}}
.ask{display:grid;grid-template-columns:1fr auto;gap:.5rem;margin-block:1rem}
.ask input{padding:.55rem;border:2px solid var(--ink);background:var(--raised)}
ul.bc{list-style:none;margin:0;padding:0}
ul.bc li{padding:.35rem 0;border-block-end:1px dashed var(--line)}
blockquote{margin:.5rem 0;padding:.4rem .7rem;border-inline-start:3px solid var(--rule);font-size:.85rem;color:var(--stone);background:var(--raised)}
.ctrybox{position:fixed;inset-inline:0;top:3.2rem;z-index:30;margin-inline:auto;max-inline-size:32rem;background:var(--raised);border:2px solid var(--ink);padding:.8rem}
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(7rem,1fr));gap:.3rem}
.cgrid button{border:1px solid var(--line);background:var(--ground);padding:.35rem;cursor:pointer}
.cgrid button[aria-pressed="true"]{background:var(--sunken);color:var(--chalk)}
.favrow + .favrow{border-block-start:1px dashed var(--line);padding-block-start:.3rem}
.bar .spoil + .spoil{margin-inline-start:.25rem}
#srchbox input{inline-size:100%;padding:.55rem;border:2px solid var(--ink);background:var(--raised);font-size:1rem}
#sr ul{list-style:none;margin:.5rem 0 0;padding:0;max-block-size:60vh;overflow:auto}
#sr li a{display:flex;justify-content:space-between;gap:.5rem;padding:.45rem .2rem;border-block-end:1px dashed var(--line)}
body.comm .bar,body.comm .foot,body.comm .tabs,body.comm .tools:not(:has(#commbtn)),body.comm #facts,body.comm .tiles,body.comm .probs,body.comm .blk,body.comm #catchup{display:none!important}
body.comm .press{font-size:1.5rem;line-height:1.6}
body.comm .press li{padding:.4rem;transition:background .3s}
body.comm .press li.hot1{background:var(--dune-soft)}
ul.md li{margin-block:.35rem}
.fdr .fr{display:grid;grid-template-columns:minmax(6.5rem,9rem) 1fr;gap:.5rem;align-items:center;padding:.3rem 0;border-block-end:1px dashed var(--line)}
.fds{display:flex;gap:2px}
i.fd{font-style:normal;flex:1;min-inline-size:2.6rem;display:grid;place-items:center;font-size:.75rem;line-height:1.2;padding:.2rem .1rem;text-align:center}
i.fd small{font-size:.75rem;opacity:.8}
.legend i.fd{display:inline-grid;inline-size:1rem;min-inline-size:1rem;block-size:.8rem;padding:0}
.fd.f1{background:#F1EBDD;color:#0E1512}.fd.f2{background:#DCD3C0;color:#0E1512}.fd.f3{background:#B8B2A6;color:#0E1512}.fd.f4{background:#6F7872;color:#fff}.fd.f5{background:#0E1512;color:#F6F7F2}
.road{padding:.5rem 0;border-block-end:1px dashed var(--line)}
.road .rh{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-block-end:.3rem}
#arabonly[aria-pressed="true"]{background:var(--dune);border-color:var(--dune);color:#fff}
body.second .bar,body.second .foot,body.second #facts,body.second .tiles,body.second .blk,body.second #catchup,body.second .tabs,body.second .probs,body.second .ai{display:none!important}
body.second [data-pane="stats"]{display:block!important}
body.second [data-pane]:not([data-pane="stats"]){display:none!important}
body.second .board .sc .dg{font-size:6rem}
body.second .stat{font-size:1.15rem}
/* batch 235-264 */
.pbar.big{block-size:.8rem}
.clock2 p{margin:.4rem 0}
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:.4rem}
.sgrid div{display:grid;grid-template-columns:auto 1fr auto;gap:.4rem;align-items:center;background:var(--raised);border:1px solid var(--line);padding:.35rem .5rem}
.poster{background:#fff;color:#0E1512;border-block-start:1rem solid var(--c1);padding:1rem;max-inline-size:210mm;margin:1rem auto}
.poster .ph{display:flex;align-items:center;gap:1rem;border-block-end:.4rem solid var(--c2);padding-block-end:.6rem;margin-block-end:.6rem}
.poster .ph h1{margin:0;font-size:1.8rem}
.poster table{inline-size:100%;border-collapse:collapse;font-size:.85rem}
.poster td{padding:.3rem .25rem;border-block-end:1px solid #ddd}
.poster .pf{text-align:center;font-family:var(--digits);margin-block-start:.6rem}
@media print{body[data-page="poster"] .bar,body[data-page="poster"] .foot,.noprint{display:none!important}body[data-page="poster"]{background:#fff}.poster{margin:0;max-inline-size:none;border-block-start-width:.6rem}@page{size:A4;margin:10mm}}
.shr{margin-inline-start:.5rem;border:1px solid var(--line);background:var(--raised);font-size:.75rem;padding:0 .45rem;cursor:pointer;font-family:var(--font-text);font-weight:400}
.story{display:grid;grid-template-columns:1fr;gap:1rem}
.stbl{position:sticky;top:3.3rem;z-index:2;list-style:none;margin:0;padding:0;background:var(--ground);block-size:calc(var(--n,14) * 1.9rem);min-block-size:14rem}
.stbl li{position:absolute;inset-inline:0;top:calc(var(--i) * 1.9rem);block-size:1.85rem;display:flex;align-items:center;gap:.5rem;padding-inline:.3rem;border-block-end:1px dashed var(--line);transition:top .6s cubic-bezier(.22,.61,.36,1),background .6s}
.stbl li.moved{background:var(--dune-soft)}
.stbl .rk{inline-size:1.6rem;font-family:var(--digits);font-weight:700}
.stbl .pt{margin-inline-start:auto}
.steps .step{min-block-size:55vh;display:flex;align-items:center;opacity:.45;transition:opacity .3s}
.steps .step.on{opacity:1}
.steps .step > *{inline-size:100%}
@media (min-width:860px){.story{grid-template-columns:1fr 1fr}.stbl{top:4rem}}
@media (prefers-reduced-motion:reduce){.stbl li{transition:none}}
.bracket{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(14rem,1fr);gap:1rem;overflow-x:auto}
.bs .tie{display:grid;grid-template-columns:1fr auto 1fr;gap:.4rem;align-items:center;background:var(--raised);border:1px solid var(--line);padding:.4rem;margin-block:.35rem;font-size:.85rem}
.bs .tie a{grid-column:1/-1;font-size:.75rem;color:var(--stone)}
.labsel{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.5rem;margin-block:1rem}
.labsel select,.labsel input{padding:.4rem;border:2px solid var(--ink);background:var(--raised)}
.labsvg{inline-size:100%;block-size:auto;background:var(--raised);border:1px solid var(--line)}
.labsvg line{stroke:var(--stone)}.labsvg text{font-family:var(--font-text);font-size:11px;fill:var(--ink)}
dl.gl dt{font-family:var(--kufi);font-weight:800;margin-block-start:1rem}
dl.gl dd{margin:0;padding-block:.2rem .6rem;border-block-end:1px dashed var(--line)}
dl.gl dt:target{background:var(--dune-soft)}
.lesson{border-inline-start:.4rem solid var(--night);padding-inline-start:.8rem;margin-block:1.2rem}
.lesson .ex{background:var(--raised);border:1px solid var(--line);padding:.5rem .7rem}
@media (max-width:640px){.bar .wrap{flex-wrap:wrap;row-gap:.2rem}.bar nav{order:3;flex-basis:100%;margin-inline-start:0}}
#freeonly[aria-pressed="true"]{background:var(--dune);border-color:var(--dune);color:#fff}
.shelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(9rem,1fr));gap:.5rem;margin-block:.5rem}
.cup{display:grid;justify-items:center;text-align:center;gap:.15rem;background:var(--sunken);color:var(--chalk);padding:.7rem .4rem;font-size:.82rem}
.cup i{inline-size:1.6rem;block-size:1.2rem;background:var(--dune);clip-path:polygon(0 0,100% 0,85% 55%,60% 70%,65% 100%,35% 100%,40% 70%,15% 55%)}
.cup b{font-size:1.6rem}.cup a{color:#B9C7C0}
.toast{position:fixed;inset-inline:1rem;bottom:1rem;z-index:40;background:var(--pulse);color:#fff;padding:.8rem 1rem;font-weight:600;text-align:center}
body.clubtheme .bar{border-block-end:.35rem solid var(--club2)}
.yt{position:relative;aspect-ratio:16/9;margin-block:.6rem}
.yt iframe{position:absolute;inset:0;inline-size:100%;block-size:100%;border:0}
.replay input{inline-size:100%;margin-block:.5rem}
.rpsc{display:grid;grid-template-columns:1fr auto 1fr;gap:.6rem;align-items:center;text-align:center;font-family:var(--kufi);font-weight:800}
.rpsc b{font-size:2.2rem;background:var(--sunken);color:var(--chalk);padding:.1rem .7rem}
.wbox{min-block-size:70vh;display:grid;place-items:center}
.wb{display:grid;grid-template-columns:1fr;gap:.6rem;text-align:center;inline-size:100%}
.wb .wt{font-family:var(--kufi);font-weight:800;font-size:2rem}
.wb .ws2{font-size:clamp(4rem,20vw,9rem);line-height:1}
.wb .wst{color:var(--stone)}
.nlform{max-inline-size:28rem}
#carbtn[aria-pressed="true"]{background:var(--pulse);border-color:var(--pulse);color:#fff}
/* build_arabs.cjs pages + win probability (187) */
.wp svg{direction:ltr;display:block;inline-size:100%;block-size:auto;background:var(--raised);border:1px solid var(--line)}
.wp polygon.wd,.legend i.wd{fill:var(--line-2);background:var(--line-2)}
.wp line.wg{stroke:var(--ink);stroke-width:1.5;stroke-dasharray:3 3}.wp line.wr{stroke:var(--card-r);stroke-width:2}
.wp text.ax,.rchart text.ax{font:600 12px var(--digits);fill:var(--stone)}
.legend{display:flex;flex-wrap:wrap;gap:.3rem 1rem;font-size:.85rem;margin:.4rem 0}.legend i{display:inline-block;inline-size:.8rem;block-size:.8rem;margin-inline-end:.3rem;vertical-align:middle;border:1px solid var(--line)}
.star{border:2px solid var(--ink);background:var(--raised);padding:1rem;margin-block:1rem}.star .big{font:800 1.5rem/1.3 var(--kufi);margin:.3rem 0}
.star .kicker{font:600 .8rem var(--font-text);background:var(--dune);color:#fff;padding:.15rem .5rem}
.derbies{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(18rem,100%),1fr));gap:1rem}
.derby{display:block;border:1px solid var(--line);background:var(--raised);padding:.8rem;color:inherit;text-decoration:none}.derby h3{margin:0 0 .2rem;font-size:1rem}
.gm{border-block-end:1px dashed var(--line);padding-block-end:.3rem}.gm .m{border-block-end:0}.bc{margin:.1rem 0 .3rem;font-size:.85rem}
.free{font-size:.75rem;border:1px solid var(--ink);padding:0 .3rem}
.yl,.trl,.sq,.wcl,.exl{list-style:none;margin:0;padding:0}
.yl li,.trl li,.wcl li{padding:.45rem 0;border-block-end:1px dashed var(--line)}
.yl li.k-final{font-weight:600}
.sq{columns:2 12rem;column-gap:1.5rem}.sq li{break-inside:avoid;padding:.25rem 0}
.tag{font-size:.75rem;background:var(--sunken-2);padding:.05rem .4rem;white-space:nowrap}
.rW{font-weight:700}.rL{color:var(--stone)}
.up,.dn{font-size:.75rem;color:var(--stone)}
.chk{display:inline-flex;align-items:center;gap:.3rem;font-size:.9rem}
.exl li{display:grid;grid-template-columns:5.5rem 1fr 3rem 1fr;gap:.4rem;align-items:center;padding:.35rem 0;border-block-end:1px dashed var(--line);font-size:.9rem}
.exl li>span:last-child{grid-column:2 / -1;margin-block-start:-.2rem}.exl .sc{text-align:center;font-family:var(--digits);font-size:1.1rem}.exl .win{font-weight:700}
.st.abt td,.st.abt th{white-space:nowrap}
.st.wrapn td.tm{white-space:normal;min-inline-size:9rem}
.cpath,.hmc{display:flex;flex-wrap:wrap;gap:2px}.cpath a,.hmc i{inline-size:12px;block-size:12px;display:block;background:var(--line)}
.cpath .fW,.hmc .fW{background:var(--inkbg)}.cpath .fD,.hmc .fD{background:var(--stone);opacity:.55}.cpath .fL,.hmc .fL{background:var(--line)}
.hm{display:grid;gap:.35rem}.hmr{display:grid;grid-template-columns:3.6rem 1fr 2.4rem;gap:.5rem;align-items:center}.hmc i{inline-size:8px;block-size:8px}
.comm{list-style:none;margin:0;padding:0}.comm li{display:grid;grid-template-columns:2.6rem 1fr;gap:.5rem;padding:.45rem 0;border-block-end:1px dashed var(--line)}.comm b{font-family:var(--digits);color:var(--stone)}
.lead.pow li{align-items:start}.lead.pow .who{flex-wrap:wrap}.lead.pow .who .small{flex-basis:100%;color:var(--ink)}
.lead.pow .who,.lead.pow .who *{white-space:normal;overflow:visible;text-overflow:clip}

/* ===== تيفو v3: "the stand at night" (redesign/DESIGN-v3.md). Appended after v2's tifo.css, whose surface colours the
   build re-maps (background:var(--chalk) -> --surf, var(--night) -> --board …). Night pitch is the ground; chalk is text;
   dune = my team / selected; pulse = live; yellow/red = cards. Flat cards, no radius, no shadow. Logical properties. */
:root{
  /* W2.2 role tokens (one set; everything below reads these) */
  --ground:#0A2620; --raised:#14403A; --raised-hi:#1A4A42; --sunken:#061B16; --sunken-2:#0F3129; --pitch:var(--pitch);
  --text:#F6F7F2; --text-2:#B9C7C0; --text-3:#A7B6AF; --rule:#F6F7F22B; --rule-2:#F6F7F214; --rule-ctl:#F6F7F280;
  --mine:#B07A3B; --live:#10A04B; --live-text:#5BE08F; --card-y:#F2C230; --card-r:#D8343F; --focus:#B07A3B; --inkbg:#2A3833;
  /* scales */ --z-bar:30; --z-mini:25; --z-sheet:45; --z-scrim:40; --z-top:80; --t1:160ms; --t2:240ms; --t3:480ms;
  --fs-1:.75rem; --fs-2:.85rem; --fs-3:.95rem; --fs-4:1.15rem; --fs-5:1.5rem; --fs-6:clamp(2rem,1.2rem + 4.5vw,4.4rem);
  /* v2 names, kept as aliases of the roles */
  --bg:var(--ground); --surf:var(--raised); --surf-2:var(--sunken-2); --board:var(--sunken); --ink:var(--text); --stone:var(--text-3); --tert:var(--text-2);
  --line:var(--rule); --line-2:var(--rule-2); --concrete:var(--ground); --concrete-2:var(--sunken-2); --dune:var(--mine); --pulse:var(--live);
  --topH:3.5rem; --tabH:3.9rem; --gutter:clamp(1rem,.6rem + 2vw,3rem); --wide:1200px; color-scheme:dark;
}
html{scroll-padding-block-start:calc(var(--topH) + 3.2rem)}
body.v3{background:var(--bg);color:var(--ink);overflow-x:hidden}
body.v3.locked{overflow:hidden}
.v3 a:hover{color:var(--ink)}
.v3 .muted{color:var(--stone)}
.v3 main{min-block-size:60vh}
.vh{position:absolute!important;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0 0 0 0)}.skip:focus{inline-size:auto;block-size:auto;clip:auto;inset-inline-start:1rem;inset-block-start:1rem;z-index:99;background:var(--ink);color:var(--bg);padding:.4rem .8rem}
.v3 h1{font-size:clamp(2rem,1.2rem + 4.5vw,4.4rem);line-height:1.2;margin:.2rem 0 .1rem;letter-spacing:0}
.v3 h2{font-size:1.1rem;margin:0}
.v3 h2::before{background:var(--ink)}

/* ---- top bar: transparent over the hero, night glass once scrolled */
.top{position:fixed;inset-block-start:0;inset-inline:0;z-index:30;block-size:var(--topH);transition:background-color .25s,border-color .25s;border-block-end:1px solid transparent;background:linear-gradient(#0A2620cc,#0A262000)}
.top.solid{background:#0A2620eb;border-block-end-color:var(--line-2);}
.top .wrap{display:flex;align-items:center;gap:1.4rem;block-size:100%}
.top .brand{font-size:1.5rem}
.pnav{display:none}
.acts{margin-inline-start:auto;display:flex;gap:.25rem}
.ib{display:inline-grid;place-items:center;inline-size:2.5rem;block-size:2.5rem;background:none;border:0;color:var(--ink);cursor:pointer;padding:0}
.ib svg,.tabbar svg,.pnav svg{inline-size:1.3rem;block-size:1.3rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:square}
.ib:hover{background:#F6F7F214}
@media (min-width:880px){
  .pnav{display:flex;gap:1.6rem;margin-inline-start:1rem}
  .pnav a,.pnav button{display:flex;align-items:center;gap:.4rem;background:none;border:0;cursor:pointer;color:var(--tert);font-weight:600;font-size:.95rem;padding-block:.4rem;border-block-end:2px solid transparent}
  .pnav svg{display:none}
  .pnav a:hover,.pnav button:hover{color:var(--ink)}
  .pnav [aria-current]{color:var(--ink);border-block-end-color:var(--dune)}
}
/* ---- bottom tab bar (phones) */
.tabbar{position:fixed;inset-block-end:0;inset-inline:0;z-index:30;display:grid;grid-template-columns:repeat(5,1fr);background:#061B16f2;border-block-start:1px solid var(--line-2);padding-block-end:env(safe-area-inset-bottom);}
.tabbar a,.tabbar button{display:grid;justify-items:center;gap:.15rem;padding:.5rem 0 .45rem;background:none;border:0;color:var(--tert);font-size:.78rem;font-weight:600;cursor:pointer;border-block-start:2px solid transparent}
.tabbar [aria-current]{color:var(--ink);border-block-start-color:var(--dune)}
body.v3{padding-block-end:calc(var(--tabH) + env(safe-area-inset-bottom))}
@media (min-width:880px){.tabbar{display:none}body.v3{padding-block-end:0}}

/* ---- hero: key art (the stand) under a night scrim; the type sits on solid night */
.hero{position:relative;overflow:hidden;display:flex;align-items:flex-end;background:var(--bg);isolation:isolate}
.hero canvas{position:absolute;inset:0;opacity:.82;inline-size:100%;block-size:100%;z-index:-2;touch-action:pan-y;will-change:transform}
.hero .scrim{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#0A2620cc 0%,#0A262059 24%,#0A262066 44%,#0A2620e6 72%,#0A2620 94%),radial-gradient(90% 60% at 50% 70%,#0A2620a6,#0A262000 70%)}
.hero-in{position:relative;inline-size:100%;padding-block:calc(var(--topH) + 3.5rem) 1.6rem}
.hhero{min-block-size:clamp(30rem,78svh,44rem)}   /* W2.5: the first rail («فريقك») peeks above the fold at 390x844 */
@media (min-width:880px){.hhero{min-block-size:clamp(28rem,68svh,40rem)}}
.hk{margin:0 0 .6rem;color:var(--tert);font-size:.88rem}
.hk a{color:var(--tert);border-block-end:1px solid var(--line)}
.kick{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--kufi);font-weight:800;font-size:.78rem;padding:.25rem .6rem;background:var(--ink);color:var(--bg);margin-block-end:.9rem}
.hl{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:clamp(.6rem,3vw,3rem);max-inline-size:62rem}
.htm{display:grid;justify-items:center;gap:.6rem;font-family:var(--kufi);font-weight:800;font-size:clamp(1.05rem,.55rem + 2.6vw,3rem);line-height:1.3;text-align:center;color:var(--ink);min-inline-size:0}
.htm span{overflow-wrap:normal;word-break:keep-all}
img.logo.xl{inline-size:clamp(3.8rem,2.5rem + 7vw,7.5rem);block-size:clamp(3.8rem,2.5rem + 7vw,7.5rem);filter:drop-shadow(0 0 0 transparent)}
img.logo.md{inline-size:2.1rem;block-size:2.1rem}
.hsc{display:grid;justify-items:center;text-align:center;color:var(--ink);padding-block-end:.4rem}
.hsc .dg.big,.board .sc .dg{font-size:clamp(3.6rem,1.8rem + 10vw,8.5rem);line-height:.95;letter-spacing:.02em}
.hsc .st{font-size:.9rem;color:var(--tert);margin-block-start:.3rem}
.hsc.live .dg,.hsc .st.live{color:var(--live-text)}
.hero-acts{display:flex;flex-wrap:wrap;gap:.6rem;margin-block-start:1.5rem}
.cta,.ghost{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-block-size:2.9rem;padding:.55rem 1.4rem;font-family:var(--kufi);font-weight:800;font-size:.95rem;cursor:pointer;border:2px solid var(--ink)}
.cta{background:var(--ink);color:var(--bg)}.cta:hover{background:#fff;color:var(--bg)!important}
.ghost{background:#0A262066;color:var(--ink)}.ghost:hover{background:#F6F7F21f}
#since:empty{display:none}
.hero #uaecd{min-block-size:2.2rem}   /* reserved: the countdown fills it after load (no layout shift) */
body:not([data-page="home"]):not([data-page="team"]) #uaecd:empty{display:none}
#uaecd{margin-block-start:1rem;max-inline-size:34rem}
.hero #uaecd .cd{display:inline-flex;gap:.7rem;align-items:baseline;background:none;border:0;padding:0;margin:0;color:var(--tert)}.hero #uaecd .cd b{font:600 .85rem var(--font-text);color:var(--tert)}.hero #uaecd .cd br,.hero #uaecd .cd .small{display:none}.hero #uaecd .cd .dg{font-size:1.25rem;color:var(--ink)}
/* home: the hero sits inside the viewport with the first rail peeking */
@media (min-width:880px){.hhero .hero-in{padding-block-end:3rem}.hl{margin-inline:0}}

/* match hero: the v2 scoreboard re-staged as a title card */
.mhero{min-block-size:clamp(24rem,64svh,36rem)}
.mhero .board{background:none;margin:0;padding:0;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:clamp(.6rem,3vw,3rem);align-items:end}
.mhero .board .band{display:none}
.mhero .board .tm{font-size:clamp(1.2rem,.8rem + 2.6vw,2.6rem);gap:.6rem;min-inline-size:0;text-align:center;overflow-wrap:break-word}   /* 503: a long name + country tag wraps instead of pushing the other team off a phone */
.mhero .board img.logo.lg{inline-size:clamp(3.4rem,2.4rem + 6vw,6.5rem);block-size:clamp(3.4rem,2.4rem + 6vw,6.5rem)}
.mhero .board .sc .st{font-size:.9rem}
.mhero .timeline{background:none;margin:1.3rem 0 0;padding:0;max-inline-size:52rem}
.mhero .tl .axis{background:#F6F7F233}
/* competition hero */
.chero{min-block-size:clamp(24rem,60svh,34rem)}
.chero .season{color:var(--tert);margin:0}
.hfacts{display:flex;flex-wrap:wrap;gap:.6rem 2.2rem;margin:1.2rem 0 0}
.hfacts div{position:relative;min-inline-size:8rem}
.hfacts dt{font-size:.78rem;color:var(--tert)}
.hfacts dd{margin:0;font-weight:600;display:flex;align-items:center;gap:.35rem;flex-wrap:wrap}
.hfacts dd .num{font-size:1.4rem}
.hfacts dd small{color:var(--tert)}
.prog{display:block;block-size:3px;background:var(--line);margin-block-start:.35rem;inline-size:100%}
.prog::after{content:"";display:block;block-size:100%;inline-size:var(--p);background:var(--ink)}
.lv{display:inline-flex;align-items:center;color:var(--live-text);font-weight:600;margin-inline-start:.6rem}

/* ---- match mini-bar: sticky compact score when the hero has left */
.mini{visibility:hidden;position:fixed;inset-block-start:var(--topH);inset-inline:0;z-index:25;background:#061B16f2;border-block-end:1px solid var(--line-2);transform:translateY(-110%);transition:transform .22s ease;}
.mini-on .mini{transform:none;visibility:visible}
.mini .wrap{display:grid;grid-template-columns:1fr auto 1fr;grid-auto-flow:column;grid-auto-columns:auto;align-items:center;gap:.6rem;block-size:3rem}
.mini .mt{display:flex;align-items:center;gap:.45rem;min-inline-size:0;font-family:var(--kufi);font-weight:800;font-size:.9rem}
.mini .mt b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mini .mt.a{justify-content:flex-end}
.mini .ms{display:grid;justify-items:center;line-height:1}
.mini .ms .dg{font-size:1.45rem}.mini .ms small{font-size:.78rem;color:var(--tert)}
.mini .ms.live .dg,.mini .ms.live small{color:var(--live-text)}
.mini-on .mtabs{inset-block-start:calc(var(--topH) + 3rem)}

/* ---- page body, tabs (sticky under the bar), the single segmented control */
.body{padding-block-start:.4rem}
.mtabs{position:sticky;inset-block-start:var(--topH);z-index:20;background:var(--bg);margin:0 calc(var(--gutter) * -1) 1.2rem;padding-inline:var(--gutter);border-block-end:1px solid var(--line);gap:.2rem;transition:inset-block-start .22s}
.mtabs button{font-family:var(--kufi);font-weight:800;font-size:.86rem;padding:.9rem .62rem .75rem;color:var(--stone);border-block-end-width:3px}
.mtabs [aria-selected="true"]{color:var(--ink);border-block-end-color:var(--dune)}
@media (min-width:880px){.mtabs button{font-size:1rem;padding-inline:1.2rem}}
.seg{display:inline-flex;max-inline-size:100%;border:1px solid var(--line);margin-block:.2rem 1rem;overflow-x:auto;scrollbar-width:none;background:var(--surf-2);border-block-end:1px solid var(--line)}
.seg button{background:none;border:0;border-inline-start:1px solid var(--line-2);margin:0;padding:.5rem 1rem;color:var(--stone);font-weight:600;font-size:.88rem;white-space:nowrap;cursor:pointer;font-family:var(--font-text)}
.seg button:first-child{border-inline-start:0}
.seg [aria-selected="true"],.seg [aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.v3 #arabonly[aria-pressed="true"],.v3 #freeonly[aria-pressed="true"]{background:var(--ink);border-color:var(--line-2);color:var(--bg)}
section[data-pane]{animation:paneIn .28s ease both}
@keyframes paneIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.sub-h{font-family:var(--kufi);color:var(--tert);font-size:.85rem;margin:1.8rem 0 .4rem}

/* ---- rails: horizontal snap rows, starting at the right (RTL); the next card peeks */
.rail{margin-block:2.2rem 0}
.rail-h{display:flex;align-items:center;gap:.8rem;margin-block-end:.8rem}
.rail-h h2{font-size:clamp(1.1rem,.9rem + .8vw,1.5rem);display:flex;align-items:center;gap:.5rem}
.rail-h h2::before{display:none}
.more-l{margin-inline-start:auto;font-size:.85rem;color:var(--tert);background:none;border:0;cursor:pointer;padding:0;font-family:var(--font-text)}
.more-l:hover{color:var(--ink)}
.rail-s{display:grid;grid-auto-flow:column;grid-auto-columns:min(78%,17.5rem);gap:.7rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);scroll-padding-inline:var(--gutter);padding-block-end:.3rem}
.rail-s::-webkit-scrollbar{display:none}
.rail-s > *{scroll-snap-align:start}
.rail-a{display:none;margin-inline-start:.4rem;gap:.3rem}
.rail-h .more-l + .rail-a{margin-inline-start:.4rem}
.rail-a button{inline-size:2.2rem;block-size:2.2rem;border:1px solid var(--line);background:none;color:var(--ink);cursor:pointer;font-family:var(--digits);font-size:1.2rem}
.rail-a button:hover{background:var(--surf)}
@media (min-width:880px){.rail-a{display:flex}.rail-s{grid-auto-columns:17.5rem}.rail-h .rail-a:only-child,.rail-h h2 + .rail-a{margin-inline-start:auto}}
/* rail card: a match as key art */
.rc{position:relative;display:grid;gap:.6rem;background:var(--surf);padding:.75rem .9rem .9rem;border-block-start:3px solid transparent;min-block-size:9.2rem;overflow:hidden;transition:background-color .2s}
.rc::before,.rc::after{content:"";position:absolute;inset-block:0;inline-size:5px}
.rc::before{inset-inline-start:0;background:var(--hc)}.rc::after{inset-inline-end:0;background:var(--ac)}
.rc:hover{background:var(--raised-hi)}
.rc.live{border-block-start-color:var(--pulse)}
.rc.mine{border-block-start-color:var(--dune)}
.rc .cp{font-size:.78rem;color:var(--tert);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt3{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.4rem}
.rt3 .t{display:grid;justify-items:center;gap:.35rem;text-align:center;font-family:var(--kufi);font-weight:800;font-size:.84rem;line-height:1.35;min-inline-size:0}
.rt3 .t span{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.rt3 .mid{display:grid;justify-items:center;gap:.1rem}
.rt3 .mid .dg{font-size:1.9rem;line-height:1}
.rt3 .mid .st{font-size:.78rem;color:var(--tert);white-space:nowrap}
.rt3 .mid .st.live{color:var(--live-text)}
.rc.live .mid .dg{color:var(--live-text)}
/* my team rail: app.js paints #mine */
.rmine .mine-card{background:none;border:0;padding:0;margin:0;display:grid;grid-auto-flow:column;grid-auto-columns:min(86%,22rem);gap:.7rem;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter)}
.rmine .mine-card > .h{display:none}
.rmine .mine-card > p{grid-column:1/-1;background:var(--surf);padding:1rem;border-inline-start:3px solid var(--dune);color:var(--tert)}
.rmine .favrow{background:var(--surf);padding:.7rem .8rem;border-block-start:3px solid var(--dune)}
.rmine .favrow + .favrow{border-block-start:3px solid var(--dune);padding-block-start:.7rem}
.rmine .favrow .h{font-family:var(--kufi);font-weight:800;display:flex;align-items:center;gap:.4rem}
.rmine .favrow .h small{background:var(--dune);color:#fff;font:600 .78rem var(--font-text);padding:0 .35rem}
.rmine #themebtn{align-self:center;justify-self:start;border:1px solid var(--line);background:none;color:var(--tert)}

/* ---- the day list (the match centre) */
.daybox{margin-block-start:2.6rem;background:var(--surf-2);margin-inline:calc(var(--gutter) * -1);padding:1.2rem var(--gutter) 1rem}
@media (min-width:880px){.daybox{margin-inline:0;padding-inline:1.5rem}}
.daybox .livecount{margin:0 auto 0 0;margin-inline-start:auto;font-size:.82rem;color:var(--live-text)}
.v3 .daynav{border:1px solid var(--line);margin-block:.2rem .8rem;grid-template-columns:3rem 1fr 3rem}
.v3 .daynav button{background:none;color:var(--ink)}
.v3 .daynav button:hover{background:var(--surf)}
.v3 .daynav b{border-inline:1px solid var(--line)}
.segf{display:flex;inline-size:100%}
.segf button{flex:1}
#day.fold .comp-block:nth-of-type(n+5){display:none}
.unfold{display:block;inline-size:100%;background:none;border:1px solid var(--line);color:var(--ink);padding:.7rem;font-family:var(--kufi);font-weight:800;cursor:pointer;margin-block-start:.4rem}
.unfold:hover{background:var(--surf)}
.v3 .comp-head{border-block-end:1px solid var(--line);font-size:.9rem;padding-block:.6rem .45rem}
.v3 .comp-head a{color:var(--ink)}
.v3 .m{border-block-end-color:var(--line-2);padding-block:.7rem}
.v3 .m:hover{background:#F6F7F20a}
.v3 .chip{background:var(--board);min-block-size:2.5rem}
.v3 .chip.up{background:none;border:1px solid var(--line);color:var(--ink)}
.v3 .chip.live{background:var(--pulse);color:#fff}
.v3 .m.mine{box-shadow:inset -3px 0 0 var(--dune)}

/* ---- crest grid */
.cts{display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,auto);grid-auto-columns:min(40%,10rem);gap:.6rem;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter)}
@media (min-width:880px){.cts{grid-auto-flow:row;grid-template-rows:none;grid-template-columns:repeat(auto-fill,minmax(10.5rem,1fr));overflow:visible;margin-inline:0;padding-inline:0}}
.ct{display:grid;gap:.45rem;background:var(--surf);padding:.6rem .6rem .75rem;transition:background-color .2s}
.ct:hover{background:var(--raised-hi)}
.cm{display:grid;grid-template-columns:repeat(6,1fr);gap:2px;aspect-ratio:3/1.1}
.cm i{display:block}
.ct b{font-family:var(--kufi);font-weight:800;font-size:.84rem;line-height:1.4}
.ct small{font-size:.78rem;color:var(--tert);margin-block-start:-.35rem}

/* ---- editorial rail + shelf tiles (both open the reader panel) */
.edr .rail-s{grid-auto-columns:min(72%,15.5rem)}
.ed,.sht{position:relative;display:grid;align-content:start;gap:.45rem;text-align:start;background:var(--surf);border:0;color:var(--ink);padding:.9rem .9rem 1rem;cursor:pointer;font:inherit;min-block-size:9rem;transition:background-color .2s,transform .2s}
.ed:hover,.sht:hover{background:var(--raised-hi)}
.ed:focus-visible,.sht:focus-visible{outline:3px solid var(--dune);outline-offset:2px}
.ti{display:block;inline-size:1.7rem;block-size:1.7rem;color:var(--tert);margin-block-end:.2rem}.ti svg{inline-size:100%;block-size:100%}
.ti i{display:block;inline-size:.55rem;block-size:.55rem}
.tt2{font-family:var(--kufi);font-weight:800;font-size:.98rem;line-height:1.45}
.tz{font-size:.8rem;color:var(--tert);line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.em{font-size:.78rem;color:var(--ink);border-block-end:1px solid var(--line);justify-self:start;margin-block-start:auto}
.edb:empty{display:none}
.edb{background:var(--surf);padding:.9rem;min-block-size:9rem}
.edb .blk{margin:0}.edb h2{font-size:.98rem}.edb h2::before{display:none}.edb .facts-l{font-size:.82rem;padding-inline-start:1rem}
.shelf-h{display:flex;align-items:baseline;gap:.6rem;margin-block:2.2rem .8rem;border-block-start:1px solid var(--line);padding-block-start:1.2rem}
.shelf-h h3{margin:0;font-size:1rem}
.shelf3{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(14rem,46%),1fr));gap:.7rem}
@media (max-width:420px){.shelf3{grid-template-columns:1fr 1fr}.sht{min-block-size:8rem;padding:.75rem}.sht .tt2{font-size:.9rem}}
@media (min-width:880px){.sht:hover{transform:translateY(-2px)}}

/* ---- sheets (share/tools, more) and the reader panel: bottom sheets on phones, centred from 880px */
.scrimall{position:fixed;inset:0;z-index:40;background:#020A08b3;animation:fadeIn .2s ease}
.sheet,.panel{position:fixed;inset-inline:0;inset-block-end:0;z-index:45;max-block-size:92svh;display:flex;animation:sheetIn .22s ease}
.sheet[hidden],.panel[hidden]{display:none}
.sh-in,.pn-in{inline-size:100%;background:var(--surf-2);border-block-start:3px solid var(--ink);overflow:auto;overscroll-behavior:contain;padding:0 var(--gutter) calc(1.2rem + env(safe-area-inset-bottom))}
.sh-h,.pn-h{position:sticky;inset-block-start:0;z-index:2;display:flex;align-items:center;gap:.8rem;background:var(--surf-2);padding-block:1rem .8rem;border-block-end:1px solid var(--line-2);margin-block-end:1rem}
.sh-h h2,.pn-h h2{font-size:1.15rem}
.sh-h h2::before,.pn-h h2::before{display:none}
.pn-sub{font-size:.8rem;color:var(--tert)}
.pn-sub a{border-block-end:1px solid var(--line)}
.x{margin-inline-start:auto;background:none;border:1px solid var(--line);color:var(--ink);padding:.35rem .8rem;cursor:pointer;font-weight:600}
.x:hover{background:var(--surf)}
.sh-g,.mset{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(12rem,100%),1fr));gap:.5rem}
.sa{display:flex;align-items:center;justify-content:flex-start;gap:.5rem;min-block-size:3rem;background:var(--surf);border:0;border-inline-start:3px solid var(--line);color:var(--ink);padding:.6rem .9rem;font:600 .92rem var(--font-text);cursor:pointer;text-align:start}
.sa:hover{background:var(--raised-hi);border-inline-start-color:var(--ink)}
.sa[aria-pressed="true"]{border-inline-start-color:var(--dune);background:#B07A3B2e}
.v3 .spoil{border-width:0 0 0 0;border-inline-start:3px solid var(--line)}
.v3 .spoil[aria-pressed="true"]{background:#B07A3B2e;border-inline-start-color:var(--dune);color:var(--ink)}
.v3 #carbtn[aria-pressed="true"]{background:#10A04B26;border-inline-start-color:var(--pulse);color:var(--ink)}
.sh-list{display:grid;gap:.3rem;margin-block-start:1rem;border-block-start:1px solid var(--line-2);padding-block-start:.8rem}
.sh-list button{background:none;border:0;border-block-end:1px solid var(--line-2);color:var(--ink);text-align:start;padding:.55rem .2rem;cursor:pointer;font:inherit}
.sh-list button:hover{color:var(--tert)}
.mg{margin-block-start:1.4rem}
.mg h3{font-size:.8rem;color:var(--tert);margin:0 0 .5rem}
.ml{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(10rem,46%),1fr));gap:.1rem 1rem}
.ml a{padding:.5rem 0;border-block-end:1px solid var(--line-2);font-weight:600;font-size:.92rem}
.ml a:hover{color:var(--tert)}
.pn-b .pbody > .blk > h2{display:none}
.pn-b .blk{margin:0}
@media (min-width:880px){
  .sheet,.panel{inset:0;display:grid;place-items:center;padding:4vh 2rem;max-block-size:none}
  .sh-in{inline-size:min(40rem,100%);max-block-size:84vh;border:1px solid var(--line);border-block-start:3px solid var(--ink)}
  .pn-in{inline-size:min(62rem,100%);max-block-size:88vh;border:1px solid var(--line);border-block-start:3px solid var(--ink);padding-inline:2rem}
}
@keyframes sheetIn{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* ---- v2 components re-tuned for the night ground */
.v3 .catchup{background:var(--surf);border:0;border-inline-start:4px solid var(--ink);padding:.9rem 1rem;margin-block:0 1.2rem}
.v3 .catchup b{font-size:.95rem}
.v3 ul.ev li{border-block-end:1px solid var(--line-2);padding-block:.6rem;font-size:.92rem}
.v3 ul.ev li.g{background:linear-gradient(90deg,transparent,#F6F7F20d,transparent)}
.v3 ul.ev li.div{background:var(--surf);color:var(--tert);font-size:.8rem}
.v3 ul.ev .ico.goal{background:var(--ink)}
.v3 ul.ev .gs{background:var(--ink);color:var(--bg)}
.v3 ul.ev .subs{display:grid;gap:.1rem}
.v3 ul.ev .subs .in::before{content:"";display:inline-block;inline-size:.45rem;block-size:.45rem;background:var(--ink);margin-inline-end:.35rem;vertical-align:1px}
.v3 ul.ev .subs .out{color:var(--stone)}
.v3 ul.ev .subs .out::before{content:"";display:inline-block;inline-size:.45rem;block-size:.45rem;border:1px solid var(--stone);margin-inline-end:.35rem;vertical-align:1px}
.v3 .facts{border:1px solid var(--line);background:var(--surf-2)}
.v3 .facts div{border-color:var(--line-2)}
.v3 .tile{background:var(--surf);border-color:var(--line-2)}
.v3 .tile .ic{background:var(--board)}
.v3 .note{border:1px solid var(--line);background:var(--surf)}
.v3 .btn{border:1px solid var(--line);background:var(--surf);color:var(--ink)}
.v3 .btn:hover{background:var(--raised-hi);border-color:var(--ink);color:var(--ink)}
.v3 .blk{margin-block:0 2rem}
.v3 .blk h2{margin-block-end:.8rem}
.v3 [data-pane] > .blk > h2,.v3 [data-pane] > section.blk > h2{font-size:1.15rem}
.v3 table.st th{border-block-end:1px solid var(--line);color:var(--stone)}
.v3 table.st td{border-block-end:1px solid var(--line-2)}
.v3 table.st tbody tr:hover td{background:#F6F7F20a}
.v3 .h2hsum{border:1px solid var(--line);background:var(--surf)}
.v3 .stat .bar2 i{background:var(--ink)}
.v3 .stat .bar2 i + i{background:#6E8A80}
.v3 .pitch{border-color:var(--line)}
.v3 .chips{gap:.25rem}
.v3 .chips button{background:none;border:1px solid var(--line);color:var(--stone)}
.v3 .chips [aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.v3 .timeline{color:var(--tert)}
.v3 .form .L{background:var(--inkbg);color:var(--ink)}
.hlink{margin-block:0 1rem}
.faq{margin-block:2rem 0}
.faq summary{cursor:pointer;list-style:none;padding-block:1rem;border-block-start:1px solid var(--line)}
.faq summary::-webkit-details-marker{display:none}
.faq summary h2{display:inline-flex;font-size:1rem;color:var(--tert)}
.faq summary h2::after{content:"+";font-family:var(--digits);margin-inline-start:.6rem}
.faq[open] summary h2::after{content:"−"}
.v3 .foot{background:var(--board);margin-block-start:4rem;border-block-start:1px solid var(--line-2)}
.v3 .foot .wrap{display:grid;gap:1rem;padding-block:2rem}
.fbrand{display:flex;align-items:center;gap:.7rem}
.fl{display:flex;flex-wrap:wrap;gap:.3rem 1.2rem}
.fl a{color:var(--tert)}.fl a:hover{color:var(--ink)}
.pv{color:var(--dune)}
.v3 .ctrybox{z-index:60}
/* second screen, commentator mode: hide the v3 chrome too */
body.second .top,body.second .tabbar,body.second .mtabs,body.second .hero-acts,body.second .shelf-h,body.second .shelf3,body.second .mini,body.comm .top,body.comm .tabbar,body.comm .mini{display:none!important}
body.second .mhero{min-block-size:100svh}
/* spoilers: the v3 hero, mini-bar and rail scores blur too */
.nospoil .hsc .dg,.nospoil .rc:not(.shown) .mid .dg,.nospoil .mini .ms .dg,.nospoil .hero canvas{filter:blur(8px)}

/* ---- motion: sections fade up once; reduced motion = none */
.fx:not(.in){opacity:0;transform:translateY(8px);transition:opacity .4s ease,transform .4s ease}
.fx.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .fx:not(.in){opacity:1;transform:none;transition:none}
  section[data-pane],.sheet,.panel,.scrimall{animation:none}
  .mini,.top,.mtabs{transition:none}
}
@media print{.top,.tabbar,.mini,.hero canvas,.hero .scrim,.sheet,.panel{display:none!important}body.v3{background:#fff;color:#0E1512}}

/* tabs that overflow at 390 fade at the far (left) edge so the rest reads as scrollable */
@media (max-width:420px){.mtabs{gap:0}.mtabs button{font-size:.8rem;padding-inline:.48rem}}
/* the leader's number: chalk, not dune (dune = my team only) */
.v3 ol.lead li:first-child b{background:var(--ink);color:var(--bg)}

/* "free" is not live: outline, not pulse */
.v3 .free{background:none;color:var(--ink);border:1px solid var(--line);padding:0 .35rem}
.v3 .ok{background:none;color:var(--ink);border:1px solid var(--ink)}

/* ---- competition key art: the league's own logo, lit on night pitch (owner, 2026-09-27) */
.chero.haslogo{background:var(--bg)}   /* rule 13 (QA 24/38/66): no colour washes behind the league logo */
.lgart{position:absolute;z-index:-2;inset-block-start:calc(var(--topH) + .5rem);left:50%;translate:-50% 0;inline-size:min(62vw,15rem);aspect-ratio:1;display:grid;place-items:center;perspective:900px;will-change:transform}


.lglogo{position:relative;inline-size:78%;block-size:auto;filter:drop-shadow(0 12px 24px #0008);transition:transform .5s cubic-bezier(.2,.7,.2,1);animation:logoIn 1.1s cubic-bezier(.2,.7,.2,1) both}
.chero.haslogo .scrim{background:linear-gradient(180deg,#0A262000 0%,#0A262000 40%,#0A2620cc 72%,#0A2620 96%)}
.chero.haslogo .hero-in{padding-block-start:calc(var(--topH) + min(62vw,15rem) + 1.5rem)}
@media (min-width:880px){
  .chero.haslogo{min-block-size:clamp(28rem,66svh,38rem)}
  .lgart{inset-block:0;left:7%;translate:0 0;margin-block:auto;inline-size:clamp(15rem,30vw,25rem)}
  .chero.haslogo .hero-in{padding-block-start:calc(var(--topH) + 4rem)}
  .chero.haslogo .scrim{background:linear-gradient(90deg,#0A262000 0%,#0A262000 40%,#0A262099 62%,#0A2620d9 100%),linear-gradient(180deg,#0A262000 60%,#0A2620 100%)}
}
@keyframes logoIn{from{opacity:0;transform:scale(.94) translateY(10px)}to{opacity:1}}
/* crest tiles with the league logo */
.ct.lgt{background:var(--surf)}
.cl{display:grid;place-items:center;block-size:5.2rem;position:relative;overflow:hidden}
.cl::before{content:none}
.cl img{position:relative;block-size:4rem;inline-size:auto;max-inline-size:85%;object-fit:contain;filter:drop-shadow(0 6px 14px #0008)}
.cts.all{grid-auto-flow:row;grid-template-rows:none;grid-template-columns:repeat(auto-fill,minmax(min(9.5rem,46%),1fr));overflow:visible;margin-inline:0;padding-inline:0}
/* competitions list hero: a slow wall of logos */
.lhero{min-block-size:clamp(18rem,42svh,26rem)}
.lgwall{position:absolute;z-index:-2;inset:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(4.5rem,1fr));gap:1.6rem;padding:4.5rem 1rem 0;opacity:.35;place-items:center}
.lgwall img{inline-size:3.2rem;block-size:3.2rem;object-fit:contain}
.lhero .scrim{background:linear-gradient(180deg,#0A262066 0%,#0A2620cc 55%,#0A2620 92%)}
@media (prefers-reduced-motion:reduce){.lglogo{animation:none}.lglogo{transition:none}}

/* pages not yet re-staged (stage 3+): the v2 body in a padded column under the fixed bar */
.legacy{padding-block-start:calc(var(--topH) + .8rem)}
/* 369 / 372: generated match notes (owner-approved kinds) */
.why{margin-block:0 1.2rem;padding-block:.2rem .4rem;border-inline-start:4px solid var(--ink);padding-inline-start:1rem}
.why b,.quick b{display:block;font-family:var(--kufi);font-size:.85rem;color:var(--tert);margin-block-end:.3rem}
.why p{margin:.25rem 0;font-size:clamp(1.05rem,.95rem + .6vw,1.35rem);line-height:1.7;font-weight:600}
.quick{background:var(--surf);padding:.9rem 1rem;margin-block:0 1.2rem;border-block-start:3px solid var(--ink)}
.quick ol{margin:0;padding-inline-start:1.2rem;display:grid;gap:.35rem;font-size:.95rem}
/* stage 3: team hero */
.thero{min-block-size:clamp(22rem,56svh,32rem)}
.tid{display:flex;align-items:center;gap:clamp(.8rem,3vw,2rem)}
.tid h1{margin:0}
.tid .season{margin:.2rem 0 0;color:var(--tert)}
.tnext{margin:1.1rem 0 0;display:flex;flex-wrap:wrap;align-items:baseline;gap:.2rem .5rem;font-size:.95rem}
.tnext span{font-family:var(--kufi);font-size:.78rem;color:var(--bg);background:var(--ink);padding:.05rem .45rem}
.tnext a{font-weight:600;border-block-end:1px solid var(--line)}
.cta.on{background:var(--dune);border-color:var(--dune);color:#fff}
.v3 .th,.v3 .strip{display:none}
/* stages 4-6: compact hero for the other pages */
.phero{min-block-size:clamp(13rem,34svh,20rem)}
.phero .hero-in{padding-block:calc(var(--topH) + 2.2rem) 1.3rem}
.phero h1{font-size:clamp(1.7rem,1.1rem + 3.2vw,3.2rem)}
.phero .season{color:var(--tert);margin:.2rem 0 0}
.phero.haslogo .lgart{inline-size:min(40vw,9rem);inset-block-start:calc(var(--topH) + .2rem)}
.phero.haslogo .hero-in{padding-block-start:calc(var(--topH) + min(40vw,9rem) + .6rem)}
@media (min-width:880px){.phero.haslogo .lgart{inline-size:12rem;left:8%}.phero.haslogo .hero-in{padding-block-start:calc(var(--topH) + 2.5rem)}}
.phero .scrim{background:linear-gradient(180deg,#0A2620d9 0%,#0A262080 40%,#0A2620e6 80%,#0A2620 100%)}
.na{font-size:.8rem;color:var(--stone);margin-block:1.2rem 0}
.v3 .pstats{border:1px solid var(--line)}
.v3 .tcard.big{margin-block-end:1.6rem}
/* the hero actions never re-wrap when the web fonts land (that re-wrap was a 0.2 layout shift) */
@media (max-width:560px){.hero-acts{flex-wrap:nowrap}.hero-acts > *{flex:1 1 0;min-inline-size:0;padding-inline:.5rem;white-space:nowrap;font-size:.88rem}}

/* ===== owner items (2026-09-27) ===== */
/* 355 goal moment: the scorer's colour flashes, the name sweeps across, the score flips like an airport board */
.goalfx{position:fixed;inset:0;z-index:70;pointer-events:none;display:grid;place-content:center;justify-items:center;gap:.2rem;background:color-mix(in srgb,var(--gc) 55%,transparent);animation:gflash 1.4s ease forwards}
.goalfx b{font:800 clamp(3rem,12vw,8rem)/1 var(--kufi);color:#fff;text-shadow:0 4px 30px #0008}
.goalfx span{font:800 clamp(1.1rem,4vw,2.2rem) var(--kufi);color:#fff;animation:gsweep 1.2s cubic-bezier(.2,.7,.2,1) forwards;white-space:nowrap}
@keyframes gflash{0%{opacity:0}12%{opacity:1}70%{opacity:1}100%{opacity:0}}
@keyframes gsweep{from{transform:translateX(-60vw)}to{transform:translateX(60vw)}}
.flip{display:inline-block;animation:flip3 .6s cubic-bezier(.3,.7,.3,1)}
@keyframes flip3{0%{transform:perspective(400px) rotateX(0)}50%{transform:perspective(400px) rotateX(-90deg)}100%{transform:perspective(400px) rotateX(0)}}
@media (prefers-reduced-motion:reduce){.goalfx,.goalfx span,.flip{animation:none}.goalfx{background:color-mix(in srgb,var(--gc) 35%,transparent)}}
/* 357 match-state hero */
.mcd{display:block;margin-block-start:.4rem;font-size:.85rem;color:var(--tert)}
.mcd .num{font-size:1.25rem;color:var(--ink)}
/* owner item 6 (rule 12): one breath per data update instead of an endless pulse */
body[data-state="live"] .mhero .scrim.breathe{animation:livepulse 1.6s ease-in-out 1}
@keyframes livepulse{0%,100%{opacity:1}50%{opacity:.86}}
body[data-state="final"] .mhero .sc .st{color:var(--ink);font-weight:600}
@media (prefers-reduced-motion:reduce){body[data-state="live"] .mhero .scrim{animation:none}}
/* 359 cinema mode */
.cine{position:fixed;inset:0;z-index:80;background:radial-gradient(80% 70% at 50% 40%,#123A31,#061B16);display:grid;place-items:center;padding:4vmin}
.cine .x{position:absolute;inset-block-start:1rem;inset-inline-end:1rem}
.cine .ci{inline-size:100%;max-inline-size:1400px;text-align:center}
.ct3{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:4vmin}
.ct3 span{display:grid;justify-items:center;gap:1vmin;font:800 clamp(1rem,4.5vmin,4rem) var(--kufi);min-inline-size:0;overflow-wrap:anywhere}
.ct3 img.logo.xl{inline-size:clamp(4rem,18vmin,12rem);block-size:clamp(4rem,18vmin,12rem)}
.cs{font-size:clamp(3.5rem,19vmin,18rem)!important;line-height:.9;white-space:nowrap}
.cine .cn{font:700 clamp(1.4rem,6vmin,4rem) var(--digits);color:var(--tert);margin:2vmin 0 0}.cine .cn.live{color:var(--live-text)}
.cine .ce{font-size:clamp(1rem,3.4vmin,2rem);color:var(--tert)}
/* 370 «لو خلصت الحين» */
.lt{background:var(--surf);padding:.7rem .9rem;margin-block:0 1.2rem;border-inline-start:3px solid var(--pulse)}
.lt b{font-family:var(--kufi);font-size:.85rem;color:var(--live-text)}
.lt tr.hot td{background:#F6F7F214;font-weight:700}
/* 376 lineup builder, 379 embed code */
.xi{display:grid;gap:.6rem;background:linear-gradient(var(--pitch),#0A2620);padding:1rem .6rem;margin-block:.8rem;border:1px solid var(--line)}
.xr{display:flex;justify-content:center;gap:.3rem}.xr select{min-inline-size:0;flex:1 1 0}
.xr select{max-inline-size:9.5rem;background:var(--surf);color:var(--ink);border:1px solid var(--line);padding:.35rem}
.embc{inline-size:100%;background:var(--board);color:var(--ink);border:1px solid var(--line);font:12px/1.5 ui-monospace,monospace;direction:ltr;margin-block:.4rem}
/* 358 floodlights on the lineup pitch */
.v3 .pitch{background:radial-gradient(60% 45% at 0 0,#ffffff1f,transparent 70%),radial-gradient(60% 45% at 100% 0,#ffffff1f,transparent 70%),radial-gradient(60% 45% at 0 100%,#ffffff17,transparent 70%),radial-gradient(60% 45% at 100% 100%,#ffffff17,transparent 70%),repeating-linear-gradient(0deg,var(--pitch) 0 8%,var(--pitch) 8% 16%);box-shadow:inset 0 0 60px #0008}
/* 361 skeletons shaped like the real content (client-filled slots) */
@keyframes skel{0%{background-position:100% 0}100%{background-position:-100% 0}}
.rmine #mine:empty{block-size:9rem;background:linear-gradient(90deg,var(--surf) 0,var(--raised-hi) 50%,var(--surf) 100%) 0 0/200% 100%;animation:skel 1.4s linear 3}
.v3 p.empty:only-child:not(:empty){position:relative}
.skel{block-size:10rem;color:transparent;background:linear-gradient(90deg,var(--surf) 0,var(--raised-hi) 50%,var(--surf) 100%) 0 0/200% 100%;animation:skel 1.4s linear 3}   /* W1.8: only placeholders shimmer, and only 3 times */
@media (prefers-reduced-motion:reduce){.rmine #mine:empty,.skel{animation:none}}
/* 356 view transitions: a crest morphs into the team page hero */
@view-transition{navigation:auto}
::view-transition-group(*){animation-duration:.35s}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}
.verdict{background:var(--surf);padding:.8rem 1rem;border-inline-start:4px solid var(--ink);font-size:1.02rem;margin-block:.4rem 1rem}.verdict b{font-family:var(--kufi);font-size:.8rem;color:var(--tert);display:block}

/* ===== polish batch 387–403 ===== */
/* 387 the stand calmer (keyart.js), and a heavier night floor so the score is the hero */
.hero .scrim{background:linear-gradient(0deg,#0A2620 0%,#0A2620f2 22%,#0A2620b3 46%,#0A262066 72%,#0A2620a6 100%)!important}
.hero canvas{opacity:.7}
/* 401 floodlights: soft white from the hero's top corners */
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(45% 55% at 0 0,#ffffff14,transparent 70%),radial-gradient(45% 55% at 100% 0,#ffffff14,transparent 70%)}
/* 399 grass mowing stripes on the night ground, felt not seen */
body.v3{background:repeating-linear-gradient(180deg,#ffffff00 0 64px,#ffffff08 64px 128px),var(--bg)}
/* 400 stadium-board digits: each digit in its own cell */
.cell{display:inline-block;font-style:normal;min-inline-size:.62em;padding:0 .04em;margin:0 .03em;text-align:center;background:linear-gradient(#ffffff0d,#ffffff05);box-shadow:inset 0 0 0 1px #ffffff14,inset 0 -.5em 0 #00000024;border-radius:0}
.mini .cell,.rc .cell{box-shadow:none;background:none;min-inline-size:0;margin:0}
.hsc .st,.board .sc .st{font-family:var(--digits);letter-spacing:.02em}
/* 389 substitutions: TV-style arrows, two compact lines */
.v3 ul.ev .subs{display:grid;gap:0;font-size:.84rem;line-height:1.5}
.v3 ul.ev .subs .in::before,.v3 ul.ev .subs .out::before{display:none}
.arr{font-style:normal;font-weight:700;display:inline-block;inline-size:1em;text-align:center;margin-inline-end:.25rem}
.arr.up{color:var(--live-text)}.arr.dn{color:var(--stone)}
.v3 ul.ev .subs .out{color:var(--stone)}
/* 390 period separators: a thin chalk line with small centred text */
.v3 ul.ev li.div{display:flex;align-items:center;gap:.7rem;background:none;border:0;padding:.6rem 0;margin:.2rem 0;font:600 .78rem var(--font-text);color:var(--stone)}
.v3 ul.ev li.div::before,.v3 ul.ev li.div::after{content:"";flex:1;block-size:1px;background:var(--line)}
/* 391 the trimmed catch-up */
.catchup.mini{padding:.5rem .8rem;border-inline-start-width:2px}.catchup.mini p{font-size:.85rem;margin:0}
/* 393 buttons: one filled primary per area; secondaries are quiet */
.ghost{border:0;background:#F6F7F214;min-block-size:2.9rem}.ghost:hover{background:#F6F7F229}
.v3 .btn{border:0;background:#F6F7F214;color:var(--ink);font-weight:600}.v3 .btn:hover{background:#F6F7F229;color:var(--ink)}
.x{border:0;background:#F6F7F214}
.unfold{border:0;background:#F6F7F20f}
.sa{border-inline-start:0;background:#F6F7F20d}.sa:hover{border-inline-start:0}
/* 394 competition hero on phones: a small logo beside a compact title, the table above the fold */
@media (max-width:879px){
  .chero.haslogo{min-block-size:0}
  .chero.haslogo .lgart{inline-size:5.6rem;left:auto;inset-inline-end:var(--gutter);translate:0 0;inset-block-start:calc(var(--topH) + 1.1rem)}
  .chero.haslogo .hero-in{padding-block:calc(var(--topH) + 1.2rem) 1rem;padding-inline-end:calc(var(--gutter) + 6.4rem)}
  .chero h1{font-size:clamp(1.5rem,1rem + 3vw,2.2rem)}
  .chero .hfacts{gap:.4rem 1.2rem;margin-block-start:.7rem}.chero .hfacts div{min-inline-size:0}.chero .hfacts dd .num{font-size:1.1rem}
  .chero .hero-acts{margin-block-start:.9rem}.chero .hero-acts .cta,.chero .hero-acts .ghost{min-block-size:2.5rem;font-size:.85rem}
  .chero .hfacts div:nth-child(n+3){display:none}
}
/* 395 table zones: a thin 3px edge on the row, no filled square behind the rank */
.v3 table.st td.rk.z{position:relative}
.v3 table.st td.rk.z::before{content:"";position:absolute;inset-block:.35rem;inset-inline-start:0;inline-size:3px;background:var(--z)}
.v3 table.st td.rk span{background:none!important;color:var(--ink)!important}
/* 396 footer: four clear columns */
.fcols{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.fcols h3{font-size:.8rem;color:var(--tert);margin:0 0 .5rem}
.fcols a{display:block;padding:.25rem 0;color:var(--ink);font-size:.9rem}.fcols a:hover{color:var(--tert)}
@media (max-width:640px){.fcols{grid-template-columns:1fr 1fr;gap:1.2rem 1rem}}
/* 398 pitch-line dividers: a thin chalk line with a half centre circle */
.shelf-h{border-block-start:0;position:relative;padding-block-start:1.6rem}
.shelf-h::before{content:"";position:absolute;inset-inline:0;inset-block-start:0;block-size:1px;background:var(--line)}
.shelf-h::after{content:"";position:absolute;inset-block-start:0;left:50%;inline-size:2.4rem;block-size:1.2rem;translate:-50% 0;border:1px solid var(--line);border-block-start:0;border-radius:0 0 1.2rem 1.2rem}
/* 402 editorial icons: one line icon per topic, single colour */
.edi{inline-size:1.7rem;block-size:1.7rem;fill:none;stroke:var(--tert);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-block-end:.2rem}
/* 403 «فريقك» empty state: a crest grid of your country's clubs */
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(5.2rem,1fr));gap:.5rem;margin-block-start:.6rem;grid-column:1/-1}
.mgrid button{display:grid;justify-items:center;gap:.3rem;background:var(--surf);border:0;color:var(--ink);padding:.6rem .3rem;cursor:pointer;font:600 .78rem var(--font-text)}
.mgrid button:hover{background:var(--raised-hi)}
.rmine .mine-card{grid-auto-flow:row;grid-auto-columns:auto}
/* 388 the national countdown inside a rail card */
.rc #uaecd{margin:0;min-block-size:0;font-size:.78rem}.rc #uaecd .cd{display:flex;gap:.4rem;background:none;border:0;padding:0;margin:0;color:var(--tert)}.rc #uaecd .cd b,.rc #uaecd .cd br,.rc #uaecd .cd .small{display:none}.rc #uaecd .dg{font-size:.9rem;color:var(--ink)}

/* ===== Wave 1 (audit 2026-09-27) ===== */
/* W1.1e/g: stale or weak data is dimmed and dated, never hidden */
.stale .hsc .dg,.stale .board .sc .dg,.stale .board .sc .st,.stale .hsc .st,.stale .kick,.stale .rc.live .mid,.stale .chip.live,.stale .mini .ms{opacity:.5}
.stalen,.netnote{margin:.6rem 0 0;font-size:.78rem;color:var(--tert)}
.netnote{color:var(--ink)}
/* W1.5: what the old colour remap made invisible */
.v3 .pl b{background:var(--ink);color:var(--bg)}
.v3 .tl .played{background:var(--ink)}
.v3 .tl .ev.goal{background:var(--ink);border-radius:50%;inline-size:.85rem;block-size:.85rem}
.v3 .tabs button{margin-block-end:0;border-block-end:0}
.v3 .tabs [aria-selected="true"]{box-shadow:inset 0 -3px 0 var(--dune)}
.v3 .seg [aria-selected="true"],.v3 .seg [aria-pressed="true"]{box-shadow:none}
.v3 .flag{font-size:.95em}
.m.nolink{cursor:default}

/* ===== Wave 2 ===== */
/* W2.1: arrows in chalk and stone; glow lives in the scrim; icons with square caps; relegation as a dashed stone edge */
.arr.up{color:var(--ink)}
.hero::before{content:none}
.hero .scrim{background:radial-gradient(45% 55% at 0 0,#ffffff12,transparent 70%),radial-gradient(45% 55% at 100% 0,#ffffff12,transparent 70%),linear-gradient(0deg,#0A2620 0%,#0A2620f2 22%,#0A2620b3 46%,#0A262066 72%,#0A2620a6 100%)!important}
.edi{stroke-width:1.75;stroke-linecap:square;stroke-linejoin:miter}
.v3 table.st td.rk.z.rel::before{background:repeating-linear-gradient(180deg,var(--stone) 0 3px,transparent 3px 6px)}
.zrel{background:repeating-linear-gradient(180deg,var(--stone) 0 2px,transparent 2px 4px)!important}
.mom{inline-size:100%;block-size:auto;display:block}
/* W2.1 (394): at 390 the table starts above the fold: the competition hero drops its buttons on phones (the tabs do that job) */
@media (max-width:879px){.chero .hero-acts{display:none}.chero.haslogo .hero-in{padding-block-end:.6rem}.chero .hfacts{margin-block-start:.5rem}}
/* W2.3: colours mean one thing */
.v3 .pl b{background:var(--hc,var(--ink));color:var(--hi,var(--bg))}.v3 .pl.away b{background:var(--ac,var(--ink));color:var(--ai,var(--bg))}
.v3 .chip.live{background:var(--pulse);color:var(--ground)}.v3 .chip.live small{color:var(--ground);font-size:.78rem}
body.clubtheme .hero .scrim{box-shadow:inset 0 -3px 0 var(--club1)}
/* W2.5: day-list names wrap at word boundaries, 2 lines at most */
.v3 .m .t span{white-space:normal;overflow-wrap:normal;word-break:keep-all;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.86rem;line-height:1.35}
.lat{unicode-bidi:isolate}
/* W2.6: match page on a phone */
@media (max-width:879px){
  .top{transition:transform var(--t2),background-color .25s}
  body.mini-on .top{transform:translateY(-100%)}
  body.mini-on .mini{inset-block-start:0}
  body.mini-on .mtabs{inset-block-start:3rem}
  .tabbar{transition:transform var(--t2)}
  body.scdown .tabbar{transform:translateY(110%)}
  .mhero{min-block-size:0}
  .mhero .hero-in{padding-block-start:calc(var(--topH) + 5.5rem)}
}
.mini .ib{display:inline-grid}
.v3 ul.ev li.fresh{animation:evfresh 1.6s ease-out 1}
@keyframes evfresh{from{background:#F6F7F233}to{background:transparent}}
.more-stats summary{cursor:pointer;color:var(--tert);padding:.6rem 0;font-size:.85rem}
.lus{font-size:.9rem;margin:.2rem 0 1rem}.lus a{border-block-end:1px solid var(--line)}
.f3{margin-block:0 1rem}
@media (prefers-reduced-motion:reduce){.top,.tabbar{transition:none}.v3 ul.ev li.fresh{animation:none}}
/* W2.7: team, player and comp pages lead with what fans came for */
.pstats.four{grid-template-columns:repeat(4,1fr)}
.shirt{position:absolute;inset-inline-end:var(--gutter);inset-block-end:1.2rem;font:700 clamp(3.5rem,12vw,6rem)/1 var(--digits);color:transparent;-webkit-text-stroke:2px var(--sc);opacity:.9}
.phero .hero-in{position:relative}
.tnm{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.8rem;margin-block-start:1rem;background:#0A262099;padding:.6rem .8rem;max-inline-size:28rem}
.tnm .mid{text-align:center;display:grid;gap:.1rem}.tnm .mid b{font-size:1.4rem}.tnm .mid small{color:var(--tert);font-size:.78rem}
.tkick{font-size:.85rem;color:var(--tert);margin:.3rem 0 0}.tkick a{border-block-end:1px solid var(--line)}
.tform{display:flex;gap:3px;margin-block-start:.5rem}.tform i{inline-size:1.3rem;block-size:1.3rem;display:grid;place-items:center;font:700 .78rem var(--font-text);font-style:normal}
.tform .W{background:var(--chalk);color:var(--night)}.tform .D{background:var(--stone);color:var(--night)}.tform .L{background:var(--inkbg);color:var(--ink)}
.clg{inline-size:1rem;block-size:1rem;object-fit:contain;opacity:.8;margin-inline-end:.3rem;vertical-align:-2px}
/* W2.9: sheets feel native */
.grab{display:block;inline-size:36px;block-size:4px;background:var(--rule-ctl);margin:.55rem auto .1rem;border-radius:2px}
@media (min-width:880px){.grab{display:none}}
.sh-in,.pn-in{transition:transform var(--t1) ease}
.sheet.out,.panel.out{animation:sheetOut .18s ease forwards}
@keyframes sheetOut{to{transform:translateY(24px);opacity:0}}
.x{min-block-size:2.75rem;min-inline-size:2.75rem}
.ib{inline-size:2.75rem;block-size:2.75rem}
.srchsheet{position:fixed;inset-inline:0;inset-block-end:0;z-index:60;max-block-size:85svh;overflow:auto;background:var(--sunken-2);border-block-start:3px solid var(--ink);padding:0 var(--gutter) calc(1rem + env(safe-area-inset-bottom))}
.srchsheet input{inline-size:100%;font-size:1rem;min-block-size:3rem;padding:.6rem .8rem;background:var(--raised);color:var(--ink);border:1px solid var(--rule-ctl)}
@media (min-width:880px){.srchsheet{inset:auto;inset-block-start:4rem;inset-inline-start:50%;translate:50% 0;inline-size:min(40rem,92vw);border:1px solid var(--line)}}
input,select,textarea{font-size:max(16px,1em)}
@media (prefers-reduced-motion:reduce){.sheet.out,.panel.out{animation:none}}

/* W2.11: no backdrop blur (solid bars instead); the live card flips only when asked */
.top.solid{background:#0A2620f7}.tabbar{background:#061B16fa}.mini{background:#061B16fa}
.cardflip{animation:none}
/* W2.12: desktop and Fold — one 1200 px grid whose edges the header, hero, tab rule and rails share; prose at 68ch */
@media (min-width:880px){
  .mtabs{margin-inline:0;padding-inline:0}
  .rail-s,.rmine .mine-card,.cts{margin-inline:0;padding-inline:0;scroll-padding-inline:0}
  .daybox{margin-inline:0}
}
@media (min-width:880px) and (max-width:1239px){.rail-s{grid-auto-columns:calc((100% - .7rem) / 2)}.edr .rail-s{grid-auto-columns:calc((100% - 1.4rem) / 3)}}
.why p,.catchup p,.quick li,[data-pane] .blk > p,.pbody > .blk > p,.facts-l li,.lesson p,.legacy > p{max-inline-size:68ch}
.hl,.mhero .board{max-inline-size:62rem}
/* W2.1 acceptance (live CLS 0): freshness notes never move the page */
.hero-in{position:relative}
.stalen,.netnote{position:absolute;inset-block-start:calc(var(--topH) + .6rem);inset-inline-start:var(--gutter);margin:0;background:#0A2620cc;padding:.15rem .5rem;z-index:2}
.phero .stalen,.phero .netnote{inset-block-start:calc(var(--topH) + .3rem)}
#catchup{min-block-size:0}
.cdph{min-block-size:2.2rem}

/* ===== Wave 3 ===== */
/* W3.1: the stand at first paint (inline mosaic), the canvas fades in over it when it has painted */
.hero{background-image:var(--mos,none);background-size:cover;background-position:center;image-rendering:pixelated}
.hero.painted{background-image:none}
.hero canvas{opacity:0;transition:opacity .35s ease}.hero canvas.on{opacity:.7}
.top{view-transition-name:top}.tabbar{view-transition-name:tabbar}
@media (prefers-reduced-motion:reduce){.hero canvas{transition:none}}
/* W3.2: the goal text slides in from the scorer's side; the mini-bar's club stripe when the hero is off screen */
.gtext{position:absolute;inset-block-end:38%;z-index:3;display:grid;gap:.2rem;pointer-events:none;animation:gtr 2.2s cubic-bezier(.2,.7,.2,1) forwards}
.gtext.fr{inset-inline-start:var(--gutter)}.gtext.fl{inset-inline-end:var(--gutter);text-align:end;animation-name:gtl}
.gtext b{font:800 clamp(2.2rem,8vw,4.5rem)/1 var(--kufi);color:var(--ink)}.gtext span{font:800 clamp(1rem,3.5vw,1.6rem) var(--kufi);color:var(--ink)}
.gtext.mine b{text-decoration:underline 4px var(--mine);text-underline-offset:.3em}
@keyframes gtr{0%{opacity:0;transform:translateX(40%)}15%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0}}
@keyframes gtl{0%{opacity:0;transform:translateX(-40%)}15%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0}}
.mini.gstripe{background:linear-gradient(90deg,transparent,var(--gc) 30%,var(--gc) 70%,transparent) center/100% 100% no-repeat,#061B16fa;animation:gstripe 1.2s ease forwards}
@keyframes gstripe{from{background-size:0% 100%,auto}to{background-size:100% 100%,auto}}
/* W3.3: split-flap — only the digit that changed folds (two halves, 180 + 180 ms) */
.cell.flap,.dg.flap,.chip.flap{animation:flapfold .36s cubic-bezier(.3,.6,.3,1)}
@keyframes flapfold{0%{clip-path:inset(0 0 50% 0);transform:perspective(300px) rotateX(0)}50%{clip-path:inset(0 0 50% 0);transform:perspective(300px) rotateX(-90deg)}51%{clip-path:inset(50% 0 0 0);transform:perspective(300px) rotateX(90deg)}100%{clip-path:inset(0 0 0 0);transform:perspective(300px) rotateX(0)}}
.rc.just,.m.just{box-shadow:inset 0 3px 0 var(--jc)}
@media (prefers-reduced-motion:reduce){.gtext,.mini.gstripe,.cell.flap,.dg.flap,.chip.flap{animation:none}}
/* W3.4: your channel on every row */
.chn{grid-column:1/-1;justify-self:center;font-size:.78rem;color:var(--tert);line-height:1.3;margin-block-start:-.2rem}
.chn b{font-weight:600;color:var(--ink);border:1px solid var(--rule);padding:0 .3rem;margin-inline-start:.2rem}
.rc .chn{justify-self:start;margin:0}
/* W3.5: the prayer that falls during the match, in the visitor's city; its line is reserved in the first paint */
.prayl{margin:.7rem 0 0;font-size:.82rem;color:var(--tert);line-height:1.5;min-block-size:1.5em}
.mcd{min-block-size:1.9rem}
.prayl.in{margin:.4rem 0 .8rem}
/* W3.6: install ask (fixed, so it never moves the page), install sheet, calendar link, offline list */
.instask{position:fixed;z-index:var(--z-mini);inset-inline:.75rem;inset-block-end:calc(var(--tabH) + .75rem + env(safe-area-inset-bottom,0px));display:flex;align-items:center;gap:.6rem;padding:.6rem .8rem;background:var(--sunken);border:1px solid var(--rule);font-size:.9rem}
.instask span{flex:1 1 auto;min-inline-size:0}
.instask .cta{min-block-size:2.4rem;padding-inline:1rem;font-size:.85rem}
.instask .x{background:none;border:0;color:var(--tert);font:inherit;font-size:.8rem;cursor:pointer;padding:.4rem}
@media (min-width:880px){.instask{inset-inline:auto var(--gutter);inset-block-end:1.25rem;max-inline-size:26rem}}
.inst-l{margin:.2rem 0 1rem;color:var(--tert);line-height:1.7}
.inst-ios{margin:.8rem 0 0;line-height:1.7}
.nobet{margin:.6rem 0 0;font-size:.8rem;color:var(--stone)}
.calk{margin:.8rem 0 0;font-size:.85rem}.calk a{color:var(--tert);text-decoration:underline;text-underline-offset:.25em}
#offl li{padding-block:.5rem;border-block-end:1px solid var(--rule-2)}
/* W3.7: فريقك follows you — suggested rows (no favourites yet) are not «my team», so no dune */
.rmine .sugrow{background:var(--surf);padding:.7rem .8rem;border-block-start:3px solid var(--rule)}
.rmine .sugrow .h{font-family:var(--kufi);font-weight:800;display:flex;align-items:center;gap:.4rem}
.rmine .tg{font:600 .78rem var(--font-text);color:var(--tert);border:1px solid var(--rule);padding:0 .35rem}
.rmine .nwd{font:600 .78rem var(--font-text);font-style:normal;color:var(--bg);background:var(--ink);padding:0 .35rem;margin-inline-start:auto}
.mlinks{display:flex;flex-wrap:wrap;gap:.3rem 1rem;margin:.1rem 0 .5rem;font-size:.82rem}.mlinks a{color:var(--tert);text-decoration:underline;text-underline-offset:.25em}
.rkch{margin:.3rem 0 0;font-size:.8rem;color:var(--tert)}
/* W3.9: /arabs/ as a section front — the live strip, 4 group cards, «كل الأقسام» folded */
.atn .atl{display:grid;grid-auto-flow:column;grid-auto-columns:min(62%,12.5rem);gap:.6rem;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);scroll-snap-type:x proximity}
.atr{display:grid;gap:.2rem;align-content:start;background:var(--surf);padding:.7rem .8rem;color:var(--ink);text-decoration:none;scroll-snap-align:start;border-block-start:3px solid var(--rule)}
.atr.live{border-block-start-color:var(--live)}
.atr .atp{font-family:var(--kufi);font-weight:800;font-size:.95rem;line-height:1.35}
.atr .atc{display:flex;align-items:center;gap:.3rem;font-size:.8rem;color:var(--tert)}.atr .atc .logo{inline-size:1.1rem;block-size:1.1rem}
.atr .atm{font-size:.8rem;color:var(--tert)}.atr.live .atm{color:var(--live-text)}
.atr .atg{font-size:.8rem;font-weight:600;min-block-size:1.1em}
.agrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;margin-block:1.2rem}
@media (min-width:880px){.agrid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.agc{background:var(--surf);padding:.9rem;display:grid;align-content:start;gap:.5rem}
.agc h3{margin:0;font-size:.95rem}
.agn{margin:0;display:grid;gap:.1rem}.agn b{font-size:2rem;line-height:1}.agn span{font-size:.78rem;color:var(--tert);line-height:1.4}
.agl{display:grid;gap:.25rem;font-size:.85rem}.agl a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:.25em}
.allsec{margin-block:1.5rem}.allsec summary{cursor:pointer;font-family:var(--kufi);font-weight:800;padding-block:.6rem;list-style-position:inside}
/* W3.10: lineup builder on the pitch */
.xih{margin:0 0 .8rem}
.lnk{background:none;border:0;padding:0;color:var(--ink);font:inherit;font-size:.9rem;text-decoration:underline;text-decoration-color:var(--rule-ctl);text-underline-offset:.3em;cursor:pointer}
.xpitch{max-inline-size:24rem}
.xpitch .xs{border:0;background:none;color:var(--ink);cursor:pointer;padding:0;font:inherit;transform:translate(-50%,-50%);inline-size:4.6rem}
.xpitch .xs b{inline-size:2.1rem;block-size:2.1rem;font-size:1.05rem;background:transparent;outline:2px dashed #F6F7F280;color:var(--ink)}
.xpitch .xs.on b{background:var(--hc,var(--ink));color:var(--hi,var(--bg));outline:0}
.xpitch .xs:focus-visible b{outline:3px solid var(--focus)}
.xcount{text-align:center;margin:.2rem 0 .6rem}
.pn-in{position:relative}
.xpick{position:sticky;inset-block-end:0;z-index:2;background:var(--sunken);border-block-start:3px solid var(--ink);max-block-size:55vh;overflow:auto;margin-inline:calc(var(--gutter) * -1);padding:0 var(--gutter) .8rem}
.xp-h{display:flex;justify-content:space-between;align-items:center;position:sticky;inset-block-start:0;background:var(--sunken);padding-block:.7rem}
.xp-h .x{background:none;border:0;color:var(--tert);font:inherit;cursor:pointer}
.xp-r{background:none;border:1px solid var(--rule);color:var(--ink);font:inherit;font-size:.85rem;padding:.4rem .7rem;margin-block-end:.5rem;cursor:pointer}
.xp-l{list-style:none;margin:0;padding:0}
.xp-l button{display:flex;align-items:center;gap:.7rem;inline-size:100%;background:none;border:0;border-block-end:1px solid var(--rule-2);color:var(--ink);font:inherit;text-align:start;padding:.6rem 0;cursor:pointer;min-block-size:2.75rem}
.xp-l button .num{inline-size:1.8rem;font-weight:700;color:var(--tert)}
.xp-l button small{margin-inline-start:auto;color:var(--tert);font-size:.78rem}
.xp-l button[aria-current]{color:var(--mine)}
/* W3.11: search with context */
#sr li a{display:grid;grid-template-columns:1fr;gap:.1rem;padding:.55rem .2rem;border-block-end:1px solid var(--rule-2);color:var(--ink);text-decoration:none}
#sr .srn{font-weight:600}#sr .srs{font-size:.78rem}
.sre-h{margin:.9rem 0 .3rem;font-size:.78rem;color:var(--tert)}
.sre{display:flex;flex-wrap:wrap;gap:.4rem;margin-block-start:.6rem}
.sqc{display:inline-flex;align-items:center;min-block-size:2.5rem;padding:0 .9rem;background:var(--raised);border:1px solid var(--rule);color:var(--ink);font:inherit;font-size:.85rem;cursor:pointer;text-decoration:none}
/* W3.12: four cells in the scorers control fit a phone without a hidden fourth */
@media (max-width:479px){.seg:has(> button:nth-child(4)) button{padding-inline:.55rem;font-size:.82rem}}
/* W4.1 /thisday/: today first, the year folded by month */
.tdnow .tdnav{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-block-end:.6rem}
.tdnow .tdnav h2{flex:1 1 auto;text-align:center}
.tdnow .ib{inline-size:auto;padding-inline:.7rem;font:600 .85rem var(--font-text);color:var(--tert);background:none;border:1px solid var(--rule);min-block-size:2.75rem;cursor:pointer}
.tdm{border-block-end:1px solid var(--rule-2)}.tdm summary{cursor:pointer;padding-block:.8rem;font-family:var(--kufi);font-weight:800;min-block-size:2.75rem}
.tdm[open] summary{color:var(--ink)}
/* W4.4 round replay, h2h, referee */
.story.auto{display:grid;gap:.8rem}.story.auto .stbl{position:relative;top:auto}
.sthead{display:grid;gap:.6rem}.stnow{min-block-size:4.2rem}.stnow .m{border:0}
.stbl li.moved{background:var(--raised-hi)}
.h2hrow{display:block}.h2hd{margin:.7rem 0 0}
.h2hnext{background:var(--surf);padding:.6rem .8rem;margin-block-end:1rem}.h2hnext .kicker{display:block;font-size:.78rem;color:var(--tert);margin-block-end:.2rem}
.h2hbar{display:flex;block-size:.6rem;margin-block:.2rem 1rem;gap:2px}.h2hbar i{display:block}.h2hbar i.d{background:var(--text-3)}
.rcard{display:inline-block;inline-size:.5rem;block-size:.7rem;vertical-align:-.05rem;margin-inline-end:.2rem}.rcard.y{background:var(--card-y)}.rcard.r{background:var(--card-r)}
.scope{margin-block-end:.6rem}
#trmore{margin-block:.8rem}
/* W4.6: 44px footer rows, 16px form fields (no zoom on iPhone), labels .78rem or more */
.fcols a{padding-block:.6rem;min-block-size:2.75rem;display:flex;align-items:center}
.v3 input,.v3 select,.v3 textarea{font-size:max(16px,1rem)}
/* W4.3 /national/: منتخبك, the day's national matches, 22 flags */
.natme #natmeb{min-block-size:11.75rem}.natflags a.me{outline:2px solid var(--ink);outline-offset:-2px}.natme-h{display:flex;align-items:center;gap:.5rem;color:var(--ink);font-family:var(--kufi);margin-block-end:.3rem}
.natflags{display:grid;grid-template-columns:repeat(auto-fill,minmax(5.6rem,1fr));gap:.5rem;margin-block:1rem 1.5rem}
.natflags a{display:grid;justify-items:center;gap:.35rem;background:var(--surf);padding:.7rem .3rem;color:var(--ink);font:600 .8rem var(--font-text);text-align:center;text-decoration:none;min-block-size:2.75rem}
.natflags a:hover{background:var(--raised-hi)}
/* W4.2: merged pages */
.mowpin{background:var(--surf);padding:.9rem;margin-block:1rem 1.5rem}.mowpin h2 small{font:600 .82rem var(--font-text);color:var(--tert);margin-inline-start:.6rem}
.v3 a.cd{border-inline-start:0}
.gl .ex{margin:.4rem 0 0;font-size:.9rem;color:var(--tert)}.gl .ex b{color:var(--ink)}
/* W4.7: below-the-fold sections and the footer skip rendering until they come near the screen */
.v3 .foot{content-visibility:auto;contain-intrinsic-size:auto 640px}
.v3 .body > section.blk + section.blk,.v3 [data-pane] > section.blk + section.blk{content-visibility:auto;contain-intrinsic-size:auto 480px}
/* owner item 9a: push toggles */
.calk{display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;align-items:center}.calk .lnk{font-size:.85rem;color:var(--tert)}
.pushg{display:grid;gap:.5rem;margin-block:.4rem .8rem}
.ptg{display:flex;justify-content:space-between;align-items:center;min-block-size:3rem;padding:0 1rem;background:var(--raised);border:1px solid var(--rule);color:var(--ink);font:600 .95rem var(--font-text);cursor:pointer;text-align:start}
.ptg::after{content:"";inline-size:2.4rem;block-size:1.3rem;border:1px solid var(--rule-ctl);background:linear-gradient(90deg,var(--text-3) 0 45%,transparent 45%)}
.ptg[aria-pressed="true"]::after{background:linear-gradient(90deg,transparent 55%,var(--ink) 55%)}
/* owner item 9b: «منو بيفوز؟» — quiet chips, never a second primary */
.pick h2 small{font:500 .78rem var(--font-text);color:var(--tert);margin-inline-start:.6rem}
.pickb{display:grid;grid-template-columns:1fr auto 1fr;gap:.4rem;margin-block:.5rem}
.pickb button{min-block-size:2.75rem;padding:0 .6rem;background:none;border:1px solid var(--rule);color:var(--ink);font:600 .9rem var(--font-text);cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pickb button[aria-pressed="true"]{border-color:var(--ink);box-shadow:inset 0 -3px 0 var(--ink)}
.pickres{position:absolute;inset-block-start:calc(var(--topH) + .6rem);inset-inline-end:var(--gutter);margin:0;background:#0A2620cc;padding:.15rem .5rem;font-size:.8rem;color:var(--tert);z-index:2}
.pickres.ok{color:var(--ink)}
.rmine .picks{grid-column:1/-1;margin:.2rem 0 0;font-size:.85rem;color:var(--tert)}
/* owner item 1: my crest in the nav */
.navcrest{inline-size:22px;block-size:22px;object-fit:contain}
#minesh .mgrid{margin-block:.6rem 1rem}
/* W2.8: 6 featured tiles, the rest on demand; an odd last tile spans the row */
@media (max-width:420px){.shelf3 > :last-child:nth-child(odd){grid-column:1/-1}}   /* two columns on a phone: no lonely half tile */
.shall{margin-block:.8rem 0;inline-size:100%}
.shmore{margin-block-start:.6rem}
/* W3.8: شو على المحك */
.stakes h2 small{font:500 .78rem var(--font-text);color:var(--tert);margin-inline-start:.6rem}
.v3 tr.stk td{font-weight:800;color:var(--ink);background:var(--raised-hi)}
/* owner item 5: the match page gets a sticky side column at 1240px+ */
.mside{display:none}
@media (min-width:1240px){
  .m2col{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:2.4rem;align-items:start}
  .m2col > .mcol{min-inline-size:0}
  .mside{display:block;position:sticky;inset-block-start:calc(var(--topH) + 4.2rem);max-block-size:calc(100vh - var(--topH) - 5.2rem);overflow:auto;scrollbar-width:thin}
  .mside .blk{margin-block:0 1.4rem}.mside h2{font-size:1rem}
}
.mxi{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.mxi h3{font-size:.9rem;margin:0 0 .3rem}.mxi h3 small{color:var(--tert);font-weight:600}
.mxi ol{list-style:none;margin:0;padding:0;font-size:.82rem}.mxi li{display:flex;gap:.4rem;padding-block:.2rem;border-block-end:1px solid var(--rule-2)}.mxi li .num{inline-size:1.5rem;color:var(--tert)}
/* W2.8: the match share sheet — a preview, 4 rows, quiet links */
.shprev{display:block;inline-size:100%;block-size:auto;aspect-ratio:1200/630;max-block-size:11rem;object-fit:cover;object-position:center top;margin-block:.2rem .8rem;background:var(--sunken)}
.shrows{display:grid;gap:.5rem}
.shr{display:grid;gap:.15rem;align-content:center;min-block-size:3.4rem;padding:.55rem .9rem;background:var(--raised);border:1px solid var(--rule);color:var(--ink);font:inherit;text-align:start;cursor:pointer;text-decoration:none}
button.shr:hover,a.shr:hover{background:var(--raised-hi)}
.shr b{font-family:var(--kufi);font-weight:800;font-size:.98rem}.shr > span{font-size:.82rem;color:var(--tert)}
.shc{display:flex;flex-wrap:wrap;gap:.4rem;margin-block-start:.25rem}
.shc a,.shc button{min-block-size:2.5rem;display:inline-flex;align-items:center;padding:0 .8rem;border:1px solid var(--rule-ctl);background:none;color:var(--ink);font:600 .85rem var(--font-text);cursor:pointer;text-decoration:none}
.shq{display:flex;flex-wrap:wrap;gap:.2rem 1rem;margin:.9rem 0 0;font-size:.85rem}
.shq a,.shq button{background:none;border:0;padding:.4rem 0;color:var(--tert);font:inherit;text-decoration:underline;text-underline-offset:.25em;cursor:pointer}
/* 417 «تيفو الأسبوع» beside «مباراة الأسبوع» on /week/ */
.wkpair{display:grid;gap:1rem;margin-block:1rem 1.5rem}.wkpair > .blk{margin:0}
@media (min-width:1100px){.wkpair:has(> .wkcard):has(> .mowpin){grid-template-columns:1fr 1fr;align-items:start}}
.wkcard{background:var(--surf);padding:.9rem}
.wkcard h2 small{font:500 .82rem var(--font-text);color:var(--tert);margin-inline-start:.6rem}
.wkr{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.7rem;padding-block:.65rem;border-block-end:1px solid var(--rule-2);color:var(--ink);text-decoration:none}
a.wkr:hover .wkt b{text-decoration:underline;text-underline-offset:.25em}
.wkt{display:grid;gap:.05rem;min-inline-size:0}.wkt small{font-size:.78rem;color:var(--tert)}.wkt b{font-weight:700;line-height:1.45}.wkt span{font-size:.8rem;color:var(--tert)}
.wkv{font-weight:700;font-size:1.35rem;white-space:nowrap;text-align:end}.wkv small{font:600 .78rem var(--font-text);color:var(--tert)}
.wkv.sc{font-family:var(--digits);background:var(--board);color:var(--ink);padding:.1rem .55rem}
.wkdot{inline-size:24px;block-size:24px;background:var(--rule)}
.wkdl{display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;margin:.8rem 0 0;font-size:.85rem}.wkdl a{color:var(--tert);text-decoration:underline;text-underline-offset:.25em}
/* QA 0/21: the country picker and search live in real sheets now */
#srchbox input{inline-size:100%;font-size:max(16px,1rem);min-block-size:3rem;padding:.6rem .8rem;background:var(--raised);color:var(--ink);border:1px solid var(--rule-ctl)}
#srchsh .sh-in{min-block-size:min(70svh,32rem)}
#ctrybody .cgrid{gap:.4rem;margin-block:.4rem .8rem}#ctrybody .cgrid button{min-block-size:2.75rem;background:var(--raised);color:var(--ink);border:1px solid var(--rule);font:inherit}
#ctrybody .cgrid button[aria-pressed="true"]{background:none;box-shadow:inset 0 -3px 0 var(--mine);border-color:var(--ink)}
.grp-sub{margin:.5rem 0 .1rem;font-size:.8rem;color:var(--tert);font-weight:600}
body.hasprayl .tile.pray{display:none}
/* QA 37: from 880px the league title stops before the logo (the logo sits at the inline end of the hero) */
@media (min-width:880px){.chero.haslogo .hero-in{padding-inline-end:max(0px,calc(7vw + clamp(15rem,30vw,25rem) + 1.5rem - (100vw - min(100vw,var(--wide))) / 2))}}
/* QA 52: the ask form is input · send · mic on one row */
.v3 .ask{grid-template-columns:1fr auto auto;align-items:stretch}
.mic{inline-size:2.9rem;min-block-size:2.9rem;display:grid;place-items:center;background:none;border:1px solid var(--rule-ctl);color:var(--ink);cursor:pointer}
.sfrm{display:flex;gap:.4rem}.sfrm .mic{flex:none}
/* QA 60: before the script picks the visitor's country, the list already shows the UAE's latest 30 (no jump for most visitors) */
.trl:not(.js) li:not([data-c="AE"]),.trl:not(.js) li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"] ~ li[data-c="AE"]{display:none}
.pl.tor .rt0{font:700 .95rem var(--digits);color:var(--ink)}.pl.tor a{color:var(--ink);font-size:.78rem;text-decoration:none;text-shadow:0 1px 2px #000}
/* QA 68: up/down arrows are chalk and stone (pulse = live, red = cards) */
.v3 .up,.v3 .lk-up{color:var(--ink)}.v3 .dn,.v3 .lk-dn{color:var(--stone)}
/* QA 69 (rule 5): a selected segment is chalk text with a dune underline, not a filled block */
.v3 .seg [aria-selected="true"],.v3 .seg [aria-pressed="true"]{background:none;color:var(--ink);box-shadow:inset 0 -3px 0 var(--mine)}
.pickb button[aria-pressed="true"]{box-shadow:inset 0 -3px 0 var(--mine)}
.fds i.fd{word-break:keep-all;overflow-wrap:normal}
/* QA 104: 44px tap targets in the /arabs/ group cards */
.agl{gap:0}.agl a{display:flex;align-items:center;min-block-size:2.75rem}
/* QA 100: late content keeps its space (compare, offline list, the 404's day list) */
#cout{min-block-size:24rem}#offl{min-block-size:12rem}#day404{min-block-size:18rem}
/* QA 101: the goal-moment word sits over the score, not the home name */
.gtext{inset-block-end:auto;inset-block-start:calc(var(--topH) + 1rem)}
/* owner 2026-09-30: a paid channel is marked «مشفرة», quietly (no «مجاني» anywhere) */
.v3 .enc{font-size:.75rem;font-weight:500;color:var(--tert);border:1px solid var(--rule);padding:0 .35rem;margin-inline-start:.2rem}
/* the journal (/news/, the team «الأخبار» tab, «آخر أخباره» on player pages): a plain list, the kind as a small label */
.v3 .nwl{display:grid;gap:0}
.v3 .nw{padding:.85rem 0;border-bottom:1px solid var(--line)}
.v3 .nw h3{font-size:1.05rem;line-height:1.5;margin:.15rem 0 .3rem}
.v3 .nw h3 a{color:var(--ink);text-decoration:none}
.v3 .nw h3 a:hover{text-decoration:underline}
.v3 .nw .nk{margin:0;font-size:.75rem;color:var(--tert);display:flex;gap:.5rem;align-items:center}
.v3 .nw .nk .tg{border:1px solid var(--line);padding:0 .4rem;color:var(--stone)}
.v3 .nw.tr .nk .tg{border-color:var(--ink);color:var(--ink)}
.v3 .nw .nsum{margin:0 0 .35rem;line-height:1.7}
.v3 .nw .nent,.v3 .nw .nsrc{margin:.1rem 0}
.v3 .nkinds{margin:.5rem 0 .25rem;flex-wrap:wrap}
.v3 .nvh{font-size:.95rem;margin:1.2rem 0 .5rem}
.v3 .nvid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.75rem}
.v3 .nv{display:grid;gap:.25rem;color:var(--ink);text-decoration:none;font-size:.85rem;line-height:1.5}
.v3 .nv img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:var(--surf)}
/* 463: the player's portrait in the hero, beside the name. Grey photo over the club colour mixed into the hero's dark ground
   (the pure club red was loud on the first try) (luminosity keeps the photo's
   light and takes the club's hue), fading into the hero at the bottom; the CC BY credit in small type under it */
.phero .hero-in:has(.pph){display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:1rem;align-items:end}
.phero .hero-in:has(.pph)>*:not(.pph){grid-column:1}
.phero .pph{grid-column:2;grid-row:1 / span 6;align-self:end;margin:0;inline-size:clamp(6.5rem,28vw,11rem);background:color-mix(in oklab,var(--pc) 38%,#0B1512);position:relative}
.phero .pph img{display:block;inline-size:100%;block-size:auto;aspect-ratio:4/5;mix-blend-mode:luminosity;opacity:.92;-webkit-mask-image:linear-gradient(to top,transparent 0,#000 22%);mask-image:linear-gradient(to top,transparent 0,#000 22%)}
.phero .pph figcaption{font-size:.6rem;line-height:1.3;margin-block-start:.2rem;opacity:.55;max-inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;direction:ltr;text-align:end}
.phero .pph figcaption a{color:inherit;text-decoration:none}
/* transfer history (player) and record deals (club) */
.v3 .trh td,.v3 .trh th{white-space:nowrap}
.v3 .trc{padding-inline-start:1.2rem;margin:.3rem 0 .8rem}
.v3 .trc li{margin:.25rem 0}

/* ============ the Messi museum (/messi/, lib/messi_page.cjs + src/messi.js). Gold = his left foot, everywhere */
.v3{--mg:#F0BC5A;--mgr:#E9ECE4;--mgh:#5CC9A4;--mink:#0B1512}
.v3 .mentry{position:relative;display:grid;gap:1rem;padding:1.2rem 0 .6rem;isolation:isolate}
.v3 .harcs{position:absolute;inset:0 0 auto auto;inline-size:min(100%,34rem);block-size:auto;opacity:.5;z-index:-1;pointer-events:none}
.v3 .harcs path{fill:none;stroke-width:.14;stroke:var(--mg);stroke-dasharray:140;stroke-dashoffset:140;animation:mdraw 3.2s ease-out forwards}
.v3 .harcs path.R{stroke:var(--mgr)}.v3 .harcs path.H{stroke:var(--mgh)}
@keyframes mdraw{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.v3 .harcs path{animation:none;stroke-dashoffset:0}}
.v3 .mcount b{display:block;font:700 clamp(4.5rem,18vw,9rem)/1 var(--digits);color:var(--mg);letter-spacing:-.02em}
.v3 .mcount span{font-size:1.05rem}
.v3 .mteams{display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;list-style:none;padding:0;margin:0;font-size:.9rem}
.v3 .mnow{border-inline-start:2px solid var(--mg);padding-inline-start:.8rem}.v3 .mnow h3{margin:0 0 .2rem;font-size:.95rem}.v3 .mnow p{margin:.1rem 0;font-size:.9rem}
.v3 .mbday{background:var(--mg);color:#141A17;padding:.6rem .9rem;margin:.5rem 0}
.v3 .museum{display:grid;gap:1.5rem;margin-block-start:1.5rem}
@media (min-width:980px){.v3 .museum{grid-template-columns:15rem minmax(0,1fr)}.v3 .mrooms{position:sticky;inset-block-start:calc(var(--topH,4rem) + 1rem);align-self:start;max-block-size:calc(100svh - 6rem);overflow:auto}}
.v3 .mrooms ol{list-style:none;margin:0;padding:0;font-size:.85rem;line-height:1.5}
.v3 .mrooms a{display:block;padding:.2rem 0;color:var(--stone);text-decoration:none}.v3 .mrooms a:hover{color:var(--ink)}.v3 .mrooms .num{color:var(--mg);display:inline-block;min-inline-size:1.6rem}
@media (max-width:979px){.v3 .mrooms ol{display:flex;gap:.3rem;overflow-x:auto;padding-block-end:.4rem}.v3 .mrooms a{white-space:nowrap;border:1px solid var(--line);padding:.25rem .55rem}}
.v3 .room{padding-block:1.8rem;border-block-start:1px solid var(--line);scroll-margin-top:5rem}
.v3 .plaque{margin-block-end:1rem;max-inline-size:44rem}.v3 .plaque .rno{font-size:.75rem;color:var(--mg);letter-spacing:.04em}.v3 .plaque h2{font-size:clamp(1.35rem,1rem + 1.6vw,2rem);margin:.1rem 0 .35rem}.v3 .plaque p{margin:0;color:var(--stone);line-height:1.7}
.v3 .mp{display:block;inline-size:100%;max-inline-size:34rem;block-size:auto}
.v3 .mp.sm{max-inline-size:16rem}.v3 .mp.wide{max-inline-size:44rem}.v3 .mp.big{max-inline-size:none}
.v3 .mp .g{fill:#123a2f}.v3 .mp .l{fill:none;stroke:rgba(246,247,242,.45);stroke-width:.3}.v3 .mp .d{fill:rgba(246,247,242,.6)}.v3 .mp .gl{fill:none;stroke:#F6F7F2;stroke-width:.5}
.v3 .mp .arc{fill:none;stroke:var(--mg);stroke-width:.25;opacity:.75}.v3 .mp .arc.R{stroke:var(--mgr)}.v3 .mp .arc.H{stroke:var(--mgh)}
.v3 .mp .pt{fill:var(--mg)}.v3 .mp .pt.R{fill:var(--mgr)}.v3 .mp .pt.H{fill:var(--mgh)}.v3 .mp .pt.miss{fill:rgba(233,236,228,.22)}
.v3 .mp .as{stroke:var(--mg);stroke-width:.3;opacity:.5}.v3 .mp .hm{fill:var(--mg)}.v3 .mp .you{fill:none;stroke:#fff;stroke-width:.6}
.v3 .mp .cr{stroke-width:.35;opacity:.45}.v3 .mp .cr.e1{stroke:#9FB8AE}.v3 .mp .cr.e2{stroke:var(--mg)}.v3 .mp .cr.e3{stroke:#E58A3A}.v3 .mp .cr.e4{stroke:#6FA3E0}.v3 .mp .cr.e5{stroke:#8EC9EE}
.v3 .mp.tap{cursor:crosshair}
.v3 .mrow{display:grid;grid-template-columns:repeat(auto-fill,minmax(12rem,1fr));gap:1rem}.v3 .mrow figure{margin:0}.v3 .mrow figcaption{font-size:.85rem;margin-block-start:.35rem}
.v3 .mlist{padding-inline-start:1.1rem;line-height:1.8}.v3 .mlist.cols{columns:2 15rem;column-gap:2rem}
.v3 .mlist.hard .lnk{font:inherit;text-align:start}
.v3 .chart{inline-size:100%;max-inline-size:40rem;block-size:auto;display:block;margin-block-end:.8rem}
.v3 .chart .gl2{fill:none;stroke:var(--mg);stroke-width:1.6}.v3 .chart .xgl{fill:none;stroke:var(--mgr);stroke-width:1;stroke-dasharray:3 2;opacity:.8}.v3 .chart .ax{font-size:7px;fill:var(--tert);text-anchor:middle}
.v3 .clock{inline-size:min(100%,22rem);display:block}.v3 .clock .cb{fill:var(--mg);opacity:.8}.v3 .clock .cb.hot{fill:#E58A3A}
.v3 .clock .c1,.v3 .clock .c2{font-size:6px;fill:var(--tert);text-anchor:middle}
.v3 .bars{list-style:none;padding:0;margin:0;display:grid;gap:.3rem;max-inline-size:36rem}
.v3 .bars li{display:grid;grid-template-columns:9rem minmax(0,1fr) 2.5rem;align-items:center;gap:.6rem;font-size:.9rem}
.v3 .bars i{display:block;block-size:.6rem;inline-size:var(--w);background:var(--mg)}.v3 .bars b{text-align:end}
.v3 .net{inline-size:min(100%,30rem);display:block}.v3 .net .nl{stroke:var(--mg);opacity:.55}.v3 .net .nn{fill:var(--mgr)}.v3 .net .nm{fill:var(--mg)}
.v3 .net .nt{font-size:4px;fill:currentColor;text-anchor:middle}.v3 .net .nmt{font-size:3.4px;fill:#141A17;text-anchor:middle;font-weight:700}
.v3 .cab{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:.4rem 1rem;margin:.3rem 0 1rem}
.v3 .cab li{display:flex;justify-content:space-between;gap:.5rem;border-block-end:1px solid var(--line);padding-block:.3rem;font-size:.9rem}
.v3 .bdo{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:1rem}.v3 .bdo li{display:grid;justify-items:center;gap:.3rem}
.v3 .bdo .ball{inline-size:3.2rem;block-size:3.2rem;border-radius:50%;background:radial-gradient(circle at 35% 30%,#FFF1C9,#F0BC5A 45%,#8F5400 100%);box-shadow:0 0 0 1px rgba(240,188,90,.4)}
.v3 .tline{position:relative;display:grid;gap:.5rem;padding-block-end:1.4rem}
/* each team a row: the text at the row's start, its years a band along the bottom (the band sits between --a and --b of the whole span) */
.v3 .tl{--c:var(--mg);font-size:.85rem;padding-block-end:.55rem;background:linear-gradient(to left,transparent var(--a),var(--c) var(--a),var(--c) var(--b),transparent var(--b)) bottom/100% 6px no-repeat}
.v3 .tl.nat{--c:#8EC9EE}.v3 .tl b{margin-inline-end:.6rem}
.v3 .ty{position:absolute;inset-inline:0;inset-block-end:0;display:flex;justify-content:space-between;font-size:.75rem;color:var(--tert)}
.v3 .games{display:grid;gap:1.6rem;grid-template-columns:repeat(auto-fill,minmax(18rem,1fr))}.v3 .games h3{margin:0 0 .3rem}
.v3 .gz,.v3 .qa{display:grid;grid-template-columns:repeat(3,1fr);gap:.3rem;margin-block:.5rem;max-inline-size:18rem}.v3 .qa{grid-template-columns:1fr 1fr;max-inline-size:26rem}
.v3 .gz button,.v3 .qa button{border:1px solid var(--line);background:none;color:inherit;padding:.45rem .3rem;font:inherit;font-size:.85rem;cursor:pointer}
.v3 .gz .right,.v3 .qa .right{background:var(--mg);color:#141A17;border-color:var(--mg)}.v3 .gz .wrong,.v3 .qa .wrong{text-decoration:line-through;opacity:.6}
.v3 .keep{display:flex;flex-wrap:wrap;gap:.5rem}
.v3 .wmap{inline-size:100%;max-inline-size:44rem;display:block;margin-block-end:.6rem}.v3 .wmap .land{fill:#1c3a31;stroke:rgba(246,247,242,.25);stroke-width:.3}.v3 .wmap .md{fill:var(--mg);opacity:.8}
.v3 .m3dc{min-block-size:320px;background:var(--mink)}.v3 .m3dc canvas{display:block;inline-size:100%}
.v3 .m3d-ctl{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin:.6rem 0}.v3 .m3d-ctl [aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.v3 #m3dr{inline-size:100%;margin-block-start:.5rem}
.v3 .tbl tr.mine td{color:var(--mg);font-weight:700}
.mposter{text-align:center}.mposter h1{font-size:4rem;margin:0}.mposter .num{font-size:3rem;color:#8F5400;margin:0}
@media print{.mposter .mp .g{fill:#fff}.mposter .mp .l{stroke:#999}.mposter .mp .arc{stroke:#8F5400;opacity:.55}.mposter .mp .arc.R{stroke:#555}.mposter .mp .arc.H{stroke:#1B6F5A}}
.v3 .mp .fl{stroke:var(--mg);opacity:.85}.v3 .mp .fh{fill:var(--mg)}
.v3 .legend i{display:inline-block;inline-size:.8rem;block-size:.8rem;background:var(--c);margin-inline:.5rem .25rem;vertical-align:middle}
.v3 .clock .c1{font-size:6px;fill:var(--tert);text-anchor:middle;dominant-baseline:middle}.v3 .clock .c2{font-size:5px;fill:var(--tert);text-anchor:middle}
/* a club's full history (the «التاريخ» tab) */
.v3 .chist .hsum{font-size:1.05rem}.v3 .chist .dec{max-inline-size:44rem}.v3 .chist .dw{fill:var(--mg,#F0BC5A)}
.v3 .chist .hq{margin-block:.3rem .5rem;padding:.4rem .6rem;inline-size:min(100%,20rem);border:1px solid var(--line);background:transparent;color:inherit;font:inherit}
.v3 .chist .hbig{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1rem}.v3 .chist .sc{font-weight:700}
.v3 .ccard{margin-block-end:1.2rem}.v3 .chon{list-style:none;padding:0;display:grid;gap:.35rem}
.v3 .chon li{display:grid;grid-template-columns:minmax(0,14rem) 2.5rem minmax(0,1fr);gap:.6rem;align-items:baseline;border-block-end:1px solid var(--line);padding-block:.25rem}
.v3 .elo-c{max-inline-size:44rem}.v3 .elo-c .pk{fill:var(--mg,#F0BC5A)}
/* a list of years wraps (.num never does); nothing in the history tab may widen the page */
.v3 .yrs{font-family:var(--digits);font-variant-numeric:tabular-nums;white-space:normal;line-height:1.6}
@media (max-width:40rem){.v3 .chon li{grid-template-columns:minmax(0,1fr) 2.5rem}.v3 .chon li .yrs{grid-column:1/-1;font-size:.8rem}}
.v3 [data-pane="chist"],.v3 .ccard,.v3 .chist{min-inline-size:0;overflow-wrap:anywhere}
.v3 [data-pane="chist"] .tbl{display:block;overflow-x:auto}

/* player bio (FotMob), career table with expandable seasons, club league positions */
.v3 .pbio{display:grid;grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr));gap:.4rem 1rem;margin:.8rem 0 1.2rem}
.v3 .pbio div{border-block-end:1px solid var(--line);padding-block:.3rem}.v3 .pbio dt{font-size:.75rem;color:var(--tert)}.v3 .pbio dd{margin:0;font-weight:600}
.v3 .pcar .pexp{cursor:pointer}.v3 .pcar .psub td{font-size:.85rem;color:var(--stone)}
.v3 .fmv{font-size:.95rem}.v3 .chart .pt0{fill:var(--mgr,#E9ECE4)}

/* the world encyclopedia (/db/) */
.v3 .wq{inline-size:min(100%,34rem);font-size:1.05rem;padding:.6rem .8rem}
.v3 .wc{border-block-end:1px solid var(--line);padding-block:.4rem}.v3 .wc summary{cursor:pointer;font-weight:600}.v3 .wc h4{margin:.6rem 0 .2rem;font-size:.9rem;color:var(--stone)}
.v3 .wl{line-height:2;margin:0}

/* match log, match page (encyclopedia) */
.v3 .tscroll{overflow-x:auto}.v3 .plt td,.v3 .plt th{white-space:nowrap}
.v3 .cd{display:inline-block;inline-size:.6rem;block-size:.85rem;vertical-align:middle;margin-inline:.1rem;font-size:.6rem;text-align:center;color:#141A17}.v3 .cd.y{background:#F2C94C}.v3 .cd.r{background:#D64545}
.v3 .res.w{color:var(--live-text,#5CC9A4)}.v3 .res.l{color:#E5484D}.v3 .rt{font-size:.8rem;border:1px solid var(--line);padding:0 .25rem}
.v3 .wmh{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;font-size:1.3rem;font-weight:700;margin:.5rem 0}.v3 .wmh a:last-child{text-align:end}.v3 .wsc{font-size:2rem}
.v3 .wev .ev{font-size:.75rem;border:1px solid var(--line);padding:0 .3rem}.v3 .wev .ev.g{border-color:var(--mg,#F0BC5A)}.v3 .wev .ev.y{background:#F2C94C;color:#141A17}.v3 .wev .ev.r{background:#D64545;color:#fff}
.v3 .wlu .sub{opacity:.7}
.v3 .wlogo{inline-size:2rem;block-size:2rem;object-fit:contain;vertical-align:middle;margin-inline-end:.5rem}
.v3 .wgm li{display:flex;flex-wrap:wrap;gap:.2rem .6rem;align-items:baseline}.v3 .wgm li>span:first-child{min-inline-size:6.5rem}
.v3 .wlu .ev.g{font-size:.7rem;border:1px solid var(--mg,#F0BC5A);padding:0 .25rem}
.v3 #wts{font:inherit;padding:.3rem .5rem}
.v3 .pwiki{line-height:1.9;max-inline-size:46rem;margin:.6rem 0 1.2rem}
.v3 .eag{display:grid;grid-template-columns:auto 1fr;gap:1rem 1.5rem;align-items:center}.v3 .eao{display:grid;justify-items:center;border:1px solid var(--line);padding:.6rem 1rem}
.v3 .eao b{font-size:2.6rem;line-height:1}.v3 .eao span{font-size:.85rem;color:var(--stone);letter-spacing:.05em}
.v3 .eas{letter-spacing:.1em;color:var(--mg,#F0BC5A)}.v3 .eas i{font-style:normal;opacity:.25}
.v3 .eaps{display:flex;flex-wrap:wrap;gap:.35rem}.v3 .eap{border:1px solid var(--line);padding:.1rem .45rem;font-size:.8rem}.v3 .eap.plus{border-color:var(--mg,#F0BC5A)}
.v3 .eac h4{margin:.8rem 0 .2rem;font-size:.85rem;color:var(--stone)}
@media (max-width:30rem){.v3 .eag{grid-template-columns:1fr}.v3 .eao{justify-self:start}}

/* /all/ (every match of the day) and /live/?id= (any match): src/allmatches.js. Rows reuse .m / .chip / .grp-sub, the
   day switch reuses .seg.segf, the search reuses .wq; only what is new is here. */
.allbar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:stretch;margin-block:0 .8rem}
.allbar .wq{flex:1 1 8rem;min-inline-size:0;margin:0;border:1px solid var(--line);background:transparent;color:inherit;font:inherit;font-size:.95rem;padding:.55rem .7rem}
.alllive{display:inline-flex;align-items:center;gap:.4rem;border:1px solid var(--line);background:none;color:var(--ink);padding:.5rem .9rem;font:600 .88rem var(--font-text);cursor:pointer;white-space:nowrap}
.alllive b{font-family:var(--digits,inherit);color:var(--live-text)}
.alllive[aria-pressed="true"]{background:var(--live);color:var(--ground)}
.alllive[aria-pressed="true"] b{color:var(--ground)}
.alllive:disabled{opacity:.55;cursor:default}
.alllive .cardflip{inline-size:.55rem;block-size:.55rem}
#alllist{min-block-size:40vh}
#alllist[aria-busy="true"]{opacity:.6}
details.alg{border-block-end:1px solid var(--line)}
details.alg > summary{display:flex;align-items:center;gap:.5rem;padding-block:.65rem .5rem;cursor:pointer;list-style:none;font-size:.92rem;font-weight:600}
details.alg > summary::-webkit-details-marker{display:none}
details.alg > summary::after{content:"";inline-size:.45rem;block-size:.45rem;border-block-end:1.5px solid var(--tert);border-inline-start:1.5px solid var(--tert);transform:rotate(-45deg);margin-inline-start:.2rem;transition:transform .15s}
details.alg[open] > summary::after{transform:rotate(135deg)}
details.alg.ours > summary .aln{color:var(--ink)}
.alg .aln{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.alg .alc{color:var(--tert);font-size:.78rem;font-weight:400;white-space:nowrap}
.alg .alglive{color:var(--live-text);font-size:.78rem;display:inline-flex;align-items:center;gap:.3rem;white-space:nowrap}
.alg .alglive .cardflip{inline-size:.5rem;block-size:.5rem}
.alg .aln2{margin-inline-start:auto;color:var(--tert);font-size:.8rem;font-weight:400}
.alg .algb{padding-block-end:.5rem}
.alg .alk{display:inline-block;margin-block:.4rem .2rem;font-size:.8rem;color:var(--tert)}
.alg .alk:hover{color:var(--ink)}
.alred{display:inline-block;inline-size:.45rem;block-size:.62rem;background:var(--card-r);margin-inline-start:.35rem;vertical-align:-1px}
a.unfold.allgo{text-align:center;text-decoration:none}
/* the live page: the board of a match page, in the body */
.lvh .board{margin-block:.4rem 1rem}
.lvh .board .tm{color:var(--ink)}
#lvhl .hlink{margin-block:0 .8rem}
ul.ev .how{color:var(--tert)}