/* app.css — the shared shell + player/organizer surface styles.
   Loaded by every layout. Split out of layout.templ (F11); the theme
   tokens and the data-theme / data-scale overrides live here, so keep new
   player-surface font sizes expressed against --ui-k (see below). */
:root{
	--bg:#F1F3EE;--surface:#FFFFFF;--surface-2:#E9EDE7;--ink:#1C2B22;--muted:#5C6B60;
	--line:#D8DFD6;--accent:#2F7D4E;--accent-ink:#FFFFFF;--under:#C0392B;--live:#E8B33C;
	--chip:#E4EAE2;--board:#123227;--board-ink:#EDF3EC;--board-line:#23493B;--board-muted:#8FAB9D;
	/* Reach scale (0043). ONE factor drives type AND touch targets on every
	   player surface, because the old two-tier data-bigtext grew the text and
	   left the 52px stepper alone - the setting that exists for cold hands and
	   sun on the screen was making mis-taps MORE likely. Every player-surface
	   size below is calc(base * var(--ui-k)); adding a new one means writing it
	   that way, not adding an override tier. */
	--ui-k:1;
	--score:calc(15px * var(--ui-k));--big:calc(17px * var(--ui-k));
	/* Scorecard marks tint the CELL and leave the number alone - rings at four
	   rows by eighteen holes were landing on two cells in three and became
	   texture rather than signal. One diverging scale, blue through red to
	   purple, par untinted because it is the commonest score and should be
	   the quiet one. Hue says which side of par; strength says how far, so
	   the ramp still reads as distance in greyscale or on a photocopy even
	   though the direction needs the par row. Alpha, not hex, so one set of
	   values sits correctly on the white card and the grey total columns
	   alike. */
	--m-alb:rgba(139,45,203,.32);--m-eagle:rgba(179,38,30,.26);--m-bird:rgba(217,72,59,.15);
	--m-bogey:rgba(91,141,191,.16);--m-dbl:rgba(46,92,153,.26);--m-trip:rgba(27,58,102,.40);
}
:root[data-theme="dark"]{
	--bg:#0F1712;--surface:#17211A;--surface-2:#1E2B22;--ink:#E7EDE5;--muted:#94A499;
	--line:#26332A;--accent:#3F9862;--accent-ink:#06130C;--under:#E2604B;--live:#E3B34C;
	--chip:#243128;--board:#0D251B;--board-ink:#EDF3EC;--board-line:#1E3D30;--board-muted:#7E998C;
	--m-alb:rgba(198,130,255,.42);--m-eagle:rgba(255,110,88,.30);--m-bird:rgba(255,140,120,.17);
	--m-bogey:rgba(130,180,230,.16);--m-dbl:rgba(110,165,225,.30);--m-trip:rgba(90,150,225,.46);
}
:root[data-theme="scoreboard"]{
	--bg:#0D251B;--surface:#123227;--surface-2:#173D2E;--ink:#EDF3EC;--muted:#8FAB9D;
	--line:#1E3D30;--accent:#3F9862;--accent-ink:#06130C;--under:#FF8C73;--live:#E8B33C;
	--chip:#1C3B2E;--board:#0D251B;--board-ink:#EDF3EC;--board-line:#1E3D30;--board-muted:#8FAB9D;
	--m-alb:rgba(205,142,255,.44);--m-eagle:rgba(255,124,100,.32);--m-bird:rgba(255,150,130,.19);
	--m-bogey:rgba(140,190,236,.18);--m-dbl:rgba(120,175,232,.32);--m-trip:rgba(100,160,232,.48);
}
/* The four reach stops. Standard is k=1 and renders byte-identically to
   pre-0043; the rest are the same ladder the design pitch measured (Easy /
   Large / Gloves-on). data-scale is absent at Standard, so an untouched
   phone carries no attribute at all. */
:root[data-scale="2"]{--ui-k:1.15}
:root[data-scale="3"]{--ui-k:1.32}
:root[data-scale="4"]{--ui-k:1.5}
/* Reflow is part of the scale: past Large the quick row wraps and the card
   sheds its yardage column, so density never needs a second control. */
:root[data-scale="3"] .quickrow,:root[data-scale="4"] .quickrow{flex-wrap:wrap}
:root[data-scale="3"] .quick,:root[data-scale="4"] .quick{flex:1 1 30%}
:root[data-scale="4"] .sc-head span:nth-child(3),
:root[data-scale="4"] .sc-row .pv:nth-of-type(2),
:root[data-scale="4"] .sc-sub .pv:nth-of-type(2){display:none}
:root[data-scale="4"] .sc-head,:root[data-scale="4"] .sc-row,
:root[data-scale="4"] .sc-sub{grid-template-columns:calc(34px * var(--ui-k)) 1fr calc(90px * var(--ui-k))}
*{box-sizing:border-box}
/* The hidden attribute must beat any class display rule: .qrsheet{display:grid}
   was overriding the UA's [hidden]{display:none}, so the day-of QR sheet could
   never close once opened. */
[hidden]{display:none!important}
html,body{margin:0;background:var(--bg)}
/* Kill iOS double-tap-to-zoom (rapid +/- taps while scoring must never
   zoom the page) while keeping pinch-zoom for accessibility. */
html{touch-action:manipulation}
body{color:var(--ink);font:calc(16px * var(--ui-k))/1.55 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.mono{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-variant-numeric:tabular-nums}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
h1{font-size:28px;letter-spacing:-.02em;margin:0 0 6px}
h2{font-size:21px;margin:26px 0 8px}
h3{font-size:16px;margin:0 0 4px}
.sub{color:var(--muted);margin:0 0 20px}
.wrap{max-width:960px;margin:0 auto;padding:26px 18px 90px}

/* nav - one 56px row at any width. Phones get the brand, Join and the
   menu; from 520px the organizer doors (Run an event, Log in) join them.
   Nothing in the bar is elastic, so it can never wrap to a second row. */
.nav{background:var(--board);color:var(--board-ink);border-bottom:3px solid var(--live);position:relative}
.nav-inner{max-width:1120px;margin:0 auto;padding:0 12px;min-height:56px;display:flex;align-items:center;gap:9px;flex-wrap:nowrap}
.brand{font-weight:800;font-size:19px;letter-spacing:-.02em;color:var(--board-ink);white-space:nowrap}
.brand span{color:var(--live)}
.brand:hover{text-decoration:none}
.nav-right{display:flex;align-items:center;gap:9px;margin-left:auto;flex:none}
.joinbtn{background:var(--live);color:#1C2B22;border-radius:999px;padding:9px 16px;font-weight:800;font-size:14.5px;white-space:nowrap;flex:none}
.joinbtn:hover{text-decoration:none;filter:brightness(1.06)}
.ghostbtn{color:var(--board-ink);border:1px solid var(--board-line);border-radius:999px;padding:8px 14px;font-weight:700;font-size:14px;white-space:nowrap;flex:none}
.ghostbtn:hover{text-decoration:none;border-color:var(--board-ink)}
.textlink{color:var(--board-muted);font-size:14px;font-weight:600;white-space:nowrap;flex:none;padding:4px 2px}
.textlink:hover{color:var(--board-ink)}
.wide-only{display:none}
@media (min-width:520px){.wide-only{display:inline-flex}}
/* marketing links sit in the bar only where there is real room for them;
   below 900px they live in the menu sheet instead (which carries the
   same links at every width, so nothing is ever unreachable). */
.nav-links{display:none}
.nav-links a{color:var(--board-muted);font-size:14.5px;font-weight:600;white-space:nowrap}
.nav-links a:hover{color:var(--board-ink);text-decoration:none}
@media (min-width:900px){
	.nav-links{display:flex;align-items:center;gap:18px;margin-left:24px;flex:none}
}
.acct{color:var(--board-muted);font-size:14px}

/* menu sheet - CSS-only disclosure; the bar itself never grows. */
.menu{position:static;flex:none}
.hamb{list-style:none;width:40px;height:40px;border:1px solid var(--board-line);border-radius:9px;
	display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--board-ink)}
.hamb::-webkit-details-marker{display:none}
.hamb span{position:relative;width:17px;height:2px;background:currentColor;border-radius:2px}
.hamb span::before,.hamb span::after{content:"";position:absolute;left:0;width:17px;height:2px;background:currentColor;border-radius:2px}
.hamb span::before{top:-6px}
.hamb span::after{top:6px}
.menu[open] .hamb span{background:transparent}
.menu[open] .hamb span::before{top:0;transform:rotate(45deg)}
.menu[open] .hamb span::after{top:0;transform:rotate(-45deg)}
.sheet{position:absolute;left:0;right:0;top:100%;z-index:30;background:var(--board);
	border-bottom:3px solid var(--live);padding:6px 16px 16px;max-height:76vh;overflow-y:auto}
.sheet a{display:block;color:var(--board-ink);padding:12px 2px;font-size:16px;font-weight:600;border-bottom:1px solid var(--board-line)}
.sheet a:last-of-type{border-bottom:0}
.ssub{display:block;font-size:12.5px;color:var(--board-muted);font-weight:500;padding-top:2px}
.sgrp{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--board-muted);padding:14px 2px 2px;font-weight:700}
.sheetfoot{display:flex;gap:10px;padding-top:14px;margin-top:10px;border-top:1px solid var(--board-line)}
/* the text-size button is built for light page surfaces; on the dark
   sheet it takes the bar colors instead. */
.sheetfoot .sizetoggle{background:transparent;color:var(--board-muted);border-color:var(--board-line)}
.sheetfoot .sizetoggle:hover{color:var(--board-ink);border-color:var(--board-ink)}

/* in-event bar (PlayerLayout): the name wraps to a second line rather
   than truncating - a golfer has to be able to read the whole thing. */
.pnav-inner{padding:9px 12px;gap:8px;align-items:center}
.evtback{color:var(--board-muted);font-size:22px;line-height:1;flex:none;padding:0 2px}
.evtback:hover{color:var(--board-ink);text-decoration:none}
.evttext{min-width:0;flex:1}
.evtname{font-weight:800;font-size:15.5px;line-height:1.22;overflow-wrap:anywhere}
.evtmeta{font-size:11.5px;color:var(--board-muted);line-height:1.4}
.evtmeta b{color:var(--live);font-weight:700;letter-spacing:.06em}
/* In-event tabs. They scroll rather than clip: at the top reach stops five
   tabs cannot fit a phone, and the old flex row silently cut "Skins" off the
   right edge - the surface that exists for people who need bigger text was
   the one losing navigation. */
.ptabs{margin:0 0 14px;flex-wrap:wrap}
.ptabs a{flex:1 0 auto;white-space:nowrap;padding-left:calc(10px * var(--ui-k));padding-right:calc(10px * var(--ui-k))}
/* At the top reach stops five tabs cannot fit a phone row, so they wrap onto
   a second line instead of the last one being cut off the right edge - the
   surface that exists for people who need bigger text was the one losing
   navigation. */
:root[data-scale="3"] .ptabs a,:root[data-scale="4"] .ptabs a{flex:1 0 40%}
.thememenu{display:flex;gap:6px;align-items:center}
.tbtn{height:34px;padding:0 11px;border:1px solid var(--board-line);background:transparent;color:var(--board-muted);border-radius:7px;cursor:pointer;font-size:12.5px;font-weight:700}
.tbtn:hover{color:var(--board-ink);border-color:var(--board-ink)}
/* light/dark toggle: moon shown in light themes, sun in dark ones */
.themetoggle .t-sun{display:none}
:root[data-theme="dark"] .themetoggle .t-sun,:root[data-theme="scoreboard"] .themetoggle .t-sun{display:inline}
:root[data-theme="dark"] .themetoggle .t-moon,:root[data-theme="scoreboard"] .themetoggle .t-moon{display:none}
/* text-size toggle: small A + big A says what it does; lights up when on.
   It renders on light surfaces (player pages, console sidebar), so it uses
   page tokens rather than the dark-nav tbtn colors. */
.sizetoggle{color:var(--muted);border-color:var(--line);background:var(--surface);display:inline-flex;align-items:center;justify-content:center;gap:2px;padding:0 11px;line-height:1}
/* Both A's are vertically centered as a pair; the small A then shifts
   down (16px cap - 11px cap)/2 so the two share a baseline without
   dragging the pair off-center (align-items:baseline pins the line
   box to the top of a fixed-height flex button). */
.sizetoggle .a-sm{font-size:11px;line-height:1;transform:translateY(2.5px)}
.sizetoggle .a-lg{font-size:16px;line-height:1}
.sizetoggle:hover{color:var(--ink);border-color:var(--muted)}
:root[data-scale="2"] .sizetoggle,:root[data-scale="3"] .sizetoggle{color:var(--accent);border-color:var(--accent);background:var(--chip)}
:root[data-scale="4"] .sizetoggle{color:var(--accent-ink);background:var(--accent);border-color:var(--accent)}

/* cards, buttons, forms */
.card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px;margin-bottom:16px}
.card.tinted{background:var(--surface-2)}
.card h4{margin:0 0 2px;font-size:15px;font-weight:700}
label{display:block;font-size:13px;color:var(--muted);margin:12px 0 4px}
select,input,textarea{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--ink);font:inherit}
/* Checkboxes/radios must not inherit the text-input box above — the
   full width + padding pushed their labels out of alignment. */
input[type="checkbox"],input[type="radio"]{width:16px;height:16px;flex:none;padding:0;margin:0;accent-color:var(--accent)}
/* Course search box (wizard step 1). The results list is positioned in flow
   rather than absolutely: it sits directly above the tee panel it is going to
   open, and a floating layer over a form the organizer is mid-way through
   filling in buys nothing on a phone. */
.combo{position:relative}
.combores{list-style:none;margin:6px 0 0;padding:4px;border:1px solid var(--line);
	border-radius:9px;background:var(--surface);max-height:264px;overflow-y:auto;
	display:flex;flex-direction:column;gap:1px}
.combores li{padding:9px 11px;border-radius:6px;display:flex;justify-content:space-between;
	align-items:baseline;gap:12px}
.combores li[data-i]{cursor:pointer}
.combores li[aria-selected="true"],.combores li[data-i]:hover{background:var(--chip)}
.combores .cname{font-weight:600;font-size:14.5px}
.combores .cloc{font-size:12.5px;color:var(--muted);white-space:nowrap}
.combores mark{background:color-mix(in srgb,var(--live) 55%,transparent);color:inherit;
	border-radius:3px;padding:0 1px}
.comboempty,.combomore{color:var(--muted);font-size:13px;display:flex;gap:6px}
/* "Show more" is the only row that acts: it loads the next page rather than
   letting the list truncate silently. */
.combomore .linkish{font:inherit;font-size:13px;font-weight:600;background:none;border:0;
	padding:0;color:var(--accent);cursor:pointer;text-decoration:underline;text-underline-offset:2px}
/* Marks a course this organizer has actually run an event on - the rows that
   ride along in the page, ahead of anything the search returns. */
.combores .crecent{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
	color:var(--accent);margin-left:5px}
.combopicked{margin:8px 0 0;font-size:13px;color:var(--muted)}
.combopicked::before{content:"Course: ";font-weight:600;color:var(--ink)}
.row{display:flex;gap:14px;flex-wrap:wrap}
.row>div{flex:1;min-width:150px}
.frow{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.frow label{margin:0}
.under{color:#0f7a4a}.over{color:#c0392b}.even{color:var(--muted)}
.distbar{display:flex;height:12px;border-radius:6px;overflow:hidden;background:var(--chip)}
.distbar span{display:block;height:100%}
.db-under{background:#16a34a}.db-par{background:#9ca3af}.db-over{background:#dc2626}
.holegrid td{padding:4px 6px}
.holegrid input{margin:0;padding:6px 8px}
button,.btn{display:inline-block;text-align:center;padding:11px 18px;border:1px solid transparent;border-radius:9px;background:var(--accent);color:var(--accent-ink);font-weight:700;font-size:15px;cursor:pointer;text-decoration:none}
button:hover,.btn:hover{filter:brightness(1.06);text-decoration:none}
.btn.block{display:block;width:100%}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.big{padding:14px 20px;font-size:16px}
/* A turned-in card (0054) is one disabled fieldset, so the reset keeps its
   intrinsic min-width from breaking the scorecard grid and the dimming says
   read-only without inventing a second set of markup. */
.rocard{border:0;padding:0;margin:0;min-width:0}
.rocard[disabled]{opacity:.7}
.rocard[disabled] input{background:var(--chip);cursor:default}
.err{color:#b23b2b;background:#fbe9e6;border:1px solid #f0c3bb;border-radius:9px;padding:10px 12px;margin:10px 0}
:root[data-theme="dark"] .err,:root[data-theme="scoreboard"] .err{color:#f2b3a8;background:#2a1512;border-color:#4a2018}
.ok{color:var(--accent);background:var(--chip);border:1px solid var(--line);border-radius:9px;padding:10px 12px;margin:10px 0}
/* .warn is .ok's opposite - something did not happen, or is about to be
   irreversible. .btn.danger is the only filled red button in the app; it
   exists for permanent deletion and should not spread past it. */
.warn{color:var(--under);background:color-mix(in srgb,var(--under) 10%,transparent);
	border:1px solid color-mix(in srgb,var(--under) 35%,transparent);
	border-radius:9px;padding:10px 12px;margin:10px 0}
.btn.danger{background:var(--under);border-color:var(--under);color:#FFFFFF}
.muted{color:var(--muted)}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}

/* pills */
.pill{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:3px 9px;border-radius:999px;background:var(--chip);color:var(--muted)}
.pill.live{background:var(--live);color:#2A2008}
.pill .dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.pill.ghost{background:transparent;border:1px solid var(--line)}
/* HQ address health + traffic source. A dead address has to be visible
   at a glance - it is the difference between 20 sent and 17 delivered. */
.pill.em-bounced,.pill.em-invalid{color:#b23b2b;background:#fbe9e6}
.pill.em-checked{color:#1f6b45;background:#e6f4ec}
/* 'verified' means a person read it on the course's own page. It has to
   outrank 'checked' visually, because 'checked' is the one that bounced. */
.pill.em-verified{color:#0f5132;background:#cdeadb;font-weight:600}
.pill.em-risky{color:#8a5a12;background:#fbf1de}
.pill.src-bot,.pill.src-self{opacity:.7}
tr.dim{opacity:.55}
:root[data-theme="dark"] .pill.em-bounced,:root[data-theme="dark"] .pill.em-invalid,
:root[data-theme="scoreboard"] .pill.em-bounced,:root[data-theme="scoreboard"] .pill.em-invalid{color:#f2b3a8;background:#2a1512}
:root[data-theme="dark"] .pill.em-checked,:root[data-theme="scoreboard"] .pill.em-checked{color:#8fd6ad;background:#13291e}
:root[data-theme="dark"] .pill.em-verified,:root[data-theme="scoreboard"] .pill.em-verified{color:#a9e9c4;background:#1b3d2a}
:root[data-theme="dark"] .pill.em-risky,:root[data-theme="scoreboard"] .pill.em-risky{color:#e8c583;background:#2b2212}

/* HQ grid: the CRM tables, which behave like a spreadsheet.
   NOT called .sheet - that is the player nav drawer above (position:absolute,
   board colours), and naming this .sheet made every HQ table inherit
   position:absolute, leave the layout and paint nothing at all. */
/* The grid gets its OWN scroll pane rather than .tscroll. .tscroll is
   overflow-x:auto with overflow-y visible, which cannot clip a wide table's
   overflow on the left and gives a top:0 sticky header no vertical scrollport
   to stick to - the header simply never sticks, and scrolled-away cells paint
   over the frozen columns. A pane that scrolls in BOTH axes fixes both: the
   header sticks to it, the frozen columns pin to it, and everything clips. */
.hqscroll{max-height:70vh;overflow:auto}
.hqgrid{border-collapse:separate;border-spacing:0;font-size:13px}
.hqgrid th,.hqgrid td{white-space:nowrap;padding:4px 8px;background:var(--surface);vertical-align:middle}
.hqgrid thead th{position:sticky;top:0;z-index:3;text-align:left}
.hqgrid thead tr.hqf th{top:auto;z-index:3;font-weight:400}
/* The first four columns freeze as a GROUP - queue, access, tier, course.
   Pinning only the course column leaves the three before it scrolling away
   underneath it, which reads as a rendering fault rather than a frozen pane.
   Offsets are MEASURED by the script into --f2/--f3/--freezeL, never
   hardcoded: these columns size to their content, so a guessed value
   misaligns (the guess was 212px, the real one 217.7px). */
.hqgrid .f1,.hqgrid thead th.f1{position:sticky;left:0;z-index:2}
.hqgrid .f2,.hqgrid thead th.f2{position:sticky;left:var(--f2,0);z-index:2}
.hqgrid .f3,.hqgrid thead th.f3{position:sticky;left:var(--f3,0);z-index:2}
.hqgrid .cname,.hqgrid thead th.cnameh{position:sticky;left:var(--freezeL,0);z-index:2;box-shadow:1px 0 0 var(--line)}
.hqgrid thead th.f1,.hqgrid thead th.f2,.hqgrid thead th.f3,.hqgrid thead th.cnameh{z-index:4}
.hqgrid .num{text-align:right;font-variant-numeric:tabular-nums}
.hqgrid .hit{font-weight:600}
.hqgrid .email{max-width:220px;overflow:hidden;text-overflow:ellipsis}
.hqgrid th.sortable{cursor:pointer;user-select:none}
.hqgrid th.sortable:hover{color:var(--ink)}
.hqgrid th[data-dir="asc"]::after{content:" \2191"}
.hqgrid th[data-dir="desc"]::after{content:" \2193"}
.hqgrid tr.hqf input{width:100%;min-width:52px;max-width:120px;font-size:12px;padding:1px 4px}
/* Controls read as values first and controls second: no chrome until you go
   near them. */
.hqgrid .cell{font-size:12px;border:1px solid transparent;background:transparent;padding:1px 2px;max-width:130px}
/* A select shrinks to its box, not its longest option, so without a floor the
   cell reads "Publ" and "Unve" - a value you cannot read is worse than no
   column at all. Sized to the longest label in the three lists. */
.hqgrid select.cell{min-width:96px}
.hqgrid .cell:hover,.hqgrid .cell:focus{border-color:var(--line);background:var(--bg)}
.hqgrid .notes{width:110px}
/* The Save button is the no-script path, hidden only once the script has run
   and htmx is saving on change. */
.hqgrid.live .nojs{display:none}
.hqgridbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.hqgridcount{font-size:12px;margin-left:auto}

/* Access type. Deliberately quieter than address health: it decides the
   ORDER of a send week, not whether a row is safe to send at all, so it must
   not out-shout a bounce. Unknown carries a dotted edge because it is a job
   to do rather than a state to accept. */
.pill.ac-public{color:#14513a;background:#dcefe4}
.pill.ac-private{color:#5b4a86;background:#eae5f6}
.pill.ac-unknown{color:#6b6b6b;background:transparent;border:1px dashed currentColor}
:root[data-theme="dark"] .pill.ac-public,:root[data-theme="scoreboard"] .pill.ac-public{color:#9ddcbc;background:#163324}
:root[data-theme="dark"] .pill.ac-private,:root[data-theme="scoreboard"] .pill.ac-private{color:#c3b6e8;background:#241f38}
:root[data-theme="dark"] .pill.ac-unknown,:root[data-theme="scoreboard"] .pill.ac-unknown{color:#9a9a9a}

/* legal / prose */
.prose p,.prose li{color:var(--muted)}
.prose h2{color:var(--ink)}

/* generic table */
table.data{width:100%;border-collapse:collapse;font-size:14px}
table.data th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:7px 8px;border-bottom:1px solid var(--line)}
table.data td{padding:8px;border-bottom:1px solid var(--line)}
tr.drill-toggle{cursor:pointer}
tr.drill-toggle .chev{display:inline-block;color:var(--muted);transition:transform .15s}
tr.drill-toggle.open .chev{transform:rotate(90deg)}
.tscroll{overflow-x:auto}

/* leaderboard */
.lb{padding:4px 6px}
.lb-row{display:grid;grid-template-columns:34px 1fr 52px 46px;align-items:center;gap:6px;padding:11px 6px;border-bottom:1px solid var(--line);font-size:var(--score)}
.lb-row:last-child{border-bottom:none}
.lb-row.head{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700}
.lb-row .pos{font-weight:800;color:var(--muted)}
.lb-row .nm{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-row .nm small{display:block;font-weight:400;color:var(--muted);font-size:11.5px}
.lb-row .num{text-align:right}
.lb-row .num .tot{display:block;font-weight:400;color:var(--muted);font-size:11.5px}
.lb-row.me{background:var(--surface-2);border-radius:8px}
.lb-row .nm a.seasonlink{color:inherit;text-decoration:none}
.lb-row .nm a.seasonlink:hover{text-decoration:underline}
/* league season standings: week-over-week movement chips (0034) */
.lb-row .nm small.seasondelta,.tv-row .nm small.seasondelta{display:inline;font-weight:700;margin-left:6px;font-size:12px}
small.seasondelta.up{color:var(--under)}
small.seasondelta.down{color:var(--live)}
.score-under{color:var(--under);font-weight:800}
.score-even{color:var(--muted);font-weight:700}
.score-over{color:var(--ink);font-weight:700}

/* results page (TODO C2): nine splits, hole grid, drill-down panels */
.rsec{font-size:13px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin:18px 0 8px}
table.rtable td.num,table.rtable th.num{text-align:right}
table.rtable td.pos{font-weight:800;color:var(--muted);width:38px}
table.rtable td.nm{font-weight:700}
table.rtable td.nm a{color:inherit;text-decoration:none;border-bottom:1px dotted var(--line)}
table.rtable td.nm a:hover{border-bottom-color:var(--accent)}
table.rtable td.nm small{display:block;font-weight:400}
table.rtable tr.me td{background:var(--surface-2)}
.card.winner{background:var(--board);color:var(--board-ink);border-color:var(--board);
	display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 18px}
.winner-tag{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;opacity:.8}
.winner-who{min-width:0}
.winner-name{font-size:20px;font-weight:800;line-height:1.2}
.winner-score{font-size:26px;font-weight:800;text-align:right;margin-left:auto}
.winner-score small{display:block;font-size:12px;font-weight:500;opacity:.75}
.winner-score .score-under,.winner-score .score-even,.winner-score .score-over{color:inherit}
/* hole-by-hole grid: names stick, holes scroll */
table.hgrid{border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums;min-width:100%}
/* min-width leaves room for a double-ringed mark (.scm) plus its outer ring
   without it touching the cell border. */
table.hgrid th,table.hgrid td{border:1px solid var(--line);padding:5px 1px;text-align:center;min-width:30px}
table.hgrid th{font-size:11px;color:var(--muted);font-weight:700}
table.hgrid th a{color:inherit;text-decoration:none;display:block;padding:2px 0}
table.hgrid th a:hover{color:var(--accent);text-decoration:underline}
table.hgrid .hgrid-name{position:sticky;left:0;z-index:1;background:var(--surface);text-align:left;
	padding:5px 8px;min-width:104px;max-width:132px;font-weight:700;
	overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
table.hgrid .hgrid-name a{color:inherit;text-decoration:none}
table.hgrid .hgrid-name a:hover{text-decoration:underline}
table.hgrid tr.hgrid-par td{color:var(--muted);font-size:12px}
table.hgrid .tot{background:var(--surface-2);font-weight:700;min-width:34px}
table.hgrid .dots{display:block;font-size:9px;line-height:1;margin-top:-2px}
/* Scorecard marking, gross vs par. The score is carried by the CELL it sits
   in, not by a ring drawn around the digit: at four teams by eighteen holes a
   ring landed on two cells in three, and the numbers stopped being the thing
   the eye found. Tinting the cell leaves every digit clean and lets a whole
   card read as a shape from across the room.

   .sc-* is the bucket. It carries weight only - never a text colour, because
   the same class rides on the stats counts and the hole panel's summary,
   where a tint would be unreadable as ink. Key: scoreKey() in results.templ. */
.sc-alb,.sc-eagle,.sc-bird{font-weight:800}
.sc-par{font-weight:600}
.sc-bogey,.sc-dbl,.sc-trip{font-weight:700}
/* aspect-ratio, not a fixed height: the box is min-width 1.5em for a single
   digit, but a 10 or an 11 is wider, and a width that grows against a pinned
   height turns the tint into a lozenge. Height follows width instead. */
.scm{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;
	min-width:1.5em;aspect-ratio:1;padding:0 .12em;line-height:1;
	border-radius:5px}
/* Away from the grid - the key, the standings, a single card - there is no
   cell to tint, so the mark carries the tint itself as a chip. */
.scm.sc-alb{background:var(--m-alb)}
.scm.sc-eagle{background:var(--m-eagle)}
.scm.sc-bird{background:var(--m-bird)}
.scm.sc-bogey{background:var(--m-bogey)}
.scm.sc-dbl{background:var(--m-dbl)}
.scm.sc-trip{background:var(--m-trip)}
/* In the grid the cell itself is the mark, edge to edge, and the chip inside
   it goes transparent so the two tints cannot stack. */
table.hgrid td.sc-alb{background:var(--m-alb)}
table.hgrid td.sc-eagle{background:var(--m-eagle)}
table.hgrid td.sc-bird{background:var(--m-bird)}
table.hgrid td.sc-bogey{background:var(--m-bogey)}
table.hgrid td.sc-dbl{background:var(--m-dbl)}
table.hgrid td.sc-trip{background:var(--m-trip)}
table.hgrid td .scm{background:none}
/* ---- Colour-blind reading: data-marks="shapes" ------------------------
   The tinted cells are fast to scan but they ask the reader to separate a red
   from a blue, and about one man in twelve cannot. This restores the shape
   system the card shipped with - circles under par, squares over, a second
   ring for an eagle or a double, filled at the extremes - and drops the tints
   entirely so the two systems never stack. Same seven buckets, same key, same
   markup; only the drawing changes. Toggle: glToggleMarks() in shell.js,
   restored pre-paint in pageHead, remembered per device in gl_marks. */
:root[data-marks="shapes"] table.hgrid td.sc-alb,
:root[data-marks="shapes"] table.hgrid td.sc-eagle,
:root[data-marks="shapes"] table.hgrid td.sc-bird,
:root[data-marks="shapes"] table.hgrid td.sc-bogey,
:root[data-marks="shapes"] table.hgrid td.sc-dbl,
:root[data-marks="shapes"] table.hgrid td.sc-trip{background:none}
:root[data-marks="shapes"] .scm{border:1.5px solid transparent;border-radius:50%;background:none}
:root[data-marks="shapes"] .scm.sc-alb{background:var(--ink);border-color:var(--ink);color:var(--surface)}
:root[data-marks="shapes"] .scm.sc-eagle{border-color:var(--ink);box-shadow:0 0 0 1.5px var(--surface),0 0 0 3px var(--ink)}
:root[data-marks="shapes"] .scm.sc-bird{border-color:var(--ink)}
:root[data-marks="shapes"] .scm.sc-bogey{border-color:var(--ink);border-radius:3px}
:root[data-marks="shapes"] .scm.sc-dbl{border-color:var(--ink);border-radius:3px;box-shadow:0 0 0 1.5px var(--surface),0 0 0 3px var(--ink)}
:root[data-marks="shapes"] .scm.sc-trip{background:var(--ink);border-color:var(--ink);border-radius:3px;color:var(--surface)}
/* The control. Quiet by default, and it names what it will DO, not what is on
   now - "Shapes" while the card is coloured, "Colours" once it is not. */
.marktoggle{display:inline-flex;align-items:center;gap:7px;cursor:pointer;
	background:none;border:1px solid var(--line);border-radius:999px;
	padding:5px 11px 5px 8px;color:var(--muted);font:600 12px/1 inherit}
.marktoggle:hover{color:var(--ink);border-color:var(--muted)}
.marktoggle .mt-shape{width:13px;height:13px;border:1.5px solid currentColor;border-radius:50%;flex:none}
:root[data-marks="shapes"] .marktoggle{color:var(--ink);border-color:var(--muted)}
:root[data-marks="shapes"] .marktoggle .mt-shape{border-radius:3px}
/* The key. Same marks at the same size, so what is above the table is exactly
   what is in it. */
.sckey{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;
	font-size:12.5px;color:var(--muted);margin:2px 4px 10px}
/* The gap clears the outer ring of a doubled mark, which sits 3px outside the
   box - at a tighter gap the circle touched its own label. */
.sckey span{display:inline-flex;align-items:center;gap:9px;white-space:nowrap}
.sckey .scm{font-size:12px;font-weight:700}
/* drill-down panels (one hole / one card) */
.rpanel{border-color:var(--accent)}
.rpanel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.rpanel-head h3{margin:0;font-size:17px}
.rpanel-avg{text-align:right;font-size:20px;font-weight:800;line-height:1.1}
.rpanel-avg small{display:block;font-size:11.5px;font-weight:500;color:var(--muted)}
.spread{display:flex;gap:10px;flex-wrap:wrap;font-size:12.5px;margin:10px 0 4px}
.rclose{display:inline-block;margin-top:10px;font-size:13px;color:var(--muted)}
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:18px}
.statlab{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:700;margin-bottom:6px}
.statline{display:flex;justify-content:space-between;gap:10px;padding:4px 0;border-bottom:1px solid var(--line);font-size:14px}
.statline:last-child{border-bottom:none}

/* offline sync chip */
.syncstatus{font-size:calc(12.5px * var(--ui-k));margin:-2px 0 10px;min-height:18px;color:var(--muted)}
.dots{color:var(--accent);font-weight:800;letter-spacing:1px;font-size:13px;line-height:1}
.syncstatus.ok{color:var(--accent)}
.syncstatus.off{color:var(--live);font-weight:700}

/* month calendar (/manage/calendar) */
.cal{width:100%;border-collapse:collapse;table-layout:fixed;min-width:640px}
.cal th{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:4px;text-align:left}
.cal td{border:1px solid var(--line);vertical-align:top;height:84px;padding:4px}
.cal-empty{background:var(--surface-2)}
.cal-today{outline:2px solid var(--accent);outline-offset:-2px}
.cal-num{font-size:12px;font-weight:700;color:var(--muted);margin-bottom:2px}
.cal-item{display:block;font-size:11.5px;line-height:1.25;border-radius:6px;padding:3px 5px;margin:2px 0;background:var(--surface-2);text-decoration:none;color:var(--ink)}
.cal-item b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-item span{color:var(--muted);margin-right:6px}
.cal-item.live{border-left:3px solid var(--live)}
.cal-item:hover{background:var(--surface-3, var(--surface-2));text-decoration:none}

/* round switcher (multi-round events only; single-round shows none) */
.roundtabs{display:flex;gap:6px;overflow-x:auto;margin:0 0 10px;padding-bottom:2px;-webkit-overflow-scrolling:touch}
.roundtab{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:1px;
	padding:calc(7px * var(--ui-k)) calc(13px * var(--ui-k));border-radius:999px;border:1px solid var(--line);background:var(--card);
	color:var(--ink);text-decoration:none;font-weight:650;font-size:calc(14px * var(--ui-k));white-space:nowrap}
.roundtab:hover{border-color:var(--accent)}
.roundtab.active{background:var(--board);color:var(--board-ink);border-color:var(--board)}
.roundtab-sub{font-size:11px;font-weight:500;opacity:.75}
.lb-round{font-size:12.5px;font-weight:600;opacity:.7;padding:4px 4px 0}
/* Round picker (0043): past roundsCollapse rounds the strip becomes one pill
   that opens the list. CSS-only <details> - the score page it rides on has to
   work with no JS at all. */
.roundpick{margin:0 0 10px;position:relative}
.roundpick>summary{list-style:none;display:inline-flex;align-items:center;gap:8px;cursor:pointer;
	padding:calc(7px * var(--ui-k)) calc(13px * var(--ui-k));border-radius:999px;background:var(--board);
	color:var(--board-ink);font-size:calc(14px * var(--ui-k));font-weight:650}
.roundpick>summary::-webkit-details-marker{display:none}
.roundpick-of{color:var(--board-muted);font-weight:500}
.roundpick[open] .roundpick-chev{transform:rotate(180deg)}
.roundpick-chev{transition:transform .15s}
.roundpick-sheet{position:absolute;z-index:20;left:0;top:calc(100% + 6px);min-width:220px;max-height:60vh;
	overflow-y:auto;background:var(--surface);border:1px solid var(--line);border-radius:12px;
	box-shadow:0 10px 30px rgba(18,50,39,.18);padding:6px}
.roundpick-item{display:flex;justify-content:space-between;gap:12px;padding:11px 12px;border-radius:8px;
	color:var(--ink);text-decoration:none;font-size:calc(14px * var(--ui-k))}
.roundpick-item span{color:var(--muted);font-size:calc(12.5px * var(--ui-k))}
.roundpick-item:hover{background:var(--chip);text-decoration:none}
.roundpick-item.active{background:var(--chip);font-weight:700}
/* Flight chips: a filter on one board, never a third tab strip. */
.chiprow{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px}
.fchip{font-size:calc(12.5px * var(--ui-k));font-weight:650;padding:calc(7px * var(--ui-k)) calc(12px * var(--ui-k));
	border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);text-decoration:none}
.fchip:hover{border-color:var(--accent);text-decoration:none}
.fchip.on{background:var(--board);border-color:var(--board);color:var(--board-ink)}
/* The viewer's own line, pinned under the board. The poll re-renders the
   table every 15s under whatever the reader has scrolled to; this strip is
   the one place their own number never moves. */
.lb-you{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;
	padding:calc(11px * var(--ui-k)) calc(13px * var(--ui-k));border-radius:12px;background:var(--board);
	color:var(--board-ink);font-size:calc(13.5px * var(--ui-k))}
.lb-you b{font-size:calc(16px * var(--ui-k));margin-left:8px}
.lb-you .score-under{color:var(--live)}
.lb-you .score-even{color:var(--board-ink)}
/* Breadcrumb: which event, which round, on every organizer round surface. */
.rcrumb{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;font-size:13px;margin:0 0 10px}
.rcrumb-ev{font-weight:600;text-decoration:none;color:var(--ink)}
.rcrumb-ev:hover{text-decoration:underline}
.rcrumb-sep{opacity:.45}
.rcrumb-rd{font-weight:600;opacity:.85}
.rcrumb-course{opacity:.65}
.rcrumb-switch{margin-left:auto;font-size:12.5px;opacity:.8}
/* Events list: filter tabs + rounds nested under their event. */
.evtabs{display:flex;gap:6px;overflow-x:auto;margin:10px 0 12px;padding-bottom:2px}
.evtab{flex:0 0 auto;font-size:13px;font-weight:600;padding:7px 13px;border-radius:999px;
	border:1px solid var(--line);color:var(--ink);text-decoration:none;background:var(--surface)}
.evtab:hover{border-color:var(--accent)}
.evtab.active{background:var(--board);color:var(--board-ink);border-color:var(--board)}
.evtab-n{opacity:.65;font-weight:500;margin-left:3px}
.rnest{margin-top:10px}
.rnest>summary{cursor:pointer;font-size:13px;font-weight:600;opacity:.75;padding:2px 0}
.rnest-list{display:flex;flex-direction:column;gap:2px;margin-top:8px;
	border-top:1px solid var(--line);padding-top:8px}
.rnest-row{display:grid;grid-template-columns:16px minmax(96px,1.1fr) minmax(0,1fr) minmax(0,1.4fr) auto;
	gap:8px;align-items:baseline;padding:6px 6px;border-radius:8px;text-decoration:none;
	color:var(--ink);font-size:13px}
.rnest-row:hover{background:var(--chip)}
.rnest-row.active{background:var(--chip);font-weight:600}
.rnest-arrow{opacity:.45}
.rnest-name{font-weight:600}
.rnest-when,.rnest-course,.rnest-prog{opacity:.7;font-size:12.5px}
.rnest-prog{text-align:right}
@media (max-width:640px){
	.rnest-row{grid-template-columns:16px 1fr auto}
	.rnest-course{display:none}
}

/* scoring */
.holehead{background:var(--board);color:var(--board-ink);border-radius:12px;padding:calc(14px * var(--ui-k)) calc(16px * var(--ui-k));display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.holehead .hole{font-size:calc(30px * var(--ui-k));font-weight:800;letter-spacing:-.02em}
.holehead .lbl{font-size:11px;letter-spacing:.12em;color:var(--board-muted);text-transform:uppercase}
.holehead .facts{text-align:right;font-size:calc(12px * var(--ui-k));color:var(--board-muted);line-height:1.6}
.holehead .facts b{color:var(--board-ink);font-weight:700}
/* Hole strip (0043): tappable, numbered chips. The bar this replaced could
   not be tapped, so a shotgun start - which is most events - opened on the
   wrong hole with no way to the right one but the card view or the URL. */
.hscrub{display:flex;gap:calc(4px * var(--ui-k));overflow-x:auto;margin-bottom:12px;padding-bottom:2px;
	-webkit-overflow-scrolling:touch;scrollbar-width:none}
.hscrub::-webkit-scrollbar{display:none}
.hs{flex:0 0 auto;display:flex;align-items:center;justify-content:center;
	width:calc(32px * var(--ui-k));height:calc(32px * var(--ui-k));border-radius:calc(9px * var(--ui-k));
	border:1px solid var(--line);background:var(--surface);color:var(--muted);text-decoration:none;
	font-size:calc(13px * var(--ui-k));font-weight:700;font-variant-numeric:tabular-nums}
.hs:hover{text-decoration:none;border-color:var(--accent)}
.hs.done{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.hs.cur{background:var(--board);border-color:var(--board);color:var(--live);box-shadow:0 0 0 3px var(--chip)}
/* Handicap strokes on this hole, on their own line - they used to share the
   stroke-index line inside the dark card and read as part of it. */
.holedots{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:-6px 0 12px;
	font-size:calc(12.5px * var(--ui-k));color:var(--ink)}
/* What the number MEANS. The strokes are the number; this is the golf. */
.relscore{text-align:center;font-size:calc(13.5px * var(--ui-k));font-weight:700;
	color:var(--accent);letter-spacing:.02em;min-height:1.2em;margin:-2px 0 6px}
.stepper{display:flex;align-items:center;justify-content:center;gap:16px;margin:6px 0}
.stepper .val{width:calc(80px * var(--ui-k));min-width:54px;text-align:center;font-size:calc(34px * var(--ui-k));font-weight:800;border:none;background:transparent;color:var(--ink)}
.stepbtn{width:calc(52px * var(--ui-k));height:calc(52px * var(--ui-k));border-radius:calc(10px * var(--ui-k));border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:calc(24px * var(--ui-k));font-weight:700;cursor:pointer}
.quickrow{display:flex;gap:6px;margin:8px 0}
/* Three real targets, not five 12px ones (0043). Anything outside birdie /
   par / bogey is one stepper tap away. */
.quick{flex:1;text-align:center;padding:calc(10px * var(--ui-k)) 2px;border:1px solid var(--line);
	border-radius:calc(10px * var(--ui-k));color:var(--muted);background:var(--surface);cursor:pointer;
	font-family:inherit;display:flex;flex-direction:column;gap:1px}
.quick b{font-size:calc(13.5px * var(--ui-k));font-weight:700;color:var(--ink)}
.quick small{font-size:calc(11px * var(--ui-k));color:var(--muted)}
.quick.on{border-color:var(--accent);background:var(--chip)}
.quick.on b,.quick.on small{color:var(--accent)}
/* Per-player rows on the group hole view: a stepper each, so a cart scoring
   on one phone never summons the numeric keyboard over its own card. */
.prows{display:flex;flex-direction:column;gap:calc(8px * var(--ui-k));margin-bottom:10px}
.prow{display:flex;align-items:center;gap:calc(10px * var(--ui-k));background:var(--surface);
	border:1px solid var(--line);border-radius:calc(14px * var(--ui-k));padding:calc(9px * var(--ui-k))}
.prow.me{border-color:var(--accent);box-shadow:inset 3px 0 0 var(--accent)}
.prow .av{flex:none;width:calc(36px * var(--ui-k));height:calc(36px * var(--ui-k));border-radius:calc(11px * var(--ui-k));
	background:var(--chip);color:var(--accent);font-weight:700;font-size:calc(13px * var(--ui-k));
	display:flex;align-items:center;justify-content:center}
.prow .pn{flex:1;min-width:0}
.prow .pn b{display:block;font-size:calc(14.5px * var(--ui-k));font-weight:700;
	overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prow .pn small{display:block;color:var(--muted);font-size:calc(11.5px * var(--ui-k))}
.pstep{flex:none;display:flex;align-items:center;gap:calc(6px * var(--ui-k))}
.pstepbtn{width:calc(40px * var(--ui-k));height:calc(40px * var(--ui-k));border-radius:calc(11px * var(--ui-k));
	border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:calc(19px * var(--ui-k));
	line-height:1;cursor:pointer;flex:none}
.pstep .pv{width:calc(48px * var(--ui-k));text-align:center;font-size:calc(19px * var(--ui-k));font-weight:800;
	border:1px solid var(--line);border-radius:calc(9px * var(--ui-k));padding:calc(6px * var(--ui-k)) 0;
	background:var(--surface);color:var(--ink)}
.pread{flex:none;width:calc(48px * var(--ui-k));text-align:center;color:var(--muted);
	font-size:calc(17px * var(--ui-k));font-weight:700}
/* Card drawer: the whole card, one thumb-reach from the hole you are on. */
.carddrawer{margin-top:12px;border:1px solid var(--line);border-radius:14px;background:var(--surface);overflow:hidden}
.carddrawer>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;
	gap:10px;padding:calc(12px * var(--ui-k)) calc(13px * var(--ui-k));font-size:calc(13.5px * var(--ui-k));
	color:var(--muted);background:var(--board);color:var(--board-ink)}
.carddrawer>summary::-webkit-details-marker{display:none}
.carddrawer>summary b{color:var(--live);font-size:calc(15px * var(--ui-k))}
.drawgrid{display:grid;grid-template-columns:repeat(9,1fr);gap:3px;padding:10px}
.dg{display:flex;flex-direction:column;align-items:center;gap:1px;padding:calc(6px * var(--ui-k)) 0;
	border-radius:8px;text-decoration:none;background:var(--bg)}
.dg:hover{text-decoration:none;background:var(--chip)}
.dg .n{font-size:calc(10.5px * var(--ui-k));color:var(--muted);font-weight:600}
.dg .s{font-size:calc(15px * var(--ui-k));font-weight:800;color:var(--ink);
	font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;min-height:1.15em}
.dg.cur{box-shadow:inset 0 0 0 2px var(--live)}
.drawfull{display:block;padding:0 12px 12px;font-size:calc(12.5px * var(--ui-k));color:var(--accent)}
.backlink{font-size:calc(13.5px * var(--ui-k));font-weight:600;color:var(--accent)}
.seg{display:flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;margin-bottom:12px}
.seg a{flex:1;text-align:center;font-size:calc(13px * var(--ui-k));font-weight:700;padding:calc(9px * var(--ui-k)) 4px;color:var(--muted)}
.seg a:hover{text-decoration:none}
.seg a.on{background:var(--board);color:var(--board-ink)}
/* full card grid */
.sc-head,.sc-row{display:grid;grid-template-columns:calc(34px * var(--ui-k)) calc(64px * var(--ui-k)) 1fr calc(90px * var(--ui-k));gap:8px;align-items:center}
.sc-head{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700;padding:0 4px 6px;border-bottom:1px solid var(--line)}
.sc-row{padding:6px 4px;border-bottom:1px solid var(--line)}
.sc-row:last-child{border-bottom:none}
.sc-row .h{font-weight:800;font-size:calc(16px * var(--ui-k))}
.sc-row .pv{font-size:11.5px;color:var(--muted)}
.sc-row input{width:100%;text-align:center;padding:8px;font-size:16px;font-weight:700}
/* Per-player hole row (group scoring). Two cells, not the scorecard's
   four - the name takes the slack and the box stays a fixed target. */
.scp-row{display:flex;align-items:center;gap:12px;padding:9px 4px;border-bottom:1px solid var(--line)}
.scp-row:last-child{border-bottom:none}
.scp-row .h{flex:1;min-width:0;font-weight:800;font-size:16px;overflow-wrap:anywhere}
.scp-row input{flex:none;width:88px;text-align:center;padding:8px;font-size:16px;font-weight:700}
.sc-sub{display:grid;grid-template-columns:34px 64px 1fr 90px;gap:8px;align-items:center;padding:8px 4px;border-top:2px solid var(--line);font-weight:700}
.sc-sub .h{font-size:12px;letter-spacing:.06em}
.sc-sub .pv{font-size:11.5px;color:var(--muted)}
.sc-sub .sum{text-align:center;font-size:16px;font-weight:800}
tr.bb-sub td{border-top:2px solid var(--line);font-weight:700}

/* claim list */
.listrow{display:flex;align-items:center;justify-content:space-between;padding:12px 4px;border-bottom:1px solid var(--line)}
.listrow:last-child{border-bottom:none}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--chip);display:inline-grid;place-items:center;font-size:12px;font-weight:700;color:var(--muted);margin-right:10px}

/* report hub */
.reports{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-bottom:16px}
.card.report{display:block;color:var(--ink);position:relative;padding-bottom:38px;margin-bottom:0}
.card.report:hover{text-decoration:none;border-color:var(--accent)}
.card.report .go{position:absolute;left:18px;bottom:12px;color:var(--accent);font-weight:700;font-size:13.5px}

/* tabbed roster import */
.tabbar{display:flex;gap:6px;margin:10px 0 12px}
.tabbar .tab{flex:1;text-align:center;font-size:13px;font-weight:700;padding:8px 4px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--muted);cursor:pointer}
.tabbar .tab.on{border-color:var(--accent);color:var(--accent);background:var(--chip)}
.tabpane{display:none}
.tabpane.on{display:block}
.ocrstatus{font-size:13px;color:var(--muted);margin-top:8px;min-height:18px}

/* app shell (organizer console) */
body.app{display:flex;min-height:100vh;align-items:stretch}
.side{width:228px;flex:none;background:var(--surface);border-right:1px solid var(--line);padding:18px 14px 16px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto}
.side .brand{font-weight:800;font-size:20px;letter-spacing:-.02em;color:var(--ink);margin:0 6px 10px}
.side .brand span{color:var(--accent)}
.side .brand:hover{text-decoration:none}
.sgroup{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:16px 8px 4px}
.snav a{display:block;padding:8px 10px;border-radius:8px;color:var(--ink);font-size:14px;font-weight:600}
.snav a:hover{background:var(--surface-2);text-decoration:none}
.sfoot{margin-top:auto;display:flex;flex-direction:column;gap:10px;padding-top:14px;border-top:1px solid var(--line);font-size:13px}
.side .tbtn{color:var(--muted);border-color:var(--line)}
.appmain{flex:1;min-width:0;padding:26px 30px 90px;max-width:1160px}
/* backBar: the one way out of a console page, same spot on every page. */
.backbar{display:flex;align-items:center;margin:0 0 14px}
.backbtn{display:inline-flex;align-items:center;gap:8px;padding:calc(6px*var(--ui-k)) calc(12px*var(--ui-k)) calc(6px*var(--ui-k)) calc(10px*var(--ui-k));
	border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);
	font-size:calc(13px*var(--ui-k));font-weight:600;line-height:1.2}
.backbtn:hover{background:var(--surface-2);text-decoration:none}
.backbtn .ar{color:var(--accent);font-weight:700;line-height:1}
@media (max-width:860px){
	body.app{display:block}
	.side{position:static;width:auto;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px;padding:10px 12px;border-right:0;border-bottom:1px solid var(--line)}
	.side .brand{margin:0 10px 0 0}
	.sgroup{display:none}
	.snav{display:flex;flex-wrap:wrap;gap:2px}
	.snav a{padding:6px 8px;font-size:13px}
	.sfoot{margin:0;border:0;padding:0;flex-direction:row;align-items:center}
	.appmain{padding:20px 16px 60px}
}

/* wizard - green hero band + numbered step circles */
.wizhero{background:linear-gradient(140deg,var(--accent) 0%,#1d5c38 100%);border-radius:14px;color:#fff;text-align:center;padding:34px 20px 96px;margin-bottom:-70px}
.wizhero h1{color:#fff;font-size:clamp(24px,3.4vw,34px);margin:0}
.wizhero p{color:rgba(255,255,255,.88);margin:8px 0 0;font-size:15px}
.wizcard{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 34px rgba(10,30,20,.14);padding:22px 24px;max-width:780px;margin:0 auto 20px;position:relative}
.wsteps{display:flex;align-items:flex-start;margin:4px 0 22px}
.wsteps .st{flex:1;display:flex;flex-direction:column;align-items:center;position:relative;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.wsteps .st .c{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-size:15px;font-weight:800;background:var(--surface);border:2px solid var(--line);color:var(--muted);margin-bottom:8px;position:relative;z-index:1}
.wsteps .st.done .c,.wsteps .st.on .c{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.wsteps .st::before{content:"";position:absolute;top:19px;right:50%;width:100%;height:2px;background:var(--line)}
.wsteps .st:first-child::before{display:none}
.wsteps .st.done::before,.wsteps .st.on::before{background:var(--accent)}

/* event kind tiles (wizard step 0). Every tile is the same size, locked
   or not — the chip is the only difference, and hiding locked tiles is
   a remembered preference (glHideLocked). */
.kinds{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.kinds .kindhead{grid-column:1/-1;margin:8px 0 -2px;font-size:11.5px;font-weight:700;
	letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.kinds .kindhead:first-child{margin-top:0}
.kind{display:flex;flex-direction:column;gap:4px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--surface);text-decoration:none;color:var(--ink)}
a.kind:hover,a.kind:focus-visible{border-color:var(--accent);box-shadow:0 6px 18px rgba(10,30,20,.10)}
.kind .kindtop{display:flex;align-items:center;gap:8px;justify-content:space-between;color:var(--ink)}
.kind b{font-size:15px}
.kind span{color:var(--muted);font-size:12.5px;line-height:1.4}
.kind.locked{background:var(--surface-2)}
.kind .lockchip{flex:0 0 auto;font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#7a5a12;background:var(--live);border-radius:999px;padding:2px 8px;white-space:nowrap}
:root[data-theme="dark"] .kind .lockchip{color:#231a06}
.kinds.hidelocked .kind.locked{display:none}
.kindbar{display:flex;justify-content:flex-end;margin:0 0 10px}
.kindtoggle{display:flex;align-items:center;gap:7px;margin:0;font-size:12.5px;font-weight:400;color:var(--muted);cursor:pointer}
.kindtoggle input{margin:0}
/* Print surfaces on a phone: mobile browsers ignore @page size/orientation,
   so a landscape letter card cannot render right there. The note shows only
   on narrow screens and never on paper (.noprint on print pages). */
.printnote{display:none;border:1px solid var(--line);background:var(--surface-2);color:var(--muted);
	border-radius:8px;padding:8px 12px;margin:10px 0 0;font-size:13px}
@media (max-width:760px){.printnote{display:block}}

/* day of: the starter's table */
.dayhead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.bigstat{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}
.bigstat a{background:var(--board);color:var(--board-ink);border-radius:12px;padding:14px 8px;text-align:center;text-decoration:none;display:block}
.bigstat b{display:block;font-size:26px;font-weight:700;line-height:1.1}
.bigstat span{font-size:11px;color:var(--board-muted);letter-spacing:.06em;text-transform:uppercase}
.heat{display:grid;grid-template-columns:repeat(9,1fr);gap:4px;margin-top:10px}
.hcell{height:26px;border-radius:5px;background:var(--surface-2);color:var(--muted);font-size:10.5px;
	display:flex;align-items:center;justify-content:center}
.hcell.part{background:color-mix(in srgb,var(--accent) 22%,transparent);color:var(--accent)}
.hcell.in{background:var(--accent);color:var(--accent-ink);font-weight:700}
.dayactions{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:12px 0}
.dayactions .btn{padding:16px 10px;font-size:15px}
/* margin:auto (not place-items:center) so a stack taller than a short phone
   viewport scrolls from its top instead of clipping the Close button away. */
.qrsheet{position:fixed;inset:0;background:rgba(6,16,12,.94);display:grid;z-index:60;padding:20px;text-align:center;overflow:auto}
.qrsheet>div{margin:auto}
.qrsheet .btn{min-height:48px;min-width:160px;font-size:16px}
.qrsheet img{width:min(78vw,420px);height:auto;background:#fff;padding:14px;border-radius:16px}
.qrsheet .code{color:#fff;font-size:34px;font-weight:800;letter-spacing:.2em;margin:12px 0 4px}
.qrsheet .pin{color:#cfe0d6;font-size:15px}
.qrsheet p{color:#9db3a6;font-size:13px;margin:8px 0 14px}

/* jump bar */
.jumpopen{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding:8px 12px;width:100%;max-width:340px;
	background:var(--surface);border:1px solid var(--line);border-radius:10px;color:var(--muted);
	font-size:13px;cursor:pointer;text-align:left}
.jumpopen kbd{margin-left:auto;font-family:inherit;font-size:11px;background:var(--surface-2);
	border:1px solid var(--line);border-radius:5px;padding:1px 6px}
.jumpwrap{position:fixed;inset:0;z-index:70}
.jumpbg{position:absolute;inset:0;background:rgba(6,16,12,.5)}
.jumppanel{position:relative;max-width:560px;margin:10vh auto 0;background:var(--surface);
	border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 60px rgba(6,16,12,.35);padding:12px}
.jumppanel input[type=search]{width:100%;margin:0 0 8px;font-size:16px}
.jumphit{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:9px 10px;border-radius:9px;
	text-decoration:none;color:var(--ink)}
.jumphit .jd{grid-column:1;font-size:12px;color:var(--muted)}
.jumphit .jk{grid-row:1 / span 2;align-self:center;font-size:10px;letter-spacing:.05em;text-transform:uppercase;
	color:var(--muted);background:var(--surface-2);border-radius:999px;padding:2px 8px;white-space:nowrap}
.jumphit .jk.tool{background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent)}
.jumphit.on,.jumphit:hover{background:var(--surface-2)}
.jumphit.on{outline:2px solid var(--accent);outline-offset:-2px}
.jumpnone{color:var(--muted);font-size:13px;padding:10px}
.jumphint{color:var(--muted);font-size:11.5px;margin:8px 4px 2px}

/* roster canvas: the import card that moved off step 3 (item 06) */
details.importcard > summary{cursor:pointer;font-weight:700;font-size:14px;list-style:none;display:flex;align-items:center;gap:8px}
details.importcard > summary::-webkit-details-marker{display:none}
details.importcard > summary::before{content:"▸";color:var(--muted);font-size:12px}
details.importcard[open] > summary::before{content:"▾"}
details.importcard[open] > summary{margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--line)}
/* step 3: the roster peek beside the QR */
.rosterpeek{display:flex;flex-wrap:wrap;gap:6px}
.rosterpeek .peek{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;background:var(--surface-2);
	border-radius:999px;padding:3px 10px 3px 3px}

/* roster canvas: list + chips + inspector */
.rosterhead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.chiprow{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0 10px}
.chip{font-size:12.5px;padding:5px 12px;border-radius:999px;border:1px solid var(--line);
	background:var(--surface);color:var(--muted);cursor:pointer;width:auto}
.chip.on{background:var(--board);color:var(--board-ink);border-color:transparent;font-weight:600}
.canvas{display:grid;grid-template-columns:1fr 300px;gap:14px;align-items:start}
@media (max-width:760px){.canvas{grid-template-columns:1fr}}
.rrow{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;
	padding:9px 8px;border-top:1px solid var(--line);text-decoration:none;color:var(--ink);border-radius:8px}
.rrow:first-of-type{border-top:0}
.rrow:hover,.rrow:focus-visible{background:var(--surface-2)}
.rrow.sel{background:color-mix(in srgb,var(--accent) 12%,transparent)}
.rrow .rchips{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.rrow .rteam{grid-column:1 / -1;font-size:12px}
.pill.warn{background:color-mix(in srgb,var(--live) 30%,transparent);color:#7a5a12}
:root[data-theme="dark"] .pill.warn{color:#E3B34C}
.pill.ok{background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent)}
.inspect{position:sticky;top:14px}
.inspect.empty{background:var(--surface-2)}

/* control room run sheet: phase rail, one next action, phase tools */
.rail{display:flex;background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:10px 0}
.railstep{flex:1;padding:8px 6px;text-align:center;font-size:11.5px;font-weight:600;color:var(--muted);border-left:1px solid var(--line)}
button.railstep{font:inherit;font-size:11.5px;font-weight:600;background:none;cursor:pointer;
	border:0;border-left:1px solid var(--line)}
.railstep:first-child{border-left:0}
.railstep.open{box-shadow:inset 0 -3px 0 var(--accent)}
.railpanel{border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:12px 14px;margin:-4px 0 12px}
.railpanel .sumrow{display:flex;align-items:baseline;gap:10px;padding:6px 0;border-top:1px solid var(--line)}
.railpanel .sumrow:first-of-type{border-top:0}
.railpanel .k{flex:0 0 92px;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.railpanel .val{flex:1;font-size:13.5px}
.railstep.done{color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.railstep.done::after{content:" ✓"}
.railstep.now{background:var(--board);color:var(--board-ink)}
.nextup{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
	background:color-mix(in srgb,var(--accent) 10%,transparent);border-left:3px solid var(--accent);
	border-radius:10px;padding:12px 14px;margin-bottom:12px}
.nextup b{font-size:15px}
.toolrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.toolrow .btn{flex:1 1 150px}
details.alltools{margin-top:10px}
details.alltools > summary{cursor:pointer;font-size:13px;color:var(--muted);padding:6px 0}
details.alltools[open] > summary{margin-bottom:6px}

/* setup step 2: scoring templates - ours, offered not assumed */
.tpls{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px}
.tpl{display:flex;flex-direction:column;gap:3px;padding:11px 12px;border:1px solid var(--line);
	border-radius:10px;background:var(--surface);text-decoration:none;color:var(--ink)}
.tpl:hover,.tpl:focus-visible{border-color:var(--accent)}
.tpl.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.tpl b{font-size:13.5px}
.tpl span{font-size:12px;color:var(--muted);line-height:1.4}

/* setup step 2: the decisions summary + the fine-tune disclosure */
.sumcard .sumrow{display:flex;align-items:baseline;gap:10px;padding:7px 0;border-top:1px solid var(--line)}
.sumcard .sumrow:first-of-type{border-top:0}
.sumcard .k{flex:0 0 92px;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.sumcard .val{flex:1;font-size:14px}
.sumcard .chg{background:none;border:0;padding:2px 4px;color:var(--accent);font-size:12.5px;font-weight:600;cursor:pointer;text-decoration:underline;width:auto}
.sumcard .chg-none{font-size:12px;color:var(--muted)}
details.finetune > summary{cursor:pointer;font-weight:700;font-size:14px;list-style:none;display:flex;align-items:center;gap:8px}
details.finetune > summary::-webkit-details-marker{display:none}
details.finetune > summary::before{content:"▸";color:var(--muted);font-size:12px}
details.finetune[open] > summary::before{content:"▾"}
details.finetune[open] > summary{margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.kindchip{display:flex;align-items:center;gap:8px;margin:0 0 14px;font-size:13px}
.kindchip b{background:var(--chip);border-radius:999px;padding:4px 12px;font-size:12.5px}

/* report center */
.rcbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.rcbar h1{font-size:22px;margin:0}
.rc{display:flex;gap:18px;align-items:flex-start}
.rcpanel{width:300px;flex:none}
.rcprev{flex:1;min-width:0;background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:14px}
.rcprev iframe{width:100%;height:74vh;border:0;background:#fff;border-radius:8px;box-shadow:0 6px 20px rgba(0,0,0,.14)}
.chk{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ink);margin:7px 0}
.chk input{width:auto;margin:0;accent-color:var(--accent)}
@media (max-width:1000px){.rc{flex-direction:column}.rcpanel{width:auto}}

/* indicator */
.htmx-indicator{opacity:0;transition:opacity 200ms ease-in}
.htmx-request .htmx-indicator,.htmx-request.htmx-indicator{opacity:1}

/* footer */
.colophon{border-top:1px solid var(--line);margin-top:40px}
.foot-inner{max-width:1120px;margin:0 auto;padding:20px 18px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.foot-inner nav{display:flex;gap:14px;flex-wrap:wrap}
.foot-inner a{color:var(--muted)}
.foot-inner a:hover{color:var(--ink)}
body.bare .colophon,body.bare .nav{display:none}

@media (max-width:640px){
	.nav-inner{gap:10px}
}

/* pairings board (was inline in pairings.templ) */
.pair-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:12px}
.pair-cart{align-self:start}
.pair-player{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;text-align:left;background:transparent;color:var(--ink);border:1px solid var(--line);border-radius:9px;padding:9px 12px;margin:0 0 6px;font-size:14.5px;font-weight:400;cursor:pointer}
.pair-player:hover{filter:none;border-color:var(--accent)}
.pair-player.pairsel{border-color:var(--accent);background:var(--chip);box-shadow:0 0 0 1px var(--accent)}
.movehere{display:none;margin-top:4px;padding:7px 12px;font-size:13px}
#pairboard.selecting .movehere{display:block}
.pair-menu{position:relative}
.pair-menu > div{position:absolute;right:0;z-index:20;box-shadow:0 8px 24px rgba(0,0,0,.15)}

/* match play (0048) - the match board and the organizer's sheet share it.
   Sizes go through --ui-k like every other player surface, so the reach
   scale grows the match board with everything else. */
.matchrow{display:grid;grid-template-columns:22px 1fr auto auto;gap:10px;align-items:center;
	padding:10px 2px;border-bottom:1px solid var(--line)}
.matchrow:last-child{border-bottom:0}
.matchrow.done{opacity:.85}
.mseq{color:var(--muted);font-size:calc(12px * var(--ui-k))}
.mside{display:flex;flex-direction:column;gap:4px;min-width:0}
.mteam{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;min-width:0}
.mteam b{font-size:calc(14.5px * var(--ui-k));font-weight:600}
.mteam span.muted{font-size:calc(12px * var(--ui-k))}
.mteam.lead b,.mteam.won b{font-weight:800}
.mvs{color:var(--muted);font-size:calc(11px * var(--ui-k));letter-spacing:.08em;text-transform:uppercase}
.mstate{display:flex;flex-direction:column;align-items:flex-end;gap:2px;text-align:right}
.mstatus{font-size:calc(15px * var(--ui-k));white-space:nowrap}
.mstatus.live{color:var(--live)}
.mstatus.done{color:var(--accent)}
.mthru{color:var(--muted);font-size:calc(12px * var(--ui-k))}

/* the cup scoreboard: two camps, one number each */
.cuphead{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;padding:6px 0}
.cside{display:flex;align-items:center;gap:10px;min-width:0}
.cside.b{flex-direction:row}
.cname{font-size:calc(13px * var(--ui-k));font-weight:700;letter-spacing:.02em}
.cpts{font-size:calc(30px * var(--ui-k));line-height:1;font-weight:800}
.cdash{color:var(--muted)}

@media (max-width:520px){
	.matchrow{grid-template-columns:20px 1fr auto;row-gap:6px}
	.matchrow form{grid-column:3}
}

/* §C3 calendar editing */
.cal-num{display:flex;justify-content:space-between;align-items:center}
.cal-add{border:1px solid var(--line);background:var(--card);color:var(--muted);border-radius:6px;width:20px;height:20px;line-height:1;font-size:13px;cursor:pointer;padding:0}
.cal-add:hover{color:var(--ink);border-color:var(--ink)}
.cal-chipwrap{position:relative}
.cal-chipwrap .cal-edit{position:absolute;top:2px;right:2px;border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:12px;padding:2px;opacity:0;transition:opacity .12s}
.cal-chipwrap:hover .cal-edit{opacity:1}
.cal-over{outline:2px dashed var(--accent, #2a7);outline-offset:-2px}
.cal-picked{outline:2px solid var(--accent, #2a7)}

/* §D6 footer social icons - currentColor, so both themes just work */
.foot-social{display:flex;gap:12px;align-items:center;margin-top:8px}
.foot-social a{color:var(--muted);display:inline-flex}
.foot-social a:hover{color:var(--ink)}

/* Announcements (0047): the organizer's live banner on every player surface.
   Gold tag = attention, not alarm; scales with --ui-k like every player
   control. On the board it renders inside the polled fragment. */
.annc{display:flex;gap:10px;align-items:baseline;margin:0 0 12px;padding:calc(10px * var(--ui-k)) calc(12px * var(--ui-k));
	background:var(--surface-2);border:1px solid var(--line);border-left:3px solid var(--live);border-radius:10px;
	font-size:calc(14.5px * var(--ui-k))}
.annc-tag{color:var(--live);font-weight:750;font-size:calc(11.5px * var(--ui-k));letter-spacing:.06em;text-transform:uppercase;flex:none}