/* Fonts, self-hosted (Joel 9/29/26: "make sure the new design is using the correct fonts"). Barlow for the interface and
   Barlow Semi Condensed for titles and numbers. The old names 'Inter' and 'Oswald' are pointed at the same files, so any
   leftover rule in a module or an older page that still asks for them renders in the new faces too. */
@font-face{ font-family:'Barlow'; font-style:normal; font-weight:400; font-display:swap; src:url(fonts/barlow-latin-400-normal.woff2) format('woff2'); }
@font-face{ font-family:'Barlow'; font-style:normal; font-weight:500; font-display:swap; src:url(fonts/barlow-latin-500-normal.woff2) format('woff2'); }
@font-face{ font-family:'Barlow'; font-style:normal; font-weight:600; font-display:swap; src:url(fonts/barlow-latin-600-normal.woff2) format('woff2'); }
@font-face{ font-family:'Barlow'; font-style:normal; font-weight:700; font-display:swap; src:url(fonts/barlow-latin-700-normal.woff2) format('woff2'); }
@font-face{ font-family:'Barlow'; font-style:normal; font-weight:800; font-display:swap; src:url(fonts/barlow-latin-800-normal.woff2) format('woff2'); }
@font-face{ font-family:'Barlow'; font-style:italic; font-weight:400; font-display:swap; src:url(fonts/barlow-latin-400-italic.woff2) format('woff2'); }
@font-face{ font-family:'Barlow Semi Condensed'; font-style:normal; font-weight:500; font-display:swap; src:url(fonts/barlow-semi-condensed-latin-500-normal.woff2) format('woff2'); }
@font-face{ font-family:'Barlow Semi Condensed'; font-style:normal; font-weight:600; font-display:swap; src:url(fonts/barlow-semi-condensed-latin-600-normal.woff2) format('woff2'); }
@font-face{ font-family:'Barlow Semi Condensed'; font-style:normal; font-weight:700; font-display:swap; src:url(fonts/barlow-semi-condensed-latin-700-normal.woff2) format('woff2'); }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:400; font-display:swap; src:url(fonts/barlow-latin-400-normal.woff2) format('woff2'); }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:500; font-display:swap; src:url(fonts/barlow-latin-500-normal.woff2) format('woff2'); }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:600; font-display:swap; src:url(fonts/barlow-latin-600-normal.woff2) format('woff2'); }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:700; font-display:swap; src:url(fonts/barlow-latin-700-normal.woff2) format('woff2'); }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:800; font-display:swap; src:url(fonts/barlow-latin-800-normal.woff2) format('woff2'); }
@font-face{ font-family:'Oswald'; font-style:normal; font-weight:500; font-display:swap; src:url(fonts/barlow-semi-condensed-latin-500-normal.woff2) format('woff2'); }
@font-face{ font-family:'Oswald'; font-style:normal; font-weight:600; font-display:swap; src:url(fonts/barlow-semi-condensed-latin-600-normal.woff2) format('woff2'); }
@font-face{ font-family:'Oswald'; font-style:normal; font-weight:700; font-display:swap; src:url(fonts/barlow-semi-condensed-latin-700-normal.woff2) format('woff2'); }
/* ============================================================================================================
   ROC design refresh (Joel 9/29/26): "lock down a clean and modern look". Built from Impeccable's Operate-mode
   rules: one type family (Barlow; Semi Condensed for titles and big numbers), restrained color (navy = the bar and
   the selected state, gold = the primary action), no stripes on card edges, no capitals on every title, themed
   browser surfaces. Loaded after index.html's <style> and mods/mods.css, so it only re-points and refines.
   Mockups: claude.ai artifact "ROC Design Refresh"; notes: project doc claude/design-refresh-sep29.md.
   ============================================================================================================ */
:root{
  --f-ui:"Barlow",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-cond:"Barlow Semi Condensed","Barlow",ui-sans-serif,system-ui,sans-serif;
  --bar:#161F45; --bar-ink:#C9D1EA; --panel:#E9ECF3;
  --bg:#F3F4F8; --surface:#FFFFFF; --sunken:#F6F7FA;
  --ink:#141A31; --muted:#4E5672; --faint:#646C89; --line:#D9DDE8; --hair:#E7EAF1;
  --focus:#2A58B0; --sel:rgba(242,194,48,.38);
  --shadow:0 1px 2px rgba(20,26,49,.05),0 3px 10px rgba(20,26,49,.04);
  --r:12px;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bar:#0A0F20; --bar-ink:#B3BCDA; --panel:#0F1528;
  --bg:#0C1122; --surface:#141B31; --sunken:#10172B;
  --ink:#E9ECF5; --muted:#AEB5CC; --faint:#8A92AD; --line:#28304B; --hair:#1F2740;
  --focus:#8FB0F5; --sel:rgba(242,194,48,.30); --shadow:0 1px 2px rgba(0,0,0,.35);
} }
:root[data-theme="dark"]{
  --bar:#0A0F20; --bar-ink:#B3BCDA; --panel:#0F1528;
  --bg:#0C1122; --surface:#141B31; --sunken:#10172B;
  --ink:#E9ECF5; --muted:#AEB5CC; --faint:#8A92AD; --line:#28304B; --hair:#1F2740;
  --focus:#8FB0F5; --sel:rgba(242,194,48,.30); --shadow:0 1px 2px rgba(0,0,0,.35);
}

/* ---------- type ---------- */
body{ font-family:var(--f-ui); font-size:15px; line-height:1.5; -webkit-font-smoothing:antialiased; font-variant-numeric:tabular-nums; }
h1,h2,h3{ font-family:var(--f-ui); letter-spacing:0; }
h1{ font-family:var(--f-cond); font-weight:700; font-size:28px; line-height:1.1; }
h2{ font-size:17px; font-weight:600; text-transform:none; letter-spacing:0; color:var(--ink); line-height:1.25; }
h3{ font-size:12.5px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); }
.sub{ font-size:13.5px; } .where{ font-size:13px; }
.eyebrow{ font-size:12px; letter-spacing:.06em; font-weight:600; }
th{ font-size:12px; letter-spacing:.05em; font-weight:600; color:var(--faint); }
.pill{ font-size:11.5px; font-weight:700; letter-spacing:.01em; }
.tile .k, .tile .n{ font-size:12.5px; }
.tile .v{ font-family:var(--f-cond); font-size:26px; font-weight:700; }
.hero .fig{ font-family:var(--f-cond); letter-spacing:-.01em; }
/* modules that name the old faces in their own <style> */
html body .bdgs-grp, html body .bdgw-big, html body .bdgw-h, html body .mr-kpi .v, html body .mr-rk, html body .misc-tile .mt-tt,
html body .us-kpi .v, html body .fit-stype, html body .avatar, html body .ns-head b{ font-family:var(--f-cond); }
html body .ns-grp h3{ font-family:var(--f-ui); }
html body .bdgw-h{ text-transform:none; letter-spacing:0; font-family:var(--f-ui); font-weight:600; font-size:15px; color:var(--ink); }

/* ---------- browser surfaces ---------- */
::selection{ background:var(--sel); color:inherit; }
button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible, textarea:focus-visible, summary:focus-visible,
[tabindex]:focus-visible{ outline:2px solid var(--focus); outline-offset:2px; }
*{ scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
a{ color:var(--navy-3); text-underline-offset:3px; }
:root:not([data-theme="light"]) a{ }
input::placeholder, textarea::placeholder{ color:var(--faint); opacity:1; }

/* ---------- the bar ---------- */
body{ padding:0 16px 60px; }
.top{ position:sticky; top:0; z-index:50; background:var(--bar); border-radius:0; padding:10px 0 0; margin:0;
      border-image:linear-gradient(var(--bar) 0 0) fill 0 / 0 / 0 100vmax; color:#fff; }
.top .brand{ gap:10px 14px; min-height:44px; padding-bottom:10px; }
.top .logo{ width:34px; height:34px; padding:1px; filter:none; }
.top .eyebrow{ display:none; }
.top h1.roch1{ font-family:var(--f-ui); font-size:13px; font-weight:500; color:var(--bar-ink); gap:10px; line-height:1.15; flex-wrap:nowrap; }
.rocpill{ font-family:var(--f-cond); font-size:22px; font-weight:700; letter-spacing:.02em; line-height:1; color:#fff; background:none; padding:0; border-radius:0; order:-1; }
.top .rocfull{ border-left:1px solid rgba(255,255,255,.2); padding-left:10px; max-width:150px; }
@media (max-width:560px){ .top .rocfull{ display:none; } }
.top .search{ max-width:520px; margin:0 auto; }
.top .search input{ min-height:38px; border-radius:9px; background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.16); font-size:14.5px; }
.top .search input:focus{ background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.32); }
.top .who{ font-size:13.5px; color:var(--bar-ink); display:flex; align-items:center; gap:8px; }
.top .who button{ margin-left:2px; }
.top button{ border-radius:8px; border-color:rgba(255,255,255,.22); background:rgba(255,255,255,.08); }
.top button:hover{ background:rgba(255,255,255,.16); }
nav.tabs{ margin-top:0; border-top:1px solid rgba(255,255,255,.08); }
.top .ntab, .top .nbtn{ font-size:14px; font-weight:500; color:var(--bar-ink); padding:10px 12px 11px; border-bottom-width:2px; }
.top .ntab.on, .top .nbtn.on{ color:#fff; font-weight:600; }
.top .nbtn .car{ font-size:8px; }
.nmenu{ border-radius:10px; padding:6px; box-shadow:0 12px 32px rgba(10,15,32,.22); }
.nmenu a{ font-weight:500; font-size:14.5px; padding:9px 12px; }
.nmenu a.on{ background:var(--sunken); font-weight:600; box-shadow:none; }
.nmob{ padding:8px 0 10px; }
.top .nmenubtn{ min-height:40px; font-size:14.5px; font-weight:600; border-radius:9px; }
.nmenucur{ color:#fff; font-size:14.5px; }
.navbadge{ font-weight:700; font-size:11.5px; }
.ns-grp a{ font-weight:500; }
.ns-grp a.on{ background:var(--surface); border-color:var(--line); font-weight:600; }

/* ---------- desktop: the grouped menu becomes a sidebar (admins); assignors keep tabs in the bar ---------- */
@media (min-width:1100px){
  body:has(.top .navsheet){ padding-left:calc(248px + 28px); padding-right:28px; }
  .top nav.tabs.grouped{ display:none; }
  .top{ padding-top:0; }
  .top .brand{ height:64px; min-height:0; padding-bottom:0; flex-wrap:nowrap; }
  .top .navsheet{ display:block !important; position:fixed; top:64px; left:0; bottom:0; right:auto; width:248px; z-index:45; background:var(--panel);
                  border-right:1px solid var(--line); padding-top:0; }
  .top .navsheet .ns-panel{ width:100%; height:100%; background:transparent; box-shadow:none; padding:10px 10px 28px; gap:14px; color:var(--ink); }
  .top .navsheet .ns-head{ display:none; }
  .top .navsheet .ns-grp{ gap:1px; }
  .top .navsheet .ns-grp h3{ font-size:11.5px; font-weight:600; letter-spacing:.06em; color:var(--faint); margin:0 0 3px 10px; }
  .top .navsheet .ns-grp a{ min-height:36px; padding:7px 10px; border-radius:7px; font-size:14px; font-weight:500; color:var(--muted); border:0; }
  .top .navsheet .ns-grp a:hover{ background:var(--hair); color:var(--ink); }
  .top .navsheet .ns-grp a.on{ background:var(--surface); color:var(--ink); font-weight:600; box-shadow:var(--shadow); }
  .top .navsheet .ns-grp a .navbadge{ min-width:22px; }
  body.navlock{ overflow:auto; }
}
@media (min-width:1100px) and (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .top .navsheet{ background:var(--panel); } }
:root[data-theme="dark"] .top .navsheet{ }

/* ---------- controls ---------- */
button, .btn{ font-family:var(--f-ui); font-size:14px; font-weight:600; border-radius:8px; min-height:36px; }
button.primary{ background:var(--gold); border-color:var(--gold); color:#1B2652; }
button.primary:hover{ background:#E5B31C; border-color:#E5B31C; }
@media screen and (prefers-color-scheme: dark){ :root:not([data-theme="light"]) button.primary{ color:#1B2652; } }
:root[data-theme="dark"] button.primary{ color:#1B2652; }
.rangebar{ border-radius:var(--r); padding:8px 10px; box-shadow:var(--shadow); }
.rangebar .lbl{ font-weight:600; font-size:15px; }
.rangebar .chips button{ border-radius:7px; font-size:13.5px; font-weight:500; }
.rangebar .chips button:not(.on){ border-color:transparent; background:transparent; }
.rangebar .chips button:not(.on):hover{ background:var(--sunken); }
.rangebar .chips button.on{ font-weight:600; }
.seg{ border-radius:9px; background:var(--surface); padding:3px; gap:2px; }
.seg button, .seg .btn{ border-radius:6px !important; font-size:13.5px; font-weight:500; min-height:32px; }
.seg button.on, .seg .btn.on{ font-weight:600; }
input[type=text], input[type=email], input[type=date], input[type=search], select, textarea{ border-radius:8px; background:var(--surface); font-size:14.5px; }
.lnk{ font-size:13.5px; font-weight:600; }
.more{ font-size:13.5px; font-weight:600; }
.fchips a{ font-weight:600; font-size:13px; border-radius:7px; }
.toast{ border-radius:10px; font-weight:600; }
.modal{ border-radius:14px; }

/* ---------- cards ---------- */
.card{ border-radius:var(--r); padding:16px 18px; box-shadow:var(--shadow); }
.cardhead{ margin-bottom:12px; }
.cardhead h2{ font-size:17px; }
.tiles{ background:var(--hair); border:1px solid var(--hair); border-radius:10px; gap:1px; }
.tile{ padding:12px 16px; }
.banner{ border-radius:10px; }

/* ---------- no colored stripes on card edges: the pill or icon inside carries the meaning ---------- */
.obs.src, .flag, .flag.t-standout, .flag.t-concern, .flagbanner, .rflag, .rflag.k-adult, .rflag.k-caution, .rflag.ck-dec, .rflag.ku-dec,
.ev-card, .ev-card.attn, .fit-res, .fit-res.saved, .fit-res.dirty, .hd-card, .ck-card.ck-on, .taskbar, .taskbar.urgent, .taskbar.met{ border-left-width:1px; border-left-color:var(--line); }
.obs.src, .flag, .flagbanner, .rflag{ border-left-color:var(--line); }
.flag.t-standout{ border-color:color-mix(in srgb, var(--green) 40%, var(--line)); }
.flag.t-concern, .ev-card.attn{ border-color:color-mix(in srgb, var(--danger) 40%, var(--line)); }
.rflag{ border-color:color-mix(in srgb, var(--hi) 35%, var(--line)); }
.rflag.k-adult{ border-color:color-mix(in srgb, var(--ad) 40%, var(--line)); }
.rflag.k-caution{ border-color:color-mix(in srgb, var(--danger) 45%, var(--line)); }
.rflag.ck-dec{ border-color:color-mix(in srgb, var(--ck, #B45309) 40%, var(--line)); }
.rflag.ku-dec{ border-color:color-mix(in srgb, var(--ku, #B7791F) 40%, var(--line)); }
.hd-card{ border-color:color-mix(in srgb, var(--hold) 40%, var(--line)); }
.ck-card.ck-on{ border-color:color-mix(in srgb, var(--ck, #B45309) 45%, var(--line)); }
.fit-res.saved{ border-color:color-mix(in srgb, var(--green) 40%, var(--line)); }
.fit-res.dirty{ border-color:color-mix(in srgb, var(--gold-2) 55%, var(--line)); }
.obs .priv{ border-left:0; padding:8px 10px; border-radius:8px; background:var(--warn-wash); }
.stk{ border-left:0; padding:10px 12px; border-radius:10px; background:var(--hi-wash); }
.lane-stretch, .lane-support, .lane-caution, .lane-needs_eyes, .lane-hold, .lane-checkin{ border-top-width:1px; border-top-color:var(--line); }
.flagbanner{ box-shadow:var(--shadow); }
.flagbanner b{ font-size:16px; font-weight:600; }

/* ---------- drawn icons (masks, so they take the text color and both themes) ---------- */
.ic-m{ display:inline-block; width:18px; height:18px; flex:none; background:currentColor; vertical-align:-3px;
       -webkit-mask:var(--ic) center/contain no-repeat; mask:var(--ic) center/contain no-repeat; }
.lane .cardhead h2{ display:flex; align-items:center; gap:9px; }
.lane .cardhead h2::before{ content:""; width:28px; height:28px; flex:none; border-radius:8px; background:var(--lane-wash, var(--sunken));
  background-image:var(--ic); background-repeat:no-repeat; background-position:center; background-size:16px; }
.lane-stretch{ --lane-wash:var(--hi-wash); --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B3FA0' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E"); }
.lane-support{ --lane-wash:var(--green-wash); --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F7A4D' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Ccircle cx='12' cy='12' r='3.5'/%3E%3Cpath d='m6 6 3.5 3.5M18 6l-3.5 3.5M6 18l3.5-3.5M18 18l-3.5-3.5'/%3E%3C/svg%3E"); }
.lane-caution{ --lane-wash:var(--danger-wash); --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A8242F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.3 3h7.4L21 8.3v7.4L15.7 21H8.3L3 15.7V8.3z'/%3E%3Cpath d='M12 8v4.8M12 16.3v.2'/%3E%3C/svg%3E"); }
.lane-needs_eyes{ --lane-wash:var(--warn-wash); --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239A5B00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-6.5 10-6.5c2 0 3.7.6 5.1 1.5M22 12s-3.6 6.5-10 6.5c-2 0-3.7-.6-5.1-1.5'/%3E%3Cpath d='M4 20 20 4'/%3E%3C/svg%3E"); }
.lane-hold{ --lane-wash:var(--hold-wash); --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C2410C' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M9 6v12M15 6v12'/%3E%3C/svg%3E"); }
.lane-checkin{ --lane-wash:var(--ck-wash, var(--warn-wash)); --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B45309' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 4a8 8 0 0 1 0 16z' fill='%23B45309'/%3E%3C/svg%3E"); }
/* In dark mode the lane icons use lighter strokes */
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .lane .cardhead h2::before{ filter:brightness(1.9) saturate(.8); } }
:root[data-theme="dark"] .lane .cardhead h2::before{ filter:brightness(1.9) saturate(.8); }

/* ---------- Assigning Board: lanes side by side ---------- */
.grid:has(> .lane){ grid-template-columns:minmax(0, 1fr); gap:16px; align-items:stretch; }
@media (min-width:720px){ .grid:has(> .lane){ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (min-width:1100px){ .grid:has(> .lane){ grid-template-columns:repeat(3, minmax(0, 1fr)); } }
/* Lanes, tidied (Joel 9/29/26: "clean and tighten up all the lanes"): equal-height cards per row, the header on one line with
   its link on the right, a two-line description, and every row the same shape: name, age and marks on line 1, the note under it. */
.lane{ display:flex; flex-direction:column; padding:16px 16px 8px; }
.lane > .body{ flex:1; }
.lane .cardhead{ flex-wrap:nowrap; align-items:flex-start; margin-bottom:8px; }
.lane .cardhead > div{ min-width:0; }
.lane .cardhead .more{ flex:none; white-space:nowrap; padding-top:5px; }
.lane .cardhead .sub{ min-height:2.9em; margin-top:4px; }
.lane .brow > summary{ padding:10px 0; gap:5px 6px; row-gap:3px; }
.lane .brow > summary > .spacer{ display:none; }
.lane .brow > summary > .sub{ flex-basis:100%; order:10; text-align:left; white-space:normal; font-size:13px; }
.lane .brow > summary .bname{ font-size:15px; }
.lane .empty{ padding:10px 0 12px; }
.lane{ padding:14px 14px 10px; }
.lane .cardhead{ margin-bottom:6px; }
.lane .cardhead .sub{ font-size:13px; }
.brow > summary{ padding:9px 2px; gap:6px; }
.brow{ border-top-color:var(--hair); }
.brow[open]{ background:var(--sunken); margin:0 -14px; padding:0 14px; }
.bname{ font-weight:600; }
.qcard{ border-radius:14px; }
.taps button{ border-radius:10px; font-weight:500; }
.taps button b{ font-family:var(--f-cond); font-size:20px; }
.taps button.on b{ color:var(--gold); }
@media screen and (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .taps button.on b{ color:#1B2652; } }
:root[data-theme="dark"] .taps button.on b{ color:#1B2652; }
.qcard .q{ font-weight:600; font-size:12px; }

/* ---------- counting ticks (the ranking goal: one tick per referee) ---------- */
.ticks{ display:grid; grid-template-columns:repeat(var(--n, 10), minmax(0, 1fr)); gap:3px; width:100%; max-width:440px; }
.ticks i{ height:8px; border-radius:2px; background:var(--sunken); border:1px solid var(--line); }
.ticks i.d{ background:var(--green); border-color:var(--green); }
.ticks.many{ display:block; height:8px; border-radius:4px; background:var(--sunken); border:1px solid var(--line); overflow:hidden; }
.ticks.many b{ display:block; height:100%; background:var(--green); }
.taskbar{ gap:16px; padding:12px 16px; border-radius:var(--r); }
.taskbar .tb-txt{ gap:6px; }
.taskbar .tb-txt b{ font-size:16px; font-weight:600; color:var(--ink); }
.taskbar .tb-go{ border-radius:8px; font-weight:600; font-size:14px; }
.taskbar.urgent{ background:var(--surface); border-color:color-mix(in srgb, var(--danger) 45%, var(--line)); }
.qc-head .ticks{ margin-top:6px; }
.rk-item.on{ background:var(--sunken); border-color:var(--line); }
.rk-item .nm{ font-weight:600; }

/* ---------- dashboard ---------- */
.dash{ gap:16px; }
.dash-bar .sub{ font-size:13.5px; }
.plist > *{ border-top-color:var(--hair); }
td{ border-top-color:var(--hair); }
.meter .track{ height:7px; }
.hbar .ht{ height:12px; border-radius:3px; }

/* ---------- drawn glyphs (mods/icons.js wraps ⛔ ▲ ◆ ◐ ✦ ‖ ★ 🔒 👀 … in span.gl) ---------- */
.gl{ display:inline-block; font-size:0 !important; line-height:0; width:13px; height:13px; vertical-align:-2px; margin-right:4px; background:currentColor; overflow:hidden; color:inherit;
     -webkit-mask:var(--gi) center/contain no-repeat; mask:var(--gi) center/contain no-repeat; }
.pill .gl{ width:12px; height:12px; margin-right:3px; vertical-align:-1.5px; }
h2 .gl, .flagbanner b .gl{ width:17px; height:17px; vertical-align:-3px; margin-right:6px; }
button .gl, .btn .gl{ width:15px; height:15px; }
.lane .cardhead h2 .gl{ display:none; }
.car .gl{ width:10px; height:10px; margin:0; }
.pill.cau .gl:only-child, .pill .gl:only-child{ margin-right:0; }
.gl[data-g="caution"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.3 3h7.4L21 8.3v7.4L15.7 21H8.3L3 15.7V8.3z'/%3E%3Cpath d='M12 8v4.8M12 16.3v.2'/%3E%3C/svg%3E"); }
.gl[data-g="up"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E"); }
.gl[data-g="down"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
.gl[data-g="diamond"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5 20.5 12 12 20.5 3.5 12z'/%3E%3C/svg%3E"); }
.gl[data-g="half"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 4a8 8 0 0 1 0 16z' fill='black'/%3E%3C/svg%3E"); }
.gl[data-g="spark"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5c.6 4.3 2 6.9 8.5 8.5-6.5 1.6-7.9 4.2-8.5 8.5-.6-4.3-2-6.9-8.5-8.5 6.5-1.6 7.9-4.2 8.5-8.5z'/%3E%3C/svg%3E"); }
.gl[data-g="hold"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6v12M15 6v12'/%3E%3C/svg%3E"); }
.gl[data-g="star"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 4 2.4 5 5.4.6-4 3.7 1.1 5.4L12 16l-4.9 2.7 1.1-5.4-4-3.7 5.4-.6z'/%3E%3C/svg%3E"); }
.gl[data-g="lock"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='10.5' width='14' height='10' rx='2'/%3E%3Cpath d='M8.5 10.5V8a3.5 3.5 0 0 1 7 0v2.5'/%3E%3C/svg%3E"); }
.gl[data-g="flag"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 21V4M5 4h11.5l-2.2 4 2.2 4H5'/%3E%3C/svg%3E"); }
.gl[data-g="eye"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-6.5 10-6.5S22 12 22 12s-3.6 6.5-10 6.5S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
.gl[data-g="plane"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.5 13.5 3 11l1.5-1.5 7.5 1 4.5-4.5c1-1 2.8-1.3 3.4-.7s.3 2.4-.7 3.4L14.7 13.2l1 7.5L14.2 22l-2.6-7.4-3.6 3.5.4 2.4-1.2 1.2-1.5-3.2L2.4 17l1.2-1.2 2.4.4z'/%3E%3C/svg%3E"); }
.gl[data-g="doc"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h8l4 4v14H6z'/%3E%3Cpath d='M14 3v4h4M9 12h6M9 16h6'/%3E%3C/svg%3E"); }
.gl[data-g="badge"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5.5' width='18' height='13' rx='2'/%3E%3Ccircle cx='9' cy='11' r='2'/%3E%3Cpath d='M6 16c.5-1.5 1.6-2.2 3-2.2s2.5.7 3 2.2M14.5 10h4M14.5 13.5h3'/%3E%3C/svg%3E"); }
.gl[data-g="cal"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E"); }
.gl[data-g="cap"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 9.5 12 5l9.5 4.5L12 14z'/%3E%3Cpath d='M6.5 11.5V16c1.5 1.4 3.3 2 5.5 2s4-.6 5.5-2v-4.5M21.5 9.5V15'/%3E%3C/svg%3E"); }
.gl[data-g="trophy"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 4h10v5a5 5 0 0 1-10 0z'/%3E%3Cpath d='M7 6H4a3 3 0 0 0 3 4M17 6h3a3 3 0 0 1-3 4M12 14v3M8.5 20.5h7l-.8-3.5H9.3z'/%3E%3C/svg%3E"); }
.gl[data-g="menu"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E"); }
.gl[data-g="gear"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h10M18 6h2M4 12h4M12 12h8M4 18h12M20 18h0'/%3E%3Ccircle cx='16' cy='6' r='2'/%3E%3Ccircle cx='10' cy='12' r='2'/%3E%3Ccircle cx='18' cy='18' r='2'/%3E%3C/svg%3E"); }
.gl[data-g="alert"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5 21.5 20h-19z'/%3E%3Cpath d='M12 10v4.2M12 17v.2'/%3E%3C/svg%3E"); }
.gl[data-g="dot"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4' fill='black'/%3E%3C/svg%3E"); }

/* ---------- side menu, part 2 (Joel 9/29/26): collapsible groups, bolder headings, icons (mods/navside.js) ---------- */
.ns-grp h3{ margin:0 !important; }
.top .navsheet .ns-tog, .ns-tog{ all:unset; box-sizing:border-box; width:100%; display:flex; align-items:center; gap:8px; cursor:pointer; min-height:38px; padding:8px 10px; border-radius:8px;
  font-family:var(--f-ui); font-size:12.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--ink); }
.top .navsheet .ns-tog:hover, .ns-tog:hover{ background:var(--hair); }
.ns-tog:focus-visible{ outline:2px solid var(--focus); outline-offset:1px; }
.ns-tog .navbadge{ margin-left:0; letter-spacing:0; }
.ns-car{ margin-left:auto; width:14px; height:14px; flex:none; background:var(--faint); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat; transition:transform .15s ease-out; }
.ns-grp.open .ns-car{ transform:rotate(90deg); }
.ns-grp.open .ns-tog .navbadge{ display:none; }
.ns-items{ display:none; flex-direction:column; gap:1px; padding:2px 0 8px; }
.ns-grp.open .ns-items{ display:flex; }
.navsheet .ns-panel{ gap:6px !important; }
.navsheet .ns-grp.ns-top{ padding-bottom:8px; margin-bottom:4px; border-bottom:1px solid var(--line); }
.navsheet .ns-grp{ border-radius:10px; }
.navsheet .ns-grp.open{ padding-bottom:2px; }
.navsheet a[data-nk]{ gap:10px !important; }
.navsheet a[data-nk]::before{ content:''; width:18px; height:18px; flex:none; background:currentColor; opacity:.72; -webkit-mask:var(--ni, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3' fill='black'/%3E%3C/svg%3E")) center/contain no-repeat; mask:var(--ni, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3' fill='black'/%3E%3C/svg%3E")) center/contain no-repeat; }
.navsheet a[data-nk].on::before{ opacity:1; }
@media (min-width:1100px){ .top .navsheet .ns-grp a{ padding-left:12px; } .top .navsheet .ns-grp h3{ margin:0 !important; } }
.navsheet a[data-nk="hub"], nav.tabs.flat a[data-nk="hub"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 10.5 12 3.5l8.5 7V20a1 1 0 0 1-1 1H15v-6H9v6H4.5a1 1 0 0 1-1-1z'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="dash"], nav.tabs.flat a[data-nk="dash"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='3.5' width='7' height='7' rx='1.5'/%3E%3Crect x='13.5' y='3.5' width='7' height='7' rx='1.5'/%3E%3Crect x='3.5' y='13.5' width='7' height='7' rx='1.5'/%3E%3Crect x='13.5' y='13.5' width='7' height='7' rx='1.5'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="requests"], nav.tabs.flat a[data-nk="requests"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5.5' width='18' height='13' rx='2'/%3E%3Cpath d='m3.5 7 8.5 6 8.5-6'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="badges"], nav.tabs.flat a[data-nk="badges"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5.5' width='18' height='13' rx='2'/%3E%3Ccircle cx='9' cy='11' r='2'/%3E%3Cpath d='M6 16c.5-1.5 1.6-2.2 3-2.2s2.5.7 3 2.2M14.5 10h4M14.5 13.5h3'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="evals"], nav.tabs.flat a[data-nk="evals"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='17' rx='2'/%3E%3Cpath d='M9 4V3h6v1M8.5 10h7M8.5 14h7M8.5 18h4'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="fitness"], nav.tabs.flat a[data-nk="fitness"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='14' cy='4.5' r='1.8'/%3E%3Cpath d='M8 21l3-6 3 2v5M6 11l3-3 4 1 3 4 3 1M11 15l-2-4'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="abuse"], nav.tabs.flat a[data-nk="abuse"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 4.5 6v6c0 4.4 3.2 7.8 7.5 9 4.3-1.2 7.5-4.6 7.5-9V6z'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="redcards"], nav.tabs.flat a[data-nk="redcards"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6.5' y='3' width='11' height='17' rx='1.5' transform='rotate%288 12 11.5%29'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="expenses"], nav.tabs.flat a[data-nk="expenses"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-3-2-3 2-3-2-3 2z'/%3E%3Cpath d='M9 8h6M9 12h6'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="payables"], nav.tabs.flat a[data-nk="payables"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18M16.5 7.5c-.8-1.5-2.4-2.3-4.5-2.3-2.6 0-4.3 1.3-4.3 3.2 0 4.5 9 2.3 9 6.8 0 2-1.9 3.3-4.7 3.3-2.3 0-4-.9-4.8-2.6'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="treasurer"], nav.tabs.flat a[data-nk="treasurer"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18M16.5 7.5c-.8-1.5-2.4-2.3-4.5-2.3-2.6 0-4.3 1.3-4.3 3.2 0 4.5 9 2.3 9 6.8 0 2-1.9 3.3-4.7 3.3-2.3 0-4-.9-4.8-2.6'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="decide"], nav.tabs.flat a[data-nk="decide"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13.5h5l1.5 2.5h5l1.5-2.5h5'/%3E%3Cpath d='M5.5 4.5h13l2.5 9V19a1.5 1.5 0 0 1-1.5 1.5h-15A1.5 1.5 0 0 1 3 19v-5.5z'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="summary"], nav.tabs.flat a[data-nk="summary"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 20V11M11 20V5M17 20v-6M3 20.5h18'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="firstyear"], nav.tabs.flat a[data-nk="firstyear"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21v-8M12 13c0-4 3-7 7.5-7 0 4.5-3 7-7.5 7zM12 15c0-3.5-2.5-6-6.5-6 0 3.8 2.6 6 6.5 6z'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="retention"], nav.tabs.flat a[data-nk="retention"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19.5 10.5A7.8 7.8 0 0 0 5 8M4.5 4v4.5H9M4.5 13.5A7.8 7.8 0 0 0 19 16M19.5 20v-4.5H15'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="tiers"], nav.tabs.flat a[data-nk="tiers"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 4 2.4 5 5.4.6-4 3.7 1.1 5.4L12 16l-4.9 2.7 1.1-5.4-4-3.7 5.4-.6z'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="pool"], nav.tabs.flat a[data-nk="pool"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5 20.5 12 12 20.5 3.5 12z'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="health"], nav.tabs.flat a[data-nk="health"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='6' rx='7.5' ry='2.8'/%3E%3Cpath d='M4.5 6v12c0 1.5 3.4 2.8 7.5 2.8s7.5-1.3 7.5-2.8V6M4.5 12c0 1.5 3.4 2.8 7.5 2.8s7.5-1.3 7.5-2.8'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="ussf"], nav.tabs.flat a[data-nk="ussf"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 21V4M5 4h11.5l-2.2 4 2.2 4H5'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="board"], nav.tabs.flat a[data-nk="board"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Cpath d='M9 4v16M15 4v16'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="rank"], nav.tabs.flat a[data-nk="rank"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="mypool"], nav.tabs.flat a[data-nk="mypool"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.5'/%3E%3Cpath d='M2.5 20c.8-3.5 3.3-5.5 6.5-5.5s5.7 2 6.5 5.5'/%3E%3Cpath d='M16 4.8a3.5 3.5 0 0 1 0 6.4M18.2 14.8c1.9.8 3 2.5 3.3 5.2'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="oversight"], nav.tabs.flat a[data-nk="oversight"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.8'/%3E%3Cpath d='M4.5 20.5c1-4 4-6 7.5-6s6.5 2 7.5 6'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="coverage"], nav.tabs.flat a[data-nk="coverage"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s6.5-5.9 6.5-11.2a6.5 6.5 0 0 0-13 0C5.5 15.1 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.8' r='2.4'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="merit"], nav.tabs.flat a[data-nk="merit"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5c.6 4.3 2 6.9 8.5 8.5-6.5 1.6-7.9 4.2-8.5 8.5-.6-4.3-2-6.9-8.5-8.5 6.5-1.6 7.9-4.2 8.5-8.5z'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="mentors"], nav.tabs.flat a[data-nk="mentors"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-6.5 10-6.5S22 12 22 12s-3.6 6.5-10 6.5S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="m2assign"], nav.tabs.flat a[data-nk="m2assign"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="gameday"], nav.tabs.flat a[data-nk="gameday"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8.5' cy='14.5' r='5'/%3E%3Cpath d='M12 11l8.5-4.5v4l-5 2M8.5 14.5h.01'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="feedback"], nav.tabs.flat a[data-nk="feedback"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h14v11l-5 5H5z'/%3E%3Cpath d='M14 20v-5h5M8.5 8.5h7M8.5 12h4'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="misc-actions"], nav.tabs.flat a[data-nk="misc-actions"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6h11M9 12h11M9 18h11M4.5 6h.01M4.5 12h.01M4.5 18h.01'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="activity"], nav.tabs.flat a[data-nk="activity"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h4l3-7 4 14 3-7h4'/%3E%3C/svg%3E"); }
.navsheet a[data-nk="settings"], nav.tabs.flat a[data-nk="settings"]{ --ni:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h10M18 6h2M4 12h4M12 12h8M4 18h12M20 18h0'/%3E%3Ccircle cx='16' cy='6' r='2'/%3E%3Ccircle cx='10' cy='12' r='2'/%3E%3Ccircle cx='18' cy='18' r='2'/%3E%3C/svg%3E"); }

/* home tiles (my.azref.com) */
.mt-ic .gl{ width:20px; height:20px; margin:0; vertical-align:0; }
.gl[data-g="ball"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='m12 7.5 3.3 2.4-1.3 3.9h-4l-1.3-3.9zM12 3.5v4M15.3 9.9l4-1.3M14 13.8l2.5 3.4M10 13.8l-2.5 3.4M8.7 9.9l-4-1.3'/%3E%3C/svg%3E"); }
.gl[data-g="grid"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='3.5' width='7' height='7' rx='1.5'/%3E%3Crect x='13.5' y='3.5' width='7' height='7' rx='1.5'/%3E%3Crect x='3.5' y='13.5' width='7' height='7' rx='1.5'/%3E%3Crect x='13.5' y='13.5' width='7' height='7' rx='1.5'/%3E%3C/svg%3E"); }
.gl[data-g="mail"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5.5' width='18' height='13' rx='2'/%3E%3Cpath d='m3.5 7 8.5 6 8.5-6'/%3E%3C/svg%3E"); }
.gl[data-g="dollar"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18M16.5 7.5c-.8-1.5-2.4-2.3-4.5-2.3-2.6 0-4.3 1.3-4.3 3.2 0 4.5 9 2.3 9 6.8 0 2-1.9 3.3-4.7 3.3-2.3 0-4-.9-4.8-2.6'/%3E%3C/svg%3E"); }
.gl[data-g="check"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
.gl[data-g="clock"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='13' r='7.5'/%3E%3Cpath d='M12 9v4l2.5 1.5M9.5 3h5'/%3E%3C/svg%3E"); }
.gl[data-g="board"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Cpath d='M9 4v16M15 4v16'/%3E%3C/svg%3E"); }
.gl[data-g="list"]{ --gi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6h11M9 12h11M9 18h11M4.5 6h.01M4.5 12h.01M4.5 18h.01'/%3E%3C/svg%3E"); }

/* ---------- assignors, treasurer (few pages): an icon rail on the left at 1100px+ (Joel 9/29/26: 'icons on the left like the mockup') ---------- */
@media (min-width:1100px){
  body:has(.top nav.tabs.flat){ padding-left:calc(88px + 28px); padding-right:28px; }
  .top nav.tabs.flat{ position:fixed; top:64px; left:0; bottom:0; width:88px; z-index:45; margin:0; border:0; border-right:1px solid var(--line); background:var(--panel); padding:12px 8px; overflow-y:auto; display:block; }
  .top nav.tabs.flat .navrow{ flex-direction:column; flex-wrap:nowrap; gap:4px; }
  .top nav.tabs.flat .ntab{ position:relative; flex-direction:column; justify-content:center; gap:5px; min-height:62px; padding:9px 4px 8px; border:0; border-radius:10px;
    font-size:11.5px; font-weight:600; line-height:1.15; color:var(--muted); white-space:normal; text-align:center; }
  .top nav.tabs.flat .ntab:hover{ background:var(--hair); color:var(--ink); }
  .top nav.tabs.flat .ntab.on{ background:var(--surface); color:var(--ink); box-shadow:var(--shadow); border:0; }
  .top nav.tabs.flat .ntab::before{ content:''; width:22px; height:22px; flex:none; background:currentColor; -webkit-mask:var(--ni) center/contain no-repeat; mask:var(--ni) center/contain no-repeat; }
  .top nav.tabs.flat .ntab .navbadge{ position:absolute; top:5px; right:10px; margin:0; min-width:18px; line-height:17px; font-size:10.5px; }
  .top nav.tabs.flat .ntab .navbadge.ok{ background:var(--green-wash); color:var(--green-text); }
}

/* page title blocks (Assigning Board first): a heading on the page, not a boxed card (Joel 9/29/26, match the mockup) */
.card.pagehead{ background:none; border:0; box-shadow:none; padding:4px 2px 0; }
.card.pagehead h1{ font-family:var(--f-cond); font-size:32px; font-weight:700; line-height:1.05; color:var(--ink); }
.card.pagehead .sub{ font-size:14.5px; }

/* range control: the dates in bold, the presets as one segmented control, no box around it (Joel 9/29/26: match the mockup) */
.rangebar{ background:none; border:0; box-shadow:none; padding:0; gap:10px 14px; }
.rangebar .lbl{ font-size:16px; font-weight:600; color:var(--muted); }
.rangebar .chips{ background:var(--surface); border:1px solid var(--line); border-radius:9px; padding:3px; gap:2px; }
.rangebar .chips button{ min-height:32px; border-radius:6px; padding:4px 11px; font-size:13.5px; }
.rangebar .dates input{ min-height:38px; }
.dash-bar{ margin-top:-4px; }

/* profile: notes, reliability, tier and licence history as a two-up block above the Assigning Snapshot (Joel 9/29/26) */
.grid.prof-top{ gap:16px; }
@media (min-width:900px){ .grid.prof-top{ grid-template-columns:repeat(2, minmax(0, 1fr)); align-items:start; } }
.grid.prof-top:empty{ display:none; }

/* Desktop bar pinned to the full window width, so the logo and ROC sit at the far left over the side menu, like the mockup
   (Joel 9/29/26). The page scrolls under it. */
@media (min-width:1100px){
  .top{ position:fixed; top:0; left:0; right:0; z-index:50; padding:0 24px 0 20px; border-image:none; background:var(--bar); }
  .top .brand{ height:64px; }
  body{ padding-top:80px; }
}
@media print{ .top{ position:static; } body{ padding-top:0; } }