/* Soccer chrome — a per-sport copy of nba_fan_app/static/nba/chrome.css
   (chrome is deliberately duplicated per sport, like season.py). Driven by
   the same --team-* variables, emitted here by partials/_theme.html from
   leagues_config league palettes (club palettes arrive in soccer2). */

/* ── App shell ─────────────────────────────────────────────────────────── */
.app{display:grid;grid-template-columns:248px 1fr;min-height:100vh;}
.main{padding:22px 28px 40px;display:flex;flex-direction:column;gap:18px;min-width:0;flex:1;}

/* Atmosphere: league radial tint + the PITCH GREEN wash + mown stripes +
   film grain. The second radial is the sport's own colour, exactly as the
   NHL puts ice-cyan there (rgba(79,208,230,.06)) and reads blue; here it is
   grass green so every soccer page reads green whatever the league accent. */
body.chromed{
  background:
    radial-gradient(1200px 700px at 78% -10%, var(--team-primary-a18), transparent 60%),
    radial-gradient(900px 600px at -5% 110%, rgba(74,222,128,0.09), transparent 60%),
    var(--bg-0);
}
/* Mown pitch stripes — the soccer answer to the NHL/NBA crosshatch grid.
   Deliberately faint: it should read as groundskeeping under the content,
   not as a pattern competing with it. */
body.chromed::before{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:repeating-linear-gradient(90deg,
    rgba(74,222,128,0.016) 0 96px, transparent 96px 192px);
  -webkit-mask-image:radial-gradient(ellipse at 50% 35%, #000 25%, transparent 78%);
  mask-image:radial-gradient(ellipse at 50% 35%, #000 25%, transparent 78%);
}
body.chromed::after{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.35;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.35'/%3E%3C/svg%3E");
}
.app{position:relative;z-index:1;}

/* ── Scrollbars ─────────────────────────────────────────────────────────
   The OS default is a bright slab against this dark chrome. Thin, dark,
   and tinted with the active team/league accent on hover so scrollable
   panels read as part of the page. Firefox gets the standard properties;
   WebKit/Blink the pseudo-elements. */
.chromed *{scrollbar-width:thin;
  scrollbar-color:rgba(232,235,230,0.16) transparent;}
.chromed *::-webkit-scrollbar{width:10px;height:10px;}
.chromed *::-webkit-scrollbar-track{background:transparent;}
.chromed *::-webkit-scrollbar-thumb{
  background:rgba(232,235,230,0.14);border-radius:999px;
  border:3px solid transparent;background-clip:content-box;}
.chromed *::-webkit-scrollbar-thumb:hover{
  background:var(--team-accent-a30);background-clip:content-box;}
.chromed *::-webkit-scrollbar-corner{background:transparent;}

/* ── League switcher (shared anatomy with the NHL/NBA sidebars) ─────────── */
.brand-switch{position:relative;}
button.brand-link{width:100%;background:none;border:0;
  padding:6px 10px 22px;border-bottom:1px solid var(--line);margin-bottom:18px;
  color:inherit;font:inherit;text-align:left;cursor:pointer;
  opacity:1;transition:opacity .2s;}
button.brand-link:hover{opacity:.8;}
.brand-switch-panel{
  position:absolute;top:calc(100% - 10px);left:0;right:0;z-index:60;
  background:linear-gradient(180deg,#0F1A14,#0A1210);
  border:1px solid var(--line-strong);
  border-radius:14px;padding:6px;
  box-shadow:0 18px 40px rgba(0,0,0,.55);}
.lsw-row{display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;text-decoration:none;color:#fff;}
.lsw-row:hover{background:rgba(255,255,255,.06);}
.lsw-txt{min-width:0;}
.lsw-name{display:block;font-family:'Inter Tight',sans-serif;font-weight:800;font-size:12.5px;letter-spacing:.04em;text-transform:uppercase;line-height:1.1;}
.lsw-sub{display:block;font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.20em;text-transform:uppercase;margin-top:2px;}
.lsw-sub--nhl{color:#4FD0E6;}
.lsw-sub--nba{color:#F59E0B;}
.lsw-sub--soccer{color:#4ADE80;}
.lsw-dot{margin-left:auto;width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.lsw-dot--nhl{background:#4FD0E6;box-shadow:0 0 8px rgba(79,208,230,.6);}
.lsw-dot--nba{background:#F59E0B;box-shadow:0 0 8px rgba(245,158,11,.6);}
.lsw-dot--soccer{background:#4ADE80;box-shadow:0 0 8px rgba(74,222,128,.6);}

/* ── Matchup banner ─────────────────────────────────────────────────────
   ONE definition, used by every soccer surface that shows a fixture: the
   league page's rotating marquee, the club command centre (static, next
   match) and the Match Centre (static, that match). Ported from the NHL
   command-center hero so the three sports read the same. Partial:
   templates/soccer/partials/_matchup_banner.html */
.hero{position:relative;overflow:hidden;border-radius:var(--r-xl);
  border:1px solid var(--line-strong);margin-bottom:18px;
  background:linear-gradient(180deg,rgba(22,30,26,.9),rgba(12,18,15,.9));}
.hero-top-glow{position:absolute;top:-60%;left:50%;transform:translateX(-50%);
  width:130%;height:150%;pointer-events:none;
  background:radial-gradient(50% 50% at 50% 50%,var(--team-primary-a18),transparent 70%);}
.hero-tags{display:flex;align-items:center;gap:12px;padding:16px 22px;
  position:relative;z-index:10;flex-wrap:wrap;}
.hero-tag{display:inline-flex;align-items:center;gap:8px;border-radius:999px;
  padding:6px 12px;font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.16em;text-transform:uppercase;}
.hero-tag.pre{background:rgba(230,57,70,0.10);border:1px solid rgba(230,57,70,0.32);color:#FFD2D7;}
.hero-tag.pre .dot{width:6px;height:6px;background:#E63946;border-radius:50%;
  animation:livePulse 1.8s infinite;}
.hero-tag.meta{background:rgba(255,255,255,0.05);border:1px solid var(--line-strong);color:var(--t-2);}
.hero-tag-right{margin-left:auto;display:flex;gap:8px;align-items:center;}
.hero-cols{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:24px;padding:6px 26px 28px;position:relative;z-index:10;}
.hero-team{display:flex;flex-direction:column;gap:12px;}
.hero-team.right{align-items:flex-end;text-align:right;}
.hero-team-logo{width:96px;height:96px;border-radius:26px;position:relative;
  display:grid;place-items:center;
  background:radial-gradient(80% 80% at 30% 25%,var(--team-grad-mid),var(--team-grad-base));}
.hero-team-logo::after{content:"";position:absolute;inset:-6px;border-radius:30px;
  border:1px dashed rgba(255,255,255,0.10);}
.hero-team-logo img{width:64px;height:64px;object-fit:contain;position:relative;z-index:1;}
.hero-team-name{font-family:'Inter Tight',sans-serif;font-weight:800;font-size:22px;
  letter-spacing:-.01em;text-transform:uppercase;line-height:1.1;}
.hero-team-name a{text-decoration:none;}
.hero-team-sub{font-size:11.5px;color:var(--t-3);letter-spacing:.10em;
  text-transform:uppercase;font-weight:500;}
.hero-team-record{font-family:'JetBrains Mono',monospace;font-size:12.5px;
  color:var(--t-2);display:flex;align-items:center;gap:10px;}
.hero-team.right .hero-team-record{flex-direction:row-reverse;}
.hero-team-record .div{width:24px;height:1px;background:var(--line-strong);}
.hero-center{display:flex;flex-direction:column;align-items:center;gap:12px;min-width:220px;}
.hero-vs{font-family:'Inter Tight',sans-serif;font-weight:900;font-size:30px;
  letter-spacing:-.02em;color:var(--t-4);}
.hero-countdown-box{border:1px solid var(--team-accent-a30);border-radius:16px;
  padding:12px 20px;text-align:center;background:var(--team-primary-a10);}
.hero-countdown-label{font-family:'JetBrains Mono',monospace;font-size:9.5px;
  letter-spacing:.24em;color:var(--team-accent);text-transform:uppercase;font-weight:700;}
.hero-countdown-digits{font-family:'Inter Tight',sans-serif;font-weight:800;
  font-size:22px;margin-top:5px;}
.hero-score{font-family:'Inter Tight',sans-serif;font-weight:900;font-size:38px;line-height:1;}
.hero-state{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--t-4);}
.hero-state .live{color:#E63946;}
.hero-venue{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--t-4);text-align:center;}
.hero-open{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--team-accent);text-decoration:none;}
.hero-form{display:inline-flex;gap:4px;}
.hero-form i{width:16px;height:16px;border-radius:5px;display:inline-flex;align-items:center;
  justify-content:center;font-style:normal;font-family:'JetBrains Mono',monospace;
  font-size:9px;font-weight:700;background:var(--bg-4);color:var(--t-3);}
.hero-form i.W{background:rgba(52,211,153,.2);color:var(--pos);}
.hero-form i.L{background:rgba(248,113,113,.18);color:var(--neg);}
.hero-form i.D{background:rgba(245,158,11,.16);color:var(--warn);}
@media (max-width:800px){
  .hero-cols{grid-template-columns:1fr 1fr;gap:14px;padding:4px 14px 20px;}
  .hero-center{grid-column:1 / -1;grid-row:1;min-width:0;}
  .hero-team-logo{width:64px;height:64px;border-radius:18px;}
  .hero-team-logo img{width:42px;height:42px;}
  .hero-team-name{font-size:15px;}
  .hero-score{font-size:28px;}
}

/* ── Pitch lineup view (partials/_pitch.html) ──────────────────────────── */
.pitch-pair{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);}
@media (max-width:900px){.pitch-pair{grid-template-columns:1fr;}}
.pitch{background:var(--bg-2);padding:14px 12px 18px;}
.pitch-head{display:flex;align-items:center;gap:9px;margin-bottom:10px;}
.pitch-head img{width:22px;height:22px;object-fit:contain;}
.pitch-club{font-weight:700;font-size:13px;}
.pitch-formation{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.14em;color:var(--team-accent);}
/* column-reverse so the goalkeeper — always row 0 — sits at the BOTTOM and
   the side attacks upward. Both pitches read the same way when shown side
   by side; mirroring one of them just makes the pair harder to compare. */
/* FIXED height, rows spread evenly: a 4-2-3-1 has five bands and a 4-4-2
   four, so a height driven by row count makes two side-by-side pitches
   different sizes. The pitch is the constant; the formation just changes
   how the players sit on it. */
.pitch-turf{position:relative;border-radius:var(--r-m);padding:18px 8px 22px;
  height:360px;box-sizing:border-box;
  display:flex;flex-direction:column-reverse;justify-content:space-between;
  background:
    repeating-linear-gradient(180deg, rgba(74,222,128,0.045) 0 26px,
      rgba(74,222,128,0.02) 26px 52px),
    linear-gradient(180deg, rgba(16,32,22,.9), rgba(10,20,14,.9));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);}
/* The goal mouth, behind the keeper. */
.pitch-turf::after{content:'';position:absolute;left:50%;bottom:4px;
  transform:translateX(-50%);width:96px;height:16px;border-radius:3px;
  border:1px solid rgba(255,255,255,.16);border-bottom:none;
  pointer-events:none;}
.pitch-row{display:flex;justify-content:space-around;gap:6px;}
.pp{display:flex;flex-direction:column;align-items:center;gap:5px;
  text-decoration:none;min-width:0;max-width:82px;}
.pp-face{position:relative;width:42px;height:42px;border-radius:50%;
  display:grid;place-items:center;flex:0 0 auto;
  background:linear-gradient(160deg,var(--team-grad-mid),var(--bg-4));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);}
.pp-face img{width:42px;height:42px;border-radius:50%;object-fit:cover;}
.pp-initial{font-family:'Inter Tight',sans-serif;font-weight:800;font-size:15px;
  color:var(--t-2);}
.pp-num{position:absolute;bottom:-3px;left:-4px;background:var(--bg-1);
  border:1px solid var(--line-strong);border-radius:999px;padding:0 5px;
  font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--t-3);}
.pp-starts{position:absolute;top:-3px;right:-5px;background:var(--team-accent);
  color:#06210F;border-radius:999px;min-width:15px;height:15px;
  display:grid;place-items:center;padding:0 3px;
  font-family:'JetBrains Mono',monospace;font-size:8.5px;font-weight:700;}
.pp-name{font-size:10px;line-height:1.25;text-align:center;color:var(--t-2);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;}
.pp:hover .pp-name{color:var(--team-accent);}
@media (max-width:900px){
  .pitch-turf{height:320px;}
  .pp-face{width:36px;height:36px;}
  .pp-face img{width:36px;height:36px;}
  .pp-name{font-size:9px;}
}

/* Squad availability — both clubs, fixed height, scrollable, tagged */
.avail-pair{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);}
@media (max-width:900px){.avail-pair{grid-template-columns:1fr;}}
.avail-col{background:var(--bg-2);min-width:0;}
.avail-club{display:flex;align-items:center;gap:9px;padding:12px 20px 8px;
  font-weight:700;font-size:12.5px;border-bottom:1px solid var(--line);}
.avail-club img{width:20px;height:20px;object-fit:contain;}
.avail-scroll{max-height:320px;overflow-y:auto;overscroll-behavior:contain;
  padding:6px 20px 12px;}
.avail-head{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--t-4);margin:10px 0 6px;position:sticky;top:0;
  background:linear-gradient(180deg,var(--bg-2) 70%,transparent);padding:4px 0;}
.avail-row{display:flex;align-items:center;gap:10px;padding:7px 0;
  border-bottom:1px solid var(--line);text-decoration:none;font-size:12.5px;}
.avail-row:last-child{border-bottom:none;}
.avail-face{width:26px;height:26px;border-radius:50%;flex:0 0 auto;object-fit:cover;
  background:linear-gradient(160deg,var(--team-grad-mid),var(--bg-4));
  display:grid;place-items:center;font-family:'Inter Tight',sans-serif;
  font-weight:800;font-size:11px;color:var(--t-2);}
.avail-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.avail-row .tag{margin-left:6px;font-family:'JetBrains Mono',monospace;font-size:8.5px;
  letter-spacing:.12em;text-transform:uppercase;padding:2px 7px;border-radius:999px;
  background:var(--bg-4);color:var(--t-4);flex:0 0 auto;}
.avail-row .tag.bench{background:rgba(245,158,11,.14);color:var(--warn);}
.avail-row .tag.out{background:rgba(248,113,113,.14);color:var(--neg);}
.avail-row .tag:first-of-type{margin-left:auto;}

/* Head to head strip */
.h2h-line{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.h2h-tally{font-family:'Inter Tight',sans-serif;font-weight:800;font-size:16px;}
.h2h-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;
  border-radius:999px;background:var(--bg-3);border:1px solid var(--line);
  text-decoration:none;font-family:'JetBrains Mono',monospace;font-size:11px;}
.h2h-chip .letter{font-weight:700;}
.h2h-chip .letter.W{color:var(--pos);}
.h2h-chip .letter.L{color:var(--neg);}
.h2h-chip .letter.D{color:var(--warn);}

/* ── Sidebar ───────────────────────────────────────────────────────────── */
.sidebar{position:sticky;top:0;height:100vh;min-width:248px;
  background:linear-gradient(180deg,#0B1611 0%,#070B09 100%);
  border-right:1px solid var(--line);
  display:flex;flex-direction:column;padding:22px 16px 18px;}
.brand-link{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;margin-bottom:22px;}
.brand-logo{width:40px;height:40px;border-radius:10px;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;
  background:radial-gradient(120% 120% at 30% 20%, var(--team-grad-mid), var(--team-grad-base) 70%);
  box-shadow:inset 0 0 0 1px var(--team-accent-a30);}
.brand-logo img{width:28px;height:28px;object-fit:contain;}
.brand-name{font-family:'Inter Tight',sans-serif;font-weight:800;font-size:14px;
  letter-spacing:-.01em;text-transform:uppercase;line-height:1.15;}
.brand-sub{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--t-4);margin-top:2px;}
.nav-section-label{font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--t-4);font-weight:700;
  margin:0 0 10px 12px;}
.nav{display:flex;flex-direction:column;gap:4px;}
.nav a, .nav .nav-soon{position:relative;display:flex;align-items:center;gap:11px;
  padding:10px 12px;border-radius:12px;border:1px solid transparent;
  text-decoration:none;color:var(--t-2);font-size:13.5px;font-weight:600;}
.nav a:hover{background:var(--bg-2);}
.nav a.active{
  background:linear-gradient(180deg, var(--team-primary-a22), var(--team-primary-a10));
  border-color:var(--team-accent-a30);color:var(--t-1);}
.nav a.active::before{content:'';position:absolute;left:-16px;top:8px;bottom:8px;width:3px;
  border-radius:3px;background:linear-gradient(180deg, var(--team-accent), var(--team-primary));
  box-shadow:0 0 16px var(--team-accent-a30);}
.nav .icon{width:18px;height:18px;flex:0 0 auto;color:var(--t-4);}
.nav a.active .icon{color:var(--team-accent);}
.nav .icon img{width:18px;height:18px;object-fit:contain;display:block;}
.nav .badge{font-family:'JetBrains Mono',monospace;font-size:10px;font-weight:700;
  color:var(--team-accent);background:var(--team-accent-a14);
  padding:2px 6px;border-radius:5px;margin-left:auto;}
.nav .nav-soon{color:var(--t-5);cursor:default;}
.nav .nav-soon em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:9px;
  letter-spacing:.12em;color:var(--t-5);border:1px dashed var(--line-strong);
  border-radius:5px;padding:2px 6px;margin-left:auto;}
.subnav{display:flex;flex-direction:column;gap:2px;margin:2px 0 6px 40px;}
.subnav a, .subnav .subnav-soon{font-size:12px;color:var(--t-3);text-decoration:none;
  padding:5px 10px;border-radius:8px;display:flex;align-items:center;gap:8px;}
.subnav a:hover{background:var(--bg-2);}
.subnav a.active{color:var(--t-1);background:var(--team-primary-a10);}
.subnav .subnav-soon{color:var(--t-5);cursor:default;}
.subnav .subnav-soon em{font-style:normal;font-family:'JetBrains Mono',monospace;
  font-size:8.5px;letter-spacing:.1em;color:var(--t-5);}
.sidebar-foot{margin-top:auto;border-top:1px solid var(--line);padding-top:14px;}
.user-row{display:flex;align-items:center;gap:10px;}
.user-avatar{width:32px;height:32px;border-radius:50%;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg, var(--team-grad-mid), #0A100E);
  border:1px solid var(--team-accent-a30);
  font-family:'Inter Tight',sans-serif;font-weight:800;font-size:12px;}
.user-name{font-size:12.5px;font-weight:600;line-height:1.2;}
.user-role{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--t-4);background:none;border:none;cursor:pointer;padding:0;}
.user-role:hover{color:var(--t-2);}

/* ── Topbar / page headers ─────────────────────────────────────────────── */
.topbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.topbar h1{font-family:'Inter Tight',sans-serif;font-weight:900;font-size:26px;
  letter-spacing:-.01em;margin:0;}
.topbar h1 small{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:400;
  letter-spacing:.14em;text-transform:uppercase;color:var(--t-4);margin-left:10px;}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:10px;}

/* ── Cards ─────────────────────────────────────────────────────────────── */
.card{background:linear-gradient(180deg, rgba(22,30,32,0.85), rgba(16,23,26,0.85));
  border:1px solid var(--line);border-radius:24px;overflow:hidden;backdrop-filter:blur(8px);}
.card-header{padding:16px 20px 14px;border-bottom:1px solid var(--line);
  background:rgba(255,255,255,0.05);display:flex;align-items:center;gap:10px;}
.card-header h3{font-family:'Inter Tight',sans-serif;font-weight:700;font-size:13px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--t-2);margin:0;}
.card-body{padding:16px 20px;}

/* ── Pills & chips ─────────────────────────────────────────────────────── */
.pill{display:inline-flex;align-items:center;gap:7px;border-radius:999px;
  padding:7px 12px;background:rgba(255,255,255,0.05);
  border:1px solid var(--line-strong);
  font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--t-2);}
.pill-dot{width:6px;height:6px;border-radius:50%;background:var(--t-4);}
.pill-dot.live{background:#E63946;box-shadow:0 0 8px #E63946;}
.pill-dot.gold{background:var(--team-accent);box-shadow:0 0 8px var(--team-accent-a30);}
.micro-label{font-family:'JetBrains Mono',monospace;font-size:9.5px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--t-4);}

/* Headshots */
.shot{width:32px;height:32px;border-radius:50%;object-fit:cover;background:var(--bg-3);
  flex:0 0 auto;}
.shot-lg{width:84px;height:84px;border-radius:18px;object-fit:cover;background:var(--bg-3);}

/* ── Live news rail — RIGHT column: nav | content | Around the League ──── */
.rail-grid{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:18px;align-items:start;}
.news-rail{order:2;position:sticky;top:18px;background:var(--bg-2);border:1px solid var(--line-strong);
  border-radius:var(--r-l);padding:14px 14px 8px;max-height:calc(100vh - 36px);
  overflow-y:auto;overscroll-behavior:contain;}
.rail-main{order:1;min-width:0;}
.news-rail-head{display:flex;align-items:center;gap:8px;margin-bottom:10px;}
.news-rail-empty{color:var(--t-4);font-size:12px;padding:8px 0 14px;}
.nri{display:flex;gap:9px;padding:9px 0;border-bottom:1px solid var(--line);}
.nri:last-child{border-bottom:none;}
.nri-dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto;margin-top:4px;}
.nri-dot.nri-league{width:auto;height:auto;background:none;font-size:10px;margin-top:2px;}
.nri-body{min-width:0;}
.nri-body a{font-size:12.5px;font-weight:600;line-height:1.35;text-decoration:none;display:block;}
.nri-body a:hover{color:var(--team-accent);}
.nri-meta{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.06em;
  color:var(--t-4);margin-top:3px;text-transform:uppercase;}
.nri-meta .chip{font-size:8.5px;font-weight:700;padding:1px 6px;border-radius:999px;
  background:var(--bg-4);color:var(--t-3);letter-spacing:.06em;}
.nri-meta .chip.rumor{background:rgba(245,158,11,.16);color:var(--warn);}
.nri-meta .chip.official{background:rgba(52,211,153,.14);color:var(--pos);}
.nri-club{color:var(--team-accent);text-decoration:none;font-weight:600;}
.nri-club:hover{text-decoration:underline;}
@media (max-width:1200px){
  .rail-grid{grid-template-columns:1fr;}
  .news-rail{position:static;max-height:340px;order:2;}
}

/* ── Mobile ────────────────────────────────────────────────────────────── */
.m-tabbar,.m-sheet,.m-sheet-scrim{display:none;}
@media (max-width:900px){
  .app{display:block;}
  .app > .sidebar{display:none;}
  .app > .main{padding:14px 14px 84px;}
  .m-tabbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;
    background:rgba(9,12,11,0.96);backdrop-filter:blur(10px);
    border-top:1px solid var(--line-strong);
    padding:6px 4px calc(6px + env(safe-area-inset-bottom));}
  .m-tabbar a,.m-tabbar button{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;
    text-decoration:none;color:var(--t-4);font-size:9.5px;font-weight:600;
    letter-spacing:.06em;text-transform:uppercase;padding:5px 0;border-radius:10px;
    background:none;border:0;font-family:inherit;cursor:pointer;}
  .m-tabbar a.active,.m-tabbar button.active{color:var(--team-accent);}
  .m-tabbar .icon{width:20px;height:20px;}

  /* Section bottom sheets (opened from the tab bar) */
  .m-sheet-scrim{display:block;position:fixed;inset:0;z-index:65;
    background:rgba(0,0,0,.5);}
  .m-sheet{display:block;position:fixed;left:0;right:0;bottom:0;z-index:70;
    background:var(--bg-2);border-top:1px solid var(--line-strong);
    border-radius:18px 18px 0 0;padding:10px 16px calc(18px + env(safe-area-inset-bottom));
    box-shadow:0 -18px 50px rgba(0,0,0,.5);}
  .m-sheet[hidden],.m-sheet-scrim[hidden]{display:none;}
  .m-sheet .grab{width:38px;height:4px;border-radius:999px;background:var(--line-strong);
    margin:2px auto 12px;}
  .ms-btn{display:flex;align-items:center;gap:11px;padding:13px 15px;margin-bottom:8px;
    border-radius:13px;background:var(--bg-3);border:1px solid var(--line);
    text-decoration:none;color:var(--t-1);font-weight:700;font-size:14px;}
  .ms-btn img{width:24px;height:24px;object-fit:contain;}
  .ms-btn svg{color:var(--t-3);}
  .ms-divider{height:1px;background:var(--line-strong);margin:10px 0;}
  .ms-account{display:block;width:100%;text-align:left;padding:9px 4px;border:0;
    background:none;text-decoration:none;color:var(--t-3);font-size:13px;
    font-weight:600;cursor:pointer;font-family:inherit;}
  .ms-account-form{margin:0;}
}