/* ── Tokens ─────────────────────────────────────────────────── */
:root {
  --floor: #e6e9e7;
  --panel: #ffffff;
  --panel-2: #f3f5f4;
  --ink: #1d2a3a;
  --ink-soft: #3a4757;
  --steel: #5b6776;
  --line: #d2d8d5;
  --hivis: #f5c518;
  --hivis-ink: #1d2a3a;
  --sidebar: #1d2a3a;
  --sidebar-ink: #e9edf1;
  --sidebar-dim: #9fadbd;
  --button: #1d2a3a;
  --button-ink: #ffffff;
  --link: #1f5a99;
  --urgent: #b42318;
  --urgent-bg: #fdecea;
  --soon: #9a5a00;
  --soon-bg: #fff3dc;
  --monitor: #34607f;
  --monitor-bg: #e6f0f6;
  --ok: #2b6a3d;
  --ok-bg: #e6f3ea;
  --focus: #1f5a99;

  --font-head: Bahnschrift, 'DIN Alternate', 'DIN 2014', 'D-DIN', 'Barlow Semi Condensed', 'Roboto Condensed', 'Arial Narrow', sans-serif;
  --font-body: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

  --radius: 6px;
  --radius-small: 3px;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --floor: #12171d;
    --panel: #1b222a;
    --panel-2: #222a33;
    --ink: #e5e9ee;
    --ink-soft: #c5ced8;
    --steel: #98a5b3;
    --line: #2f3944;
    --sidebar: #0d1217;
    --sidebar-ink: #e5e9ee;
    --sidebar-dim: #8796a6;
    --button: #e5e9ee;
    --button-ink: #12171d;
    --link: #8fbcf0;
    --urgent: #ff8a7d;
    --urgent-bg: #3a1d1b;
    --soon: #f1b65b;
    --soon-bg: #362a14;
    --monitor: #8cc0e0;
    --monitor-bg: #1b2d3a;
    --ok: #86d29b;
    --ok-bg: #1a3022;
    --focus: #8fbcf0;
    color-scheme: dark;
  }
}

/* ── Base ───────────────────────────────────────────────────── */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--floor);
  color: var(--ink);
  font: 16px/1.5 var(--font-body);
}

h1, h2, h3 {
  font-family: var(--font-head);
  font-weight: 700;
  line-height: 1.15;
  margin: 0 0 0.5rem;
  letter-spacing: 0.005em;
}
h1 { font-size: 2rem; }
h2 { font-size: 1.3rem; }
h3 { font-size: 1.05rem; margin-top: 1.5rem; }

p { margin: 0 0 0.75rem; }
a { color: var(--link); text-underline-offset: 0.15em; }
a:hover { text-decoration-thickness: 2px; }
code { font-size: 0.9em; background: var(--panel-2); padding: 0 0.3em; border-radius: var(--radius-small); }

:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }

.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; margin: -1px;
}
.skip { position: absolute; left: -999px; top: 0; background: var(--hivis); color: var(--hivis-ink); padding: 0.5rem 1rem; z-index: 10; }
.skip:focus { left: 0; }
.muted { color: var(--steel); }
.small { font-size: 0.9rem; }
.js .js-hide { display: none; }
[hidden] { display: none !important; }

/* ── Shell ──────────────────────────────────────────────────── */
.shell { display: grid; grid-template-columns: 236px minmax(0, 1fr); min-height: 100vh; }

.sidebar {
  background: var(--sidebar);
  color: var(--sidebar-ink);
  display: flex; flex-direction: column;
  padding: 1.25rem 0 1rem;
  position: sticky; top: 0; height: 100vh;
}
.sidebar-top { padding: 0 1.25rem 1rem; }
.brand {
  font-family: var(--font-head); font-weight: 700; font-size: 1.25rem;
  color: inherit; text-decoration: none; display: block;
}
.shop-name { display: block; color: var(--sidebar-dim); font-size: 0.875rem; margin-top: 0.15rem; }
.nav-toggle { display: none; }

.nav { display: flex; flex-direction: column; padding: 0.5rem 0; flex: 1; }
.nav a {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.55rem 1.25rem; color: var(--sidebar-ink); text-decoration: none;
  border-left: 4px solid transparent;
}
.nav a:hover { background: rgba(255, 255, 255, 0.06); }
.nav a.active { border-left-color: var(--hivis); background: rgba(255, 255, 255, 0.08); font-weight: 600; }
.due-count {
  background: var(--hivis); color: var(--hivis-ink);
  font-family: var(--font-head); font-weight: 700; font-size: 0.85rem;
  min-width: 1.6rem; text-align: center; padding: 0 0.4rem; border-radius: 999px;
}
.signout { padding: 0.75rem 1.25rem 0; border-top: 1px solid rgba(255, 255, 255, 0.12); display: flex; justify-content: space-between; gap: 0.5rem; font-size: 0.9rem; }
.signout .who { color: var(--sidebar-dim); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.signout .link-button { color: var(--sidebar-ink); }

.main { padding: 2rem clamp(1rem, 3vw, 2.5rem) 4rem; max-width: 1180px; width: 100%; }
.main-wide { max-width: 1440px; }

/* ── Page furniture ─────────────────────────────────────────── */
.page-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem;
  flex-wrap: wrap; margin-bottom: 1.25rem;
}
.page-head h1 { margin: 0; }
.page-head .actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.page-total { margin: 0.6rem 0 0; color: var(--steel); }
.lede { color: var(--ink-soft); max-width: 68ch; margin-bottom: 1.25rem; }
.hint { color: var(--steel); font-size: 0.875rem; display: block; }
.contact-line { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 1rem; margin: 0.4rem 0 0.2rem; }
.notes { background: var(--panel); border-left: 4px solid var(--line); padding: 0.6rem 1rem; white-space: pre-wrap; max-width: 75ch; }

.panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.25rem 1.5rem;
  margin-bottom: 1.25rem;
}
.panel.flush { padding: 0; overflow: hidden; }
.panel-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 0.25rem 1rem; margin-bottom: 0.75rem; }
.panel-head h2 { margin: 0; }
.count { font-family: var(--font-head); color: var(--steel); font-weight: 400; margin-left: 0.25rem; }
details.panel > summary { cursor: pointer; list-style: revert; }
details.panel > summary h2 { display: inline; }
details.panel[open] > summary { margin-bottom: 0.75rem; }

.columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 0 1.25rem; align-items: start; }
.columns > .panel { margin-bottom: 1.25rem; }

.empty { color: var(--steel); margin: 0; }
.empty.panel { padding: 1.5rem; }

/* ── Notices ────────────────────────────────────────────────── */
.notice { border-radius: var(--radius); padding: 0.75rem 1rem; margin-bottom: 1rem; border: 1px solid; }
.notice p:last-child, .notice ul { margin-bottom: 0; }
.notice ul { padding-left: 1.2rem; margin-top: 0.25rem; }
.notice-success { background: var(--ok-bg); border-color: var(--ok); color: var(--ink); }
.notice-error { background: var(--urgent-bg); border-color: var(--urgent); color: var(--ink); }
.notice-warn { background: var(--soon-bg); border-color: var(--soon); color: var(--ink); }
.notice-test { background: var(--panel-2); border-color: var(--line); border-left: 6px solid var(--hivis); font-size: 0.9rem; }

/* ── Buttons ────────────────────────────────────────────────── */
.button {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
  min-height: 2.5rem; padding: 0.45rem 1rem;
  font: 600 0.95rem/1.2 var(--font-body);
  color: var(--ink); background: var(--panel);
  border: 1.5px solid var(--ink); border-radius: var(--radius-small);
  text-decoration: none; cursor: pointer; white-space: nowrap;
}
.button:hover { background: var(--panel-2); }
.button-primary { background: var(--button); color: var(--button-ink); border-color: var(--button); }
.button-primary:hover { background: var(--ink-soft); border-color: var(--ink-soft); }
.button-quiet { border-color: var(--line); }
.button-small { min-height: 2rem; padding: 0.25rem 0.65rem; font-size: 0.875rem; }
.button-danger { background: var(--urgent); border-color: var(--urgent); color: #fff; }
.link-button { background: none; border: 0; padding: 0; color: var(--link); font: inherit; text-decoration: underline; cursor: pointer; }
.link-button.danger, .danger { color: var(--urgent); }

/* ── Forms ──────────────────────────────────────────────────── */
.stack > * + * { margin-top: 1rem; }
.grid { display: grid; gap: 1rem 1.25rem; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: 1fr 1.3fr 1.3fr 0.7fr; }
.form-narrow { max-width: 760px; }

.field { display: flex; flex-direction: column; gap: 0.3rem; min-width: 0; }
.field label, fieldset legend { font-weight: 600; font-size: 0.9rem; }
.req { color: var(--urgent); }
input:not([type=checkbox]):not([type=radio]), select, textarea {
  font: inherit; color: var(--ink); background: var(--panel);
  border: 1.5px solid var(--line); border-radius: var(--radius-small);
  padding: 0.5rem 0.65rem; min-height: 2.6rem; width: 100%;
}
textarea { resize: vertical; line-height: 1.5; }
input:focus, select:focus, textarea:focus { border-color: var(--focus); outline: 2px solid var(--focus); outline-offset: 0; }
input[type=checkbox] { width: 1.15rem; height: 1.15rem; accent-color: var(--ink); flex: none; margin: 0.15rem 0 0; }
.has-error input, .has-error select, .has-error textarea { border-color: var(--urgent); }
.field-error { color: var(--urgent); font-size: 0.875rem; font-weight: 600; }
.field.check label { display: flex; gap: 0.6rem; align-items: flex-start; font-weight: 400; font-size: 1rem; }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
fieldset.consent, fieldset.auto-send { border-top: 1px solid var(--line); padding-top: 1rem; }
fieldset.consent > * + *, fieldset.auto-send > * + * { margin-top: 0.75rem; }
.form-actions { display: flex; gap: 0.6rem; flex-wrap: wrap; align-items: center; }

.search { display: flex; gap: 0.5rem; align-items: center; margin-bottom: 1rem; max-width: 620px; }
.search input { flex: 1; }

/* Intake */
.form-section h2 { margin-bottom: 1rem; }
.consent { margin-top: 1.25rem; display: grid; grid-template-columns: 1fr minmax(180px, 240px); gap: 0.75rem 1.5rem; align-items: start; }
.consent .hint { grid-column: 1 / -1; }
.consent .notice { grid-column: 1 / -1; }
.consent-check {
  display: flex; gap: 0.75rem; align-items: flex-start;
  background: var(--panel-2); border: 1.5px dashed var(--line); border-radius: var(--radius);
  padding: 0.8rem 1rem; cursor: pointer;
}
.consent-check:has(input:checked) { border-style: solid; border-color: var(--ok); background: var(--ok-bg); }
.consent.has-error .consent-check { border-color: var(--urgent); }
.vehicle-pick { max-width: 420px; margin-bottom: 1rem; }
.plate-field input { font-family: var(--font-head); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }

.issue-rows { display: flex; flex-direction: column; gap: 0.75rem; margin: 1rem 0; }
.issue-row {
  display: grid; grid-template-columns: minmax(0, 2.4fr) minmax(0, 1.6fr) minmax(0, 0.8fr) minmax(0, 1.1fr);
  gap: 0.75rem; padding: 0.9rem 1rem; background: var(--panel-2);
  border: 1px solid var(--line); border-radius: var(--radius);
}
.issue-row.has-error { border-color: var(--urgent); }
.issue-row > .field-error { grid-column: 1 / -1; }
.sticky-actions {
  position: sticky; bottom: 0; background: var(--floor);
  padding: 0.85rem 0; border-top: 1px solid var(--line); z-index: 2;
}

/* ── Chips, plates, tags ────────────────────────────────────── */
.plate {
  display: inline-block; font-family: var(--font-head); font-weight: 700;
  font-size: 0.9rem; letter-spacing: 0.08em; line-height: 1.25;
  color: #111820; background: #fff;
  border: 2px solid #111820; border-radius: 4px;
  padding: 0.05rem 0.45rem; white-space: nowrap;
  box-shadow: inset 0 0 0 1px #fff, inset 0 0 0 2px #c9ced3;
}
.vehicle { display: inline-flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }

.sev, .status, .email-state, .tag, .due-tag {
  display: inline-block; font-size: 0.78rem; font-weight: 700; line-height: 1.4;
  padding: 0.05rem 0.5rem; border-radius: 999px; white-space: nowrap; vertical-align: middle;
}
.sev-urgent { color: var(--urgent); background: var(--urgent-bg); }
.sev-soon { color: var(--soon); background: var(--soon-bg); }
.sev-monitor { color: var(--monitor); background: var(--monitor-bg); }
.due-tag { background: var(--hivis); color: var(--hivis-ink); }
.tag { background: var(--panel-2); color: var(--steel); border: 1px solid var(--line); }
.email-ok { color: var(--ok); background: var(--ok-bg); }
.email-noconsent, .email-none { color: var(--steel); background: var(--panel-2); border: 1px solid var(--line); }
.email-unsub { color: var(--urgent); background: var(--urgent-bg); }
.mail-sent { color: var(--ok); font-weight: 600; }
.mail-failed { color: var(--urgent); font-weight: 600; }
.mail-logged, .mail-sending { color: var(--steel); font-weight: 600; }

/* ── Tables & lists ─────────────────────────────────────────── */
.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.table th {
  text-align: left; font-weight: 600; font-size: 0.82rem; color: var(--steel);
  padding: 0.6rem 0.75rem; border-bottom: 1.5px solid var(--line); white-space: nowrap;
}
.table td { padding: 0.7rem 0.75rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.table tbody tr:last-child td { border-bottom: 0; }
.panel.flush .table th:first-child, .panel.flush .table td:first-child { padding-left: 1.25rem; }
.table .num { text-align: right; font-variant-numeric: tabular-nums; }
.table .sub { display: block; color: var(--steel); font-size: 0.85rem; margin-top: 0.1rem; }
.table .check-col { width: 2.5rem; }
.plain-link { color: inherit; text-decoration: none; }
.plain-link:hover { text-decoration: underline; }
.row-actions { display: flex; flex-direction: column; gap: 0.4rem; align-items: flex-start; }
.snooze { display: flex; gap: 0.3rem; }
.snooze select { min-height: 2rem; padding: 0.2rem 0.4rem; width: auto; font-size: 0.875rem; }
.inline-status { display: flex; gap: 0.35rem; align-items: center; }
.inline-status select { min-height: 2.1rem; padding: 0.2rem 0.45rem; width: auto; font-size: 0.9rem; }

.rows { list-style: none; margin: 0; padding: 0; }
.rows li {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.15rem 1rem;
  padding: 0.65rem 0; border-bottom: 1px solid var(--line);
}
.rows li:last-child { border-bottom: 0; }
.row-main { font-weight: 600; }
.row-meta, .row-notes { grid-column: 1 / -1; color: var(--steel); font-size: 0.9rem; }
.row-notes { white-space: pre-wrap; }
.issue-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.3rem; }

.tabs { display: flex; gap: 0.25rem; border-bottom: 1.5px solid var(--line); margin-bottom: 0.9rem; overflow-x: auto; }
.tabs a { padding: 0.5rem 0.9rem; text-decoration: none; color: var(--steel); font-weight: 600; border-bottom: 3px solid transparent; margin-bottom: -1.5px; white-space: nowrap; }
.tabs a.active { color: var(--ink); border-bottom-color: var(--ink); }
.filter-chips { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-bottom: 1rem; }
.filter-chips a { padding: 0.2rem 0.75rem; border: 1px solid var(--line); border-radius: 999px; color: var(--ink-soft); text-decoration: none; font-size: 0.875rem; background: var(--panel); }
.filter-chips a.active { background: var(--ink); color: var(--panel); border-color: var(--ink); }
.pager { display: flex; gap: 1rem; align-items: center; justify-content: center; margin: 1rem 0; color: var(--steel); }

/* ── Dashboard ──────────────────────────────────────────────── */
.figures { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.figure {
  display: flex; flex-direction: column; gap: 0.2rem;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 1rem 1.25rem; color: var(--ink); text-decoration: none;
}
a.figure:hover { border-color: var(--ink-soft); }
.figure-value { font-family: var(--font-head); font-weight: 700; font-size: 2.25rem; line-height: 1.05; font-variant-numeric: tabular-nums; }
.figure-label { color: var(--steel); font-size: 0.9rem; }
.figure-due { border-left: 8px solid var(--hivis); }
.getting-started { border-left: 8px solid var(--hivis); }
.steps { margin: 0; padding-left: 1.3rem; display: flex; flex-direction: column; gap: 0.5rem; max-width: 75ch; }

/* ── Customer page ──────────────────────────────────────────── */
.vehicle-block + .vehicle-block { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.vehicle-head { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 0.5rem; }
.vehicle-head .spacer { flex: 1; }
.danger-zone { margin-top: 2rem; color: var(--steel); }
.danger-zone summary { cursor: pointer; }
.danger-zone p { max-width: 70ch; margin-top: 0.75rem; }
.danger-inline { margin-top: 1rem; }

/* ── Follow-ups & compose ───────────────────────────────────── */
.send-bar {
  display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap;
  padding: 1rem 0 0; margin-top: 0.5rem; border-top: 1.5px solid var(--line);
}
.send-bar label { font-weight: 600; }
.send-bar select { width: auto; max-width: 100%; }
.template-picker { display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; margin-bottom: 1rem; }
.template-picker label { font-weight: 600; }
.template-picker select { width: auto; }

.compose { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.compose-form { margin-bottom: 0; }
.issue-picks { display: flex; flex-direction: column; gap: 0.5rem; }
.issue-pick { display: flex; gap: 0.6rem; align-items: flex-start; flex-wrap: wrap; cursor: pointer; }
.issue-pick .muted { flex-basis: 100%; padding-left: 1.75rem; font-size: 0.85rem; margin-top: -0.35rem; }
.issue-pick .muted:empty { display: none; }
.nowrap { white-space: nowrap; }
.placeholder-help summary { cursor: pointer; font-weight: 600; font-size: 0.9rem; }
.placeholder-help ul { list-style: none; padding: 0; margin: 0.5rem 0 0; display: grid; gap: 0.3rem; font-size: 0.875rem; color: var(--steel); }
.placeholder {
  font: 600 0.82rem ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  background: var(--panel-2); color: var(--ink); border: 1px solid var(--line);
  border-radius: var(--radius-small); padding: 0.1rem 0.4rem; cursor: pointer;
}
.placeholder:hover { border-color: var(--ink); }

.preview { position: sticky; top: 1rem; }
.preview-title { font-size: 1rem; color: var(--steel); margin-bottom: 0.6rem; }
.letter { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.letter.panel { padding: 0; }
.letter-meta { margin: 0; padding: 0.85rem 1.25rem; background: var(--panel-2); border-bottom: 1px solid var(--line); display: grid; gap: 0.2rem; font-size: 0.9rem; }
.letter-meta div { display: grid; grid-template-columns: 4.5rem 1fr; }
.letter-meta dt { color: var(--steel); }
.letter-meta dd { margin: 0; overflow-wrap: anywhere; }
.letter-body { padding: 1.25rem; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.6; max-width: 70ch; }

/* ── Templates ──────────────────────────────────────────────── */
.template-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
.template-card { display: flex; flex-direction: column; gap: 0.35rem; color: var(--ink); text-decoration: none; margin: 0; }
.template-card:hover { border-color: var(--ink-soft); }
.template-name { font-family: var(--font-head); font-weight: 700; font-size: 1.15rem; }
.template-subject { color: var(--ink-soft); }

/* ── Auth & public pages ────────────────────────────────────── */
.auth-body { display: flex; min-height: 100vh; }
.auth-main { width: 100%; max-width: 460px; margin: auto; padding: 2rem 1rem; }
.brand-auth { color: var(--ink); font-size: 1.4rem; margin-bottom: 1rem; }
.brand-auth::before {
  content: ''; display: inline-block; width: 0.8rem; height: 0.8rem; margin-right: 0.5rem;
  background: var(--hivis); border-radius: 50%; vertical-align: 0.05em;
}
.auth-panel { padding: 1.75rem; }
.auth-panel h1 { font-size: 1.75rem; }
.auth-panel .button-primary { width: 100%; }
.auth-alt { margin: 1.25rem 0 0; color: var(--steel); }
.error-panel { max-width: 560px; }

/* ── Printable intake sheet ─────────────────────────────────── */
.sheet {
  background: #fff; color: #111; border: 1px solid var(--line);
  max-width: 800px; padding: 2.25rem 2.5rem; font-size: 15px;
}
.sheet-head { border-bottom: 3px solid #111; padding-bottom: 0.6rem; margin-bottom: 1rem; }
.sheet-head h2 { font-size: 1.8rem; margin: 0; }
.sheet-head p { margin: 0.2rem 0 0; color: #444; }
.sheet h3 { font-size: 1.05rem; margin: 1.25rem 0 0.4rem; }
.sheet-office { font-family: var(--font-body); font-weight: 400; color: #555; font-size: 0.9rem; }
.sheet-fields { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.6rem 1.5rem; margin: 0; }
.sheet-fields .wide { grid-column: 1 / -1; }
.sheet-fields div { display: flex; align-items: flex-end; gap: 0.5rem; }
.sheet-fields dt { font-weight: 600; white-space: nowrap; }
.sheet-fields dd { flex: 1; margin: 0; border-bottom: 1px solid #111; height: 1.9rem; }
.sheet-consent { display: flex; gap: 0.9rem; align-items: flex-start; border: 2px solid #111; padding: 0.8rem 1rem; margin: 1.25rem 0 0.75rem; }
.sheet-consent p { margin: 0; }
.sheet-box { flex: none; width: 1.5rem; height: 1.5rem; border: 2px solid #111; margin-top: 0.1rem; }
.sheet-table { width: 100%; border-collapse: collapse; }
.sheet-table th { text-align: left; font-size: 0.85rem; border-bottom: 2px solid #111; padding: 0.3rem; }
.sheet-table td { border-bottom: 1px solid #111; height: 2.3rem; padding: 0.3rem; }
.sheet-table th:nth-child(1) { width: 58%; }
.sheet-sev { color: #555; font-size: 0.8rem; white-space: nowrap; }

@media print {
  @page { margin: 12mm; }
  body { background: #fff; }
  .sidebar, .no-print, .notice, .skip { display: none !important; }
  .shell { display: block; }
  .main { padding: 0; max-width: none; }
  .sheet { border: 0; padding: 0; max-width: none; }
}

/* ── Simple mode: bigger targets and plain helpers ──────────── */
body { font-size: 17px; }
.button { min-height: 2.75rem; padding: 0.55rem 1.1rem; }
.button-small { min-height: 2.25rem; padding: 0.3rem 0.75rem; }
.button-big { min-height: 3.25rem; padding: 0.7rem 1.5rem; font-size: 1.05rem; }
.button:disabled { opacity: 0.45; cursor: not-allowed; }
.nav a { padding-block: 0.7rem; font-size: 1.02rem; }
.nav a.nav-more { padding-block: 0.45rem; font-size: 0.93rem; color: var(--sidebar-dim); }
.nav a.nav-more.active, .nav a.nav-more:hover { color: var(--sidebar-ink); }
.nav-divider { display: block; height: 1px; margin: 0.75rem 1.25rem; background: rgba(255, 255, 255, 0.14); }
.opt { font-weight: 400; color: var(--steel); }
.small-lede { margin-bottom: 0.9rem; }
.empty-big { color: var(--ink-soft); font-size: 1.05rem; margin: 0.25rem 0 0.25rem; }
.phone { font-weight: 600; }

.help-link {
  display: inline-flex; align-items: center; gap: 0.4rem; margin-top: 0.35rem;
  font-size: 0.92rem; color: var(--link);
}
.help-dot {
  display: inline-grid; place-items: center; width: 1.25rem; height: 1.25rem; flex: none;
  border-radius: 50%; background: var(--hivis); color: var(--hivis-ink);
  font: 700 0.8rem/1 var(--font-head); text-decoration: none;
}

details > summary { cursor: pointer; }
.more-fields, .consent-more, .send-options, .edit-email { margin-top: 0.9rem; }
.more-fields > summary, .consent-more > summary, .send-options > summary, .edit-email > summary, .issue-date > summary {
  color: var(--link); font-weight: 600; font-size: 0.95rem; width: fit-content;
}
.more-fields[open] > summary, .consent-more[open] > summary, .send-options[open] > summary, .edit-email[open] > summary { margin-bottom: 0.75rem; }
.edit-email { border-top: 1px solid var(--line); padding-top: 1rem; }
.summary-action { text-decoration: underline; margin-left: 0.3rem; }

/* Home */
.today { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.today-card {
  display: flex; gap: 1rem; align-items: flex-start;
  background: var(--panel); border: 2px solid var(--line); border-radius: var(--radius);
  padding: 1.25rem 1.4rem; color: var(--ink); text-decoration: none;
}
.today-card:hover { border-color: var(--ink); }
.today-due { border-color: var(--hivis); box-shadow: inset 6px 0 0 var(--hivis); }
.today-step {
  flex: none; display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%;
  background: var(--ink); color: var(--panel); font: 700 1.3rem/1 var(--font-head);
}
.today-body { display: flex; flex-direction: column; gap: 0.3rem; min-width: 0; }
.today-title { font: 700 1.45rem/1.15 var(--font-head); display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.today-text { color: var(--ink-soft); }
.figures { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.figure-value { font-size: 1.9rem; }

/* Add a visit */
.step-num {
  display: inline-grid; place-items: center; width: 1.8rem; height: 1.8rem; margin-right: 0.35rem;
  border-radius: 50%; background: var(--ink); color: var(--panel); font-size: 1rem; vertical-align: 0.1em;
}
.consent { grid-template-columns: 1fr; }
.consent-check small { display: block; color: var(--steel); font-size: 0.9rem; margin-top: 0.15rem; }
.consent-check input[type=checkbox] { width: 1.4rem; height: 1.4rem; }
.consent-more .field { max-width: 320px; }
.issue-row { grid-template-columns: 1fr; gap: 0.9rem; }
.sev-pick legend { font-weight: 600; font-size: 0.9rem; margin-bottom: 0.35rem; }
.sev-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.5rem; }
.sev-option {
  display: flex; gap: 0.6rem; align-items: center; cursor: pointer;
  background: var(--panel); border: 2px solid var(--line); border-radius: var(--radius-small);
  padding: 0.6rem 0.75rem;
}
.sev-option input { width: 1.15rem; height: 1.15rem; flex: none; margin: 0; accent-color: var(--ink); }
.sev-option-text { display: flex; flex-direction: column; line-height: 1.25; }
.sev-option-text small { color: var(--steel); font-size: 0.82rem; }
.sev-option:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
.sev-option-urgent:has(input:checked) { border-color: var(--urgent); background: var(--urgent-bg); }
.sev-option-soon:has(input:checked) { border-color: var(--soon); background: var(--soon-bg); }
.sev-option-monitor:has(input:checked) { border-color: var(--monitor); background: var(--monitor-bg); }
.sev-option-urgent:has(input:checked) strong { color: var(--urgent); }
.sev-option-soon:has(input:checked) strong { color: var(--soon); }
.sev-option-monitor:has(input:checked) strong { color: var(--monitor); }
.issue-extra { display: flex; flex-wrap: wrap; gap: 0.75rem 1.5rem; align-items: flex-end; }
.issue-est { width: 11rem; }
.issue-date { padding-bottom: 0.65rem; }
.issue-date > summary { color: var(--ink-soft); font-weight: 400; }
.issue-date[open] { padding-bottom: 0; }
.issue-date[open] > summary { margin-bottom: 0.4rem; }

/* Reminders */
.send-bar { align-items: flex-start; }
.send-options { margin-top: 0.7rem; }
.send-options .field { max-width: 460px; }
.snooze { flex-wrap: wrap; align-items: center; font-size: 0.875rem; }

/* Help */
.help-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.help-toc { position: sticky; top: 1rem; padding: 1rem 1.1rem; }
.help-toc-title { font-weight: 700; margin-bottom: 0.4rem; }
.help-toc ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.2rem; font-size: 0.93rem; }
.help-toc a { text-decoration: none; display: block; padding: 0.2rem 0; }
.help-toc a:hover { text-decoration: underline; }
.help-content { min-width: 0; }
.help-content .panel { scroll-margin-top: 1rem; }
.help-content p, .help-content li, .help-content dd { max-width: 68ch; }
.help-intro { border-left: 8px solid var(--hivis); }
.help-steps { margin: 0.5rem 0 0.9rem; padding-left: 1.4rem; display: grid; gap: 0.6rem; }
.help-list { margin: 0.25rem 0 0.9rem; padding-left: 1.3rem; display: grid; gap: 0.45rem; }
.help-terms { margin: 0.5rem 0 1rem; display: grid; gap: 0.6rem; }
.help-terms div { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); gap: 1rem; align-items: baseline; }
.help-terms dd { margin: 0; }
.help-go { margin: 0.25rem 0 0; }
.faq { display: grid; gap: 0.5rem; }
.faq details { border: 1px solid var(--line); border-radius: var(--radius-small); padding: 0.7rem 0.95rem; background: var(--panel-2); }
.faq summary { font-weight: 600; }
.faq details[open] summary { margin-bottom: 0.5rem; }
.faq p { margin: 0; }

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 1100px) {
  .figures { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .help-layout { grid-template-columns: 1fr; }
  .help-toc { position: static; }
  .help-toc ul { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
  .compose { grid-template-columns: 1fr; }
  .preview { position: static; }
}

@media (max-width: 860px) {
  .shell { grid-template-columns: 1fr; }
  .sidebar { position: sticky; top: 0; height: auto; padding: 0; z-index: 5; }
  .sidebar-top { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem 1rem; }
  .shop-name { margin: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .nav-toggle {
    display: inline-block; background: none; color: var(--sidebar-ink);
    border: 1.5px solid rgba(255, 255, 255, 0.35); border-radius: var(--radius-small);
    padding: 0.35rem 0.75rem; font: inherit; cursor: pointer;
  }
  .js .nav, .js .signout { display: none; }
  .js .nav-open .nav, .js .nav-open .signout { display: flex; }
  .signout { padding: 0.75rem 1rem; }
  .main { padding-top: 1.25rem; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr 1fr; }
  .issue-row { grid-template-columns: 1fr 1fr; }
  .issue-row .issue-desc { grid-column: 1 / -1; }
  .consent { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .table thead { display: none; }
  .table, .table tbody { display: block; }
  .table tr { display: flex; flex-wrap: wrap; gap: 0.35rem 0.75rem; padding: 0.85rem 0; border-bottom: 1px solid var(--line); }
  .panel.flush .table tr { padding: 0.85rem 1rem; }
  .table td, .panel.flush .table td:first-child { display: block; border: 0; padding: 0; }
  .table td:empty { display: none; }
  .table .check-col { width: auto; order: -1; }
  .table td:nth-child(3), .table td:nth-child(4) { flex-basis: 100%; }
  .table .num { text-align: left; }
}

@media (max-width: 760px) {
  .today { grid-template-columns: 1fr; }
  .figures { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .sev-options { grid-template-columns: 1fr; }
  .help-terms div { grid-template-columns: 1fr; gap: 0.25rem; }
  .issue-est { width: 100%; }
  h1 { font-size: 1.6rem; }
  .figures { grid-template-columns: 1fr; }
  .grid-2, .grid-3, .grid-4, .issue-row { grid-template-columns: 1fr; }
  .panel { padding: 1rem; }
  .sheet { padding: 1.25rem; }
  .sheet-fields { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; transition: none !important; }
}

/* ── Billing & admin ────────────────────────────────────────── */
.trial-note { background: var(--ok-bg); border: 1px solid var(--ok); border-radius: var(--radius-small); padding: 0.6rem 0.85rem; }
.plan-status { border-left: 8px solid var(--line); }
.plan-trial { border-left-color: var(--hivis); }
.plan-active { border-left-color: var(--ok); }
.plan-problem { border-left-color: var(--urgent); }
.plan-kicker { color: var(--steel); font-weight: 600; margin-bottom: 0.2rem; }
.plan-status h2 { font-size: 1.7rem; }
.plan-status p { max-width: 68ch; }
.plan-price { font: 700 1.25rem/1.3 var(--font-head); margin-bottom: 1rem; }
.bays-form { display: grid; gap: 0.9rem; justify-items: start; }
.bays-row { display: flex; align-items: center; gap: 0.9rem; flex-wrap: wrap; }
.bays-row input { width: 6.5rem; font-size: 1.2rem; font-weight: 700; }
.bays-total { font-size: 1.1rem; }
.admin-state { font-weight: 700; font-size: 0.85rem; padding: 0.05rem 0.5rem; border-radius: 999px; background: var(--panel-2); border: 1px solid var(--line); white-space: nowrap; }
.admin-active { color: var(--ok); background: var(--ok-bg); border-color: transparent; }
.admin-trial { color: var(--soon); background: var(--soon-bg); border-color: transparent; }
.admin-past_due, .admin-locked { color: var(--urgent); background: var(--urgent-bg); border-color: transparent; }

.team-actions { display: flex; gap: 1rem; flex-wrap: wrap; }

.price-table { max-width: 560px; }
.price-table tr.price-current td { background: var(--soon-bg); }
.price-table .tag { margin-left: 0.35rem; }

.plan-contact { border-left: 8px solid var(--monitor); }
.price-contact { font-weight: 600; margin-top: 0.5rem; }
.selectable { user-select: all; }
.admin-custom { color: var(--monitor); font-weight: 600; }

/* ── Schedule ───────────────────────────────────────────────── */
.schedule-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem 1.5rem; margin-bottom: 0.5rem; }
.schedule-views { margin-bottom: 0; border-bottom: 0; }
.date-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; }
.date-jump input { width: auto; min-height: 2.25rem; padding: 0.25rem 0.5rem; }
.schedule-date { font-size: 1.5rem; margin: 0.75rem 0 0.15rem; }
.schedule-summary { color: var(--steel); margin-bottom: 1rem; }
.all-day h3, .no-bay h3 { margin-top: 0; }
.all-day-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0.6rem; }

.booking {
  display: flex; flex-direction: column; gap: 0.1rem; height: 100%;
  background: var(--panel); border: 1px solid var(--line); border-left: 5px solid var(--monitor);
  border-radius: var(--radius-small); padding: 0.4rem 0.55rem; color: var(--ink); text-decoration: none;
  font-size: 0.86rem; line-height: 1.3; overflow: hidden;
}
.booking:hover { border-color: var(--ink-soft); }
.booking-time { font-weight: 700; font-size: 0.8rem; color: var(--ink-soft); }
.booking-name { font-weight: 700; font-size: 0.95rem; }
.booking-car { display: flex; align-items: center; gap: 0.35rem; flex-wrap: wrap; color: var(--ink-soft); }
.booking-car .plate { font-size: 0.75rem; padding: 0 0.3rem; border-width: 1.5px; }
.booking-job { color: var(--steel); }
.booking-status { font-weight: 700; font-size: 0.78rem; margin-top: auto; }
.booking-arrived { border-left-color: var(--hivis); background: var(--soon-bg); }
.booking-done { border-left-color: var(--ok); background: var(--ok-bg); }
.booking-done .booking-name { text-decoration: line-through; text-decoration-thickness: 1px; }
.booking-cancelled, .booking-no_show { border-left-color: var(--steel); opacity: 0.7; }
.booking-clash { border-color: var(--urgent); border-left-color: var(--urgent); }

.day-grid-wrap { overflow-x: auto; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 1.25rem; }
.day-grid { display: grid; grid-template-rows: 2.4rem; grid-auto-rows: 1.2rem; min-width: 100%; position: relative; }
.g-head {
  position: sticky; top: 0; z-index: 3; background: var(--panel-2); border-bottom: 1.5px solid var(--line);
  font: 700 0.95rem/2.4rem var(--font-head); text-align: center;
}
.g-head.gc-1 { background: var(--panel-2); }
.g-time { font-size: 0.78rem; color: var(--steel); padding: 0.1rem 0.5rem 0 0; text-align: right; border-top: 1px solid var(--line); }
.g-slot { border-top: 1px solid var(--line); border-left: 1px solid var(--line); position: relative; }
.g-slot:hover, .g-slot:focus-visible { background: var(--panel-2); }
.g-slot:hover::after, .g-slot:focus-visible::after { content: '+ Book'; position: absolute; top: 0.2rem; left: 0.4rem; font-size: 0.8rem; font-weight: 700; color: var(--steel); }
.g-booking { z-index: 2; padding: 2px 3px; min-height: 0; }
.g-short .booking-car, .g-short .booking-job, .g-medium .booking-job { display: none; }
.g-short .booking { flex-direction: row; flex-wrap: wrap; column-gap: 0.4rem; align-items: baseline; padding-block: 0.15rem; }
.schedule-list-only { display: none; }
.agenda { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.cancelled-list summary { font-weight: 600; }
.cancelled-list .all-day-list { margin-top: 0.75rem; }

.week-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0.6rem; }
.week-day { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 0.6rem; display: flex; flex-direction: column; gap: 0.45rem; min-height: 10rem; min-width: 0; }
.week-today { border-color: var(--hivis); box-shadow: inset 0 4px 0 var(--hivis); }
.week-day-head { color: var(--ink); text-decoration: none; display: flex; gap: 0.35rem; align-items: baseline; }
.week-day-head span { color: var(--steel); font-size: 0.85rem; }
.week-add { margin-top: auto; font-size: 0.85rem; font-weight: 600; }

.linked-customer { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 1rem; font-size: 1.05rem; }
.status-actions .form-actions form { margin: 0; }
.status-booked { color: var(--monitor); background: var(--monitor-bg); }
.status-arrived { color: var(--soon); background: var(--soon-bg); }
.status-done { color: var(--ok); background: var(--ok-bg); }
.status-cancelled, .status-no_show { color: var(--steel); background: var(--panel-2); border: 1px solid var(--line); }
.today-bookings .rows li { grid-template-columns: minmax(0, 1fr) auto; }

.import-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 0 1.25rem; align-items: start; }
.import-card h3 { margin-top: 1.25rem; }
.import-card h2 + h3 { margin-top: 0.5rem; }
.how-to { margin: 0.75rem 0 0.25rem; }
.how-to summary { color: var(--link); font-weight: 600; font-size: 0.95rem; }
.how-to p { font-size: 0.93rem; margin: 0.5rem 0 0; }
.feed-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.75rem; }
.feed-list li { border: 1px solid var(--line); border-radius: var(--radius-small); padding: 0.6rem 0.75rem; }
.feed-list .sub { display: block; color: var(--steel); font-size: 0.88rem; }
.feed-actions { display: flex; gap: 1rem; align-items: center; margin-top: 0.4rem; }
.map-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0.75rem 1rem; margin-bottom: 0.75rem; }
.map-field { max-width: 420px; }
.row-error td { background: var(--urgent-bg); }

@media (max-width: 860px) {
  .schedule-grid-only { display: none; }
  .schedule-list-only { display: block; }
  .week-grid { grid-template-columns: 1fr; }
  .week-day { min-height: 0; }
}

/* Generated grid placement classes (the app's security policy blocks inline styles). */
.gc-1 { grid-column: 1; }
.gc-2 { grid-column: 2; }
.gc-3 { grid-column: 3; }
.gc-4 { grid-column: 4; }
.gc-5 { grid-column: 5; }
.gc-6 { grid-column: 6; }
.gc-7 { grid-column: 7; }
.gc-8 { grid-column: 8; }
.gc-9 { grid-column: 9; }
.gc-10 { grid-column: 10; }
.gc-11 { grid-column: 11; }
.gc-12 { grid-column: 12; }
.gc-13 { grid-column: 13; }
.cols-1 { grid-template-columns: 4.25rem repeat(1, minmax(9.5rem, 1fr)); }
.cols-2 { grid-template-columns: 4.25rem repeat(2, minmax(9.5rem, 1fr)); }
.cols-3 { grid-template-columns: 4.25rem repeat(3, minmax(9.5rem, 1fr)); }
.cols-4 { grid-template-columns: 4.25rem repeat(4, minmax(9.5rem, 1fr)); }
.cols-5 { grid-template-columns: 4.25rem repeat(5, minmax(9.5rem, 1fr)); }
.cols-6 { grid-template-columns: 4.25rem repeat(6, minmax(9.5rem, 1fr)); }
.cols-7 { grid-template-columns: 4.25rem repeat(7, minmax(9.5rem, 1fr)); }
.cols-8 { grid-template-columns: 4.25rem repeat(8, minmax(9.5rem, 1fr)); }
.cols-9 { grid-template-columns: 4.25rem repeat(9, minmax(9.5rem, 1fr)); }
.cols-10 { grid-template-columns: 4.25rem repeat(10, minmax(9.5rem, 1fr)); }
.cols-11 { grid-template-columns: 4.25rem repeat(11, minmax(9.5rem, 1fr)); }
.cols-12 { grid-template-columns: 4.25rem repeat(12, minmax(9.5rem, 1fr)); }
.rs-1 { grid-row-start: 1; }
.rs-2 { grid-row-start: 2; }
.rs-3 { grid-row-start: 3; }
.rs-4 { grid-row-start: 4; }
.rs-5 { grid-row-start: 5; }
.rs-6 { grid-row-start: 6; }
.rs-7 { grid-row-start: 7; }
.rs-8 { grid-row-start: 8; }
.rs-9 { grid-row-start: 9; }
.rs-10 { grid-row-start: 10; }
.rs-11 { grid-row-start: 11; }
.rs-12 { grid-row-start: 12; }
.rs-13 { grid-row-start: 13; }
.rs-14 { grid-row-start: 14; }
.rs-15 { grid-row-start: 15; }
.rs-16 { grid-row-start: 16; }
.rs-17 { grid-row-start: 17; }
.rs-18 { grid-row-start: 18; }
.rs-19 { grid-row-start: 19; }
.rs-20 { grid-row-start: 20; }
.rs-21 { grid-row-start: 21; }
.rs-22 { grid-row-start: 22; }
.rs-23 { grid-row-start: 23; }
.rs-24 { grid-row-start: 24; }
.rs-25 { grid-row-start: 25; }
.rs-26 { grid-row-start: 26; }
.rs-27 { grid-row-start: 27; }
.rs-28 { grid-row-start: 28; }
.rs-29 { grid-row-start: 29; }
.rs-30 { grid-row-start: 30; }
.rs-31 { grid-row-start: 31; }
.rs-32 { grid-row-start: 32; }
.rs-33 { grid-row-start: 33; }
.rs-34 { grid-row-start: 34; }
.rs-35 { grid-row-start: 35; }
.rs-36 { grid-row-start: 36; }
.rs-37 { grid-row-start: 37; }
.rs-38 { grid-row-start: 38; }
.rs-39 { grid-row-start: 39; }
.rs-40 { grid-row-start: 40; }
.rs-41 { grid-row-start: 41; }
.rs-42 { grid-row-start: 42; }
.rs-43 { grid-row-start: 43; }
.rs-44 { grid-row-start: 44; }
.rs-45 { grid-row-start: 45; }
.rs-46 { grid-row-start: 46; }
.rs-47 { grid-row-start: 47; }
.rs-48 { grid-row-start: 48; }
.rs-49 { grid-row-start: 49; }
.rs-50 { grid-row-start: 50; }
.rs-51 { grid-row-start: 51; }
.rs-52 { grid-row-start: 52; }
.rs-53 { grid-row-start: 53; }
.rs-54 { grid-row-start: 54; }
.rs-55 { grid-row-start: 55; }
.rs-56 { grid-row-start: 56; }
.rs-57 { grid-row-start: 57; }
.rs-58 { grid-row-start: 58; }
.rs-59 { grid-row-start: 59; }
.rs-60 { grid-row-start: 60; }
.rs-61 { grid-row-start: 61; }
.rs-62 { grid-row-start: 62; }
.rs-63 { grid-row-start: 63; }
.rs-64 { grid-row-start: 64; }
.rs-65 { grid-row-start: 65; }
.rs-66 { grid-row-start: 66; }
.rs-67 { grid-row-start: 67; }
.rs-68 { grid-row-start: 68; }
.rs-69 { grid-row-start: 69; }
.rs-70 { grid-row-start: 70; }
.rs-71 { grid-row-start: 71; }
.rs-72 { grid-row-start: 72; }
.rs-73 { grid-row-start: 73; }
.rs-74 { grid-row-start: 74; }
.rs-75 { grid-row-start: 75; }
.rs-76 { grid-row-start: 76; }
.rs-77 { grid-row-start: 77; }
.rs-78 { grid-row-start: 78; }
.rs-79 { grid-row-start: 79; }
.rs-80 { grid-row-start: 80; }
.rs-81 { grid-row-start: 81; }
.rs-82 { grid-row-start: 82; }
.rs-83 { grid-row-start: 83; }
.rs-84 { grid-row-start: 84; }
.rs-85 { grid-row-start: 85; }
.rs-86 { grid-row-start: 86; }
.rs-87 { grid-row-start: 87; }
.rs-88 { grid-row-start: 88; }
.rs-89 { grid-row-start: 89; }
.rs-90 { grid-row-start: 90; }
.rs-91 { grid-row-start: 91; }
.rs-92 { grid-row-start: 92; }
.rs-93 { grid-row-start: 93; }
.rs-94 { grid-row-start: 94; }
.rs-95 { grid-row-start: 95; }
.rs-96 { grid-row-start: 96; }
.rs-97 { grid-row-start: 97; }
.rs-98 { grid-row-start: 98; }
.rs-99 { grid-row-start: 99; }
.rs-100 { grid-row-start: 100; }
.sp-1 { grid-row-end: span 1; }
.sp-2 { grid-row-end: span 2; }
.sp-3 { grid-row-end: span 3; }
.sp-4 { grid-row-end: span 4; }
.sp-5 { grid-row-end: span 5; }
.sp-6 { grid-row-end: span 6; }
.sp-7 { grid-row-end: span 7; }
.sp-8 { grid-row-end: span 8; }
.sp-9 { grid-row-end: span 9; }
.sp-10 { grid-row-end: span 10; }
.sp-11 { grid-row-end: span 11; }
.sp-12 { grid-row-end: span 12; }
.sp-13 { grid-row-end: span 13; }
.sp-14 { grid-row-end: span 14; }
.sp-15 { grid-row-end: span 15; }
.sp-16 { grid-row-end: span 16; }
.sp-17 { grid-row-end: span 17; }
.sp-18 { grid-row-end: span 18; }
.sp-19 { grid-row-end: span 19; }
.sp-20 { grid-row-end: span 20; }
.sp-21 { grid-row-end: span 21; }
.sp-22 { grid-row-end: span 22; }
.sp-23 { grid-row-end: span 23; }
.sp-24 { grid-row-end: span 24; }
.sp-25 { grid-row-end: span 25; }
.sp-26 { grid-row-end: span 26; }
.sp-27 { grid-row-end: span 27; }
.sp-28 { grid-row-end: span 28; }
.sp-29 { grid-row-end: span 29; }
.sp-30 { grid-row-end: span 30; }
.sp-31 { grid-row-end: span 31; }
.sp-32 { grid-row-end: span 32; }
.sp-33 { grid-row-end: span 33; }
.sp-34 { grid-row-end: span 34; }
.sp-35 { grid-row-end: span 35; }
.sp-36 { grid-row-end: span 36; }
.sp-37 { grid-row-end: span 37; }
.sp-38 { grid-row-end: span 38; }
.sp-39 { grid-row-end: span 39; }
.sp-40 { grid-row-end: span 40; }
.sp-41 { grid-row-end: span 41; }
.sp-42 { grid-row-end: span 42; }
.sp-43 { grid-row-end: span 43; }
.sp-44 { grid-row-end: span 44; }
.sp-45 { grid-row-end: span 45; }
.sp-46 { grid-row-end: span 46; }
.sp-47 { grid-row-end: span 47; }
.sp-48 { grid-row-end: span 48; }
.sp-49 { grid-row-end: span 49; }
.sp-50 { grid-row-end: span 50; }
.sp-51 { grid-row-end: span 51; }
.sp-52 { grid-row-end: span 52; }
.sp-53 { grid-row-end: span 53; }
.sp-54 { grid-row-end: span 54; }
.sp-55 { grid-row-end: span 55; }
.sp-56 { grid-row-end: span 56; }
.sp-57 { grid-row-end: span 57; }
.sp-58 { grid-row-end: span 58; }
.sp-59 { grid-row-end: span 59; }
.sp-60 { grid-row-end: span 60; }
.sp-61 { grid-row-end: span 61; }
.sp-62 { grid-row-end: span 62; }
.sp-63 { grid-row-end: span 63; }
.sp-64 { grid-row-end: span 64; }
.sp-65 { grid-row-end: span 65; }
.sp-66 { grid-row-end: span 66; }
.sp-67 { grid-row-end: span 67; }
.sp-68 { grid-row-end: span 68; }
.sp-69 { grid-row-end: span 69; }
.sp-70 { grid-row-end: span 70; }
.sp-71 { grid-row-end: span 71; }
.sp-72 { grid-row-end: span 72; }
.sp-73 { grid-row-end: span 73; }
.sp-74 { grid-row-end: span 74; }
.sp-75 { grid-row-end: span 75; }
.sp-76 { grid-row-end: span 76; }
.sp-77 { grid-row-end: span 77; }
.sp-78 { grid-row-end: span 78; }
.sp-79 { grid-row-end: span 79; }
.sp-80 { grid-row-end: span 80; }
.sp-81 { grid-row-end: span 81; }
.sp-82 { grid-row-end: span 82; }
.sp-83 { grid-row-end: span 83; }
.sp-84 { grid-row-end: span 84; }
.sp-85 { grid-row-end: span 85; }
.sp-86 { grid-row-end: span 86; }
.sp-87 { grid-row-end: span 87; }
.sp-88 { grid-row-end: span 88; }
.sp-89 { grid-row-end: span 89; }
.sp-90 { grid-row-end: span 90; }
.sp-91 { grid-row-end: span 91; }
.sp-92 { grid-row-end: span 92; }
.sp-93 { grid-row-end: span 93; }
.sp-94 { grid-row-end: span 94; }
.sp-95 { grid-row-end: span 95; }
.sp-96 { grid-row-end: span 96; }

.schedule-list-only h3, .panel > h3:first-child { margin-top: 0; }

/* ── Public website ─────────────────────────────────────────── */
.auth-footer { margin-top: 1.5rem; text-align: center; font-size: 0.875rem; color: var(--steel); }
.auth-footer a { color: var(--steel); }

.site-body { display: flex; flex-direction: column; min-height: 100vh; }
.site-main { flex: 1; }
.site-wrap { width: 100%; max-width: 1080px; margin: 0 auto; padding: 0 1rem; }
.site-narrow { max-width: 760px; }

.site-header { background: var(--panel); border-bottom: 1px solid var(--line); }
.site-header-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.5rem 1rem; padding-top: 0.75rem; padding-bottom: 0.75rem; }
.site-brand { margin: 0; text-decoration: none; font-family: var(--font-head); font-weight: 700; }
.site-nav { display: flex; align-items: center; flex-wrap: wrap; gap: 0.25rem 1.1rem; }
.site-nav a:not(.button) { color: var(--ink); text-decoration: none; font-weight: 600; }
.site-nav a:not(.button):hover, .site-nav a[aria-current='page'] { text-decoration: underline; text-decoration-thickness: 2px; }

.button-hivis { background: var(--hivis); color: var(--hivis-ink); border-color: var(--hivis); }
.button-hivis:hover { background: #ffd84a; border-color: #ffd84a; }
.button-ghost { background: transparent; color: inherit; border-color: currentColor; }
.button-ghost:hover { background: rgba(255, 255, 255, 0.08); }

.site-hero { background: var(--sidebar); color: var(--sidebar-ink); padding: 4rem 0 3.5rem; border-bottom: 6px solid var(--hivis); }
.site-hero h1 { font-size: clamp(2.1rem, 6vw, 3.4rem); max-width: 18ch; margin-bottom: 1rem; }
.site-kicker { text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.8rem; font-weight: 700; color: var(--hivis); margin-bottom: 0.75rem; }
.site-hero-lede { font-size: 1.15rem; max-width: 60ch; color: var(--sidebar-ink); opacity: 0.92; }
.site-hero-note { margin-top: 1rem; color: var(--sidebar-dim); }
.site-cta { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.5rem; }

.site-section { padding: 3rem 0; }
.site-section-alt { background: var(--panel); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.site-section h2 { font-size: 1.75rem; margin-bottom: 1.25rem; }
.site-section h1 + .lede, .site-section h1 + .muted { margin-bottom: 1.5rem; }
.site-section .site-narrow > h2:not(:first-child) { margin-top: 2rem; }

.site-steps { list-style: none; counter-reset: step; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.25rem; }
.site-steps li { counter-increment: step; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.25rem 1.25rem 1rem; }
.site-steps li::before {
  content: counter(step); display: inline-flex; align-items: center; justify-content: center;
  width: 2rem; height: 2rem; border-radius: 50%; background: var(--hivis); color: var(--hivis-ink);
  font-family: var(--font-head); font-weight: 700; margin-bottom: 0.6rem;
}
.site-steps h3, .site-features h3 { margin-top: 0; font-size: 1.15rem; }
.site-steps p, .site-features p { margin: 0; color: var(--ink-soft); }

.site-features { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem 2rem; }
.site-features li { border-left: 4px solid var(--hivis); padding-left: 1rem; }

.site-price-table { max-width: none; background: var(--panel); }
.price-contact { font-weight: 600; }

.site-faq dt { font-family: var(--font-head); font-weight: 700; font-size: 1.1rem; margin-top: 1.25rem; }
.site-faq dd { margin: 0.3rem 0 0; color: var(--ink-soft); }
.site-list { padding-left: 1.2rem; }
.site-list li { margin-bottom: 0.35rem; }
.site-contact-email { font-size: 1.4rem; font-weight: 700; overflow-wrap: anywhere; }

.legal h2 { font-size: 1.25rem; margin: 2rem 0 0.6rem; }
.legal ul { padding-left: 1.2rem; }
.legal li { margin-bottom: 0.45rem; }
.legal p, .legal li { max-width: 72ch; }

.site-footer { background: var(--sidebar); color: var(--sidebar-dim); padding: 2rem 0; font-size: 0.9rem; }
.site-footer-row { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 1.5rem; }
.site-footer-row > div { max-width: 46ch; }
.site-footer-brand { color: var(--sidebar-ink); font-family: var(--font-head); font-weight: 700; font-size: 1.1rem; }
.site-footer .muted { color: var(--sidebar-dim); }
.site-footer nav { display: flex; flex-direction: column; gap: 0.35rem; }
.site-footer a { color: var(--sidebar-ink); }

@media (max-width: 560px) {
  .site-hero { padding: 2.5rem 0; }
  .site-cta .button { width: 100%; }
  .site-section { padding: 2.25rem 0; }
}

/* Price tables are only three short columns, so they stay as real tables on phones. */
@media (max-width: 700px) {
  .table.price-table { display: table; width: 100%; }
  .price-table thead { display: table-header-group; }
  .price-table tbody { display: table-row-group; }
  .price-table tr, .panel.flush .price-table tr { display: table-row; padding: 0; }
  .price-table th, .price-table td, .panel.flush .price-table td:first-child { display: table-cell; padding: 0.55rem 0.5rem; border-bottom: 1px solid var(--line); }
  .price-table .num { text-align: right; }
}