@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400..900;1,9..144,400..700&family=Manrope:wght@400;500;600;700;800&family=Barlow+Condensed:wght@500;600;700&family=Jersey+25&family=Caveat:wght@600;700&display=fallback');

/* "Forest" look: cream pages with forest green and gold. Green top bar and solid blocks,
   gold buttons, padel-ball lime for highlights. Fraunces headlines, Fraunces italic for small
   flourishes, Manrope for everything else. Flat colour and thin lines only: no shadows, glows or photos. */
:root{
  --gold:#C9A04A;                     /* accent fill (gold): buttons, active states */
  --gold2:#8C6420;                    /* accent text (deep gold, readable on cream) */
  --ink:#12261D;                      /* forest green: strongest text, and the fill of solid blocks */
  --on-accent:#12261D;                /* text on gold or light green fills */
  --on-hi:#12261D;                    /* text on lime / draw highlight fills */
  --on-inv-accent:#F0CA75;            /* gold text that reads on forest-green blocks */
  --accent-rgb:201,160,74;
  --bar-bg:#12261D;                   /* top bar and phone tab bar */
  --bar-text:#F4EEE3;
  --inv-line:rgba(244,238,227,.2);       /* hairline inside solid blocks */
  --hi:#C6EE3C;--hi-rgb:198,238,60;   /* padel-ball lime highlight */
  --panel:#FBF8F2;                    /* cards */
  --tint:18,38,29;                    /* rgb of subtle overlay tints (green on a light page) */
  --page-bg:#F4EEE3;
  --cell-bg:#FBF8F2;                  /* opaque cells that sit over scrolling content */
  --surface:#FFFDF9;                  /* inputs, score boxes, inset panels */
  --surface-hover:#EFE6D6;
  --score-text:#12261D;
  --win-text:#3F5A1E;
  --loss-text:#9A2F25;
  --purple:#6B4C9A;
  --lime:#C6EE3C;--lime-rgb:198,238,60;
  --lime-text:#4F6B0E;                /* readable text in the lime family */
  --acc-gold:#B8860B;--acc-green:#4F6B2A;--acc-orange:#C0571E;--acc-blue:#1F6F8B;--acc-purple:#6B4C9A;
  --line:#DDD2BE;
  --text:#12261D;
  --muted:#4E5F55;
  --green:#4F7A2A;
  --win:#4F7A2A;--win-rgb:79,122,42;
  --loss:#A8322A;--loss-rgb:168,50,42;
  --draw:#D9A21B;--draw-rgb:217,162,27;
  --radius:16px;

  --font-hero:'Fraunces', Georgia, serif;
  --font-accent:'Fraunces', Georgia, serif;
  --font-body:'Manrope', 'Helvetica Neue', Arial, sans-serif;

  /* Spacing scale — use these instead of one-off pixel values */
  --sp-1:4px;
  --sp-2:8px;
  --sp-3:12px;
  --sp-4:16px;
  --sp-5:24px;
  --sp-6:32px;
  --sp-7:48px;

  /* Type scale — six sizes, each with one clear job */
  --text-hero:clamp(56px, 11vw, 96px);
  --text-h1:clamp(28px, 6vw, 36px);
  --text-h2:20px;
  --text-lg:24px;
  --text-body:16px;
  --text-sm:14px;
  --text-xs:12px;
}

/* Dark mode (page-boot.js sets data-theme; the switch is in the top bar): the same palette inverted.
   Forest-green pages, cream text, cream solid blocks with green text, gold accents. */
:root[data-theme="dark"]{
  --gold:#D7AD58;
  --gold2:#F0CA75;
  --ink:#F3EBD8;
  --on-accent:#10201C;
  --on-hi:#10201C;
  --on-inv-accent:#8C6420;
  --accent-rgb:215,173,88;
  --bar-bg:#0B1C15;
  --bar-text:#F3EBD8;
  --inv-line:rgba(18,38,29,.18);
  --panel:#1A3328;
  --tint:255,255,255;
  --page-bg:#12261D;
  --cell-bg:#1A3328;
  --surface:#0E2019;
  --surface-hover:#22402F;
  --score-text:#FFFFFF;
  --win-text:#BCD39A;
  --loss-text:#E3A89F;
  --purple:#C79DF0;
  --lime-text:#C6EE3C;
  --acc-gold:#F0CA75;--acc-green:#8FBF6A;--acc-orange:#F08A3C;--acc-blue:#6FC3EE;--acc-purple:#C79DF0;
  --line:rgba(215,173,88,.3);
  --text:#EEF0E8;
  --muted:#B9C1BC;
  --green:#86A84F;
  --win:#86A84F;--win-rgb:134,168,79;
  --loss:#C0675C;--loss-rgb:192,103,92;
  --draw:#E0B54E;--draw-rgb:224,181,78;
  color-scheme:dark;
}
:root[data-theme="dark"] .topbar{box-shadow:inset 0 -1px 0 var(--line)}   /* a shadow, not a border, so nothing in the bar moves when the theme changes */

*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden;overflow-x:clip;max-width:100%}

body{
  margin:0;
  font-family:var(--font-body);
  color:var(--text);
  background:var(--page-bg);
  min-height:100vh;
  max-width:100%;overflow-x:hidden;overflow-x:clip;
  -webkit-font-smoothing:antialiased;
}

a{color:var(--gold2)}

/* Set by motm-banner.js to the banner's rendered height (0px when it's
   not shown) so the page content and the fixed badges below shift down
   instead of being covered by the banner. */
:root{--motm-offset:0px;--admin-offset:0px;color-scheme:light}

/* --bar-total = the sticky top bar (nav.js) incl. the iPhone notch area; content starts below it */
:root{--bar-h:calc(64px + env(safe-area-inset-top,0px));--ticker-h:34px;--bar-total:calc(var(--bar-h) + var(--ticker-h))}
.wrap{max-width:1120px;margin:auto;padding:calc(var(--sp-6) + var(--bar-total) + var(--motm-offset) + var(--admin-offset)) var(--sp-5) var(--sp-7)}
@media(max-width:600px){.wrap{padding-left:var(--sp-4);padding-right:var(--sp-4)}}

/* Page header: one left-aligned title per page, the same on every page. Scoped to the <header> tag
   because "hero" is reused as a size modifier elsewhere (.matchup-row.hero etc.). */
header.hero{text-align:left;padding:0;margin-bottom:var(--sp-6);display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:clamp(16px,3vw,28px);align-items:center}
header.hero > *{grid-column:2}
header.hero > .crest-link{grid-column:1;grid-row:1 / span 3;align-self:center;display:block;line-height:0}
.crest-logo{display:block;margin:0;width:clamp(84px,12vw,132px);height:auto}
.crest-logo.small{width:clamp(56px,8vw,84px)}
h1{
  font-family:var(--font-hero);font-size:clamp(40px,8vw,88px);line-height:.95;
  margin:0;color:var(--ink);font-weight:700;letter-spacing:-.02em;
}
.kicker,.sub{font-family:var(--font-accent);font-style:italic;font-size:clamp(20px,3vw,26px);color:var(--gold2);letter-spacing:0;text-transform:none;margin:0 0 var(--sp-1)}
header.hero .sub{margin:var(--sp-2) 0 0}

button{
  background:transparent;border:1.5px solid var(--ink);color:var(--ink);
  padding:var(--sp-2) var(--sp-4);border-radius:999px;font-weight:700;cursor:pointer;
  font-family:inherit;font-size:var(--text-sm);display:inline-block;
}
button:hover{background:var(--surface-hover)}
button.primary{background:var(--gold);border-color:var(--gold);color:var(--on-accent)}
button.primary:hover{background:var(--ink);border-color:var(--ink)}

/* Smaller hero heading for subpages (Table / Rules / Admin) */
h1.h1-sub{font-size:clamp(36px,7vw,72px)}

/* Graphical points pills, replacing "Win = 3 pts" style text */
.pts-row{display:flex;gap:6px;margin-top:6px}
.pill{flex:1;text-align:center;padding:5px 2px 6px;border-radius:6px;font-size:11.5px;letter-spacing:.04em;font-weight:700;background:var(--page-bg)}
.pill b{display:block;font-size:16px;margin-top:2px;font-family:var(--font-hero)}
.pill.win{background:rgba(var(--win-rgb),.25);color:var(--win-text)}
.pill.draw{background:rgba(var(--accent-rgb),.2);color:var(--gold2)}
.pill.loss{background:rgba(var(--loss-rgb),.22);color:var(--loss-text)}

/* League standings order: Points > Set Diff > Games Diff */
.standings-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:6px;font-size:13px;color:var(--text)}
.standings-row .arrow{color:var(--gold2);font-weight:700}

.info .span2{grid-column:1 / -1}

/* Rules list */
.rules-list{margin:0;padding:0 0 0 22px;counter-reset:none}
.rules-list li{padding:12px 0;border-bottom:1px solid rgba(var(--tint),.08);line-height:1.5;font-size:15px}
.rules-list li:last-child{border-bottom:none}
.rules-list li::marker{color:var(--gold2);font-weight:700}

/* Cards */
.grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:var(--sp-4)}
.card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:var(--sp-5)}
@media(max-width:600px){.card{padding:var(--sp-4)}}
/* Section headings: Fraunces, left aligned, no rules or boxes */
h2,.card h2,.section-title{
  margin:0 0 var(--sp-4);text-align:left;color:var(--ink);letter-spacing:0;font-size:clamp(20px,3vw,26px);
  font-family:var(--font-hero);font-weight:700;line-height:1.05;border:0;padding:0
}
.team-list{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-3)}
.team-row{
  padding:var(--sp-4) var(--sp-3);background:var(--page-bg);border:1px solid var(--line);
  cursor:pointer;border-radius:var(--radius);transition:background .15s,border-color .15s;
  text-decoration:none;color:inherit;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
}
.team-row:hover{background:rgba(var(--tint),.08);border-color:var(--gold)}
.team-row.selected{background:rgba(var(--accent-rgb),.16);color:var(--gold2);font-weight:700}

.info{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.info div{padding:10px;border-bottom:1px solid var(--line)}
.info b{display:block;color:var(--gold2);font-size:13px;margin-bottom:4px}

/* Fixtures */
.fixtures-title{margin:var(--sp-6) 0 var(--sp-3);text-align:center;color:var(--gold2);letter-spacing:3px;font-size:var(--text-h1);font-family:var(--font-hero)}
.fixtures-caption{text-align:center;color:var(--muted);font-size:var(--text-sm);margin:0 0 var(--sp-4)}

/* Next fixture countdown — sits right under the "NEXT MATCHUP" heading,
   with its own divider line below it (instead of the usual .card h2
   underline) separating it from the matchup itself. */
.next-fixture-card{text-align:center;margin:var(--sp-5) 0}
.next-fixture-card h2{border-bottom:none;padding-bottom:0;margin-bottom:0}
.nf-divider{border-bottom:1px solid var(--line);margin:var(--sp-3) 0}
.fx-round-label{color:var(--muted);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;margin-bottom:var(--sp-2);text-align:center}
.nf-date{color:var(--muted);font-size:var(--text-sm);margin:var(--sp-2) 0 var(--sp-4)}
.nf-countdown-grid{display:flex;justify-content:center;gap:5px;flex-wrap:wrap;margin-top:var(--sp-3)}
.nf-unit{background:var(--page-bg);border:1px solid var(--line);border-radius:8px;padding:10px;min-width:50px}
.nf-num{display:block;font-family:var(--font-hero);font-size:clamp(18px,4.4vw,26px);color:var(--gold2);line-height:1}
.nf-label{display:block;font-size:var(--text-xs);color:var(--muted);letter-spacing:.08em;margin-top:var(--sp-1);text-transform:uppercase}
.nf-empty, .nf-loading{color:var(--muted);font-size:var(--text-sm);padding:var(--sp-2) 0}

/* Next Matchup: the row itself + round/date + location, all with the same
   tight var(--sp-2) gap throughout — matches the gap inside the row (name
   to "v" badge) exactly, instead of each piece using its own margin. */
.nf-matchup-block{display:flex;flex-direction:column;align-items:center;gap:var(--sp-2)}
.agree-btn{
  display:inline-block;margin-top:var(--sp-3);background:var(--gold);color:var(--on-accent);
  padding:var(--sp-2) var(--sp-5);border-radius:8px;font-weight:700;font-size:var(--text-sm);
  text-decoration:none;letter-spacing:.02em;
}
.agree-btn:hover{background:var(--ink);color:var(--page-bg)}

/* Two-column layout for Upcoming / Recent Results */
.fixtures-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-4);align-items:start}
@media(max-width:700px){.fixtures-columns{grid-template-columns:minmax(0,1fr)}}

.rounds{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-4)}
.round{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-3)
}
.round-complete{color:var(--muted);font-size:.8em;letter-spacing:.06em}
.round h3{margin:0 0 var(--sp-3);text-align:center;color:var(--gold2);letter-spacing:1px;font-size:var(--text-body);font-family:var(--font-hero)}
.match{
  position:relative;
  display:grid;grid-template-columns:minmax(0,1fr) 26px 26px minmax(0,1fr);gap:var(--sp-2);align-items:center;
  padding:var(--sp-2) var(--sp-4);border-top:1px solid rgba(var(--tint),.08);font-size:var(--text-sm);
  transition:background .2s,opacity .2s;
  text-decoration:none;color:inherit;
}
.match:hover{background:var(--page-bg)}
.match:first-of-type{border-top:0}
.match.highlighted{
  background:rgba(var(--accent-rgb),.12);border-radius:6px;
  box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.4);
}
.match.dimmed{opacity:.32}
.match-no{
  position:absolute;left:2px;top:var(--sp-2);
  color:var(--gold2);font-weight:bold;font-size:var(--text-xs);
}
.team1,.team2{
  overflow:visible;max-width:100%;
  font-size:clamp(11px,2.4vw,13px);
  text-align:center;line-height:1.3;
}
.motm-highlight{color:var(--gold2);font-weight:700}
.score{
  text-align:center;background:var(--surface);border-radius:4px;padding:var(--sp-1) 3px;
  color:var(--score-text);font-weight:bold;font-size:var(--text-sm);
}
.score.empty{color:var(--muted);font-size:var(--text-xs)}
.score.win{color:var(--gold2)}

/* League table */
.table-wrap{margin-top:18px}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.scroll-hint{display:none;color:var(--muted);font-size:12px;text-align:right;margin:-4px 0 6px}
table{width:100%;border-collapse:collapse;min-width:780px}
th{color:var(--gold2);font-size:12px;letter-spacing:.8px}
th,td{padding:10px;border-bottom:1px solid rgba(var(--tint),.1);text-align:center;white-space:nowrap}
td.team{text-align:left}
td.pos{color:var(--gold2);font-weight:bold}
.move-arrow{display:inline-block;font-size:12px;margin-right:2px}
.move-arrow.up{color:var(--win)}
.move-arrow.down{color:var(--loss)}
.move-arrow.flat{color:var(--muted);font-size:13px}
.top3 td.pos,.top3 td.team{font-weight:bold;color:var(--gold2)}

/* Pin POS, TEAM and PTS so they stay visible; the rest scrolls beneath them */
.col-pos{position:sticky;left:0;width:36px;min-width:36px}
.col-team{
  position:sticky;left:36px;width:215px;min-width:215px;
  white-space:nowrap;overflow:visible;text-overflow:clip;
}
.col-pts{position:sticky;left:251px;width:52px;min-width:52px;}
.col-pos,.col-team,.col-pts{background:var(--cell-bg);z-index:2}
thead .col-pos,thead .col-team,thead .col-pts{background:var(--cell-bg);z-index:3}
.top3 .col-pos,.top3 .col-team,.top3 .col-pts{background:var(--surface-hover)}

/* Row hover highlight — sticky cells need their own rule since they have
   an explicit opaque background that would otherwise hide a row-level hover */
/* Row hover is for the league table only — grids (court availability, results, preferred times) highlight just the cell under the pointer. */
#table tr:hover .col-pos, #table tr:hover .col-team, #table tr:hover .col-pts{background:var(--surface-hover)}

@media(max-width:560px){
  .scroll-hint{display:block}
}

.footer{text-align:center;color:var(--muted);font-size:var(--text-xs);padding:var(--sp-5)}

@media(max-width:850px){
  .grid{grid-template-columns:minmax(0,1fr)}
  .rounds{grid-template-columns:minmax(0,1fr)}
  .info{grid-template-columns:minmax(0,1fr)}
  .sub{font-size:18px}
}

/* --- Admin page --- */
.login-card, .admin-panel{
  max-width:440px;margin:60px auto;background:var(--panel);
  border:1px solid var(--line);border-radius:var(--radius);padding:32px 30px
}
.login-card h2{margin:0 0 6px;color:var(--gold2);font-family:var(--font-hero);font-size:26px}
.login-card p.sub2{color:var(--muted);font-size:14px;margin-bottom:22px;letter-spacing:0}

label{display:block;font-size:12px;color:var(--muted);margin:16px 0 6px;letter-spacing:.03em}
input, select{
  width:100%;background:var(--surface);border:1px solid var(--line);border-radius:10px;
  color:var(--text);padding:12px 14px;min-height:48px;font-family:inherit;font-size:16px;text-align:left
}
/* Selects share one look everywhere: no native arrow, gold chevron, text aligned with inputs. */
select{
  -webkit-appearance:none;appearance:none;padding-right:42px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23B8432B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;background-size:12px 8px;
}
input[type=range],input[type=checkbox]{min-height:0;padding:0;border:none;background:none;width:auto}
input[type=range]{width:100%}
input:focus, select:focus, button:focus{outline:2px solid var(--gold2);outline-offset:1px}

.btn-primary{width:100%;margin-top:22px;background:var(--gold);color:var(--on-accent);padding:12px;font-size:15px}
.btn-primary:hover{background:var(--ink);color:var(--page-bg)}
.btn-primary:disabled{opacity:.5;cursor:not-allowed}

.error-msg{color:var(--loss);font-size:13px;margin-top:12px;min-height:1em}
.error-msg:empty{display:none}

.admin-panel{max-width:920px;margin:var(--sp-5) auto;padding:var(--sp-5)}
.btn-ghost{background:none;border:1px solid rgba(var(--tint),.2);color:var(--muted);padding:8px 14px;font-size:13px}
.btn-ghost:hover{border-color:var(--gold2);color:var(--gold2)}

.round-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:18px}
.round-tab{
  flex:0 0 auto;background:none;border:1px solid var(--line);color:var(--muted);
  font-size:13px;padding:7px 15px;border-radius:999px
}
.round-tab.active{background:var(--gold);border-color:var(--gold);color:var(--on-accent);font-weight:700}

.admin-match{background:var(--surface);border:1px solid rgba(var(--tint),.08);border-radius:8px;padding:14px 16px;margin-bottom:10px}
.status-pill{font-size:var(--text-xs);letter-spacing:.05em;text-transform:uppercase;padding:2px var(--sp-2);border-radius:999px;border:1px solid rgba(var(--tint),.2);color:var(--muted);white-space:nowrap;font-weight:700}
.status-pill.scheduled{color:var(--on-accent);background:var(--gold);border-color:var(--gold)}
.status-pill.inplay{color:var(--on-accent);background:var(--win);border-color:var(--win)}
.status-pill.awaiting{color:#3a1f0c;background:#E08A3C;border-color:#E08A3C}
.status-pill.final{color:#fff;background:var(--win);border-color:var(--win)}
.status-pill.unscheduled{color:#fff;background:var(--loss);border-color:var(--loss)}
.status-pill.suggested{color:#2b1606;background:#E08A3C;border-color:#E08A3C}
.status-pill.sm{font-size:11px;padding:1px 7px}


/* Match scheduling (admin) */
.schedule-row{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin:12px 0 4px}
.schedule-row > div{flex:0 0 auto}
.schedule-row label{margin:0 0 5px}
.schedule-row input[type=datetime-local]{width:auto;min-width:190px}
.save-time-btn{padding:9px 14px;font-size:12px;white-space:nowrap}
.remove-match-btn{padding:9px 14px;font-size:12px;white-space:nowrap;background:none;border:1px solid rgba(var(--tint),.2);color:var(--muted)}
.remove-match-btn:hover{border-color:var(--loss);color:var(--loss-text)}

/* Match status line (public fixtures grid) */
.match-status-line{
  grid-column:1 / -1;display:flex;justify-content:center;align-items:center;
  gap:var(--sp-2);margin-top:calc(var(--sp-1) * -1);
  flex-wrap:wrap;
}
.match.expandable .score,.match.expandable .match-status-line{cursor:pointer}
.match-caret{color:var(--gold2);font-size:12px;line-height:1;transition:transform .2s}
.match-caret.open{transform:rotate(180deg)}
.match-detail{grid-column:1 / -1;display:none;text-align:center;border-top:1px solid rgba(var(--tint),.08);padding-top:var(--sp-2)}
.match-detail.open{display:block}
.md-sets{display:flex;justify-content:center;gap:var(--sp-4);flex-wrap:wrap;font-size:var(--text-sm);color:var(--text)}
.md-set{display:inline-flex;flex-direction:column;align-items:center;gap:2px}
.md-set-label{font-size:var(--text-xs);color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
.md-set b{color:var(--gold2);font-family:var(--font-hero)}
.md-motm{margin-top:var(--sp-2);font-size:var(--text-sm);color:var(--muted)}
.md-motm .motm-name{color:var(--gold2);font-weight:600}
.match-time{font-size:var(--text-xs);color:var(--muted);letter-spacing:.02em}
.set-breakdown{font-size:var(--text-xs);color:var(--gold2);letter-spacing:.03em;font-weight:600}
.set-breakdown.big{font-size:var(--text-lg);font-family:var(--font-hero)}

.motm-info-line{
  display:flex;align-items:center;justify-content:center;gap:var(--sp-2);
  margin-top:var(--sp-2);font-size:var(--text-sm);color:var(--muted);
}
.motm-info-line .motm-name{color:var(--gold2);font-weight:600}

.match-footer{display:flex;justify-content:space-between;align-items:center;margin-top:8px;flex-wrap:wrap;gap:10px}
.sets-result{font-size:13px;color:var(--muted)}
.sets-result b{color:var(--gold2);font-size:16px;margin-left:4px}
.set-error{color:var(--loss);font-size:12px;margin-top:6px;min-height:1em}

.save-btn{background:var(--gold);color:var(--on-accent);padding:10px 16px;font-size:13px}
.save-btn:hover{background:var(--ink);color:var(--page-bg)}
.save-btn.saved{background:var(--win);color:var(--on-accent)}

.toast{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--surface);
  border:1px solid var(--gold);color:var(--text);padding:10px 20px;border-radius:8px;
  font-size:14px;opacity:0;pointer-events:none;transition:opacity .2s
}
.toast.show{opacity:1}

/* Update-available banner (installed PWA can't be manually hard-refreshed) */
.update-banner{
  position:fixed;bottom:0;left:0;right:0;z-index:100;
  background:var(--gold);color:var(--on-accent);
  display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;
  padding:12px 18px;font-size:13px;font-weight:600;text-align:center;
  
  padding-bottom:calc(12px + env(safe-area-inset-bottom));
}
.update-banner button{
  background:var(--on-accent);color:var(--gold2);border:none;border-radius:6px;
  padding:7px 16px;font-weight:700;font-size:12.5px;cursor:pointer;
}
.update-banner button:hover{background:#0a1a16}

/* Outstanding Man of the Match banner — top of the page (vs. the update
   banner's bottom position), shown only to players with open MOTM votes */
.motm-banner{
  position:fixed;top:0;left:0;right:0;z-index:99;
  background:var(--gold2);color:var(--page-bg);
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:10px 40px;font-size:13px;font-weight:700;
  
  padding-top:calc(10px + env(safe-area-inset-top));
}
.motm-banner-link{color:inherit;text-decoration:none;text-align:center}
.motm-banner-link:hover{text-decoration:underline}
.motm-banner-close{
  position:absolute;right:10px;top:50%;transform:translateY(calc(-50% + env(safe-area-inset-top)/2));
  background:none;border:none;color:var(--on-accent);opacity:.7;
  font-size:20px;line-height:1;cursor:pointer;padding:4px 8px;
}
.motm-banner-close:hover{opacity:1}

/* Burger menu + full-screen nav overlay (shared across every page via nav.js) */
.burger-btn{
  position:fixed;top:calc(18px + var(--motm-offset) + var(--admin-offset));right:18px;z-index:60;
  width:46px;height:46px;background:var(--panel);border:1px solid var(--gold);
  border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:5px;cursor:pointer;padding:0;
}
.burger-btn span{width:22px;height:2px;background:var(--gold2);display:block;border-radius:1px}

.nav-overlay{
  position:fixed;inset:0;z-index:90;background:var(--ink);
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity .25s ease;
}
.nav-overlay.open{opacity:1;pointer-events:auto}
.nav-close{
  position:absolute;top:16px;right:18px;background:none;border:none;
  color:var(--gold2);font-size:40px;line-height:1;cursor:pointer;padding:6px 10px;
}
.nav-links{display:flex;flex-direction:column;align-items:center;gap:30px}
.nav-links a{
  color:var(--gold2);text-decoration:none;font-family:var(--font-hero);
  font-size:clamp(30px,8vw,52px);letter-spacing:2px;font-weight:500;
}

/* Fixtures this week */
.this-week-card{margin:var(--sp-5) 0}
.week-match{
  display:block;padding:var(--sp-2) var(--sp-1);border-top:1px solid rgba(var(--tint),.08);
  text-decoration:none;color:inherit;transition:background .15s;
}
.week-match:first-child{border-top:0}
.week-match:hover{background:var(--page-bg)}
.week-match-meta{display:flex;justify-content:center;align-items:center;gap:var(--sp-2);margin-top:var(--sp-1);flex-wrap:wrap}
.week-empty{color:var(--muted);text-align:center;padding:var(--sp-2) 0;font-size:var(--text-sm)}

/* Gold outline (matches the burger menu button) for the three home hero boxes */
.gold-outline{border-color:var(--gold) !important}
.gold-outline h2{font-family:var(--font-hero)}

/* Shared "matchup" layout — team names truly centred around VS, since
   both sides push toward the fixed centre column regardless of name length.
   Font sizes here are deliberately tuned (hero = 2x, medium = 30% bigger
   than the original base) — left untouched by the spacing/type cleanup. */
.matchup-row{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:var(--sp-1)}
.matchup-team{display:flex;align-items:center;gap:var(--sp-1);min-width:0}
.matchup-team.left{justify-content:flex-end}
.matchup-team.right{justify-content:flex-start}
/* Names never truncate with "..." or spill past their box — kept to one
   line and shrunk to fit by shrinkNamesToFit() in app.js instead, against
   whatever width the responsive grid/flex layout actually gives them. */
.matchup-name{
  font-family:var(--font-hero);color:var(--text);flex-shrink:1;min-width:0;
  overflow:hidden;text-overflow:clip;white-space:nowrap;max-width:100%;
}
.matchup-team.left .matchup-name{text-align:right}
.matchup-team.right .matchup-name{text-align:left}

/* "v" in a small badge, football-scoreboard style */
.matchup-vs{
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--gold2);font-weight:700;flex-shrink:0;line-height:1;text-align:center;
  background:rgba(var(--accent-rgb),.12);border:1px solid var(--line);border-radius:6px;
  padding:6px 14px;
}

/* Medium size: Next 3 Upcoming — photo above name (column). Name alignment
   matches Recent Results' football style (left team right-aligned, right
   team left-aligned) — only the photo stays centred above it. Gap to the
   "v" badge is +4px over the base .matchup-row gap, same as Recent. */
.matchup-row.medium{gap:calc(var(--sp-1) + 4px)}
.matchup-row.medium .matchup-team{flex-direction:column;justify-content:center}
.matchup-row.medium .matchup-name{
  font-size:14px;width:auto;line-height:1.3;align-self:stretch;
  white-space:normal;overflow-wrap:break-word;word-break:break-word;
}
.matchup-row.medium .matchup-vs{font-size:12px}

/* Recent Results — no photos, football-style alignment, score shown
   inline (like the main Fixtures & Results grid) instead of a "v" badge,
   so it's a 4-column grid rather than the usual 3. Gap is +4px over the
   base .matchup-row gap. Name width is responsive, same reasoning as
   medium above. These boxes are narrow, so — unlike the hero box — a
   2-player name is allowed to wrap to a 2nd line rather than being shrunk
   to an illegible size chasing a single line. */
.matchup-row.recent{
  grid-template-columns:minmax(0,1fr) 26px 26px minmax(0,1fr);
  gap:calc(var(--sp-1) + 4px);
}
.matchup-row.recent .matchup-name{
  font-size:14px;width:auto;line-height:1.3;
  white-space:normal;overflow-wrap:break-word;word-break:break-word;
}

/* Hero size: the Next Matchup box — stacked 3 lines (team, v., team)
   instead of the side-by-side grid used everywhere else. Each team stays
   on one line (shrinks to fit rather than wrapping to a 2nd line). */
.matchup-row.hero{
  display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);
  width:100%;max-width:100%;
}
.matchup-row.hero .matchup-team{justify-content:center;width:100%;max-width:100%}
.matchup-row.hero .matchup-team.left .matchup-name,
.matchup-row.hero .matchup-team.right .matchup-name{text-align:center}
.matchup-row.hero .matchup-name{font-size:32px;line-height:1.3}
.matchup-row.hero .matchup-vs{
  font-size:16px;
  width:34px;height:34px;padding:0;border-radius:10px;
}

/* Round + kickoff time on one tight line, close under the names */
.matchup-meta{color:var(--muted);font-size:var(--text-xs);letter-spacing:.03em;text-align:center;margin-top:var(--sp-1)}
.matchup-meta.hero{font-size:16px;margin-top:0}

/* Small inline icon buttons for Predict / MOTM, instead of full-width text links */
.action-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:50%;flex-shrink:0;
  background:rgba(var(--accent-rgb),.16);border:1px solid var(--gold);font-size:var(--text-sm);
  vertical-align:middle;
}

/* Team filter banner (when arriving from the Teams page with ?team=) */
.team-filter-banner{
  display:flex;justify-content:center;align-items:center;gap:var(--sp-3);flex-wrap:wrap;
  background:rgba(var(--accent-rgb),.12);border:1px solid var(--line);border-radius:8px;
  padding:var(--sp-2) var(--sp-4);margin-bottom:var(--sp-4);font-size:var(--text-sm);color:var(--text)
}
.team-filter-banner strong{color:var(--gold2)}
.team-filter-banner a{color:var(--gold2);font-size:var(--text-xs);text-decoration:underline}

/* Fun win-probability "odds" (not real betting) shown on upcoming matches */
.odds-row{
  display:flex;align-items:center;justify-content:center;gap:var(--sp-3);margin-top:var(--sp-2);
}
.odds-side{
  font-family:var(--font-hero);font-size:17px;font-weight:700;color:var(--muted);
  min-width:38px;text-align:center;
}
.odds-side.fav{color:var(--gold2);font-size:21px}
.odds-label{
  font-size:10.5px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;text-align:center;line-height:1.5;
}
.odds-label.hero{font-size:18px;letter-spacing:.1em}

/* AI Predictor panel (Next Matchup box) — separate classes from the plain
   .odds-row/.odds-side used on the fixture detail page, since this one
   has its own prominent panel treatment and inline thumbs-up voting */
.odds-panel{
  display:inline-block;max-width:100%;box-sizing:border-box;
  background:rgba(var(--accent-rgb),.08);border:1px solid var(--line);border-radius:10px;
  padding:var(--sp-3) var(--sp-5);margin-top:calc(var(--sp-2) * 1.4);
}
.odds-panel-label{font-family:var(--font-body);font-size:12px;font-weight:600;letter-spacing:.16em;color:var(--gold2);text-transform:uppercase;text-align:center;margin-bottom:var(--sp-2)}
.odds-panel-row{display:flex;align-items:center;justify-content:center;gap:var(--sp-4);row-gap:var(--sp-2);flex-wrap:wrap}
/* The two thumb buttons sit right next to each other, split by a small
   "v" badge (same visual language as the matchup row's own v badge) */
.odds-thumbs-group{display:flex;align-items:center;gap:6px}
.odds-vs{
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--gold2);font-weight:700;line-height:1;
  background:rgba(var(--accent-rgb),.12);border:1px solid var(--line);border-radius:7px;
  width:22px;height:22px;font-size:12px;flex-shrink:0;
}
.odds-pct{font-family:var(--font-hero);font-weight:700;color:var(--muted);font-size:22px}
.odds-pct.fav{color:var(--gold2);font-size:28px}
.odds-thumb{
  display:inline-flex;align-items:center;gap:4px;
  background:var(--page-bg);border:1px solid var(--line);color:var(--text);
  padding:3px 10px;border-radius:999px;font-size:12px;cursor:pointer;
  transition:background .15s,border-color .15s;
}
.odds-thumb:hover:not(:disabled){background:rgba(var(--tint),.12)}
.odds-thumb:disabled{cursor:default;opacity:.6}
.odds-thumb.selected{border-color:var(--gold);background:rgba(var(--accent-rgb),.2)}
.odds-thumb-count{font-family:var(--font-hero);color:var(--gold2);font-size:12px}
.odds-note{color:var(--muted);font-size:11.5px;text-align:center;margin:var(--sp-2) 0 0}

/* Narrow screens: shrink the AI Predictor row so pct/trophy/v/trophy/pct
   still fits on one line instead of the favourite % wrapping onto its own
   oversized line (flex-wrap above is just a safety net, not the plan). */
@media (max-width: 420px) {
  .odds-panel{padding:var(--sp-3) var(--sp-3)}
  .odds-panel-row{gap:8px}
  .odds-pct{font-size:17px}
  .odds-pct.fav{font-size:20px}
  .odds-thumb{padding:3px 7px;font-size:11.5px}
  .odds-thumb-count{font-size:11.5px}
  .odds-vs{width:19px;height:19px;font-size:11px}
}

/* Public thumbs up/down voting on the Win Predictor */
.vote-block{margin-top:10px;text-align:center}
.vote-question{font-size:11.5px;letter-spacing:.08em;color:var(--muted);text-transform:uppercase;margin-bottom:6px}
.vote-buttons{display:flex;justify-content:center;gap:10px}
.vote-btn{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--page-bg);border:1px solid var(--line);color:var(--text);
  padding:6px 12px;border-radius:999px;font-size:13px;font-weight:600;cursor:pointer;
  transition:background .15s,border-color .15s;
}
.vote-btn:hover:not(:disabled){background:rgba(var(--tint),.1)}
.vote-btn:disabled{cursor:default;opacity:.6}
.vote-btn.selected{border-color:var(--gold);background:rgba(var(--accent-rgb),.16);opacity:1}
.vote-count{font-family:var(--font-hero);color:var(--gold2);font-size:13px}

/* Admin: team ratings panel */
.ratings-grid{
  display:grid;grid-template-columns:1fr 90px;gap:10px 14px;align-items:center;
  margin:14px 0;
}
.ratings-grid .rating-name{font-size:14px;color:var(--text)}
.ratings-grid input{text-align:center}
.ratings-note{color:var(--muted);font-size:12.5px;margin:6px 0 4px}

/* Admin: Players panel — pick one of the 20 fixed slots from a dropdown,
   then view/edit their details in a single detail card below it. */
.player-detail-card{
  background:var(--page-bg);border:1px solid var(--line);border-radius:10px;
  padding:16px;display:flex;flex-direction:column;gap:10px;margin-bottom:16px;
}
.player-detail-row{display:flex;justify-content:space-between;gap:10px;font-size:14px;padding:4px 0;border-bottom:1px solid rgba(var(--tint),.06)}
.player-detail-row:last-of-type{border-bottom:none}
.player-detail-label{color:var(--muted)}
.player-detail-field{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.player-detail-note{color:var(--muted);font-size:12.5px;font-style:italic}
.player-detail-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.player-detail-actions button{flex:1;min-width:110px;margin:0}
.player-delete-btn{border-color:var(--loss);color:var(--loss-text)}
.player-delete-btn:hover{background:rgba(var(--loss-rgb),.15)}

/* Man of the Match voting (on played matches) */
.motm-block{margin-top:10px;text-align:center}
.motm-question{font-size:12px;letter-spacing:.05em;color:var(--gold2);margin-bottom:6px;font-weight:600}
.motm-buttons{display:flex;justify-content:center;gap:6px;flex-wrap:wrap}
.motm-btn{
  display:inline-flex;align-items:center;gap:5px;
  background:var(--page-bg);border:1px solid var(--line);color:var(--text);
  padding:5px 10px;border-radius:999px;font-size:12px;font-weight:600;cursor:pointer;
  transition:background .15s,border-color .15s;
}
.motm-btn:hover:not(:disabled){background:rgba(var(--tint),.1)}
.motm-btn:disabled{cursor:default;opacity:.6}
.motm-btn.selected{border-color:var(--gold);background:rgba(var(--accent-rgb),.16);opacity:1}
.motm-count{font-family:var(--font-hero);color:var(--gold2);font-size:12px}

/* Who's voted so far — a tick per player, never who they voted for */
.motm-voted-list{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.motm-voted-chip{
  display:inline-flex;align-items:center;gap:4px;color:var(--muted);
  background:var(--page-bg);border-radius:999px;padding:4px 9px;font-size:12px;
}
.motm-voted-chip.voted{color:var(--text)}

/* Final per-player vote breakdown, shown once everyone's voted — counts
   only, never who cast which vote */
.motm-results{
  display:flex;flex-direction:column;gap:4px;margin:10px auto 0;max-width:220px;
}
.motm-result-row{display:flex;justify-content:space-between;font-size:12.5px;color:var(--text)}

/* Admin: MOTM tally + reset, shown on played matches in Input Scores */
.admin-motm{
  margin-top:10px;padding-top:10px;border-top:1px solid var(--line);
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;
}
.admin-motm-label{color:var(--gold2);font-weight:600}
.admin-motm-tally{color:var(--text);background:var(--page-bg);border-radius:999px;padding:3px 9px}
.admin-motm-tally.muted{color:var(--muted)}
.admin-motm-reset-btn{
  margin-left:auto;background:none;border:1px solid rgba(var(--tint),.2);color:var(--muted);
  padding:5px 12px;font-size:12px;
}
.admin-motm-reset-btn:hover{border-color:var(--loss);color:var(--loss-text)}

/* Who actually cast a vote — only known for ballots cast since this
   feature shipped, so it's kept as its own "Voted:" row rather than
   merged into the always-present received-count pills above. */
.admin-motm-voters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;margin-top:6px}
.admin-motm-tally-btn{
  color:var(--gold2);background:rgba(var(--accent-rgb),.14);border:1px solid var(--line);
  border-radius:999px;padding:3px 9px;font-size:12px;font-weight:600;cursor:pointer;
  transition:background .15s,border-color .15s;
}
.admin-motm-tally-btn:hover{background:rgba(var(--loss-rgb),.22);border-color:var(--loss);color:var(--loss-text)}

/* Confirm dialog (replaces the browser's native confirm()) */
.confirm-overlay{
  position:fixed;inset:0;background:rgba(11,37,69,.55);z-index:300;
  display:flex;align-items:center;justify-content:center;padding:20px;
}
.confirm-box{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px;max-width:340px;width:100%;text-align:center;
}
.confirm-title{font-family:var(--font-hero);color:var(--gold2);font-size:19px;margin-bottom:10px}
.confirm-body{color:var(--text);font-size:14px;line-height:1.45;margin-bottom:18px}
.confirm-actions{display:flex;gap:10px}
.confirm-actions button{flex:1;margin:0;width:auto}

/* Login-based winner prediction */
.predict-block{margin-top:10px;text-align:center}
.predict-question{font-size:11.5px;letter-spacing:.08em;color:var(--muted);text-transform:uppercase;margin-bottom:6px}
.predict-buttons{display:flex;justify-content:center;gap:10px}
.predict-btn{
  flex:1 1 0;min-width:0;min-height:64px;display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center;text-align:center;background:var(--page-bg);border:1.5px solid var(--line);color:var(--text);
  padding:10px 10px 12px;border-radius:12px;font-size:15px;font-weight:700;line-height:1.3;cursor:pointer;
  transition:background .15s,border-color .15s;-webkit-tap-highlight-color:transparent;
}
.predict-btn:hover:not(:disabled){background:rgba(var(--tint),.1)}
.predict-btn:active:not(:disabled){background:rgba(var(--accent-rgb),.2);border-color:var(--gold)}
.predict-btn:disabled{cursor:default;opacity:.6}
.predict-btn.selected{border-color:var(--gold);background:rgba(var(--accent-rgb),.16);opacity:1}
.predictor-locked{margin-top:14px;padding:12px;border:1px dashed var(--line);border-radius:10px;color:var(--muted);font-size:13px;text-align:center}
@media (max-width:480px){
  .predict-buttons{gap:8px}
  .predict-btn{min-height:64px;font-size:14px;padding:8px 6px 10px}
  .predict-btn .form-chip.sm{width:20px;height:20px;font-size:11px}
  .predict-btn .form-chips{gap:3px}
}
.predict-login-link{color:var(--gold2);font-size:12px;text-decoration:underline}

/* Account page: auth toggle, accuracy stat, leaderboard */
.auth-toggle{text-align:center;font-size:13px;color:var(--muted);margin-top:16px}
.auth-toggle a{color:var(--gold2);margin-left:6px}
.accuracy-stat{margin:10px 0 16px}
.accuracy-num{display:block;font-family:var(--font-hero);font-size:44px;color:var(--gold2)}
.accuracy-label{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.leaderboard-row{
  display:grid;grid-template-columns:30px 1fr 70px;align-items:center;gap:10px;
  padding:9px 4px;border-bottom:1px solid rgba(var(--tint),.06);font-size:14px;
}
.leaderboard-row:last-child{border-bottom:none}
.lb-pos{color:var(--gold2);font-weight:bold;font-family:var(--font-hero)}
.lb-name{color:var(--text)}
.lb-score{text-align:right;font-family:var(--font-hero);color:var(--gold2)}

/* Top-left "signed in as" badge with avatar tier, shown on every gated page */
.user-badge-wrap{
  position:fixed;top:calc(14px + var(--motm-offset) + var(--admin-offset));left:14px;z-index:60;
  max-width:calc(100vw - 140px);
}
.user-badge{
  display:flex;align-items:center;gap:7px;max-width:100%;margin:0;
  background:var(--panel);border:1px solid var(--gold);border-radius:999px;
  padding:6px 12px 6px 8px;color:var(--text);cursor:pointer;
  font-family:inherit;font-size:12.5px;font-weight:600;min-height:40px;
}
.user-caret{color:var(--gold2);font-size:11px;margin-left:2px;transition:transform .15s}
.user-badge-wrap.open .user-caret{transform:rotate(180deg)}
.user-menu{
  display:none;position:absolute;top:calc(100% + 8px);left:0;min-width:210px;
  background:var(--panel);border:1px solid var(--gold);border-radius:14px;padding:6px;
  
}
.user-badge-wrap.open .user-menu{display:block}
.user-menu-item{
  display:flex;align-items:center;gap:10px;width:100%;min-height:46px;padding:0 14px;margin:0;
  border:none;border-radius:10px;background:none;color:var(--text);
  font-family:inherit;font-size:14px;font-weight:600;text-decoration:none;text-align:left;cursor:pointer;
}
.user-menu-item:hover{background:rgba(var(--tint),.08)}
.user-menu-item.signout{color:var(--loss-text)}
.user-avatar{font-size:27px;line-height:1}
.user-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Account page: avatar (doubles as the photo-upload button) + tier, team linking */
.account-avatar{
  width:72px;height:72px;margin:0 auto 6px;border-radius:50%;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  font-size:40px;line-height:1;background:var(--page-bg);
}
.account-avatar-btn{
  background:none;border:none;padding:0;cursor:pointer;border-radius:50%;
  transition:opacity .15s;
}
.account-avatar-btn:hover{opacity:.85}
.account-avatar-btn:hover .account-avatar{box-shadow:0 0 0 3px var(--gold)}
.tier-label{color:var(--gold2);font-size:12.5px;margin-top:4px}
.who-email{color:var(--muted);font-size:12px;margin-top:2px}
.account-teammate{color:var(--text);font-size:13px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.account-teammate .teammate-label{color:var(--muted);margin-right:4px}
#my-team-select{margin-bottom:4px}

/* Standalone section heading (not inside a .card), e.g. "Fantasy Padel" */
.section-title{margin:var(--sp-6) 0 var(--sp-4)}
@media(max-width:420px){.team-list{grid-template-columns:minmax(0,1fr)}}
.fantasy-columns{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}
@media(max-width:560px){.fantasy-columns{grid-template-columns:1fr}}

/* Non-dismissible outstanding-MOTM notice at the top of My Account */
.account-motm-banner{
  background:var(--gold2);color:var(--page-bg);text-align:center;font-weight:700;
  padding:12px 16px;border-radius:10px;margin-bottom:16px;
}
.account-motm-banner a{color:var(--on-accent);text-decoration:underline}

/* Dedicated fixture detail page */
#fixture-detail{text-align:center}
.fx-teams{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;font-family:var(--font-hero);font-size:clamp(16px,4vw,22px);color:var(--text)}
.fx-vs{color:var(--gold2);font-size:12px;letter-spacing:.06em}
.fx-round{color:var(--muted);font-size:12px;margin-top:4px}
.fx-body{margin-top:18px}
.fx-score{display:flex;align-items:center;justify-content:center;gap:14px}
.score-val{
  font-family:var(--font-hero);font-size:28px;font-weight:bold;color:var(--ink);
  background:var(--surface);border-radius:6px;padding:6px 18px;min-width:40px;text-align:center;
}
.score-val.win{color:var(--gold2)}
.score-dash{color:var(--muted);font-size:18px}
.fx-breakdown{color:var(--gold2);font-size:13px;margin-top:6px;font-weight:600}
.fx-date{color:var(--muted);font-size:13px}
.motm-note{color:var(--muted);font-size:12px;margin-bottom:8px}
.motm-final{color:var(--gold2);font-family:var(--font-hero);font-size:18px;margin-top:6px}

/* "View this fixture" link used in listings instead of inline voting */
.fx-link{
  display:inline-block;margin-top:8px;color:var(--gold2);font-size:12px;
  text-decoration:none;border:1px solid var(--line);border-radius:999px;
  padding:5px 14px;font-weight:600;letter-spacing:.03em;
}
.fx-link:hover{background:var(--page-bg)}

/* Team photo avatars, shown wherever a team name appears (3x bigger, per request) */
.team-avatars{display:inline-flex;gap:5px;margin-right:10px;vertical-align:middle}
.team-avatar-img{
  width:48px;height:48px;border-radius:50%;object-fit:cover;
  border:2px solid var(--gold);vertical-align:middle;background:var(--surface);
}
.team-avatars.lg{gap:8px;margin:0 0 var(--sp-2)}
.team-avatar-img.lg{width:56px;height:56px;border-width:2px}
/* Hero (Next Matchup): photo sits inline next to the name, same height as
   its 32px text (kept in sync with .matchup-row.hero .matchup-name below) */
.team-avatars.hero{gap:4px;margin-right:8px;vertical-align:middle}
.team-avatar-img.hero{width:32px;height:32px;border-width:1.5px}


/* Fixtures filter panel */
.filter-buttons-row{display:flex;justify-content:center;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-3)}
.filter-toggle{
  display:flex;align-items:center;gap:var(--sp-2);margin:0;
  background:var(--panel);border:1px solid var(--gold);color:var(--gold2);
  padding:var(--sp-2) var(--sp-4);border-radius:999px;font-weight:700;font-size:var(--text-sm);cursor:pointer;
}
.filter-toggle:hover{background:var(--surface-hover)}
.filter-toggle.active{background:var(--gold);color:var(--on-accent)}
.filter-panel{
  display:none;background:var(--panel);border:1px solid var(--line);border-radius:10px;
  padding:var(--sp-4);margin-bottom:var(--sp-4);
}
.filter-panel.open{display:block}
.filter-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--sp-3);margin-bottom:var(--sp-2)}
.filter-row label{margin:0 0 var(--sp-1);font-family:var(--font-hero);font-size:14px;color:var(--gold2);letter-spacing:.06em}
.filter-row select{
  padding-right:42px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230B2545' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;background-size:12px 8px;
}
.filter-actions{display:flex;justify-content:flex-end;gap:var(--sp-2);margin-top:var(--sp-1)}

/* Read-only per-set scoreboard table on the fixture detail page */
.fx-set-table{width:100%;border-collapse:collapse;margin:14px 0}
.fx-set-table th{color:var(--gold2);font-size:12px;letter-spacing:.04em;font-weight:600;padding:6px}
.fx-set-table td{padding:8px 6px;text-align:center;font-family:var(--font-hero);font-size:15px;color:var(--text)}
.fx-set-table td.fx-set-team{text-align:left;font-family:inherit;font-size:13px;color:var(--muted)}
.fx-set-table tr:first-child td, .fx-set-table tr:first-child th{border-bottom:1px solid rgba(var(--tint),.08)}

/* Account page hero stats */
.hero-stats-grid{display:flex;justify-content:space-around;flex-wrap:wrap;gap:14px;text-align:center;margin-top:10px}
.hero-stat{flex:1;min-width:70px}
.hero-stat-num{display:block;font-family:var(--font-hero);font-size:26px;color:var(--text)}
.hero-stat-label{display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-top:2px}
.hero-stat.highlight .hero-stat-num{color:var(--gold2);font-size:30px}
.hero-stat-rating-sub{display:block;font-size:11px;color:var(--muted);font-weight:400;margin-top:1px}
.hero-stats-note{text-align:center;color:var(--muted);font-size:12px;margin:12px 0 0}

/* Headline stats — League Leaders, Most MOTM Awards, Hottest/Coldest Streak */
.headline-stats-grid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-3);
  margin:var(--sp-5) 0;
}
@media(max-width:700px){.headline-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.headline-stat-box{
  background:var(--panel);border:1px solid var(--gold);border-radius:var(--radius);
  padding:var(--sp-3);text-align:center;
}
.headline-stat-label{font-size:var(--text-xs);letter-spacing:.04em;color:var(--muted);text-transform:uppercase;margin-bottom:var(--sp-2)}
.headline-stat-value{font-family:var(--font-hero);font-size:15px;color:var(--gold2);font-weight:700;line-height:1.3}
/* Each tied name (League Leaders/MOTM/streaks) on its own line, shrunk by
   shrinkHeadlineNamesToFit() in app.js so it always stays on one line. */
.headline-stat-name{
  display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:clip;
  line-height:1.35;
}
.headline-stat-sub{display:block;font-family:var(--font-body);font-size:var(--text-xs);color:var(--muted);font-weight:400;margin-top:2px}

/* Gold map-pin icon, drawn in pure CSS (avoids emoji colour-rendering issues) */
.pin-icon{
  display:inline-block;width:8px;height:8px;flex-shrink:0;
  background:var(--gold);border-radius:50% 50% 50% 0;
  transform:rotate(-45deg);margin-right:5px;vertical-align:middle;
}
.matchup-location{color:var(--muted);font-size:var(--text-xs);text-align:center;margin-top:var(--sp-1)}
.location-tbc{color:var(--gold2);font-weight:700}
/* Next Matchup: bigger (+30%); spacing above comes from .nf-matchup-block's
   gap, not a margin here, so it matches the row's own internal gap exactly */
.matchup-location.hero{font-size:calc(var(--text-xs) * 1.3);margin-top:0}

/* Profile photo framing dialog */
.crop-box{max-width:320px}
.crop-canvas{display:block;margin:0 auto 12px;width:260px;height:260px;max-width:100%;border-radius:50%;border:2px solid var(--gold);background:var(--cell-bg);cursor:grab;touch-action:none}
.crop-canvas:active{cursor:grabbing}
.crop-zoom{width:100%;margin:0 0 14px;accent-color:var(--gold)}

/* Fantasy Padel page + menu icon */
.nav-links a{display:inline-flex;align-items:center;gap:.35em}
.nav-link-icon{display:inline-flex;font-size:.85em;}
.fantasy-title-icon{display:inline-flex;vertical-align:-.1em;color:var(--gold2)}
.fantasy-progress{text-align:center;color:var(--gold2);font-size:18px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:var(--sp-3)}
.fantasy-match{padding:var(--sp-3) 0;border-top:1px solid var(--line)}
.fantasy-match:first-of-type{border-top:none}
.fantasy-match-meta{text-align:center;color:var(--muted);font-size:12px;margin-bottom:8px}

/* Form boxes (W/D/L) */
.form-chips{display:flex;gap:5px;flex-shrink:0}
.form-chip{width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;border-radius:5px;font-size:12px;font-weight:800;color:#fff}
.form-chip.W{background:var(--win)}
.form-chip.L{background:var(--loss)}
.form-chip.D{background:var(--draw);color:var(--on-hi)}

/* Home page: Next Matchup -> Fantasy Padel button */
.play-fantasy-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:fit-content;margin:var(--sp-4) auto 0;padding:10px 22px;border-radius:999px;background:var(--gold);color:var(--on-accent);font-weight:700;font-size:var(--text-sm);letter-spacing:.06em;text-transform:uppercase;text-decoration:none}
.play-fantasy-btn:hover{background:var(--ink);color:var(--page-bg)}

/* Fantasy Padel page: pick counts either side of the odds */
.fantasy-odds-row{margin-top:12px;gap:var(--sp-2)}
.odds-votes{font-size:13px;color:var(--text);white-space:nowrap;min-width:38px;text-align:center}

/* Fantasy Padel table */
.fantasy-table-note{color:var(--muted);font-size:12px;text-align:center;margin:0 0 var(--sp-3)}
.fantasy-table{min-width:0;width:100%;border-collapse:collapse;font-size:var(--text-sm)}
.fantasy-table th{font-size:12px;letter-spacing:.06em;padding:6px 4px;text-align:center}
.fantasy-table td{padding:8px 4px;text-align:center;border-top:1px solid rgba(var(--tint),.08)}
.fantasy-table .ft-name{text-align:left;width:100%}
.fantasy-table tr.top3 td{color:var(--gold2);font-weight:700}
.fantasy-table tr.me td{background:rgba(var(--accent-rgb),.12)}

/* League table form column */
.form-chip.sm{width:22px;height:22px;font-size:12px;border-radius:4px}
.form-chip.none{background:rgba(var(--tint),.14);color:rgba(var(--tint),.55);font-weight:600}
.col-form .form-chips{justify-content:center}
.predict-btn .form-chips{gap:4px}
.col-form{padding-left:12px;padding-right:12px}
.fantasy-table-card{margin-top:var(--sp-6)}
.play-fantasy-btn .paddle-icon{width:20px;height:20px;flex-shrink:0}

/* Rules page */
.rules-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3);margin-top:var(--sp-3)}
.rules-stat{display:flex;flex-direction:column;align-items:center;padding:var(--sp-3) var(--sp-2);background:var(--page-bg);border:1px solid var(--line);border-radius:var(--radius)}
.rules-stat-num{font-family:var(--font-hero);font-size:34px;font-weight:700;color:var(--gold2);line-height:1.1}
.rules-stat-label{font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.rules-note{text-align:center;color:var(--muted);font-size:var(--text-sm);margin:var(--sp-2) 0 0}
.rules-sub{margin:var(--sp-5) 0 var(--sp-3);text-align:center;font-family:var(--font-hero);font-size:15px;font-weight:600;letter-spacing:.08em;color:var(--gold2)}
.rules-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.rules-point{display:flex;flex-direction:column;align-items:center;padding:var(--sp-3) var(--sp-2);border-radius:var(--radius);font-weight:700}
.rules-point-label{font-size:var(--text-xs);letter-spacing:.1em}
.rules-point-num{font-family:var(--font-hero);font-size:30px;line-height:1.2}
.rules-point.win{background:rgba(var(--win-rgb),.25);color:var(--win-text)}
.rules-point.draw{background:rgba(var(--accent-rgb),.2);color:var(--gold2)}
.rules-point.loss{background:rgba(var(--loss-rgb),.22);color:var(--loss-text)}
.rules-steps{list-style:none;margin:0;padding:0;display:flex;justify-content:center;gap:var(--sp-3);flex-wrap:wrap}
.rules-steps li{display:flex;align-items:center;gap:var(--sp-2);padding:8px 14px 8px 8px;background:var(--page-bg);border:1px solid var(--line);border-radius:999px;font-size:var(--text-sm)}
.rules-step-num{width:24px;height:24px;border-radius:50%;background:var(--gold);color:var(--on-accent);font-weight:700;font-size:13px;display:inline-flex;align-items:center;justify-content:center}
.rules-callout{text-align:center;padding:var(--sp-4);background:rgba(var(--accent-rgb),.1);border:1px solid var(--line);border-radius:var(--radius);line-height:1.5}
.rules-numbered{list-style:none;counter-reset:rule;margin:var(--sp-3) 0 0;padding:0}
.rules-numbered li{counter-increment:rule;position:relative;padding:14px 0 14px 44px;border-bottom:1px solid rgba(var(--tint),.08);line-height:1.5;font-size:15px}
.rules-numbered li:last-child{border-bottom:none}
.rules-numbered li::before{content:counter(rule);position:absolute;left:0;top:13px;width:28px;height:28px;border-radius:50%;background:var(--gold);color:var(--on-accent);font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center}

/* Book a Court calendar */

/* Headline stats — graphic cards: icon badge, big number, streak dots */
/* Headline stat cards: flat "material" surfaces — soft elevation, a slim accent edge, tonal icon chip, no glow. */
.headline-stat-box{--accent:var(--gold2);position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;text-align:left;
  background:var(--panel);border:1px solid rgba(var(--tint),.07);border-left:4px solid var(--accent);border-radius:12px;padding:var(--sp-4);
  transition:transform .2s ease}
.headline-stat-box:hover{transform:translateY(-1px)}
.headline-stat-box.stat-games{--accent:var(--acc-gold)}
.headline-stat-box.stat-leader{--accent:var(--acc-gold)}
.headline-stat-box.stat-motm{--accent:var(--acc-green)}
.headline-stat-box.stat-hot{--accent:var(--acc-orange)}
.headline-stat-box.stat-cold{--accent:var(--acc-blue)}
.stat-head{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-3);min-width:0}
.stat-icon{flex:none;width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;margin-bottom:var(--sp-2);background:color-mix(in srgb,var(--accent) 18%,transparent)}
.stat-head .stat-icon{margin-bottom:0}
.headline-stat-box .headline-stat-label{margin:0;color:var(--muted);font-weight:600;letter-spacing:.08em;font-size:11px}
.stat-big{font-family:var(--font-hero);font-size:38px;font-weight:600;line-height:1;color:var(--text)}
.stat-unit{font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--accent);font-weight:600;margin:6px 0 var(--sp-3)}
.stat-pips{display:flex;gap:4px;margin-bottom:var(--sp-3)}
.stat-pips span{width:8px;height:8px;border-radius:50%;background:var(--accent)}
.stat-none{color:var(--muted);font-size:var(--text-sm);padding:var(--sp-2) 0}
.headline-stat-box .headline-stat-value{width:100%;color:var(--text);font-size:15px;font-weight:600;padding-top:var(--sp-2);border-top:1px solid rgba(var(--tint),.08)}

/* Fixture page: team comparison */
.compare-block{margin-top:var(--sp-5);padding:var(--sp-3);background:var(--page-bg);border:1px solid var(--line);border-radius:var(--radius)}
.compare-title{text-align:center;font-family:var(--font-hero);color:var(--gold2);letter-spacing:.1em;font-size:14px;margin-bottom:var(--sp-3)}
.compare-teams,.compare-row{display:grid;grid-template-columns:minmax(0,1fr) 92px minmax(0,1fr);align-items:center;text-align:center;gap:6px}
.compare-teams{font-size:12px;color:var(--muted);margin-bottom:var(--sp-2);line-height:1.3}
.compare-row{padding:7px 0;border-top:1px solid rgba(var(--tint),.07)}
.compare-label{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.compare-val{font-family:var(--font-hero);font-size:18px;color:var(--text)}
.compare-val.better{color:var(--gold2);font-weight:700;}

/* Admin: player-submitted scores awaiting approval */
.pending-summary-box{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px;margin-bottom:var(--sp-4);background:rgba(var(--accent-rgb),.12);border:1px solid var(--gold);border-radius:var(--radius)}
.pending-summary-box b{flex-basis:100%;color:var(--gold2)}
.pending-jump{margin:0;padding:6px 12px;font-size:12px;border-radius:999px}
.pending-submission{margin-top:var(--sp-3);padding:10px 12px;background:rgba(var(--accent-rgb),.12);border:1px solid var(--gold);border-radius:var(--radius);font-size:13px;line-height:1.5}
.pending-actions{display:flex;gap:8px;margin-top:8px}
.pending-actions button{margin:0;padding:7px 16px;font-size:12px}
.approve-sub-btn{background:var(--gold);color:var(--on-accent)}
.reject-sub-btn{background:none;border:1px solid rgba(var(--tint),.2);color:var(--muted)}
.reject-sub-btn:hover{border-color:var(--loss);color:var(--loss-text)}

/* Fixture page: player score submission */
.submit-score-block{margin:var(--sp-4) 0;padding:var(--sp-3);background:var(--page-bg);border:1px solid var(--line);border-radius:var(--radius);text-align:center}
.submit-score-block.pending{border-color:var(--gold);background:rgba(var(--accent-rgb),.1)}
.submit-score-title{font-family:var(--font-hero);color:var(--gold2);margin-bottom:var(--sp-2)}
.submit-score-line{font-size:var(--text-sm);color:var(--text)}
.submit-score-open{margin:0}
.submit-score-teams{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);font-size:12px;color:var(--muted);margin-bottom:var(--sp-2)}
.submit-score-row{display:flex;align-items:center;justify-content:center;gap:10px;margin:10px 0}
.submit-score-set{width:92px;text-align:left;font-size:var(--text-sm);color:var(--gold2)}
.submit-score-set small{color:var(--muted)}
.submit-score-input{width:64px;height:52px;text-align:center;font-size:22px;font-weight:700;padding:0}
.submit-score-dash{color:var(--muted);font-size:20px}
.submit-score-error{color:var(--loss);font-size:12px;min-height:1.2em;margin-top:6px}
.submit-score-actions{display:flex;gap:10px;margin-top:var(--sp-2)}
.submit-score-actions button{flex:1;margin:0}

/* League page: results grid */
.results-grid-card{margin-top:var(--sp-5)}
.results-grid{min-width:0;width:auto;border-collapse:separate;border-spacing:3px;font-size:12px}
.results-grid th{font-size:12px;color:var(--gold2);padding:2px;text-align:center;font-weight:700}
.results-grid .grid-team{position:sticky;left:0;z-index:2;background:var(--cell-bg);text-align:left;white-space:nowrap;padding:4px 10px 4px 4px;font-family:var(--font-body);font-weight:600;color:var(--text);font-size:12px}
.results-grid .grid-pos{display:inline-block;width:20px;color:var(--gold2);font-weight:700}
.results-grid .grid-corner{position:sticky;left:0;z-index:2;background:var(--cell-bg)}
.grid-cell{width:42px;height:38px;min-width:42px;text-align:center;border-radius:6px;padding:0}
.grid-cell a{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;color:inherit;text-decoration:none;font-weight:800;font-size:13px;line-height:1.1}
.grid-cell a small{font-size:11px;font-weight:600;opacity:.9}
.grid-cell.W{background:var(--win);color:#fff}
.grid-cell.L{background:var(--loss);color:#fff}
.grid-cell.D{background:var(--draw);color:var(--on-hi)}
.grid-cell.S{background:rgba(var(--hi-rgb),.18);color:var(--gold2)}
.grid-cell.N{background:var(--page-bg);color:var(--muted)}
.grid-self{background:repeating-linear-gradient(45deg,rgba(var(--tint),.05) 0 4px,transparent 4px 8px);border-radius:6px}
.grid-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--sp-3);margin-top:var(--sp-3);font-size:12px;color:var(--muted)}
.grid-legend i{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-1px;margin-right:4px}
.cell-key.W{background:var(--win)}.cell-key.L{background:var(--loss)}.cell-key.D{background:var(--draw)}
.cell-key.S{background:rgba(var(--hi-rgb),.4)}.cell-key.N{background:rgba(var(--tint),.2)}

/* Season stats page */
.stats-summary{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--sp-4);margin-bottom:var(--sp-4)}
.stats-summary-item{text-align:center;padding:var(--sp-3) var(--sp-4);background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);min-width:110px}
.stats-summary-item span{display:block;font-family:var(--font-hero);font-size:28px;font-weight:700;color:var(--gold2);line-height:1.1}
.stats-summary-item small{font-size:14px;color:var(--muted)}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--sp-3);margin-bottom:var(--sp-5)}
.stats-card .stats-lines{width:100%}
.stats-line{font-size:13px;line-height:1.35;color:var(--text);margin-top:4px}
.stats-line small{color:var(--muted);font-size:12px}

/* League table: dotted line under 4th place */
tbody tr.cutoff td{border-bottom:2px dotted var(--gold2)}
tbody tr.top4 td{background:rgba(var(--hi-rgb),.12)}
tbody tr.top4 .col-pos,tbody tr.top4 .col-team,tbody tr.top4 .col-pts{background:color-mix(in srgb,var(--acc-gold) 14%,var(--cell-bg))}
#table tr.top4:hover td:not(.col-pos):not(.col-team):not(.col-pts){background:rgba(var(--hi-rgb),.2)}
#table tr.top4:hover .col-pos,#table tr.top4:hover .col-team,#table tr.top4:hover .col-pts{background:color-mix(in srgb,var(--acc-gold) 22%,var(--cell-bg))}

/* Fantasy Padel: rules card, tags, Baller card, table tabs */
.fantasy-rules{margin-bottom:var(--sp-5)}
.fantasy-rules-list{margin:var(--sp-3) 0 0;padding-left:20px;font-size:var(--text-sm);line-height:1.6;color:var(--text)}
.fantasy-rules-list li{margin-bottom:4px}
.baller-status{text-align:center;font-size:var(--text-sm);color:var(--muted);margin:0 0 var(--sp-3);line-height:1.5}
.baller-status.used{color:var(--gold2)}
.fantasy-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:10px}
.fantasy-tag{font-size:12px;font-weight:700;padding:5px 12px;border-radius:999px;border:1px solid}
.fantasy-tag.underdog{color:var(--acc-gold);border-color:var(--acc-gold);background:rgba(var(--hi-rgb),.12)}
.fantasy-tag.baller{color:var(--lime-text);border-color:var(--lime-text);background:rgba(var(--lime-rgb),.14)}
.baller-btn{margin:0;padding:8px 16px;font-size:13px;border-radius:999px;border:1px solid var(--lime);color:var(--lime-text);background:rgba(var(--lime-rgb),.08);font-weight:700;cursor:pointer}
.baller-btn:hover{background:rgba(var(--lime-rgb),.2)}
.fantasy-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:var(--sp-3)}
.fantasy-tab{margin:0;flex:0 0 auto;padding:7px 14px;font-size:12px;border-radius:999px;background:none;border:1px solid var(--line);color:var(--muted);cursor:pointer}
.fantasy-tab.active{background:var(--gold);color:var(--on-accent);border-color:var(--gold)}

/* Roomier tap targets on touch screens */
@media (pointer:coarse){
  .filter-toggle,.fantasy-tab,.book-chip,.round-tab,.pending-jump,.baller-btn,
  .pending-actions button,.approve-sub-btn,.reject-sub-btn,
  .confirm-actions button,.btn-ghost{min-height:44px}
  .vote-btn,.motm-btn,.predict-btn,.submit-score-actions button{min-height:48px}
  .team-row{min-height:76px}
  .burger-btn{min-width:44px;min-height:44px}
}

/* Fantasy Padel: interactive how-it-works */
.fantasy-rules{padding:0;overflow:hidden}
.howto-head{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin:0;padding:var(--sp-3) var(--sp-4);background:none;border:none;border-radius:0;cursor:pointer}
.howto-title{font-family:var(--font-hero);font-size:var(--text-h2);letter-spacing:1px;color:var(--gold2)}
.howto-caret{color:var(--gold2);transition:transform .2s}
.fantasy-rules.collapsed .howto-caret{transform:rotate(-90deg)}
.howto-body{padding:0 var(--sp-4) var(--sp-4);border-top:1px solid var(--line);padding-top:var(--sp-4)}
.howto-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.howto-tile{display:flex;flex-direction:column;align-items:center;gap:2px;margin:0;padding:var(--sp-3) var(--sp-2);border-radius:var(--radius);background:var(--page-bg);border:1.5px solid var(--line);color:var(--text);cursor:pointer;transition:transform .15s,border-color .15s,background .15s;font-family:inherit}
.howto-tile:hover{transform:translateY(-2px)}
.howto-tile.active{border-color:var(--gold);background:rgba(var(--accent-rgb),.16);transform:translateY(-3px);}
.howto-tile.underdog.active{border-color:var(--acc-gold)}
.howto-tile.baller.active{border-color:var(--lime-text);background:rgba(var(--lime-rgb),.16)}
.howto-mult{font-family:var(--font-hero);font-size:30px;font-weight:700;color:var(--gold2);line-height:1}
.howto-tile.baller .howto-mult{color:var(--lime-text)}
.howto-icon{font-size:26px;margin:2px 0}
.howto-name{font-weight:700;font-size:var(--text-sm)}
.howto-sub{font-size:var(--text-xs);color:var(--muted)}
.howto-sim{margin-top:var(--sp-4);padding:var(--sp-3) var(--sp-4);background:var(--page-bg);border:1px solid var(--line);border-radius:var(--radius);text-align:center}
.howto-sim-title{font-family:var(--font-hero);color:var(--gold2);letter-spacing:.08em;font-size:14px;margin-bottom:var(--sp-3)}
.howto-bar-label{font-size:var(--text-xs);color:var(--muted);margin-bottom:6px}
.howto-bar{position:relative;height:30px;border-radius:999px;background:rgba(var(--tint),.1);overflow:hidden}
.howto-bar-fill{position:absolute;inset:0 auto 0 0;width:60%;background:linear-gradient(90deg,var(--win),var(--acc-green));border-radius:999px;transition:width .12s linear,background .2s}
.howto-bar-fill.underdog{background:linear-gradient(90deg,var(--acc-orange),var(--acc-gold))}
.howto-bar-pct{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-hero);font-weight:700;font-size:16px;color:#fff;}
.howto-slider{width:100%;margin:12px 0 4px;accent-color:var(--gold);height:28px;padding:0;background:none;border:none}
.howto-sim-row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);flex-wrap:wrap;margin-top:var(--sp-2)}
.howto-switch{display:flex;align-items:center;gap:8px;margin:0;font-size:var(--text-sm);color:var(--text);cursor:pointer}
.howto-switch input{position:absolute;opacity:0;width:0;height:0}
.howto-switch-track{width:46px;height:26px;border-radius:999px;background:rgba(var(--tint),.18);position:relative;transition:background .2s;flex:0 0 auto}
.howto-switch-track i{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s}
.howto-switch input:checked + .howto-switch-track{background:var(--lime)}
.howto-switch input:checked + .howto-switch-track i{transform:translateX(20px)}
.howto-switch input:focus-visible + .howto-switch-track{outline:2px solid var(--gold2);outline-offset:2px}
.howto-result{display:flex;flex-direction:column;align-items:center;min-width:110px}
.howto-result-label{font-size:var(--text-xs);color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.howto-points{font-family:var(--font-hero);font-size:44px;font-weight:700;color:var(--gold2);line-height:1.05}
.howto-points.pop{animation:howto-pop .35s ease}
@keyframes howto-pop{0%{transform:scale(.7)}60%{transform:scale(1.18)}100%{transform:scale(1)}}
.howto-why{margin-top:var(--sp-2);font-size:var(--text-sm);color:var(--text);min-height:2.6em;line-height:1.4}
.howto-foot{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 16px;margin-top:var(--sp-3);font-size:var(--text-xs);color:var(--muted)}
@media(max-width:420px){.howto-mult{font-size:26px}.howto-points{font-size:38px}}
@media (prefers-reduced-motion:reduce){.howto-points.pop{animation:none}.howto-tile,.howto-bar-fill{transition:none}}

/* Baller card toggle (before picking) + table marker */
.baller-toggle{display:block;width:100%;margin:0 0 var(--sp-2);padding:10px 12px;border-radius:var(--radius);border:1.5px dashed var(--lime);color:var(--lime-text);background:rgba(var(--lime-rgb),.07);font-weight:700;font-size:var(--text-sm);cursor:pointer;font-family:inherit}
.baller-toggle:hover{background:rgba(var(--lime-rgb),.16)}
.baller-toggle.on{border-style:solid;background:rgba(var(--lime-rgb),.22)}
.table-baller{font-size:13px}

.howto-tile.baller .howto-icon{}
.fantasy-tag.baller{font-weight:800}

/* Padel+ account overhaul */
.login-perks{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 var(--sp-4)}
.login-perks span{font-size:var(--text-xs);padding:5px 12px;border-radius:999px;background:var(--page-bg);border:1px solid var(--line);color:var(--text)}

.profile-card{padding:0;overflow:hidden;text-align:center}
.profile-banner{height:78px;background:linear-gradient(135deg,rgba(var(--lime-rgb),.35),rgba(var(--accent-rgb),.35) 60%,rgba(111,195,238,.25))}
.profile-top{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:-44px;padding:0 var(--sp-4)}
.profile-top .account-avatar-btn{position:relative;display:block}
.profile-top .account-avatar{width:92px;height:92px;margin:0;border:3px solid var(--gold);background:var(--surface);font-size:48px;}
.avatar-edit{position:absolute;right:-2px;bottom:2px;width:30px;height:30px;border-radius:50%;background:var(--gold);color:var(--on-accent);display:flex;align-items:center;justify-content:center;font-size:15px;}
.profile-name{font-family:var(--font-hero);font-size:24px;font-weight:700;color:var(--text);line-height:1.2}
.profile-team{color:var(--gold2);font-size:var(--text-sm);font-weight:600}
.profile-card .error-msg{margin:4px var(--sp-4) 0}
.tier-label{font-size:var(--text-sm);font-weight:700;color:var(--gold2);margin:0 0 6px}
.tier-next{font-size:var(--text-xs);color:var(--muted);margin-top:6px}
.my-team-note{color:var(--muted);font-size:var(--text-xs);margin:var(--sp-3) var(--sp-4) var(--sp-4);line-height:1.5}

.stat-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:var(--sp-3)}
.stat-tile{display:flex;flex-direction:column;align-items:center;padding:var(--sp-3) var(--sp-2);background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.stat-tile-icon{font-size:22px;margin-bottom:2px}
.stat-tile-num{font-family:var(--font-hero);font-size:30px;font-weight:700;color:var(--text);line-height:1.1}
.stat-tile-label{font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:2px}
.stat-tile-sub{font-size:var(--text-xs);color:var(--muted);margin-top:2px}
.stat-tile.rank{border-color:var(--gold);background:linear-gradient(180deg,rgba(var(--accent-rgb),.16),var(--panel))}
.stat-tile.rank .stat-tile-num{color:var(--gold2);font-size:34px}

.season-charts{padding:var(--sp-4)}
.sc-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-4)}
@media(max-width:600px){.sc-grid{grid-template-columns:minmax(0,1fr)}}
.sc-block{padding:var(--sp-3);background:var(--page-bg);border:1px solid var(--line);border-radius:var(--radius)}
.sc-wide{margin-top:var(--sp-4)}
.sc-title{font-family:var(--font-hero);font-size:14px;color:var(--gold2);letter-spacing:.04em;margin-bottom:var(--sp-3);text-align:center}
.sc-record{display:flex;flex-direction:column;align-items:center;gap:var(--sp-3)}
.donut{width:150px;height:150px}
.donut-num{font-family:var(--font-hero);font-size:24px;font-weight:700;fill:var(--text)}
.donut-cap{font-size:10px;letter-spacing:.1em;fill:var(--muted)}
.sc-form{display:flex;align-items:center;gap:10px}
.sc-form-label{font-size:var(--text-xs);color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.rb-bar{display:flex;height:22px;border-radius:999px;overflow:hidden;background:rgba(var(--tint),.1)}
.rb-seg.a,.rb-dot.a{background:var(--acc-gold)}
.rb-seg.b,.rb-dot.b{background:var(--acc-green)}
.rb-seg.c,.rb-dot.c{background:var(--acc-blue)}
.rb-seg.d,.rb-dot.d{background:var(--acc-orange)}
.rb-legend{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;margin-top:var(--sp-3);font-size:var(--text-xs);color:var(--muted)}
.rb-legend b{color:var(--text)}
.rb-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px}
.rb-total{text-align:center;margin-top:var(--sp-3);font-family:var(--font-hero);color:var(--gold2);font-size:18px}
.gc-chart{display:flex;align-items:flex-end;justify-content:space-around;gap:6px;height:150px;overflow-x:auto;padding-top:14px}
.gc-group{display:flex;flex-direction:column;align-items:center;flex:1 0 34px;height:100%}
.gc-bars{display:flex;align-items:flex-end;gap:3px;flex:1;width:100%;justify-content:center}
.gc-bar{width:13px;min-height:3px;border-radius:4px 4px 0 0;position:relative}
.gc-bar span{position:absolute;top:-14px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--muted)}
.gc-bar.for,.gc-key.for{background:var(--win)}
.gc-bar.against,.gc-key.against{background:var(--loss)}
.gc-key{display:inline-block;width:10px;height:10px;border-radius:2px;vertical-align:-1px;margin:0 2px}
.gc-label{font-size:var(--text-xs);color:var(--muted);margin-top:4px}

/* Fantasy Padel: my picks history + weekly winners */
.fh-summary{display:flex;justify-content:center;gap:var(--sp-5);margin-bottom:var(--sp-3)}
.fh-summary div{text-align:center}
.fh-summary b{display:block;font-family:var(--font-hero);font-size:28px;color:var(--gold2);line-height:1.1}
.fh-summary b small{font-size:15px;color:var(--muted)}
.fh-summary span{font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.fh-spark{display:block;width:100%;height:64px;margin:0 0 var(--sp-3);background:var(--page-bg);border-radius:var(--radius)}
.fh-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px var(--sp-3);align-items:center;padding:10px 0;border-top:1px solid rgba(var(--tint),.08)}
.fh-when{grid-column:1 / -1;font-size:var(--text-xs);color:var(--muted);letter-spacing:.04em}
.fh-teams{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:var(--text-sm);min-width:0}
.fh-team{color:var(--muted)}
.fh-team.picked{color:var(--text);font-weight:800;text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}
.fh-score{font-family:var(--font-hero);color:var(--gold2);font-weight:700}
.fh-outcome{text-align:right;display:flex;flex-direction:column;align-items:flex-end}
.fh-outcome small{font-size:var(--text-xs);color:var(--muted)}
.fh-out{font-weight:800;font-size:15px}
.fh-out.win{color:var(--win-text)}
.fh-out.loss{color:var(--loss-text)}
.weekly-winners{margin-top:var(--sp-5);padding-top:var(--sp-3);border-top:1px solid var(--line)}
.weekly-title{font-family:var(--font-hero);color:var(--gold2);letter-spacing:.06em;font-size:14px;text-align:center;margin-bottom:var(--sp-2)}
.weekly-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--sp-3);align-items:center;padding:7px 0;border-top:1px solid rgba(var(--tint),.07);font-size:var(--text-sm)}
.weekly-row.live{background:var(--page-bg);border-radius:6px;padding-left:6px;padding-right:6px}
.weekly-week{color:var(--muted);white-space:nowrap}
.weekly-week small{font-size:var(--text-xs)}
.weekly-who{text-align:center;font-weight:700;color:var(--text)}
.weekly-pts{color:var(--gold2);font-weight:700;white-space:nowrap}
.table-weeks{font-size:12px}

/* Admin-only: submitted scores awaiting approval (sits under the MOTM banner) */
.admin-banner{
  position:fixed;top:var(--motm-offset);left:0;right:0;z-index:98;
  display:block;text-align:center;text-decoration:none;
  background:var(--lime);color:var(--on-hi);font-size:13px;font-weight:700;
  padding:10px 16px;
}
.admin-banner:hover{text-decoration:underline}
.results-grid .grid-colhead{font-size:12px;padding:2px 0;min-width:42px;border-radius:6px}
.results-grid .grid-team{width:30px;min-width:30px;text-align:center;padding:4px 2px;border-radius:6px}
.results-grid .grid-team.hl,.results-grid .grid-colhead.hl{background:var(--gold);color:var(--on-accent)}
.grid-layout{display:flex;align-items:flex-start;gap:var(--sp-4);flex-wrap:wrap}
.grid-scroll{overflow-x:auto;max-width:100%;flex:0 1 auto;-webkit-overflow-scrolling:touch}
.grid-key{list-style:none;margin:0;padding:0;flex:1 1 210px;min-width:200px}
.grid-key li{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:8px;font-size:var(--text-sm);color:var(--muted);transition:background .12s,color .12s}
.gk-num{width:24px;height:24px;border-radius:50%;background:rgba(var(--tint),.1);color:var(--gold2);font-weight:800;font-size:12px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.grid-key li.hl{background:rgba(var(--accent-rgb),.22);color:var(--text);font-weight:700;box-shadow:inset 0 0 0 1px var(--gold)}
.grid-key li.hl .gk-num{background:var(--gold);color:var(--on-accent)}
.results-grid td.grid-cell:hover{outline:2px solid var(--gold);outline-offset:-1px}
.grid-cell.S a{font-size:12px}
.grid-cell.S a small{font-size:9.5px;opacity:1;white-space:nowrap}

/* ===== Admin Input Scores — phone-first rework ===== */
.admin-filters{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:var(--sp-3)}
.admin-chip{margin:0;flex:0 0 auto;padding:10px 16px;border-radius:999px;background:none;border:1px solid var(--line);color:var(--muted);font-size:var(--text-sm);font-weight:700;cursor:pointer;min-height:44px}
.admin-chip.active{background:var(--gold);color:var(--on-accent);border-color:var(--gold)}
.admin-chip-count{display:inline-block;min-width:22px;padding:1px 7px;margin-left:4px;border-radius:999px;background:var(--lime);color:var(--on-hi);font-size:12px;text-align:center}
.admin-chip-count.zero{background:rgba(var(--tint),.15);color:var(--muted)}
.admin-chip.active .admin-chip-count.zero{background:rgba(0,0,0,.15);color:var(--on-accent)}

.admin-match{padding:0;overflow:hidden}
.admin-match.attention{border-color:var(--lime-text)}
.am-head{display:flex;align-items:center;gap:var(--sp-3);width:100%;margin:0;padding:14px 14px;background:none;border:none;border-radius:0;text-align:left;cursor:pointer;color:var(--text);min-height:64px}
.am-teams{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.am-team{font-weight:700;font-size:15px;line-height:1.25}
.am-round{display:inline-block;font-style:normal;font-size:11px;font-weight:800;padding:1px 7px;margin-right:6px;border-radius:999px;background:rgba(var(--tint),.12);color:var(--gold2)}
.am-v{font-size:11px;color:var(--muted);letter-spacing:.08em}
.am-meta{display:flex;flex-direction:column;align-items:flex-end;gap:3px;text-align:right;flex:0 1 auto;max-width:48%}
.am-when{font-size:12px;color:var(--muted)}
.am-result{font-family:var(--font-hero);font-size:18px;font-weight:700;color:var(--gold2)}
.am-flag{font-size:12px;font-weight:700;color:var(--lime-text)}
.am-caret{color:var(--gold2);transition:transform .2s;flex:0 0 auto}
.admin-match.open .am-caret{transform:rotate(180deg)}
.am-body{display:none;padding:0 14px 14px;border-top:1px solid rgba(var(--tint),.08)}
.admin-match.open .am-body{display:block}

.am-section-title{margin:14px 0 6px;font-family:var(--font-hero);color:var(--gold2);font-size:15px}
.am-section-title span{font-family:var(--font-body);font-size:12px;color:var(--muted);margin-left:6px}
.admin-match .set-grid{display:block}
.am-set{padding:10px 0;border-top:1px solid rgba(var(--tint),.08)}
.am-set-label{font-size:13px;font-weight:700;color:var(--gold2);margin-bottom:4px}
.am-set-label small{font-weight:400;color:var(--muted);margin-left:6px}
.am-side{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:5px 0}
.am-side-name{flex:1;min-width:0;font-size:14px;line-height:1.25}
.am-set3.hidden{display:none}
.am-step{display:flex;align-items:center;justify-content:center;gap:6px}
.step-btn{margin:0;width:48px;height:48px;padding:0;border-radius:12px;font-size:26px;line-height:1;font-weight:700;background:rgba(var(--tint),.08);border:1px solid var(--line);color:var(--gold2);cursor:pointer;touch-action:manipulation;flex:0 0 auto}
.step-btn:active:not(:disabled){background:var(--gold);color:var(--on-accent)}
.step-btn:disabled{opacity:.35;cursor:default}
.am-step input{width:56px;height:48px;padding:0;text-align:center;font-size:26px;font-weight:700}
.admin-match .match-footer{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);margin-top:var(--sp-3)}
.admin-match .save-btn{margin:0;flex:1;min-height:52px;font-size:16px;font-weight:800;background:var(--gold);color:var(--on-accent);border-radius:12px}
.admin-match .sets-result{font-size:14px;color:var(--muted);white-space:nowrap}
.admin-match .sets-result b{color:var(--gold2);font-size:18px}
.am-schedule{margin-top:var(--sp-4);border:1px solid rgba(var(--tint),.1);border-radius:var(--radius);padding:0 12px}
.am-schedule summary{cursor:pointer;padding:14px 0;font-weight:700;color:var(--gold2);min-height:44px}
.am-schedule .schedule-row{display:flex;flex-direction:column;align-items:stretch;gap:12px;padding-bottom:14px;margin:0}
.am-schedule .schedule-row input[type=datetime-local],.am-schedule .schedule-row select{width:100%;min-width:0;min-height:48px;font-size:16px}
.am-schedule-actions{display:flex;gap:10px;flex-wrap:wrap}
.am-schedule-actions button{flex:1;min-height:48px;margin:0}
.pending-actions button{min-height:48px;flex:1;font-size:15px;white-space:nowrap}
/* Narrow phones: use the width, stack the card header */
@media(max-width:600px){
  .admin-panel{padding:14px 10px}
  .admin-chip{padding:8px 12px;font-size:13px}
  .am-head{flex-wrap:wrap;align-items:flex-start;position:relative;padding:12px}
  .am-teams{flex:1 1 100%;padding-right:26px}
  .am-meta{flex:1 1 100%;max-width:none;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;text-align:left;gap:4px 10px}
  .am-caret{position:absolute;right:12px;top:14px}
  .am-body{padding:0 12px 12px}
}

/* Results grid: cells show the score only; W/L lives on the key highlight */
.grid-cell a{font-size:14px}
.grid-key li.hl-W{background:rgba(var(--win-rgb),.3);box-shadow:inset 0 0 0 1px var(--win)}
.grid-key li.hl-L{background:rgba(var(--loss-rgb),.3);box-shadow:inset 0 0 0 1px var(--loss)}
.grid-key li.hl-D{background:rgba(var(--draw-rgb),.3);box-shadow:inset 0 0 0 1px var(--draw)}
.grid-key li.hl-W .gk-num{background:var(--win);color:#fff}
.grid-key li.hl-L .gk-num{background:var(--loss);color:#fff}
.grid-key li.hl-D .gk-num{background:var(--draw);color:var(--on-hi)}
.grid-key li[data-tag]{position:relative}
.grid-key li[data-tag]::after{content:attr(data-tag);margin-left:auto;padding:1px 9px;border-radius:999px;font-size:12px;font-weight:800;color:#fff}
.grid-key li.hl-W::after{background:var(--win)}
.grid-key li.hl-L::after{background:var(--loss)}
.grid-key li.hl-D::after{background:var(--draw);color:var(--on-hi)}

/* Results grid: key spreads evenly over the grid's full height */
.grid-layout{align-items:stretch}
.grid-key{display:flex;flex-direction:column;justify-content:space-between;gap:8px;padding:2px 0}
.grid-key li{padding:8px 10px}

/* Results grid: view toggle + by-round view */
.grid-view-toggle{display:flex;justify-content:center;gap:0;margin:0 auto var(--sp-3);width:fit-content;border:1px solid var(--gold);border-radius:999px;overflow:hidden}
.grid-view-btn{margin:0;padding:9px 18px;border:none;border-radius:0;background:none;color:var(--gold2);font-size:var(--text-sm);font-weight:700;cursor:pointer;min-height:40px}
.grid-view-btn.active{background:var(--gold);color:var(--on-accent)}
.results-grid.by-round .grid-cell{width:50px;min-width:50px;height:44px}
.results-grid.by-round .grid-cell a{font-size:13px}
.results-grid.by-round .grid-cell a small{display:block;font-size:10px;font-weight:600;opacity:.85}
.results-grid .round-head{min-width:50px}

/* ===== Admin portal — one consistent layout (phone first) ===== */
/* Section switch (Results / Players / Team Ratings): a centred segmented control */
.seg-tabs{display:grid;grid-template-columns:repeat(3,1fr);margin:0 auto var(--sp-4);border:1px solid var(--gold);border-radius:999px;overflow:hidden;max-width:520px}
.seg-tabs .round-tab{margin:0;border:none;border-radius:0;padding:12px 6px;min-height:46px;font-size:14px;font-weight:700;color:var(--gold2);text-align:center;background:none}
.seg-tabs .round-tab.active{background:var(--gold);color:var(--on-accent)}

/* Filter chips: three equal, centred columns */
.admin-filters{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;overflow:visible;padding-bottom:0;margin-bottom:var(--sp-3)}
.admin-chip{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:100%;padding:8px 6px;min-height:54px;text-align:center;line-height:1.2;white-space:normal;font-size:13px}
.admin-chip-count{margin-left:0}

/* Round picker: an even grid, centred, nothing hidden off-screen */
#admin-round-tabs.round-tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:8px;overflow:visible;padding-bottom:0;margin-bottom:var(--sp-4)}
#admin-round-tabs .round-tab{text-align:center;padding:10px 6px;min-height:44px;margin:0}

/* Section intro lines + notes are centred and muted everywhere */
.ratings-note{color:var(--muted);font-size:13px;line-height:1.5;text-align:center;margin:0 0 var(--sp-3)}

/* Players panel */
#player-select{margin:0 0 var(--sp-4)}
.player-detail-card{padding:var(--sp-4);gap:var(--sp-3);margin-bottom:var(--sp-4)}
.player-detail-row{padding:8px 0;align-items:baseline}
.player-detail-row span:last-child{text-align:right;word-break:break-word}
.player-detail-field{margin:0;gap:6px}
.player-detail-actions{margin-top:var(--sp-2);gap:var(--sp-3)}
.player-detail-actions button{flex:1;min-width:120px;max-width:none;min-height:48px;margin:0;display:inline-flex;align-items:center;justify-content:center}
.player-detail-note{text-align:center}

/* Team ratings panel */
.ratings-grid{margin:var(--sp-3) 0 var(--sp-4);gap:var(--sp-3) var(--sp-4);grid-template-columns:1fr 88px}
.ratings-grid input{text-align:center}
#save-ratings-btn{margin:0 auto;display:block;width:100%;max-width:none;min-height:52px}

/* Admins-only notice */
.admin-notice{text-align:center}
.admin-notice .btn-ghost{margin-top:var(--sp-3);min-height:44px;display:inline-flex;align-items:center}

/* Man of the Match block inside a played match */
.admin-motm{margin-top:var(--sp-4);padding-top:var(--sp-4);gap:8px}
.admin-motm-label{flex:1 1 100%;font-size:13px}
.admin-motm-label small{font-weight:400;color:var(--muted);font-size:12px}
.admin-motm-tally{padding:6px 12px;font-size:13px}
.admin-motm-reset-btn{flex:1 1 100%;margin:4px 0 0;min-height:44px}
.admin-motm-voters{margin-top:var(--sp-3);gap:8px}
.admin-motm-voters .admin-motm-label{flex:1 1 100%}
.admin-motm-tally-btn{padding:8px 14px;font-size:13px;min-height:40px}

@media(max-width:600px){
  .admin-panel{margin:var(--sp-3) auto;padding:var(--sp-3)}
}

.admin-chip{position:relative;gap:0;padding:10px 6px 8px;min-height:60px}
.admin-chip-icon{font-size:18px;line-height:1.1}
.admin-chip-label{font-size:12.5px;font-weight:700}
.admin-chip .admin-chip-count{position:absolute;top:-6px;right:-4px;min-width:22px;padding:1px 6px;font-size:11px;box-shadow:0 0 0 2px var(--panel)}
.admin-chip.active .admin-chip-count{box-shadow:0 0 0 2px var(--gold)}

/* Wide screens: keep the controls a sensible, centred width */
.admin-filters{max-width:520px;margin-left:auto;margin-right:auto}
#admin-round-tabs.round-tabs{max-width:760px;margin-left:auto;margin-right:auto}
.am-body{padding-left:max(14px,calc((100% - 560px) / 2));padding-right:max(14px,calc((100% - 560px) / 2))}
.am-head{padding-left:max(14px,calc((100% - 560px) / 2));padding-right:max(14px,calc((100% - 560px) / 2))}
@media(max-width:600px){.am-head{padding-left:12px;padding-right:12px}.am-body{padding-left:12px;padding-right:12px}}

@media(min-width:601px){
  #admin-round-tabs.round-tabs{grid-template-columns:repeat(auto-fit,minmax(70px,1fr));max-width:none}
}

/* ===== Court availability: week grid (hours across the top, like Playtomic) ===== */
.bk-card{padding:var(--sp-4)}
.bk-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap;margin-bottom:var(--sp-4)}
.bk-loc{flex:0 1 320px;min-width:220px}
.bk-loc label{margin:0 0 6px;font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--gold2);font-weight:700}
.bk-weeknav{display:flex;align-items:center;gap:var(--sp-3)}
.bk-weeklabel{font-family:var(--font-hero);font-size:18px;color:var(--text);min-width:150px;text-align:center}
.bk-navbtn{margin:0;width:48px;height:48px;padding:0;border-radius:12px;font-size:26px;line-height:1;background:var(--page-bg);border:1px solid var(--line);color:var(--gold2);cursor:pointer}
.bk-navbtn:disabled{opacity:.3;cursor:default}
.bk-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--radius)}
.bk-grid{border-collapse:separate;border-spacing:3px;width:100%;min-width:720px}
.bk-grid th{font-size:12px;font-weight:700;color:var(--gold2);padding:4px 0;text-align:center}
.bk-grid thead th{position:sticky;top:0}
.bk-day{position:sticky;left:0;z-index:2;background:var(--cell-bg);width:60px;min-width:60px;padding:4px 6px;text-align:left;border-radius:8px;line-height:1.15}
.bk-day span{display:block;font-size:11px;color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.bk-day b{font-family:var(--font-hero);font-size:18px;color:var(--text)}
.bk-day.today{box-shadow:inset 0 0 0 1.5px var(--gold)}
.bk-day.today span{color:var(--gold2)}
.bk-corner{position:sticky;left:0;z-index:3;background:var(--cell-bg)}
.bk-cell{min-width:40px;height:46px;text-align:center;border-radius:8px;font-weight:800;font-size:15px;cursor:pointer;padding:0;transition:transform .1s}
.bk-cell:hover:not(.bk-closed):not(.bk-past){transform:scale(1.06)}
.bk-cell.bk-sel{outline:2px solid var(--gold);outline-offset:1px}
.bk-cell.bk-free{color:#fff}
.bk-cell.bk-free.n1{background:#7C9440}
.bk-cell.bk-free.n2{background:var(--win)}
.bk-cell.bk-free.n3{background:#3A5220}
.bk-cell.bk-full{background:rgba(var(--tint),.08);color:var(--muted);font-weight:600}
.bk-cell.bk-nodata{background:var(--page-bg);color:var(--muted);font-weight:400}
.bk-cell.bk-match{background:var(--lime);color:var(--on-hi);cursor:pointer}
.bk-cell.bk-closed{background:repeating-linear-gradient(45deg,rgba(var(--tint),.05) 0 4px,transparent 4px 8px);cursor:default}
.bk-cell.bk-past{opacity:.3;cursor:default}
.bk-legend{display:flex;flex-direction:column;gap:10px;font-size:var(--text-sm);color:var(--text)}
.bk-key{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-1px;margin-right:5px}
.bk-key.free{background:var(--win)}.bk-key.full{background:rgba(var(--tint),.2)}.bk-key.lm{background:var(--lime)}
.bk-key.closed{background:repeating-linear-gradient(45deg,rgba(var(--tint),.25) 0 2px,transparent 2px 4px)}
.bk-detail{margin-top:var(--sp-2);padding:var(--sp-3) var(--sp-4);background:var(--page-bg);border:1px solid var(--line);border-radius:var(--radius);min-height:64px;font-size:var(--text-sm);line-height:1.5}
.bk-detail-hint{color:var(--muted)}
.bk-detail-title{font-family:var(--font-hero);color:var(--gold2);font-size:16px;margin-bottom:4px}
.bk-court{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;padding:3px 0}
.bk-court b{min-width:70px}
.bk-time{padding:1px 8px;border-radius:999px;background:rgba(var(--tint),.1);font-size:12px;font-weight:700}
.bk-book{display:inline-flex;align-items:center;margin-top:var(--sp-2);padding:10px 16px;min-height:44px;border-radius:999px;background:var(--gold);color:var(--on-accent);font-weight:800;font-size:var(--text-sm);text-decoration:none}
.bk-book:hover{background:var(--ink);color:var(--page-bg)}
.bk-match-row{display:flex;gap:var(--sp-3);align-items:baseline;padding:8px 0;border-top:1px solid rgba(var(--tint),.08);font-size:var(--text-sm);text-decoration:none;color:var(--text)}
.bk-match-when{flex:0 0 auto;color:var(--lime-text);font-weight:700;font-size:12.5px}
.bk-match-teams{flex:1;min-width:0}
.bk-match-tbc{color:var(--muted);font-size:var(--text-xs)}
@media(max-width:600px){
  .bk-toolbar{flex-direction:column;align-items:stretch}
  .bk-loc{flex:1 1 auto;min-width:0}
  .bk-weeknav{justify-content:space-between}
  .bk-match-when{flex-basis:96px}
}

/* Court availability: separate refresh-info box */
.bk-refresh{margin-top:var(--sp-4);text-align:center;padding:var(--sp-4)}
.bk-refresh-row{display:flex;align-items:center;justify-content:center;gap:var(--sp-3)}
.bk-refresh-icon{font-size:26px}
.bk-refresh-row > div{text-align:left}
.bk-refresh-label{font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.bk-refresh-time{font-family:var(--font-hero);font-size:20px;font-weight:700;color:var(--gold2);line-height:1.2}
.bk-refresh.stale{border-color:var(--loss)}
.bk-refresh.stale .bk-refresh-time{color:var(--loss-text)}
.bk-refresh-note{margin:var(--sp-3) 0 0;font-size:var(--text-sm);color:var(--muted);line-height:1.5}

/* Fixture page: suggest a date/time/venue + withdraw */
.propose-open{margin:0;width:100%;min-height:48px}
.propose-label{margin:12px 0 6px;text-align:left}
.submit-score-block.open .propose-dt,.submit-score-block.open .propose-loc{text-align:left}
.withdraw-btn{margin:var(--sp-3) 0 0;min-height:44px}

/* Fixture page: both player buttons are bold, full-width, yellow */
.submit-score-open,.propose-open{margin:0;width:100%;min-height:52px;font-size:16px;font-weight:800;border-radius:12px;background:var(--gold);color:var(--on-accent);border:none}
.submit-score-open:hover,.propose-open:hover{background:var(--ink);color:var(--page-bg)}

.compare-row.compare-form .compare-val{display:flex;justify-content:center}
.compare-row.compare-form .form-chips{gap:3px}
.compare-row.compare-form .form-chip.sm{width:18px;height:18px;font-size:10px}

/* Fantasy Padel: points tiers + clearer how-it-works */
.howto-lead{margin:0 0 var(--sp-4);font-size:var(--text-sm);line-height:1.55;text-align:center;color:var(--text)}
.howto-step{margin:var(--sp-4) 0 var(--sp-2);text-align:center;font-family:var(--font-hero);font-size:13px;letter-spacing:.1em;color:var(--gold2)}
.howto-pts{font-family:var(--font-hero);font-size:38px;font-weight:700;color:var(--gold2);line-height:1}
.howto-pts-label{font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.howto-tile.underdog.active,.howto-tile.longshot.active{border-color:var(--acc-gold)}
.howto-tile.longshot .howto-pts{color:var(--acc-orange)}
.howto-small{margin:var(--sp-2) 0 0;text-align:center;font-size:var(--text-xs);color:var(--muted);line-height:1.5}
.howto-baller-card{display:flex;align-items:center;gap:var(--sp-3);width:100%;margin:0;padding:var(--sp-3) var(--sp-4);border-radius:var(--radius);border:1.5px solid var(--lime);background:rgba(var(--lime-rgb),.08);color:var(--text);text-align:left;cursor:pointer;font-family:inherit;line-height:1.5}
.howto-baller-card.active{background:rgba(var(--lime-rgb),.22)}
.howto-baller-card .howto-icon{font-size:32px;margin:0;}
.howto-baller-text{font-size:var(--text-sm)}
.howto-example{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:6px 12px;margin-top:var(--sp-3);padding:10px 14px;border-radius:var(--radius);background:var(--page-bg);font-size:var(--text-sm);text-align:center}
.howto-example span{font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.howto-example b{color:var(--gold2);font-family:var(--font-hero);font-size:17px}
.fantasy-tag.tier-2{color:var(--acc-gold);border-color:var(--acc-gold);background:rgba(var(--hi-rgb),.12)}
.fantasy-tag.tier-3{color:var(--acc-orange);border-color:var(--acc-orange);background:rgba(var(--accent-rgb),.12)}
.fantasy-tag.tier-1{color:var(--muted);border-color:var(--line)}
.fantasy-tag.worth{color:var(--text);border-color:var(--gold);background:rgba(var(--accent-rgb),.12)}
.fantasy-tag.worth b{color:var(--gold2);font-size:14px}

/* Court availability: grid on the left, key + league matches in a right-hand column */
.bk-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:var(--sp-4);align-items:start}
.bk-side{display:flex;flex-direction:column;gap:var(--sp-3)}
.bk-side-box{padding:var(--sp-3) var(--sp-4);background:var(--page-bg);border:1px solid var(--line);border-radius:var(--radius)}
.bk-side-title{font-family:var(--font-hero);color:var(--gold2);font-size:15px;margin-bottom:var(--sp-2)}
.bk-match-row{display:flex;flex-direction:column;gap:2px;padding:9px 8px;margin:0 -8px;border-top:1px solid rgba(var(--tint),.08);border-radius:8px;transition:background .12s}
.bk-match-row:first-of-type{border-top:none}
.bk-match-row.bk-hl{background:rgba(var(--lime-rgb),.22);box-shadow:inset 0 0 0 1px var(--lime)}
.bk-match-teams{font-size:var(--text-sm);line-height:1.35}
.bk-match-empty{color:var(--muted);font-size:var(--text-sm)}
.bk-cell.bk-hl{outline:2px solid #fff;outline-offset:1px;transform:scale(1.08)}
.bk-cell.bk-match{font-size:18px;line-height:1}
@media(max-width:900px){
  .bk-layout{grid-template-columns:minmax(0,1fr)}
  .bk-side{flex-direction:column}
}

/* Padel+ page: preferred times grid (same look as Court availability) */
.prefs-card{padding:var(--sp-4)}
.pf-intro{margin:0 0 var(--sp-3);text-align:center;font-size:var(--text-sm);color:var(--muted);line-height:1.5}
.pf-grid{min-width:700px}
.pf-hourhead,.pf-dayhead{cursor:pointer}
.pf-hourhead:hover{color:var(--text)}
.pf-dayhead:hover b{color:var(--gold2)}
.pf-cell{cursor:pointer;font-size:18px;font-weight:800;user-select:none}
.pf-cell.pf-neutral{background:var(--page-bg);color:var(--muted)}
.pf-cell.pf-pref{background:var(--win);color:#fff}
.pf-cell.pf-avoid{background:rgba(var(--loss-rgb),.85);color:#fff}
.pf-cell:hover{filter:brightness(1.18);transform:scale(1.06)}
.pf-footer{margin-top:var(--sp-3);text-align:center}
.pf-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--sp-2) var(--sp-4);font-size:12px;color:var(--muted)}
.pf-key{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-1px;margin-right:5px}
.pf-key.pref{background:var(--win)}.pf-key.avoid{background:rgba(var(--loss-rgb),.85)}.pf-key.neutral{background:rgba(var(--tint),.2)}
.pf-summary{margin:var(--sp-3) 0;font-size:var(--text-sm);color:var(--text)}
.pf-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--sp-3)}
.pf-actions .btn-ghost{min-height:44px;margin:0}
.pf-status{min-height:1.4em;margin-top:var(--sp-2);font-size:var(--text-sm);color:var(--gold2)}

/* Court availability: rotated month label running down the left, spanning its rows */
.bk-grid.has-month .bk-day{left:29px}
.bk-month{position:sticky;left:0;z-index:3;background:var(--cell-bg);width:26px;min-width:26px;padding:0;border-radius:8px;text-align:center;vertical-align:middle}
.bk-month span{display:inline-block;writing-mode:vertical-rl;transform:rotate(180deg);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold2);white-space:nowrap}

/* Formal / Friendly names switch: an icon button beside the burger, top right */
.name-style-fab{
  position:fixed;top:calc(18px + var(--motm-offset) + var(--admin-offset));right:72px;z-index:60;
  height:46px;min-width:46px;padding:0 12px;margin:0;display:flex;align-items:center;justify-content:center;gap:7px;
  background:var(--panel);border:1px solid var(--gold);border-radius:8px;color:var(--gold2);cursor:pointer;
  font-family:var(--font-body);font-size:13px;font-weight:700;
}
.name-style-fab:hover{background:var(--surface-hover)}
.name-style-fab svg{flex:0 0 auto}
.name-style-label{display:none}
@media(min-width:600px){.name-style-label{display:inline}}

.pf-hint{margin:0 0 var(--sp-3);text-align:center;font-size:var(--text-xs);color:var(--muted);line-height:1.5}

/* Preferred playing times: the "could possibly play" (?) state, in yellow */
.pf-cell.pf-maybe{background:var(--draw);color:var(--on-hi)}
.pf-key.maybe{background:var(--draw)}
.pf-summary-note{color:var(--muted);font-size:var(--text-xs)}

/* ===== Padel+ page: friendlier top section ===== */
.profile-body{padding:var(--sp-3) var(--sp-4) 0}
.myfix-btn{
  display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);
  min-height:60px;padding:0 var(--sp-5);border-radius:16px;text-decoration:none;
  background:var(--gold);color:var(--on-accent);
  font-size:19px;font-weight:800;
}
.myfix-btn:active{transform:scale(.99)}
.myfix-arrow{font-size:32px;line-height:1}
.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4);margin-top:var(--sp-4);align-items:stretch}
@media(max-width:640px){.profile-grid{grid-template-columns:minmax(0,1fr)}}

.tier-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--sp-4) var(--sp-3);background:var(--page-bg);border:1px solid var(--line);border-radius:var(--radius);text-align:center}
.tier-ring{position:relative;width:176px;height:176px}
.tier-ring svg{width:100%;height:100%;display:block}
.tier-ring-track{fill:none;stroke:rgba(var(--tint),.12);stroke-width:11}
.tier-ring-arc{fill:none;stroke:url(#tierGrad);stroke-width:11;stroke-linecap:round;transition:stroke-dashoffset 1.8s cubic-bezier(.22,.8,.3,1)}
.tier-ring-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;line-height:1.1}
.tier-ring-big{font-family:var(--font-hero);font-size:46px;font-weight:700;color:var(--gold2)}
.tier-ring-emoji{font-size:46px}
.tier-ring-small{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-top:4px;max-width:96px}
.tier-label{font-size:var(--text-sm);font-weight:700;color:var(--gold2);margin:var(--sp-3) 0 2px}
.tier-next{font-size:var(--text-xs);color:var(--muted);line-height:1.4;max-width:210px}
@media(prefers-reduced-motion:reduce){.tier-ring-arc{transition:none}}

.partner-card{display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-4);background:var(--page-bg);border:1px solid var(--line);border-radius:var(--radius);text-align:left}
.partner-avatar{flex:0 0 auto;width:92px;height:92px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:48px;background:var(--surface);border:3px solid var(--gold)}
.partner-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.partner-info{min-width:0}
.partner-label{font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.partner-name{font-family:var(--font-hero);font-size:26px;font-weight:700;color:var(--text);line-height:1.15;margin:2px 0 6px;word-break:break-word}
.partner-status{display:inline-block;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px}
.partner-status.on{background:rgba(var(--win-rgb),.25);color:var(--win-text)}
.partner-status.off{background:rgba(var(--tint),.1);color:var(--muted)}
@media(max-width:640px){.partner-card{flex-direction:column;text-align:center}.partner-avatar{width:104px;height:104px}}

/* Your Season: four boxes */
.sc-record{gap:var(--sp-2)}
.gc-legend{display:flex;justify-content:center;gap:var(--sp-4);font-size:var(--text-xs);color:var(--muted);margin:-4px 0 var(--sp-2)}
.gc-legend .lg{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-1px;margin-right:5px}
.gc-legend .lg.won{background:var(--win)}.gc-legend .lg.lost{background:var(--loss)}
.gc-chart{height:170px;justify-content:center;gap:10px}
.dw-chart{display:flex;align-items:flex-end;justify-content:center;gap:8px;height:150px;padding-top:14px}
.dw-col{flex:1 1 0;max-width:42px;display:flex;flex-direction:column;align-items:center;height:100%}
.dw-bar-wrap{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center}
.dw-bar{width:100%;max-width:26px;min-height:3px;border-radius:5px 5px 0 0;background:rgba(var(--tint),.22);position:relative}
.dw-bar span{position:absolute;top:-16px;left:50%;transform:translateX(-50%);font-size:11px;color:var(--muted)}
.dw-col.top .dw-bar{background:linear-gradient(180deg,var(--acc-gold),var(--lime))}
.dw-col.top .dw-bar span{color:var(--gold2);font-weight:700}
.dw-label{font-size:var(--text-xs);color:var(--muted);margin-top:4px}
.dw-col.top .dw-label{color:var(--gold2);font-weight:700}
.dw-note{text-align:center;font-size:var(--text-sm);color:var(--muted);margin-top:var(--sp-3)}
.dw-note b{color:var(--gold2)}
.dec-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:170px;text-align:center}
.dec-big{font-family:var(--font-hero);font-size:52px;font-weight:700;color:var(--gold2);line-height:1}
.dec-big small{font-size:22px;color:var(--muted);font-weight:500}
.dec-cap{font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:4px 0 var(--sp-3)}
.dec-dots{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.dec-dot{width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;color:#fff}
.dec-dot.won{background:var(--win)}.dec-dot.lost{background:var(--loss)}
.dec-empty{color:var(--muted);font-size:var(--text-sm);line-height:1.5}
.dec-empty small{font-size:var(--text-xs)}
.stat-tile-label,.stat-tile-sub{text-align:center}
@media(max-width:600px){.stat-tile.rank{grid-column:1 / -1}}

/* preferred times: palette (doubles as the key) */
.pf-palette{display:flex;justify-content:center;gap:var(--sp-4);margin:0 0 var(--sp-3)}
.pf-brush{background:none;border:0;padding:0;margin:0;min-height:0;display:flex;flex-direction:column;align-items:center;gap:6px;width:92px;cursor:pointer;color:var(--muted);font:inherit}
.pf-brush .pf-cell{display:flex;align-items:center;justify-content:center;width:40px;min-width:40px;height:46px;outline:2px solid transparent;outline-offset:3px;transition:outline-color .12s}
.pf-brush .pf-cell:hover{transform:none;filter:none}
.pf-brush.on .pf-cell{outline-color:var(--gold)}
.pf-brush.on .pf-brush-label{color:var(--gold2);font-weight:700}
.pf-brush-label{font-size:12px;line-height:1.25;text-align:center}

/* preferred times / court grid: the pinned left columns must fully hide the cells
   scrolling beneath them, including the 3px gaps between table cells */
.bk-day,.bk-corner,.bk-month{border-radius:0;box-shadow:0 0 0 3px var(--cell-bg)}
.bk-day.today{box-shadow:0 0 0 3px var(--cell-bg),inset 0 0 0 1.5px var(--gold)}
.bk-day,.bk-month{z-index:4}
.bk-corner{z-index:5}

/* palette: highlight only the square, never the whole button; squares match the grid exactly */
.pf-brush:focus,.pf-brush:focus-visible,.pf-brush:hover{outline:none;background:none}
.pf-brush .pf-cell{width:40px;min-width:40px;height:46px;border-radius:8px;font-size:18px;outline-offset:2px}
.pf-grid{width:auto;min-width:0;margin:0 auto}
.pf-grid .pf-cell{width:40px;min-width:40px;height:46px}

/* preferred times: key on the right, like Court availability */
.pf-layout{display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:var(--sp-4);align-items:start}
.pf-main{order:1;min-width:0}
.pf-side{order:2;padding:var(--sp-3);background:var(--page-bg);border:1px solid var(--line);border-radius:var(--radius)}
.pf-side .pf-palette{flex-direction:column;align-items:center;gap:var(--sp-3);margin:0 0 var(--sp-3)}
.pf-side .pf-brush{width:100%}
.pf-side .pf-hint{margin:0;text-align:left}
.pf-grid{margin:0}
@media(max-width:900px){
  .pf-layout{grid-template-columns:minmax(0,1fr)}
  .pf-side{order:0;background:none;border:0;padding:0}
  .pf-side .pf-palette{flex-direction:row;justify-content:center;align-items:flex-start}
  .pf-side .pf-brush{width:92px}
  .pf-side .pf-hint{text-align:center;margin-bottom:var(--sp-3)}
}

/* preferred times: roomier grid, wider key box that also holds the buttons */
.pf-grid{border-spacing:5px}
.pf-layout{grid-template-columns:minmax(0,1fr) 250px}
.pf-side .pf-hint{margin-bottom:var(--sp-3)}
.pf-side .pf-actions{flex-wrap:nowrap;justify-content:center;gap:var(--sp-2)}
.pf-side .pf-actions .btn-ghost{flex:1 1 0;padding-left:8px;padding-right:8px;white-space:nowrap}
.pf-side .pf-status{text-align:center}
@media(max-width:900px){.pf-layout{grid-template-columns:minmax(0,1fr)}}
.pf-grid .bk-day,.pf-grid .bk-corner{box-shadow:0 0 0 5px var(--cell-bg)}

/* suggested match time */
.suggest-box{text-align:center}
.suggest-venue{margin:0 auto var(--sp-3);max-width:260px}
.suggest-slot{display:flex;flex-direction:column;align-items:center;gap:4px;margin-bottom:var(--sp-2)}
.suggest-when{font-family:var(--font-hero);font-size:18px;color:var(--text)}
.suggest-where{font-family:var(--font-body);font-size:var(--text-sm);color:var(--muted)}
.suggest-who{font-size:var(--text-sm);color:var(--muted)}
.suggest-alt{margin:var(--sp-3) 0 var(--sp-2);font-size:var(--text-sm);color:var(--gold2)}
.suggest-none{color:var(--muted);font-size:var(--text-sm);margin-bottom:var(--sp-2)}
.suggest-note{margin-top:var(--sp-3);font-size:var(--text-xs);color:var(--muted);line-height:1.5}
.suggest-use{min-height:44px}

/* Admin: everyone's saved preferred playing times */
.av-card{margin-top:var(--sp-5);padding:var(--sp-4);border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.av-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;margin-bottom:var(--sp-3)}.av-head b{color:var(--gold2);font-family:var(--font-hero);font-size:18px}.av-head span{color:var(--muted);font-size:var(--text-sm)}
.av-item{border-top:1px solid rgba(var(--tint),.08);padding:2px 0}.av-item summary{display:flex;justify-content:space-between;gap:10px;min-height:44px;align-items:center;cursor:pointer;list-style:none}.av-item summary::-webkit-details-marker{display:none}
.av-name{font-weight:600}.av-when{color:var(--muted);font-size:13px}
.av-lines{display:grid;gap:6px;padding:4px 0 12px}
.av-line{display:grid;grid-template-columns:38px 1fr;gap:8px;align-items:start;font-size:14px}.av-day{color:var(--gold2);font-weight:700;padding-top:3px}
.av-times{display:flex;flex-wrap:wrap;gap:6px}.av-none{color:var(--muted);padding-top:3px}
.av-chip{padding:3px 9px;border-radius:999px;font-size:13px;white-space:nowrap;color:#fff}
.av-chip.av-p{background:var(--win)}.av-chip.av-q{background:var(--draw);color:var(--on-hi)}.av-chip.av-a{background:rgba(var(--loss-rgb),.85)}
.av-notyet{margin-top:var(--sp-3);padding-top:var(--sp-3);border-top:1px solid rgba(var(--tint),.08);color:var(--muted);font-size:14px;line-height:1.5}.av-notyet b{color:var(--text)}
.av-empty{color:var(--muted);padding:8px 0}

/* Admin: venues */
.venue-card{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-4);margin-top:var(--sp-3);border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.venue-card.hidden-venue{opacity:.65}.venue-main b{font-family:var(--font-hero);font-size:18px;color:var(--gold2)}.venue-sub{color:var(--muted);font-size:14px;margin-top:3px;word-break:break-word}.venue-sub a{color:var(--gold2)}
.venue-pill{font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted);vertical-align:2px}
.venue-actions{display:flex;gap:8px;align-items:center}
.venue-form{margin-top:var(--sp-4);padding:var(--sp-4);border:1px solid var(--gold);border-radius:var(--radius);background:var(--panel)}.venue-form h3{margin:0 0 12px;font-family:var(--font-hero);color:var(--gold2)}
.venue-form label{display:block;margin:0 0 12px;font-size:14px;color:var(--muted)}.venue-form label input{display:block;width:100%;margin-top:6px}.venue-form label small{color:var(--muted)}
.venue-hours{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 12px;color:var(--muted)}.venue-hours span{min-width:64px;color:var(--text);font-weight:600}.venue-hours select{width:auto;min-width:130px}
.venue-note{color:var(--muted);font-size:13px;margin:10px 0 0;line-height:1.5}


/* ===== Sticky top navigation bar (nav.js) =====
   A flat forest-green bar: crest, plain-word links, the current page in a gold pill, Admin outlined in gold. */
.topbar{
  position:fixed;left:0;right:0;top:calc(var(--motm-offset) + var(--admin-offset));z-index:60;
  height:var(--bar-h);padding:env(safe-area-inset-top,0px) max(var(--sp-5),env(safe-area-inset-right,0px)) 0 max(var(--sp-5),env(safe-area-inset-left,0px));
  display:flex;align-items:center;gap:var(--sp-5);
  background:var(--bar-bg);color:var(--bar-text);
}
.topbar-logo{flex:none;display:flex;align-items:center}
.topbar-logo img{width:40px;height:40px}
.topbar-nav{flex:1;min-width:0;display:flex;align-items:center;gap:2px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.topbar-nav::-webkit-scrollbar{display:none}
.topbar-nav a{
  flex:none;display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 var(--sp-4);border-radius:999px;
  color:var(--bar-text);text-decoration:none;font-weight:600;font-size:15px;white-space:nowrap;
  transition:background-color .15s,color .15s;
}
.topbar-nav a:hover{background:rgba(244,238,227,.12)}
.topbar-nav a.active{background:var(--gold);color:var(--on-accent);font-weight:800}
.topbar-nav a.nav-admin{background:transparent;box-shadow:inset 0 0 0 1.5px var(--gold);color:var(--gold);font-weight:800;margin-left:var(--sp-2)}
.topbar-nav a.nav-admin.active{background:var(--gold);color:var(--on-accent)}
.nav-link-icon{display:inline-flex;font-size:15px}
.nav-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--hi);color:var(--on-hi);font-size:12px;font-weight:800}
.topbar-right{flex:none;display:flex;align-items:center;gap:var(--sp-2)}
.topbar .name-style-fab{position:static;height:38px;min-width:38px;padding:0 12px;border-radius:999px;background:transparent;border:1.5px solid rgba(244,238,227,.35);color:var(--bar-text)}
.topbar .name-style-fab:hover{background:rgba(244,238,227,.12)}
.topbar .user-badge-wrap{position:relative;top:auto;left:auto;max-width:none}
.topbar .user-badge{min-height:38px;background:transparent;border:1.5px solid rgba(244,238,227,.35);color:var(--bar-text)}
.topbar .user-caret{color:var(--bar-text)}
.topbar .user-menu{left:auto;right:0}
@media(max-width:760px){
  .topbar{gap:var(--sp-2);padding-left:max(var(--sp-3),env(safe-area-inset-left,0px));padding-right:max(var(--sp-3),env(safe-area-inset-right,0px))}
  .topbar .user-name,.topbar .user-caret,.topbar .name-style-label{display:none}
  .topbar .user-badge{padding:4px}
  .topbar-logo img{width:34px;height:34px}
  .topbar-nav a{padding:0 12px;font-size:14px}
}
.burger-btn,.nav-overlay{display:none !important}

/* ===== Fixtures & Results list (home page) ===== */
.fxl-section{margin-top:var(--sp-6)}
.fxl-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-3)}
.fxl-head .fixtures-title{margin:0;text-align:left;font-size:clamp(24px,4vw,32px)}
.fxl-count{color:var(--muted);font-size:var(--text-sm)}
.fxl-roundbar{
  position:sticky;top:calc(var(--bar-total) + var(--motm-offset) + var(--admin-offset));z-index:20;
  display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:8px 2px;margin:0 0 var(--sp-3);
  background:linear-gradient(var(--page-bg),var(--page-bg));border-bottom:1px solid rgba(var(--tint),.08);
}
.fxl-roundbar::-webkit-scrollbar{display:none}
.fxl-rtab{flex:none;min-width:52px;min-height:40px;padding:0 var(--sp-3);display:inline-flex;align-items:center;justify-content:center;gap:5px;margin:0;
  border-radius:999px;border:1px solid rgba(var(--tint),.16);background:var(--panel);color:var(--muted);font-weight:700;font-size:13px;letter-spacing:.06em;cursor:pointer}
.fxl-rtab:hover{color:var(--text);border-color:var(--line)}
.fxl-rtab.active{background:var(--gold);border-color:var(--gold);color:var(--on-accent)}
.fxl-rtab i{font-style:normal;font-size:11px;color:var(--win)}.fxl-rtab.active i{color:var(--on-accent)}
.fxl-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--sp-3);margin-bottom:var(--sp-4)}
.fxl-field{display:flex;flex-direction:column;gap:4px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.fxl-field select{min-width:200px}
.fxl-seg{display:inline-flex;border:1px solid rgba(var(--tint),.16);border-radius:999px;overflow:hidden;background:var(--panel)}
.fxl-seg button{margin:0;border:0;border-radius:0;background:none;color:var(--muted);min-height:44px;padding:0 var(--sp-4);font-weight:600;font-size:13px;cursor:pointer}
.fxl-seg button + button{border-left:1px solid rgba(var(--tint),.1)}
.fxl-seg button.active{background:rgba(var(--tint),.14);color:var(--gold2)}
.fxl-chip{margin:0;min-height:44px;padding:0 var(--sp-4);border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--gold2);font-weight:700;font-size:13px;cursor:pointer}
.fxl-chip.active{background:var(--gold);color:var(--on-accent);border-color:var(--gold)}
.fxl-clear{margin:0;min-height:44px;background:none;border:0;color:var(--muted);text-decoration:underline;font-size:13px;cursor:pointer}
.fxl-list{display:block}
.fxl-group + .fxl-group{margin-top:var(--sp-5)}
.fxl-round-h{margin:0 0 var(--sp-3);color:var(--gold2);letter-spacing:1px;font-size:var(--text-body);font-family:var(--font-hero)}
.fxl-row{
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:0 var(--sp-4);
  margin-bottom:var(--sp-2);padding:var(--sp-3) var(--sp-4);
  background:var(--panel);border:1px solid rgba(var(--tint),.09);border-radius:12px;
  transition:border-color .15s;
}
.fxl-row{text-align:left}
.fxl-row:hover{border-color:var(--gold);}
.fxl-main{display:flex;align-items:center;gap:var(--sp-4);min-width:0;color:inherit;text-decoration:none}
.fxl-date{flex:none;width:76px;text-align:center;padding-right:var(--sp-4);border-right:1px solid rgba(var(--tint),.1);display:flex;flex-direction:column;gap:2px}
.fxl-dow{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.fxl-day{font-family:var(--font-hero);font-size:19px;line-height:1.1;color:var(--gold2)}
.fxl-time{font-size:13px;color:var(--text)}
.fxl-date.tbc .fxl-day{color:var(--muted)}
.fxl-body{min-width:0;flex:1}
.fxl-teams{display:flex;flex-direction:column;gap:4px}
.fxl-team{display:flex;align-items:center;gap:var(--sp-2);min-width:0}
.fxl-name{flex:1;min-width:0;font-weight:600;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fxl-team.lose .fxl-name{color:var(--muted);font-weight:500}
.fxl-score{flex:none;min-width:22px;text-align:right;font-family:var(--font-hero);font-size:20px;color:var(--text)}
.fxl-team.win .fxl-score{color:var(--gold2)}.fxl-team.lose .fxl-score{color:var(--muted)}
.fxl-avs{display:inline-flex;flex:none}
.fxl-avs img{width:26px;height:26px;border-radius:50%;object-fit:cover;border:1.5px solid var(--gold);background:var(--surface)}
.fxl-avs img + img{margin-left:-8px}
.fxl-sub{display:flex;flex-wrap:wrap;gap:4px var(--sp-3);margin-top:8px;font-size:12px;color:var(--muted);letter-spacing:.04em}
.fxl-venue{display:inline-flex;align-items:center;gap:5px}.fxl-venue.tbc{opacity:.7}
.fxl-side{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.fxl-more{margin:0;min-height:36px;padding:0 12px;border-radius:999px;border:1px solid rgba(var(--tint),.18);background:none;color:var(--gold2);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.fxl-more span{display:inline-block;transition:transform .2s}.fxl-more.open span{transform:rotate(180deg)}
.fxl-detail{grid-column:1 / -1;display:none;margin-top:var(--sp-3);padding-top:var(--sp-3);border-top:1px dashed rgba(var(--tint),.14);gap:var(--sp-3);flex-wrap:wrap;align-items:center}
.fxl-detail.open{display:flex}
.fxl-sets{display:flex;gap:var(--sp-2)}
.fxl-set{padding:6px 12px;border-radius:10px;background:var(--surface);text-align:center}.fxl-set small{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.fxl-set b{font-size:16px}
.fxl-motm{font-size:14px;color:var(--muted)}
@media(max-width:640px){
  .fxl-row{grid-template-columns:minmax(0,1fr);padding:var(--sp-3)}
  .fxl-side{flex-direction:row;justify-content:space-between;align-items:center;margin-top:var(--sp-3)}
  .fxl-date{width:62px;padding-right:var(--sp-3)}.fxl-main{gap:var(--sp-3)}
  .fxl-name{font-size:15px}
  .fxl-field select{min-width:0;width:100%}.fxl-field{flex:1 1 100%}
  .fxl-seg{width:100%}.fxl-seg button{flex:1;padding:0 6px}
}
.fxl-teams{max-width:520px}
@media(max-width:640px){.fxl-name{white-space:normal}.fxl-teams{max-width:none}}

/* Rules: key-facts bullet lists */
.rules-facts{list-style:none;margin:0;padding:0}
.rules-facts li{position:relative;padding:11px 0 11px 22px;border-bottom:1px solid rgba(var(--tint),.08);line-height:1.5;font-size:15px}
.rules-facts li:last-child{border-bottom:none}
.rules-facts li:before{content:"";position:absolute;left:4px;top:19px;width:8px;height:8px;border-radius:50%;background:var(--gold)}
.rules-facts b{color:var(--gold2)}

/* ===== Shared finishing layer =====
   Kept last so it settles the look of the older rules above in one place. */

/* "vs": a small italic flourish instead of a boxed badge */
.matchup-vs,.odds-vs{background:none;border:0;padding:0;width:auto;height:auto;font-family:var(--font-accent);font-style:italic;font-weight:400;color:var(--gold2);font-size:20px}
.matchup-row.hero .matchup-vs{width:auto;height:auto;font-size:40px;color:var(--gold2)}
.matchup-row.medium .matchup-vs{font-size:18px}
.matchup-name{font-family:var(--font-body);font-weight:700}

/* Stat strip (stats page; home overrides it in the dashboard block below) */
.headline-stats-grid{gap:0;margin:0 0 var(--sp-6);border-top:2px solid var(--ink);border-bottom:1px solid var(--line)}
.headline-stat-box,.headline-stat-box:hover{background:none;border:0;border-left:1px solid var(--line);border-radius:0;padding:var(--sp-4) var(--sp-4) var(--sp-4);transform:none}
.headline-stat-box:first-child{border-left:0;padding-left:0}
.headline-stat-box .headline-stat-label{margin:0 0 var(--sp-2);color:var(--muted);font-size:13px;font-weight:700;letter-spacing:0;text-transform:none}
.stat-big{font-family:var(--font-hero);font-weight:800;font-size:40px;color:var(--ink);display:flex;align-items:baseline;gap:8px}
.stat-unit{margin:0;font-family:var(--font-body);font-size:13px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--accent,var(--gold))}
.headline-stat-box.stat-hot,.headline-stat-box.stat-motm,.headline-stat-box.stat-games{--accent:var(--gold)}
.headline-stat-box.stat-cold{--accent:var(--acc-blue)}
.headline-stat-box .headline-stat-value{border-top:0;padding-top:var(--sp-2);font-size:15px;font-weight:700;color:var(--ink)}
@media(max-width:700px){
  .headline-stat-box{padding:var(--sp-3) var(--sp-3)}
  .headline-stat-box:nth-child(odd){border-left:0;padding-left:0}
  .headline-stat-box:nth-child(n+3){border-top:1px solid var(--line)}
  .stat-big{font-size:32px}
}

/* Home: next match — one solid forest-green block */
.next-fixture-card{background:var(--ink);color:var(--page-bg);border-radius:24px;padding:var(--sp-6) clamp(20px,4vw,48px);margin:0 0 var(--sp-6);text-align:left;display:flex;flex-direction:column;gap:var(--sp-5)}
.nf-top{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-2) var(--sp-4);flex-wrap:wrap}
.nf-kicker{font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--on-inv-accent)}
.nf-when{font-size:15px;font-weight:600}
.next-fixture-card .nf-empty,.next-fixture-card .nf-loading{color:var(--page-bg);opacity:.8;font-size:16px;padding:0}
.next-fixture-card .matchup-row.hero{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:var(--sp-5);align-items:center}
.next-fixture-card .matchup-row.hero .matchup-team.left{justify-content:flex-start}
.next-fixture-card .matchup-row.hero .matchup-team.right{justify-content:flex-end}
.next-fixture-card .matchup-row.hero .matchup-team.left .matchup-name{text-align:left}
.next-fixture-card .matchup-row.hero .matchup-team.right .matchup-name{text-align:right}
.next-fixture-card .matchup-row.hero .matchup-name{white-space:normal;overflow:visible;font-family:var(--font-hero);font-weight:700;color:var(--page-bg);font-size:clamp(26px,4.4vw,48px);line-height:1.05}
.nf-bottom{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4);flex-wrap:wrap;border-top:1px solid var(--inv-line);padding-top:var(--sp-4)}
.nf-countdown-grid{justify-content:flex-start;gap:var(--sp-5);margin:0}
.nf-unit{background:none;border:0;padding:0;min-width:0;display:flex;align-items:baseline;gap:4px}
.nf-num{font-family:var(--font-hero);font-weight:700;font-size:28px;color:var(--page-bg)}
.nf-label{margin:0;font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--page-bg);opacity:.75}
.play-fantasy-btn{margin:0;min-height:48px;padding:0 var(--sp-5);background:var(--page-bg);color:var(--ink);font-size:15px;font-weight:800;letter-spacing:0;text-transform:none}
.play-fantasy-btn:hover{background:var(--gold);color:var(--on-accent)}
@media(max-width:600px){
  .next-fixture-card{gap:var(--sp-4);border-radius:20px}
  .next-fixture-card .matchup-row.hero{grid-template-columns:minmax(0,1fr);gap:var(--sp-1)}
  .next-fixture-card .matchup-row.hero .matchup-team.right{justify-content:flex-start}
  .next-fixture-card .matchup-row.hero .matchup-team.right .matchup-name{text-align:left}
  .next-fixture-card .matchup-row.hero .matchup-vs{font-size:28px;justify-self:start}
  .nf-countdown-grid{gap:var(--sp-4)}
  .nf-num{font-size:24px}
  .play-fantasy-btn{width:100%;justify-content:center}
}

/* Home: Coming up / Latest results — plain lists under a heading */
.fixtures-columns{gap:var(--sp-6)}
.this-week-card{margin:0;background:none;border:0;padding:0}
.this-week-card h2{margin:0 0 var(--sp-3)}
.week-match,.week-match:first-child{padding:var(--sp-4) 0;border-top:1px solid var(--line)}
.week-match:last-child{border-bottom:1px solid var(--line)}
.week-match:hover{background:none}
.week-match:hover .matchup-name{color:var(--gold2)}
.matchup-row.medium .matchup-name,.matchup-row.recent .matchup-name{font-size:15px}
.score{background:none;color:var(--muted);font-family:var(--font-hero);font-weight:800;font-size:18px}
.score.win{color:var(--gold2)}
.matchup-meta{font-size:13px;letter-spacing:0;color:var(--muted)}
.action-icon{background:none;border:0}

/* Home: fixtures list */
.fxl-head .fixtures-title{font-size:clamp(20px,3vw,26px);letter-spacing:0;color:var(--ink);margin:0}
.fxl-roundbar{background:var(--page-bg);border-bottom:1px solid var(--line)}
.fxl-rtab{background:transparent;border:1.5px solid var(--line);color:var(--ink);letter-spacing:0}
.fxl-rtab:hover{border-color:var(--ink);color:var(--ink)}
.fxl-rtab.active{background:var(--ink);border-color:var(--ink);color:var(--page-bg)}
.fxl-rtab i{color:var(--gold2)}.fxl-rtab.active i{color:var(--hi)}
.fxl-seg{background:transparent;border:1.5px solid var(--line)}
.fxl-seg button{color:var(--ink)}
.fxl-seg button.active{background:var(--ink);color:var(--page-bg)}
.fxl-chip{background:transparent;border:1.5px solid var(--line);color:var(--ink)}
.fxl-chip.active{background:var(--ink);border-color:var(--ink);color:var(--page-bg)}
.fxl-field{letter-spacing:0;text-transform:none;font-size:13px;font-weight:700}
.fxl-row{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.fxl-row:hover{border-color:var(--ink)}
.fxl-date{border-right-color:var(--line)}
.fxl-day{font-family:var(--font-hero);font-weight:800;color:var(--ink)}
.fxl-dow{color:var(--gold2);font-weight:800;letter-spacing:.08em}
.fxl-score{font-family:var(--font-hero);font-weight:800}
.fxl-team.win .fxl-score{color:var(--gold2)}
.fxl-more{border:1.5px solid var(--line);color:var(--ink);letter-spacing:0;text-transform:none;font-size:13px}
.fxl-set{background:var(--page-bg)}
.fxl-avs img{border-color:var(--panel)}

/* Status pills: flat and readable */
.status-pill{letter-spacing:.04em;border:0}
.status-pill.scheduled{background:var(--ink);color:var(--page-bg)}
.status-pill.final{background:var(--win)}
.status-pill.unscheduled{background:var(--loss)}
.status-pill.awaiting,.status-pill.suggested{background:var(--hi);color:var(--on-hi)}

/* Inputs and selects: white fields with a green focus line */
input,select{background:var(--surface);border:1.5px solid var(--line);border-radius:12px;color:var(--ink)}
input:focus,select:focus,button:focus{outline:2px solid var(--ink);outline-offset:2px}
label{font-size:13px;font-weight:700;color:var(--muted);letter-spacing:0}

/* Banners across the top */
.motm-banner{background:var(--ink);color:var(--page-bg)}
.motm-banner-close{color:var(--page-bg)}
.admin-banner{background:var(--hi);color:var(--on-hi)}
.update-banner{background:var(--ink);color:var(--page-bg)}
.update-banner button{background:var(--hi);color:var(--on-hi);border-radius:999px}
.update-banner button:hover{background:var(--page-bg)}

/* Account menu */
.user-badge{background:var(--panel);border:1.5px solid var(--line);color:var(--ink)}
.user-menu{background:var(--panel);border:1px solid var(--line);border-radius:16px}
.user-menu-item{color:var(--ink)}
.user-menu-item.signout{color:var(--loss)}

/* Dialogs */
.confirm-box{background:var(--panel);border:0;border-radius:20px;padding:var(--sp-5)}
.confirm-title{font-family:var(--font-hero);font-weight:700;color:var(--ink)}
.toast{background:var(--ink);color:var(--page-bg);border:0;border-radius:999px}

.footer{color:var(--muted)}
.fantasy-title-icon{display:none}

/* Flat fills everywhere (no gradients), fewer decorative icons */
.howto-bar-fill{background:var(--win)}
.howto-bar-fill.underdog{background:var(--gold)}
.profile-banner{background:var(--ink)}
.profile-top .account-avatar,.partner-avatar,.team-avatar-img{border-color:var(--panel)}
.avatar-edit{background:var(--hi);color:var(--on-hi)}
.stat-tile.rank{background:rgba(var(--accent-rgb),.1)}
.myfix-btn{background:var(--ink);color:var(--page-bg)}
.myfix-btn:hover{background:var(--gold)}
.dw-col.top .dw-bar{background:var(--gold)}
.stat-icon{display:none}
.bk-day b{font-family:var(--font-body);font-weight:800;font-size:16px}
.tier-ring-big,.stat-tile-num,.hero-stat-num,.accuracy-num,.dec-big,.howto-points,.howto-pts,.fh-summary b,.rules-stat-num,.stats-summary-item span{font-weight:800}

/* Season stats: a hairline grid of records rather than boxes */
.stats-summary-item{background:none;border:0;border-left:1px solid var(--line);border-radius:0;letter-spacing:0;text-transform:none;font-weight:700}
.stats-summary-item:first-child{border-left:0}
.stats-grid{gap:var(--sp-5)}
.stats-grid .headline-stat-box,.stats-grid .headline-stat-box:first-child{border-left:0;border-top:2px solid var(--ink);padding:var(--sp-4) 0}
.pill.draw,.rules-point.draw{background:rgba(var(--hi-rgb),.35);color:var(--ink)}
.rules-point.win{background:rgba(var(--win-rgb),.18)}
.rules-point.loss{background:rgba(var(--loss-rgb),.14)}
.rules-sub{text-align:left;font-family:var(--font-body);font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:13px;color:var(--gold2)}
.rules-steps{justify-content:flex-start}
.rules-note{text-align:left}
.rules-callout{text-align:left}

/* ===== Admin: a home screen of big buttons, then one job at a time ===== */
#admin-view{max-width:880px}
.ad-section + .ad-section{margin-top:var(--sp-6)}
.ad-h{font-family:var(--font-body);font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold2);margin:0 0 var(--sp-3)}
.ad-inbox{display:flex;flex-direction:column;gap:var(--sp-3)}
.ad-item{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:var(--sp-5)}
.ad-item-main{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1 1 320px}
.ad-item-kicker{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ad-item-teams{font-size:18px;font-weight:700;line-height:1.3}
.ad-vs{font-family:var(--font-accent);font-weight:400;color:var(--gold2);padding:0 2px}
.ad-item-detail{font-size:15px;color:var(--muted)}
.ad-item-detail.ad-score{font-weight:800;font-size:18px;color:var(--ink);letter-spacing:.02em}
.ad-item-actions{display:flex;gap:var(--sp-2);flex:0 0 auto}
.ad-item-actions button{margin:0;min-height:52px;padding:0 var(--sp-5);font-size:16px}
@media(max-width:600px){
  .ad-item{padding:var(--sp-4)}
  .ad-item-actions{flex:1 1 100%}
  .ad-item-actions button{flex:1}
}
.ad-empty{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-5);border:1.5px dashed var(--line);border-radius:20px;color:var(--muted);font-weight:600}
.ad-empty svg{color:var(--win);flex:none}

.ad-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
@media(max-width:700px){.ad-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ad-tile{position:relative;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;gap:var(--sp-5);min-height:128px;margin:0;padding:var(--sp-5);
  border-radius:20px;border:1px solid var(--line);background:var(--panel);color:var(--ink);text-align:left;font-family:var(--font-hero);font-size:clamp(17px,2.4vw,21px);font-weight:800;line-height:1.1;transition:background .15s,border-color .15s}
.ad-tile:hover{background:var(--panel);border-color:var(--ink)}
.ad-tile .ad-tile-icon{color:var(--gold2)}
.ad-tile.dark{background:var(--ink);border-color:var(--ink);color:var(--page-bg)}
.ad-tile.dark:hover{background:var(--gold);border-color:var(--gold)}
.ad-tile.dark .ad-tile-icon{color:var(--hi)}
.ad-tile.dark:hover .ad-tile-icon{color:var(--page-bg)}
.ad-tile-count{position:absolute;top:var(--sp-4);right:var(--sp-4);min-width:28px;height:28px;padding:0 8px;border-radius:14px;background:var(--hi);color:var(--on-hi);font-family:var(--font-body);font-size:14px;font-weight:800;display:inline-flex;align-items:center;justify-content:center}
@media(max-width:600px){.ad-tile{min-height:112px;padding:var(--sp-4);gap:var(--sp-4)}}

.ad-subhead{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-2)}
.ad-subhead .ad-h{margin:0;text-transform:none;font-family:var(--font-hero);font-size:clamp(24px,4vw,32px);letter-spacing:0;color:var(--ink)}
.ad-back{flex:none;width:44px;height:44px;padding:0;margin:0;display:inline-flex;align-items:center;justify-content:center}
.ad-hint{margin:0 0 var(--sp-5);color:var(--muted);font-size:15px}
.ad-group{font-family:var(--font-body);font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:var(--sp-5) 0 var(--sp-3)}
.ad-group:first-child{margin-top:0}

/* Admin match rows */
.admin-match{background:var(--panel);border:1px solid var(--line);border-radius:16px;margin-bottom:var(--sp-2);padding:0}
.admin-match.open{border-color:var(--ink)}
.admin-match.attention{border-color:var(--line)}
.admin-match.attention.open{border-color:var(--ink)}
.am-head,.am-body{padding-left:var(--sp-4);padding-right:var(--sp-4)}
.am-head{color:var(--ink)}
.am-round{background:var(--page-bg);color:var(--ink)}
.am-v{font-family:var(--font-accent);font-style:italic;font-size:15px;letter-spacing:0;color:var(--gold2);text-transform:none}
.am-flag{color:var(--gold2);font-weight:800}
.am-caret{color:var(--ink)}
.am-result{font-family:var(--font-body);font-weight:800;color:var(--ink)}
.am-body{border-top:1px solid var(--line);padding-top:var(--sp-2)}
.am-set{border-top:0;padding:var(--sp-3) 0}
.am-set + .am-set{border-top:1px solid var(--line)}
.am-set-label{color:var(--ink);font-weight:800}
.step-btn{border-radius:999px;background:transparent;border:1.5px solid var(--line);color:var(--ink)}
.step-btn:active:not(:disabled){background:var(--ink);color:var(--page-bg)}
.am-step input{border-radius:12px}
.admin-match .save-btn{border-radius:999px;background:var(--gold);color:var(--on-accent);border:0}
.admin-match .save-btn:hover{background:var(--ink)}
.admin-match .sets-result b{color:var(--ink)}
.am-schedule{border:0;padding:0;margin-top:var(--sp-3)}
.am-schedule-actions button{border-radius:999px}
.save-time-btn{background:var(--gold);color:var(--on-accent);border:0;font-size:15px}
.save-time-btn:hover{background:var(--ink)}
.remove-match-btn{border:1.5px solid var(--line);color:var(--ink);font-size:15px}
.pending-submission{background:rgba(var(--hi-rgb),.25);border:0;border-radius:14px;padding:var(--sp-3) var(--sp-4);font-size:15px}
.approve-sub-btn{background:var(--gold);border-color:var(--gold);color:var(--on-accent)}
.reject-sub-btn{border:1.5px solid var(--ink);color:var(--ink)}
#admin-round-tabs.round-tabs{max-width:none;grid-template-columns:repeat(9,minmax(0,1fr));gap:6px}
@media(max-width:600px){#admin-round-tabs.round-tabs{grid-template-columns:repeat(5,minmax(0,1fr))}}
.round-tab{border:1.5px solid var(--line);color:var(--ink);background:transparent}
.round-tab.active{background:var(--ink);border-color:var(--ink);color:var(--page-bg)}
.admin-motm{border-top:1px solid var(--line)}
.admin-motm-label{color:var(--ink)}

/* Players / venues / ratings inside admin */
.player-detail-card,.venue-card,.venue-form,.av-card{background:var(--panel);border:1px solid var(--line);border-radius:16px}
.venue-form{border-color:var(--gold)}
.venue-main b,.venue-form h3,.av-head b{font-family:var(--font-hero);font-weight:800;color:var(--ink)}
.av-day{color:var(--ink)}
.btn-primary{background:var(--gold);border-color:var(--gold);color:var(--on-accent);border-radius:999px;min-height:48px;font-size:16px}
.btn-primary:hover{background:var(--ink);border-color:var(--ink)}
.btn-ghost{border:1.5px solid var(--ink);color:var(--ink);border-radius:999px}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold2)}
.ratings-grid .rating-name{font-weight:600}
body.admin-job header.hero{display:none}
.ad-more{margin-top:var(--sp-5)}
.ad-more > summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;min-height:52px;padding:0 var(--sp-4);margin:0 0 var(--sp-3);border:1.5px dashed var(--line);border-radius:16px;color:var(--ink)}
.ad-more > summary::-webkit-details-marker{display:none}
.ad-more > summary:after{content:"Show";font-size:13px;letter-spacing:0;text-transform:none;color:var(--gold2)}
.ad-more[open] > summary:after{content:"Hide"}
.form-chip{font-family:var(--font-body)}
.team-row{background:var(--panel);font-weight:700;font-size:16px}
.team-row:hover{background:var(--panel);border-color:var(--ink)}

.next-fixture-card .matchup-row.hero .matchup-vs{color:var(--on-inv-accent)}
.ad-tile.dark .ad-tile-icon{color:var(--on-inv-accent)}

/* ===== Page slide (page-boot.js picks the direction) =====
   Pages slide sideways instead of flashing on reload. The top bar and banners stay put. */
@view-transition{navigation:auto}
.topbar{view-transition-name:topbar}
.admin-banner{view-transition-name:admin-banner}
.motm-banner{view-transition-name:motm-banner}
::view-transition-old(root),::view-transition-new(root){animation-duration:.32s;animation-timing-function:cubic-bezier(.2,.8,.2,1);animation-fill-mode:both}
::view-transition-old(root){animation-name:lpl-out-left}
::view-transition-new(root){animation-name:lpl-in-right}
html:active-view-transition-type(back)::view-transition-old(root){animation-name:lpl-out-right}
html:active-view-transition-type(back)::view-transition-new(root){animation-name:lpl-in-left}
@keyframes lpl-out-left{to{transform:translateX(-8%);opacity:0}}
@keyframes lpl-in-right{from{transform:translateX(8%);opacity:0}}
@keyframes lpl-out-right{to{transform:translateX(8%);opacity:0}}
@keyframes lpl-in-left{from{transform:translateX(-8%);opacity:0}}
@media (prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}


/* Light / dark switch in the top bar */
.topbar .theme-toggle{position:static;flex:none;width:38px;height:38px;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:transparent;border:1.5px solid rgba(244,238,227,.35);color:var(--bar-text)}
.topbar .theme-toggle:hover{background:rgba(244,238,227,.12)}

/* ===== Consistency pass: one rhythm, one eyebrow style, one alignment =====
   Every top-level block on a page sits 32px from the next. Small labels above content
   ("eyebrows") are Manrope 13px bold upper case in deep gold; text inside cards reads left. */
body .wrap > *{margin-top:0;margin-bottom:var(--sp-6)}
body .wrap > .footer{margin:0}
@media(max-width:600px){
  body .wrap > *{margin-bottom:var(--sp-5)}
  .crest-logo{width:64px}
  .crest-logo.small{width:48px}
  header.hero{column-gap:var(--sp-3)}
}
:root:not([data-theme="dark"]) .crest-logo{content:url("logo-dark.png?v=153")} /* light mode: the dark-green crest */

.rules-sub,.howto-step,.howto-sim-title,.sc-title,.fxl-round-h,.bk-side-title,.dec-cap{
  font-family:var(--font-body);font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold2);text-align:left
}
.fxl-round-h .round-complete{font-size:inherit;letter-spacing:inherit;color:var(--muted);margin-left:6px}

/* Card headings that weren't h2s */
.fantasy-progress,.howto-title{font-family:var(--font-hero);font-size:clamp(20px,3vw,26px);font-weight:700;letter-spacing:0;text-transform:none;color:var(--ink);text-align:left}
.howto-head{justify-content:space-between;padding:var(--sp-4) var(--sp-5)}
.howto-lead,.howto-small{text-align:left}

/* Fixture page: the set-by-set table fits the card instead of scrolling off it */
.fx-set-table{min-width:0}

/* Stats page: the summary strip matches the home stat strip */
.stats-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:2px solid var(--ink);border-bottom:1px solid var(--line)}
.stats-summary-item{text-align:left;padding:var(--sp-4) var(--sp-4) var(--sp-4) var(--sp-4)}
.stats-summary-item:first-child{padding-left:0}

/* Teams page: names read left with a quiet arrow, like every other list */
.team-row{flex-direction:row;align-items:center;justify-content:space-between;text-align:left;gap:var(--sp-3);padding:var(--sp-4)}
.team-row::after{content:"›";font-size:22px;line-height:1;color:var(--gold2)}

/* Courts page: the week's matches list stacks date over teams without a gap */
.bk-match-when{flex-basis:auto}
.baller-status{text-align:left}
@media(max-width:600px){.rules-stat-num{font-size:26px}}

/* ===== Home dashboard =====
   Crest alone at the top, then your to-do tiles, next match beside a slim
   table, the fixture lists, and the season's headline stats in their own boxes. */
header.home-hero{display:flex;justify-content:center;margin:0 0 var(--sp-6)}
header.home-hero .crest-logo{width:clamp(122px,17.6vw,193px)}

.player-dashboard:empty{display:none}
.dash-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-3)}
.dash-box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-1);text-align:center;min-height:120px;padding:var(--sp-4) var(--sp-3);background:var(--panel);border:1.5px solid var(--line);border-radius:20px;color:var(--ink);text-decoration:none}
a.dash-box:hover{border-color:var(--gold);background:var(--surface-hover)}
.dash-num{font-family:var(--font-hero);font-weight:800;font-size:44px;line-height:1;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.dash-ord{font-size:.5em;margin-left:2px;vertical-align:super;line-height:0}
.dash-sub{font-size:12px;font-weight:600;color:var(--muted)}
.dash-label{font-size:13px;font-weight:700;color:var(--muted)}
.dash-label::first-letter{text-transform:uppercase}
.dash-box.is-due .dash-num{color:var(--gold2)}
.dash-note{display:block;margin:var(--sp-3) 0 0;text-align:center;font-size:13px;font-weight:700;color:var(--gold2)}
@media(max-width:700px){
  .dash-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dash-box{min-height:104px}
  .dash-num{font-size:38px}
}

/* Next match (half) beside the slim table (half) */
.home-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-4);align-items:stretch}
.home-split .next-fixture-card{margin:0;text-align:center;justify-content:space-between;padding:var(--sp-5) var(--sp-5)}
.home-split .nf-top{flex-direction:column;align-items:center;gap:var(--sp-1)}
.home-split .nf-when{font-size:14px;opacity:.85}
.home-split .next-fixture-card .matchup-row.hero{grid-template-columns:minmax(0,1fr);gap:var(--sp-1);justify-items:center}
.home-split .next-fixture-card .matchup-row.hero .matchup-team.left,
.home-split .next-fixture-card .matchup-row.hero .matchup-team.right{justify-content:center}
.home-split .next-fixture-card .matchup-row.hero .matchup-team.left .matchup-name,
.home-split .next-fixture-card .matchup-row.hero .matchup-team.right .matchup-name{text-align:center}
.home-split .next-fixture-card .matchup-row.hero .matchup-name{font-size:clamp(24px,2.6vw,32px)}
.home-split .next-fixture-card .matchup-row.hero .matchup-vs{font-size:24px;justify-self:center;color:var(--on-inv-accent)}
.home-split .nf-bottom{flex-direction:column;justify-content:center}
.home-split .nf-countdown-grid{justify-content:center}
.home-split .play-fantasy-btn{width:100%;justify-content:center}

.table-peek{background:var(--panel);border:1.5px solid var(--line);border-radius:24px;padding:var(--sp-4) var(--sp-5)}
.table-preview-card{margin:0}
.mini-table{width:100%;min-width:0;border-collapse:collapse;font-size:14px;table-layout:fixed}
.mini-table th{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--gold2);padding:0 6px 6px;text-align:center;border-bottom:1.5px solid var(--ink);background:none}
.mini-table td{padding:6px;border-top:0;border-bottom:1px solid var(--line);text-align:center;font-weight:700;color:var(--ink);background:none}
.mini-table tr:last-child td{border-bottom:0}
.mini-table .mt-pos{width:2.2em;color:var(--muted)}
.mini-table .mt-num{width:3.2em;font-variant-numeric:tabular-nums}
.mini-table th.mt-team,.mini-table td.mt-team{text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-table td.mt-pts{font-family:var(--font-hero);font-weight:800;font-size:16px;color:var(--gold2)}
.mini-table tr.mine td{background:rgba(var(--hi-rgb),.28)}
.mini-table-link{display:none} /* the "Table" heading is the link */
@media(max-width:760px){.home-split{grid-template-columns:minmax(0,1fr)}}

/* Headline stats: four separate boxes, centred, the number is the hero */
.headline-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-3);border:0;margin:0 0 var(--sp-6)}
.headline-stats-grid .headline-stat-box,.headline-stats-grid .headline-stat-box:first-child,.headline-stats-grid .headline-stat-box:hover{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;gap:var(--sp-1);
  background:var(--ink);color:var(--page-bg);border:2px solid var(--gold);border-radius:20px;padding:var(--sp-5) var(--sp-3);transform:none;min-width:0}
.headline-stats-grid .headline-stat-box .headline-stat-label{margin:0 0 var(--sp-1);color:var(--page-bg);opacity:.8;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.headline-stats-grid .stat-big{display:block;font-family:var(--font-hero);font-weight:800;font-size:56px;line-height:1;color:var(--on-inv-accent)}
.headline-stats-grid .stat-unit{margin:0;font-size:13px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--page-bg);opacity:.8}
.headline-stats-grid .headline-stat-box .headline-stat-value{width:100%;margin-top:var(--sp-2);padding-top:var(--sp-2);border-top:1px solid var(--inv-line);font-family:var(--font-body);font-size:15px;font-weight:700;color:var(--page-bg)}
.headline-stats-grid .headline-stat-name{text-align:center}
.headline-stats-grid .stat-none{color:var(--page-bg);opacity:.7;font-size:13px;padding:0}
@media(max-width:700px){
  .headline-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .headline-stats-grid .headline-stat-box,.headline-stats-grid .headline-stat-box:first-child,.headline-stats-grid .headline-stat-box:nth-child(odd){padding:var(--sp-4) var(--sp-2);border:2px solid var(--gold)}
  .headline-stats-grid .stat-big{font-size:44px}
}

/* ===== Fixtures page =====
   Crest and title centred together; squarer controls (10px corners) in one level row;
   rounds that toggle and roll up; slim rows with sets then each set's games; a calendar view. */
header.hero-inline{display:flex;justify-content:center;align-items:center;gap:clamp(16px,3vw,28px);text-align:left}
header.hero-inline .crest-logo{width:clamp(68px,10vw,101px)}
header.hero-inline h1{margin:0}

.fxl-section{margin-top:0}
.fxl-roundbar{gap:8px;padding:10px 2px;margin:0 0 var(--sp-4)}
.fxl-rtab,.fxl-rtab:hover{border-radius:10px;min-width:52px;min-height:44px;font-size:14px;font-weight:800;letter-spacing:0;background:transparent;border:1.5px solid var(--line);color:var(--ink)}
.fxl-rtab:hover{border-color:var(--ink)}
.fxl-rtab.done{border:2px solid var(--gold);color:var(--gold2)}
.fxl-rtab.active{background:var(--ink);border-color:var(--ink);color:var(--page-bg)}
.fxl-rtab.active.done{border-color:var(--gold);color:var(--on-inv-accent)}

.fxl-filters{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-5)}
.fxl-filters > *{margin:0}
.fxl-star,.fxl-pick-btn,.fxl-check,.fxl-view,.fxl-clear{height:44px;box-sizing:border-box}
.fxl-star{display:inline-flex;align-items:center;justify-content:center;width:44px;padding:0;border-radius:10px;border:1.5px solid var(--line);background:transparent;color:var(--gold2);font-size:20px;line-height:1}
.fxl-star:hover{border-color:var(--ink);background:transparent}
.fxl-star.active{background:var(--ink);border-color:var(--ink);color:var(--on-inv-accent)}

.fxl-pick{position:relative}
.fxl-pick-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:var(--sp-3);min-width:220px;padding:0 var(--sp-4);border-radius:10px;border:1.5px solid var(--line);background:var(--panel);color:var(--ink);font-size:14px;font-weight:700}
.fxl-pick-btn:hover{border-color:var(--ink);background:var(--panel)}
.fxl-pick-btn.active{border-color:var(--ink)}
.fxl-pick-btn span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fxl-caret{flex:none;width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .15s}
.fxl-pick-btn[aria-expanded="true"] .fxl-caret{transform:translateY(2px) rotate(-135deg)}
.fxl-pick-menu{position:absolute;z-index:30;top:calc(100% + 6px);left:0;min-width:100%;max-height:340px;overflow-y:auto;padding:6px;background:var(--panel);border:1.5px solid var(--ink);border-radius:12px}
.fxl-pick-menu button{display:block;width:100%;min-height:40px;padding:0 var(--sp-3);margin:0;border:0;border-radius:8px;background:none;color:var(--ink);text-align:left;font-size:14px;font-weight:600;white-space:nowrap}
.fxl-pick-menu button:hover{background:var(--page-bg)}
.fxl-pick-menu button.sel{color:var(--gold2);font-weight:800}
.fxl-pick-menu button.sel::after{content:"✓";float:right;margin-left:var(--sp-3)}

.fxl-checks{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.fxl-check{margin:0;display:inline-flex;align-items:center;gap:var(--sp-2);padding:0 var(--sp-3);border-radius:10px;border:1.5px solid var(--line);color:var(--ink);font-size:14px;font-weight:700;cursor:pointer;user-select:none}
.fxl-check:hover{border-color:var(--ink)}
.fxl-check input{appearance:none;-webkit-appearance:none;flex:none;width:18px;height:18px;margin:0;border:1.5px solid var(--ink);border-radius:5px;background:transparent;display:grid;place-content:center;cursor:pointer}
.fxl-check input::after{content:"";width:5px;height:9px;border-right:2px solid var(--on-accent);border-bottom:2px solid var(--on-accent);transform:translateY(-1px) rotate(45deg);opacity:0}
.fxl-check input:checked{background:var(--gold);border-color:var(--gold)}
.fxl-check input:checked::after{opacity:1}
.fxl-check:has(input:checked){border-color:var(--gold)}
.fxl-check input:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}

.fxl-clear{display:inline-flex;align-items:center;padding:0 var(--sp-2);font-weight:700;color:var(--muted)}
.fxl-clear:hover{background:none;color:var(--ink)}

.fxl-view{display:inline-flex;margin-left:auto !important;border:1.5px solid var(--line);border-radius:10px;overflow:hidden}
.fxl-view button{margin:0;border:0;border-radius:0;background:none;color:var(--ink);min-height:0;height:100%;padding:0 var(--sp-4);font-size:14px;font-weight:700}
.fxl-view button + button{border-left:1.5px solid var(--line)}
.fxl-view button.active{background:var(--ink);color:var(--page-bg)}

/* Round headings: bigger, and they roll up */
.fxl-group + .fxl-group{margin-top:var(--sp-5)}
.fxl-round-h{display:flex;align-items:center;gap:var(--sp-2);width:100%;margin:0 0 var(--sp-3);padding:0 0 var(--sp-2);border:0;border-bottom:1.5px solid var(--line);border-radius:0;background:none;font-size:18px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--gold2);text-align:left}
.fxl-round-h:hover{background:none;color:var(--ink)}
.fxl-round-h .fxl-caret{margin-left:auto;width:9px;height:9px;transform:translateY(2px) rotate(-135deg)}
.fxl-group.closed .fxl-round-h .fxl-caret{transform:translateY(-2px) rotate(45deg)}
.fxl-group.closed .fxl-round-h{margin-bottom:0}

/* Match rows: date | teams, sets, then each set's games | status */
a.fxl-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:0 var(--sp-4);padding:var(--sp-3) var(--sp-4);margin-bottom:var(--sp-2);color:inherit;text-decoration:none}
.fxl-row .fxl-date{width:72px;padding-right:var(--sp-4)}
.fxl-grid{display:grid;grid-template-columns:minmax(0,300px) 44px repeat(var(--sets),48px);align-items:center;gap:4px 0}
.fxl-h{white-space:nowrap;font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--muted);text-align:center;line-height:1}
.fxl-grid .fxl-team{display:flex;align-items:center;gap:var(--sp-2);min-width:0;padding-right:var(--sp-3)}
.fxl-grid .fxl-team.win .fxl-name{font-weight:800;color:var(--ink)}
.fxl-score{min-width:0;text-align:center;font-family:var(--font-hero);font-weight:800;font-size:20px;color:var(--muted)}
.fxl-score.win{color:var(--gold2)}
.fxl-games{text-align:center;font-family:var(--font-body);font-weight:500;font-size:15px;color:var(--muted);font-variant-numeric:tabular-nums}
.fxl-games.won{color:var(--ink);font-weight:700}
.fxl-games.first,.fxl-h.first{border-left:1.5px dotted var(--line);margin-left:6px;padding-left:6px}
.fxl-grid .fxl-h.first{align-self:stretch;display:flex;align-items:center;justify-content:center}
.fxl-sub{margin-top:6px}
.fxl-sub .fxl-motm{font-size:12px;color:var(--muted)}
.fxl-side{align-self:center}
@media(max-width:640px){
  a.fxl-row{grid-template-columns:auto minmax(0,1fr);padding:var(--sp-3)}
  .fxl-row .fxl-date{width:56px;padding-right:var(--sp-3)}
  .fxl-side{grid-column:1 / -1;flex-direction:row;justify-content:flex-start;margin-top:var(--sp-2)}
  .fxl-grid{grid-template-columns:minmax(0,1fr) 30px repeat(var(--sets),26px)}
  .fxl-name{font-size:14px;white-space:normal}
  .fxl-games{font-size:14px}
  .fxl-games.first,.fxl-h.first{margin-left:4px;padding-left:4px}
  .fxl-pick{flex:1 1 auto}.fxl-pick-btn{min-width:0;width:100%}
  .fxl-checks{order:5;width:100%}
  .fxl-check{flex:1;justify-content:center;padding:0 6px;font-size:13px;white-space:nowrap;gap:6px}
  .fxl-grid .fxl-hl{display:none}.fxl-grid .fxl-hs{display:inline}
  .fxl-clear{order:6}
  .fxl-view{order:7}
}

/* Calendar view: month grid on the left, the chosen day's matches on the right (below on phones) */
.cal-wrap{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:var(--sp-5);align-items:start}
.cal{background:var(--panel);border:1.5px solid var(--line);border-radius:20px;padding:var(--sp-4)}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-3)}
.cal-head h3{margin:0;font-family:var(--font-hero);font-size:20px;font-weight:700;color:var(--ink)}
.cal-nav{margin:0;width:40px;height:40px;padding:0;border-radius:10px;border:1.5px solid var(--line);font-size:20px;line-height:1;display:inline-flex;align-items:center;justify-content:center}
.cal-nav:hover{border-color:var(--ink);background:none}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.cal-dow{text-align:center;font-size:11px;font-weight:800;color:var(--gold2);padding-bottom:4px}
.cal-cell{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;margin:0;padding:0;border-radius:10px;border:1.5px solid transparent;background:none;font-size:14px;font-weight:600;color:var(--muted);line-height:1}
.cal-cell.blank{visibility:hidden}
.cal-cell i{font-style:normal;font-size:10px;letter-spacing:1px;color:var(--gold);height:8px}
.cal-cell.has{color:var(--ink);font-weight:800;border-color:var(--line);cursor:pointer}
.cal-cell.has:hover{border-color:var(--ink);background:none}
.cal-cell.played i{color:var(--gold2)}
.cal-cell.today{text-decoration:underline;text-underline-offset:3px}
.cal-cell.sel{background:var(--ink);border-color:var(--ink);color:var(--page-bg)}
.cal-cell.sel i{color:var(--on-inv-accent)}
.cal-day h3{margin:0 0 var(--sp-3);font-family:var(--font-hero);font-size:22px;font-weight:700;color:var(--ink)}
.fxl-list.compact a.fxl-row{padding:var(--sp-2) var(--sp-3)}
.fxl-list.compact .fxl-row .fxl-date{width:56px;padding-right:var(--sp-3)}
.fxl-list.compact .fxl-dow,.fxl-list.compact .fxl-day{display:none}
.fxl-list.compact .fxl-time{font-family:var(--font-hero);font-weight:800;font-size:17px;color:var(--ink)}
.fxl-list.compact .fxl-grid{grid-template-columns:minmax(0,240px) 40px repeat(var(--sets),44px)}
@media(max-width:820px){.cal-wrap{grid-template-columns:minmax(0,1fr)}.cal{max-width:420px;width:100%;margin:0 auto;box-sizing:border-box}}
.fxl-roundbar[hidden]{display:none}
.fxl-hs{display:none}

/* ===== League Table =====
   Names on a tinted band; P W L Pts evenly spaced, then Sets/Games, then Form,
   each group behind a divider; one unbroken dotted line under the top four. */
.league-card{padding:var(--sp-4) var(--sp-5)}
.league-t{table-layout:fixed;border-collapse:separate;border-spacing:0}
.league-t .c-pos{width:64px}
.league-t .c-team{width:250px}
.league-t .c-diff{width:112px}
.league-t .c-form{width:190px}
.league-t th{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--gold2);padding:12px 8px 10px;border-bottom:1.5px solid var(--ink)}
.league-t td{padding:12px 8px;border-bottom:1px solid var(--line);font-size:15px;font-weight:600;color:var(--ink);background:none}
.league-t tbody tr:last-child td{border-bottom:0}
.league-t .col-pos{width:auto;min-width:0;text-align:left;padding-left:10px}
.league-t .col-team{width:auto;min-width:0;left:64px;text-align:left;overflow:hidden;text-overflow:ellipsis}
.league-t td.col-team{background:color-mix(in srgb,var(--gold) 7%,var(--panel));font-weight:800;color:var(--ink)}
.league-t thead .col-team{background:color-mix(in srgb,var(--gold) 7%,var(--panel))}
.league-t td.col-pos{background:var(--panel)}
.league-t thead .col-pos{background:var(--panel)}
.league-t .col-pts{position:static;width:auto;min-width:0;background:none}
.league-t td.col-pts b{font-family:var(--font-hero);font-weight:800;font-size:18px;color:var(--ink)}
.league-t .col-div{border-left:1.5px solid var(--line)}
.league-t .col-form .form-chips{justify-content:center}
.league-t td.team,.league-t td.pos{color:var(--ink)}
.league-t td.pos{font-weight:800}
.league-t tr.pre-cut td{border-bottom:0}
.league-t tr.cutoff-line td{padding:0;height:0;border:0;border-top:2px dotted var(--gold2);background:none}
.league-t a.form-chip{text-decoration:none;cursor:pointer}
.league-t a.form-chip:hover,.league-t a.form-chip:focus-visible{outline:2px solid var(--gold);outline-offset:1px}
.form-tip{position:fixed;z-index:200;max-width:280px;white-space:pre-line;padding:8px 12px;border-radius:8px;background:var(--ink);color:var(--page-bg);font-size:13px;font-weight:700;line-height:1.35;pointer-events:none}
.form-tip[hidden]{display:none}
@media(max-width:600px){
  .league-card{padding:var(--sp-3)}
  .league-t{min-width:620px}
  .league-t .c-pos{width:34px}.league-t .col-team{left:34px}
  .league-t .c-team{width:140px}
  .league-t .c-num{width:36px}
  .league-t .c-diff{width:76px}
  .league-t .c-form{width:150px}
  .league-t .col-pos{padding-left:4px}
  .league-t td{padding:10px 4px;font-size:14px}
  .league-t td.col-team{white-space:normal;line-height:1.25;font-size:13px}
  .league-t th{padding:10px 4px 8px}
  .league-t .move-arrow{display:none}
}

/* Results grid as the Fixtures page's third view: fills the box, key beside it */
.fxl-section[data-view="grid"] .fxl-star,.fxl-section[data-view="grid"] .fxl-pick,
.fxl-section[data-view="grid"] .fxl-checks,.fxl-section[data-view="grid"] .fxl-clear{display:none !important}
.fxl-list .results-grid-card{margin:0;padding:var(--sp-5);border-radius:24px}
.fxl-list .grid-layout{flex-wrap:nowrap;gap:var(--sp-5)}
.fxl-list .grid-scroll{flex:1 1 auto;min-width:0}
.fxl-list .results-grid{width:100%;table-layout:fixed;border-spacing:4px}
.fxl-list .grid-cell,.fxl-list .results-grid .grid-colhead{width:auto;min-width:0}
.fxl-list .grid-cell{height:48px}
.fxl-list .grid-cell a{font-size:14px}
.fxl-list .results-grid .grid-team{width:32px}
.fxl-list .results-grid .grid-corner{width:32px}
.fxl-list .grid-key{flex:0 0 260px;min-width:0}
.grid-view-btn,.grid-view-toggle{border-radius:0}
.grid-view-toggle{border-radius:10px;border:1.5px solid var(--line)}
.grid-view-btn{color:var(--ink)}
.grid-view-btn.active{background:var(--ink);color:var(--page-bg)}
@media(max-width:860px){
  .fxl-list .grid-layout{flex-wrap:wrap}
  .fxl-list .grid-scroll{flex-basis:100%}
  .fxl-list .results-grid{min-width:520px}
  .fxl-list .grid-key{flex:1 1 100%}
  .fxl-list .results-grid-card{padding:var(--sp-3)}
}

/* ===== Home: section headings, Next League Match column ===== */
/* headings carry the same hairline as Coming up / Latest results */
.home-h{margin:0 0 var(--sp-4);padding-bottom:var(--sp-3);border-bottom:1px solid var(--line)}
body .wrap > .home-h{margin-bottom:var(--sp-4)}
.home-h a{color:inherit;text-decoration:none}
.home-h a:hover{color:var(--gold2)}
.nf-col{display:flex;flex-direction:column;min-width:0}
.nf-col .home-h{margin:0 0 var(--sp-4)}
.nf-col .table-peek{flex:1}
.nf-stack{flex:1;display:flex;flex-direction:column;gap:var(--sp-3)}
.nf-stack .next-fixture-card{flex:1;margin:0}
.home-split{align-items:stretch}
/* the table box lines up with the match boxes, under the heading */
.next-fixture-card a.nf-matchup-block{color:inherit;text-decoration:none}
.next-fixture-card .matchup-row.hero .matchup-team{display:flex;align-items:center;justify-content:center;gap:10px;min-width:0}
.next-fixture-card .matchup-row.hero .matchup-name{min-width:0}
/* your own next match: a gold card, so it reads apart from the league's next match */
.next-fixture-card.is-mine{background:var(--gold);color:var(--on-accent)}
.next-fixture-card.is-mine .matchup-row.hero .matchup-name{color:var(--on-accent)}
.next-fixture-card.is-mine .nf-kicker,
.home-split .next-fixture-card.is-mine .matchup-row.hero .matchup-vs{color:var(--on-accent)}
.next-fixture-card.is-mine .nf-when{opacity:.8}
.next-fixture-card.is-mine .nf-num,.next-fixture-card.is-mine .nf-label{color:var(--on-accent)}
.next-fixture-card.is-mine .nf-bottom{border-top-color:rgba(18,38,29,.25)}
.next-fixture-card.is-mine .nf-countdown-grid.soon .nf-num{color:#FFFDF9}
.nf-none{justify-content:center;align-items:center}
.nf-none .nf-empty{font-family:var(--font-hero);font-size:22px;font-weight:700;opacity:1}
/* fixed-width countdown: digits in fixed boxes, labels separate, so nothing shifts */
.nf-countdown-grid{display:grid;grid-template-columns:repeat(4,auto);justify-content:center;column-gap:var(--sp-5)}
.nf-unit{display:grid;grid-template-columns:auto auto;align-items:baseline;column-gap:4px}
.nf-num{display:inline-block;width:2.4ch;text-align:right;font-variant-numeric:tabular-nums lining-nums}
.nf-label{display:inline-block;width:2.2em;text-align:left}
.nf-countdown-grid.soon .nf-num{color:var(--on-inv-accent)}
.nf-bottom{border-top:1px solid var(--inv-line)}
@media(max-width:600px){
    .nf-countdown-grid{column-gap:var(--sp-3)}
}
.nf-stack .next-fixture-card .matchup-row.hero .matchup-name{white-space:nowrap;overflow:hidden}
@media(max-width:600px){.nf-stack .next-fixture-card .matchup-row.hero .matchup-name{font-size:21px}}
/* Two match boxes side by side with the table: tighten them so the pair is no taller than the table */
@media(min-width:761px){
  .nf-stack:has(.is-mine) .next-fixture-card{padding:var(--sp-3) var(--sp-4);gap:var(--sp-2)}
  .nf-stack:has(.is-mine) .nf-top{gap:2px}
  .nf-stack:has(.is-mine) .nf-kicker{font-size:12px}
  .nf-stack:has(.is-mine) .nf-when{font-size:13px}
  .nf-stack:has(.is-mine) .next-fixture-card .matchup-row.hero{gap:0}
  .nf-stack:has(.is-mine) .next-fixture-card .matchup-row.hero .matchup-name{font-size:clamp(19px,2vw,24px)}
  .nf-stack:has(.is-mine) .next-fixture-card .matchup-row.hero .matchup-vs{font-size:16px}
  .nf-stack:has(.is-mine) .nf-bottom{padding-top:var(--sp-2)}
  .nf-stack:has(.is-mine) .nf-num{font-size:22px}
  .nf-stack:has(.is-mine) .nf-label{font-size:12px}
}
.fantasy-count{font-family:var(--font-body);font-size:15px;font-weight:700;color:var(--muted);margin-left:6px}
/* hovering a row (or arriving from Home's League position tile) tints the whole row, name band included */
#table tr:not(.cutoff-line):hover td{background:var(--surface-hover)}
#table tr.mine td{background:rgba(var(--hi-rgb),.28)}

/* ===== Season Stats: headline squares, two charts, records, MOTM cloud ===== */
.ss .home-h{margin-top:var(--sp-6)}
.ss > .home-h:first-child{margin-top:0}
.ss-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-3)}
.ss-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-1);min-height:120px;padding:var(--sp-4) var(--sp-3);background:var(--panel);border:1.5px solid var(--line);border-radius:20px;text-align:center}
.ss-num{font-family:var(--font-hero);font-weight:800;font-size:44px;line-height:1;color:var(--gold2);font-variant-numeric:tabular-nums}
.ss-num small{font-size:.5em;color:var(--muted);margin-left:2px}
.ss-label{font-size:13px;font-weight:700;color:var(--muted)}
.ss-progress{display:block;width:70%;height:6px;margin-top:6px;border-radius:3px;background:rgba(var(--tint),.08);overflow:hidden}
.ss-progress span{display:block;height:100%;background:var(--gold);border-radius:3px}
.ss-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-5)}
.ss-panel{background:var(--panel);border:1.5px solid var(--line);border-radius:20px;padding:var(--sp-4) var(--sp-5)}
.ss-bars,.ss-dv{display:flex;flex-direction:column;gap:6px}
.ss-bar-row{display:grid;grid-template-columns:150px minmax(0,1fr) 34px;align-items:center;gap:var(--sp-2);padding:3px 0;cursor:default}
.ss-bar-name{font-size:13px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ss-bar-track{height:14px}
.ss-bar{display:block;height:100%;background:var(--gold);border-radius:0 4px 4px 0;min-width:2px}
.ss-bar-row:hover .ss-bar{background:var(--gold2)}
.ss-bar-val{font-size:13px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.ss-legend{display:flex;justify-content:center;gap:var(--sp-4);font-size:12px;font-weight:700;color:var(--muted);margin-bottom:var(--sp-2)}
.ss-legend span{display:inline-flex;align-items:center;gap:6px}
.ss-key{display:inline-block;width:10px;height:10px;border-radius:2px}
.ss-key.win,.ss-dv-bar.win{background:var(--win)}
.ss-key.loss,.ss-dv-bar.loss{background:var(--loss)}
.ss-dv-row{display:grid;grid-template-columns:150px minmax(0,1fr) minmax(0,1fr);align-items:center;gap:0;padding:3px 0;cursor:default}
.ss-dv-row .ss-bar-name{padding-right:var(--sp-2)}
.ss-dv-side{display:flex;align-items:center;gap:4px;height:14px}
.ss-dv-side.left{justify-content:flex-end;border-right:1.5px solid var(--ink);padding-right:2px}
.ss-dv-side.right{padding-left:2px}
.ss-dv-bar{display:block;height:100%;min-width:2px}
.ss-dv-bar.loss{border-radius:4px 0 0 4px}
.ss-dv-bar.win{border-radius:0 4px 4px 0}
.ss-dv-val{font-size:12px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.ss-dv-row:hover .ss-bar-name,.ss-bar-row:hover .ss-bar-name{color:var(--gold2)}
.ss-recs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-3)}
.ss-rec{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:var(--sp-4) var(--sp-3);background:var(--ink);color:var(--page-bg);border-radius:20px}
.ss-rec-label{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--page-bg);opacity:.85}
.ss-rec-num{font-family:var(--font-hero);font-weight:800;font-size:40px;line-height:1.05;color:var(--on-inv-accent);white-space:nowrap}
.ss-rec-unit{font-size:13px;font-weight:600;opacity:.8}
.ss-rec-who{width:100%;margin-top:var(--sp-2);padding-top:var(--sp-2);border-top:1px solid var(--inv-line);font-size:13px;font-weight:700;display:flex;flex-direction:column;gap:6px}
.ss-rec-more{font-size:12px;font-weight:600;opacity:.75}
.ss-rec-who small{display:block;font-weight:600;opacity:.75;font-size:12px}
.ss-rec-none{font-size:14px;opacity:.75;margin-top:var(--sp-3)}
.ss-cloud{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:4px 18px;padding:var(--sp-3) 0}
.ss-word{font-family:var(--font-hero);font-weight:700;line-height:1.15;color:var(--ink);cursor:default}
.ss-word.top{color:var(--gold2)}
.ss-word:hover{color:var(--gold2)}
.ss-empty{text-align:center;color:var(--muted);font-size:14px;padding:var(--sp-3)}
@media(max-width:900px){.ss-recs{grid-template-columns:repeat(2,minmax(0,1fr))}.ss-split{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){
  .ss-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ss-tile{min-height:104px}.ss-num{font-size:38px}
  .ss-panel{padding:var(--sp-3)}
  .ss-bar-row{grid-template-columns:minmax(0,1fr) 30px;row-gap:2px}
  .ss-dv-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:2px}
  .ss-bar-row .ss-bar-name,.ss-dv-row .ss-bar-name{grid-column:1/-1;font-size:12px}
  .ss-rec-num{font-size:32px}
}

/* ===== Fantasy Padel: Baller sticker, predictors, worth, previous picks, table, winner per round ===== */
.fantasy-match{position:relative}
.baller-sticker{position:absolute;top:-10px;right:-8px;z-index:2;width:58px;height:58px;margin:0;padding:0;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;line-height:1;font-family:var(--font-body);border:1.5px dashed var(--gold);background:var(--panel);color:var(--gold2);transform:rotate(-10deg);cursor:pointer;transition:transform .15s,background .15s}
.baller-sticker span{font-size:18px}
.baller-sticker b{font-family:var(--font-hero);font-size:16px;font-weight:800}
button.baller-sticker:hover{transform:rotate(-4deg) scale(1.05);background:var(--surface-hover)}
.baller-sticker.stuck{border:2px solid var(--gold);background:var(--gold);color:var(--on-accent);transform:rotate(-14deg)}
span.baller-sticker{cursor:default}
.baller-hint{text-align:center;font-size:13px;font-weight:700;color:var(--gold2);margin:0 0 var(--sp-2)}
.fantasy-match.has-baller{border-color:var(--gold)}
.fp{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.fp-row{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:var(--sp-2)}
.fp-pct{font-family:var(--font-hero);font-weight:700;font-size:18px;color:var(--muted);text-align:center;font-variant-numeric:tabular-nums}
.fp-pct.fav{color:var(--ink)}
.fp-mid{display:flex;flex-direction:column;gap:4px;min-width:0}
.fp-label{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold2);text-align:center}
.fp-label small{font-weight:600;letter-spacing:0;text-transform:none;color:var(--muted)}
.fp-bar{display:flex;gap:2px;height:8px}
.fp-a,.fp-b{display:block;height:100%;min-width:2px}
.fp-a{background:var(--gold);border-radius:4px 0 0 4px}
.fp-b{background:var(--ink);opacity:.75;border-radius:0 4px 4px 0}
.fantasy-worth{display:block;width:fit-content;margin:12px auto 0;padding:6px 16px;border-radius:999px;background:var(--gold);color:var(--on-accent);font-size:13px;font-weight:700}
.fantasy-worth b{font-family:var(--font-hero);font-size:17px;font-weight:800}
/* previous picks */
.fh-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3);margin-bottom:var(--sp-4)}
.fh-stats div{display:flex;flex-direction:column;align-items:center;gap:4px;padding:var(--sp-3);background:var(--ink);color:var(--page-bg);border-radius:16px}
.fh-stats b{font-family:var(--font-hero);font-weight:800;font-size:34px;line-height:1;color:var(--on-inv-accent)}
.fh-stats b small{font-size:16px;opacity:.75}
.fh-stats span{font-size:12px;font-weight:700;opacity:.8}
.fh-filters{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-3)}
.fh-pills{display:flex;flex-wrap:wrap;gap:6px}
.fh-pill,.rw-pill{margin:0;padding:6px 12px;min-width:44px;font-size:13px;font-weight:700;border-radius:10px;border:1.5px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer;font-family:inherit}
.fh-pill:hover,.rw-pill:hover{border-color:var(--gold)}
.fh-pill.active,.rw-pill.active{background:var(--ink);border-color:var(--ink);color:var(--page-bg)}
.fh-seg{display:inline-flex;border:1.5px solid var(--line);border-radius:10px;overflow:hidden}
.fh-seg button{margin:0;padding:6px 14px;font-size:13px;font-weight:700;border:0;border-left:1.5px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer;font-family:inherit;border-radius:0}
.fh-seg button:first-child{border-left:0}
.fh-seg button.active{background:var(--ink);color:var(--page-bg)}
.fh-group{border-top:1px solid var(--line)}
.fh-group:last-child{border-bottom:1px solid var(--line)}
.fh-ghead{display:flex;align-items:center;gap:var(--sp-3);width:100%;margin:0;padding:12px 2px;background:none;border:0;border-radius:0;color:var(--ink);cursor:pointer;font-family:inherit;text-align:left}
.fh-gtitle{font-size:15px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold2)}
.fh-gsum{margin-left:auto;font-size:13px;font-weight:600;color:var(--muted)}
.fh-gsum b{color:var(--gold2);font-weight:800}
.fh-caret{color:var(--gold2);transition:transform .15s;transform:rotate(-90deg)}
.fh-group.open .fh-caret{transform:none}
.fh-group .fh-list{padding-bottom:var(--sp-2)}
.fh-out{display:inline-flex;align-items:center;gap:6px}
.fh-out i{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;font-style:normal;font-size:12px;color:#fff}
.fh-out.win i{background:var(--win)}
.fh-out.loss i{background:var(--loss)}
.fh-out.win{color:var(--gold2)}
.fh-out.draw{color:var(--muted)}
/* season table */
.fantasy-table th{vertical-align:bottom}
.fantasy-table .ft-card{width:26px;padding-left:0;padding-right:0}
.fantasy-table .ft-pos{width:28px;color:var(--muted);font-weight:700}
.ft-ico{display:inline-flex;color:var(--muted)}
.ft-ico-label{display:block;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.fantasy-table th.ft-right .ft-ico{color:var(--win)}
.fantasy-table th.ft-wrong .ft-ico{color:var(--loss)}
.fantasy-table th.ft-pts .ft-ico,.fantasy-table th.ft-pts .ft-ico-label{color:var(--gold2)}
.fantasy-table td.ft-pts{background:rgba(var(--accent-rgb),.14)}
.fantasy-table td.ft-pts b{font-family:var(--font-hero);font-size:18px;font-weight:800;color:var(--gold2)}
.fantasy-table th.ft-pts{background:rgba(var(--accent-rgb),.14);border-radius:8px 8px 0 0}
.fantasy-table td:not(.ft-name){min-width:48px}
.fantasy-table tr.me td{background:rgba(var(--hi-rgb),.22)}
/* winner per round */
.round-winners{margin-top:var(--sp-5);padding-top:var(--sp-4);border-top:1px solid var(--line)}
.rw-title{font-size:20px;margin:0 0 var(--sp-3)}
.rw-pills{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:var(--sp-3)}
.rw-pill.done:not(.active){border-color:var(--gold);color:var(--gold2)}
.rw-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:var(--sp-4);border:1.5px dashed var(--line);border-radius:16px;text-align:center}
.rw-card.crowned{border:2px solid var(--gold);background:rgba(var(--accent-rgb),.1)}
.rw-kicker{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold2)}
.rw-who{font-family:var(--font-hero);font-weight:700;font-size:24px;color:var(--ink)}
.rw-sub{font-size:13px;color:var(--muted)}
@media(max-width:600px){
  .fh-stats b{font-size:28px}
  .ft-ico-label{display:none}
  .fantasy-table td:not(.ft-name){min-width:34px}
  .baller-sticker{width:50px;height:50px;right:-4px}
}

/* ===== Admin v154: centred screens, Match Centre, Players list, Team Ratings, date picker ===== */
#admin-view{max-width:720px;margin-left:auto;margin-right:auto}
#admin-home .home-h{text-align:center}
.ad-section + .ad-section{margin-top:var(--sp-6)}
.ad-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:700px){.ad-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ad-tile{align-items:center;text-align:center;justify-content:center;gap:var(--sp-3)}
.ad-empty{justify-content:center;text-align:center}
.ad-subhead{position:relative;justify-content:center;min-height:44px}
.ad-subhead .ad-back{position:absolute;left:0;top:50%;transform:translateY(-50%)}
.ad-subhead .ad-h{text-align:center;padding:0 52px}
.ad-hint{text-align:center;max-width:520px;margin-left:auto;margin-right:auto}
.ad-group{text-align:center}
.ad-more > summary{justify-content:center;gap:var(--sp-3)}
#venues-section{max-width:560px;margin:0 auto}
.ad-save{display:block;margin:var(--sp-4) auto 0;min-width:200px}

/* number boxes never show the browser's arrows */
.am-step input,.rt-step input{-moz-appearance:textfield;appearance:textfield}
.am-step input::-webkit-inner-spin-button,.am-step input::-webkit-outer-spin-button,
.rt-step input::-webkit-inner-spin-button,.rt-step input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

/* Match Centre: headline numbers and charts */
.mc-stats{margin-bottom:var(--sp-5)}
.mc-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-2);margin-bottom:var(--sp-3)}
.mc-num{display:flex;flex-direction:column;align-items:center;gap:2px;padding:var(--sp-3) var(--sp-2);background:var(--panel);border:1.5px solid var(--line);border-radius:16px;text-align:center}
.mc-num b{font-family:var(--font-hero);font-size:28px;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.mc-num b small{font-size:.5em;color:var(--muted)}
.mc-num span{font-size:12px;font-weight:700;color:var(--muted)}
.mc-num.hot{border-color:var(--gold)}.mc-num.hot b{color:var(--gold2)}
.mc-charts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-3)}
@media(max-width:640px){.mc-charts{grid-template-columns:minmax(0,1fr)}}
.mc-chart{background:var(--panel);border:1.5px solid var(--line);border-radius:16px;padding:var(--sp-3) var(--sp-4)}
.mc-chart h3{margin:0 0 var(--sp-2);font-family:var(--font-body);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:center}
.mc-bar-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 54px;align-items:center;gap:var(--sp-2);padding:3px 0;cursor:default}
.mc-bar-name{font-size:13px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-bar-track{height:12px}
.mc-bar-fill{display:block;height:100%;background:var(--gold);border-radius:0 4px 4px 0}
.mc-bar-row:hover .mc-bar-fill{background:var(--gold2)}
.mc-bar-val{font-size:13px;font-weight:800;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.mc-chart-empty{color:var(--muted);font-size:13px;text-align:center;padding:var(--sp-2) 0}

/* Match Centre: filter pills */
.mc-filter{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 0 var(--sp-2);margin-bottom:var(--sp-3);justify-content:safe center}
.mc-filter::-webkit-scrollbar{display:none}
.mc-filter .fxl-rtab{background:transparent;border:1.5px solid var(--line);color:var(--ink);border-radius:999px;font-weight:700;min-height:38px;min-width:46px}
.mc-filter .fxl-rtab:hover{border-color:var(--ink)}
.mc-filter .fxl-rtab.active{background:var(--ink);border-color:var(--ink);color:var(--page-bg)}
.mc-filter .fxl-rtab.done:not(.active){border-color:var(--gold)}
.mc-filter .fxl-rtab i{font-style:normal;font-size:11px;font-weight:800;padding:1px 6px;border-radius:999px;background:var(--hi);color:var(--on-hi)}

/* Match Centre: one card per match, laid out like the fixtures list */
#admin-match-list .admin-match{border-radius:16px}
#admin-match-list .am-head{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--sp-3);padding:12px 14px;min-height:0;position:static}
#admin-match-list .fxl-date{width:64px;padding-right:var(--sp-3)}
.mc-teams{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.mc-team{display:flex;align-items:center;gap:var(--sp-2);min-width:0}
.mc-name{flex:1;min-width:0;font-weight:600;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-team b{font-family:var(--font-hero);font-size:18px;color:var(--ink)}
.mc-team.win b{color:var(--gold2)}
.mc-team.lose .mc-name,.mc-team.lose b{color:var(--muted)}
.mc-sub{font-size:12px;color:var(--muted);letter-spacing:.04em;margin-top:2px}
.mc-side{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.mc-side .am-caret{position:static}
#admin-match-list .am-body{padding:var(--sp-3) 14px 14px}
.mc-hero{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 10px;text-align:center;font-family:var(--font-hero);font-weight:800;font-size:clamp(18px,4.6vw,22px);line-height:1.2;color:var(--ink);padding:var(--sp-2) 0 var(--sp-3)}
.mc-hero i{font-family:var(--font-accent);font-weight:400;font-size:.8em;color:var(--gold2)}
#admin-match-list .pending-submission{margin:0 0 var(--sp-3)}

/* date · time · venue on one line */
#admin-match-list .am-schedule{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:0 0 var(--sp-3);padding:var(--sp-2);border:1.5px solid var(--line);border-radius:14px}
.mc-dt-btn{flex:1 1 150px;margin:0;min-height:40px;padding:0 12px;border-radius:999px;border:1.5px solid var(--line);background:var(--page-bg);color:var(--ink);font-weight:700;font-size:14px;text-align:left;cursor:pointer;white-space:nowrap}
.mc-dt-btn.empty{color:var(--muted);font-weight:600}
.mc-dt-btn:hover{border-color:var(--gold)}
#admin-match-list .match-location{flex:1 1 110px;width:auto;min-width:0;min-height:40px;margin:0;font-size:14px;border-radius:999px;padding:0 10px}
#admin-match-list .save-time-btn,#admin-match-list .remove-match-btn{flex:none;margin:0;min-height:40px;padding:0 14px;font-size:13px;font-weight:800;border-radius:999px}

/* scores: teams as rows, sets as columns */
#admin-match-list .set-grid{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:6px 8px}
#admin-match-list .admin-match.tb-on .set-grid{grid-template-columns:minmax(0,1fr) auto auto auto}
.mc-set-h{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:center}
#admin-match-list .am-side-name{font-size:14px;font-weight:700;line-height:1.2;color:var(--ink);overflow:hidden;text-overflow:ellipsis}
#admin-match-list .am-set{padding:0;border:0}
#admin-match-list .am-set3.hidden{display:none}
#admin-match-list .am-step{gap:3px}
#admin-match-list .step-btn{width:28px;height:28px;font-size:17px;border-width:1.5px}
#admin-match-list .am-step input{width:34px;height:34px;font-size:18px;padding:0;border-radius:10px}
#admin-match-list .match-footer{justify-content:center;gap:var(--sp-4);margin-top:var(--sp-3)}
#admin-match-list .save-btn{flex:none;min-height:40px;padding:0 22px;font-size:14px}
@media(max-width:400px){
  #admin-match-list .step-btn{width:26px;height:26px}
  #admin-match-list .am-step input{width:30px}
  #admin-match-list .am-side-name{font-size:13px}
}

/* Players: one compact list */
.pl-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-2)}
.pl-count{font-size:13px;color:var(--muted);font-weight:600}
.pl-switch{display:inline-flex;align-items:center;gap:8px;margin:0;font-size:13px;font-weight:700;color:var(--muted);cursor:pointer;user-select:none}
.pl-switch input{position:absolute;opacity:0;width:1px;height:1px}
.pl-switch i{position:relative;width:40px;height:22px;border-radius:999px;background:rgba(var(--tint),.18);transition:background .15s}
.pl-switch i:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--page-bg);box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .15s}
.pl-switch input:checked + i{background:var(--gold)}
.pl-switch input:checked + i:after{transform:translateX(18px)}
.pl-switch input:focus-visible + i{outline:2px solid var(--gold2);outline-offset:2px}
.pl-switch span:first-child{color:var(--ink)}
.pl-switch:has(input:checked) span:first-child{color:var(--muted)}
.pl-switch:has(input:checked) span:last-child{color:var(--ink)}
.pl-list{background:var(--panel);border:1.5px solid var(--line);border-radius:16px;overflow:hidden}
.pl-row{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) 30px 30px;align-items:center;gap:var(--sp-2);padding:6px var(--sp-3);border-top:1px solid var(--line)}
.pl-headrow{border-top:0;padding-top:8px;padding-bottom:8px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pl-headrow .pl-ic{color:var(--gold2);cursor:help}
.pl-row.open{background:rgba(var(--hi-rgb),.18)}
.pl-name{all:unset;box-sizing:border-box;display:flex;flex-direction:column;min-width:0;cursor:pointer;padding:2px 0}
.pl-name b{font-size:15px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-name small{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-name:hover b{color:var(--gold2)}
.pl-name:focus-visible{outline:2px solid var(--gold2);outline-offset:2px;border-radius:4px}
.pl-mate-name{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-ic{display:flex;justify-content:center}
.pl-tick{font-weight:800;font-size:15px}
.pl-tick.yes{color:var(--win)}
.pl-tick.no{color:var(--muted);opacity:.6}
.pl-team{padding:8px var(--sp-3) 4px;border-top:1px solid var(--line);font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold2);background:var(--page-bg)}
.pl-row.pl-mate{border-top-style:dashed}
.pl-detail{padding:var(--sp-3) var(--sp-4) var(--sp-4);background:rgba(var(--hi-rgb),.08);border-top:1px solid var(--line)}
.pl-facts{display:grid;gap:6px;margin-bottom:var(--sp-3)}
.pl-facts div{display:flex;justify-content:space-between;gap:var(--sp-3);font-size:14px}
.pl-facts span{color:var(--muted)}
.pl-facts b{text-align:right;word-break:break-word;color:var(--ink)}
.pl-sub{margin:var(--sp-3) 0 6px;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold2)}
.pl-none{color:var(--muted);font-size:13px}
.pl-badges{margin-bottom:var(--sp-3)}
.pl-detail .av-lines{padding:0}
.pl-detail .player-detail-actions button{min-height:42px}
.pl-edit{display:grid;gap:var(--sp-3);margin-bottom:var(--sp-3)}
@media(max-width:480px){.pl-row{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) 26px 26px;gap:6px;padding:6px 10px}}

/* Team Ratings */
.ratings-list{max-width:520px;margin:0 auto;background:var(--panel);border:1.5px solid var(--line);border-radius:16px;overflow:hidden}
.rt-head,.rt-row{display:grid;grid-template-columns:minmax(0,1fr) 92px auto;align-items:center;gap:var(--sp-3);padding:8px var(--sp-4)}
.rt-head{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.rt-head span:not(:first-child){text-align:center}
.rt-row{border-top:1px solid var(--line)}
.rt-name{font-size:15px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-auto{display:flex;align-items:center;gap:6px;font-size:13px}
.rt-auto .rt-bar{flex:1;height:8px;border-radius:4px;background:rgba(var(--tint),.1);overflow:hidden}
.rt-auto .rt-bar span{display:block;height:100%;background:var(--gold);border-radius:4px}
.rt-auto b{min-width:26px;text-align:right;color:var(--ink);font-variant-numeric:tabular-nums}
.rt-step{display:flex;align-items:center;justify-content:center;gap:4px}
.rt-btn{margin:0;width:28px;height:28px;padding:0;border-radius:999px;border:1.5px solid var(--line);background:transparent;color:var(--ink);font-size:17px;font-weight:700;line-height:1;cursor:pointer}
.rt-btn:active{background:var(--ink);color:var(--page-bg)}
.rt-step input{width:38px;height:34px;padding:0;margin:0;text-align:center;font-size:17px;font-weight:800;border-radius:10px}
@media(max-width:420px){.rt-head,.rt-row{grid-template-columns:minmax(0,1fr) 70px auto;gap:var(--sp-2);padding:8px 12px}}

/* Date then time picker */
.dtp-backdrop{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.45)}
.dtp{width:100%;max-width:340px;background:var(--panel);border:1.5px solid var(--line);border-radius:20px;box-shadow:0 18px 50px rgba(0,0,0,.3);overflow:hidden;color:var(--ink)}
.dtp-steps{display:flex;justify-content:center;gap:var(--sp-4);padding:12px 12px 4px;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.dtp-steps .on{color:var(--gold2)}
.dtp-track{display:flex;width:200%;transition:transform .28s ease}
.dtp-track.step2{transform:translateX(-50%)}
.dtp-pane{width:50%;padding:4px 14px 8px}
.dtp-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.dtp-head b{font-family:var(--font-hero);font-size:17px}
.dtp-nav,.dtp-nav-gap{width:36px;height:36px}
.dtp-nav{margin:0;padding:0;border-radius:999px;border:1.5px solid var(--line);background:transparent;color:var(--ink);font-size:20px;line-height:1;cursor:pointer}
.dtp-nav:hover{border-color:var(--gold)}
.dtp-dow,.dtp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;text-align:center}
.dtp-dow span{font-size:11px;font-weight:800;color:var(--muted);padding:4px 0}
.dtp-day{margin:0;padding:0;height:38px;border-radius:999px;border:0;background:transparent;color:var(--ink);font-size:14px;font-weight:600;cursor:pointer}
.dtp-day:hover{background:rgba(var(--hi-rgb),.3)}
.dtp-day.today{box-shadow:inset 0 0 0 1.5px var(--gold)}
.dtp-day.sel{background:var(--ink);color:var(--page-bg)}
.dtp-times{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;max-height:268px;overflow-y:auto;padding:2px}
.dtp-time{margin:0;padding:0;height:38px;border-radius:999px;border:1.5px solid var(--line);background:transparent;color:var(--ink);font-size:14px;font-weight:700;cursor:pointer;font-variant-numeric:tabular-nums}
.dtp-time:hover{border-color:var(--gold)}
.dtp-time.sel{background:var(--ink);border-color:var(--ink);color:var(--page-bg)}
.dtp-foot{display:flex;justify-content:center;padding:6px 14px 14px}
.dtp-cancel{margin:0;min-height:40px;padding:0 22px;border-radius:999px;border:1.5px solid var(--line);background:transparent;color:var(--ink);font-weight:700;cursor:pointer}
@media(prefers-reduced-motion:reduce){.dtp-track{transition:none}}
#admin-match-list .am-step input{min-height:0}
#admin-match-list .am-schedule{flex-wrap:nowrap}
.mc-dt-btn{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
#admin-match-list .match-location{flex:0 1 120px}
@media(max-width:520px){
  .mc-side .status-pill{display:none}
  #admin-match-list .am-schedule{flex-wrap:wrap}
  .mc-dt-btn{flex:1 1 100%}
  #admin-match-list .match-location{flex:1 1 0}
}
.rt-step input{min-height:0}
.rt-row{padding-top:6px;padding-bottom:6px}
#ratings-section .ad-save{width:100%;max-width:520px}
.pl-list .pl-name,.pl-list .pl-name:hover,.pl-list .pl-name:focus{background:transparent;box-shadow:none;border:0}
.pl-bar{justify-content:center}
#venues-section .venue-card{flex-direction:column;align-items:center;text-align:center}
#venues-section .venue-actions{justify-content:center}
#venues-section .venue-note{text-align:center}
#admin-match-list .set-grid{max-width:440px;margin:0 auto}

/* ===== Teams page: photo, name on one line, photo ===== */
#teams.team-list{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:760px){#teams.team-list{grid-template-columns:minmax(0,1fr)}}
.team-row.tm-card{display:grid;grid-template-columns:48px minmax(0,1fr) 48px;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);min-height:0;text-align:center;background:var(--panel);border:1.5px solid var(--line);border-radius:18px;font-size:clamp(17px,2vw,19px);font-weight:700;color:var(--ink)}
.team-row.tm-card::after{content:none;display:none}
.team-row.tm-card:hover{background:rgba(var(--hi-rgb),.22);border-color:var(--gold)}
.tm-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-face{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--gold);background:var(--page-bg)}
.tm-face.none{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-hero);font-size:20px;font-weight:800;color:var(--gold2)}
@media(max-width:400px){.team-row.tm-card{grid-template-columns:40px minmax(0,1fr) 40px;gap:var(--sp-2);padding:var(--sp-3);font-size:16px}.tm-face{width:40px;height:40px}}

/* ===== Season Stats additions: faces, venue donut ===== */
.ss-bar-row{grid-template-columns:190px minmax(0,1fr) 38px}
.ss-dv-row{grid-template-columns:190px minmax(0,1fr) minmax(0,1fr)}
.ss-bar-name{display:flex;align-items:center;gap:6px}
.ss-bar-name > span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis}
.ss-faces{display:inline-flex;flex:none}
.ss-face{width:22px;height:22px;border-radius:50%;object-fit:cover;border:1.5px solid var(--gold);background:var(--page-bg);flex:none}
.ss-faces .ss-face + .ss-face{margin-left:-7px}
.ss-face.none{display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:var(--gold2);font-family:var(--font-body)}
.ss-word{display:inline-flex;align-items:center;gap:.25em}
.ss-word .ss-face{width:1.1em;height:1.1em;font-size:.5em}
.ss-pie{display:flex;align-items:center;justify-content:center;gap:var(--sp-5);flex-wrap:wrap;padding:var(--sp-2) 0}
.ss-pie svg{width:170px;height:170px;transform:none}
.ss-pie-arc{cursor:default;transition:stroke-width .15s}
.ss-pie-arc:hover{stroke-width:8.5}
.ss-pie-num{font-family:var(--font-hero);font-weight:800;font-size:9px;fill:var(--ink);text-anchor:middle}
.ss-pie-sub{font-size:3.4px;font-weight:700;fill:var(--muted);text-anchor:middle;letter-spacing:.05em}
.ss-pie-key{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;min-width:160px}
.ss-pie-key li{display:grid;grid-template-columns:12px minmax(0,1fr) auto;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--ink);cursor:default}
.ss-pie-key i{width:12px;height:12px;border-radius:3px}
.ss-pie-key b{font-variant-numeric:tabular-nums;color:var(--muted)}
@media(max-width:600px){
  .ss-bar-row{grid-template-columns:minmax(0,1fr) 34px}
  .ss-dv-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .ss-pie svg{width:150px;height:150px}
}
.ss-word .ss-face{width:1.15em;height:1.15em;font-size:inherit}.ss-word .ss-face.none{font-size:.55em;width:2.1em;height:2.1em}
.admin-match .save-btn:hover{color:var(--page-bg)}
@media(max-width:520px){
  #admin-match-list .admin-match.tb-on .set-grid{grid-template-columns:repeat(3,auto);justify-content:center;column-gap:10px}
  #admin-match-list .admin-match.tb-on .set-grid > span:first-child{display:none}
  #admin-match-list .admin-match.tb-on .am-side-name{grid-column:1/-1;text-align:center;margin-top:4px}
}
.topbar .theme-toggle{border-color:transparent}.topbar .theme-toggle:hover{background:rgba(244,238,227,.12);border-color:transparent}

/* Padel+ settings */
.settings-card{padding:var(--sp-4) var(--sp-5)}
.setting-row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap}
.setting-text{display:flex;flex-direction:column;gap:4px;flex:1 1 260px;min-width:0}
.setting-text b{font-size:16px;color:var(--ink)}
.setting-text span{font-size:13px;color:var(--muted);line-height:1.45}
.seg{display:inline-flex;padding:3px;border-radius:999px;border:1.5px solid var(--line);background:var(--page-bg)}
.seg button{margin:0;min-height:38px;padding:0 16px;border:0;border-radius:999px;background:transparent;color:var(--muted);font-weight:700;font-size:14px;cursor:pointer}
.seg button.active{background:var(--ink);color:var(--page-bg)}
.seg button:not(.active):hover{color:var(--ink)}
.home-stats-h{margin-top:var(--sp-6)}

/* ===== v155: shared faces, Fixtures rows ===== */
.faces{display:inline-flex;flex:none;align-items:center}
.face{width:26px;height:26px;border-radius:50%;object-fit:cover;border:1.5px solid var(--gold);background:var(--page-bg);flex:none;box-sizing:border-box}
.faces .face + .face{margin-left:-8px}
.face.none{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-body);font-size:11px;font-weight:800;color:var(--gold2);line-height:1}
.fxl-grid .fxl-name{font-size:17px}
.fxl-score{font-size:24px}
.fxl-games{font-size:17px}
.fxl-grid{grid-template-columns:minmax(0,340px) 48px repeat(var(--sets),50px)}
.fxl-side{align-self:stretch;display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:var(--sp-2);min-width:0}
.status-pill.fxl-pill{font-size:12px;padding:5px 12px;letter-spacing:.06em}
.fxl-where{display:flex;flex-direction:column;align-items:flex-end;gap:3px;font-size:12px;color:var(--muted);text-align:right}
.fxl-where .fxl-venue{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.fxl-where .fxl-motm{font-size:12px;color:var(--muted);white-space:nowrap}
.fxl-rnd{font-weight:800;color:var(--gold2);letter-spacing:.04em}
.fxl-list.compact .fxl-grid{grid-template-columns:minmax(0,280px) 44px repeat(var(--sets),46px)}
@media(max-width:640px){
  .fxl-grid{grid-template-columns:minmax(0,1fr) 30px repeat(var(--sets),28px)}
  .fxl-list.compact .fxl-grid{grid-template-columns:minmax(0,1fr) 30px repeat(var(--sets),28px)}
  .fxl-grid .fxl-name{font-size:15px}
  .fxl-score{font-size:21px}
  .fxl-games{font-size:15px}
  .fxl-side{grid-column:1 / -1;flex-direction:row;align-items:center;justify-content:space-between;margin-top:var(--sp-2)}
  .fxl-where{flex-direction:row;flex-wrap:wrap;justify-content:flex-end;gap:2px 10px}
  .face{width:22px;height:22px}
  .faces .face + .face{margin-left:-7px}
  .face.none{font-size:10px}
}
/* List / Calendar / Grid: three icons in one pill, no dividing lines */
.fxl-view{border-radius:999px;padding:3px;gap:2px;background:var(--panel);overflow:visible}
.fxl-view button,.fxl-view button + button{border:0;border-radius:999px;width:46px;padding:0;display:inline-flex;align-items:center;justify-content:center;outline:none}
.fxl-view button:focus-visible{box-shadow:0 0 0 2px var(--gold)}
.fxl-view button:not(.active):hover{background:var(--surface-hover);color:var(--gold2)}

/* ===== One hover style for the whole site (as on Home's dashboard tiles):
   an amber outline with a soft amber glow inside, never a black outline ===== */
:root{--hover-ring:inset 0 0 0 1px var(--gold),0 0 0 3px rgba(var(--accent-rgb),.16)}
.form-tip{z-index:300}
a.fxl-row:hover,.fxl-rtab:not(.active):hover,.fxl-star:hover,.fxl-pick-btn:hover,.fxl-pick-btn.active,.fxl-check:hover,.fxl-chip:not(.active):hover,
.cal-nav:hover,.cal-cell.has:not(.sel):hover,.ad-tile:not(.dark):hover,.team-row:hover,.admin-match .am-head:hover,
.mc-filter .fxl-rtab:not(.active):hover,.step-btn:not(:disabled):hover,.rt-btn:hover,.dtp-nav:hover,.dtp-time:not(.sel):hover,.dtp-day:not(.sel):hover,
.mc-dt-btn:hover,.btn-ghost:hover,.dtp-cancel:hover,.seg button:not(.active):hover,.grid-view-toggle button:not(.active):hover,
.fxl-seg button:not(.active):hover,.venue-card:hover,.ss-tile:hover,.mc-num:hover,select:hover,.bk-select:hover,.reject-sub-btn:hover,.remove-match-btn:hover{
  border-color:var(--gold);background-color:var(--surface-hover);box-shadow:var(--hover-ring);color:var(--ink)}
.cal-cell.has:not(.sel):hover{border-color:var(--gold)}
.admin-match .am-head:hover{box-shadow:none}
/* filled amber buttons keep their colour and gain the ring */
.btn-primary:hover,.save-btn:hover,.admin-match .save-btn:hover,.save-time-btn:hover,.approve-sub-btn:hover,.agree-btn:hover,.play-fantasy-btn:hover,
.bk-book:hover,.submit-score-open:hover,.propose-open:hover,button.primary:hover{
  background:var(--gold);border-color:var(--gold);color:var(--on-accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.3),inset 0 0 0 1px rgba(255,255,255,.35)}
/* no double outline: keyboard focus only */
.fxl-pick-btn:focus,.fxl-check:focus-within,.fxl-star:focus{outline:none}
.fxl-pick-btn:focus-visible,.fxl-star:focus-visible{box-shadow:0 0 0 2px var(--gold)}
/* Grid view: names and numbers in the same type as the list and calendar */
.fxl-list .grid-key li{font-size:16px;font-weight:600;color:var(--ink)}
.fxl-list .grid-key li.hl{font-weight:800}
.fxl-list .grid-key .gk-num{font-size:13px;font-weight:800}
.fxl-list .grid-cell a{font-family:var(--font-body);font-size:15px;font-weight:800}
.fxl-list .grid-cell.S a{font-size:13px}
.fxl-list .grid-legend{font-size:13px;font-weight:600}
.grid-view-toggle{border-radius:999px;padding:3px;gap:2px;background:var(--panel);overflow:visible}
.grid-view-toggle .grid-view-btn{border-radius:999px;color:var(--ink);font-weight:700;outline:none}
.grid-view-toggle .grid-view-btn.active{background:var(--ink);color:var(--page-bg)}
.fxl-pick-menu{border-color:var(--gold);box-shadow:0 10px 30px rgba(0,0,0,.12)}
.fxl-pick-menu button:hover{background:var(--surface-hover)}
.site-pick .fxl-pick-btn{min-width:220px}
/* Season Stats: paired boxes the same height, key under Wins and Losses */
.ss-split > section{display:flex;flex-direction:column}
.ss-split > section > .ss-panel{flex:1}
.ss-split .ss-legend{justify-content:flex-end;margin:var(--sp-2) 4px 0}
.ss-motm{justify-content:space-between;height:100%}
.ss-motm .ss-bar-row{padding:8px 0}
.ss-motm .face{width:26px;height:26px}
.ss-bar-name .face{width:22px;height:22px}
.ss-bar-name .faces .face + .face{margin-left:-7px}
.ss-split > section{position:relative}
.ss-split .ss-legend{position:absolute;right:4px;top:100%;margin:6px 0 0}

/* ===== Fantasy v155 ===== */
.fantasy-table-card{margin-top:0}
/* Baller sticker: die-cut white edge, drop shadow and a peeled-up corner */
.baller-sticker{border:3px solid #fff !important;box-shadow:0 0 0 1.5px var(--gold),0 6px 14px rgba(0,0,0,.22),0 2px 3px rgba(0,0,0,.15);overflow:visible}
.baller-sticker::after{content:"";position:absolute;right:2px;bottom:2px;width:16px;height:16px;border-radius:0 0 50% 0;
  background:linear-gradient(135deg,transparent 48%,rgba(0,0,0,.18) 50%,#f4ecdc 56%,#fff 100%);box-shadow:-1px -1px 2px rgba(0,0,0,.12);transform:rotate(0deg)}
.baller-sticker.stuck{background:radial-gradient(circle at 35% 30%,#e9c46a,var(--gold) 60%);color:#1d2a20}
button.baller-sticker:not(.stuck){background:var(--panel);color:var(--gold2)}
button.baller-sticker:hover{box-shadow:0 0 0 1.5px var(--gold),0 0 0 6px rgba(var(--accent-rgb),.2),0 8px 18px rgba(0,0,0,.25)}
/* How it works */
.howto-tiles{align-items:stretch}
.howto-tile,.howto-tile:hover,.howto-tile.active{transform:none}
.howto-tile{justify-content:flex-start;transition:border-color .12s,background .12s,box-shadow .12s}
.howto-tile.active{border-color:var(--gold);background:rgba(var(--accent-rgb),.18);box-shadow:var(--hover-ring)}
.howto-tile.spinning.active{background:rgba(var(--hi-rgb),.35)}
.howto-tile.landed{animation:howto-land .45s ease}
@keyframes howto-land{0%{box-shadow:0 0 0 0 rgba(var(--accent-rgb),.6)}100%{box-shadow:0 0 0 14px rgba(var(--accent-rgb),0)}}
.howto-icon{display:flex;align-items:center;justify-content:center;height:34px;color:var(--gold2)}
.howto-tile .howto-pts{color:var(--gold2)}
.howto-risk{display:flex;align-items:center;gap:10px;margin:var(--sp-3) 6px 0;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold2)}
.howto-risk-arrow{position:relative;flex:1;height:2px;background:linear-gradient(90deg,rgba(var(--accent-rgb),.15),var(--gold));overflow:visible}
.howto-risk-arrow::after{content:"";position:absolute;right:-1px;top:50%;width:10px;height:10px;border-top:2px solid var(--gold);border-right:2px solid var(--gold);transform:translateY(-50%) rotate(45deg)}
.howto-risk-arrow::before{content:"";position:absolute;top:-3px;left:0;width:8px;height:8px;border-radius:50%;background:var(--gold);animation:howto-risk 2.2s ease-in-out infinite}
@keyframes howto-risk{0%{left:0;opacity:0}15%{opacity:1}85%{opacity:1}100%{left:calc(100% - 10px);opacity:0}}
.howto-small{text-align:center}
.howto-baller-card{position:relative;padding-right:84px;border-color:var(--gold);background:rgba(var(--accent-rgb),.08)}
.howto-baller-card .howto-sticker{top:50%;right:14px;transform:translateY(-50%) rotate(-12deg)}
.howto-baller-card.active{background:rgba(var(--accent-rgb),.2);box-shadow:var(--hover-ring)}
.howto-example{align-items:center}
.howto-example i{font-style:normal;color:var(--muted);font-weight:800}
.howto-example b{padding:4px 10px;border-radius:999px;background:var(--panel);border:1.5px solid var(--line);font-family:var(--font-body);font-size:13px;font-weight:800;letter-spacing:.04em;color:var(--ink)}
.howto-example b.howto-eq{background:var(--gold);border-color:var(--gold);color:var(--on-accent)}
.howto-sim{position:relative}
.howto-sim .howto-sim-sticker{top:-12px;right:-10px;opacity:0;transform:rotate(-30deg) scale(.4);transition:opacity .2s,transform .25s cubic-bezier(.3,1.6,.5,1);pointer-events:none}
.howto-sim.has-baller .howto-sim-sticker{opacity:1;transform:rotate(-12deg) scale(1)}
.howto-sim-line{display:flex;align-items:center;justify-content:center;gap:var(--sp-4);max-width:460px;margin:0 auto}
.howto-sim-line .howto-bar{flex:1;max-width:320px;height:34px;cursor:ew-resize}
.howto-sim-line .howto-slider{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}
.howto-bar-fill::after{content:"";position:absolute;right:4px;top:50%;width:6px;height:18px;border-radius:3px;background:rgba(255,255,255,.85);transform:translateY(-50%)}
.howto-bar:focus-within{box-shadow:0 0 0 2px var(--gold)}
.howto-sim-line .howto-result{min-width:90px}
.howto-sim .howto-switch{justify-content:center;margin-top:var(--sp-2)}
.howto-why{min-height:0;margin-top:var(--sp-2)}
/* Previous picks: ticks and crosses like the table header, lined up */
.fh-seg button{display:inline-flex;align-items:center;justify-content:center;min-width:44px}
.fh-seg-right svg{color:var(--win)}.fh-seg-wrong svg{color:var(--loss)}
.fh-seg button.active svg{color:currentColor}
.fh-gsum{display:grid;grid-template-columns:auto 44px;gap:10px;align-items:center;text-align:right}
.fh-out{display:inline-grid;grid-template-columns:22px 34px;align-items:center;gap:4px;justify-items:start}
.fh-out i{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;font-style:normal}
.fh-out i svg{width:13px;height:13px}
.fh-out.win i{background:rgba(var(--win-rgb),.15);color:var(--win)}
.fh-out.loss i{background:rgba(var(--loss-rgb),.15);color:var(--loss)}
.fh-outcome{min-width:64px;display:flex;flex-direction:column;align-items:flex-start}
/* Winner per round */
.rw-title{font-family:var(--font-hero);font-size:clamp(20px,3vw,26px);font-weight:700;color:var(--ink);margin-bottom:2px}
.rw-note{margin:0 0 var(--sp-3);font-size:13px;color:var(--muted)}
.rw-pill:disabled{opacity:.4;cursor:not-allowed;border-style:dashed}
.rw-who{font-size:18px}

/* ---- v156: Rules compact card, League rank note, Padel 101 ---- */
.rules-compact h2{margin-bottom:var(--sp-2)}
.rules-compact .rules-sub{margin:var(--sp-4) 0 var(--sp-2)}
.rules-chips{display:flex;flex-wrap:wrap;gap:8px}
.rules-chips span{padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:var(--page-bg);font-size:var(--text-sm);color:var(--muted)}
.rules-chips b{color:var(--ink);font-weight:800;margin-right:2px}
.rules-compact .rules-point{padding:8px 6px}
.rules-compact .rules-point-num{font-size:24px}
.rules-foot{margin:8px 0 0;font-size:var(--text-xs);color:var(--muted);line-height:1.45}
.rules-compact .rules-callout{padding:var(--sp-3)}
.rules-callout p{margin:0}
.rules-callout p+p{margin-top:6px}
.rules-lead{margin:0 0 var(--sp-3);color:var(--muted);font-size:var(--text-sm)}

.rank-note{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:var(--sp-3) 2px 0;font-size:var(--text-sm)}
.rank-note-label{color:var(--muted);font-weight:700;font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase}
.rank-steps{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.rank-steps li{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 4px;border:1px solid var(--line);border-radius:999px;background:var(--panel)}
.rank-steps i{font-style:normal;width:20px;height:20px;border-radius:50%;background:var(--gold);color:var(--on-accent);font-weight:800;font-size:11px;display:inline-flex;align-items:center;justify-content:center}


/* ---- v157: Rules page (flowchart, glossaries, quiz) ---- */
.rules-card h2{margin-bottom:6px}
.rf-chart{display:flex;align-items:center;gap:0;overflow-x:auto;padding:4px 2px 8px;scrollbar-width:none}
.rf-node{appearance:none;flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:86px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--page-bg);color:var(--ink);font:inherit;cursor:pointer;transition:background .15s,border-color .15s}
.rf-node b{font-size:15px;font-weight:800;white-space:nowrap}
.rf-node span{font-size:var(--text-xs);color:var(--muted);white-space:nowrap}
.rf-node.rf-end{background:rgba(var(--win-rgb),.16)}
.rf-node.rf-diamond{min-width:0;width:58px;height:58px;padding:0;border-radius:10px;transform:rotate(45deg);justify-content:center;margin:0 8px}
.rf-node.rf-diamond b{transform:rotate(-45deg);font-size:14px}
.rf-node.active{background:var(--gold);border-color:var(--gold);color:var(--on-accent)}
.rf-node.active span{color:var(--on-accent);opacity:.8}
.rf-arrow{flex:0 0 22px;height:2px;background:var(--gold2);position:relative;margin:0 2px}
.rf-arrow::after{content:"";position:absolute;right:-1px;top:-4px;border:5px solid transparent;border-left:7px solid var(--gold2);border-right:0}
.rf-lanes{display:flex;flex-direction:column;gap:10px;padding-left:14px;border-left:2px solid var(--gold2);margin-left:4px}
.rf-lane{display:flex;align-items:center}
.rf-tag{font-size:var(--text-xs);font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--gold2);width:34px;flex:0 0 34px}
.rf-detail{margin-top:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-radius:12px;background:rgba(var(--accent-rgb),.1);border:1px solid var(--line)}
.rf-detail h3{margin:0 0 6px;font-size:16px}
.rf-detail p{margin:0 0 6px;line-height:1.5}
.rf-detail p:last-child{margin-bottom:0}

.gloss{display:grid;grid-template-columns:190px minmax(0,1fr);gap:var(--sp-4);align-items:start}
.gloss-list{display:flex;flex-direction:column;gap:6px}
.gloss-item{appearance:none;text-align:left;border:1px solid var(--line);background:var(--page-bg);color:var(--ink);font:inherit;font-weight:700;font-size:15px;padding:10px 14px;border-radius:12px;cursor:pointer;position:relative}
.gloss-item.active{background:var(--gold);border-color:var(--gold);color:var(--on-accent)}
.gloss-item.active::after{content:"";position:absolute;right:-9px;top:50%;margin-top:-7px;border:7px solid transparent;border-left:8px solid var(--gold);border-right:0}
.gloss-panel{min-height:100%;padding:var(--sp-3) var(--sp-4);border-radius:12px;background:var(--page-bg);border:1px solid var(--line)}
.gloss-panel h3{margin:0 0 8px;font-size:18px}
.gloss-panel p{margin:0 0 10px;line-height:1.55;font-size:15px}
.rules-ticks{list-style:none;margin:0 0 10px;padding:0}
.rules-ticks li{position:relative;padding:6px 0 6px 28px;line-height:1.45;font-size:15px;border-bottom:1px solid rgba(var(--tint),.08)}
.rules-ticks li:last-child{border-bottom:none}
.rules-ticks li::before{position:absolute;left:0;top:6px;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:#fff}
.rules-ticks li.ok::before{content:"✓";background:var(--win)}
.rules-ticks li.no::before{content:"✕";background:var(--loss)}
.rules-small{font-size:var(--text-sm)!important;color:var(--muted)}
.rules-eg{display:flex;flex-wrap:wrap;gap:6px}
.rules-eg span{padding:4px 10px 4px 8px;border-radius:999px;font-weight:800;font-variant-numeric:tabular-nums;font-size:14px}
.rules-eg .yes{background:rgba(var(--win-rgb),.18);color:var(--win-text)}
.rules-eg .no{background:rgba(var(--loss-rgb),.16);color:var(--loss-text);text-decoration:line-through}
.rules-eg .yes::before{content:"✓ "}
.rules-eg .no::before{content:"✕ ";display:inline-block;text-decoration:none}

.quiz{list-style:none;counter-reset:q;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.quiz-q{counter-increment:q;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--page-bg);display:flex;flex-direction:column;gap:8px}
.quiz-q>p{margin:0;line-height:1.45;font-weight:600}
.quiz-q>p:first-child::before{content:counter(q) ". ";color:var(--gold2);font-weight:800}
.quiz-q.right{border-color:var(--win);background:rgba(var(--win-rgb),.1)}
.quiz-q.wrong{border-color:var(--loss);background:rgba(var(--loss-rgb),.08)}
.quiz-btns{display:flex;gap:8px;margin-top:auto}
.quiz-btn{appearance:none;flex:1;border:1px solid var(--line);background:var(--panel);color:var(--ink);font:inherit;font-weight:700;padding:8px;border-radius:999px;cursor:pointer}
.quiz-btn:disabled{cursor:default;opacity:.55}
.quiz-q.right .quiz-btn.picked{background:var(--win);border-color:var(--win);color:#fff;opacity:1}
.quiz-q.wrong .quiz-btn.picked{background:var(--loss);border-color:var(--loss);color:#fff;opacity:1}
.quiz-why{margin:0;font-size:var(--text-sm);line-height:1.45}
.quiz-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;font-size:var(--text-sm);color:var(--muted)}
.quiz-foot b{color:var(--ink)}
.quiz-reset{appearance:none;border:1px solid var(--line);background:var(--panel);color:var(--ink);font:inherit;font-weight:700;padding:6px 12px;border-radius:999px;cursor:pointer}

@media (max-width:700px){
  .gloss{grid-template-columns:1fr;gap:10px}
  .gloss-list{flex-direction:row;overflow-x:auto;margin:0 -4px;padding:2px 4px;scrollbar-width:none}
  .gloss-item{flex:0 0 auto;padding:8px 12px;font-size:14px;border-radius:999px}
  .gloss-item.active::after{display:none}
  .quiz{grid-template-columns:1fr}
  .rf-node{min-width:0;padding:8px 8px}
  .rf-node b{font-size:13px}
  .rf-node.rf-diamond{width:44px;height:44px;margin:0 6px}
  .rf-node.rf-diamond b{font-size:12px}
  .rf-arrow{flex-basis:14px}
  .rf-tag{width:28px;flex-basis:28px;font-size:10px}
  .rf-lanes{padding-left:8px}
}
@media (max-width:700px){
  .rf-chart{flex-wrap:wrap;row-gap:10px;overflow:visible}
  .rf-node span{display:none}
  .rf-lanes{margin-left:auto}
}

/* v157 Fantasy: Baller toggle beside the bar, mini sticker in the table */
.howto-tile{transition:background .2s,border-color .2s,box-shadow .2s}
.howto-sim-line{max-width:760px;gap:var(--sp-4)}
.howto-sim-line .howto-bar{max-width:none}
.howto-sim-side{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:190px}
.howto-sim-side .howto-why{margin:0;text-align:left}
.howto-sim .howto-sim-side .howto-switch{justify-content:flex-start;margin:0}
@media (max-width:640px){
  .howto-sim-line{flex-wrap:wrap}
  .howto-sim-line .howto-bar{flex:1 1 60%}
  .howto-sim-side{flex:1 1 100%;flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap}
}
.baller-sticker.mini{position:relative;top:auto;right:auto;display:inline-flex;width:24px;height:24px;border-width:2px!important;box-shadow:0 0 0 1px var(--gold),0 2px 4px rgba(0,0,0,.2);transform:rotate(-12deg);vertical-align:middle}
.baller-sticker.mini span{font-size:11px}
.baller-sticker.mini::after{width:7px;height:7px;right:0;bottom:0}
.fantasy-table .ft-card{width:34px;text-align:center}
/* No black focus outline after a click; keyboard focus gets the gold ring */
input:focus,select:focus,button:focus,a:focus{outline:none}
input:focus-visible,select:focus-visible,button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
input[type=text]:focus,input[type=email]:focus,input[type=password]:focus,input[type=number]:focus,input[type=search]:focus,textarea:focus,select:focus{outline:none;box-shadow:var(--hover-ring)}
/* v157 Courts: wider page so the whole day fits, narrower side column */
.wrap.wrap-wide{max-width:1360px}
.bk-layout{grid-template-columns:minmax(0,1fr) 230px}
.bk-grid{min-width:0}
.bk-cell{min-width:0}
.bk-court b{font-weight:800}
.bk-court-type{font-weight:400;color:var(--muted);margin-right:6px}
.bk-grid td.bk-cell{width:6%}
.ad-group-note{font-weight:500;color:var(--muted);text-transform:none;letter-spacing:0;margin-left:4px}

/* ---- v157: Landing page (welcome.html): one screen, no menu, hero image ---- */
.landing-body{margin:0;height:100dvh;overflow:hidden;background:#0b1c15;color:#fff}
.landing{position:relative;height:100dvh;display:flex;align-items:center;justify-content:center;padding:max(16px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom));box-sizing:border-box;background:#05090f;isolation:isolate;overflow:hidden}
.landing-inner{position:relative;width:100%;max-width:440px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
.landing-crest{width:clamp(72px,14vh,120px);height:auto;filter:drop-shadow(0 6px 18px rgba(0,0,0,.35))}
.landing-title{margin:0;font-family:var(--font-hero);font-weight:800;font-size:clamp(40px,8.5vh,76px);line-height:.98;letter-spacing:-.01em;color:#fff;text-shadow:0 4px 30px rgba(0,0,0,.35)}
.landing-tag{margin:0;font-size:16px;color:rgba(255,255,255,.82);max-width:32ch}
.landing-actions{display:flex;gap:12px;margin-top:10px;width:100%;justify-content:center}
.landing-actions[hidden]{display:none}
.landing-btn{appearance:none;font:inherit;font-weight:800;font-size:16px;padding:14px 28px;border-radius:999px;cursor:pointer;border:1.5px solid rgba(255,255,255,.75);background:rgba(255,255,255,.08);color:#fff;min-width:140px;transition:box-shadow .15s,background .15s}
.landing-btn.primary{background:var(--gold);border-color:var(--gold);color:#12261d}
.landing-btn:hover,.landing-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #e9c46a,0 0 18px rgba(233,196,106,.45)}
.landing-btn.wide{width:100%;margin-top:4px}
.landing-btn:disabled{opacity:.6;cursor:default}
.landing-panel{width:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:10px;text-align:left;padding:20px;border-radius:18px;background:rgba(11,28,21,.72);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);animation:landing-in .25s ease}
.landing-panel[hidden]{display:none}
@keyframes landing-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.landing-panel{animation:none}}
.landing-panel h2{margin:0 0 2px;font-family:var(--font-hero);font-size:22px;line-height:1.2;color:#fff}
.landing-panel label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:700;color:rgba(255,255,255,.8);min-width:0;flex:1}
.landing-panel input,.landing-panel select{font:inherit;font-size:16px;font-weight:500;padding:11px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.95);color:#12261d;width:100%;box-sizing:border-box;margin:0}
.landing-panel input:focus,.landing-panel select:focus{outline:none;box-shadow:0 0 0 2px #e9c46a}
.landing-row{display:flex;gap:10px}
.landing-error{min-height:0;color:#ffb3a8;font-size:14px;font-weight:600}
.landing-error:empty{display:none}
.landing-small{margin:0;font-size:14px;color:rgba(255,255,255,.75)}
.landing-small a{color:#e9c46a;font-weight:700}
.landing-back{appearance:none;align-self:center;background:none;border:0;color:rgba(255,255,255,.75);font:inherit;font-weight:700;font-size:14px;cursor:pointer;padding:4px 8px}
.landing-back:hover{color:#fff}
@media (max-height:700px){.landing-tag{display:none}.landing-inner{gap:10px}.landing-panel{padding:16px;gap:8px}.landing-panel input,.landing-panel select{padding:9px 10px}}
.landing-panel>label{flex:none}
.landing.open .landing-tag{display:none}
.landing.open .landing-crest{width:56px}
.landing.open .landing-title{font-size:clamp(30px,5vh,48px)}
.landing.open .landing-title br{display:none}
.landing.open .landing-inner{gap:10px}
.landing-panel label{margin:0}
.user-menu-item{font-family:var(--font-body);font-size:14px;font-weight:700;letter-spacing:0}
.ss-view{display:flex;width:max-content;max-width:100%;margin:0 auto var(--sp-4)}
.stat-tiles + .season-charts{margin-top:var(--sp-3)}
.account-initial{font-family:var(--font-hero);font-weight:800;color:var(--gold2);font-size:.8em;line-height:1}
.partner-avatar .account-initial{font-size:22px}
.settings-page .profile-body{display:block}
/* v157 Preferred Playing Times: the whole week fits without scrolling; a slimmer key on the right */
.pf-layout{grid-template-columns:minmax(0,1fr) 190px}
.pf-grid{width:100%;min-width:0;border-spacing:4px}
.pf-grid .pf-cell{width:auto;min-width:0;height:42px}
.pf-side .pf-palette{gap:8px;align-items:stretch}
.pf-side .pf-brush{display:flex;flex-direction:row;align-items:center;gap:10px;text-align:left}
.pf-side .pf-brush .pf-cell{width:32px;min-width:32px;height:32px;font-size:15px}
.pf-side .pf-hint{font-size:12px}
.profile-body .partner-card{max-width:440px;margin:0 auto}
@media(max-width:900px){
  .pf-side .pf-palette{flex-direction:row;justify-content:center}
  .pf-side .pf-brush{width:auto}
  .pf-grid .pf-cell{height:36px;font-size:14px}
}
@media(max-width:600px){.pf-grid{min-width:620px}}
@media(max-width:900px){.pf-side .pf-palette{flex-wrap:wrap;gap:8px 16px}.pf-side .pf-brush{gap:6px}}
@media(max-width:900px){.pf-layout{grid-template-columns:minmax(0,1fr)}}
.int-list{display:flex;flex-direction:column;gap:6px}
.int-row{display:flex;align-items:center;gap:12px;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.int-who{display:flex;flex-direction:column;min-width:0;flex:1}
.int-who a{color:var(--muted);font-size:var(--text-sm);overflow:hidden;text-overflow:ellipsis}
.int-when{font-size:var(--text-sm);color:var(--muted);white-space:nowrap}
#interest-list{margin-top:var(--sp-5)}

/* ---- v159: Top bar: no crest, tidier pills that never touch on hover ---- */
.topbar-nav{gap:6px}
.topbar-nav a{height:34px;padding:0 13px}
.topbar-nav a:hover{background:rgba(244,238,227,.1);box-shadow:inset 0 0 0 1px rgba(233,196,106,.7)}
.topbar-nav a.active,.topbar-nav a.active:hover{box-shadow:none}
.topbar-nav a.nav-admin:hover{box-shadow:inset 0 0 0 1.5px var(--gold);background:rgba(233,196,106,.12)}
@media(max-width:700px){.topbar-nav{gap:4px}.topbar-nav a{padding:0 11px}}
/* Home: five dashboard boxes; Headline Stats heading with a More Stats link on the right */
.dash-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:900px){.dash-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dash-grid>.dash-position{grid-column:1 / -1}}
.home-h-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:var(--sp-6);border-bottom:1px solid var(--line);margin-bottom:var(--sp-4)}
.home-h-row .home-h{margin:0;padding-bottom:var(--sp-3);border-bottom:0}
.more-link{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font-weight:700;font-size:14px;text-decoration:none;white-space:nowrap;transition:box-shadow .15s,border-color .15s}
.more-link:hover{border-color:var(--gold);box-shadow:var(--hover-ring);background:var(--surface-hover)}
/* v159 My Stats: won (green) and lost (red) side by side, everything centred */
.my-tiles{grid-template-columns:repeat(6,minmax(0,1fr))}
.my-tiles .stat-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px}
.wl-nums{display:flex;gap:16px;justify-content:center}
.wl-nums>span{display:flex;flex-direction:column;align-items:center;line-height:1}
.wl-nums b{font-family:var(--font-hero);font-size:34px;font-weight:800}
.wl-nums small{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.wl-won b{color:var(--win)}
.wl-lost b{color:var(--loss)}
.stat-tile.wl .stat-tile-label{order:-1;margin-bottom:6px}
@media(max-width:900px){.my-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.my-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
.dec-big{font-size:64px}
.dec-big small{font-size:26px}
.dec-cap{font-size:14px}
.dec-dot{width:36px;height:36px;font-size:16px;cursor:help}
.dec-empty{font-size:16px}
.sc-record .form-chip{cursor:help}
/* v159 Fantasy: jump links under the title */
.jump-links{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:0 0 var(--sp-4)}
.jump-links a{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font-weight:700;font-size:14px;text-decoration:none;transition:box-shadow .15s,border-color .15s,background .15s}
.jump-links a svg{color:var(--gold2)}
.jump-links a:hover{border-color:var(--gold);background:var(--surface-hover);box-shadow:var(--hover-ring)}
html{scroll-behavior:smooth}
#fx-table,#fx-picks,#fx-history{scroll-margin-top:calc(var(--bar-total) + var(--motm-offset) + var(--admin-offset) + 16px)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* v159 Teams: the same amber hover as the Home dashboard tiles */
.team-row.tm-card:hover{background:var(--surface-hover);border-color:var(--gold);box-shadow:var(--hover-ring)}
/* v159 Rules flowchart: more room around the split, detail as short lines */
.rf-node.rf-diamond{margin:0 18px 0 12px}
.rf-lanes{padding-left:18px;margin-left:6px;gap:14px}
.rf-points{list-style:none;margin:0;padding:0}
.rf-points li{position:relative;padding:6px 0 6px 18px;border-bottom:1px solid rgba(var(--tint),.08);line-height:1.45}
.rf-points li:last-child{border-bottom:0}
.rf-points li::before{content:"";position:absolute;left:2px;top:14px;width:7px;height:7px;border-radius:50%;background:var(--gold)}
@media(max-width:700px){.rf-node.rf-diamond{margin:0 12px 0 8px}.rf-lanes{padding-left:12px}}
@media(max-width:480px){.jump-links{gap:6px;flex-wrap:nowrap}.jump-links a{padding:7px 11px;font-size:13px}.jump-links a svg{display:none}}

/* v159 Fixture page: a wide match card (like Home's Next League Match), then panels */
.fx-page{display:flex;flex-direction:column;gap:var(--sp-5)}
.fx-page .next-fixture-card.fxc{margin:0;gap:var(--sp-4)}
.fxc .status-pill.scheduled{background:var(--gold);color:var(--on-accent)}
.fxc-row{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:var(--sp-4);align-items:center}
.fxc-team{display:flex;flex-direction:column;gap:10px;align-items:flex-start;min-width:0}
.fxc-team.right{align-items:flex-end;text-align:right}
.fxc-avs{display:flex}
.fxc-av{width:56px;height:56px;border-radius:50%;object-fit:cover;border:2px solid var(--ink);background:rgba(244,238,227,.12);flex:none}
.fxc-av + .fxc-av{margin-left:-12px}
.fxc-av.is-initials{display:inline-flex;align-items:center;justify-content:center;color:var(--page-bg);font-weight:800;font-size:17px;letter-spacing:.02em;box-shadow:inset 0 0 0 1px var(--inv-line)}
.fxc-name{font-family:var(--font-hero);font-weight:700;font-size:clamp(22px,3.4vw,38px);line-height:1.08;color:var(--page-bg)}
.fxc-team.lost .fxc-name,.fxc-team.lost .fxc-avs{opacity:.6}
.fxc-win{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--on-accent);background:var(--gold);border-radius:999px;padding:3px 10px}
.fxc-mid{text-align:center}
.fxc-vs{font-family:var(--font-hero);font-style:italic;font-size:clamp(24px,3vw,34px);color:var(--on-inv-accent)}
.fxc-score{display:flex;align-items:center;gap:10px;font-family:var(--font-hero);font-size:clamp(44px,6vw,72px);line-height:1;color:var(--page-bg)}
.fxc-score b{font-weight:700;opacity:.65}
.fxc-score b.w{opacity:1;color:var(--on-inv-accent)}
.fxc-score i{font-style:normal;opacity:.5;font-size:.6em}
.fxc-score-l{font-size:11px;letter-spacing:.14em;text-transform:uppercase;opacity:.7;margin-top:4px}
.fxc-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 8px;font-size:15px;font-weight:600;border-top:1px solid var(--inv-line);padding-top:var(--sp-3)}
.fxc-dot{opacity:.5}
.fxc-sets{display:grid;grid-template-columns:minmax(0,1fr) repeat(var(--n),minmax(56px,90px));gap:0;background:rgba(244,238,227,.06);border:1px solid var(--inv-line);border-radius:14px;overflow:hidden}
.fxc-sets > span{padding:10px 12px;border-bottom:1px solid var(--inv-line);text-align:center}
.fxc-sets > span.lr{border-bottom:0}
.fxc-win.ghost{visibility:hidden}
.fxc-sets .fxc-sh{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--on-inv-accent)}
.fxc-sets .fxc-st{text-align:left;font-weight:700;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fxc-sets .fxc-sv{font-family:var(--font-hero);font-size:24px;line-height:1.1;opacity:.6}
.fxc-sets .fxc-sv.w{opacity:1;color:var(--on-inv-accent);font-weight:700}
.fxc-games{text-align:center;font-size:13px;opacity:.75;margin-top:-6px}
.fxc .nf-bottom{justify-content:center}

.fx-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-5);align-items:start}
.fx-panel{text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:var(--sp-5);min-width:0}
.fx-panel.wide{grid-column:1 / -1}
.fx-panel-top{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-3)}
.fx-panel-h{font-family:var(--font-hero);font-size:24px;margin:0;border:0;padding:0}
.fx-panel-lead{margin:0 0 var(--sp-4);color:var(--muted);font-size:15px;line-height:1.5}
.fx-panel-lead b{color:var(--ink)}
.fx-panel .submit-score-block{margin:0;text-align:left}
.fx-panel .submit-score-block:not(.open):not(.pending){padding:0;background:none;border:0}
.fx-panel .submit-score-block + .submit-score-block{margin-top:var(--sp-3)}
.fx-panel .compare-block{margin:0;padding:0;background:none;border:0}
.fx-panel .predict-block{margin-top:0}

/* Submit the result: a small grid, one row per team, one column per set */
.fxs-grid{display:grid;grid-template-columns:minmax(0,1fr) repeat(var(--n),minmax(64px,96px));gap:8px 10px;align-items:center;max-width:560px}
.fxs-h{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:center;display:flex;flex-direction:column;line-height:1.2}
.fxs-h small{font-weight:600;letter-spacing:0;text-transform:none;font-size:11px}
.fxs-t{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fxs-grid .submit-score-input{width:100%;height:48px;text-align:center;font-size:22px;font-family:var(--font-hero);border:1px solid var(--line);border-radius:12px;background:var(--page-bg);color:var(--ink);margin:0;padding:0}
.fxs-grid .submit-score-input:focus-visible{box-shadow:var(--hover-ring);outline:0}
.fxs-hint{font-size:13px;color:var(--muted);margin:10px 0 0}
.fx-submit .submit-score-actions{justify-content:flex-start;margin-top:var(--sp-3)}
.fx-submit .submit-score-error:empty{display:none}

/* Man of the Match */
.motm-progress{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--muted)}
.motm-progress i{width:10px;height:10px;border-radius:50%;background:rgba(var(--tint),.14)}
.motm-progress i.on{background:var(--win)}
.motm-progress b{margin-left:6px;font-weight:700}
.motm-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-3)}
.motm-tile{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:var(--sp-4) var(--sp-2);border:1px solid var(--line);border-radius:16px;background:var(--page-bg);color:var(--ink);font:inherit;text-align:center;min-width:0}
button.motm-tile{cursor:pointer;transition:box-shadow .15s,transform .15s}
button.motm-tile:hover,button.motm-tile:focus-visible{box-shadow:var(--hover-ring);outline:0;transform:translateY(-1px)}
.motm-av{width:64px;height:64px;border-radius:50%;object-fit:cover;background:rgba(var(--tint),.08)}
.motm-av.is-initials{display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:20px;color:var(--muted)}
.motm-tile-name{font-weight:700;font-size:15px;line-height:1.25}
.motm-tile-name i{font-style:normal;font-weight:500;color:var(--muted)}
.motm-tile-status{font-size:12px;color:var(--muted)}
.motm-tile-status.voted{color:var(--win);font-weight:700}
.motm-tile-votes{font-size:13px;color:var(--muted);font-weight:600}
.motm-tile-cta{margin-top:4px;font-size:13px;font-weight:700;padding:5px 14px;border-radius:999px;border:1px solid var(--gold);color:var(--ink)}
button.motm-tile:hover .motm-tile-cta{background:var(--gold);color:var(--on-accent)}
.motm-tile-cta.mine{background:var(--gold);color:var(--on-accent)}
.motm-tile.winner{border-color:var(--gold);background:rgba(var(--accent-rgb),.12)}
.motm-tile.winner .motm-tile-votes{color:var(--ink);font-weight:800}
.motm-medal{position:absolute;top:8px;right:10px;font-size:20px}

@media(max-width:760px){
  .fx-panels{grid-template-columns:minmax(0,1fr);gap:var(--sp-4)}
  .fxc-row{gap:var(--sp-2)}
  .fxc-av{width:42px;height:42px}
  .fxc-av + .fxc-av{margin-left:-10px}
  .fxc-name{font-size:19px}
  .fxc-score{font-size:40px;gap:6px}
  .fxc-sets{grid-template-columns:minmax(0,1fr) repeat(var(--n),minmax(44px,64px))}
  .fxc-sets > span{padding:8px}
  .fxc-sets .fxc-st{font-size:13px}
  .fxc-sets .fxc-sv{font-size:20px}
  .motm-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fx-panel{padding:var(--sp-4);border-radius:16px}
  .fxs-grid{grid-template-columns:minmax(0,1fr) repeat(var(--n),minmax(52px,72px))}
}
.fx-panel .btn-primary{width:auto;padding:12px 26px}
.fx-h2h .compare-block,.fx-predict.wide .predict-block,.fx-predict.wide .odds-row,.fx-predict.wide .predictor-locked,.fx-predict.wide .vote-block{max-width:640px;margin-left:auto;margin-right:auto}
@media(max-width:760px){.fx-panel .btn-primary{width:100%}}
.fx-submit .submit-score-actions button{flex:none}
.fxs-grid{grid-template-columns:max-content repeat(var(--n),minmax(64px,96px));gap:8px 14px}
.fxs-t{padding-right:12px}
@media(max-width:760px){.fx-submit .submit-score-actions button{flex:1}.fxs-grid{grid-template-columns:minmax(0,1fr) repeat(var(--n),minmax(48px,64px));gap:8px}}
.fxc-sh .sm{display:none}
@media(max-width:760px){
  .fxc-sh .lg{display:none}.fxc-sh .sm{display:inline}
  .fxc-name{font-size:17px;line-height:1.15}
  .fxc-score{font-size:34px}
  .fxc-meta{flex-direction:column;align-items:center;gap:2px;font-size:14px;text-align:center}
  .fxc-dot{display:none}
  .fxc-sets{grid-template-columns:minmax(0,1fr) repeat(var(--n),48px)}
  .motm-av{width:52px;height:52px}
}
@media(max-width:760px){.fxc-sets .fxc-sh{white-space:nowrap;letter-spacing:.04em;padding:8px 4px}}

/* v159 Admin: one outline button style, right-aligned actions, embedded selects, Add New Player pop-up */
html{scrollbar-gutter:stable}
#admin-view .ad-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:none;width:auto;min-width:0;max-width:none;min-height:40px;margin:0;padding:8px 18px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font:inherit;font-size:14px;font-weight:700;line-height:1.2;cursor:pointer;box-shadow:none}
#admin-view .ad-btn:hover,#admin-view .ad-btn:focus-visible,.ad-dialog .ad-btn:hover,.ad-dialog .ad-btn:focus-visible{box-shadow:var(--hover-ring);outline:0}
#admin-view .ad-btn.primary,#admin-view .ad-btn.on{border-color:var(--gold);background:rgba(var(--accent-rgb),.14)}
#admin-view .ad-btn.danger{color:var(--loss);border-color:rgba(var(--loss-rgb),.45)}
#admin-view .ad-btn:disabled{opacity:.6;cursor:default}
.ad-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;margin-top:var(--sp-3)}
.pl-detail .player-detail-actions.ad-actions button{flex:none;min-height:40px}
.ad-row2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
.pl-top{display:flex;justify-content:flex-end;margin-bottom:var(--sp-3)}
#v-add{margin-top:var(--sp-3)}
.venue-card + .venue-form{margin:-4px 0 var(--sp-3)}
#ratings-section .ratings-list{margin-bottom:var(--sp-5)}
.int-btns{display:flex;gap:6px;margin-left:auto}
.int-row .int-when{margin-left:auto}
.int-row .int-when + .int-btns{margin-left:0}
#interest-list .btn-ghost{min-height:34px;padding:5px 14px;font-size:13px;width:auto;flex:none;margin:0}

/* Selects that look like part of the site, not the operating system */
#admin-view select,.ad-dialog select,.ad-select{-webkit-appearance:none;appearance:none;width:100%;min-height:48px;padding:9px 38px 9px 12px;border:1px solid var(--line);border-radius:12px;background-color:var(--page-bg);color:var(--ink);font:inherit;font-size:15px;line-height:1.3;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23C9A24A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
#admin-view select:hover,#admin-view select:focus-visible,.ad-dialog select:hover,.ad-dialog select:focus-visible{box-shadow:var(--hover-ring);outline:0}
#admin-view .venue-hours select{width:auto;min-width:120px}
#admin-view select option,.ad-dialog select option{background:var(--panel);color:var(--ink)}

.ad-dialog{border:0;padding:0;border-radius:20px;background:var(--panel);color:var(--ink);width:min(480px,calc(100vw - 32px));box-shadow:0 24px 60px rgba(0,0,0,.35)}
.ad-dialog::backdrop{background:rgba(10,20,15,.55);backdrop-filter:blur(2px)}
.ad-dialog-form{display:grid;gap:var(--sp-3);padding:var(--sp-5)}
.ad-dialog h3{margin:0;font-family:var(--font-hero);font-size:24px}
.ad-dialog input{width:100%;margin:0}
.ad-dialog-note{margin:0;font-size:13px;color:var(--muted);line-height:1.45}
.ad-dialog .error-msg:empty{display:none}
.ad-dialog .ad-actions{margin-top:var(--sp-2)}
.ad-dialog .ad-btn{display:inline-flex;align-items:center;justify-content:center;min-height:40px;margin:0;padding:8px 18px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font:inherit;font-size:14px;font-weight:700;width:auto;flex:none;cursor:pointer}
.ad-dialog .ad-btn.primary{border-color:var(--gold);background:rgba(var(--accent-rgb),.14)}
@media(max-width:520px){.ad-row2{grid-template-columns:1fr}}
#admin-view #v-add{display:flex;margin:var(--sp-3) auto 0}

/* v159 User menu: hangs from the bottom of the top bar, right-aligned, with icons */
.topbar .user-name{font-size:15px;font-weight:700}
.topbar .user-menu{position:fixed;top:calc(var(--motm-offset) + var(--admin-offset) + var(--bar-h) - 1px);z-index:3;right:0;left:auto;min-width:220px;padding:6px 8px 10px;background:var(--bar-bg);color:var(--bar-text);border:0;border-radius:0 0 0 18px;box-shadow:0 18px 30px -12px rgba(0,0,0,.45)}
.topbar .user-menu-item{justify-content:flex-end;gap:12px;min-height:44px;padding:0 16px;color:var(--bar-text);font-size:15px;font-weight:600;text-align:right}
.topbar .user-menu-item svg{flex:none;opacity:.9}
.topbar .user-menu-item:hover,.topbar .user-menu-item:focus-visible{background:rgba(244,238,227,.1);box-shadow:none;outline:0}
.topbar .user-menu-item.signout{color:#F2A49A}
.topbar .user-menu-item + .user-menu-item{border-top:1px solid rgba(244,238,227,.1);border-radius:0 0 10px 10px}


/* v159 Landing: Tim's floodlit court photo, a slow drift, and a dark grade behind the words so they never fight the picture */
.landing-bg{position:absolute;inset:-3%;z-index:-3;background:#05090f url("hero-desktop.jpg?v=180") 78% 62%/cover no-repeat;filter:saturate(.9) contrast(1.05) brightness(.85);animation:lp-drift 38s ease-in-out infinite alternate;transform-origin:62% 62%}
@keyframes lp-drift{from{transform:scale(1.02) translate3d(0,0,0)}to{transform:scale(1.1) translate3d(-1.2%,-1%,0)}}
/* Colour grade + the dark side the words sit on, then a vignette and fine grain */
.landing::before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;opacity:1;
  background:
    linear-gradient(90deg,rgba(3,8,14,.92) 0%,rgba(3,8,14,.78) 28%,rgba(3,8,14,.35) 55%,rgba(3,8,14,.05) 75%,rgba(3,8,14,.3) 100%),
    linear-gradient(0deg,rgba(3,8,14,.75) 0%,rgba(3,8,14,0) 30%),
    linear-gradient(180deg,rgba(3,8,14,.45) 0%,rgba(3,8,14,0) 25%),
    linear-gradient(135deg,rgba(18,38,29,.25),rgba(10,20,40,.25))}
.landing::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(120% 90% at 60% 55%,transparent 45%,rgba(0,0,0,.55) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity:.9;mix-blend-mode:normal}
.landing .landing-inner{z-index:1}
/* Desktop: the words sit on the dark left side, the lit courts stay clear on the right */
@media (min-width:761px){
  .landing{justify-content:flex-start;padding-left:max(clamp(32px,7vw,120px),env(safe-area-inset-left))}
  .landing-inner{align-items:flex-start;text-align:left;max-width:520px}
  .landing-actions{justify-content:flex-start}
  .landing-title{font-size:clamp(48px,9vh,88px)}
}
.landing-title{text-shadow:0 2px 24px rgba(0,0,0,.6)}
.landing-tag{font-size:clamp(16px,2.2vh,20px);font-weight:600;color:#fff;opacity:.9;letter-spacing:.01em;text-shadow:0 1px 12px rgba(0,0,0,.7)}
.landing-crest{filter:drop-shadow(0 4px 18px rgba(0,0,0,.6)) brightness(1.05)}
.landing-btn:not(.primary){background:rgba(5,12,20,.45);border-color:rgba(255,255,255,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.landing-panel{background:rgba(5,12,20,.78)}
/* A gentle rise-in when the page opens */
.landing-inner > *{animation:lp-rise .9s cubic-bezier(.2,.7,.2,1) both}
.landing-inner > :nth-child(2){animation-delay:.08s}
.landing-inner > :nth-child(3){animation-delay:.16s}
.landing-inner > :nth-child(4){animation-delay:.24s}
@keyframes lp-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
/* Phone: the portrait photo, name at the top in the dark sky, buttons at the bottom over the grass */
@media (max-width:760px){
  .landing-bg{background-image:url("hero-mobile.jpg?v=180");background-position:center bottom;transform-origin:50% 75%}
  .landing::before{background:
    linear-gradient(180deg,rgba(3,8,14,.55) 0%,rgba(3,8,14,.15) 38%,rgba(3,8,14,0) 55%,rgba(3,8,14,.55) 80%,rgba(3,8,14,.9) 100%),
    linear-gradient(135deg,rgba(18,38,29,.2),rgba(10,20,40,.2))}
  .landing:not(.open){align-items:stretch;padding-top:max(9vh,env(safe-area-inset-top));padding-bottom:max(28px,env(safe-area-inset-bottom))}
  .landing:not(.open) .landing-inner{justify-content:flex-start}
  .landing:not(.open) .landing-actions{margin-top:auto;flex-direction:column;align-items:stretch;gap:10px;max-width:360px;align-self:center}
  .landing:not(.open) .landing-btn{width:100%}
  .landing.open::before{background:rgba(3,8,14,.6)}
}
@media (prefers-reduced-motion:reduce){.landing-bg,.landing-inner > *{animation:none}}
html:has(.landing-body){scrollbar-gutter:auto}
.landing-tag{max-width:none;text-wrap:balance}
@media (max-width:760px){.landing:not(.open) .landing-title{font-size:min(14vw,60px)}}
@media (max-width:760px){.landing.open .landing-title{font-size:34px}}


/* v159 Recent Results ticker: a dark amber strip under the top bar, same in light and dark mode */
.ticker{--tk-bg:#7A4F08;--tk-ink:#FFF3D6;--tk-hi:#FFD27A;position:absolute;left:0;right:0;top:100%;height:var(--ticker-h);display:flex;align-items:stretch;background:var(--tk-bg);color:var(--tk-ink);
  font-family:'Barlow Condensed','Arial Narrow',sans-serif;font-size:17px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,210,122,.18),0 6px 14px -8px rgba(0,0,0,.4)}
.tk-label{flex:none;display:flex;align-items:center;padding:0 14px 0 max(16px,env(safe-area-inset-left,0px));background:#4A2F05;color:var(--tk-hi);font-weight:700;letter-spacing:.12em;font-size:15px;position:relative;z-index:1}
.tk-label::after{content:"";position:absolute;right:-12px;top:0;bottom:0;width:12px;background:linear-gradient(90deg,#4A2F05,rgba(74,47,5,0))}
.tk-viewport{flex:1;min-width:0;overflow:hidden;display:flex;align-items:center;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 28px,#000 calc(100% - 28px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 28px,#000 calc(100% - 28px),transparent 100%)}
.tk-track{display:flex;width:max-content;animation:tk-scroll 40s linear infinite;will-change:transform;backface-visibility:hidden}
.ticker:hover .tk-track{animation-play-state:paused}
.tk-run{display:flex;flex:none}
@keyframes tk-scroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.tk-item{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;padding:0 22px;position:relative}
.tk-item::after{content:"";position:absolute;right:0;top:50%;width:4px;height:4px;margin-top:-2px;border-radius:50%;background:rgba(255,210,122,.45)}
.tk-ic{flex:none;color:var(--tk-hi)}
.tk-n{color:#fff}
.tk-n .tk-ic{color:#FFB547}
.tk-round{font-size:13px;font-weight:700;color:var(--tk-hi);opacity:.85;margin-right:2px}
.tk-score{font-weight:700;color:#fff;background:rgba(0,0,0,.28);border-radius:4px;padding:1px 7px;font-variant-numeric:tabular-nums}
.tk-win{color:#fff;font-weight:700}
.tk-sets{font-weight:500;opacity:.75;font-size:15px;font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){.tk-track{animation:none}.tk-viewport{overflow-x:auto}}
@media (max-width:700px){.ticker{font-size:16px}.tk-label{font-size:13px;padding-right:10px}.tk-item{padding:0 16px}}

/* v159 Admin: five tiles, and the News and Alerts form */
@media(min-width:901px){.ad-tiles{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(min-width:701px) and (max-width:900px){.ad-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
.news-form{display:grid;gap:8px;margin-bottom:var(--sp-5);padding:var(--sp-4);background:var(--panel);border:1px solid var(--line);border-radius:16px}
.news-form textarea{width:100%;box-sizing:border-box;min-height:96px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--page-bg);color:var(--ink);font:inherit;font-size:16px;resize:vertical;margin:0}
.news-form textarea:focus-visible{box-shadow:var(--hover-ring);outline:0}
.news-foot{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3)}
.news-count{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.news-form .error-msg:empty{display:none}
.news-row .int-who{display:flex;flex-direction:column;gap:2px;min-width:0}
.news-row .int-who b{font-weight:600;line-height:1.35;word-break:break-word}
.news-row .int-who small{color:var(--muted);font-size:12px}
.news-row.off{opacity:.6}

/* v159 Fixtures: the title, filters and view buttons stay put; only the content below slides between views */
.fxl-filters{flex-wrap:wrap}
.fxl-filters .fxl-view{margin-left:auto}
.fxl-section[data-view="grid"] .fxl-star,.fxl-section[data-view="grid"] .fxl-pick,
.fxl-section[data-view="grid"] .fxl-checks,.fxl-section[data-view="grid"] .fxl-clear{display:flex !important;visibility:hidden}
.fxl-section[data-view="grid"] .fxl-clear{display:inline-block !important}
.fxl-stage{view-transition-name:fx-stage}
html[data-fx-slide]::view-transition-old(root),html[data-fx-slide]::view-transition-new(root){animation:none}
html[data-fx-slide]::view-transition-group(fx-stage){animation-duration:.42s;animation-timing-function:cubic-bezier(.3,.7,.2,1)}
html[data-fx-slide="next"]::view-transition-old(fx-stage){animation:fx-out-left .42s cubic-bezier(.3,.7,.2,1) both}
html[data-fx-slide="next"]::view-transition-new(fx-stage){animation:fx-in-right .42s cubic-bezier(.3,.7,.2,1) both}
html[data-fx-slide="prev"]::view-transition-old(fx-stage){animation:fx-out-right .42s cubic-bezier(.3,.7,.2,1) both}
html[data-fx-slide="prev"]::view-transition-new(fx-stage){animation:fx-in-left .42s cubic-bezier(.3,.7,.2,1) both}
@keyframes fx-out-left{to{transform:translateX(-40%);opacity:0}}
@keyframes fx-in-right{from{transform:translateX(40%);opacity:0}}
@keyframes fx-out-right{to{transform:translateX(40%);opacity:0}}
@keyframes fx-in-left{from{transform:translateX(-40%);opacity:0}}
html[data-fx-slide]::view-transition-old(fx-stage),html[data-fx-slide]::view-transition-new(fx-stage){height:auto;width:100%;object-fit:none;object-position:top}

/* ---- v160: centred menu with a sliding highlight ---- */
@media(min-width:761px){
  .topbar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(max-content,1fr);gap:var(--sp-4)}
  .topbar-nav{grid-column:2}
  .topbar-right{grid-column:3;justify-self:end}
}
.topbar-nav{position:relative;z-index:1;view-transition-name:nav-links}
.topbar-nav a:first-child{margin-left:auto}.topbar-nav a:last-child{margin-right:auto}   /* centred, but never cut off when it scrolls */
.nav-pill{position:absolute;left:0;top:0;z-index:0;border-radius:999px;background:var(--gold);pointer-events:none;view-transition-name:nav-pill}
.topbar-nav a.active,.topbar-nav a.nav-admin.active{background:transparent}
.topbar-nav a:hover{background:rgba(244,238,227,.08);box-shadow:inset 0 0 0 1.5px var(--gold)}
.topbar-nav a.active:hover,.topbar-nav a.nav-admin.active:hover{background:transparent;box-shadow:none;color:var(--on-accent)}
.topbar-nav a.nav-admin.active{box-shadow:none}
::view-transition-group(nav-pill){animation-duration:.45s;animation-timing-function:cubic-bezier(.65,0,.25,1)}
::view-transition-group(nav-links){animation-duration:.3s}
/* Account menu: only as wide as it needs to be */
.topbar .user-menu{min-width:0;width:max-content;padding:4px 4px 8px}
.topbar .user-menu-item{padding:0 14px}

/* ---- v160: ticker in Jersey 25, full width, with section headings ---- */
.ticker{font-family:'Jersey 25','Barlow Condensed',sans-serif;font-size:21px;font-weight:400;letter-spacing:.03em;text-transform:none}
.tk-viewport{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%)}
.tk-sec{display:inline-flex;align-items:center;gap:12px;padding:0 18px;white-space:nowrap;color:var(--tk-hi);text-transform:uppercase;letter-spacing:.1em}
.tk-sec i{display:block;width:34px;height:2px;border-radius:1px;background:currentColor;opacity:.75}
.tk-item{padding:0 20px}
.tk-item:has(+ .tk-sec)::after{display:none}
.tk-round,.tk-score,.tk-win,.tk-sets{font-weight:400}
.tk-round{font-size:17px}
.tk-score{padding:0 7px}
.tk-sets{font-size:19px}
@media (max-width:700px){.ticker{font-size:19px}.tk-item{padding:0 14px}.tk-sec{padding:0 14px}.tk-sec i{width:22px}}

/* ---- v160: My Stats ---- */
.stat-tile.wl .stat-tile-label{font-weight:800;color:var(--ink)}

/* ---- v160: Fantasy "Try it": room to breathe ---- */
.howto-sim{padding:var(--sp-5) var(--sp-5) var(--sp-5)}
.howto-sim-title{margin-bottom:var(--sp-4)}
.howto-bar-label{margin-bottom:var(--sp-3)}
.howto-sim-line{max-width:680px;gap:var(--sp-6);flex-wrap:wrap}
.howto-sim-line .howto-result{min-width:0}
.howto-points{font-size:30px;white-space:nowrap}
.howto-sim .howto-switch{margin-top:0;white-space:nowrap}
@media(max-width:560px){.howto-sim-line{gap:var(--sp-4)}.howto-sim-line .howto-bar{flex:1 1 100%;max-width:none}}

/* ---- v160: Court Availability: more room round the grid; quieter last-refreshed line ---- */
.bk-scroll{padding:6px 8px 8px 8px}
.bk-month{box-shadow:0 0 0 3px var(--cell-bg),-8px 0 0 3px var(--cell-bg)}
.bk-detail:has(> .bk-detail-hint:only-child){display:flex;align-items:center;justify-content:center}
.bk-detail-hint{font-size:16px}
.bk-refresh{margin:var(--sp-3) 0 0;padding:0 4px;text-align:right;font-size:13px;color:var(--muted);line-height:1.5}
.bk-refresh.stale{color:var(--loss-text)}

/* ---- v160: Settings: slim profile, partner as one line, Preferences ---- */
.profile-card.slim{padding:var(--sp-4) var(--sp-5);text-align:left}
.profile-card.slim .profile-top{flex-direction:row;align-items:center;gap:var(--sp-4);margin:0;padding:0}
.profile-card.slim .account-avatar{width:60px;height:60px;font-size:28px;border-width:2px}
.profile-card.slim .account-initial{font-size:26px}
.profile-card.slim .avatar-edit{width:24px;height:24px;font-size:12px;right:-4px;bottom:-2px}
.profile-card.slim .profile-name{font-size:24px}
.profile-card.slim .error-msg{margin:6px 0 0}
.partner-strap{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;margin-top:4px;font-size:14px;color:var(--ink)}
.ps-label{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold2)}
.ps-on,.ps-off{font-size:12px;font-weight:700;padding:2px 9px;border-radius:999px}
.ps-on{background:rgba(var(--win-rgb),.22);color:var(--win-text)}
.ps-off{background:rgba(var(--tint),.1);color:var(--muted)}
.settings-card .setting-row + .setting-row{margin-top:var(--sp-4);padding-top:var(--sp-4);border-top:1px solid var(--line)}
.seg-ex button{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;min-height:48px;line-height:1.15;padding:4px 18px}
.seg-ex button small{font-size:12px;font-weight:500;opacity:.8}
.setting-select{width:auto;min-width:220px;margin:0}
/* Preferred Playing Times: same breathing room as the courts grid; the key matches the grid's height */
@media(min-width:761px){.pf-layout{align-items:stretch}}
.howto-sim-side{display:flex;justify-content:center}
@media(max-width:900px){.bk-layout{grid-template-columns:minmax(0,1fr)}.bk-grid{min-width:720px}}   /* phones: key and matches go under the grid, which scrolls sideways */
.setting-text .setting-saved{font-size:13px;color:var(--win-text);font-weight:700}

/* ---- v164: phones: page name at the top, a floating dock along the bottom, a Menu sheet that pops up ---- */
.bar-title,.m-dock,.m-sheet,.m-shade{display:none}
@media(max-width:760px){
  /* No top bar on phones: just the ticker at the very top (below the notch); Settings, light/dark and
     Sign out live in the Menu sheet */
  :root{--bar-h:env(safe-area-inset-top,0px)}
  .topbar{padding:0}
  .topbar > :not(.ticker){display:none!important}
  .bar-title{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-hero);font-size:24px;font-weight:700;line-height:1.1;letter-spacing:-.01em;color:var(--bar-text)}
  body{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}
  .m-dock{display:flex;position:fixed;z-index:70;left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom,0px));height:64px;padding:0 6px;
    background:var(--bar-bg);border-radius:22px;box-shadow:0 10px 28px -8px rgba(0,0,0,.5),inset 0 0 0 1px rgba(244,238,227,.08);view-transition-name:m-dock}
  .dock-item{flex:1;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;margin:0;padding:0;min-width:0;border:0;background:none;border-radius:16px;
    color:rgba(244,238,227,.72);font-family:var(--font-body);font-size:11px;font-weight:700;letter-spacing:.02em;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .dock-item svg{width:24px;height:24px;box-sizing:content-box;padding:3px 10px;border-radius:12px}
  .dock-item.active{color:var(--gold)}
  .dock-item.active svg{background:rgba(233,196,106,.16)}
  .dock-item:active{transform:scale(.94)}
  .topbar ~ .m-dock .dock-item:hover,.dock-item:focus-visible{color:var(--bar-text);background:none;box-shadow:none;outline:0}
  .dock-item.active:hover{color:var(--gold)}
  .dock-menu{color:#fff}
  .dock-item.dock-menu{flex:none;width:58px;margin-left:4px}
  .dock-menu svg{width:26px;height:26px;padding:12px;border-radius:14px;background:#B8860B;box-shadow:0 4px 12px -4px rgba(0,0,0,.5)}
  .sheet-open .dock-menu svg{background:#C9971A}
  .dock-dot{position:absolute;top:4px;right:0;width:9px;height:9px;border-radius:50%;background:var(--hi);box-shadow:0 0 0 2px var(--bar-bg)}
  .m-shade{display:block;position:fixed;inset:0;z-index:68;background:rgba(5,12,9,.45);opacity:0;visibility:hidden;transition:opacity .22s,visibility 0s .22s}
  .sheet-open .m-shade{opacity:1;visibility:visible;transition:opacity .22s}
  .m-sheet{display:flex;flex-direction:column;align-items:stretch;gap:2px;max-height:calc(100dvh - 110px - env(safe-area-inset-bottom,0px));overflow-y:auto;overscroll-behavior:contain;position:fixed;z-index:69;right:12px;bottom:calc(84px + env(safe-area-inset-bottom,0px));width:min(260px,calc(100vw - 24px));padding:8px;
    background:var(--bar-bg);border-radius:20px;box-shadow:0 16px 36px -10px rgba(0,0,0,.55),inset 0 0 0 1px rgba(244,238,227,.08);
    transform-origin:100% 100%;transform:translateY(18px) scale(.96);opacity:0;visibility:hidden;
    transition:transform .2s cubic-bezier(.4,0,.6,1),opacity .16s,visibility 0s .2s}
  .sheet-open .m-sheet{transform:none;opacity:1;visibility:visible;transition:transform .3s cubic-bezier(.2,.9,.25,1),opacity .2s}
  .sheet-sep{height:1px;margin:6px 8px;background:rgba(244,238,227,.14)}
  button.sheet-item{width:100%;margin:0;border:0;background:none;font-family:var(--font-body);cursor:pointer}
  .sheet-item.sheet-signout{color:#F2A49A}
  .sheet-item{display:flex;align-items:center;justify-content:flex-end;gap:14px;height:41px;flex:none;padding:0 14px;border-radius:13px;color:var(--bar-text);font-size:16px;font-weight:600;text-decoration:none;text-align:right}
  .sheet-item svg{flex:none;width:22px;height:22px;opacity:.85}
  .sheet-item:hover,.sheet-item:focus-visible{background:rgba(244,238,227,.08);outline:0;box-shadow:inset 0 0 0 1.5px var(--gold)}
  .sheet-item.active,.sheet-item.active:hover{background:var(--gold);color:var(--on-accent);font-weight:800;box-shadow:none}
  .sheet-item.active svg{opacity:1}
  .sheet-item.nav-admin{color:var(--gold);margin-top:4px;box-shadow:inset 0 0 0 1.5px rgba(233,196,106,.6)}
  .sheet-item.nav-admin.active{color:var(--on-accent)}
  /* Page changes on phones: no sideways slide, the new page just takes over (the bar and dock stay put) */
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
  .update-banner,.toast{bottom:calc(88px + env(safe-area-inset-bottom,0px))}
}
@media (prefers-reduced-motion:reduce){.m-sheet,.m-shade{transition:none!important}}

/* v168: phones get the Court Availability grid on its side, days across the top and hours down the left */
.bk-flip-wrap{overflow:visible;padding:6px 4px 8px}
.bk-grid.bk-flip{min-width:0!important;width:100%;table-layout:fixed;border-spacing:3px}
.bk-flip .bk-corner{width:40px;min-width:0;padding:0;vertical-align:bottom}
.bk-flip-month{display:block;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold2);line-height:1.1;white-space:normal;word-break:break-word}
.bk-flip .bk-day{position:static;width:auto;min-width:0;padding:4px 0;text-align:center;border-radius:8px;box-shadow:none}
.bk-flip .bk-day.today{box-shadow:inset 0 0 0 1.5px var(--gold)}
.bk-flip .bk-day span{font-size:10px;letter-spacing:.04em}
.bk-flip .bk-day b{font-size:15px}
.bk-flip .bk-hour{position:static;font-size:12px;font-weight:700;color:var(--gold2);text-align:right;padding:0 4px 0 0;background:none}
.bk-flip td.bk-cell{width:auto;min-width:0;height:38px;font-size:14px}

/* v168: phones get Preferred Times on its side too (Mon to Sun across, hours down), with no tap flash or stuck hover */
.pf-cell,.pf-hourhead,.pf-dayhead,.pf-brush{-webkit-tap-highlight-color:transparent}
@media(hover:none){.pf-cell:hover{filter:none;transform:none}}
.pf-grid.pf-flip{min-width:0!important;width:100%;table-layout:fixed;border-spacing:3px}
.pf-flip .bk-corner{width:40px;box-shadow:none}
.pf-flip .pf-dayhead{position:static;width:auto;min-width:0;padding:6px 0;text-align:center;box-shadow:none;border-radius:8px}
.pf-flip .pf-dayhead b{font-size:13px}
.pf-flip .pf-hourhead{font-size:12px;text-align:right;padding:0 4px 0 0}
.pf-flip .pf-cell{width:auto;min-width:0;height:36px;font-size:15px}
.pf-main .bk-scroll:has(.pf-flip){overflow:visible;padding:6px 4px 8px}

/* v168: suggested time leads with the best option; other venues sit in a full-width "Try alternate locations" picker */
.suggest-best-label{margin:0 0 var(--sp-2);font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold2)}
.suggest-alt-box{margin-top:var(--sp-4);padding-top:var(--sp-4);border-top:1px solid var(--line);text-align:left}
.suggest-alt-label{display:block;margin:0 0 6px;font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold2)}
.suggest-alt-box .suggest-venue{display:block;width:100%;max-width:none;margin:0 0 var(--sp-3)}
.suggest-alt-box .suggest-slot{text-align:center}
@media(max-width:760px){.fx-panels>.fx-first{order:-1}}

/* v169: Settings opens with you and your partner side by side, joined by a handshake */
.profile-card.duo-card{padding:var(--sp-4);text-align:center}
.duo{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-3);align-items:stretch}
.duo-box{display:flex;flex-direction:column;align-items:center;gap:4px;padding:var(--sp-4) var(--sp-2);background:var(--page-bg);border:1px solid var(--line);border-radius:var(--radius);min-width:0}
.duo-box .account-avatar-btn{position:relative;display:block;margin-bottom:6px}
.duo-box .account-avatar{width:64px;height:64px;margin:0;border:2px solid var(--gold);background:var(--surface);font-size:28px}
.duo-box .account-initial{font-size:26px}
.duo-box .avatar-edit{width:24px;height:24px;font-size:12px;right:-4px;bottom:-2px}
.duo-avatar{display:flex;align-items:center;justify-content:center;border-radius:50%;overflow:hidden;margin-bottom:6px!important}
.duo-box .profile-name{font-size:20px;line-height:1.15;overflow-wrap:anywhere}
.duo-box .ps-on,.duo-box .ps-off{margin-top:4px}
.duo-shake{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:22px;background:var(--cell-bg,var(--surface));border:1px solid var(--line);border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.12);z-index:1}
@media(min-width:761px){.duo-box .account-avatar{width:80px;height:80px;font-size:34px}.duo-box .profile-name{font-size:24px}.duo{gap:var(--sp-5)}}
.duo-shake{width:54px;height:54px;font-size:30px}
@media(min-width:761px){.duo-shake{width:76px;height:76px;font-size:44px}}

/* v172: a match starting mid-hour spans its two boxes as one block, with its start and end times */
.bk-cell.bk-span{line-height:1.05;padding:2px 0}
.bk-span-ball{font-size:15px;margin-right:4px}
.bk-span-time{font-size:11px;font-weight:800;white-space:nowrap}
.bk-span-time i{font-style:normal;margin:0 1px}
.bk-flip .bk-cell.bk-span{vertical-align:middle}
.bk-flip .bk-span-ball{display:block;margin:0 0 3px;font-size:16px}
.bk-flip .bk-span-time{display:flex;flex-direction:column;align-items:center;font-size:10px;line-height:1.15}
.bk-flip .bk-span-time i{line-height:.8}

/* v173: cancelling a booked match (fixture page) */
.fxc-cancelled{text-align:center;font-size:13px;font-weight:600;color:var(--on-inv-accent);margin-top:calc(-1 * var(--sp-2))}
.fx-panel .fx-cancel .cancel-match-open{width:100%;margin:0;min-height:44px;color:var(--loss-text);border-color:rgba(var(--loss-rgb),.45)}
.fx-panel .fx-cancel .cancel-match-open:hover{background:rgba(var(--loss-rgb),.12);border-color:var(--loss)}
.confirm-box.cancel-box{max-width:400px;text-align:center}
.cancel-box .propose-label{display:block;text-align:left}
.cancel-box .cancel-dt,.cancel-box .cancel-loc{width:100%;text-align:left}
.cancel-box .submit-score-error{min-height:1em;margin:var(--sp-2) 0;color:var(--loss-text);font-size:13px}
.cancel-lead{font-size:14px;color:var(--muted);line-height:1.45;margin-bottom:var(--sp-3)}
.cancel-slots{display:grid;gap:var(--sp-2);margin-bottom:var(--sp-2)}
.cancel-slot{display:flex;flex-direction:column;align-items:center;gap:3px;padding:var(--sp-3);border:1px solid var(--line);border-radius:14px;background:var(--page-bg)}
.cancel-slot-tag{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold2)}
.cancel-slot-when{font-family:var(--font-hero);font-size:18px;color:var(--text)}
.cancel-use{min-height:40px;margin-top:4px}

/* v174: Instagram button under the landing page buttons, with the handle beside it */
.landing-insta{display:inline-flex;align-items:center;gap:12px;margin-top:18px;color:#fff;font-weight:700;font-size:15px;text-shadow:0 1px 10px rgba(0,0,0,.7)}
.landing-insta span{opacity:.9}
.landing-insta-btn{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:var(--gold);color:#12261d;box-shadow:0 4px 14px rgba(0,0,0,.45);transition:box-shadow .15s,transform .15s}
.landing-insta-btn:hover,.landing-insta-btn:focus-visible{outline:none;transform:scale(1.06);box-shadow:0 0 0 3px rgba(5,12,20,.9),0 0 0 5px var(--gold),0 4px 14px rgba(0,0,0,.45)}
.landing.open .landing-insta{display:none}
@media (max-width:760px){.landing:not(.open) .landing-insta{align-self:center;margin-top:16px}}

/* v176: a hand-drawn arrow unfurls towards Join the Waitlist, with handwritten signup news */
.landing-wl{position:relative;display:flex;flex-direction:column}
.landing-callout{position:absolute;left:calc(100% + 4px);top:calc(50% - 12px);display:flex;align-items:flex-start;pointer-events:none;color:var(--gold)}
.landing-callout svg{flex:none;width:70px;height:36px;overflow:visible}
.landing-callout path{fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:lc-draw .7s cubic-bezier(.5,0,.3,1) 1s forwards}
.landing-callout .lc-head{animation-delay:1.6s;animation-duration:.2s}
.landing-callout-text{font-family:"Caveat",cursive;font-weight:700;font-size:26px;line-height:1.02;width:250px;margin:-14px 0 0 4px;transform:rotate(-4deg);transform-origin:left center;text-shadow:0 2px 12px rgba(0,0,0,.8);clip-path:inset(-10px 100% -10px 0);animation:lc-write 1.1s steps(28,end) 1.75s forwards}
@keyframes lc-draw{to{stroke-dashoffset:0}}
@keyframes lc-write{to{clip-path:inset(-10px -10px -10px 0)}}
.landing.open .landing-callout{display:none}
@media (max-width:760px){
  /* Phone: just under the button, the smile curls up to it and the words come out the other end */
  .landing-callout{position:static;align-self:center;margin:2px 0 -14px 30px}
  .landing-callout-text{font-size:23px;width:auto;max-width:220px;margin-top:4px}
}
@media (prefers-reduced-motion:reduce){.landing-callout path,.landing-callout-text{animation:none;stroke-dashoffset:0;clip-path:none}}
/* v178: Back uses the site's gold-ring hover (never a white fill); the main button sits as far below the email as the email sits below the names */
.landing-back,.landing-back:hover,.landing-back:focus,.landing-back:focus-visible,.landing-back:active{background:none!important;color:rgba(255,255,255,.85);outline:none;border-radius:999px;padding:6px 14px;transition:box-shadow .15s,color .15s}
.landing-back:hover,.landing-back:focus-visible{color:#fff;box-shadow:0 0 0 2px var(--gold)}
.landing-panel .landing-btn.wide{margin-top:21px}
/* v179: phones get their own arrow, from the signup words curling up so the head points at Join the Waitlist */
.landing-callout .lc-phone{display:none}
@media (max-width:760px){
  .landing-callout .lc-desk{display:none}
  .landing-callout .lc-phone{display:block;width:60px;height:48px}
  .landing-callout{margin:4px 0 -12px 0}
  .landing-callout-text{margin-top:22px;margin-left:2px;text-align:left}
}
/* v180: phones lift the buttons up under the tagline, clear of the court; Instagram stays at the bottom, a touch smaller */
@media (max-width:760px){
  .landing:not(.open) .landing-actions{margin-top:28px}
  .landing:not(.open) .landing-insta{margin-top:auto}
  .landing-insta-btn{width:40px;height:40px}
  .landing-insta-btn svg{width:20px;height:20px}
  .landing-insta{font-size:14px;gap:10px}
}
