/* Self-hosted fonts (SIL OFL 1.1, see /assets/fonts/LICENSE-FONTS.txt). Latin + latin-ext subsets, unicode-range as served by Google Fonts. */
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/barlow-condensed-600-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/barlow-condensed-600-latin.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/barlow-condensed-700-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/barlow-condensed-700-latin.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:800;font-display:swap;src:url(/assets/fonts/barlow-condensed-800-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:800;font-display:swap;src:url(/assets/fonts/barlow-condensed-800-latin.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/fonts/inter-var-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/fonts/inter-var-latin.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* futbolfutbol design system. Display/numbers: Barlow Condensed. Body: Inter. */
/* Tokens. Dark is the default; light follows the device (prefers-color-scheme) unless the visitor chose a theme (data-theme on <html>). Contrast checked: text >= 4.5:1, borders that carry meaning >= 3:1. */
:root{
  color-scheme:dark;
  --bg:#070d18;--bg2:#0a1424;--card:#0e1829;--row:#13213a;--line:#1d2c47;--line2:#506b97;--track:#2c4062;
  --ink:#eaf1fc;--ink2:#c3d0e6;--muted:#8fa3c2;
  --blue:#3d94ff;--blue-hi:#6cb2ff;--blue-bg:#0f2a52;--btn:#1667d9;--btn-ink:#fff;
  --warn:#f2c76b;--warn-bg:#2a2210;--bad:#ff8c7a;--bad-bg:#2e1713;--good:#52d6a0;--good-bg:#0f2a21;
  --violet:#a78bfa;--violet-bg:#221b3d;
  --pick:#e8b931;--pick-bg:rgba(232,185,49,.07);--pick-solid:#7a5a0b;--pick-solid-ink:#ffe08a;--pick-line:#a8821f;
  --glow:rgba(26,115,240,.16);--formula-bg:var(--bg);
  --shadow:0 1px 0 rgba(255,255,255,.03) inset;
  --disp:"Barlow Condensed","Arial Narrow","Roboto Condensed",system-ui,sans-serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --pad:clamp(16px,3.2vw,48px);
}
:root[data-theme=light]{
  color-scheme:light;
  --bg:#eef3fa;--bg2:#e4ecf7;--card:#fff;--row:#f0f5fc;--line:#d6e0ee;--line2:#7388aa;--track:#c3d1e4;
  --ink:#0c1a30;--ink2:#2b3d58;--muted:#546781;
  --blue:#0b63e0;--blue-hi:#0848a8;--blue-bg:#e3eefe;--btn:#0b63e0;--btn-ink:#fff;
  --warn:#7a4f00;--warn-bg:#fff1cc;--bad:#a8301f;--bad-bg:#fde8e4;--good:#0d7a50;--good-bg:#dff5ea;
  --violet:#6d4bd8;--violet-bg:#ece7fb;
  --pick:#8a5a00;--pick-bg:rgba(138,90,0,.08);--pick-solid:#fff1cc;--pick-solid-ink:#7a4f00;--pick-line:#c9a24a;
  --glow:rgba(11,99,224,.08);--formula-bg:var(--row);
  --shadow:0 1px 2px rgba(12,26,48,.06);
}
@media (prefers-color-scheme:light){:root:not([data-theme]){
  color-scheme:light;
  --bg:#eef3fa;--bg2:#e4ecf7;--card:#fff;--row:#f0f5fc;--line:#d6e0ee;--line2:#7388aa;--track:#c3d1e4;
  --ink:#0c1a30;--ink2:#2b3d58;--muted:#546781;
  --blue:#0b63e0;--blue-hi:#0848a8;--blue-bg:#e3eefe;--btn:#0b63e0;--btn-ink:#fff;
  --warn:#7a4f00;--warn-bg:#fff1cc;--bad:#a8301f;--bad-bg:#fde8e4;--good:#0d7a50;--good-bg:#dff5ea;
  --violet:#6d4bd8;--violet-bg:#ece7fb;
  --pick:#8a5a00;--pick-bg:rgba(138,90,0,.08);--pick-solid:#fff1cc;--pick-solid-ink:#7a4f00;--pick-line:#c9a24a;
  --glow:rgba(11,99,224,.08);--formula-bg:var(--row);
  --shadow:0 1px 2px rgba(12,26,48,.06);
}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.55 var(--sans);font-feature-settings:"tnum" 1,"cv11" 1;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(1200px 500px at 85% -10%,var(--glow),transparent 60%)}
a{color:var(--blue);text-underline-offset:2px}a:hover{color:var(--blue-hi)}
.num,td.num,th.num,.sv,.rk,.big,.rpix{font-variant-numeric:tabular-nums}
.sr,.skip:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip:focus{position:fixed;left:12px;top:12px;z-index:50;background:var(--btn);color:#fff;padding:8px 14px;border-radius:6px}
.wrap{width:100%;padding-inline:var(--pad)}
.muted{color:var(--muted)}.small{font-size:13px}
.nc{color:var(--muted);font-style:italic;font-size:13px}
.prose{max-width:75ch}
.country-intro{margin:0 0 28px;padding:22px 24px}.country-intro h2{margin-top:0}.country-intro p{max-width:90ch}.country-intro-links{font-weight:650}
.directory-head{max-width:900px}.directory>h2{margin-bottom:14px}.directory>ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}.directory-player{display:grid;grid-template-columns:minmax(180px,1.5fr) auto minmax(140px,1fr) minmax(140px,1fr) auto;gap:14px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--card);text-decoration:none;color:inherit}.directory-player:hover{border-color:var(--accent)}.directory-name{font-weight:750}.directory-score{font-weight:750;text-align:right;color:var(--accent-hi)}
@media(max-width:700px){.directory-player{grid-template-columns:1fr auto}.directory-player>:nth-child(3),.directory-player>:nth-child(4){grid-column:1}.directory-score{grid-column:2;grid-row:1}}
.pros-method,.pros-submit{margin-bottom:28px}.pros-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.pros-legend p{margin:0}.pros-group,.pros-pending{margin:32px 0}.pros-list{display:grid;gap:8px}.pros-row{display:grid;grid-template-columns:46px minmax(170px,1.35fr) minmax(110px,.65fr) minmax(170px,1fr) auto;gap:12px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:inherit;text-decoration:none}.pros-row:hover{border-color:var(--accent)}.pros-who{display:flex;flex-direction:column}.pros-who small{color:var(--muted);font-size:11px;letter-spacing:.35px}.pros-state{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap}.pros-score{color:var(--accent-hi);white-space:nowrap}.pros-candidate{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(280px,1.5fr);gap:22px;padding:20px;border:1px solid color-mix(in srgb,var(--gold) 55%,var(--line));border-radius:14px;background:var(--card)}.pros-candidate h3{font-size:24px;margin:8px 0 4px}.pros-candidate p{margin:5px 0}.pros-empty{padding:18px;border:1px dashed var(--line2);border-radius:12px;color:var(--muted)}.pros-submit{display:flex;justify-content:space-between;align-items:center;gap:24px}.pros-submit>div{max-width:75ch}.pros-submit h2{margin-bottom:8px}.pros-submit p:last-child{margin-bottom:0}@media(max-width:780px){.pros-legend,.pros-candidate{grid-template-columns:1fr}.pros-row{grid-template-columns:46px 1fr auto}.pros-row .pros-club{grid-column:2/4}.pros-row .pros-state{grid-column:2/4;justify-content:flex-start}.pros-submit{align-items:flex-start;flex-direction:column}}
.pros-cohorts{margin:32px 0}.cohort{padding:0;margin:10px 0}.cohort summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 18px;cursor:pointer}.cohort summary>span:first-child{display:flex;flex-direction:column}.cohort summary small{color:var(--muted);font-weight:400}.cohort-list{list-style:none;margin:0;padding:0 18px 18px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.cohort-list li{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;padding:9px 10px;background:var(--row);border-radius:8px}.cohort-list a{text-decoration:none}@media(max-width:700px){.cohort-list{grid-template-columns:1fr}.cohort-list li{grid-template-columns:auto 1fr}.cohort-list .badge{grid-column:2;justify-self:start}}
.pros-coach{margin:36px 0}.coach-table td:first-child .sub,.coach-table td:nth-child(4) .sub{display:block}.isp-method{margin-top:14px}.isp-method summary{cursor:pointer}.badge.info{border-color:color-mix(in srgb,var(--blue) 45%,var(--line));color:var(--blue-hi)}
.selprimer{margin:18px 0 26px}.selprimer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.selprimer-grid .card{position:relative;padding-top:18px}.selprimer-grid h3{margin:2px 0 8px;font-size:20px}.selprimer-grid p{margin:0}.stepn{display:inline-grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--blue);color:#fff;font-weight:800;font-size:12px}.agreeplain{max-width:65ch}.lp-num .badge{display:inline-block;margin-top:8px}@media(max-width:760px){.selprimer-grid{grid-template-columns:1fr}}
.u20complete{margin:30px 0}.u20list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.u20player{display:grid;grid-template-columns:42px minmax(0,1fr) minmax(170px,.8fr);gap:10px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--card);color:inherit;text-decoration:none}.u20player:hover{border-color:var(--accent)}.u20player>span{display:flex;flex-direction:column;gap:4px}.u20player small{color:var(--muted)}.u20player .pchip{margin-right:5px}@media(max-width:760px){.u20list{grid-template-columns:1fr}.u20player{grid-template-columns:42px 1fr}.u20player>span:last-child{grid-column:2}}
.ic{flex:none}

/* ---------- header ---------- */
.top{background:color-mix(in srgb,var(--bg) 88%,transparent);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;backdrop-filter:saturate(1.2) blur(8px)}
.bar-row{display:flex;align-items:center;gap:8px 24px;flex-wrap:wrap;min-height:72px;padding-block:6px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.logo{width:56px;height:56px;display:block;flex:none}
.wm{font:800 38px/1 var(--disp);letter-spacing:.2px;text-transform:lowercase;color:var(--ink);white-space:nowrap}
.wm-b{color:var(--blue)}
.dnav{display:flex;gap:2px;flex-wrap:wrap;margin-right:auto}
.dnav a{padding:8px 12px;color:var(--ink2);text-decoration:none;font-weight:600;font-size:14px;letter-spacing:.2px;border-bottom:2px solid transparent;border-radius:6px 6px 0 0}
.dnav a:hover{color:var(--ink);background:var(--row)}
.dnav a[aria-current]{color:var(--blue-hi);border-bottom-color:var(--blue)}
.navmore{position:relative}
.navmore>summary{display:flex;align-items:center;gap:5px;padding:8px 12px;color:var(--ink2);font-weight:600;font-size:14px;letter-spacing:.2px;border-bottom:2px solid transparent;border-radius:6px 6px 0 0;cursor:pointer;list-style:none}
.navmore>summary::-webkit-details-marker{display:none}
.navmore>summary:hover,.navmore[open]>summary{color:var(--ink);background:var(--row)}
.navmore>summary[aria-current=page]{color:var(--blue-hi);border-bottom-color:var(--blue)}
.navmore[open]>summary svg{transform:rotate(180deg)}
.navmore-menu{position:absolute;z-index:40;top:calc(100% + 6px);right:0;min-width:190px;padding:7px;background:var(--card);border:1px solid var(--line2);border-radius:10px;box-shadow:var(--shadow)}
.navmore-menu a{display:block;border:0;border-radius:7px;white-space:nowrap}
.tools{display:flex;align-items:center;gap:12px}
.lang{display:flex;gap:6px;align-items:center;color:var(--muted);font-size:13px}
.lang a{color:var(--muted);text-decoration:none;font-weight:700;padding:2px 3px;letter-spacing:.5px}
.lang a[aria-current]{color:var(--ink);box-shadow:0 2px 0 var(--blue)}
.themebtn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--line2);border-radius:8px;color:var(--ink);background:var(--card);transition:background .15s}
.themebtn:hover{background:var(--row);color:var(--ink)}
a:focus-visible,button:focus-visible{outline:2px solid var(--blue-hi);outline-offset:2px}
main{padding-top:28px;padding-bottom:40px}

/* ---------- type ---------- */
h1,h2,h3{font-family:var(--disp)}
h1{font-size:clamp(34px,5vw,56px);line-height:1.02;margin:0 0 12px;font-weight:800;letter-spacing:.2px}
h2{font-size:24px;line-height:1.1;margin:0 0 12px;font-weight:700;letter-spacing:.3px}
.eyebrow{font:700 13px/1 var(--sans);text-transform:uppercase;letter-spacing:1.6px;color:var(--blue);margin:0 0 12px}
.lede{color:var(--ink2);font-size:17px;max-width:75ch;margin:0 0 16px}
.pagehead{margin-bottom:22px}
.pagehead h1{font-size:clamp(32px,4.4vw,48px)}

/* ---------- buttons, chips, badges ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:8px;background:var(--btn);color:var(--btn-ink);text-decoration:none;font-weight:700;font-size:15px;border:1px solid var(--btn);transition:transform .15s,background .15s}
.btn:hover{color:#fff;background:color-mix(in srgb,var(--btn) 85%,#fff);transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line2)}
.btn.ghost:hover{background:var(--row);color:var(--ink)}
.filters{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center}
.fgroup{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.lbl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted);margin-right:2px}
.chip{padding:5px 12px;border:1px solid var(--line2);border-radius:999px;background:transparent;color:var(--ink2);text-decoration:none;font-size:13px;font-weight:600;transition:background .15s}
.chip:hover{background:var(--row);color:var(--ink)}
.chip.on{background:var(--btn);border-color:var(--btn);color:#fff}
.badge{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.3px;border-radius:5px;padding:2px 9px;vertical-align:middle}
.badge.np{background:var(--bad-bg);color:var(--bad)}
.badge.nc2{background:var(--warn-bg);color:var(--warn)}
.badge.rk1{background:var(--blue-bg);color:var(--blue-hi)}
.pchip{display:inline-block;min-width:34px;text-align:center;font:700 12px/1 var(--sans);letter-spacing:.5px;border-radius:5px;padding:4px 6px;background:var(--row);color:var(--ink2);border:1px solid var(--line)}
.p-GK{color:var(--warn)}.p-DF{color:var(--good)}.p-MF{color:var(--blue-hi)}.p-FW{color:var(--bad)}
.tier{display:inline-block;min-width:44px;text-align:center;font:700 13px/1 var(--sans);border-radius:5px;padding:4px 7px;background:var(--blue-bg);color:var(--blue-hi);border:1px solid transparent}
.tier.t1{background:var(--btn);color:#fff}.tier.t2{background:var(--blue-bg);color:var(--blue-hi);border-color:var(--blue)}
.tier.t3,.tier.t4{background:transparent;color:var(--ink2);border-color:var(--line2)}
.tier.t5{background:var(--row);color:var(--muted)}
.cap{display:inline-block;font-size:10px;font-weight:800;background:var(--btn);color:#fff;border-radius:3px;padding:1px 5px;vertical-align:middle}

/* ---------- avatars ---------- */
.avatar{flex:none}.av-bg{fill:var(--blue-bg)}.av-tx{fill:var(--blue-hi);font:800 14px var(--disp);letter-spacing:.5px}
.pos-GK .av-bg{fill:var(--warn-bg)}.pos-GK .av-tx{fill:var(--warn)}
.pos-DF .av-bg{fill:var(--good-bg)}.pos-DF .av-tx{fill:var(--good)}
.pos-FW .av-bg{fill:var(--bad-bg)}.pos-FW .av-tx{fill:var(--bad)}

/* ---------- hero ---------- */
.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:32px 48px;align-items:center;padding:8px 0 36px}
.hero h1{max-width:16ch}
.hero-links{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 0}
.hero-search{display:grid;gap:7px;max-width:560px;margin-top:20px}
.hero-search label{font-weight:700;color:var(--ink)}
.hero-search-row{display:flex;gap:8px}
.hero-search input{min-width:0;flex:1;height:44px;padding:0 14px;border:1px solid var(--line2);border-radius:9px;background:var(--card);color:var(--ink);font:inherit}
.hero-search input:focus{outline:2px solid var(--accent-hi,var(--blue-hi));outline-offset:2px}
.hero-search .btn{flex:none}
.hero-side{display:grid;grid-template-columns:auto minmax(260px,1fr);gap:20px;align-items:center;justify-items:center}
.hero-logo{width:clamp(160px,17vw,240px);height:auto;display:block;transform-origin:50% 60%;filter:drop-shadow(0 12px 30px rgba(26,115,240,.35));animation:ff-roll-in 1.1s cubic-bezier(.22,1.2,.36,1) both,ff-float 5s ease-in-out 1.1s 2,ff-glow 5s ease-in-out 1.1s 2}
.logo{transform-origin:50% 60%;animation:ff-roll-in .9s cubic-bezier(.22,1.2,.36,1) both;transition:transform .5s cubic-bezier(.22,1.2,.36,1)}
a:hover .logo,.logo:hover{transform:rotate(-14deg) scale(1.08)}
@keyframes ff-roll-in{0%{opacity:0;transform:translateX(-60px) rotate(-200deg) scale(.6)}70%{opacity:1}100%{opacity:1;transform:none}}
@keyframes ff-float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(-4deg)}}
@keyframes ff-glow{0%,100%{filter:drop-shadow(0 12px 30px rgba(26,115,240,.35))}50%{filter:drop-shadow(0 18px 44px rgba(26,115,240,.6))}}
.topcard{display:grid;gap:12px;width:100%;padding:18px 20px;background:var(--card);border:1px solid var(--line2);border-radius:12px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:transform .2s,border-color .2s;position:relative;overflow:hidden}
.topcard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--blue)}
.topcard:hover{transform:translateY(-2px);border-color:var(--blue);color:var(--ink)}
.tc-label{display:flex;align-items:center;gap:8px;font:700 12px/1 var(--sans);text-transform:uppercase;letter-spacing:1.4px;color:var(--blue)}
.tc-main{display:flex;gap:12px;align-items:center}
.tc-name{font:700 26px/1.05 var(--disp);letter-spacing:.2px}
.tc-name .sub{display:block;font:400 13px/1.3 var(--sans);color:var(--muted);margin-top:3px;letter-spacing:0}
.tc-score{display:flex;align-items:baseline;gap:8px}
.tc-score strong{font:800 76px/.9 var(--disp);color:var(--blue)}
.tc-score span{font:700 13px var(--sans);letter-spacing:1.4px;color:var(--muted)}
.tc-parts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;padding-top:10px;border-top:1px solid var(--line)}
.tc-parts span{display:grid;gap:2px;text-align:center}
.tc-parts small{color:var(--muted);font-size:10px;line-height:1.15}
.tc-parts strong{font-size:14px;color:var(--ink)}
.tc-go{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;color:var(--blue)}
.topcard .bar{height:8px}

/* ---------- table ---------- */
.sechead{display:flex;flex-wrap:wrap;gap:10px 28px;align-items:center;justify-content:space-between;margin-bottom:12px}
.sechead h2{margin:0;font-size:30px}
.tablewrap{overflow-x:auto;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%}
th,td{padding:10px 14px;text-align:left;vertical-align:middle;border-bottom:1px solid var(--line)}
tbody tr:last-child td{border-bottom:0}
tbody tr{transition:background .12s}
tbody tr:hover{background:var(--row)}
th{font:700 11px/1.2 var(--sans);text-transform:uppercase;letter-spacing:1px;color:var(--muted);white-space:nowrap;background:var(--bg2)}
th a{color:inherit;text-decoration:none;display:inline-flex;gap:5px;align-items:center}th a:hover{color:var(--blue-hi)}
th[aria-sort=ascending],th[aria-sort=descending]{color:var(--blue-hi)}
th.num,td.num,.c-age,.c-market_value_eur,.c-rpix,.c-fan_score,.c-rank,.c-M,.c-T,.c-O,.c-P,.c-Y,.c-confidence{text-align:right}
th.c-rank,td.c-rank{width:72px;padding-right:6px}
th.c-rpix,td.c-rpix{width:170px}
th.c-rpix a,th.c-rank a,th.c-M a,th.c-T a,th.c-O a,th.c-P a,th.c-Y a,th.c-confidence a,th.c-age a,th.c-market_value_eur a,th.c-fan_score a{justify-content:flex-end}
table.rank td{font-size:14px}
td.c-name,td.c-fan_score,td.c-market_value_eur{white-space:nowrap}
td.c-M,td.c-T,td.c-O,td.c-P,td.c-Y{color:var(--muted)}
.rk{font:800 34px/1 var(--disp);color:var(--ink2);display:block}
tr.podium .rk{color:var(--blue)}
tr.podium:first-child .rk{font-size:42px}
.pl{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-weight:600}.pl:hover{color:var(--blue-hi)}
td .sub{display:block;font-size:12px;color:var(--muted);line-height:1.3}
.sc{display:grid;grid-template-columns:1fr;gap:4px;justify-items:end}
.rpix{font:800 28px/1 var(--disp);color:var(--ink)}
tr.podium .rpix{color:var(--blue-hi)}
.sc .bar{width:120px;height:5px}
.keynote{margin:12px 0 0;max-width:110ch}
.empty{padding:28px 14px;color:var(--muted);text-align:center}
.ranking{margin-bottom:36px}
.bar{width:100%;height:8px;display:block}.bar .bg{fill:var(--track)}.bar .fg{fill:var(--blue);transform-box:fill-box;transform-origin:left center;animation:grow .8s cubic-bezier(.2,.7,.2,1) both}

/* ---------- cards ---------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px 22px;margin:0 0 18px;box-shadow:var(--shadow)}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-bottom:18px}.grid2>.card{margin:0}
.card .tablewrap th{background:transparent}
table.plain th,table.plain td{font-size:14px}table.narrow{max-width:520px}
table.wide td:first-child{width:90px}
.card>.tablewrap{box-shadow:none}
.crumb{margin:0 0 14px;color:var(--muted);font-size:13px}

/* ---------- player ---------- */
.phead{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin-bottom:22px}
.phead .pid{flex:1;min-width:240px}
.phead h1{margin:0 0 8px}
.pbadges{display:flex;gap:8px;align-items:center;margin:0 0 8px}
.score{text-align:right}
.big{font:800 96px/.85 var(--disp);color:var(--blue);letter-spacing:-.5px}
.big.off{color:var(--muted);font-size:40px;letter-spacing:0}.big.off.sm{font-size:34px}
.fanline{margin-top:8px}
.part{display:grid;grid-template-columns:minmax(180px,260px) 1fr 120px;gap:14px;align-items:center;margin:14px 0}
.part .pl-label{font-size:14px;font-weight:600}.part .pl-val{text-align:right;font:700 20px var(--disp);letter-spacing:.3px}
.part .pl-label .muted{font-weight:400}
.part .bar{height:10px}
.part.off{opacity:.6}.part.off .pl-val{font:italic 400 13px var(--sans)}
.flag{background:var(--warn-bg);color:var(--warn);border-radius:8px;padding:10px 14px;font-size:14px;margin:0 0 18px}
.statrow .flag{margin:14px 0 0}
dl{margin:0 0 12px;display:grid;grid-template-columns:140px 1fr;gap:9px 14px}dt{color:var(--muted)}dd{margin:0}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px}
.stat{background:var(--row);border:1px solid var(--line);border-radius:10px;padding:10px 14px}
.stat .sv{font:800 32px/1 var(--disp)}.stat .sl{font-size:12px;color:var(--muted);margin-top:4px}
.formula-s{margin-top:16px}

/* ---------- vote ---------- */
.vote{border-color:var(--line2)}
.votebtns{display:grid;grid-template-columns:repeat(3,minmax(0,220px));gap:10px}
.votebtns button{font:700 15px var(--sans);display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 14px;border:1px solid var(--line2);background:transparent;color:var(--ink);border-radius:10px;cursor:pointer;transition:background .15s,border-color .15s,transform .1s}
.votebtns button:hover{background:var(--row);border-color:var(--blue)}
.votebtns button:active{transform:scale(.98)}
.votebtns button.on{background:var(--btn);border-color:var(--btn);color:#fff}
.votebtns button:disabled{opacity:.6;cursor:wait}
#vote-msg{min-height:20px;margin:10px 0 0;color:var(--ink2)}

/* ---------- fans ---------- */
.div{display:inline-block;font-weight:700;border-radius:5px;padding:1px 8px}
.div.pos{background:var(--good-bg);color:var(--good)}.div.neg{background:var(--bad-bg);color:var(--bad)}
.empty-s{padding:6px 0}

/* ---------- rules ---------- */
.jump{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 20px}
.jump a{padding:6px 12px;border:1px solid var(--line2);border-radius:999px;color:var(--ink2);text-decoration:none;font-size:13px;font-weight:600}
.jump a:hover{background:var(--row);color:var(--ink)}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.steps li{display:grid;grid-template-columns:auto 1fr;gap:14px;background:var(--row);border:1px solid var(--line);border-radius:10px;padding:16px;align-items:start}
.steps .n{font:800 52px/.85 var(--disp);color:var(--blue)}
.steps strong{display:block;font:700 20px/1.1 var(--disp);letter-spacing:.3px;margin-bottom:6px}
.steps div{color:var(--ink2);font-size:14px}
.formula-block{background:var(--formula-bg);border:1px solid var(--line2);border-left:4px solid var(--blue);border-radius:10px;padding:16px 20px;margin:0 0 16px;overflow-x:auto}
.formula{margin:0;font:700 clamp(18px,2.2vw,28px)/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:nowrap}
.formula .w{color:var(--blue-hi)}
.defs,.rules{margin:0;padding-left:20px}.defs{list-style:none;padding:0;display:grid;gap:8px}
.defs li{background:var(--row);border-radius:8px;padding:10px 14px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;overflow-x:auto}
.defs li strong{color:var(--blue-hi);font-size:15px}
.rules li{margin:8px 0}
.gap{margin-top:22px}
.hyp{border-color:var(--blue);border-left-width:4px}
.hyp h2{color:var(--blue-hi)}

/* ---------- footer ---------- */
.foot{margin-top:24px;border-top:1px solid var(--line);background:var(--bg2);padding-block:28px}
.foot-in{display:grid;grid-template-columns:minmax(220px,320px) minmax(0,75ch);gap:20px 48px;align-items:start}
.foot .wm{font-size:30px}
.foot p{margin:8px 0 0;color:var(--muted);font-size:13px}

/* ---------- motion ---------- */
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  th.c-M,td.c-M,th.c-T,td.c-T,th.c-O,td.c-O,th.c-Y,td.c-Y,th.c-P,td.c-P{display:none}
  .hero{grid-template-columns:1fr}
  .hero h1{max-width:22ch}
}
@media (max-width:860px){
  .grid2{grid-template-columns:1fr}
  .foot-in{grid-template-columns:1fr}
  .part{grid-template-columns:1fr 100px}.part .bar{grid-column:1/-1;order:3}
  .score{text-align:left;width:100%}
  th.c-club,td.c-club,th.c-position,td.c-position,th.c-age,td.c-age,th.c-league_factor,td.c-league_factor,th.c-tier_data,td.c-tier_data,th.c-nt,td.c-nt{display:none}
}
@media (max-width:640px){
  main{padding-top:12px}
  .hero{gap:20px}.hero-side{grid-template-columns:1fr}.hero-logo{width:150px}
  .tc-score strong{font-size:64px}
  th,td{padding:9px 8px}
  th.c-market_value_eur,td.c-market_value_eur{display:none}
  th.c-rpix,td.c-rpix{width:auto}.sc .bar{width:84px}
  .rk{font-size:28px}tr.podium:first-child .rk{font-size:32px}
  th.c-rank,td.c-rank{width:44px}
  .card{padding:16px}
  .big{font-size:76px}
  dl{grid-template-columns:110px 1fr}
  .votebtns{grid-template-columns:1fr}
  .formula{font-size:16px}
  .sechead h2{font-size:26px}
}
.avatar-photo{border-radius:50%;object-fit:cover;object-position:50% 15%;background:var(--blue-bg);box-shadow:0 0 0 2px var(--blue-bg)}
.pos-GK.avatar-photo{box-shadow:0 0 0 2px var(--warn)}.pos-DF.avatar-photo{box-shadow:0 0 0 2px var(--good)}.pos-FW.avatar-photo{box-shadow:0 0 0 2px var(--bad)}.pos-MF.avatar-photo{box-shadow:0 0 0 2px var(--blue-hi)}

/* ---------- crests, call-up check ---------- */
.tier.t6{background:var(--row);color:var(--muted);border-color:var(--line)}
.crest{flex:none;object-fit:contain;vertical-align:middle}
.clubname{display:inline-flex;align-items:center;gap:8px;min-width:0;min-height:24px}
@media (pointer:coarse){.clubname{min-height:44px}}
td.c-club{white-space:nowrap}
.clubline{display:flex;align-items:center;gap:10px;margin:8px 0 0;font-weight:600}
.flagb{display:inline-flex;align-items:center;gap:5px;font:700 11.5px/1.25 var(--sans);border-radius:6px;padding:3px 8px;margin-top:5px;white-space:normal;max-width:34ch}
.flagb .ic{flex:none}
.flagb.hard{background:var(--bad-bg);color:var(--bad);border:1px solid var(--bad)}
.flagb.soft{background:var(--warn-bg);color:var(--warn);border:1px solid transparent}
td.c-name .flagb{display:flex;width:max-content}
.phead .flagb{margin-top:10px}
.sq{display:block;flex:none}
.sq .f-good{fill:var(--good)}.sq .f-warn{fill:var(--warn)}.sq .f-bad{fill:var(--bad)}.sq .f-dim{fill:var(--line2)}
.sq .o-warn{fill:none;stroke:var(--warn);stroke-width:1.5}.sq .o-bad{fill:none;stroke:var(--bad);stroke-width:1.5}
.sq .o-dash{fill:none;stroke:var(--muted);stroke-width:1.5;stroke-dasharray:2.4 2}
.sq .mk{fill:none;stroke:var(--card);stroke-width:2;stroke-linecap:round}
.sq .mk-bad{fill:none;stroke:var(--bad);stroke-width:2;stroke-linecap:round}
.sq .mk-dim{fill:none;stroke:var(--muted);stroke-width:1.6;stroke-linecap:round}
.strip{display:inline-flex;gap:4px;align-items:center}
.legend{list-style:none;display:flex;flex-wrap:wrap;gap:6px 18px;padding:0;margin:10px 0 14px;font-size:13px;color:var(--muted)}
.legend li{display:inline-flex;align-items:center;gap:6px}
.stc{display:inline-flex;align-items:center;gap:8px}
.callstat{margin:0 0 4px;font-size:15px}
.callflag{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:10px;background:var(--bad-bg);color:var(--bad);border:1px solid var(--bad);margin:0 0 10px;font-weight:600}
.callflag .ic{flex:none;margin-top:3px}
.callflag.soft{background:var(--warn-bg);color:var(--warn);border-color:transparent}
.callcheck h3{font:700 13px/1.2 var(--sans);text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:18px 0 8px}
.ntlist{margin:0 0 12px;padding-left:18px}
table.calls tr.flagged{background:var(--bad-bg)}
table.calls tr.flagged:hover{background:var(--bad-bg)}
table.calls td{vertical-align:top}
table.calls td.c-name .pl{align-items:center}
table.calls td .sub{display:block}
.prose{max-width:100ch;margin-top:14px}
.foot-links{margin:10px 0 0;display:flex;gap:18px;flex-wrap:wrap}
/* ---------- forms and admin ---------- */
.form{display:grid;gap:14px;max-width:640px}
.form.narrow{max-width:420px}
.fld{display:grid;gap:5px}
.fld>span{font:600 13px/1.2 var(--sans);color:var(--ink2)}
.form input[type=text],.form input[type=email],.form input[type=password],.form input[type=url],.form input[type=search],.form select,.form textarea{width:100%;font:400 15px/1.4 var(--sans);color:var(--ink);background:var(--bg2);border:1px solid var(--line2);border-radius:8px;padding:10px 12px}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--blue);outline-offset:1px}
.form textarea{resize:vertical;min-height:130px}
.hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.notice{border-radius:10px;padding:12px 14px;margin:0 0 16px;border:1px solid var(--line2);background:var(--row)}
.notice.ok{background:var(--good-bg);color:var(--good);border-color:var(--good)}
.notice.bad{background:var(--bad-bg);color:var(--bad);border-color:var(--bad)}
.notice.info{background:var(--blue-bg);color:var(--ink);border-color:var(--blue)}
.notice ul{margin:0;padding-left:18px}
.admbar{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:space-between;margin:0 0 18px}
.admtabs{display:flex;gap:6px;flex-wrap:wrap}
.admtabs a{padding:8px 14px;border-radius:8px;text-decoration:none;color:var(--ink2);border:1px solid var(--line2)}
.admtabs a[aria-current]{background:var(--btn);color:#fff;border-color:var(--btn)}
.inl{display:inline-block;margin:0}
.btn.sm{padding:6px 12px;font-size:13px}
.btn.danger{color:var(--bad);border-color:var(--bad)}
.msg.unread{border-color:var(--blue)}
.msghead{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}
.msgbody{white-space:normal;overflow-wrap:anywhere;margin:10px 0}
.msgact{display:flex;gap:8px;flex-wrap:wrap}
tr.dim{opacity:.6}
.wrapurl{overflow-wrap:anywhere;min-width:220px}
@media (max-width:640px){
  th.c-cu,td.c-cu{display:none}
  td.c-club{white-space:normal}
  .clubname span{overflow-wrap:anywhere}
  .flagb{max-width:none}
  td.c-name .flagb{width:auto}
}

.sq .f-nt{fill:var(--blue)}
.ntb{display:inline-flex;flex-direction:column;font-weight:700;font-size:13px;line-height:1.2;white-space:nowrap}
.ntb.on{color:var(--blue-hi)}.ntb.on::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--blue);margin:0 0 3px}
.ntb .sub{font-weight:500;color:var(--muted);font-size:12px}
.ntb.sq{color:var(--muted);font-weight:600}

/* ---------- v2.2: data tier, confidence, metrics, selection gap ---------- */
.tierb{display:inline-block;font:700 11px/1 var(--sans);letter-spacing:.4px;border-radius:5px;padding:4px 7px;white-space:nowrap;vertical-align:middle}
.tierb.full{background:var(--blue-bg);color:var(--blue-hi)}
.tierb.basic{background:transparent;color:var(--muted);box-shadow:inset 0 0 0 1px var(--line2)}
.conf{font-weight:700;font-variant-numeric:tabular-nums}
.conf.hi{color:var(--good)}.conf.mid{color:var(--warn)}.conf.lo{color:var(--bad)}
.c-tier_data,.c-confidence{white-space:nowrap}
.confbig{margin-top:8px;font-size:14px}
.confparts{padding-left:18px;margin:8px 0}.confparts li{margin:4px 0}
table.metrics td.num,table.metrics th.num{white-space:nowrap}
table.metrics tr.off td{color:var(--muted)}
.gapb{display:block;margin-top:4px;font-size:11px;font-weight:700;color:var(--warn)}
.tierline{margin-top:6px}
.grid2>*{min-width:0}

/* Nimble second opinion */
.nb{margin-top:8px;font-size:13px;line-height:1.45;max-width:46ch;font-weight:400;white-space:normal}
.nbchip{display:inline-block;font-size:12px;font-weight:700;border-radius:5px;padding:2px 9px;border:1px solid transparent}
.nb-yes .nbchip{background:var(--good-bg);color:var(--good)}
.nb-bor .nbchip{background:var(--warn-bg);color:var(--warn)}
.nb-no .nbchip{background:var(--bad-bg);color:var(--bad);border-color:var(--bad)}
.nbr{display:block;margin-top:4px}
.nbm{display:block;margin-top:4px;font-size:11px;color:var(--muted,#8a94a6)}
.nbwhat{margin-top:4px}.nbwhat summary{cursor:pointer;color:var(--blue-hi);font-weight:600}
.nbwhat .tablewrap{max-width:calc(100vw - 48px)}
table.nbtbl th,table.nbtbl td{font-size:12px;vertical-align:top;text-align:left}
.nbsum strong{font-weight:700}
.notice.inline{display:inline-block;padding:2px 8px;margin:0}

/* header explanations: dotted underline + help cursor */
th.hh{cursor:help}
th.hh .hl,th.hh>a>.hl{text-decoration:underline dotted;text-decoration-thickness:1px;text-underline-offset:3px}
th.hh a{cursor:help}

/* Selection gap page */
.seltiles{margin:0 0 18px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.seltiles .stat{padding:14px 16px}.seltiles .sl{font-size:13px;color:var(--ink2);font-weight:600}.seltiles .sh{font-size:11.5px;color:var(--muted);margin-top:6px;line-height:1.35}
.selchart{margin:0}.selleg{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;margin:0 0 8px;font-size:13px}.selleg .lg{display:inline-flex;gap:6px;align-items:center}
.selscroll{overflow-x:auto}.selsvg{display:block;width:100%;min-width:440px;height:auto;max-height:520px}
.selsvg .gl{stroke:var(--line);stroke-width:1}.selsvg .ax{fill:var(--muted);font:11.5px var(--sans)}.selsvg .axt{fill:var(--ink2);font:600 12px var(--sans)}
.selsvg .pt circle{transition:r .12s,stroke-width .12s}
.selsvg .pt.called circle,.lgc{fill:var(--blue);stroke:var(--card);stroke-width:1.5}
.selsvg .pt.uncalled circle,.lgu{fill:var(--card);stroke:var(--muted);stroke-width:2}
.selsvg .pt .lbl{opacity:0;pointer-events:none;fill:var(--ink);font:600 12px var(--sans);paint-order:stroke;stroke:var(--card);stroke-width:4px;stroke-linejoin:round;transition:opacity .12s}
.selsvg .pt:hover .lbl,.selsvg .pt:focus .lbl,.selsvg .pt:focus-visible .lbl{opacity:1}
.selsvg .pt:hover circle,.selsvg .pt:focus circle{stroke:var(--blue-hi);stroke-width:3}.selsvg .pt:focus{outline:none}
.selsvg .pt:focus-visible circle{stroke:var(--ink);stroke-width:3}
.selgrp h2{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline}
table.sel{min-width:1040px;border-collapse:separate;border-spacing:0}
table.sel th,table.sel td{white-space:nowrap}
table.sel tbody tr{background:var(--card)}
table.sel td.c-name,table.sel th:first-child{position:sticky;left:0;z-index:1;background:inherit;min-width:210px}
table.sel th:first-child{background:var(--bg2)}
table.sel td.c-name .pl{display:inline-flex;gap:10px;align-items:center}
table.sel .gapb{white-space:normal;max-width:210px}
table.sel td .sub{display:block;font-size:11px;color:var(--muted)}
table.sel .rp{font-weight:700}
table.sel tr.above{background:var(--warn-bg)}
table.sel tr.above td:first-child{box-shadow:inset 3px 0 0 var(--warn)}
table.sel tr.cutline td{padding:0;border-bottom:0;background:var(--card)}
table.sel tr.cutline td span{display:block;width:max-content;max-width:820px;white-space:normal;padding:5px 14px;font-size:12px;font-weight:600;color:var(--blue-hi);border-top:2px solid var(--blue);border-bottom:1px solid var(--line);background:var(--card)}
table.sel tr.cutline td{border-top:2px solid var(--blue)}table.sel tr.cutline td span{border-top:0}
table.sel tr.nbrow{background:var(--row)}table.sel tr.nbrow td{padding:2px 14px 8px;border-bottom:1px solid var(--line)}
table.sel tr.nbrow .nbd{max-width:780px}
.cb{display:inline-block;font-size:12px;font-weight:700;border-radius:5px;padding:2px 9px}
.cb.yes{background:var(--blue-bg);color:var(--blue-hi)}.cb.no{background:var(--row);color:var(--muted);border:1px solid var(--line2)}
.nbd summary{cursor:pointer;color:var(--blue-hi);font-weight:600;font-size:12.5px}
.nbd .nbr,.nbd .nbm{white-space:normal;max-width:78ch}
.nbd[open]{padding:6px 0 4px}
.nbd .nbwhat .tablewrap{max-width:100%}
td .nbchip{margin:0}
.nbnote{margin:6px 0 14px}
.explain{background:var(--blue-bg);border:1px solid var(--line2);border-radius:12px;padding:12px 16px;margin:0 0 14px}
.explain p{margin:0 0 4px;max-width:90ch;font-size:14px}.explain p:last-child{margin:0}
table.calls th.c-nb,table.calls td.c-nb{min-width:150px}
table.calls td.c-nb .nbd{max-width:340px;white-space:normal}
@media (max-width:640px){.seltiles{grid-template-columns:1fr 1fr}.seltiles .stat{padding:10px 12px}.seltiles .sv{font-size:26px}}

.nbchip.nb-yes{background:var(--good-bg);color:var(--good)}.nbchip.nb-bor{background:var(--warn-bg);color:var(--warn)}.nbchip.nb-no{background:var(--bad-bg);color:var(--bad);border-color:var(--bad)}
.nbd,.nbd *{white-space:normal}.nbd .tablewrap th,.nbd .tablewrap td{white-space:normal}
th.hh{position:relative}table.sel th.hh:first-child{position:sticky}
table.sel tr.cutline td span{white-space:normal;width:auto;max-width:640px;position:sticky;left:0}table.sel tr.nbrow td{white-space:normal}
table.sel td.c-name{white-space:normal;max-width:260px}table.sel td.c-name .badge{display:block;margin-top:4px;width:max-content;max-width:230px;white-space:normal}
table.sel th{white-space:normal;vertical-align:bottom}table.sel th.num{min-width:48px}table.sel th[title^="Minutes played"],table.sel th[title^="Minutos jugados"]{min-width:150px;max-width:190px}table.sel{min-width:960px}
table.calls th.c-nb{white-space:normal;min-width:170px}

/* Rules page */
.rulespage{max-width:none}.rulespage .prose.lead,.card .prose.lead{max-width:75ch}.rulespage .prose.lead p{font-size:17px;line-height:1.6;margin:0 0 12px}
.rulespage .card{padding:26px 28px;margin-bottom:22px}
.rulespage h2,.card h2{scroll-margin-top:70px}
.callout{border-left:5px solid var(--blue)}
.wbar{display:flex;gap:3px;margin:18px 0 12px;border-radius:10px;overflow:hidden}
.wseg{display:flex;flex-direction:column;justify-content:center;gap:2px;padding:12px 12px;min-width:0;border-top:6px solid var(--c);background:var(--cbg);color:var(--ink)}
.wseg .wn{font:700 13px/1.2 var(--sans);color:var(--ink2)}.wseg .wp{font:800 26px/1 var(--disp)}
.wbar .wf45{flex:45 1 0}.wbar .wf35{flex:35 1 0}.wbar .wf30{flex:30 1 0}.wbar .wf15{flex:15 1 0}.wbar .wf10{flex:10 1 0}.wbar .wf5{flex:5 1 0}
.wR{--c:#2dd4bf;--cbg:rgba(45,212,191,.12)}.wO{--c:var(--blue);--cbg:var(--blue-bg)}.wT{--c:var(--good);--cbg:var(--good-bg)}.wM{--c:var(--warn);--cbg:var(--warn-bg)}.wY{--c:var(--violet);--cbg:var(--violet-bg)}
.wleg{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px 18px;font-size:14px}
.wleg li{display:flex;gap:8px;align-items:baseline}.wleg .sw{width:12px;height:12px;border-radius:3px;background:var(--c);flex:none;transform:translateY(1px)}
.cnt h3{margin-top:0}.cnt.yes{border-left:4px solid var(--good);padding-left:16px}.cnt.no{border-left:4px solid var(--bad);padding-left:16px}
.exsteps{grid-template-columns:1fr}.exsteps li{grid-template-columns:auto 1fr}.exsteps .n{font-size:40px}
.exsteps p{margin:4px 0 6px;font-size:15px;color:var(--ink2);max-width:75ch}.exsteps code{display:block;font:600 14px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--card);border:1px solid var(--line);border-radius:6px;padding:6px 10px;overflow-x:auto}
details.mathd{border:1px solid var(--line);border-radius:10px;margin:0 0 10px;background:var(--row)}
details.mathd>summary{cursor:pointer;padding:14px 18px;list-style:none;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline}
details.mathd>summary::-webkit-details-marker{display:none}
details.mathd>summary::before{content:"+";font:800 18px var(--disp);color:var(--blue-hi);width:14px}
details.mathd[open]>summary::before{content:"-"}
details.mathd>summary:focus-visible{outline:2px solid var(--blue-hi);outline-offset:2px}
.sumtxt{color:var(--muted);font-size:14px}
details.mathd>:not(summary){margin-left:18px;margin-right:18px}details.mathd>*:last-child{margin-bottom:18px}
details.mathd .card{border:0;padding:0;background:transparent;box-shadow:none}
@media (min-width:900px){.jump.stick{position:sticky;top:0;z-index:6;background:var(--bg);padding:8px 0;margin-bottom:16px;border-bottom:1px solid var(--line)}}

/* Contact page */
.contactgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
.cleft,.cright{min-width:0}
.cpitch h2{margin-top:0;font-size:clamp(26px,3vw,36px)}.cpitch p{max-width:62ch;font-size:16px;line-height:1.55}
.ccards{display:grid;gap:12px;margin:0 0 14px}
.cc{display:block;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px 18px;color:var(--ink);text-decoration:none;transition:transform .18s,border-color .18s,box-shadow .18s}
.cc strong{display:block;font:700 22px/1.1 var(--disp);color:var(--blue-hi);margin-bottom:4px}.cc span{color:var(--ink2);font-size:14.5px}
.cc:hover,.cc:focus-visible{transform:translateY(-2px);border-color:var(--blue);box-shadow:0 6px 18px rgba(0,0,0,.18)}
.cform{margin:0;max-width:none;width:100%}
.cform .fld input,.cform .fld select,.cform .fld textarea{transition:border-color .15s,box-shadow .15s;width:100%}
.cform .fld input:focus,.cform .fld select:focus,.cform .fld textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-bg);outline:none}
.rulefields{border:1px solid var(--line2);border-radius:10px;padding:12px 14px 4px;margin:0 0 14px}.rulefields[hidden]{display:none}.rulefields legend{padding:0 6px;font-weight:700;color:var(--blue-hi)}
textarea.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13.5px}
.chk{display:flex;gap:10px;align-items:center;margin:0 0 12px}
.sentok{text-align:center;background:var(--card);border:1px solid var(--good);border-radius:12px;padding:32px 20px}
.sentok svg .rc{stroke:var(--good);stroke-width:3;stroke-dasharray:145;stroke-dashoffset:145;animation:ffdraw .7s ease-out forwards}
.sentok svg .rk{stroke:var(--good);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40;animation:ffdraw .45s .55s ease-out forwards}
.sentok h2{margin:12px 0 4px}
.msgpre{white-space:pre-wrap;font:13px ui-monospace,Menlo,monospace;background:var(--row);border-radius:8px;padding:8px 10px;margin:4px 0 8px}
@keyframes ffdraw{to{stroke-dashoffset:0}}
@keyframes ffrise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.cpitch,.cc,.cform,.cnote,.sentok{animation:ffrise .55s calc(var(--i,0) * 90ms) cubic-bezier(.2,.7,.2,1) both}
.cpitch{--i:1}.ccards .cc:nth-child(1){--i:2}.ccards .cc:nth-child(2){--i:3}.ccards .cc:nth-child(3){--i:4}.cform{--i:2}.cnote{--i:5}
@media (max-width:900px){.contactgrid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.cpitch,.cc,.cform,.cnote,.sentok{animation:none}.sentok svg .rc,.sentok svg .rk{animation:none;stroke-dashoffset:0}.cc{transition:none}}

/* BETA badge + notice (2026-10-02) */
.brand{position:relative}
.beta{display:inline-block;margin-left:8px;padding:3px 7px;border-radius:6px;background:var(--btn);color:#fff;font:800 12px/1 var(--disp,sans-serif);letter-spacing:1.5px;vertical-align:super;transform:translateY(-6px)}
.betabar{background:var(--blue-bg);color:var(--ink,inherit);font-size:13px;line-height:1.4;padding:7px 0;border-bottom:1px solid var(--line,transparent)}
.betabar strong{display:inline-block;margin-right:6px;padding:1px 6px;border-radius:4px;background:var(--btn);color:#fff;font-size:11px;letter-spacing:1px}
.betabar a{color:var(--blue-hi);font-weight:600}

/* national-team column states (2026-10-02) */
.ntb.no{color:var(--muted);font-weight:600}
.ntb.gold{color:var(--pick)}
.ntb.gold::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--pick);margin:0 0 3px}
tr:has(.ntb.gold) td{background:var(--pick-bg)}
tr:has(.ntb.gold) .c-name a{color:var(--pick)}

.agree{margin:0 0 18px}.agree-big{font-size:20px;margin:0 0 6px}.agree-big strong{font:800 40px/1 var(--disp,sans-serif);color:var(--blue-hi);margin-right:6px}

/* search (2026-10-02) */
.hsearch{display:flex;align-items:center;gap:6px;padding:0 10px;height:36px;border:1px solid var(--line,#22314d);border-radius:9px;background:var(--card,transparent);color:var(--muted);margin-right:10px}
.hsearch input{border:0;background:transparent;color:var(--ink,inherit);font:inherit;font-size:14px;width:150px;outline:none}
.hsearch:focus-within{border-color:var(--blue);color:var(--blue-hi)}
.bigsearch{display:flex;gap:8px;max-width:560px;margin:0 0 20px}
.bigsearch input{flex:1;min-width:0;padding:12px 14px;border-radius:10px;border:1px solid var(--line,#22314d);background:var(--card,transparent);color:var(--ink,inherit);font:inherit}
.bigsearch button{padding:12px 18px;border:0;border-radius:10px;background:var(--btn);color:#fff;font-weight:600;cursor:pointer}
@media (max-width:760px){.hsearch input{width:90px}}
@media (max-width:420px){.hsearch{padding:0 7px;margin-right:6px}.hsearch input{width:64px}}

/* BETA badge + notice (2026-10-02) */
.brand{position:relative}
.beta{display:inline-block;margin-left:8px;padding:3px 7px;border-radius:6px;background:var(--btn);color:#fff;font:800 12px/1 var(--disp,sans-serif);letter-spacing:1.5px;vertical-align:super;transform:translateY(-6px)}
.betabar{background:var(--blue-bg);color:var(--ink,inherit);font-size:13px;line-height:1.4;padding:7px 0;border-bottom:1px solid var(--line,transparent)}
.betabar strong{display:inline-block;margin-right:6px;padding:1px 6px;border-radius:4px;background:var(--btn);color:#fff;font-size:11px;letter-spacing:1px}
.betabar a{color:var(--blue-hi);font-weight:600}
.hsearch input{width:110px}
@media (max-width:1360px){.hsearch{margin-right:6px}.hsearch input{width:72px}}
/* compact search below 1700px: icon width, expands on focus */
@media (max-width:1699px){
 .hsearch{padding:0 8px;margin-right:6px;cursor:text}
 .hsearch input{width:26px;transition:width .2s}
 .hsearch input::placeholder{color:transparent}
 .hsearch:focus-within input{width:150px}
 .hsearch:focus-within input::placeholder{color:var(--muted)}
}
@media (min-width:1200px) and (max-width:1699px){.bar-row{gap:8px 14px;flex-wrap:nowrap}.top .dnav a{padding:8px 8px}.top .tools{margin-left:auto;flex:none}.beta{margin-left:6px}}
/* search inputs: drop the browser native search styling so it matches the pill (Safari draws its own box) */
.hsearch input[type=search],.bigsearch input[type=search]{-webkit-appearance:none;appearance:none;font-family:var(--sans,inherit);box-shadow:none;border-radius:0}
.hsearch input[type=search]{border:0;background:transparent;color:var(--ink);padding:0;margin:0;height:30px;line-height:30px;font-size:14px}
.bigsearch input[type=search]{border-radius:10px}
.hsearch input[type=search]::-webkit-search-decoration,.hsearch input[type=search]::-webkit-search-cancel-button,.bigsearch input[type=search]::-webkit-search-decoration{-webkit-appearance:none}
.hsearch input[type=search]:focus{outline:none}
.hsearch svg{flex:none}

/* ---------- accounts, voting, members (v6) ---------- */
.tagline{font:600 clamp(17px,1.6vw,20px)/1.35 var(--sans);color:var(--blue-hi);margin:0 0 14px;max-width:60ch}
.authlinks{display:flex;align-items:center;gap:4px;margin-right:4px}
.authlink{padding:7px 11px;border-radius:8px;font-weight:700;font-size:14px;text-decoration:none;color:var(--ink2);white-space:nowrap;border:1px solid transparent}
.authlink:hover{background:var(--row);color:var(--ink)}
.authlink.reg{background:var(--btn);color:#fff;border-color:var(--btn)}.authlink.reg:hover{background:color-mix(in srgb,var(--btn) 85%,#fff);color:#fff}
.umenu{position:relative;margin-right:4px}
.umenu summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:7px;height:36px;padding:0 11px;border:1px solid var(--line2);border-radius:8px;background:var(--card);color:var(--ink);font-weight:700;font-size:14px}
.umenu summary::-webkit-details-marker{display:none}
.umenu .un{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.umenu-box{position:absolute;right:0;top:42px;min-width:170px;background:var(--card);border:1px solid var(--line2);border-radius:10px;padding:6px;z-index:40;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.umenu-box a,.umenu-box button{display:block;width:100%;text-align:left;padding:9px 12px;border:0;background:transparent;color:var(--ink);font:600 14px var(--sans);text-decoration:none;border-radius:6px;cursor:pointer}
.umenu-box a:hover,.umenu-box button:hover{background:var(--row)}
.umenu-box form{margin:0}
@media (min-width:900px) and (max-width:1439px){.authlink{padding:7px 8px;font-size:13px}.umenu .un{max-width:84px}}
@media (max-width:640px){.authlink{padding:6px 8px;font-size:13px}.umenu summary{padding:0 8px}.umenu .un{max-width:70px}}

.signup{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center;justify-content:space-between;border-color:var(--blue);background:var(--blue-bg)}
.signup h2{margin-bottom:6px}.signup p{margin:0;max-width:70ch}
.signup-btns{display:flex;gap:10px;flex-wrap:wrap;margin:0}
.authcard{max-width:560px}
.reqs{margin:-4px 0 0;padding-left:18px;color:var(--muted)}.reqs li.ok{color:var(--good)}
.hint{margin:-6px 0 0}
.vbadge{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.3px;padding:2px 8px;border-radius:999px;vertical-align:middle;border:1px solid var(--blue);color:var(--blue-hi);background:var(--blue-bg);white-space:nowrap}
.vbadge.staff{border-color:var(--good);color:var(--good);background:var(--good-bg)}
.statusb{display:inline-block;font-size:12px;font-weight:700;border-radius:5px;padding:2px 9px;background:var(--row);border:1px solid var(--line2)}
.statusb.s-active,.statusb.s-role_verified{background:var(--good-bg);color:var(--good);border-color:transparent}
.statusb.s-pending_email,.statusb.s-role_pending{background:var(--warn-bg);color:var(--warn);border-color:transparent}
.statusb.s-blocked{background:var(--bad-bg);color:var(--bad);border-color:transparent}
.dangerzone{border-color:var(--bad)}
.inl{display:inline-block;margin:0}
.disclose{color:var(--muted);margin:10px 0 0}
.gate{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 6px}
.votenums{margin:0 0 14px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.votenums .sv{font-size:28px}
.votebtns.two{grid-template-columns:repeat(2,minmax(0,160px))}
.reasonfld{margin:14px 0 6px;max-width:640px}
.reasonfld textarea{width:100%;font:400 15px/1.4 var(--sans);color:var(--ink);background:var(--bg2);border:1px solid var(--line2);border-radius:8px;padding:10px 12px;resize:vertical;min-height:84px}
.reasonfld textarea:focus{outline:2px solid var(--blue);outline-offset:1px}
.votebar{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0}
.vmsg{min-height:1.4em;margin:8px 0 0}.vmsg.err{color:var(--bad)}.vmsg.ok{color:var(--good)}
.scalebtns{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.scalebtns button{font:700 15px var(--sans);padding:11px 16px;min-width:56px;border:1px solid var(--line2);background:transparent;color:var(--ink);border-radius:10px;cursor:pointer}
.scalebtns button:hover{background:var(--row);border-color:var(--blue)}
.scalebtns button.on{background:var(--btn);border-color:var(--btn);color:#fff}
.grpres{list-style:none;margin:8px 0 10px;padding:0;display:grid;gap:4px}
.vv{display:inline-block;font-size:12px;font-weight:700;border-radius:5px;padding:1px 8px;background:var(--row)}
.vv.v2{background:var(--blue-bg);color:var(--blue-hi)}.vv.v3{background:var(--good-bg);color:var(--good)}.vv.v1{background:var(--bad-bg);color:var(--bad)}
.reasons{margin:6px 0 0;padding-left:18px;font-size:13px;max-width:70ch;white-space:normal}
table.fanstable td:first-child{min-width:200px}
.yn{font-weight:700;font-size:13px}.yn.yes{color:var(--good)}.yn.no{color:var(--muted)}
.calltiles{margin:0 0 14px}.calltiles .sv{font-size:30px;white-space:nowrap}.calltiles .sv .vs{font:600 14px var(--sans);color:var(--muted)}
.calltiles .sl{min-height:2.6em}
tr.grouprow th{background:var(--row);text-align:left;font:700 15px var(--sans);padding:8px 12px;letter-spacing:.3px}
table.calls2 td{vertical-align:middle}table.calls2 td.c-share,table.calls2 td.c-starts{white-space:nowrap}
.sortcap{margin:0 0 10px;max-width:90ch}
.methods{margin-top:20px}
.filterbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 14px}
.filterbar input,.filterbar select,.acts select{font:400 14px var(--sans);color:var(--ink);background:var(--bg2);border:1px solid var(--line2);border-radius:8px;padding:7px 10px}
.filterbar input{min-width:240px}
.acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.btn.okb{color:var(--good);border-color:var(--good)}
.admsum{margin:0 0 14px;padding:8px 12px;background:var(--row);border:1px solid var(--line);border-radius:8px}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
@media (max-width:640px){.votebtns.two{grid-template-columns:1fr 1fr}.filterbar input{min-width:0;width:100%}.signup{padding:16px}}

/* ---------- national-team filter (header dropdown + chips) ---------- */
.tablewrap.hasmenu{min-height:300px}
th.ntth{position:relative}
.ntf{display:block}
.ntf summary{list-style:none;cursor:pointer;display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px;color:inherit}
.ntf summary::-webkit-details-marker{display:none}
.ntf summary .hl{border-bottom:1px dotted var(--muted)}
.ntf summary:hover .hl,.ntf[open] summary .hl{color:var(--blue-hi)}
.ntf .caret{flex:none;opacity:.8}
.ntf[open] .caret{transform:rotate(180deg)}
.ntf .cur{flex-basis:100%;display:inline-block;width:max-content;max-width:100%;font:600 11px/1.3 var(--sans);text-transform:none;letter-spacing:0;padding:1px 8px;border-radius:999px;background:var(--btn);color:#fff;white-space:normal}
.ntf .cur.gold{background:var(--pick-solid);color:var(--pick-solid-ink)}
.ntmenu{position:absolute;left:0;top:100%;z-index:15;min-width:250px;background:var(--card);border:1px solid var(--line2);border-radius:10px;padding:6px;box-shadow:0 10px 30px rgba(0,0,0,.4);text-transform:none;letter-spacing:0;font-weight:600;white-space:normal}
.ntopt{display:flex;justify-content:space-between;gap:12px;padding:8px 10px;border-radius:6px;color:var(--ink);text-decoration:none;font-size:13.5px}
.ntopt:hover{background:var(--row)}
.ntopt[aria-current]{background:var(--blue-bg);color:var(--blue-hi)}
.ntopt .n{color:var(--muted);font-weight:700}
.ntopt.gold{color:var(--pick)}.ntopt.gold[aria-current]{background:var(--pick-bg)}
.chip.gold{border-color:var(--pick-line);color:var(--pick)}
.chip.gold.on{background:var(--pick-solid);border-color:var(--pick-line);color:var(--pick-solid-ink)}
@media (min-width:1100px){.fgroup.ntchips{display:none}}

/* fit the header on one row from 1280 to 1700 and the call-up table without sideways scrolling */
@media (min-width:900px) and (max-width:1699px){
 .logo{width:44px;height:44px}.wm{font-size:30px}.brand{gap:8px}.brand .beta{display:none}
 .top .dnav{flex-wrap:nowrap}.top .dnav a{padding:8px 6px;font-size:13.5px;white-space:nowrap}
 .bar-row{gap:8px 10px}
}
table.calls2 th,table.calls2 td{padding:8px 7px;font-size:13px;white-space:normal}
table.calls2 th{line-height:1.2;vertical-align:bottom}
table.calls2 td.c-share,table.calls2 td.c-starts{white-space:nowrap}
table.calls2 .avatar{width:30px;height:30px}
table.calls2 td.c-name .pl{gap:8px}
table.calls2 .strip{display:inline-flex;gap:2px}
table.calls2 th.c-nb,table.calls2 td.c-nb{min-width:120px}

/* show / hide password */
.pwwrap{position:relative;display:block}
.pwwrap input{padding-right:48px!important;width:100%}
.pwtoggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:38px;height:38px;display:flex;align-items:center;justify-content:center;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}
.pwtoggle:hover,.pwtoggle[aria-pressed=true]{color:var(--blue-hi)}
.pwtoggle:focus-visible{outline:2px solid var(--blue);outline-offset:1px}

.ntb.unav{color:var(--muted);font-weight:600;font-style:italic}
.ntu input[type=text]{width:240px;padding:6px 8px;border-radius:6px;border:1px solid var(--line,#22314d);background:var(--card,transparent);color:var(--ink)}

.rng{white-space:nowrap;font-size:11.5px;line-height:1.2}.rngnote{margin-top:10px}.espnline{margin:0 0 8px}

/* ======================================================================
   Design pass 1 (2 Oct 2026): phone-first header and ranking, data stamp,
   not-ranked page, tap targets. No inline styles anywhere (CSP).
   ====================================================================== */

/* ---------- data stamp ---------- */
.stamp{margin:6px 0 0;font:500 12px/1.4 var(--sans);letter-spacing:.02em;color:var(--muted);font-variant-numeric:tabular-nums;max-width:46ch}
.topcard .stamp{display:block;margin-top:2px}
.rpix-btn{display:inline-flex;align-items:center;justify-content:flex-end;min-width:44px;min-height:44px;margin:0;padding:0 4px;border:0;border-radius:8px;background:transparent;color:inherit;font:inherit;cursor:help}
.rpix-btn:hover{background:var(--row)}
.stampop{position:absolute;z-index:60;max-width:min(320px,calc(100vw - 24px));padding:10px 12px;border-radius:10px;background:var(--card);color:var(--ink);border:1px solid var(--line2);box-shadow:0 10px 30px rgba(0,0,0,.35);font:500 13px/1.4 var(--sans);font-variant-numeric:tabular-nums}

/* ---------- not ranked: neutral, not an error ---------- */
.badge.nu{background:var(--row);color:var(--muted);border:1px solid var(--line2)}
.unrsum{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between}
.unrsum h2{margin-bottom:4px}.unrsum p{margin:0;max-width:70ch}
.unrl{list-style:none;margin:8px 0 0;padding:0}
.unr{display:grid;grid-template-columns:minmax(180px,1.1fr) minmax(160px,1fr) minmax(220px,1.5fr);gap:6px 16px;align-items:center;padding:6px 0;border-top:1px solid var(--line)}
.unr-st{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center}
.unr .sub{display:block;font-size:12px;color:var(--muted);line-height:1.3}
.pl{min-height:44px}

/* ---------- national-team chip (phone row card) and confidence meter ---------- */
.ntm{display:inline-flex;align-items:center;font:700 12px/1 var(--sans);padding:5px 9px;border-radius:999px;border:1px solid var(--line2);color:var(--ink2);white-space:nowrap}
.ntm.on{color:var(--blue-hi);border-color:var(--blue);background:var(--blue-bg)}
.ntm.gold{color:var(--pick);border-color:var(--pick-line);background:var(--pick-bg)}
.ntm.no{color:var(--muted)}
.cmeter{display:inline-flex;align-items:center;gap:6px;font:700 12px/1 var(--sans);color:var(--ink2)}
.cmeter .bar{width:44px;height:6px}
.cmeter.hi .fg{fill:var(--good)}.cmeter.mid .fg{fill:var(--warn)}.cmeter.lo .fg{fill:var(--bad)}
.c-meta,.filt-btn,.h1s,.sortchips{display:none}
.ranking{scroll-margin-top:72px}

/* ---------- beta notice ---------- */
.betain{display:flex;align-items:center;gap:8px;min-height:36px}
.bdot,.bsum,.bmore{display:none}
.betax{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;margin:0 0 0 auto;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ink);cursor:pointer;flex:none}
.betax:hover{background:var(--row)}
.betax[hidden]{display:none}
.bmore p{margin:0;padding:0 0 10px;font-size:13px;line-height:1.45}

/* ---------- compact header: phones and small tablets ---------- */
.mbar,.msheet,.msearch{display:none}
.ibtn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;border-radius:10px;background:transparent;color:var(--ink);cursor:pointer;text-decoration:none;flex:none}
.ibtn:hover{background:var(--row);color:var(--ink)}
.cpill{display:inline-flex;align-items:center;gap:6px;min-height:44px;max-width:150px;padding:0 12px;border:1px solid var(--line2);border-radius:999px;color:var(--ink);background:transparent;text-decoration:none;font:600 13px/1 var(--sans);white-space:nowrap}
.cpill:hover{background:var(--row);color:var(--ink)}
.cpill svg{flex:none}.cpill span{overflow:hidden;text-overflow:ellipsis}
.i-close{display:none}
@media (max-width:899px){
  .bar-row{height:55px;min-height:55px;padding-block:0;flex-wrap:nowrap;gap:8px}
  .dnav,.tools{display:none}
  .brand{gap:8px;min-width:0;min-height:44px}
  .logo{width:36px;height:36px}.wm{font-size:24px}
  .mbar{display:flex;align-items:center;gap:2px;margin-left:auto;min-width:0}
  .msheet{position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:0 18px 30px rgba(0,0,0,.28);max-height:calc(100vh - 56px);max-height:calc(100dvh - 56px);overflow-y:auto}
  body.menu-open .msheet,.msheet:target{display:block}
  body.menu-open #open-menu .i-open{display:none}body.menu-open #open-menu .i-close{display:inline}
  .mnav{display:flex;flex-direction:column;padding-top:4px}
  .mnav a{display:flex;align-items:center;min-height:48px;padding:0 4px;border-bottom:1px solid var(--line);color:var(--ink);font-weight:600;font-size:16px;text-decoration:none}
  .mnav a[aria-current]{color:var(--blue-hi)}
  .msec{padding:8px 0}
  .mauth{display:flex;gap:10px;padding:8px 0}.mauth .btn{flex:1;justify-content:center;min-height:44px}
  .mwho{margin:4px 0 0;color:var(--muted);font-size:13px}
  .mlink{display:flex;align-items:center;width:100%;min-height:48px;padding:0 4px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--ink);font:600 16px var(--sans);text-align:left;text-decoration:none;cursor:pointer}
  .msec form{margin:0}
  .mprefs{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0 18px}
  .mprefs .lang{gap:6px}.mprefs .lang>span{display:none}
  .mprefs .lang a{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:44px;padding:0 10px;border:1px solid var(--line2);border-radius:8px;box-shadow:none;font-size:14px}
  .mprefs .lang a[aria-current]{background:var(--blue-bg);color:var(--ink);border-color:var(--blue)}
  .themebtn.wide{text-decoration:none;width:auto;min-height:44px;padding:0 14px;gap:8px;font:600 14px var(--sans)}
  .msearch{position:absolute;left:0;top:0;right:0;height:55px;align-items:center;gap:4px;padding:0 var(--pad);background:var(--bg);z-index:3}
  body.search-open .msearch,.msearch:target{display:flex}
  .msearch>svg{display:none}
  .msearch input[type=search]{flex:1;min-width:0;height:44px;padding:0 14px;border:1px solid var(--line2);border-radius:10px;background:var(--card);color:var(--ink);font:400 16px var(--sans);-webkit-appearance:none;appearance:none}
  .msearch input[type=search]:focus{outline:2px solid var(--blue);outline-offset:1px}
  .hsearch{display:none}
}
@media (max-width:640px){
  .brand .beta{display:none}
  /* beta: one line, "BETA - See details", dismissible */
  .bfull{display:none}
  .bdot{display:inline}.bsum{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;font-weight:600}
  .betain{min-height:44px}.betax{width:44px;height:44px}
  .betabar.open .bmore,.bmore:target{display:block}
}
@media (max-width:370px){.wm{font-size:21px}.logo{width:32px;height:32px}.cpill{padding:0 9px;font-size:12px}}

/* ---------- phone home: ranking above the fold, rows as 2-line cards ---------- */
@media (max-width:640px){
  .hero{display:block;padding:0 0 8px}
  .hero .eyebrow,.hero .lede,.hero-links,.hero-side{display:none}
  .hero h1{font-size:22px;line-height:1.1;margin:0 0 4px;max-width:none}
  .h1f{display:none}.h1s{display:inline}
  .tagline{font-size:14px;line-height:1.35;margin:0 0 6px}
  .ranking{margin-bottom:20px}
  .sechead{gap:6px 8px;margin-bottom:8px;justify-content:space-between}
  .sechead h2{font-size:22px}
  .filt-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid var(--line2);border-radius:999px;color:var(--ink);font:600 14px var(--sans);cursor:pointer}
  .ftog:focus-visible + .filt-btn{outline:2px solid var(--blue-hi);outline-offset:2px}
  .ftog:checked + .filt-btn{background:var(--blue-bg);border-color:var(--blue)}
  .filters{display:none;flex-basis:100%;gap:6px 14px}
  .ftog:checked ~ .filters{display:flex}
  .sortchips{display:flex}
  .viewcap:not(.zero){display:none}
  .ranking .tablewrap{background:transparent;border:0;box-shadow:none;border-radius:0;overflow:visible}
  table.rank,table.rank tbody{display:block}
  table.rank thead{display:none}
  table.rank tr.r{display:grid;grid-template-columns:40px minmax(0,1fr) auto;grid-template-areas:"rk nm rp" "mt mt mt";column-gap:8px;row-gap:2px;align-items:center;margin:0 0 8px;padding:6px 8px 10px;background:var(--card);border:1px solid var(--line);border-radius:12px}
  table.rank tr.r:hover{background:var(--card)}
  table.rank tr.r td{display:none;padding:0;border:0;background:transparent!important}
  table.rank tr.r td.c-rank,table.rank tr.r td.c-name,table.rank tr.r td.c-rpix{display:block}
  table.rank tr.r td.c-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;padding-left:48px}
  table.rank tr.r:has(.ntm.gold){background:linear-gradient(var(--pick-bg),var(--pick-bg)),var(--card)}
  table.rank tr.podium:first-child{border-color:var(--blue);background:var(--blue-bg)}
  table.rank tr.emptyrow{display:block}table.rank tr.emptyrow td{display:block}
  td.c-rank{grid-area:rk;width:auto;text-align:center}
  td.c-name{grid-area:nm;min-width:0}
  td.c-rpix{grid-area:rp;text-align:right}
  td.c-meta{grid-area:mt}
  td.c-name .pl{min-height:44px}
  td.c-name .pl>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  td.c-name .flagb{display:none}
  .rpix{font-size:30px}
  .sc .bar,.sc .rng{display:none}
  .m-club{display:inline-flex;flex:1 1 90px;min-width:0;max-width:100%}
  .m-club .clubname{min-width:0}
  .m-club .clubname>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
  .unr{display:flex;flex-wrap:wrap;align-items:center;gap:0 12px;padding:4px 0 8px}
  .unr>.pl{flex-basis:100%}
  .unr-club .sub{display:none}
}

/* ---------- tap targets: 44px on phones ---------- */
@media (max-width:640px){
  .chip{min-height:44px;display:inline-flex;align-items:center;padding:0 14px;font-size:14px}
  .fgroup{gap:8px}
  .jump a{min-height:44px;display:inline-flex;align-items:center;padding:0 14px}
  .crumb a{display:inline-flex;align-items:center;min-height:44px}
  .foot-links{gap:0 6px}.foot-links a{display:inline-flex;align-items:center;min-height:44px;padding:0 6px}
  .btn,.btn.sm{min-height:44px}
  .form input[type=text],.form input[type=email],.form input[type=password],.form input[type=url],.form select,.form textarea,.filterbar input,.filterbar select,.acts select{min-height:44px;font-size:16px}
  .pwtoggle{width:44px;height:44px;right:0}
  summary{padding-block:13px}
  .votebtns button,.scalebtns button{min-height:44px}
  .admtabs a{min-height:44px;display:inline-flex;align-items:center}
  .lang a{min-height:44px;display:inline-flex;align-items:center}
  /* links in running text and table cells: vertical padding on an inline box grows the tap area without moving the lines */
  main a:not([class]),.foot-copy a{padding-block:15px}
}

/* ======================================================================
   Design pass 2: player card, part bars with position band, form sparkline, share
   Tokens: parts use the /reglas colours (O blue, T green, M gold, Y violet), both themes.
   ====================================================================== */
.pcard{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin:0 0 18px;box-shadow:var(--shadow)}
.pc-id{display:flex;gap:12px;align-items:center;min-width:0}
.pc-id .avatar{width:72px;height:72px}
.pc-idt{min-width:0;flex:1}
.pc-idt h1{margin:0 0 6px;font-size:clamp(30px,8vw,40px)}
.pc-pos{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;margin:0 0 6px;font-size:14px}
.pc-club{display:flex;gap:8px;align-items:center;margin:0 0 6px;font-weight:600;line-height:1.25}
.pc-club .crest{flex:none}
.pc-nt{margin:6px 0 0;font-size:14px}
.pc-lab{font:700 12px/1 var(--sans);text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.pc-score{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px}
.pc-big{font:800 64px/.9 var(--disp);color:var(--blue);letter-spacing:-.5px}
.pc-big.off{font-size:30px;color:var(--muted);letter-spacing:0}
.pc-rk{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.pc-rk .badge{font-size:14px;padding:4px 10px}
.pc-score .rng{flex-basis:100%}
.pc-score>.tierline,.pc-score>.confbig,.pc-score>.fanline{flex-basis:100%}
.pc-parts{min-width:0}
.pbars{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;min-width:0}
.pb{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;align-items:baseline;--c:var(--blue);min-width:0}
.pb.pT{--c:var(--good)}.pb.pM{--c:var(--warn)}.pb.pY{--c:var(--violet)}
.pb-l{font-size:14px;font-weight:600;color:var(--ink2);display:flex;align-items:center;gap:8px;min-width:0;overflow-wrap:anywhere}
.pb-sw{width:10px;height:10px;border-radius:3px;background:var(--c);flex:none}
.pb-w{font-weight:500;color:var(--muted);font-size:13px}
.pb-v{font:800 24px/1 var(--disp);letter-spacing:.3px;color:var(--ink);min-width:0;overflow-wrap:anywhere;text-align:right}
.pb.off .pbar{opacity:.6}
.pbar{grid-column:1/-1;height:18px;width:100%}
.pbar .fg{fill:var(--c)}
.pbar .iqr{fill:var(--line2)}
.pbar .med{stroke:var(--ink);stroke-width:2}
.pb-leg{margin:0;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center}
.pb-leg .lg{white-space:normal;align-items:flex-start;min-width:0}
.lg-band,.lg-tick{display:inline-block;vertical-align:middle;margin-right:6px}
.lg-band{flex:none;width:22px;height:6px;border-radius:2px;background:var(--line2)}
.lg-tick{width:2px;height:14px;background:var(--ink);flex:none}
.pc-foot{display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:12px}
.pc-foot .stamp{margin:0;max-width:60ch}
.pc-form{border-top:1px solid var(--line);padding-top:12px}
.form-h{font-size:18px;margin:0 0 8px}
.spark{display:block;width:100%;max-width:340px;height:auto}
.spark .s-base{stroke:var(--line2);stroke-width:1}
.s-st{fill:var(--blue)}.s-sub{fill:var(--good)}
.s-bn{fill:none;stroke:var(--warn);stroke-width:1.5}
.s-outbg{fill:var(--bad)}.s-mk{fill:none;stroke:var(--card);stroke-width:1.8;stroke-linecap:round}
.s-inj{fill:none;stroke:var(--bad);stroke-width:1.5}.s-injm{fill:none;stroke:var(--bad);stroke-width:1.6;stroke-linecap:round}
.s-unk{fill:none;stroke:var(--muted);stroke-width:1.4;stroke-dasharray:2.4 2}
.form-sum{margin:8px 0 6px;font-weight:600;color:var(--ink)}
.sparkleg{list-style:none;margin:0 0 6px;padding:0;display:flex;flex-wrap:wrap;gap:4px 14px;font-size:13px;color:var(--ink2)}
.sparkleg li{display:flex;gap:6px;align-items:center}
.sharebar{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start}
.share{display:block}
.share summary{list-style:none;cursor:pointer}
.share summary::-webkit-details-marker{display:none}
.shbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;min-width:44px;padding:0 16px;border:1px solid var(--line2);border-radius:8px;background:var(--card);color:var(--ink);font:700 14px/1 var(--sans);text-decoration:none;cursor:pointer}
.shbtn:hover{background:var(--row);color:var(--ink)}
.share summary.shbtn{background:var(--btn);border-color:var(--btn);color:var(--btn-ink)}
.share summary.shbtn:hover{background:color-mix(in srgb,var(--btn) 85%,#fff);color:#fff}
.share[open] summary.shbtn{border-radius:8px 8px 0 0}
.shlist{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.share[open] .shlist{position:relative}
@media (min-width:900px){
  .pcard{grid-template-columns:minmax(0,1.15fr) auto minmax(300px,1fr);gap:20px 36px;padding:24px;align-items:start}
  .pc-id .avatar{width:96px;height:96px}
  .pc-score{flex-direction:column;align-items:flex-start;flex-wrap:nowrap}
  .pc-big{font-size:96px}
  .pc-foot,.pc-form{grid-column:1/-1}
  .pc-form{display:block}
}
@media (max-width:899px){
  .pc-score{align-items:center}
}

/* flags (flag-icons, MIT, self-hosted): a 1px token border so white flags read on the light theme */
:root{--flag-line:rgba(255,255,255,.28)}
:root[data-theme=light]{--flag-line:rgba(12,26,48,.35)}
@media (prefers-color-scheme:light){:root:not([data-theme]){--flag-line:rgba(12,26,48,.35)}}
.cflag{display:inline-block;flex:none;border-radius:2px;box-shadow:0 0 0 1px var(--flag-line);object-fit:cover;vertical-align:-2px}
.pc-name{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:0 0 6px}
.pc-name h1{margin:0}
.pc-flags{display:inline-flex;gap:6px;align-items:center}
.pc-club{flex-wrap:wrap}
.pc-club>span{display:flex;flex-direction:column;min-width:0}
.pc-league{font-weight:500;font-size:13px}
.clubname .cflag{margin-left:6px}
.lg{display:inline-flex;align-items:center;white-space:nowrap}
.cpill .cflag{vertical-align:middle}
.ntm .cflag,.ntb .cflag{margin-right:5px;vertical-align:-1px}

/* ==================== Design pass 3 ==================== */
/* ---------- fixtures strip (home, call-ups): "Próximos partidos" ---------- */
.fxs{margin:0 0 24px}
.fxs h2{display:flex;flex-wrap:wrap;gap:2px 10px;align-items:baseline;font-size:22px;margin:0 0 10px}
.fxh3{font:700 13px/1.2 var(--sans);text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:14px 0 8px}
.fxlist{list-style:none;margin:0 0 6px;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:10px}
.fx{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"when stat" "teams teams" "meta meta";gap:4px 12px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 14px;box-shadow:var(--shadow)}
.fxwhen{grid-area:when;font-size:14px;font-weight:700;display:flex;flex-direction:column;justify-content:center;min-height:44px}
.fxwhen time{display:inline-flex;align-items:center;margin-block:0;padding-block:6px 2px;cursor:help;text-decoration:underline dotted;text-underline-offset:3px;text-decoration-thickness:1px}
.fxloc{font-size:12px;font-weight:500;color:var(--muted);margin-top:4px;padding-bottom:4px}
.fxteams{grid-area:teams;display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font:700 20px/1.15 var(--disp);letter-spacing:.2px}
.fxt{display:inline-flex;align-items:center;gap:7px;min-width:0}
.fxn{overflow-wrap:anywhere}
.fxvs{color:var(--muted);font:600 13px var(--sans)}
.fxs-sc{font:800 26px/1 var(--disp);color:var(--blue-hi);margin-left:2px}
.fxmeta{grid-area:meta;display:flex;flex-wrap:wrap;gap:0 12px;font-size:12.5px;color:var(--muted)}
.fxprob{flex-basis:100%;margin-top:7px;padding-top:7px;border-top:1px solid var(--line);color:var(--ink2)}
.fxprob strong{color:var(--blue-hi)}.fxprob small{color:var(--muted);font-weight:600}
.fxstat{grid-area:stat;align-self:center;text-align:right;font-size:13px;font-weight:700;color:var(--ink2);white-space:nowrap;display:flex;flex-direction:column;align-items:flex-end;gap:7px}
.fxanalysis{display:inline-flex;align-items:center;min-height:24px;color:var(--blue-hi);font-size:12px;font-weight:800;text-decoration:none}
@media (pointer:coarse){.fxanalysis{min-height:44px}}
.fxanalysis:hover,.fxanalysis:focus-visible{text-decoration:underline;text-underline-offset:3px}
.matchstory{max-width:860px;margin:28px auto 64px}.matchstory>header{padding-bottom:20px;border-bottom:1px solid var(--line)}
.matchstory h1{font-size:clamp(34px,6vw,64px);line-height:1.02;margin:10px 0 14px}.articlemeta{color:var(--muted);font-weight:700}
.storybody{font-size:18px;line-height:1.75}.storybody p{margin:1.25em 0}.matchstory footer{margin-top:32px;padding-top:18px;border-top:1px solid var(--line)}
.fxcd{display:inline-block;padding:3px 10px;border-radius:999px;background:var(--blue-bg);color:var(--blue-hi);border:1px solid var(--line2)}
.fxres{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;border:1px solid var(--line2);background:var(--row)}
.fxres .fxlbl{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);font-weight:700}
.fxres.w{color:var(--good);border-color:var(--good);background:var(--good-bg)}
.fxres.l{color:var(--bad);border-color:var(--bad);background:var(--bad-bg)}
.fxres.live{color:var(--warn);border-color:var(--warn);background:var(--warn-bg)}
.fxlist.past .fx{padding:8px 14px}.fxlist.past .fxteams{font-size:17px}
.fxnote{margin:4px 0 0}
@media (max-width:640px){
  .fxs{margin-bottom:16px}
  .fxs h2{font-size:19px}.fxs h2 .small{display:none}
  .fxlist{grid-template-columns:1fr;gap:8px}
  .fx{padding:8px 12px;gap:2px 10px}
  .fxteams{font-size:18px}.fxs-sc{font-size:22px}
  .fxlist.past .fxmeta,.fxlist.past .fxloc{display:none}
  .fx .fxmeta span:nth-child(3){display:none}
  .fxnote{font-size:12px}
}

/* ---------- waffle: one square per called player (filled blue = also an RPIX pick, outline = not, gold = RPIX pick left out) ---------- */
.wf{stroke-width:2}
.wf-both{fill:var(--blue);stroke:var(--blue)}
.wf-called{fill:transparent;stroke:var(--muted)}
:root{--gfill:#e8b931;--gline:#e8b931}
:root[data-theme=light]{--gfill:#f2c230;--gline:#9a6f00}
@media (prefers-color-scheme:light){:root:not([data-theme]){--gfill:#f2c230;--gline:#9a6f00}}
.wf-gold{fill:var(--gfill);stroke:var(--gline)}
.waffle{display:block;width:100%;max-width:340px;height:auto;max-height:230px}
.wflegend{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:4px 16px;font-size:12.5px;color:var(--ink2)}
.wflegend li{display:inline-flex;align-items:center;gap:6px}
.wflegend svg{flex:none}
/* lead picture on /convocatorias, /seleccion and the camp page */
.leadpic{display:grid;grid-template-columns:auto minmax(220px,340px) minmax(0,1fr);gap:18px 32px;align-items:center}
.lp-num{min-width:0}
.lp-pct{margin:0;line-height:.9}
.lp-pct strong{font:800 clamp(72px,9vw,120px)/.9 var(--disp);color:var(--blue-hi);letter-spacing:-1px}
.lp-sub{margin:6px 0 0;color:var(--ink2);font-weight:600;max-width:22ch}
.lp-pic{min-width:0}
.lp-txt{display:grid;gap:10px;align-content:center;justify-items:start}
.lp-lead{margin:0;font-size:18px;font-weight:600;max-width:34ch}
.tipd summary{cursor:pointer;color:var(--blue-hi);font-weight:600;font-size:13px;min-height:44px;display:flex;align-items:center}
.tipd[open]>p{margin:0 0 8px}
.tipi{position:absolute;top:2px;right:2px}
.tipi summary{width:44px;height:44px;justify-content:center;font:italic 700 15px var(--disp);color:var(--muted)}
.tipi[open]{z-index:3;background:var(--card);border:1px solid var(--line2);border-radius:10px;padding:0 12px 6px;right:2px;left:2px;top:2px}
.tipi[open] summary{float:right}
.seltiles .stat,.calltiles .stat{position:relative}
.howmade{padding:0 18px}.howmade summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:600;color:var(--ink2)}.howmade[open]{padding-bottom:10px}
@media (max-width:860px){.leadpic{grid-template-columns:auto minmax(0,1fr)}.lp-txt{grid-column:1/-1}}
@media (max-width:520px){.leadpic{grid-template-columns:1fr;gap:12px}.lp-pct strong{font-size:84px}.lp-sub{max-width:none}.waffle{max-width:300px}}
/* camp page */
.campopen{margin:0 0 16px}
.gatemsg{margin:0 0 16px}
.chiprow{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.sharelist{margin:0;padding-left:0;list-style:none;display:grid;gap:4px}
.sharelist a{display:inline-flex;align-items:center;min-height:44px;font-weight:600}
.chiprow .chip{min-height:44px;display:inline-flex;align-items:center}
.histsvg{display:block;width:100%;max-width:560px;height:auto;overflow:visible}
.histsvg .hb-hit{fill:transparent}
.histsvg .hb-bar{fill:var(--line2)}
.histsvg .hb.cur .hb-bar{fill:var(--blue)}
.histsvg .hb:hover .hb-bar,.histsvg .hb:focus-visible .hb-bar{fill:var(--blue-hi)}
.histsvg .hb-v{fill:var(--ink);font:800 16px var(--disp)}
.histsvg .hb-l{fill:var(--ink2);font:600 11.5px var(--sans)}
.histsvg a:focus-visible{outline:2px solid var(--blue-hi)}
/* announced squad */
.annsq h2{margin-bottom:6px}
.lede2{margin:0 0 14px;color:var(--ink2);max-width:75ch}
.annrow{display:flex;flex-wrap:wrap;gap:16px 36px;align-items:center;margin:0 0 12px}
.annnum{display:grid;gap:4px;max-width:30ch}
.annnum strong{font:800 clamp(56px,7vw,84px)/.9 var(--disp);color:var(--blue-hi)}
.annnum span{font-weight:600;color:var(--ink2)}
.annpic{min-width:220px}
.annstat{margin:6px 0;font-size:16px}
.annh3{font:700 13px/1.2 var(--sans);text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:16px 0 6px}
.annweak,.goldlist{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:0 18px}
.annweak li,.goldlist li{display:flex;flex-wrap:wrap;align-items:center;gap:0 8px;min-height:44px;border-bottom:1px solid var(--line)}
.annweak a,.goldlist a{display:inline-flex;align-items:center;min-height:44px}
.goldlist .goldname{color:var(--pick);font-weight:600}
.annlbl{margin:14px 0 0;padding:8px 12px;border-left:4px solid var(--pick);background:var(--pick-bg)}
/* pitch graphic (signature C): two pitches side by side on wide screens, stacked on phones; dark and light through the tokens */
.pitchleg{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:var(--ink2)}
.pitchleg li::before{content:"";display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:6px;vertical-align:-1px;border:2px solid transparent}
.pitchleg .lg-both::before{background:var(--blue);border-color:var(--blue)}
.pitchleg .lg-called::before{border-color:var(--ink2)}
.pitchleg .lg-gold::before{background:var(--gfill);border-color:var(--gline)}
.pitchleg .lg-grey::before{background:var(--track);border:2px dashed var(--muted)}
.pitches{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 28px}
.pitches figure{margin:0;min-width:0}
.pitches figcaption{font:700 18px/1.2 var(--disp);margin:0 0 6px;letter-spacing:.3px}
.pitch{display:block;width:100%;height:auto;max-width:460px;margin-inline:auto}
.pitch-turf{fill:var(--bg2)}
.pitch-line{fill:none;stroke:var(--line2);stroke-width:1.5}
.pitch-turf+.pitch-line{stroke-width:2}
.pn a,.pitch a{outline:none}
.pn-dot{stroke-width:3}
.pn-both .pn-dot{fill:var(--blue);stroke:var(--blue)}
.pn-called .pn-dot{fill:var(--card);stroke:var(--ink2)}
.pn-gold .pn-dot{fill:var(--gfill);stroke:var(--gline)}
.pn-grey .pn-dot{fill:var(--track);stroke:var(--muted);stroke-dasharray:3 3}
.pn-name{fill:var(--ink);font:600 11.5px var(--sans);paint-order:stroke;stroke:var(--bg2);stroke-width:3px;stroke-linejoin:round}
.pn-grey .pn-name{fill:var(--muted)}
.pn-grp{fill:var(--muted);font:700 10px var(--sans);letter-spacing:.8px}
.pitch a:focus-visible .pn-dot,.pitch a:hover .pn-dot{stroke:var(--ink);stroke-width:4}
.pitchlist h4{font:700 13px/1.2 var(--sans);text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:12px 0 4px}
.pitchlist ul{margin:0;padding-left:18px}.pitchlist li{margin:2px 0}.pitchlist li.pl-gold a{color:var(--pick);font-weight:600}
@media (max-width:760px){.pitches{grid-template-columns:1fr}}
/* scatter on touch: a tapped dot shows its name; phones get a vertical dot list instead */
.selsvg .pt.on .lbl{opacity:1}.selsvg .pt.on circle{stroke:var(--ink);stroke-width:3}
.selphone{display:none}
.sellist{list-style:none;margin:0;padding:0}
.selmore summary{border-top:1px solid var(--line);padding-top:4px}
.sellist li{border-top:1px solid var(--line)}
.sellist a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 12px;align-items:center;min-height:52px;padding:6px 2px;text-decoration:none;color:var(--ink)}
.sellist .sn{font-weight:600;overflow-wrap:anywhere}
.sellist .sr1{font-variant-numeric:tabular-nums;font-weight:700;text-align:right}
.sellist .tk{grid-column:1/-1;position:relative;height:6px;border-radius:3px;background:var(--track);margin:6px 7px 8px}
.sellist .dt{position:absolute;top:-4px;width:14px;height:14px;margin-left:-7px;border-radius:50%;box-sizing:border-box}
.sellist .dt.called{background:var(--blue);border:2px solid var(--card)}
.sellist .dt.uncalled{background:var(--card);border:2px solid var(--muted)}
.sellist .q0{left:0%}.sellist .q1{left:5%}.sellist .q2{left:10%}.sellist .q3{left:15%}.sellist .q4{left:20%}.sellist .q5{left:25%}.sellist .q6{left:30%}.sellist .q7{left:35%}.sellist .q8{left:40%}.sellist .q9{left:45%}.sellist .q10{left:50%}.sellist .q11{left:55%}.sellist .q12{left:60%}.sellist .q13{left:65%}.sellist .q14{left:70%}.sellist .q15{left:75%}.sellist .q16{left:80%}.sellist .q17{left:85%}.sellist .q18{left:90%}.sellist .q19{left:95%}.sellist .q20{left:100%}
@media (max-width:640px){
  .selchart .selscroll,.selchart .selleg .lg{display:none}
  .selchart .selleg .muted{display:block}
  .selphone{display:block}
  table.sel{min-width:0}
  table.sel tr:not(.cutline):not(.nbrow)>:nth-child(n+5),table.sel tr:not(.cutline):not(.nbrow)>:nth-child(3){display:none}   /* phones: player, called, RPIX; the rest is in the dot list above and on the player page */
  table.sel td,table.sel th{white-space:normal}
  table.sel .cb{white-space:nowrap}
  table.sel td.c-name,table.sel th:first-child{min-width:150px}
}
.pn-hit{fill:transparent;stroke:none}
.pitchlist li{min-height:44px;display:flex;flex-wrap:wrap;align-items:center;gap:0 8px}.pitchlist li a{display:inline-flex;align-items:center;min-height:44px}

/* ---------- country switcher (header) ---------- */
.cswitch{position:relative}
.cswitch>summary{list-style:none;cursor:pointer}
.cswitch>summary::-webkit-details-marker{display:none}
.cswitch .caret{opacity:.8;transition:transform .15s}
.cswitch[open] .caret{transform:rotate(180deg)}
.cswitch .cpill{max-width:190px}
.cmenu{position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:220px;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line2);border-radius:12px;padding:6px;box-shadow:0 12px 32px rgba(0,0,0,.4)}
.cmenu a,.cmenu .cm-off{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 12px;border-radius:8px;color:var(--ink);text-decoration:none;font:600 14px var(--sans)}
.cmenu a:hover{background:var(--row)}
.cmenu a[aria-current]{background:var(--blue-bg);color:var(--ink)}
.cmenu .cm-off{color:var(--muted);cursor:default}
.cmenu .cm-off em{margin-left:auto;font:600 11px var(--sans);font-style:normal;text-transform:uppercase;letter-spacing:.6px}
.cmenu .cm-all{border-top:1px solid var(--line);border-radius:0 0 8px 8px;margin-top:4px;color:var(--ink2)}
.mbar .cswitch .cmenu{position:fixed;left:var(--pad);right:var(--pad);top:60px;min-width:0}
.mbar .cswitch .cpill{max-width:150px}
@media (min-width:900px){.mbar .cswitch{display:none}}
@media (max-width:899px){.tools .cswitch{display:none}}

/* ---------- country picker ---------- */
.ccards{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ccards.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:700px){.ccards,.ccards.n3{grid-template-columns:1fr}}
.ccard{display:flex;align-items:center;gap:16px;min-height:112px;padding:18px 20px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);color:var(--ink);text-decoration:none;position:relative}
a.ccard:hover{border-color:var(--blue);background:var(--row)}
.ccard .cc-flag .cflag{width:64px;height:48px;border-radius:4px}
.ccard .cc-body{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.ccard h4{margin:0;font:700 28px/1.1 var(--disp)}
.ccard .cc-n{color:var(--ink2);font-size:14px}
.ccard .cc-top{font-size:14px;overflow-wrap:anywhere}
.ccard .cc-rpix{font-weight:700;color:var(--blue-hi)}
.ccard .tc-go{flex:none;color:var(--blue-hi)}
.ccard.soon{opacity:.72;border-style:dashed;box-shadow:none}
.cc-continue{margin:0 0 6px}

/* ---------- pagination ---------- */
.pgbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 18px;margin:10px 0}
.pgbar:empty{display:none}
.pgsize{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.pgsize .lbl{font-size:13px;color:var(--muted);margin-right:4px}
.pager{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-inline:auto}
.pgn,.pgb{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 10px;border:1px solid var(--line2);border-radius:10px;color:var(--ink2);text-decoration:none;font:600 14px var(--sans)}
a.pgn:hover,a.pgb:hover{background:var(--row);color:var(--ink)}
.pgn.on{background:var(--btn);border-color:var(--btn);color:#fff}
.pgb.off{opacity:.4}
.pgg{padding:0 4px;color:var(--muted)}
@media (max-width:640px){.pgt{display:none}.pgn.far{display:none}.pager{margin-inline:0}}
.cn-short{display:none}
.mbar .cswitch{min-width:0;flex:0 1 auto}.mbar .cswitch .cpill{max-width:124px;padding:0 9px}.mbar .cswitch .cpill span{min-width:0}
/* ==================== Per-country accent (from the flags) ==================== */
/* Tokens: --accent borders, bars, underlines (>=3:1); --accent-hi small text (>=4.5:1); --accent-bg pill fill; --accent-btn button fill under white text (>=4.5:1). Checked for both themes. */
:root{--accent:var(--blue);--accent-hi:var(--blue-hi);--accent-bg:var(--blue-bg);--accent-btn:var(--btn)}
[data-country=sv]{--accent:#1B5EDB;--accent-hi:#4280F2;--accent-bg:#101A2E;--accent-btn:#1450C4}
[data-country=gt]{--accent:#4997D0;--accent-hi:#63A9DB;--accent-bg:#13213A;--accent-btn:#2D74B0}
:root[data-theme=light] [data-country=sv],:root[data-theme=light][data-country=sv]{--accent:#0F47AF;--accent-hi:#0A3690;--accent-bg:#DCE7F7;--accent-btn:#0F47AF}
:root[data-theme=light] [data-country=gt],:root[data-theme=light][data-country=gt]{--accent:#4088C2;--accent-hi:#2A6FAA;--accent-bg:#E8F0FA;--accent-btn:#2F79B8}
@media (prefers-color-scheme:light){
  :root:not([data-theme]) [data-country=sv],:root:not([data-theme])[data-country=sv]{--accent:#0F47AF;--accent-hi:#0A3690;--accent-bg:#DCE7F7;--accent-btn:#0F47AF}
  :root:not([data-theme]) [data-country=gt],:root:not([data-theme])[data-country=gt]{--accent:#4088C2;--accent-hi:#2A6FAA;--accent-bg:#E8F0FA;--accent-btn:#2F79B8}
}

/* ---------- flag stripe under the header ---------- */
.fstripe{height:4px;background:var(--accent)}
[data-country=sv] .fstripe{background:linear-gradient(to bottom,#0F47AF 0 33.34%,#f4f7fb 33.34% 66.67%,#0F47AF 66.67%)}
[data-country=gt] .fstripe{background:linear-gradient(to right,#4997D0 0 33.34%,#f4f7fb 33.34% 66.67%,#4997D0 66.67%)}
:root[data-theme=light] .fstripe{opacity:.7}
@media (prefers-color-scheme:light){:root:not([data-theme]) .fstripe{opacity:.7}}
.msheet{top:calc(100% - 4px)}

/* ---------- accent on the country's own elements ---------- */
.dnav a[aria-current]{color:var(--accent-hi);border-bottom-color:var(--accent)}
.hero .eyebrow{color:var(--accent-hi);display:flex;align-items:center;gap:10px}
.hero .eyebrow .cflag{width:29px;height:22px;border-radius:4px;box-shadow:0 0 0 1px var(--line2)}
.hero-links .btn:not(.ghost){background:var(--accent-btn);border-color:var(--accent-btn);color:#fff}
.hero-links .btn:not(.ghost):hover{background:color-mix(in srgb,var(--accent-btn) 85%,#fff)}
.cpill{border-color:var(--accent)}
.cswitch[open] .cpill,.cpill:hover{background:var(--accent-bg);color:var(--ink)}
.topcard{border-color:var(--accent)}
.topcard::before{background:var(--accent)}
.topcard:hover{border-color:var(--accent)}
.tc-label,.tc-go{color:var(--accent-hi)}
.tc-score strong{color:var(--accent-hi)}
.topcard .bar .fg{fill:var(--accent)}
.topcard .avatar .av-bg{fill:var(--accent-bg)}.topcard .avatar .av-tx{fill:var(--accent-hi)}
.topcard .avatar-photo{background:var(--accent-bg);box-shadow:0 0 0 2px var(--accent)}

/* ---------- hero: wider headline, flag as a soft shape behind the ball ---------- */
.hero{position:relative;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);isolation:isolate}
.hero h1{max-width:none;font-size:clamp(34px,3.4vw,62px);line-height:1.03}
.hero::before{content:"";position:absolute;z-index:-1;right:0;top:-6%;width:min(58%,760px);aspect-ratio:4/3;border-radius:28px;opacity:.22;filter:blur(1px);
  background:var(--flagimg) center/cover no-repeat;-webkit-mask-image:radial-gradient(closest-side,#000 35%,transparent 100%);mask-image:radial-gradient(closest-side,#000 35%,transparent 100%)}
:root[data-theme=light] .hero::before{opacity:.2}
@media (prefers-color-scheme:light){:root:not([data-theme]) .hero::before{opacity:.2}}
[data-country=sv]{--flagimg:url(/assets/flags/sv.svg)}
[data-country=gt]{--flagimg:url(/assets/flags/gt.svg)}
.hero-logo{filter:drop-shadow(0 12px 30px color-mix(in srgb,var(--accent) 45%,transparent));animation-name:ff-roll-in,ff-float,ff-glow-a}
@keyframes ff-glow-a{0%,100%{filter:drop-shadow(0 12px 30px color-mix(in srgb,var(--accent) 40%,transparent))}50%{filter:drop-shadow(0 18px 44px color-mix(in srgb,var(--accent) 70%,transparent))}}
@media (max-width:860px){.hero{grid-template-columns:1fr}.hero h1{max-width:22ch}.hero::before{width:90%;right:0;opacity:.1}}
@media (max-width:640px){.hero::before{display:none}}
@media (max-width:520px){.hero-search-row{align-items:stretch}.hero-search-row .btn{padding-inline:14px}.tc-parts{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- switcher: full name on desktop, code only on very small screens; list with counts and a check ---------- */
@media (min-width:900px){.tools .cswitch .cn-long{display:inline}.tools .cswitch .cn-short{display:none}.tools .cswitch .cpill{padding:0 12px}}
@media (max-width:479px){.mbar .cswitch .cn-long{display:none}.mbar .cswitch .cn-short{display:inline}.mbar .cswitch .cpill{padding:0 10px}}
.cmenu a{gap:12px}
.cmenu .cm-name{flex:1}
.cmenu .cm-n{font:600 12px var(--sans);color:var(--muted);font-variant-numeric:tabular-nums}
.cmenu .cm-ck{visibility:hidden;color:var(--accent-hi);flex:none}
.cmenu a[aria-current] .cm-ck{visibility:visible}
.cmenu a[aria-current]{background:var(--accent-bg)}
.cmenu .cm-all .cm-ck{display:none}

/* ---------- fixtures: the country's own team in its accent colour, home or away ---------- */
.fxt.sv .fxn{font-weight:800;color:var(--accent-hi)}
.fxt.op .fxn{font-weight:500}
.fxha{display:inline-block;padding:1px 8px;border:1px solid var(--line2);border-radius:999px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--ink2)}
.fxha.h{border-color:var(--accent);color:var(--accent-hi)}
.fxcd{background:var(--accent-bg);color:var(--accent-hi)}
.fxs-sc{color:var(--accent-hi)}

/* ---------- picker cards ---------- */
a.ccard{overflow:hidden}
a.ccard::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--accent)}
a.ccard[data-country=sv]::before{background:linear-gradient(to bottom,#0F47AF 0 33.34%,#f4f7fb 33.34% 66.67%,#0F47AF 66.67%)}
a.ccard[data-country=gt]::before{background:linear-gradient(to right,#4997D0 0 33.34%,#f4f7fb 33.34% 66.67%,#4997D0 66.67%)}
a.ccard:hover{border-color:var(--accent);background:var(--row)}
.ccard .cc-rpix,.ccard .tc-go{color:var(--accent-hi)}

/* ---------- front page: account block, figures, next matches, about (neutral colours) ---------- */
.pcacct{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;margin:22px 0}
.pcacct h2{margin:0 0 4px;font-size:26px}.pcacct p{margin:0}
.pcacts{display:flex;flex-wrap:wrap;gap:10px}
.pcfig{margin:0 0 24px}
.pcfig h2,.pcnext h2{font-size:24px;margin:0 0 10px}
.pcfig td,.pcfig th{vertical-align:middle}
.pcfig tr[data-country] .pl{color:var(--ink)}
.pcnext{margin:0 0 24px}
.pcabout{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px;margin:0 0 28px}
.pcabout .card h2{font-size:22px;margin:0 0 8px}
.pcabout .card p{margin:0 0 8px}
@media (max-width:640px){.pcacct h2{font-size:22px}.pcacts .btn{flex:1;justify-content:center;min-height:44px}}
@media (min-width:900px) and (max-width:1349px){.top .dnav a{padding:8px 4px;font-size:13px}.bar-row{gap:8px 8px}.tools{gap:8px}.tools .cswitch .cpill{padding:0 9px}}

/* ---------- front page v2: analytics intro, pillars, choose a country ---------- */
.fp-intro{margin:6px 0 18px;max-width:980px}
.fp-intro .eyebrow{color:var(--blue-hi)}
.fp-intro h1{font-size:clamp(34px,4vw,60px);line-height:1.03;margin:0 0 14px;max-width:24ch}
.fp-intro .lede{font-size:clamp(16px,1.25vw,19px);line-height:1.55;max-width:74ch;color:var(--ink2);margin:0}
.pillars{list-style:none;margin:20px 0 30px;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.pil{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow)}
.pil .pi{color:var(--blue-hi);margin-bottom:6px}
.pil h3{margin:0 0 6px;font:700 22px/1.1 var(--disp)}
.pil p{margin:0 0 6px;font-size:14px;color:var(--ink2)}
@media (max-width:1000px){.pillars{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.pillars{grid-template-columns:1fr}}
.choose{margin:0 0 28px}
.choose>h2{font-size:34px;margin:0 0 4px}
.rgh0{font:700 13px/1 var(--sans);text-transform:uppercase;letter-spacing:1.4px;color:var(--muted);margin:18px 0 8px}
.rgh{font:700 20px/1.1 var(--disp);color:var(--ink2);margin:14px 0 8px}
.stiles{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:10px}
.stiles.c5{grid-template-columns:repeat(5,minmax(0,1fr))}
.stiles.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.stiles.c1{grid-template-columns:minmax(0,calc(20% - 8px))}
.stile{display:flex;align-items:center;gap:10px;min-height:48px;padding:6px 12px;border:1px dashed var(--line2);border-radius:10px;background:transparent;color:var(--muted);font:600 14px var(--sans)}
.stile .cflag{opacity:.75;flex:none}
@media (max-width:760px){.stiles.c1{grid-template-columns:1fr}.stiles.c5,.stiles.c4{grid-template-columns:repeat(2,minmax(0,1fr))}.stiles.odd.c5{grid-template-columns:1fr}}
.pcfig th[scope=row]{text-transform:none;letter-spacing:0;font-size:inherit;font-weight:600;color:var(--ink)}
.cmenu{max-height:min(75vh,640px);overflow-y:auto}
.cmenu .cm-h{margin:8px 12px 2px;padding-top:8px;border-top:1px solid var(--line);font:700 11px var(--sans);text-transform:uppercase;letter-spacing:1.2px;color:var(--muted)}
.cmenu .cm-r{margin:6px 12px 0;font:700 12px var(--sans);color:var(--ink2)}
.cmenu .cm-off{min-height:34px;opacity:.7;font-weight:500}

/* front-page about cards: 5 boxes, never one alone on a row */
@media (min-width:1200px){.pcabout{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media (min-width:640px) and (max-width:1199px){.pcabout{grid-template-columns:repeat(2,minmax(0,1fr))}.pcabout>.card:last-child{grid-column:1/-1}}
@media (max-width:639px){.pcabout{grid-template-columns:1fr}}

/* coming soon: Centroamérica 4, Caribe 9 (3 x 3), México one tile the width of a Centroamérica tile */
.stiles.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.stiles.c1{grid-template-columns:minmax(0,calc(25% - 8px))}
@media (max-width:760px){.stiles.c3{grid-template-columns:repeat(2,minmax(0,1fr))}.stiles.c3.odd>li:last-child{grid-column:1/-1}.stiles.c1{grid-template-columns:1fr}}

/* ---------- refinement 2026-10-03: smaller type, the point first ---------- */
body{font-size:14px;line-height:1.5}
.small{font-size:12px}.nc{font-size:12px}
.bar-row{min-height:56px}
.logo{width:40px;height:40px}
.wm{font-size:28px}
.dnav a{padding:6px 10px;font-size:13px}
main{padding-top:20px;padding-bottom:32px}
h1{font-size:clamp(28px,3.6vw,42px);line-height:1.04;margin-bottom:10px}
h2{font-size:20px;margin-bottom:10px}
.eyebrow{font-size:11px;letter-spacing:1.4px;margin-bottom:8px}
.lede{font-size:15px;line-height:1.5;color:var(--ink2);max-width:70ch;margin-bottom:12px}
.card{padding:16px 18px;margin-bottom:14px}
.fp-intro{border-left:3px solid var(--blue);padding-left:16px}
.fp-intro h1{max-width:34ch}
.pillars{margin:16px 0 24px;gap:10px;counter-reset:pil}
.pil{padding:12px 14px;border-radius:10px;border-top:2px solid var(--blue);position:relative}
.pil h3{font-size:18px;margin-bottom:4px}
.pil p{font-size:12.5px;line-height:1.45;margin-bottom:4px}
.pil .pi{margin-bottom:4px}
.pil .pi svg{width:18px;height:18px}
@media (max-width:760px){.pillars{grid-template-columns:repeat(2,minmax(0,1fr))}.wm{font-size:24px}}

/* proof strip + collapsed coming-soon */
.proof{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--line);border-radius:10px;background:var(--card);overflow:hidden}
.proof li{flex:1 1 140px;padding:10px 14px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.proof li:last-child{border-right:0}
.proof strong{font:700 22px/1 var(--disp);color:var(--ink);letter-spacing:.2px}
.proof span{font-size:11.5px;color:var(--muted)}
.soonbox{margin-top:14px}
.soonbox>summary{cursor:pointer;font:700 11px/1 var(--sans);text-transform:uppercase;letter-spacing:1.4px;color:var(--muted);padding:8px 0;list-style:revert}
.soonbox>summary:hover{color:var(--ink)}
@media (max-width:760px){.proof li{flex-basis:45%;border-bottom:1px solid var(--line)}}

/* refinement 2026-10-03 b */
:root{--t-xs:11.5px;--t-sm:12.5px;--t-md:14px;--t-lg:18px;--t-xl:22px;--t-h1:clamp(26px,3vw,36px)}
/* P1 type scale */
h2{font-size:var(--t-xl)}
.choose>h2,.pcfig h2,.pcnext h2,.pcabout .card h2{font-size:var(--t-xl)}
.fxs h2{font-size:var(--t-xl)}
.small,.nc,td .sub,.ntb .sub{font-size:var(--t-sm)}
.proof span{font-size:var(--t-sm)}
/* P2 + P10 page head grammar: eyebrow, h1, 14px lede; no left rule on either page */
.fp-intro{border-left:0;padding-left:0}
.fp-intro .eyebrow,.hero .eyebrow{font-size:var(--t-xs);letter-spacing:1.2px}
.fp-intro h1,.hero h1{font-size:var(--t-h1);line-height:1.1}
.fp-intro h1{max-width:40ch}
.fp-intro .lede,.hero .lede{font-size:var(--t-md);line-height:1.55;max-width:92ch}
.lede-key{display:block;margin-top:6px;color:var(--ink);font-weight:600}
/* P3 proof strip */
.proof strong{font-size:20px}
.proof li:nth-child(n+4) strong{font:600 14px/1.2 var(--sans)}
.proof li:nth-child(n+4){padding-top:16px}
.proof li.pf-link{padding:0}
.proof li.pf-link a{display:flex;flex-direction:column;gap:2px;padding:10px 14px;height:100%;box-sizing:border-box;color:inherit;text-decoration:none}
.proof li.pf-link strong{color:var(--blue-hi);font:600 14px/1.2 var(--sans);text-decoration:underline;text-underline-offset:3px;padding-top:6px}
.proof li.pf-link a:hover strong{color:var(--ink)}
.proof li.pf-link a:focus-visible{outline:2px solid var(--blue-hi);outline-offset:-2px}
/* P4 about cards */
.pcabout{align-items:start}
.pcabout .card{padding:12px 14px}
.pcabout .card p{font-size:var(--t-sm)}
@media (min-width:1200px){.pcabout{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:640px) and (max-width:1199px){.pcabout>.card:last-child{grid-column:auto}}
/* P5 slim bars */
.pcacct{padding:10px 14px;margin:12px 0}
.pcacct h2{font-size:16px;margin:0}
.pcacct p{font-size:var(--t-sm)}
@media (max-width:640px){.pcacct h2{font-size:16px}.pcacct p{display:none}}
/* P6 ranking density */
th.c-rank,td.c-rank{width:32px;padding-right:4px}
.rk{font-size:20px}
tr.podium:first-child .rk{font-size:20px}
.rpix{font-size:18px}
.sc .bar{height:3px}
table.rank td{padding:6px 10px}
table.rank th{padding:8px 10px}
table.rank .avatar,table.rank .avatar-photo{width:28px;height:28px}
th.c-rpix,td.c-rpix{width:130px}
.sc .bar{width:100px}
td.c-nt .ntb{display:inline-flex;flex-direction:row;align-items:center;gap:6px;max-width:230px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:3px 9px;border:1px solid var(--line2);border-radius:999px;background:var(--row);font-size:var(--t-sm);cursor:help}
td.c-nt .ntb.on{border-color:var(--blue);color:var(--blue-hi)}
td.c-nt .ntb.on::before,td.c-nt .ntb.gold::before{margin:0;flex:none}
td.c-nt .ntb.gold::before{background:currentColor}
td.c-nt .ntb .sub{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (min-width:1100px){
  td.c-club{white-space:nowrap}
  td.c-club .clubname{display:inline-flex;vertical-align:middle}
  td.c-club .sub{display:inline;margin-left:8px;vertical-align:middle}
}
/* P7 country hero: the number-1 card is the focal point */
.hero::before,:root[data-theme=light] .hero::before{opacity:.06}
@media (prefers-color-scheme:light){:root:not([data-theme]) .hero::before{opacity:.06}}
.hero-logo{width:140px}
.hero .tagline{font-size:15px;color:var(--ink2);font-weight:600}
/* P8 fixtures */
.fxwhen{flex-direction:row;justify-content:flex-start;flex-wrap:wrap;align-items:baseline;column-gap:6px;min-height:0}
.fxloc{margin-top:0;padding-bottom:0;font-size:var(--t-xs)}
.fxloc:not([hidden])::before{content:"\00b7\00a0"}
.fxmeta{flex-wrap:nowrap;min-width:0}
.fxmeta>span:nth-child(3){min-width:0;flex:1 1 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fxmeta>span:nth-child(1),.fxmeta>span:nth-child(2){flex:none}
.fxres .fxlt{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;border:1.5px solid currentColor;font-weight:800;font-size:11px}
.fxres .fxlt{color:inherit;position:relative}
.fxs .fx{padding:8px 12px}
/* P9 contrast */
.stile{opacity:1;color:var(--muted)}
.cmenu .cm-off{opacity:1;color:var(--muted)}
:root[data-theme=light] [data-country=gt],:root[data-theme=light][data-country=gt]{--accent-hi:#25649C}
@media (prefers-color-scheme:light){:root:not([data-theme]) [data-country=gt],:root:not([data-theme])[data-country=gt]{--accent-hi:#25649C}}
/* P11 mobile */
@media (max-width:760px){
  .proof li{flex:1 1 30%;border-bottom:1px solid var(--line)}
  .pillars{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;padding-bottom:6px;-webkit-overflow-scrolling:touch}
  .pil{flex:0 0 78%;scroll-snap-align:start}
  .pcfig table.plain,.pcfig table.plain tbody,.pcfig table.plain tr,.pcfig table.plain th,.pcfig table.plain td{display:block}
  .pcfig table.plain thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .pcfig table.plain tr{padding:8px 0;border-bottom:1px solid var(--line)}
  .pcfig table.plain th[scope=row],.pcfig table.plain td{border:0;padding:2px 0;text-align:left}
  .pcfig table.plain td[data-l]{display:flex;justify-content:space-between;gap:12px}
  .pcfig table.plain td[data-l]::before{content:attr(data-l);color:var(--muted);font-size:var(--t-sm)}
  .chip{min-height:40px}
}
@media (hover:hover) and (pointer:fine){table.rank .rpix-btn{min-height:26px}table.rank .sc{gap:2px}}

/* home v2 2026-10-03 */
.hv-hero{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;align-items:start;margin:6px 0 34px}
.hv-intro{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:start}
.hv-actions{min-width:0}
.hv-actions .proof{margin:0 0 14px}
.hv-actions .cc-continue{margin-bottom:0}
@media(min-width:1000px){.hv-intro{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:56px}}
.hv-copy .eyebrow{color:var(--blue-hi)}
.hv-copy h1{font-size:var(--t-h1);line-height:1.08;margin:0 0 16px;max-width:30ch;text-wrap:balance}
.hv-copy h1 .hv-accent{display:block;margin-top:4px}
.hv-accent{color:var(--blue-hi)}
.hv-copy .lede{font-size:var(--t-md);line-height:1.55;color:var(--ink2);margin:0 0 16px;max-width:60ch}
.hv-trust{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:8px}
.hv-trust li{display:flex;gap:10px;align-items:flex-start;font-size:var(--t-md);font-weight:600;color:var(--ink)}
.hv-trust svg{flex:none;color:var(--good);margin-top:1px}
.hv-copy .proof{margin:0 0 14px}
.hv-pick>h2{margin:0 0 12px}
.hv-cards{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.hv-cards>li{display:flex;min-width:0}
.hv-cards .hvc{width:100%;box-sizing:border-box}
.hv-cards .hvc-foot{margin-top:auto}
@media(min-width:1100px){.hv-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.hvc-head{align-items:flex-start;min-height:80px}.hvc-go{align-self:center}}
a.ccard.hvc{display:flex;flex-direction:column;align-items:stretch;gap:12px;min-height:0;padding:20px 18px 14px;border-radius:12px}
.hvc-head{display:flex;align-items:center;gap:12px}
.hvc .cc-flag .cflag{width:43px;height:32px;border-radius:3px}
.hvc-title{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.hvc h3{margin:0;font:700 24px/1.1 var(--disp)}
.hvc-go{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-sm);font-weight:700;color:var(--accent-hi);min-height:44px;white-space:nowrap}
.hvc-go svg{width:16px;height:16px}
.top3{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--line)}
.top3 li{display:grid;grid-template-columns:22px minmax(0,1fr) auto auto 44px;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);font-size:var(--t-md)}
.t3-rk{font:700 18px/1 var(--disp);color:var(--blue-hi)}
.t3-name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.t3-club{font-size:var(--t-sm);color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:150px}
.t3-rpix{font:700 20px/1 var(--disp);text-align:right;font-variant-numeric:tabular-nums}
.top3 .pchip{min-width:30px}
.top3 .p-GK{background:var(--warn-bg);border-color:var(--warn)}.top3 .p-DF{background:var(--good-bg);border-color:var(--good)}.top3 .p-MF{background:var(--blue-bg);border-color:var(--blue-hi)}.top3 .p-FW{background:var(--bad-bg);border-color:var(--bad)}
.hvc-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 14px;font-size:var(--t-sm);color:var(--muted)}
.hvc-foot strong{color:var(--ink2)}
.hvc-breakdown{display:grid;gap:5px;padding:9px 0;border-bottom:1px solid var(--line)}
.hvc-breakdown-title{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.hvc-partgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.hvc-partgrid span{display:grid;text-align:center;gap:2px}
.hvc-partgrid small{font-size:9px;line-height:1.15;color:var(--muted);overflow:hidden;text-overflow:ellipsis}
.hvc-partgrid strong{font-size:13px;color:var(--ink)}
.fxstates{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.fxstates li{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:center;gap:8px 10px;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:var(--card)}
.fxstates li span{color:var(--muted);font-size:13px}
@media(max-width:620px){.fxstates li{grid-template-columns:auto 1fr}.fxstates li span{grid-column:1/-1}.hvc-partgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.hv-soonrow{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:14px 0 0;font-size:var(--t-sm)}
.hv-sf{display:inline-flex;gap:6px}
.hv-more{font-weight:700;color:var(--ink2)}
.hv-soonrow a{display:inline-flex;align-items:center;min-height:44px;font-weight:700}
.hv-sec{border-top:1px solid var(--line);padding:30px 0;margin:0}
.hv-sec h2{margin:0 0 10px}
.hv-calc,.hv-soon{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:24px 56px;align-items:start}
.hv-calc .eyebrow{color:var(--blue-hi)}
.hv-btns{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:center;margin:14px 0 0}
.btn.light{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.btn.light:hover{background:var(--ink2);color:var(--bg)}
.hv-formula{padding:20px}
.hv-eq{display:block;font:600 15px/1.5 ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:var(--ink2);background:var(--formula-bg);border:1px solid var(--line);border-radius:8px;padding:12px 14px;margin:0 0 14px;overflow-wrap:anywhere}
.hv-eq b{font-weight:800}
.hv-bar{display:flex;gap:3px;height:14px;border-radius:7px;overflow:hidden;margin:0 0 14px}
.hv-bar span{display:block;min-width:2px}
.hv-leg{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 16px;font-size:var(--t-sm)}
.hv-leg li{display:flex;gap:10px;align-items:flex-start}
.hv-k{flex:none;width:24px;height:24px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;font:800 13px/1 var(--sans);color:#06101f}
.hv-conf{border:1px solid var(--line2);background:var(--row);border-radius:10px;padding:12px 14px}
.hv-conf p{margin:8px 0 0;font-size:var(--t-sm);color:var(--ink2)}
.hv-meter{height:6px;border-radius:3px;background:var(--track);max-width:220px}
.hv-next h2{display:flex;flex-wrap:wrap;gap:2px 12px;align-items:baseline}
.hv-next .fxlist{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.hv-next .fx{grid-template-areas:"when stat" "teams teams" "meta meta"}
.hv-next .fxwhen time{font-weight:800;text-decoration:none}
.hv-next .fxmeta{flex-wrap:wrap}
.hv-conv{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:20px}
.hv-conv .card{margin:0;padding:22px}
.hv-conv .eyebrow{color:var(--blue-hi)}
.hv-acct .pcacts,.hv-pro .hv-btns{margin-top:14px}
.hv-pro{border-color:var(--blue);background:color-mix(in srgb,var(--blue) 9%,var(--card))}
.hv-tiles{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.hv-tiles li{display:flex;flex-direction:column;gap:4px;padding:12px;border:1px solid var(--line2);border-radius:10px;background:var(--card);font-size:var(--t-sm);color:var(--muted)}
.hv-tiles strong{font-size:var(--t-md);color:var(--ink)}
.hv-perks{margin:12px 0 0}
.hv-pills{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.hv-soon .rgh{margin:0 0 8px}
.hv-pills .stile{min-height:40px;border:1px dashed var(--line2);border-radius:999px;padding:4px 14px}
.hv-about{margin-top:6px}
@media (min-width:1200px){.hv-about{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){
  .proof li{flex-basis:30%}
  .hv-copy .proof li{flex:1 1 30%;padding:8px 10px}
  .hv-copy .proof li:nth-child(n+4){flex-basis:45%}
  .top3 li{grid-template-columns:20px minmax(0,1fr) auto 40px;gap:8px}
  .t3-club{display:none}
  .hvc-go{font-size:var(--t-xs)}
  .hv-btns .btn{min-height:44px}
}
@media (max-width:420px){.hvc-go{font-size:0;gap:0}.hvc-go svg{width:20px;height:20px}.hvc h3{font-size:22px}}
@media (max-width:420px){.hvc-go{font-size:0;gap:0}.hvc-go svg{width:20px;height:20px}.hvc h3{font-size:22px}}
.hc-R{color:var(--warn)}.hc-O{color:var(--blue)}.hc-T{color:var(--blue-hi)}.hc-M{color:var(--violet)}.hc-Y{color:var(--good)}
.hf-R{fill:var(--warn);background:var(--warn)}.hf-O{fill:var(--blue);background:var(--blue)}.hf-T{fill:var(--blue-hi);background:var(--blue-hi)}.hf-M{fill:var(--violet);background:var(--violet)}.hf-Y{fill:var(--good);background:var(--good)}
.hv-bar{display:block}.hv-bar svg{display:block;border-radius:7px}
.hv-meter{border:1px solid var(--line2)}

/* final 2026-10-03 */
/* national-team status "chose not to play": readable, no truncation, dot as well as colour */
td.c-nt .ntb.unav{max-width:none;overflow:visible;text-overflow:clip;white-space:normal;font-style:normal;color:var(--ink2);font-weight:600}
.ntb.unav{font-style:normal}
.ntb.unav::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:transparent;border:2px solid currentColor;flex:none;margin:0 6px 0 0;box-sizing:border-box}
td.c-nt .ntb.unav::before{margin:0}
/* confidence label beside the number */
.conf-w{margin-left:4px;white-space:nowrap}
.tc-conf{display:block;margin-top:6px;font-size:13px;color:var(--ink2)}
/* phone sizes restored (later blocks overrode the 370px rule) */
@media (max-width:370px){.wm{font-size:21px}.logo{width:32px;height:32px}}
/* touch targets on phones (a later rule set 40px) */
@media (max-width:760px){.chip{min-height:44px}}
/* keyboard focus */
summary:focus-visible,.chip:focus-visible,.rpix-btn:focus-visible,.ntopt:focus-visible{outline:2px solid var(--blue-hi);outline-offset:2px}
.hsearch:focus-within{outline:2px solid var(--blue-hi);outline-offset:2px}
.cform .fld input:focus-visible,.cform .fld select:focus-visible,.cform .fld textarea:focus-visible{outline:2px solid var(--blue-hi);outline-offset:1px}
/* camp pitch list sub-headings (were h4, now h3 so the heading levels do not skip) */
.pitchlist h3.plh{font:700 13px/1.2 var(--sans);text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:12px 0 4px}

/* Rules audience selector: same methodology, three reading levels */
.aud{border-color:var(--blue);background:color-mix(in srgb,var(--blue) 5%,var(--card))}
.aud>h2{margin-bottom:12px}
.audtabs{display:flex;flex-wrap:wrap;gap:8px;padding:5px;border:1px solid var(--line2);border-radius:12px;background:var(--row);width:max-content;max-width:100%;box-sizing:border-box}
.audtabs button{appearance:none;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--ink2);font:700 var(--t-sm)/1.2 var(--sans);min-height:44px;padding:9px 14px;cursor:pointer}
.audtabs button[aria-selected=true]{background:var(--btn);border-color:var(--blue-hi);color:#fff}
.audtabs button:focus-visible{outline:2px solid var(--blue-hi);outline-offset:2px}
.audpanel{margin-top:16px;padding:16px 18px;border:1px solid var(--line);border-radius:10px;background:var(--card)}
.audpanel[hidden]{display:none}
.audpanel h3{margin-top:0}
.audpanel code{display:inline-block;max-width:100%;overflow-wrap:anywhere;padding:8px 10px;border-radius:7px;background:var(--formula-bg);border:1px solid var(--line2)}
.audpanel .btn{margin:4px 6px 0 0}
@media(max-width:640px){.audtabs{width:100%;display:grid;grid-template-columns:1fr}.audtabs button{text-align:left}.audpanel{padding:14px}}

/* home v2.1 2026-10-04: region strip */
.hv-regions{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.hv-regions li{display:flex;flex-direction:column;gap:2px;padding:8px 12px;border:1px solid var(--line2);border-radius:10px;background:var(--row)}
.hv-regions strong{font-size:var(--t-sm);color:var(--ink)}
.hv-regions span{font-size:var(--t-sm);color:var(--muted)}

.lowsample{display:inline-block;margin-top:3px;padding:1px 7px;border:1px solid var(--warn);border-radius:999px;background:var(--warn-bg);color:var(--ink2);font-size:11px;font-weight:700;line-height:1.5;white-space:nowrap}

.hvc .devtag{align-self:flex-start;margin-top:3px;padding:1px 9px;border:1px solid var(--warn);border-radius:999px;background:var(--warn-bg);color:var(--ink2);font-size:12px;font-weight:700;line-height:1.5}

.posrk{display:inline-block;margin-left:6px;font:600 11px/1 var(--sans);letter-spacing:.3px;color:var(--muted)}

.simlist{list-style:none;margin:10px 0 0;padding:0}.simlist li{padding:10px 0;border-top:1px solid var(--line);line-height:1.5}.simlist li:first-child{border-top:0}.simpct{font-weight:700;margin-left:10px;color:var(--blue-hi,var(--ink))}.simhow{margin-top:12px}.simhow summary{cursor:pointer;color:var(--ink2);font-size:13px}
/* Continue with Google: one full-width secondary button and the "or" divider above the sign-up and log-in forms. */
.gsign{display:grid;gap:12px;max-width:560px;margin:0 0 16px}
.gsign .gbtn{width:100%;justify-content:center;min-height:44px;background:var(--row);border-color:var(--line2);color:var(--ink)}
.gsign .gbtn:hover{background:var(--line);color:var(--ink)}
.gsign .gbtn svg{flex:none}
.ordiv{display:flex;align-items:center;gap:12px;margin:4px 0 0;color:var(--muted);font-size:14px}
.ordiv::before,.ordiv::after{content:"";flex:1;height:1px;background:var(--line)}
/* ==================== acct: sign-up (/registro, /register) and log-in (/ingresar, /login) ==================== */
/* One centred panel: the form pane (heading, Google, divider, form) and the "what your account gives you" pane joined to it.
   Phone (<600): no panel chrome, the form sits on the page, the benefits follow as their own card.
   600-899: one panel, max 600px, benefits under the form inside the same panel.
   900+: one panel, form left, benefits right. Only existing tokens; spacing steps 4/8/12/16/20/24/32/40/48. */
.acct{max-width:1040px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr);animation:acct-rise .45s cubic-bezier(.2,.7,.2,1) both}
.acct--login{max-width:940px}
.acct-main{min-width:0}

/* head: eyebrow, h1, lede (same grammar as the other page heads, a step larger h1) */
.acct-head{margin:0 0 24px}
.acct-head .eyebrow{font-size:var(--t-xs,11.5px);letter-spacing:1.2px;margin:0 0 10px}
.acct-head h1{font-size:clamp(34px,4vw,44px);line-height:1.02;margin:0}
.acct-lede{margin:8px 0 0;color:var(--ink2);font-size:15px;line-height:1.5;max-width:46ch}

/* server notices (errors, "password changed") sit right above the Google button, inside the pane */
.acct-note{display:flex;gap:12px;align-items:flex-start;margin:0 0 20px;padding:12px 14px;border-radius:10px;font-size:14px;line-height:1.5}
.acct-note[hidden]{display:none}
.acct-note>svg{flex:none;margin-top:1px}
.acct-note ul{margin:0;padding-left:18px;display:grid;gap:4px}
.acct-note li:only-child{list-style:none;margin-left:-18px}
.acct-note p{margin:0}

/* Google: the primary path. Inverted ink (light button on dark theme, dark button on light theme) so it is the strongest element of the pane. */
.acct .gsign{max-width:none;gap:20px;margin:0 0 20px}
.acct .gsign .gbtn{min-height:52px;gap:12px;padding:12px 18px;border-radius:10px;font-size:16px;font-weight:700;background:var(--ink);border-color:var(--ink);color:var(--bg)}
.acct .gsign .gbtn:hover{background:color-mix(in srgb,var(--ink) 86%,var(--blue));border-color:color-mix(in srgb,var(--ink) 86%,var(--blue));color:var(--bg)}
.acct .gsign .gbtn svg{width:20px;height:20px}
.acct .gsign .gbtn:focus-visible{outline:2px solid var(--blue-hi);outline-offset:3px}
.acct .ordiv{margin:0;font:600 var(--t-xs,11.5px)/1 var(--sans);text-transform:uppercase;letter-spacing:1.2px;color:var(--muted)}

/* form */
.acct-form{max-width:none;gap:20px;margin:0}
.acct-row{display:grid;gap:20px}
.acct-f{display:grid;gap:8px;align-content:start;min-width:0}
.acct .fld{gap:8px}
.acct .fld>span,.acct-lbl{font:600 14px/1.3 var(--sans);color:var(--ink)}
.acct-opt{font-weight:400;color:var(--muted)}
.acct-form input[type=text],.acct-form input[type=email],.acct-form input[type=password],.acct-form select{min-height:48px;padding:12px 14px;border-radius:10px;font-size:16px;background:color-mix(in srgb,var(--bg2) 55%,var(--card));border:1px solid var(--line2);transition:border-color .15s,background .15s}
.acct-form input[type=text]:hover,.acct-form input[type=email]:hover,.acct-form input[type=password]:hover,.acct-form select:hover{border-color:var(--muted)}
.acct-form input:focus,.acct-form select:focus{outline:2px solid var(--blue-hi);outline-offset:1px;border-color:var(--blue)}
.acct-form input:user-invalid,.acct-form select:user-invalid{border-color:var(--bad)}
.acct .hint{margin:0;font-size:var(--t-sm,12.5px);line-height:1.45;color:var(--muted)}

/* password: the eye button is added by app.js (span.pwwrap + button.pwtoggle); make it a full 44px target inside the 48px field */
.acct .pwwrap input{padding-right:52px!important}
.acct .pwtoggle{width:44px;height:44px;right:2px;border-radius:8px}
.acct .pwtoggle:focus-visible{outline:2px solid var(--blue-hi);outline-offset:-2px}
.acct-reqs{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:var(--t-sm,12.5px);line-height:1.4;color:var(--muted)}
.acct-reqs li{display:flex;gap:8px;align-items:flex-start}
.acct-reqs svg{flex:none;width:16px;height:16px;margin-top:0}
.acct-reqs .ck{opacity:0;transition:opacity .15s}
.acct-reqs li.ok{color:var(--good)}
.acct-reqs li.ok .ck{opacity:1}

/* role select: native select, own chevron */
.acct-sel{position:relative;display:block}
.acct-sel select{appearance:none;-webkit-appearance:none;padding-right:44px;cursor:pointer}
.acct-sel svg{position:absolute;right:14px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--muted)}

/* checkboxes: the whole row is the target */
.acct-chk{display:flex;gap:12px;align-items:flex-start;margin:0;padding:12px 14px;min-height:48px;border:1px solid var(--line);border-radius:10px;background:var(--row);font-size:14px;line-height:1.5;color:var(--ink2);cursor:pointer}
.acct-chk input{flex:none;width:20px;height:20px;margin:1px 0 0;accent-color:var(--btn);cursor:pointer}
.acct-chk:has(input:focus-visible){outline:2px solid var(--blue-hi);outline-offset:2px}
.acct-chk:has(input:checked){border-color:var(--line2)}
.acct-chk--plain{align-items:center;border-color:transparent;background:transparent;padding:0;min-height:44px}
.acct-chk--plain input{margin:0}
.acct-chk--plain:has(input:checked){border-color:transparent}

/* submit + states */
.acct-submit{width:100%;justify-content:center;min-height:52px;border-radius:10px;font-size:16px;cursor:pointer;font-family:var(--sans)}
.acct-submit:disabled{opacity:.55;cursor:not-allowed;transform:none}
.acct-submit[aria-busy=true],.acct .gsign .gbtn[aria-busy=true]{pointer-events:none;cursor:progress;transform:none}
.acct-submit[aria-busy=true]::before,.acct .gsign .gbtn[aria-busy=true]::before{content:"";width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:acct-spin .7s linear infinite}

/* links: forgot (log-in) and the switch row at the bottom of the pane */
.acct-forgot{justify-self:end;display:inline-flex;align-items:center;min-height:44px;margin:-16px 0 -14px;font-size:14px;font-weight:600}
.acct-switch{margin:4px 0 0;padding-top:16px;border-top:1px solid var(--line);text-align:center;color:var(--muted);font-size:14px}
.acct-link{display:inline-flex;align-items:center;min-height:44px;padding-inline:4px;font-weight:700}

/* benefits pane */
.acct-side{position:relative;margin-top:32px;padding:24px 20px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,color-mix(in srgb,var(--blue-bg) 60%,var(--card)),var(--card) 70%)}
.acct-side-in{position:relative}
.acct-side h2{margin:0 0 20px;font-size:var(--t-xl,22px)}
.acct-perks{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:16px}
.acct-perks li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:14px;align-items:center;color:var(--ink);font-size:14.5px;line-height:1.45}
.acct-ic{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:var(--card);color:var(--blue-hi);border:1px solid color-mix(in srgb,var(--blue) 40%,var(--line))}
.acct-priv{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;margin:0;padding-top:16px;border-top:1px solid var(--line);font-size:var(--t-sm,12.5px);line-height:1.5;color:var(--ink2)}
.acct-priv svg{color:var(--muted);margin-top:1px}
.acct-mark{display:none;position:absolute;pointer-events:none;user-select:none}

/* 600+: one panel */
@media (min-width:600px){
  .acct{max-width:600px;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow),0 24px 60px -32px rgba(0,0,0,.45)}
  .acct-main{padding:36px 40px 28px}
  .acct-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .acct-side{margin:0;border:0;border-top:1px solid var(--line);border-radius:0 0 15px 15px;padding:28px 40px 32px}
}
/* 900+: form left, benefits right */
@media (min-width:900px){
  .acct{max-width:1040px;grid-template-columns:minmax(0,1fr) minmax(300px,380px);margin-top:12px}
  .acct--login{max-width:940px}
  .acct-main{padding:44px 52px 36px}
  .acct-side{border-top:0;border-left:1px solid var(--line);border-radius:0 15px 15px 0;padding:44px 36px;clip-path:inset(0 round 0 15px 15px 0);overflow:clip}
  .acct-side h2{margin-bottom:24px}
  .acct-perks{gap:20px;margin-bottom:28px}
  .acct-side-in{position:sticky;top:104px}
  .acct-mark{display:block;width:240px;height:240px;right:-56px;bottom:-56px;opacity:.07}
}
@keyframes acct-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes acct-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.acct{animation:none}.acct-submit[aria-busy=true]::before,.acct .gsign .gbtn[aria-busy=true]::before{animation:none;border-right-color:currentColor;opacity:.6}}
.cform input[type=text],.cform input[type=email],.cform input[type=url],.cform input[type=search],.cform select{min-height:48px;padding:12px 14px;border-radius:10px;font-size:16px}
.cform .btn{min-height:48px}
/* Home hero 2026-10: bigger headline, live-country chips, proof line and primary button under the lede */
.hv-copy h1{font-size:clamp(30px,8vw,40px);line-height:1.05;max-width:none}
@media (min-width:760px){.hv-copy h1{font-size:clamp(40px,3.6vw,60px)}}
.hv-proofline{margin:0 0 16px;font-size:var(--t-md);font-weight:700;color:var(--ink)}
.hv-live{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.hv-chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px 0 12px;border:1px solid var(--line2);border-radius:999px;background:var(--card);color:var(--ink);font-size:var(--t-md);font-weight:700;text-decoration:none}
.hv-chip:hover{border-color:var(--blue-hi);background:var(--row);color:var(--ink)}
.hv-chip:focus-visible{outline:2px solid var(--blue-hi);outline-offset:2px}
.hv-chip .cflag{border-radius:2px}
.hv-livesoon{font-size:var(--t-sm);color:var(--muted);padding-left:4px}
.hv-cta{margin:0}
.hv-cta .btn{min-height:48px;padding-inline:24px;font-size:16px}
/* the proof grid beside it already says the same numbers, so the proof line is for narrow screens only */
@media (min-width:760px){.hv-proofline{display:none}}
.hv-actions .hv-trust{margin-top:14px}
/* trust ticks: a tidy list under the search; one row only where the column is wide enough for three items */
@media (min-width:1000px){
  .hv-intro{align-items:center}
  .hv-actions .hv-trust li{font-size:var(--t-sm);align-items:center}
  .hv-actions .hv-trust svg{margin-top:0}
  /* proof grid: 3 stats then the date on its own full row, no stray divider after the third */
  .hv-actions .proof li{flex:none;border-right:1px solid var(--line)}
  .hv-actions .proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .hv-actions .proof li:nth-child(3n),.hv-actions .proof li:last-child{border-right:0}
  .hv-actions .proof li:nth-child(n+4){grid-column:1/-1;border-top:1px solid var(--line);padding-top:10px}
}
@media (min-width:1200px){
  .hv-actions .hv-trust{display:flex;flex-wrap:wrap;gap:8px 22px;margin:14px 0 18px}
}
@media (prefers-reduced-motion:reduce){.hv-chip,.hv-cta .btn{transition:none}}
@media (min-width:1500px){.hv-actions{max-width:640px;justify-self:end;width:100%}}