/* Desk: if Oura made a CRM. The Vantage register (bone ground, white cards,
   bronze the one accent, Switzer) carrying real CRM architecture — app shell
   with a quiet sidebar, kanban pipeline, dense calm tables (Mercury). */
:root {
  --paper: #F6F5F2;
  --card: #FDFDFC;
  --ink: #1C1B19;
  --muted: #76726B;
  --faint: #A6A29B;
  --line: #EAE8E3;
  --bronze: #9A7142;
  --bronze-soft: #C9AC7F;
  --track: #ECEAE5;
  --rust: #A34433;          /* genuinely urgent only */
  --shadow: 0 1px 2px rgba(29, 27, 23, 0.04), 0 12px 32px rgba(29, 27, 23, 0.06);
  --shadow-sm: 0 1px 2px rgba(29, 27, 23, 0.05), 0 4px 14px rgba(29, 27, 23, 0.05);
  --sans: "Switzer", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --human: "Source Serif 4", "Iowan Old Style", Palatino, Georgia, serif;
  --mono: "SF Mono", ui-monospace, Menlo, Consolas, monospace;
  /* The phases as vital signs (the Oura rule: hue only where the phase IS the
     information; intensity does the grading; never red). Dusty, not candy,
     and all COOL — bronze stays the only warm note (Carrie 2026-09-11; the
     apricot Adopt competed with bronze and sat next to Claude-coral). */
  /* The four state colors (Carrie 2026-09-15): warning = Oura's stress color,
     alert = rust, good = teal, information = steel. Bronze is accent only. */
  --warn: #B7674F;
  --good: #1F8A73;
  --steel: #3F6FA8;
  --ground: linear-gradient(170deg, #F2F1ED, #E7E6E1);
  --assess: #3F6FA8;    /* before commitment: steel blue */
  --activate: #1F8A73;  /* the habit forming: deep teal-green, the "go" */
  --adopt: #6E4F94;     /* settled, loyal: deep plum */
  color-scheme: light;
}
/* Dark: warm charcoal, not black. Bronze lightens a step so it keeps its
   role; the phase hues brighten a touch to glow rather than sink. */
:root[data-theme="dark"] {
  --paper: #111316;
  --card: #1A1D21;
  --ink: #F1EFEA;
  --muted: #A8A39B;
  --faint: #716D66;
  --line: #34312C;
  --bronze: #C9AC7F;
  --bronze-soft: #DCC7A3;
  --track: #302E2A;
  --rust: #D07460;
  --shadow: 0 1px 2px rgba(0, 0, 0, .25), 0 12px 32px rgba(0, 0, 0, .35);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .25), 0 4px 14px rgba(0, 0, 0, .3);
  --assess: #6FA3E0;
  --activate: #3FC9A6;
  --adopt: #B08BE0;
  --warn: #D4937D;
  --good: #5CC8A8;
  --steel: #7FA8D6;
  --rust: #CF5A4B;
  --ground: radial-gradient(1100px 520px at 62% -12%, rgba(203,165,123,.16), transparent 62%),
            radial-gradient(700px 420px at 100% 30%, rgba(92,200,168,.07), transparent 60%),
            linear-gradient(180deg, #14171B 0%, #0F1113 100%);
  color-scheme: dark;
}
:root[data-theme="dark"] .sidenav a.on { background: var(--card); }
:root[data-theme="dark"] .tbl tbody tr:hover { background: rgba(255,255,255,.025); }
:root[data-theme="dark"] .kcol { background: rgba(255,255,255,.03); }
:root[data-theme="dark"] .btn { background: var(--ink); color: var(--paper); }
:root[data-theme="dark"] .chip.warm { background: rgba(201, 172, 127, .18); }
:root[data-theme="dark"] .chip.urgent { background: rgba(208, 116, 96, .18); }
:root[data-theme="dark"] .gsearch input, :root[data-theme="dark"] .panel textarea,
:root[data-theme="dark"] .logform textarea { background: var(--paper); }

/* Phase hue, applied only where the phase is the information: the board's
   phase bands and the member header's phase pill. The cadence strip stays
   ink / bronze / rust. Palette itself open to a rethink (coral?) later. */
[data-phase="assess"] { --hue: var(--assess); }
[data-phase="activate"] { --hue: var(--activate); }
[data-phase="adopt"] { --hue: var(--adopt); }
.phase[data-phase] .section-h { color: var(--hue); }
.phase[data-phase] .stage .code { color: var(--hue); }
.phase[data-phase] .stage { box-shadow: var(--shadow-sm), inset 3px 0 0 var(--hue); }
.chip.phase { background: var(--hue); color: #FDFDFC; }
:root[data-theme="dark"] .chip.phase { color: #1C1B19; }
.pagehead[data-phase] .section-h { color: var(--hue); }

/* Theme choice: quiet words in the sidebar footer, never an icon. */
.themepick { display: flex; gap: 10px; margin-top: 8px; font-size: 11.5px; }
.themepick a { color: var(--faint); }
.themepick a.on { color: var(--ink); box-shadow: inset 0 -1px 0 var(--bronze); }
.themepick a:hover { text-decoration: none; color: var(--muted); }

#loadbar { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 99;
  pointer-events: none; opacity: 0; transition: opacity .15s ease; }
#loadbar::before { content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, var(--bronze-soft), var(--bronze));
  transform: scaleX(0); transform-origin: left; }
html.loading #loadbar { opacity: 1; }
html.loading #loadbar::before {
  animation: loadgrow 1.4s cubic-bezier(.2,.7,.3,1) forwards,
             loadpulse 1.4s ease-in-out 1.4s infinite; }
@keyframes loadgrow { to { transform: scaleX(.88); } }
@keyframes loadpulse { 0%, 100% { opacity: 1; } 50% { opacity: .55; } }

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink);
  font-family: var(--sans); font-size: 15px; line-height: 1.5; }
a { color: var(--bronze); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* --- the shell: sidebar + main ------------------------------------------- */
.shell { display: grid; grid-template-columns: 218px 1fr; min-height: 100vh; }

.side { display: flex; flex-direction: column; padding: 22px 14px 18px;
  border-right: 1px solid var(--line); position: sticky; top: 0;
  height: 100vh; }
.wordmark { font-size: 19px; padding: 0 10px; }
.wordmark .tw { font-family: var(--human); font-style: italic; font-weight: 500;
  color: var(--muted); margin-right: 2px; }
.wordmark .dw { font-weight: 700; letter-spacing: -0.02em; color: var(--ink); }
.wordmark .mark { display: inline-block; width: .16em; height: .16em;
  background: var(--bronze); margin-left: 4px; border-radius: 2px; }

.sidenav { display: flex; flex-direction: column; gap: 2px; margin-top: 26px; }
.sidenav a { display: flex; align-items: center; gap: 10px;
  font-size: 13.5px; font-weight: 600; color: var(--muted);
  padding: 8px 10px; border-radius: 10px; }
.sidenav a:hover { color: var(--ink); background: rgba(29,27,23,.03);
  text-decoration: none; }
.sidenav a.on { color: var(--ink); background: var(--card); box-shadow: var(--shadow-sm); }
.sidenav a.on .ic { color: var(--bronze); }
.sidenav .ic { display: inline-flex; width: 16px; color: var(--faint); }
.sidenav .ic svg { width: 16px; height: 16px; }
.sidenav .navn { margin-left: auto; font-size: 11.5px; font-weight: 650;
  color: var(--bronze); font-variant-numeric: tabular-nums; }
.sidefoot { margin-top: auto; font-size: 12px; color: var(--faint); padding: 0 10px; }

/* Collapsed shell: the sidebar becomes a slim top bar. Must sit AFTER the
   base .side/.sidenav rules — same specificity, later wins. */
@media (max-width: 860px) {
  /* minmax(0, 1fr), never bare 1fr: a bare 1fr column is min-content sized, and the
     nav strip's unwrapped row (seven links since the Coach group, 2026-09-16) pushed the
     whole page to 591px on a 375px phone (found 2026-09-21; overflow-x: hidden had masked it). */
  .shell { grid-template-columns: minmax(0, 1fr); }
  .side { position: static; height: auto; flex-direction: row; align-items: center; min-width: 0;
    flex-wrap: wrap; gap: 4px 8px; padding: 10px 16px;
    border-right: 0; border-bottom: 1px solid var(--line); }
  .sidenav { flex-direction: row; flex-wrap: wrap; margin: 0 0 0 10px; gap: 0; }
  .sidenav a { padding: 6px 9px; }
  .sidenav .navn { margin-left: 5px; }
  .sidefoot { margin-left: auto; margin-top: 0; }
  .main { padding: 0 18px 60px; }
}

.main { min-width: 0; padding: 0 30px 70px; }
.topbar { display: flex; align-items: center; gap: 18px;
  padding: 16px 0 4px; }
.gsearch input { width: 320px; max-width: 60vw; font: inherit; font-size: 13.5px;
  padding: 9px 15px 9px 36px; border: 1px solid var(--line); border-radius: 999px;
  color: var(--ink);
  background: var(--card)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 15 15' fill='none'%3E%3Ccircle cx='6.5' cy='6.5' r='4.75' stroke='%23A6A29B' stroke-width='1.5'/%3E%3Cpath d='M10.5 10.5L13.5 13.5' stroke='%23A6A29B' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E")
    no-repeat 13px center / 15px;
  box-shadow: 0 1px 2px rgba(29, 27, 23, 0.05); }
.gsearch input:focus-visible { outline: none; border-color: var(--bronze);
  box-shadow: 0 0 0 3px rgba(201, 172, 127, 0.35); }
.topmeta { margin-left: auto; font-size: 12px; color: var(--faint); }

/* --- page head ------------------------------------------------------------ */
.pagehead { display: flex; align-items: flex-end; justify-content: space-between;
  flex-wrap: wrap; gap: 10px 30px; margin: 18px 0 6px; }
h1 { font-size: 24px; font-weight: 650; letter-spacing: -0.02em; margin: 0 0 2px; }
.sub { color: var(--muted); font-size: 13.5px; margin: 0; max-width: 560px; }
.counts { display: flex; gap: 26px; }
.bigkpi { text-align: right; }
.bigkpi .knum { display: block; font-size: 24px; font-weight: 650;
  letter-spacing: -0.02em; font-variant-numeric: tabular-nums; line-height: 1.1; }
.bigkpi .klbl { font-size: 11.5px; color: var(--muted); }

.section-h { font-family: var(--mono); font-size: 11px; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase; color: var(--muted);
  margin: 30px 0 3px; }
.section-h .n { color: var(--bronze); }
.section-h.urgent, .section-h.urgent .n { color: var(--rust); }
.section-sub { font-size: 13px; color: var(--faint); margin: 0 0 12px; }

/* --- tables (the HubSpot bones, the Oura skin) ---------------------------- */
.tablewrap { background: var(--card); border-radius: 14px; box-shadow: var(--shadow-sm);
  margin: 0 0 10px; overflow-x: auto; }
.tbl { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.tbl th { text-align: left; font-size: 11px; font-weight: 650; letter-spacing: .06em;
  text-transform: uppercase; color: var(--faint); padding: 11px 16px 9px;
  border-bottom: 1px solid var(--line); white-space: nowrap; }
.tbl td { padding: 10px 16px; border-bottom: 1px solid var(--line);
  vertical-align: middle; }
.tbl tbody tr:last-child td { border-bottom: 0; }
.tbl tbody tr:hover { background: rgba(29,27,23,.015); }
.tbl .r { text-align: right; }
.c-who { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.c-who .nm { font-weight: 650; letter-spacing: -0.01em; }
.c-club { color: var(--muted); white-space: nowrap; }
.c-why { color: var(--muted); }
.c-days { color: var(--faint); font-variant-numeric: tabular-nums; white-space: nowrap; }
/* Habit projection tones: quiet facts, one accent for forming, rust for not. */
td.tone-good { color: var(--bronze); font-weight: 600; white-space: nowrap; }
td.tone-urgent { color: var(--rust); white-space: nowrap; }
td.tone-faint { color: var(--faint); white-space: nowrap; }
td.tone-none, td.tone- { white-space: nowrap; }
.more { display: block; padding: 10px 16px 12px; font-size: 13px; font-weight: 600; }
.empty { background: var(--card); border-radius: 14px; box-shadow: var(--shadow-sm);
  padding: 14px 18px; margin: 0 0 10px; font-size: 13px; color: var(--faint); }

.avatar { flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%;
  background: var(--track); color: var(--muted); font-size: 11.5px; font-weight: 650;
  display: inline-flex; align-items: center; justify-content: center; }
.avatar.sm { flex-basis: 26px; width: 26px; height: 26px; font-size: 10.5px; }

/* Calm state chips — facts, never alarm walls. */
.chip { display: inline-block; font-size: 11px; font-weight: 600;
  padding: 2px 9px; border-radius: 999px; background: var(--track);
  color: var(--muted); white-space: nowrap; }
.chip.warm { background: rgba(201, 172, 127, .22); color: var(--bronze); }
.chip.urgent { background: rgba(163, 68, 51, .12); color: var(--rust); }

/* --- kanban --------------------------------------------------------------- */
.kanban { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(240px, 1fr);
  gap: 14px; margin: 18px 0 0; overflow-x: auto; padding-bottom: 20px;
  align-items: start; }
.kcol { background: rgba(29,27,23,.022); border-radius: 16px; padding: 12px 10px 10px; }
.khead { display: flex; align-items: baseline; gap: 8px; padding: 0 8px; }
.kname { font-size: 13px; font-weight: 650; letter-spacing: -0.01em; }
.kcol.urgent .kname { color: var(--rust); }
.kn { font-size: 12px; font-weight: 650; color: var(--bronze);
  font-variant-numeric: tabular-nums; }
.kcol.urgent .kn { color: var(--rust); }
.ksub { font-size: 11.5px; color: var(--faint); padding: 2px 8px 0; }
.kcards { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.kcard { background: var(--card); border-radius: 12px; padding: 11px 13px 9px;
  box-shadow: var(--shadow-sm); }
.kwho { display: flex; align-items: center; gap: 8px; }
.knm { font-size: 13.5px; font-weight: 650; letter-spacing: -0.01em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kmeta { font-size: 11.5px; color: var(--faint); margin-top: 3px; }
.kwhy { font-size: 12.5px; color: var(--muted); margin-top: 3px; }
.kfoot { display: flex; align-items: center; justify-content: space-between;
  margin-top: 8px; }
.kdays { font-size: 11.5px; color: var(--faint); font-variant-numeric: tabular-nums; }
.kmore { font-size: 12px; font-weight: 600; color: var(--muted);
  padding: 6px 8px 2px; }
.kempty { font-size: 12px; color: var(--faint); padding: 8px; }

/* --- the stage board ------------------------------------------------------ */
.phase { margin-bottom: 4px; }
.stages { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 900px) { .stages { grid-template-columns: 1fr; } }
.stage { display: block; color: inherit; background: var(--card);
  border-radius: 16px; padding: 15px 18px 13px; box-shadow: var(--shadow-sm);
  transition: transform .12s ease, box-shadow .12s ease; }
.stage:hover { text-decoration: none; transform: translateY(-1px);
  box-shadow: var(--shadow); }
.stage .code { font-family: var(--mono); font-size: 10.5px; letter-spacing: .08em;
  color: var(--faint); }
.stage .name { font-size: 15.5px; font-weight: 650; letter-spacing: -0.01em; margin: 1px 0 2px; }
.stage .tagline { font-size: 12px; color: var(--muted); line-height: 1.4; min-height: 34px; }
.stage .nums { display: flex; gap: 20px; align-items: baseline; margin-top: 10px; }
.stage .num { font-size: 24px; font-weight: 650; letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums; line-height: 1; }
.stage .num.stuck { color: var(--bronze); }
.stage .lbl { display: block; font-size: 11px; color: var(--faint); margin-top: 3px; }
.stage .nodata .num { color: var(--faint); font-weight: 500; }
.stage.err .tagline { color: var(--rust); }

a.plain { color: inherit; }
.inlineform { display: inline; }

/* Inline log composer: Vantage's [Log outreach] pattern — a details fold
   that opens the composer in place, so recording a call never leaves the
   queue. */
details.log { display: inline-block; }
details.log summary { list-style: none; cursor: pointer; }
details.log summary::-webkit-details-marker { display: none; }
details.log[open] summary { opacity: .55; }
.chipbtn.ghost { background: transparent; border-color: var(--line); color: var(--muted); }
.chipbtn.ghost:hover { border-color: var(--bronze-soft); color: var(--bronze);
  background: rgba(201, 172, 127, .1); }
.logform { position: relative; z-index: 5; margin-top: 8px; text-align: left;
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: var(--shadow); padding: 12px 14px; width: 300px; max-width: 78vw;
  display: flex; flex-direction: column; gap: 9px; }
.logform textarea { font: inherit; font-size: 13px; border: 1px solid var(--line);
  border-radius: 9px; padding: 8px 10px; resize: vertical; background: var(--paper); }
.logform textarea:focus-visible { outline: none; border-color: var(--bronze);
  box-shadow: 0 0 0 3px rgba(201, 172, 127, 0.35); }
.logform .radios { flex-wrap: wrap; gap: 8px 12px; font-size: 12.5px; }
.logform .radios.sub { border-top: 1px solid var(--line); padding-top: 8px; color: var(--faint); }
.logform .datein { font: inherit; font-size: 12px; border: 1px solid var(--line); border-radius: 8px;
  padding: 3px 7px; background: var(--paper); color: var(--ink); }
td.c-act { white-space: nowrap; }
td.c-act .logform { white-space: normal; }
.chipbtn { font: inherit; font-size: 11px; font-weight: 600; cursor: pointer;
  padding: 3px 10px; border-radius: 999px; border: 1px solid var(--bronze-soft);
  background: rgba(201, 172, 127, .14); color: var(--bronze);
  white-space: nowrap; transition: background .12s ease; }
.chipbtn:hover { background: rgba(201, 172, 127, .3); }

/* --- member record -------------------------------------------------------- */
.mhead { display: flex; align-items: center; gap: 16px; margin: 22px 0 8px; }
.avatar.lg { flex-basis: 52px; width: 52px; height: 52px; font-size: 18px; }
.mhead h1 { margin: 0; }
.mmeta { display: flex; align-items: center; gap: 8px; margin-top: 5px; flex-wrap: wrap; }
.mplan { font-size: 12.5px; color: var(--muted); }
.mgrid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, 1fr);
  gap: 0 34px; align-items: start; }
/* Desktop: timeline top-left, forms span the right, Vantage under the
   timeline. Mobile: one column, source order — Vantage last. */
.mtimeline { grid-column: 1; grid-row: 1; }
.mside { grid-column: 2; grid-row: 1 / span 2; }
.mvantage { grid-column: 1; grid-row: 2; }
@media (max-width: 900px) { .mgrid { grid-template-columns: 1fr; }
  .mtimeline, .mside, .mvantage { grid-column: auto; grid-row: auto; } }

.tl { border-left: 2px solid var(--line); margin: 4px 0 0 7px; padding: 2px 0 8px; }
.tle { position: relative; padding: 0 0 18px 22px; }
.tle::before { content: ""; position: absolute; left: -5px; top: 6px;
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--faint); }
.tle.desk::before { background: var(--bronze); }
/* Vantage entries: the sister product's voice — a hollow bronze ring, so a
   coach can tell Desk's own log from what the advisor did in Vantage. */
.tle.vantage::before { background: var(--card); border: 2px solid var(--bronze);
  width: 6px; height: 6px; left: -6px; top: 5px; }
.tle.vantage .tll::after { content: ""; }
.chip.vantage { background: transparent; border: 1px solid var(--bronze-soft); color: var(--bronze); }
/* The Vantage block card: live, or a quiet blank promise at clubs not yet on Vantage. */
.vblock { background: var(--card); border-radius: 14px; box-shadow: var(--shadow-sm);
  padding: 4px 18px 12px; margin: 10px 0 6px; }
.vblock.blank { background: transparent; box-shadow: none;
  border: 1px dashed var(--line); }
.vblock.blank .section-h { color: var(--faint); }
.tld { font-family: var(--mono); font-size: 10.5px; letter-spacing: .06em;
  color: var(--faint); text-transform: uppercase; }
.tlh { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-top: 2px; }
.tll { font-size: 13.5px; font-weight: 650; letter-spacing: -0.01em; }
.tlwho { font-size: 11.5px; color: var(--faint); }
.tllink { font-size: 12px; font-weight: 600; }
.tlt { font-size: 13px; color: var(--muted); margin-top: 3px; max-width: 520px; }
/* What a person wrote: sans ink, upright (the italic-for-humans rule was retired 2026-09-15). */
.tlt.human { font-size: 13.5px; color: var(--ink); line-height: 1.45; }

.panel { background: var(--card); border-radius: 14px; box-shadow: var(--shadow-sm);
  padding: 14px 16px; margin: 0 0 10px; display: flex; flex-direction: column; gap: 10px; }
.panel textarea { font: inherit; font-size: 13.5px; border: 1px solid var(--line);
  border-radius: 10px; padding: 9px 12px; resize: vertical; background: var(--paper); }
.panel textarea:focus-visible { outline: none; border-color: var(--bronze);
  box-shadow: 0 0 0 3px rgba(201, 172, 127, 0.35); }
.radios { display: flex; gap: 14px; font-size: 13px; color: var(--muted); }
.radios label { display: flex; align-items: center; gap: 5px; cursor: pointer; }
.radios input { accent-color: var(--bronze); }
.btn.sm { font-size: 13px; padding: 8px 18px; align-self: flex-start; }

/* Segmented toggle: quiet pills, ink when on (the filter idiom). */
.seg { display: inline-flex; gap: 4px; background: var(--track); border-radius: 999px;
  padding: 3px; align-self: center; }
.seg a { font-size: 12.5px; font-weight: 600; color: var(--muted); padding: 6px 13px;
  border-radius: 999px; white-space: nowrap; }
.seg a:hover { text-decoration: none; color: var(--ink); }
.seg a.on { background: var(--card); color: var(--ink); box-shadow: var(--shadow-sm); }
.seg .n { color: var(--bronze); font-variant-numeric: tabular-nums; margin-left: 3px; }

/* --- nurture-to-show sequence pips ---------------------------------------- */
.seq { display: inline-flex; gap: 4px; align-items: center; }
.sp { display: inline-block; width: 9px; height: 9px; border-radius: 50%;
  background: var(--track); box-sizing: border-box; }
.sp.done { background: var(--ink); }
.sp.due { background: var(--bronze); box-shadow: 0 0 0 2px rgba(154, 113, 66, .18); }
.sp.missed { background: transparent; border: 1.5px solid var(--rust); }
.sp.na { background: transparent; border: 1px dashed var(--line); }
td.c-seq { white-space: nowrap; }

/* The huddle's show block: confirmed / booked by horizon. */
.outlook { display: flex; gap: 26px; flex-wrap: wrap; margin: 16px 0 4px; }
.ol .oln { display: block; font-size: 22px; font-weight: 650; letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums; line-height: 1.1; }
.ol .of { color: var(--faint); font-weight: 500; font-size: 16px; }
.ol .oll { font-size: 11.5px; color: var(--muted); }
.tbl tr.rollup td { font-weight: 650; background: rgba(29,27,23,.02); }
:root[data-theme="dark"] .tbl tr.rollup td { background: rgba(255,255,255,.025); }

/* --- the cadence strip (Desk's own mark) --------------------------------- */
.cad { display: flex; align-items: flex-end; gap: 5px; }
.cad .wk { display: flex; flex-direction: column; align-items: center; gap: 2px;
  min-width: 10px; }
.cad .p { display: block; width: 10px; height: 10px; border-radius: 3px;
  background: var(--track); box-sizing: border-box; }
.cad .p.done { background: var(--ink); }
.cad .p.miss { background: var(--track); }
.cad .p.ns { background: transparent; border: 1.5px solid var(--rust); }
.cad .p.pend { background: transparent; border: 1.5px dashed var(--faint); }
.cad .p.over { background: var(--bronze); }
.cad .line { display: block; width: 14px; height: 1px; background: var(--bronze-soft);
  margin: 1px 0; }
.cad .ov { font-family: var(--mono); font-size: 9.5px; color: var(--bronze);
  line-height: 1; margin-bottom: 1px; }
.cad .wl { font-family: var(--mono); font-size: 9.5px; color: var(--faint);
  margin-top: 3px; }
.cad .wk.now .p.miss { background: transparent; border: 1.5px dashed var(--line); }
/* Paused weeks (frozen / suspended / not a member): one faint hatched band
   the height of the plan — a period when the game wasn't on, never a miss.
   Consecutive paused weeks read as a single span. */
.cad { --pip: 10px; --gap: 2px; }
.cad.compact { --pip: 8px; --gap: 1.5px; }
.cad .band { display: block; width: var(--pip); border-radius: 3px;
  height: calc(var(--pip) * var(--n) + var(--gap) * (var(--n) - 1));
  background: repeating-linear-gradient(135deg, var(--track) 0 2px, rgba(166, 162, 155, .45) 2px 3px); }
.cad .wk.paused { gap: 0; }
.cad .wk.paused + .wk.paused .band { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.cad .wk.paused:has(+ .wk.paused) .band { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.cadkey .p.x { background: repeating-linear-gradient(135deg, var(--track) 0 2px, rgba(166, 162, 155, .45) 2px 3px); }
.cad.compact { gap: 3px; }
.cad.compact .p { width: 8px; height: 8px; border-radius: 2px; }
.cad.compact .wk { min-width: 8px; gap: 1.5px; }
.cad.compact .line { width: 11px; }
td.c-cad { white-space: nowrap; }
td.c-status .stxt { margin-left: 6px; }
/* Club habits: the detective's card — when they come, what they take. */
.habits { background: var(--card); border-radius: 14px; box-shadow: var(--shadow-sm);
  padding: 4px 18px 14px; margin: 14px 0 6px; }
.habits .section-h { margin-top: 10px; }
.hrow { display: flex; gap: 28px; flex-wrap: wrap; margin-top: 6px; }
.hstat .hn { display: block; font-size: 17px; font-weight: 650; letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums; line-height: 1.2; }
.hstat .hl { font-size: 11.5px; color: var(--muted); }
.hclasses { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; }

.mcad { background: var(--card); border-radius: 14px; box-shadow: var(--shadow-sm);
  padding: 4px 18px 14px; margin: 14px 0 6px; overflow-x: auto; }
.mcad .section-h { margin-top: 10px; }
.cadkey { display: flex; align-items: center; gap: 6px 10px; flex-wrap: wrap;
  font-size: 11.5px; color: var(--faint); margin-top: 12px; }
.cadkey .p { display: inline-block; width: 9px; height: 9px; border-radius: 2px;
  background: var(--track); box-sizing: border-box; }
.cadkey .p.done { background: var(--ink); }
.cadkey .p.ns { background: transparent; border: 1.5px solid var(--rust); }
.cadkey .p.pend { background: transparent; border: 1.5px dashed var(--faint); }
.cadkey .p.over { background: var(--bronze); }

/* Login card */
.login { max-width: 420px; margin: 12vh auto 0; background: var(--card);
  border-radius: 22px; padding: 40px 42px 36px; box-shadow: var(--shadow); text-align: center; }
.login p { color: var(--muted); font-size: 14px; }
.login .loginline { font-family: var(--human); font-style: italic; font-size: 19px;
  color: var(--ink); margin: 6px 0 2px; }
.login .denied { color: var(--rust); font-size: 13px; }
.btn { display: inline-block; background: var(--ink); color: var(--card);
  font-weight: 600; font-size: 14.5px; padding: 12px 26px; border-radius: 999px;
  border: 0; cursor: pointer; }
.btn:hover { text-decoration: none; opacity: .92; }

.foot { margin-top: 42px; font-size: 12px; color: var(--faint); }
.foot .gloss { font-family: var(--human); font-style: italic; }

/* --- phones (Carrie 2026-09-16: everything in Desk mobile friendly) --------
   The page body never scrolls sideways. Wide things scroll inside their own box. */
.tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tbl { min-width: 560px; }
.kanban, .cad, .toggle { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 600px) {
  html, body { overflow-x: hidden; }
  .main { padding: 0 14px 56px; overflow-x: clip; }
  .side { padding: 8px 12px; gap: 2px 6px; }
  .sidenav { margin-left: 4px; }
  .sidenav a { padding: 6px 7px; }
  .sidefoot { flex-basis: 100%; margin-left: 0; margin-top: 2px; font-size: 12px;
    display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
  .sidefoot .themepick { margin: 0; }
  .topbar { flex-wrap: wrap; gap: 8px 12px; padding-top: 12px; }
  .gsearch { flex: 1 1 100%; }
  .gsearch input { width: 100%; max-width: none; }
  .topmeta { margin-left: 0; }
  .pagehead { align-items: flex-start; gap: 8px 16px; }
  .counts { flex-wrap: wrap; gap: 8px 18px; }
  .bigkpi { text-align: left; }
  .bigkpi .knum { font-size: 21px; }
  h1 { font-size: 22px; }
  .stage .nums { gap: 16px; }
  .outlook { gap: 12px 18px; }
  .mhead { align-items: flex-start; gap: 12px; }
  .mmeta { gap: 6px; }
  .hrow { gap: 14px 20px; }
  .cad { padding-bottom: 4px; }
  .toggle { white-space: nowrap; }
  .tl { padding-left: 0; }
  .panel textarea { width: 100%; }
}

/* Source-system profile link after a name (Zenoti tenants only) */
.zl { display: inline-block; margin-left: 6px; font-size: 11px; color: var(--faint);
  text-decoration: none; opacity: .7; vertical-align: 1px; }
.zl:hover { color: var(--bronze); opacity: 1; text-decoration: none; }
h1 .zl { font-size: 14px; vertical-align: 6px; }
.zlink { font-size: 12px; color: var(--bronze); margin-left: 6px; white-space: nowrap; }


/* --- the Oura register, coach surfaces (Carrie 2026-09-15/16) ----------------
   Cards carry a tint, not a border or a shadow; one state word in color;
   big light numbers; the readout sentence in an upright serif. */
body { background: var(--paper); }
.shell { background: var(--ground); min-height: 100vh; }
.navgroup { font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--faint); margin: 14px 10px 4px; }
.navgroup:first-child { margin-top: 4px; }
.e-head { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap;
  gap: 10px 30px; margin: 22px 0 6px; }
.e-head h1 { font-size: 26px; font-weight: 600; letter-spacing: -.02em; margin: 0; }
.bigkpi .knum small { font-size: 15px; color: var(--faint); letter-spacing: 0; font-weight: 500; }
.coachpick { margin: 4px 0 0; font-size: 12.5px; color: var(--faint); }
.coachpick select { font-size: 12.5px; margin-left: 6px; }
.coachpick label { margin-right: 10px; white-space: nowrap; }
.e-tabs { display: flex; gap: 2px; margin: 18px 0 10px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.e-tabs a { font-size: 13px; font-weight: 600; color: var(--faint); padding: 8px 12px 10px;
  border-bottom: 2px solid transparent; margin-bottom: -1px; text-decoration: none; }
.e-tabs a.on { color: var(--ink); border-bottom-color: var(--bronze); }
.e-tabs a .n { color: var(--faint); font-weight: 500; margin-left: 5px; }
.e-tabs .lsearch { margin-left: auto; align-self: center; font: inherit; font-size: 12.5px; color: var(--ink);
  padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line); background: var(--card);
  width: 200px; margin-bottom: 6px; }
.stack { display: flex; flex-wrap: wrap; gap: 4px 6px; }
.chip.good { background: rgba(31, 138, 115, .12); color: var(--good); }
.chip.info { background: rgba(63, 111, 168, .12); color: var(--steel); }
.chip.warn { background: rgba(183, 103, 79, .14); color: var(--warn); }
:root[data-theme="dark"] .chip.good { background: rgba(92, 200, 168, .14); }
:root[data-theme="dark"] .chip.info { background: rgba(127, 168, 214, .16); }
:root[data-theme="dark"] .chip.warn { background: rgba(212, 147, 125, .18); }
:root[data-theme="dark"] .chip.urgent { background: rgba(207, 90, 75, .18); }
.c-next { white-space: nowrap; }
.c-next.none { color: var(--warn); }
.e-state { font-size: 11.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.e-state.care, .e-state.warn { color: var(--warn); } .e-state.good { color: var(--good); }
.e-state.info { color: var(--steel); } .e-state.urgent { color: var(--rust); }
.e-readout { margin: 26px 0 6px; max-width: 820px; }
.e-readout h2 { font-family: var(--human); font-style: normal; font-weight: 400; font-size: 34px;
  line-height: 1.14; letter-spacing: -.012em; margin: 8px 0 10px; color: var(--ink); }
.e-readout p { font-size: 14.5px; line-height: 1.55; color: var(--muted); margin: 0; max-width: 640px; }
.e-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.e-card { position: relative; border-radius: 20px; padding: 18px 20px; background: var(--card); overflow: hidden; }
.e-card::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(160deg, var(--wash, transparent) 0%, transparent 62%); }
.e-card > * { position: relative; }
.e-card.care { --wash: rgba(183, 103, 79, .14); } .e-card.good { --wash: rgba(31, 138, 115, .13); }
.e-card.info { --wash: rgba(63, 111, 168, .13); } .e-card.urgent { --wash: rgba(163, 68, 51, .12); }
:root[data-theme="dark"] .e-card { background: rgba(255, 255, 255, .045); }
:root[data-theme="dark"] .e-card.care { --wash: rgba(212, 147, 125, .20); }
:root[data-theme="dark"] .e-card.good { --wash: rgba(92, 200, 168, .17); }
:root[data-theme="dark"] .e-card.info { --wash: rgba(127, 168, 214, .17); }
:root[data-theme="dark"] .e-card.urgent { --wash: rgba(207, 90, 75, .18); }
.e-lbl { display: flex; justify-content: space-between; align-items: baseline; font-size: 14px; font-weight: 600; }
.e-lbl .arr { color: var(--faint); font-weight: 400; font-size: 12.5px; }
.e-card .e-state { display: block; margin-top: 3px; }
.e-num { font-size: 48px; font-weight: 400; letter-spacing: -.035em; line-height: 1; margin-top: 20px; font-variant-numeric: tabular-nums; }
.e-num small { font-size: 13.5px; color: var(--muted); letter-spacing: 0; margin-left: 8px; font-weight: 500; }
.e-note { font-size: 13px; line-height: 1.5; color: var(--muted); margin-top: 10px; }
.e-note b { color: var(--ink); font-weight: 600; }
.e-rows { margin-top: 8px; }
.e-row { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 10px 0;
  border-top: 1px solid var(--line); font-size: 13.5px; color: var(--ink); }
.e-row:first-child { border-top: 0; padding-top: 6px; }
.e-row .r { color: var(--faint); font-size: 11.5px; white-space: nowrap; }
@media (max-width: 900px) { .e-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .e-grid { grid-template-columns: 1fr; } .e-readout h2 { font-size: 26px; }
  .e-tabs .lsearch { margin-left: 0; width: 100%; } }

/* --- Today, the daily planner (direction D) ----------------------------------- */
.plan { display: grid; grid-template-columns: 1fr 340px; gap: 18px; align-items: start; margin-top: 14px; }
.slot { display: grid; grid-template-columns: 86px 1fr; gap: 0 14px; margin-top: 10px; }
.slot .t { padding-top: 14px; font-size: 14px; font-weight: 600; color: var(--ink); }
.slot .t small { display: block; font-size: 11px; font-weight: 500; color: var(--faint); margin-top: 2px; }
.slot.done .t { color: var(--muted); }
.slot .box { border-radius: 18px; background: var(--card); overflow: hidden; }
:root[data-theme="dark"] .slot .box { background: rgba(255, 255, 255, .045); }
.slot.done .box { opacity: .72; }
.pr { display: grid; grid-template-columns: 1fr 150px; align-items: center; gap: 12px;
  padding: 10px 16px 10px 14px; border-top: 1px solid var(--line); border-left: 3px solid transparent; }
.pr:first-child { border-top: 0; }
.pr .nm { display: flex; align-items: center; gap: 10px; color: var(--ink); font-size: 13.5px; flex-wrap: wrap; }
.pr .nm a { color: inherit; }
.pr .tg { font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; margin-left: 4px; }
.pr .nx { text-align: right; font-size: 12.5px; color: var(--good); white-space: nowrap; }
.pr .sub { grid-column: 1 / -1; font-size: 12.5px; color: var(--muted); line-height: 1.5; margin: -2px 0 2px 40px; }
.pr .sub b { color: var(--ink); font-weight: 600; }
.pr.assess { background: linear-gradient(90deg, rgba(63,111,168,.16), rgba(63,111,168,.03) 55%, transparent); border-left-color: var(--steel); }
.pr.assess .tg { color: var(--steel); }
.pr.newc { background: linear-gradient(90deg, rgba(154,113,66,.16), rgba(154,113,66,.03) 55%, transparent); border-left-color: var(--bronze); }
.pr.newc .tg { color: var(--bronze); }
.pr.injury { background: linear-gradient(90deg, rgba(163,68,51,.12), transparent 55%); border-left-color: var(--rust); }
.pr.injury .tg { color: var(--rust); }
.pr.bday, .pr.anniv { background: linear-gradient(90deg, rgba(31,138,115,.12), transparent 55%); border-left-color: var(--good); }
.pr.bday .tg, .pr.anniv .tg { color: var(--good); }
:root[data-theme="dark"] .pr.assess { background: linear-gradient(90deg, rgba(127,168,214,.22), rgba(127,168,214,.04) 55%, transparent); }
:root[data-theme="dark"] .pr.newc { background: linear-gradient(90deg, rgba(203,165,123,.20), rgba(203,165,123,.03) 55%, transparent); }
:root[data-theme="dark"] .pr.injury { background: linear-gradient(90deg, rgba(207,90,75,.14), transparent 55%); }
:root[data-theme="dark"] .pr.bday, :root[data-theme="dark"] .pr.anniv { background: linear-gradient(90deg, rgba(92,200,168,.13), transparent 55%); }
.side2 .e-card { margin-bottom: 12px; }
.side2 .e-row { display: block; padding: 9px 0; }
.side2 .e-row .w { color: var(--ink); font-weight: 600; font-size: 13px; }
.side2 .e-row .w a { color: inherit; }
.side2 .e-row .x { font-size: 12.5px; color: var(--muted); margin-top: 2px; line-height: 1.45; }
.side2 .e-row .m { font-size: 11px; color: var(--faint); margin-top: 3px; display: flex; align-items: center; gap: 6px; }
.stats { margin-top: 8px; }
.stat { display: flex; justify-content: space-between; padding: 8px 0; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); }
.stat:first-child { border-top: 0; }
.stat b { color: var(--ink); font-weight: 600; } .stat b.w { color: var(--warn); }
@media (max-width: 900px) {
  .plan { grid-template-columns: 1fr; gap: 10px; } .plan > .side2 { order: -1; }
  .slot { grid-template-columns: 1fr; gap: 4px; } .slot .t { padding-top: 10px; } .slot .t small { display: inline; margin-left: 8px; }
  .pr { grid-template-columns: 1fr 110px; padding: 10px 12px 10px 10px; } .pr .sub { margin-left: 0; }
}

/* --- Progress ------------------------------------------------------------------- */
.e-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ucols { display: grid; grid-template-columns: 1.1fr 1fr; gap: 26px; align-items: start; margin-top: 4px; }
.e-range { position: relative; height: 2px; background: var(--track); border-radius: 2px; margin: 24px 0 8px; }
.e-range .seg { position: absolute; top: 0; height: 2px; background: var(--ink); border-radius: 2px; }
.e-range .dot { position: absolute; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: var(--ink);
  transform: translateX(-50%); box-shadow: 0 0 0 3px var(--card); }
.e-range .est { position: absolute; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: transparent;
  border: 1.5px solid var(--ink); transform: translateX(-50%); }
.e-rl { display: flex; justify-content: space-between; font-size: 11px; color: var(--faint); }
.uhist { display: block; width: 100%; height: 86px; margin-top: 10px; }
.uhist rect { fill: var(--track); } .uhist rect.cur { fill: var(--bronze); }
.uhist text { font-family: var(--sans); font-size: 9.5px; fill: var(--muted); } .uhist text.l { fill: var(--faint); font-size: 9px; }
.uhist line.base { stroke: var(--line); }
@media (max-width: 900px) { .e-grid.three { grid-template-columns: 1fr; } .ucols { grid-template-columns: 1fr; } .e-card[style*="span 2"] { grid-column: span 1 !important; } }

/* --- the log form ------------------------------------------------------------- */
.logbox { margin-top: 14px; border-radius: 20px; background: var(--card); padding: 16px 20px; position: relative; overflow: hidden; }
:root[data-theme="dark"] .logbox { background: rgba(255, 255, 255, .045); }
.logbox textarea { width: 100%; box-sizing: border-box; margin-top: 10px; border-radius: 12px; border: 1px solid var(--line);
  background: var(--paper); padding: 12px 14px; font: inherit; font-size: 14px; color: var(--ink); resize: vertical; }
.kinds { display: flex; align-items: center; gap: 6px; margin-top: 12px; flex-wrap: wrap; }
.kinds label.k { font-size: 12.5px; font-weight: 600; color: var(--muted); padding: 6px 12px; border-radius: 999px;
  background: var(--track); cursor: pointer; }
.kinds label.k input { display: none; }
.kinds label.k.on { background: var(--ink); color: var(--paper); }
.kinds .when { margin-left: 10px; display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); }
.kinds .when .datein { font: inherit; font-size: 12.5px; color: var(--ink); background: var(--paper);
  border: 1px solid var(--line); border-radius: 999px; padding: 4px 10px; }
.kinds .when select { font-size: 12.5px; background-color: var(--paper); }
.kinds .save { margin-left: auto; }

/* --- the Index card on the member file ------------------------------------------ */
.e-num small.actual { color: var(--faint); margin-left: 10px; padding-left: 10px; border-left: 1px solid var(--line); }
.e-spark { display: block; width: 100%; height: 44px; margin: 14px 0 6px; overflow: visible; }
.e-spark polyline { fill: none; stroke: var(--ink); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.e-spark polyline.ghost { stroke: var(--faint); stroke-dasharray: 3 4; }
.e-spark circle { fill: var(--ink); }
.e-spark circle.first { fill: transparent; stroke: var(--ink); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.mtop { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 18px; }
@media (max-width: 700px) { .mtop { grid-template-columns: 1fr; } }
@media (max-width: 700px) {
  .navgroup { display: none; }
  .ucols { grid-template-columns: 1fr; }
  .e-row { flex-wrap: wrap; } .e-row .r { white-space: normal; }
  .plan { grid-template-columns: 1fr; } .plan > .side2 { order: -1; }
}
.kinds .when[hidden] { display: none; }
/* The assessment intake card (2026-09-21): pills for goal and problem, the why as the
   card's one readout line, experience and timeline as rows, the form under a toggle. */
.intake { margin-top: 14px; }
.intake .ipills { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.intake .ireadout { font-family: "Source Serif 4", Georgia, serif; font-weight: 400; font-size: 17px; line-height: 1.4; color: var(--ink); margin: 10px 0 4px; }
.intake .iedit { margin-top: 10px; }
.intake .iedit summary { list-style: none; display: inline-block; cursor: pointer; }
.intake .iedit summary::-webkit-details-marker { display: none; }
.intake .ilbl { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-top: 12px; display: block; }
.intake .kinds.tight { margin-top: 6px; }
.intake .itext, .iref-form .itext { width: 100%; box-sizing: border-box; margin-top: 6px; font: inherit; font-size: 13px; color: var(--ink); background: var(--paper);
  border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; }
.intake .itext::placeholder, .iref-form .itext::placeholder { color: var(--muted); }
.intake .isplit { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.intake .kinds.rating label.k { padding: 6px 10px; min-width: 14px; text-align: center; }
.intake .e-row b.good { color: var(--good); }
.intake .e-row b.warn { color: var(--warn); }
.intake .iphoto { margin-top: 8px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.intake .iearlier { margin-top: 6px; }
.intake .iphoto [hidden] { display: none !important; }
.intake .iphoto label { cursor: pointer; }
.intake .ibusy { font-size: 12.5px; color: var(--muted); }
.intake .idraft { margin-top: 10px; font-size: 13px; line-height: 1.5; color: var(--muted); padding: 10px 12px; border-radius: 12px; background: rgba(127,168,214,.10); }
.intake .idraft.on { color: var(--ink); border-left: 3px solid var(--steel); }
.intake .isplit.first { margin-top: 12px; border-top: 0; padding-top: 0; }
.intake .inum { margin-top: 16px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--bronze); }
.intake textarea.itext { resize: vertical; line-height: 1.4; }
.intake .ibc, .intake .ipd { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: 12.5px; }
.intake .ibc th, .intake .ipd th { font-size: 10.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); text-align: left; padding: 4px 6px 4px 0; }
.intake .ibc td, .intake .ipd td { padding: 2px 4px 2px 0; }
.intake .ibc .itext.num { margin-top: 0; padding: 6px 8px; }
.intake .ipd td { text-align: center; } .intake .ipd thead th { text-align: center; }
.intake .ipd input { width: 18px; height: 18px; accent-color: var(--bronze); }
.intake .ifms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 6px; }
.intake .ifm .ifl { display: block; font-size: 12.5px; font-weight: 600; color: var(--ink); margin-bottom: 2px; }
.intake .ifm .kinds { margin-top: 2px; }
.intake .kinds label.k.mod.on { background: var(--warn); color: #fff; }
@media (max-width: 600px) { .intake .ifms { grid-template-columns: 1fr; } .intake .kinds.rating { gap: 3px; } .intake .kinds.rating label.k { padding: 5px 7px; } }
/* The member file's tabs (Carrie 2026-09-21: the intake is too much for the main window). */
.mtabs { margin-top: 16px; }
.massess { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 18px; align-items: start; }
@media (max-width: 900px) { .massess { grid-template-columns: 1fr; } }
.massess .intake { margin-top: 0; }
.tbl tr.faded td { color: var(--muted); }
.tbl tr.faded .nm { color: var(--muted); }
/* Referred to Thrive (2026-09-30): the member picker on the Assessment tab. */
.iref { margin-bottom: 14px; }
.iref .iref-who { margin-top: 8px; font-size: 14px; color: var(--ink); }
.iref .iref-rm { margin-top: 8px; }
.iref .iref-list { margin-top: 6px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.iref .iref-opt { text-align: left; font: inherit; font-size: 13px; color: var(--ink); background: var(--paper); border: 0; border-top: 1px solid var(--line); padding: 9px 12px; cursor: pointer; }
.iref .iref-opt:first-child { border-top: 0; }
.iref .iref-opt:hover { background: var(--card); }
/* The member file's seven tabs (2026-09-30). */
.mplanline { margin-top: 6px; font-size: 13px; color: var(--muted); }
.mtabs .n.urgent { color: var(--rust); }
.minfo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; margin-top: 14px; align-items: start; }
@media (max-width: 800px) { .minfo { grid-template-columns: 1fr; } }
.minj + .minj { margin-top: 12px; }
.minj-foot { margin-top: 10px; display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 12px; color: var(--muted); }
.minjpin { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; margin-top: 14px; }
.mreadout { margin: 18px 0 20px; }
.mreadout h2 { font-family: "Source Serif 4", Georgia, serif; font-weight: 400; font-size: 28px; line-height: 1.2; letter-spacing: -.01em; margin: 6px 0 6px; color: var(--ink); }
.mreadout p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--muted); max-width: 720px; }
.sub-inline { font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--faint); margin-left: 8px; }
.mdoms { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-top: 10px; }
.mdom { padding: 14px 16px; }
.mdom-v { font-size: 22px; font-weight: 400; letter-spacing: -.01em; color: var(--ink); margin: 6px 0 4px; }
.mdom-v small { display: block; font-size: 11.5px; color: var(--faint); letter-spacing: 0; }
.tbl .dgood { color: var(--good); font-size: 12px; } .tbl .dwarn { color: var(--warn); font-size: 12px; }
.mnext { margin-top: 10px; font-size: 13.5px; color: var(--muted); } .mnext b { color: var(--ink); font-weight: 600; }
.mprep > span:first-child { color: var(--ink); line-height: 1.45; } .mprep .r { color: var(--faint); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.mprep .warnt { color: var(--warn); }
/* The Pool (2026-10-01). */
.poolclub select { font-size: 13px; }
.pullbar { display: flex; align-items: center; gap: 10px; margin: 10px 0; } .pullbar .pulln { font-size: 12.5px; color: var(--muted); }
.pager { display: flex; align-items: center; gap: 12px; margin: 14px 0; font-size: 13px; color: var(--muted); }
/* One Desk, three roles (2026-10-01): the admin's view switch in the sidebar foot. */
.viewas { margin-bottom: 8px; font-size: 12px; color: var(--faint); }
.viewas select { font-size: 12px; padding-top: 3px; padding-bottom: 3px; margin-left: 4px; }
/* Flags: notes to each other (2026-10-01). */
.flagl { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-right: 4px; }
.flagrow { margin-top: 8px; }
.flagcard .e-row .x { font-size: 13px; color: var(--ink); line-height: 1.45; margin-top: 2px; }
.flagcard .e-row .m { font-size: 11.5px; color: var(--faint); margin-top: 4px; display: flex; align-items: center; gap: 8px; }
/* Demo mode (2026-10-01): an unmistakable bar, so fictional and real are never confused. */
.demobar { margin: 12px 0 0; padding: 8px 14px; border-radius: 12px; font-size: 12.5px; color: var(--ink);
  background: rgba(127,168,214,.14); border-left: 3px solid var(--steel); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.demobar b { letter-spacing: .1em; text-transform: uppercase; font-size: 11px; color: var(--steel); }

/* --- Controls: one base for every dropdown, button and field (2026-10-01 audit) -------------
   Nothing may render with the browser's default look. Wrappers above only adjust size.
   Element selectors, so any class rule still wins. */
button, input, select, textarea { font-family: inherit; }
select { -webkit-appearance: none; appearance: none; font: inherit; font-size: 13px; line-height: 1.3;
  color: var(--ink); background-color: var(--card); border: 1px solid var(--line); border-radius: 999px;
  padding: 5px 28px 5px 12px; max-width: 100%; cursor: pointer; text-overflow: ellipsis;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%238A867F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 11px center; background-size: 10px 6px; }
select:hover { border-color: var(--bronze-soft); }
input[type="date"] { -webkit-appearance: none; appearance: none; font: inherit; font-size: 13px; line-height: 1.3; color: var(--ink);
  background-color: var(--card); border: 1px solid var(--line); border-radius: 999px; padding: 5px 12px; max-width: 100%; }
input[type="date"]::-webkit-calendar-picker-indicator { opacity: .55; cursor: pointer; width: 14px; height: 14px; margin-left: 2px; }
:root[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(1); opacity: .6; }
input[type="date"]::-webkit-date-and-time-value { text-align: left; }
select:focus-visible, input[type="date"]:focus-visible, input[type="search"]:focus-visible, input[type="text"]:focus-visible {
  outline: none; border-color: var(--bronze); box-shadow: 0 0 0 3px rgba(201, 172, 127, .35); }
.seg { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.seg::-webkit-scrollbar { display: none; }
.seg a { flex: 0 0 auto; white-space: nowrap; }
/* Phones: 16px fields, so iOS does not zoom the page when one is tapped. */
@media (max-width: 600px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea { font-size: 16px !important; }
  .coachpick { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; }
  .coachpick label { margin-right: 0; }
}
.e-tabs a .tabdot { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--bronze);
  margin-left: 6px; vertical-align: middle; }
.logbox .flagrow .save { margin-left: auto; }

/* --- The Log composer is a popover (2026-10-05 audit) ---------------------------------------
   It used to open in the flow: a table row grew from 47px to 369px, the table widened and cut
   the form off, and a kanban card ballooned over the next lane. Fixed position escapes every
   scrolling box; base.html places it beside its button and closes it on a tap outside,
   Escape or Cancel. */
details.log[open] > .logform { position: fixed; z-index: 60; margin: 0; width: 300px; max-width: calc(100vw - 16px);
  max-height: calc(100vh - 16px); overflow-y: auto; white-space: normal; }
.logacts { display: flex; align-items: center; gap: 10px; }
@media (max-width: 600px) {
  /* A centered overlay over a dimmed page (Carrie 2026-10-13, "should just pop up overlay": the bottom sheet
     cut off top and bottom on her phone between the tab bar and the safe areas). */
  details.log[open]::before { content: ""; position: fixed; inset: 0; z-index: 59; background: rgba(0, 0, 0, .38); }
  details.log[open] > summary { visibility: hidden; }
  details.log.lifted::before { display: none; }
  body > .logdim { position: fixed; inset: 0; z-index: 900; background: rgba(0, 0, 0, .38); }
  body > .logform.floating { z-index: 901 !important; }     /* the opener would show through the dim beside the card */
  details.log[open] > .logform, body > .logform.floating { position: fixed; z-index: 60; margin: 0; display: flex; flex-direction: column;
    left: 50% !important; top: 50% !important; right: auto; bottom: auto !important;
    transform: translate(-50%, -50%); width: min(92vw, 420px); max-width: none;
    max-height: calc(100vh - 28px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); overflow-y: auto;
    border-radius: 18px; padding: 16px; gap: 12px; white-space: normal; }
  /* Tap targets: nothing a thumb has to hit is under about 36px. */
  .chipbtn { padding: 8px 14px; font-size: 12.5px; }
  .logform .radios { gap: 4px 14px; }
  .logform .radios label { display: inline-flex; align-items: center; gap: 7px; padding: 7px 0; font-size: 14px; }
  .logform input[type="radio"], .kinds input[type="radio"] { width: 18px; height: 18px; }
  .seg a { padding: 9px 14px; }
  .e-tabs a { padding: 11px 12px 12px; }
  .tbl .nm { display: inline-block; padding: 8px 0; }
  /* The action column stays in reach: it rides the right edge while the table scrolls. */
  .tbl td.c-act { position: sticky; right: 0; background: var(--card); box-shadow: -10px 0 12px -10px rgba(0, 0, 0, .18); }
  .logform .flagl { align-self: center; }
}
button[data-armed] { background: var(--rust, #A34433) !important; border-color: transparent !important; color: #fff !important; }
/* The quick Log's "pick one" alert (2026-10-05): a red box around the choices and a bold line. */
.logform .radios.acts.need { border: 2px solid var(--rust); border-radius: 10px; padding: 8px 10px;
  background: rgba(163, 68, 51, .09); }
.logform textarea.need { border: 2px solid var(--rust) !important; background: rgba(163, 68, 51, .06); }
.logneed { font-size: 13px; font-weight: 700; color: var(--rust); line-height: 1.35; }
.logneed[hidden] { display: none; }
/* Temporary coach coverage (2026-10-05). */
.covercard { margin: 14px 0 6px; }
.covercard .e-row { align-items: center; }
.covercard .e-row .r { display: inline-flex; align-items: center; gap: 10px; font-size: 12.5px; }
.coverform { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 14px; padding-top: 14px;
  border-top: 1px solid var(--line); font-size: 12.5px; color: var(--muted); }
.coverform label { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.coverform .datein { font: inherit; font-size: 12.5px; color: var(--ink); background: var(--card);
  border: 1px solid var(--line); border-radius: 999px; padding: 4px 10px; }
.coverline { margin: 8px 0 0; font-size: 13px; color: var(--muted); padding: 8px 12px; border-radius: 10px;
  background: rgba(127, 168, 214, .13); border-left: 3px solid var(--steel); }
.coverline b { color: var(--ink); font-weight: 600; }
@media (max-width: 600px) {
  .coverform { flex-direction: column; align-items: stretch; }
  .coverform label { justify-content: space-between; }
  .covercard .e-row { flex-direction: column; align-items: flex-start; gap: 6px; }
}

/* --- Phones, the coach's screen (Carrie 2026-10-06: "coaches especially wont use desktop") ----
   The nav becomes a tab bar at the bottom of the screen, the top shrinks to the brand, the
   roster becomes cards, the pipeline's lanes stack. Appended last so it wins. */
@media (max-width: 600px) {
  /* viewport-fit=cover (2026-10-13) draws the home-screen app under the status bar: the strip starts
     below it, like the tab bar clears the home indicator. */
  .side { padding: calc(8px + env(safe-area-inset-top, 0px)) 12px 4px; gap: 4px 10px; border-bottom: 0; }
  .wordmark { font-size: 17px; padding: 0 2px; }
  .sidefoot { flex-basis: auto; margin-left: auto; margin-top: 0; font-size: 11.5px; gap: 8px 10px; }
  .sidefoot .viewas { margin-bottom: 0; }
  /* Settings on a phone (Carrie 2026-10-13, "settings doesnt show on mobile"): a chip in the top strip, not
     11.5px faint text. The tab bar's safe-area padding only counts once the viewport meta says
     viewport-fit=cover (base.html), which is what kept the bar under the iPhone's home indicator. */
  /* The open Log sheet painted under the other rows' sticky Log cells (Carrie 2026-10-13, "underlaid below
     the log strip"): a fixed sheet stacks inside its own sticky cell, and later cells paint over it. The
     cell holding the open sheet sits above every other sticky cell. */
  td.c-act:has(details.log[open]) { z-index: 70; }
  .side { position: relative; }
  .sidefoot { margin-left: 0; }      /* the controls stay at the left edge; Settings sits on the brand line */
  /* Upper right (Carrie 2026-10-16): the chip sits inside the brand line, clear of the controls row
     below it; "Reset view" had borrowed this class and stacked on top of Settings. */
  .sidefoot { margin-top: 6px; }
  .settingslink { position: absolute; top: calc(6px + env(safe-area-inset-top, 0px)); right: 12px; display: inline-flex; align-items: center; height: 28px; padding: 0 12px;
    margin: 0; border: 1px solid var(--line); border-radius: 999px; font-size: 12.5px; font-weight: 600; color: var(--muted); background: var(--card); }
  .sidenav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 55; margin: 0;
    display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 2px;
    background: var(--card); border-top: 1px solid var(--line);
    padding: 6px 6px calc(6px + env(safe-area-inset-bottom, 0px));
    box-shadow: 0 -8px 24px rgba(0, 0, 0, .06); }
  .sidenav a { flex-direction: column; justify-content: center; gap: 4px; padding: 6px 2px 5px;
    min-height: 50px; font-size: 10.5px; font-weight: 600; letter-spacing: 0; border-radius: 12px; text-align: center; }
  .sidenav a.on { background: rgba(154, 113, 66, .10); box-shadow: none; }
  .sidenav .ic { width: auto; } .sidenav .ic svg { width: 20px; height: 20px; }
  .sidenav .navn { display: none; }
  .main { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
  .topbar { padding-top: 8px; }
  .demobar { padding: 6px 10px; font-size: 11.5px; gap: 6px 10px; }
  .demobar .demoshow { flex-basis: 100%; }
  /* The Log overlay is centered (above); nothing to lift over the tab bar any more. */

  /* Type and touch. */
  .chip { font-size: 12px; padding: 3px 9px; }
  .tbl th { font-size: 11.5px; }
  .tld { font-size: 11.5px; }
  .cad .wl { font-size: 10.5px; }
  .avatar.sm { flex-basis: 30px; width: 30px; height: 30px; font-size: 11.5px; }
  .kinds label.k, .kinds .when label.k { min-height: 40px; display: inline-flex; align-items: center; }
  .pr { min-height: 48px; }
  .knm { font-size: 14.5px; }

  /* The pipeline's lanes stack; each lane scrolls inside itself past ten cards. */
  .kanban { display: flex; flex-direction: column; align-items: stretch; gap: 14px; overflow: visible; padding-bottom: 0; }
  .kcol { width: auto; }
  .kcards { max-height: 60vh; overflow-y: auto; -webkit-overflow-scrolling: touch; padding-bottom: 2px; }

  /* The roster as cards: name and Log on the first line, the strip, the state chips, then plan,
     next session and tenure in one small line. Same rows, same order, same filter. */
  .tablewrap:has(#roster) { overflow: visible; }
  #roster { min-width: 0; display: block; }
  #roster thead { display: none; }
  #roster tbody { display: block; }
  #roster tr { display: grid; grid-template-columns: 1fr auto auto; column-gap: 10px; row-gap: 7px;
    grid-template-areas: "who who act" "coach coach coach" "strip strip strip" "chips chips chips" "plan next ten";
    padding: 12px 14px 13px; border-bottom: 1px solid var(--line); }
  /* The card's own inset (Carrie 2026-10-08, "cut off on both sides"): rows used to start at the card's edge,
     and in dark mode the card and the page are near the same color, so the content read as jammed
     against the screen. The rows sit 14px inside the card, and the card carries a faint edge. */
  .tablewrap:has(#roster) { border: 1px solid var(--line); }
  #roster tr:last-child { border-bottom: 0; }
  #roster td { display: block; padding: 0; border: 0; text-align: left; white-space: normal; }
  #roster td.r-who { grid-area: who; min-width: 0; }
  #roster td.r-who .c-who { white-space: normal; }
  #roster td.r-who .nm { font-size: 15px; padding: 0; }
  #roster td.r-coach { grid-area: coach; font-size: 12.5px; color: var(--muted); }
  #roster td.r-strip { grid-area: strip; white-space: nowrap; overflow-x: auto; }
  #roster td.r-chips { grid-area: chips; }
  #roster td.r-plan { grid-area: plan; font-size: 12.5px; color: var(--muted); }
  #roster td.r-plan:not(:empty)::before { content: "Plan "; }
  #roster td.r-next { grid-area: next; font-size: 12.5px; color: var(--muted); text-align: center; }
  #roster td.r-next:not(:empty)::before { content: "Next "; }
  #roster td.r-ten { grid-area: ten; font-size: 12.5px; color: var(--muted); text-align: right; }
  #roster td.r-act { grid-area: act; position: static; background: transparent; box-shadow: none; align-self: start; }
  #roster td.empty { grid-area: who; }
}

/* --- The Log card (2026-10-06): one card, three tabs, on lists (popover / phone sheet) and on the
   member file (inline). Chips are the .kinds label.k pills the old log box used. */
.logform.card { gap: 10px; width: 340px; }
.logform.card.inline { position: static; width: auto; max-width: none; margin-top: 14px; border-radius: 20px; padding: 16px 20px 18px;
  box-shadow: none; border: 0; background: var(--card); }
:root[data-theme="dark"] .logform.card.inline { background: rgba(255, 255, 255, .045); }
.lhead { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.lname { font-size: 15px; font-weight: 600; letter-spacing: -.01em; }
.llast { font-size: 12px; color: var(--muted); margin-top: 2px; } .llast b { color: var(--ink); font-weight: 600; }
.lphone { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border: 1px solid var(--line);
  border-radius: 999px; font-size: 12.5px; font-weight: 600; color: var(--ink); text-decoration: none; white-space: nowrap; flex: 0 0 auto; }
.lphone:hover { border-color: var(--bronze-soft); color: var(--bronze); text-decoration: none; }
.ltabs { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 3px; background: var(--track, rgba(29,27,23,.06)); border-radius: 999px; padding: 3px; }
.ltabs button { height: 34px; border: 0; border-radius: 999px; background: transparent; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--muted); cursor: pointer; }
.ltabs button.on { background: var(--card); color: var(--ink); box-shadow: var(--shadow-sm); }
.lpane { display: flex; flex-direction: column; gap: 8px; }
.lpane[hidden] { display: none; }
.llbl { font-size: 10.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.lhelp { font-size: 12px; color: var(--muted); line-height: 1.4; }
.logform.card .kinds { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.logform.card .kinds label.k { display: inline-flex; align-items: center; min-height: 34px; padding: 0 12px; border-radius: 999px;
  background: var(--track, rgba(29,27,23,.06)); font-size: 12.5px; font-weight: 600; color: var(--ink); cursor: pointer; }
.logform.card .kinds label.k input { position: absolute; opacity: 0; width: 0; height: 0; }
.logform.card .kinds label.k.on { background: var(--ink); color: var(--paper); }
.logform.card .kinds.need, .logform.card textarea.need { border: 2px solid var(--rust) !important; border-radius: 12px; padding: 6px 8px;
  background: rgba(163, 68, 51, .08); }
.logform.card .kinds .when { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.logform.card .kinds .when[hidden] { display: none; }
.logform.card textarea { font: inherit; font-size: 13.5px; border: 1px solid var(--line); border-radius: 12px; padding: 9px 11px;
  resize: vertical; background: var(--paper); color: var(--ink); width: 100%; box-sizing: border-box; }
.logform.card .datein { font: inherit; font-size: 12.5px; height: 34px; padding: 0 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--paper); color: var(--ink); }
.lstatus { display: flex; justify-content: space-between; align-items: center; gap: 12px; background: var(--track, rgba(29,27,23,.05)); border-radius: 12px; padding: 10px 12px; }
.lstate { font-size: 10.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.lstate.info { color: var(--steel); } .lstate.muted { color: var(--muted); }
.lstrong { font-size: 13.5px; font-weight: 600; margin-top: 2px; }
.logform.card .kinds label.k.clear { background: var(--card); border: 1px solid var(--line); }
.logform.card .kinds label.k.clear.on { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.logform.card .logacts { padding-top: 2px; }
.logform.card select.ltpl { width: 100%; }
details.log[open] > .logform.card { width: 340px; }
@media (max-width: 600px) {
  .ltabs button, .logform.card .kinds label.k, .lphone, .logform.card .datein { min-height: 44px; height: auto; font-size: 14px; }
  .logform.card textarea { font-size: 16px; }
  .lname { font-size: 16px; }
}
.lhold { display: flex; flex-direction: column; gap: 8px; } .lhold[hidden] { display: none; }
.logform.card .datein[hidden] { display: none; }
.lwhen { display: flex; flex-direction: column; gap: 8px; } .lwhen[hidden] { display: none; }

/* Settings (2026-10-06): the theme words live here now. */
.settingslink { display: inline-block; margin-top: 8px; font-size: 12px; color: var(--muted); }
.settingslink:hover { color: var(--bronze); text-decoration: none; }
.resetview { font-size: 12px; font-weight: 600; color: var(--bronze); white-space: nowrap; }
.themepick.big { font-size: 14px; gap: 16px; margin-top: 12px; }
.themepick.big a { padding: 6px 0; }
/* Search is an icon until opened. */
.gsearch { display: flex; align-items: center; gap: 8px; }
.gsearch .gbtn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 0;
  border-radius: 999px; background: var(--card); color: var(--muted); cursor: pointer; box-shadow: var(--shadow-sm); }
.gsearch .gbtn:hover { color: var(--bronze); }
.gsearch input { display: none; }
.gsearch.open input { display: block; }
/* Timeline filter (the Journal folded in). */
.tlfilter { display: inline-flex; gap: 3px; background: var(--track, rgba(29,27,23,.06)); border-radius: 999px; padding: 3px; margin: 4px 0 12px; }
.tlfilter button { height: 32px; padding: 0 14px; border: 0; border-radius: 999px; background: transparent; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--muted); cursor: pointer; }
.tlfilter button.on { background: var(--card); color: var(--ink); box-shadow: var(--shadow-sm); }
[data-tl] .tle[hidden] { display: none; }
@media (max-width: 600px) {
  .gsearch { flex: 0 0 auto; }
  .gsearch.open { flex: 1 1 100%; }
  .gsearch.open input { width: 100%; }
  .tlfilter button { height: 40px; font-size: 14px; }
}
.iphotos { font-size: 12.5px; color: var(--muted); margin-top: 8px; }

/* --- the workout builder and the Workout tab (2026-10-06, workout.py) ------------------------- */
.wkb .wkgoal { font-family: "Source Serif 4", Georgia, serif; font-weight: 400; font-size: 17px; line-height: 1.4; margin: 10px 0 4px; }
.wkb .wkavoid { font-size: 13px; font-weight: 600; color: var(--rust); margin-top: 6px; }
.wkb .ilbl, .wkb .wkbh, .wkplan .wkbh { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-top: 14px; display: block; }
.wkb .kinds.tight { margin-top: 6px; }
.wkctl { display: flex; gap: 28px; flex-wrap: wrap; }
.wkdaytabs { display: inline-flex; gap: 3px; background: var(--track); border-radius: 999px; padding: 3px; margin-top: 16px; }
.wkdaytabs button { height: 34px; padding: 0 16px; border: 0; border-radius: 999px; background: transparent; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--muted); cursor: pointer; }
.wkdaytabs button.on { background: var(--card); color: var(--ink); box-shadow: var(--shadow-sm); }
.wkdaytabs button[hidden] { display: none; }
.wkday[hidden] { display: none; }
.wkblock { margin-top: 6px; }
.wkblock > summary { list-style: none; cursor: pointer; }
.wkblock > summary::-webkit-details-marker { display: none; }
.wkb .wkbh { display: flex; align-items: baseline; gap: 10px; }
.wkb .wkbh b { font-size: 14px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink); }
.wkb .wkbh .wkn { font-size: 12px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--faint); }
.wkb .wkbh > span:last-child { margin-left: auto; }
.wkb .wkbh::before { content: ""; width: 6px; height: 6px; border-right: 1.5px solid var(--faint); border-bottom: 1.5px solid var(--faint); transform: rotate(-45deg); margin-right: 2px; align-self: center; flex: 0 0 auto; }
.wkblock[open] > .wkbh::before { transform: rotate(45deg); }
.wkslots { display: flex; flex-direction: column; gap: 4px; margin: 8px 0; }
.wkslot { display: grid; gap: 8px; align-items: center; padding: 3px 0;
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto) 58px;
  grid-template-areas: "ex dose tools" "note note note"; }
.wkslot .wk-ex { grid-area: ex; } .wkslot .wk-dose { grid-area: dose; } .wkslot .wk-tools { grid-area: tools; }
.wkslot .wk-note { grid-area: note; }
.wkslot .wk-dose { font-size: 12.5px; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; }
.wkslot .wk-note[hidden] { display: none; }
.wkslot select, .wkslot input[type=text] { width: 100%; min-width: 0; box-sizing: border-box; font: inherit; font-size: 12.5px; color: var(--ink); background-color: var(--paper);
  border: 1px solid var(--line); border-radius: 10px; height: 34px; padding: 0 10px; }   /* background-color, never background: the controls law's chevron stays */
.wkslot select { padding-right: 26px; }
.wkslot .wk-each { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--muted); white-space: nowrap; }
.wkslot .wk-each input { width: 15px; height: 15px; accent-color: var(--ink); }
.wkslot .wk-tools { display: inline-flex; align-items: center; justify-content: flex-end; gap: 2px; }
.wkslot .wk-cuebtn { height: 26px; padding: 0 7px; border: 0; border-radius: 999px; background: transparent; color: var(--faint); font: inherit; font-size: 11px; font-weight: 600; cursor: pointer; }
.wkslot .wk-cuebtn:hover { color: var(--bronze); background: var(--track); }
.wkslot .wkx { height: 28px; width: 28px; border: 0; border-radius: 50%; background: transparent; color: var(--faint); font-size: 17px; line-height: 1; cursor: pointer; }
.wkslot .wkx:hover { color: var(--rust); background: var(--track); }
.wkpat { display: block; font-size: 10.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--faint); }
.wkb .itext { width: 100%; box-sizing: border-box; margin-top: 6px; font: inherit; font-size: 13px; color: var(--ink); background: var(--paper);
  border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; resize: vertical; }
.wkfoot { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 16px; }
.wkhelp { font-size: 12.5px; color: var(--muted); line-height: 1.45; }
.wkneed { margin-top: 12px; font-size: 13px; font-weight: 700; color: var(--rust); }
.wkb.need .wkslots select { border-color: var(--rust); }
.wkwrap { display: flex; flex-direction: column; gap: 14px; margin-top: 14px; }
.wklink { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.wklink input { flex: 1 1 220px; min-width: 0; font: inherit; font-size: 12.5px; color: var(--muted); background: var(--paper); border: 1px solid var(--line);
  border-radius: 999px; height: 34px; padding: 0 14px; }
.wkplan { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.wkplan .wkbh { margin-top: 12px; }
.wkplan .e-row > span:first-child { display: flex; flex-direction: column; gap: 2px; }
.wkcue { font-size: 12px; color: var(--muted); line-height: 1.4; }
@media (max-width: 600px) {
  .wkslot { grid-template-columns: minmax(0, 1fr) auto; gap: 6px; padding: 6px 0; border-bottom: 1px solid var(--line);
    grid-template-areas: "ex ex" "dose tools" "note note"; }
  .wkslot .wk-dose { text-align: left; white-space: normal; }
  .wkslot .wk-tools { justify-content: flex-start; }
  .wkslot select, .wkslot input[type=text] { font-size: 16px; height: 44px; }
  .wkslots { gap: 8px; }
  .wkdaytabs button { height: 40px; font-size: 14px; }
  .wkctl { gap: 14px; }
}
/* The Pool's "On the Pipeline" count at the end of the segment strip: a pointer, not a tab. */
.e-tabs a.poolpipe { margin-left: auto; color: var(--faint); font-weight: 500; border-bottom-color: transparent; }
.e-tabs a.poolpipe:hover { color: var(--bronze); }
@media (max-width: 600px) { .e-tabs a.poolpipe { margin-left: 0; } }

/* The Pool's filters (2026-10-06): club, membership type, check-ins, a date range on the segment's own
   date. The range is one pill holding both dates, so it reads as a sibling of the dropdowns. */
.poolclub { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.poolclub select { font-size: 13px; max-width: 220px; height: 32px; }
.poolrange { display: inline-flex; align-items: center; gap: 4px; height: 32px; box-sizing: border-box; padding: 0 6px 0 12px;
  border: 1px solid var(--line); border-radius: 999px; background: var(--card); font-size: 12.5px; color: var(--muted); }
.poolrange:hover { border-color: var(--bronze-soft); }
.poolrange:focus-within { border-color: var(--bronze); box-shadow: 0 0 0 3px rgba(201, 172, 127, .35); }
.poolrange > span { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.poolrange > span + input { margin-left: 4px; }
.poolrange input[type=date] { border: 0; background: transparent; box-shadow: none; height: 28px; padding: 0 4px; width: 118px;
  font-size: 13px; color: var(--ink); }
.poolrange input[type=date]:focus-visible { outline: none; box-shadow: none; border: 0; }
.poolrange input[type=date]:not(:focus):invalid, .poolrange input[type=date][value=""] { color: var(--faint); }
@media (max-width: 600px) {
  .poolclub { justify-content: flex-start; } .poolclub select { max-width: 100%; height: 44px; }
  .poolrange { height: auto; min-height: 44px; flex-wrap: wrap; width: 100%; padding: 6px 10px 6px 14px; gap: 6px; border-radius: 22px; }
  .poolrange input[type=date] { font-size: 16px; height: 32px; width: calc(50% - 30px); }
}
.wkdaytabs button small, .wkletter { font-size: 11px; font-weight: 600; color: var(--faint); letter-spacing: .04em; }
/* Phones: the block hint and the tab's letter are desktop niceties; the row stays tight. */
@media (max-width: 600px) { .wkb .wkbh > span:last-child { display: none; } .wkdaytabs button small { display: none; } }
.wkcircuit { display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: var(--muted); margin: 8px 0 2px; }
.wkcircuit select { font-size: 12.5px; height: 32px; }
@media (max-width: 600px) { .wkcircuit { flex-direction: column; align-items: stretch; gap: 6px; } .wkcircuit select { height: 44px; font-size: 16px; } }
/* The builder is a list of dropdowns (Carrie 2026-10-07: "just selecting the exercise or alt and whether its 30 or 60 min"). */
.wkslot, .wkblock:not(.hasalt) .wkslot { grid-template-columns: minmax(0, 1fr); grid-template-areas: "ex"; }
.wkslot .wk-dose[hidden], .wkslot .wk-tools { display: none; }
@media (max-width: 600px) { .wkslot { grid-template-columns: minmax(0, 1fr); grid-template-areas: "ex"; border-bottom: 0; padding: 3px 0; } }
/* Prime is the circuit or a machine (Carrie 2026-10-07): one choice, the circuit's moves stay out of sight. */
.wkblock[data-block="prime"] .wkslots { display: none; }
.wkblock[data-block="prime"] .wk-circuit { width: 100%; height: 34px; font-size: 12.5px; margin: 8px 0 2px; }
@media (max-width: 600px) { .wkblock[data-block="prime"] .wk-circuit { height: 44px; font-size: 16px; } }
.wkmsg { display: block; width: 100%; box-sizing: border-box; margin-top: 10px; font: inherit; font-size: 12.5px; line-height: 1.45; color: var(--muted);
  background: var(--paper); border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; resize: vertical; }
.wkextra { margin-top: 14px; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.wkextra .ilbl { width: 100%; margin-top: 0; }
.wkextra select { font-size: 12.5px; height: 34px; min-width: 220px; }
@media (max-width: 600px) { .wkextra select { width: 100%; height: 44px; font-size: 16px; } }
.wkdaytabs .wkplus { width: 34px; padding: 0; font-size: 18px; line-height: 1; color: var(--bronze); }
.wkdaytabs .wkxtab { max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wkxday .wk-extra { width: 100%; max-width: 420px; height: 34px; font-size: 12.5px; margin-top: 6px; }
@media (max-width: 600px) { .wkxday .wk-extra { height: 44px; font-size: 16px; } .wkdaytabs .wkplus { height: 40px; width: 40px; } }

/* The Pool's filters on a phone (Carrie 2026-10-16, the mobile scan): one grid, every control the same
   height and width, the date range as two halves of one row instead of a pill that broke mid-line. */
@media (max-width: 600px) {
  .poolclub { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; justify-content: stretch; width: 100%; }
  .poolclub select { max-width: none; width: 100%; height: 40px; font-size: 16px; }
  .poolclub select[name=plan] { grid-column: 1 / -1; order: 2; }   /* club and check-ins share the first row */
  .poolclub > .chipbtn { order: 4; justify-self: start; }
  .poolrange { grid-column: 1 / -1; order: 3; display: grid; grid-template-columns: auto 1fr auto 1fr; align-items: center; height: auto;
    min-height: 40px; padding: 4px 8px 4px 12px; border-radius: 14px; }
  .poolrange input[type=date] { width: 100%; min-width: 0; height: 32px; font-size: 16px; }
}

/* Lists as cards on a phone (Carrie 2026-10-16, the mobile scan): a wide list table hid its columns behind
   the sticky Log button ("Fis", "Ea" in 1B). Each row is a small card: the name and Log on the first line,
   the other columns underneath, labelled where a bare value would not say what it is. Same rows, same
   order; the tablet and desktop table is unchanged. */
@media (max-width: 600px) {
  .tablewrap:has(> .tbl.wl) { overflow: visible; }
  .tbl.wl, .tbl.wl tbody { display: block; min-width: 0; }
  .tbl.wl thead { display: none; }
  .tbl.wl tr { display: flex; flex-wrap: wrap; align-items: center; column-gap: 10px; row-gap: 5px;
    padding: 12px 14px; border-bottom: 1px solid var(--line); }
  .tbl.wl tr:last-child { border-bottom: 0; }
  .tbl.wl td { display: block; padding: 0; border: 0; white-space: normal; text-align: left; }
  .tbl.wl td:empty { display: none; }
  .tbl.wl td.c-ck { order: 0; flex: 0 0 auto; }
  .tbl.wl td.c-name { order: 0; flex: 1 1 calc(100% - 110px); min-width: 0; }
  .tbl.wl tr:has(> td.c-ck) td.c-name { flex-basis: calc(100% - 140px); }
  .tbl.wl td.c-name .nm { font-size: 15px; }
  .tbl.wl td.c-act { order: 1; flex: 0 0 96px; position: static; box-shadow: none; background: transparent; text-align: right; }
  .tbl.wl td:has(> .nil:only-child) { display: none; }     /* an empty value is a hyphen on desktop, nothing in a card */
  .tbl.wl td:not(.c-name):not(.c-act):not(.c-ck) { order: 2; font-size: 12.5px; color: var(--muted); }
  .tbl.wl td[data-l]::before { content: attr(data-l) " "; font-size: 10.5px; font-weight: 600; letter-spacing: .06em;
    text-transform: uppercase; color: var(--faint); }
  .tbl.wl td.empty { flex: 1 1 100%; }
}

/* The rest of the 2026-10-16 phone scan: the member file's seven tabs are one row that scrolls in its own
   box (they wrapped to two rows); the program builder's "Workout 1" labels stay on one line, the strip
   scrolls if it must; Adoption's numbers get air before the next heading. */
@media (max-width: 600px) {
  .e-tabs.mtabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .e-tabs.mtabs::-webkit-scrollbar { display: none; }
  .e-tabs.mtabs a { flex: 0 0 auto; white-space: nowrap; padding: 11px 11px 12px; }
  .wkdaytabs { display: flex; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .wkdaytabs::-webkit-scrollbar { display: none; }
  .wkdaytabs button { flex: 0 0 auto; white-space: nowrap; padding: 0 13px; }
  .counts + .section-label { margin-top: 18px; }
}

/* "More" on a Manager's phone (Carrie 2026-10-19): Board, Progress and Settings behind one tab, so the bar
   is Today, Clients, Pipeline, Pool, More. Desktop keeps the full sidebar; More does not exist there. */
.navmore { display: none; }
@media (max-width: 600px) {
  .sidenav a.inmore { display: none; }
  .settingslink.hasmore { display: none; }
  .navmore { display: block; position: relative; }
  .navmore > summary { list-style: none; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    min-height: 50px; padding: 6px 2px 5px; border-radius: 12px; font-size: 10.5px; font-weight: 600; color: var(--muted); cursor: pointer; }
  .navmore > summary::-webkit-details-marker { display: none; }
  .navmore > summary .ic { display: inline-flex; color: var(--faint); }
  .navmore > summary .ic svg { width: 20px; height: 20px; }
  .navmore > summary.on, .navmore[open] > summary { color: var(--ink); background: rgba(154, 113, 66, .10); }
  .navmore > summary.on .ic, .navmore[open] > summary .ic { color: var(--bronze); }
  .navmore-sheet { position: absolute; right: 0; bottom: calc(100% + 12px); min-width: 190px; padding: 6px;
    background: var(--card); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 12px 32px rgba(0, 0, 0, .18);
    display: flex; flex-direction: column; gap: 2px; z-index: 56; }
  .navmore-sheet a { display: flex !important; flex-direction: row !important; align-items: center; gap: 12px; min-height: 44px;
    padding: 0 14px !important; border-radius: 10px; font-size: 14.5px !important; font-weight: 600; color: var(--ink); text-align: left !important; }
  .navmore-sheet a .ic svg { width: 18px; height: 18px; }
  .navmore-sheet a.on { background: rgba(154, 113, 66, .10); }
  .navmore-sheet a.on .ic { color: var(--bronze); }
}

/* Coach coverage in Settings (Carrie 2026-10-20): a full swap or a split. */
.covset { grid-column: 1 / -1; }
.covgroup { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }
.covhead { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13.5px; }
.covpick, .covform { margin-top: 14px; }
.covpick select, .covform > select { width: 100%; max-width: 420px; }
.covdates { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.covdates label { display: flex; flex-direction: column; gap: 6px; }
.covbar { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; margin-bottom: 10px; }
.covbar label { display: flex; flex-direction: column; gap: 6px; }
.covbar select { min-width: 220px; }
.covacts { align-items: center; flex-wrap: wrap; }
.covhint { color: var(--muted); font-size: 12px; }
.covflash { margin-top: 12px; padding: 9px 12px; border-radius: 10px; background: color-mix(in srgb, var(--good, #1F8A73) 14%, transparent); font-size: 13.5px; }
.covflash.warn { background: color-mix(in srgb, var(--warn, #B7674F) 16%, transparent); }
.covbulk { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 14px 0 8px; }
.covcount { color: var(--muted); font-size: 12.5px; margin-left: auto; }
.covlist { max-height: 460px; overflow-y: auto; border: 1px solid var(--line); border-radius: 12px; }
.covrow { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-bottom: 1px solid var(--line); cursor: pointer; }
.covrow:last-child { border-bottom: 0; }
.covrow input { flex: 0 0 auto; }
.covname { flex: 1 1 auto; min-width: 0; font-size: 13.5px; }
.covname small { color: var(--muted); font-size: 11.5px; margin-left: 4px; }
.covwith { flex: 0 0 auto; color: var(--muted); font-size: 12px; }
.covrow.covered .covname { color: var(--muted); }
@media (max-width: 600px) {
  .covbar label { flex: 1 1 140px; }
  .covbar select { min-width: 0; width: 100%; }
  .covrow { flex-wrap: wrap; }
  .covwith { flex-basis: 100%; padding-left: 28px; }
  .covhint { flex-basis: 100%; }
}

/* People in Settings (2026-10-22): who signs in, as what, at which clubs. */
.pplset { grid-column: 1 / -1; }
.pplist { margin: 12px 0; border: 1px solid var(--line); border-radius: 12px; }
.ppl { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.4fr) auto; gap: 10px; align-items: center; padding: 9px 12px; border-bottom: 1px solid var(--line); font-size: 13.5px; }
.ppl:last-child { border-bottom: 0; }
.pplwho small, .pplwhat { color: var(--muted); font-size: 12.5px; }
.pplacts { display: flex; gap: 6px; }
.pplclubs { flex-wrap: wrap; }
.viewas .viewclub { display: block; margin-top: 4px; }
@media (max-width: 600px) { .ppl { grid-template-columns: 1fr; } }

/* A Vantage-worked member on the Text tab (2026-10-22): a STOP to a Desk text ends the advisor's texts too. */
.lhelp.lvwarn { color: var(--warn); font-weight: 500; }

/* Goals on the file (2026-10-22): the newest leads, earlier ones muted beneath it. */
.goaltrail { margin: 4px 0 8px; display: grid; gap: 6px; }
.goalold { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; color: var(--muted); }
.goalold .gw { text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--muted) 55%, transparent); }
.goalold .gd { flex: 0 0 auto; font-size: 12px; }
.goalhint { font-size: 12px; margin: 2px 0 8px; }

/* Touch feel (Carrie 2026-10-20, "tapping isnt smooth ... a little glitchy"): no grey flash on tap, no
   double-tap zoom delay, hover styles that do not stick after a tap on a touch screen, and a small
   press so a tap visibly lands. */
html { -webkit-tap-highlight-color: transparent; }
a, button, summary, label, select, input, textarea, .stage { touch-action: manipulation; }
@media (hover: none) {
  a:hover { text-decoration: none; }
  .tbl tbody tr:hover, :root[data-theme="dark"] .tbl tbody tr:hover { background: transparent; }
  .stage:hover { transform: none; }
  .sidenav a:hover { background: transparent; }
  .chipbtn:hover { background: inherit; }
  .chipbtn.ghost:hover, select:hover, .lphone:hover, .poolrange:hover { border-color: var(--line); color: inherit; }
  .btn:hover { opacity: 1; }
  .btn, .chipbtn, label.k, .sidenav a, .navmore > summary, .ltabs button, .stage, .wkdaytabs button, .e-tabs a, .seg a {
    transition: transform .08s ease-out, background-color .12s ease-out; }
  .btn:active, .chipbtn:active, label.k:active, .sidenav a:active, .navmore > summary:active, .ltabs button:active,
  .stage:active, .wkdaytabs button:active, .e-tabs a:active, .seg a:active { transform: scale(.96); }
}
