@import url("assets/brand.css");
@import url("tokens/fonts.css");
@import url("tokens/colors.css");
@import url("tokens/typography.css");
@import url("tokens/spacing.css");
@import url("tokens/radius.css");
@import url("tokens/elevation.css");
@import url("tokens/motion.css");
@import url("tokens/base.css");

/* ── MedConsult theme layer: corporate trust, navy & charcoal, switchable ─────
   Every value below is composed from the Civic tokens and the customer's --brand-* tokens
   (colour-mixed where a dark surface is needed). Both themes are measured for WCAG AA. */
:root{
  --df-font-core:var(--brand-font-body);
  --font-heading:var(--brand-font-heading);
  --c-bg:var(--brand-background);
  --c-surface:var(--df-white);
  --c-surface-2:var(--df-navy-100);
  --c-text:var(--brand-text);
  --c-muted:color-mix(in srgb, var(--df-ink-muted) 80%, var(--df-ink) 20%);
  --c-heading:var(--df-navy-700);
  --c-border:color-mix(in srgb, var(--df-navy-100) 70%, var(--df-navy-300) 30%);
  --c-accent:var(--df-navy-500);
  --c-accent-fill:var(--df-navy-700);
  --c-on-accent:var(--df-white);
  --c-accent-soft:color-mix(in srgb, var(--df-navy-500) 12%, var(--df-white));
  --c-danger:color-mix(in srgb, var(--df-orange-600) 78%, var(--df-ink) 22%);
  --c-danger-soft:var(--df-orange-100);
  --c-warn:color-mix(in srgb, var(--df-amber-600) 55%, var(--df-ink) 45%);
  --c-warn-soft:var(--df-amber-100);
  --c-ok:color-mix(in srgb, var(--df-teal-600) 65%, var(--df-ink) 35%);
  --c-ok-soft:var(--df-teal-100);
  --c-nav-bg:color-mix(in srgb, var(--df-ink) 62%, var(--brand-primary) 38%);
  --c-nav-text:var(--df-white);
  --c-nav-muted:var(--df-text-on-navy-muted);
  --c-nav-border:var(--df-border-on-navy);
  --c-logo-tile:var(--df-white);
  --c-scrim:var(--df-scrim);
  --c-shadow:var(--df-shadow-2);
  --c-skeleton:var(--df-navy-100);
  color-scheme:light;
}
[data-theme="dark"]{
  --c-bg:color-mix(in srgb, var(--df-ink) 86%, var(--brand-primary) 14%);
  --c-surface:color-mix(in srgb, var(--df-ink) 72%, var(--brand-primary) 28%);
  --c-surface-2:color-mix(in srgb, var(--df-ink) 58%, var(--brand-primary) 42%);
  --c-text:var(--df-white);
  --c-muted:color-mix(in srgb, var(--df-navy-300) 85%, var(--df-white) 15%);
  --c-heading:var(--df-white);
  --c-border:color-mix(in srgb, var(--df-ink) 45%, var(--brand-primary) 55%);
  --c-accent:var(--brand-accent);
  --c-accent-fill:var(--brand-accent);
  --c-on-accent:var(--df-ink);
  --c-accent-soft:color-mix(in srgb, var(--brand-accent) 18%, var(--c-surface));
  --c-danger:color-mix(in srgb, var(--df-orange-500) 80%, var(--df-white) 20%);
  --c-danger-soft:color-mix(in srgb, var(--df-orange-500) 20%, var(--c-surface));
  --c-warn:var(--df-amber-500);
  --c-warn-soft:color-mix(in srgb, var(--df-amber-500) 18%, var(--c-surface));
  --c-ok:var(--df-teal-300);
  --c-ok-soft:color-mix(in srgb, var(--df-teal-500) 18%, var(--c-surface));
  --c-nav-bg:color-mix(in srgb, var(--df-ink) 92%, var(--brand-primary) 8%);
  --c-nav-text:var(--df-white);
  --c-nav-muted:var(--df-navy-300);
  --c-nav-border:var(--df-border-on-navy);
  --c-scrim:color-mix(in srgb, var(--df-ink) 70%, transparent);
  --c-shadow:0 8px 24px color-mix(in srgb, var(--df-ink) 60%, transparent);
  --c-skeleton:var(--c-surface-2);
  color-scheme:dark;
}
html{scroll-behavior:smooth}
body{background:var(--c-bg);color:var(--c-text);font:var(--df-type-body);min-height:100vh;overflow-x:hidden}
h1,h2,h3,h4{color:var(--c-heading);font-family:var(--font-heading)}
h1{font-size:var(--df-size-title-1);line-height:var(--df-leading-tight);font-weight:var(--df-weight-bold)}
h2{font-size:var(--df-size-title-2);font-weight:var(--df-weight-bold)}
h3{font-size:var(--df-size-headline);font-family:var(--df-font-core);font-weight:var(--df-weight-bold)}
h4{font-size:var(--df-size-body);font-family:var(--df-font-core);font-weight:var(--df-weight-semibold)}
a{color:var(--c-accent)}a:hover{color:var(--c-text)}
img,svg{max-width:100%}
code,pre{overflow-wrap:anywhere}
input[type="time"],input[type="date"]{min-width:0}
button{font:inherit;color:inherit}
:focus-visible{outline:var(--df-focus-width) solid var(--c-accent);outline-offset:var(--df-focus-offset)}
[hidden]{display:none !important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ── Icons ── */
.icon{width:var(--df-space-5);height:var(--df-space-5);stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:middle}
.icon-sm{width:var(--df-space-4);height:var(--df-space-4)}
.icon-lg{width:var(--df-space-8);height:var(--df-space-8)}

/* ── Layout primitives ── */
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--df-gutter-mobile)}
@media(min-width:900px){.container{padding:0 var(--df-gutter-wide)}}
.stack{display:flex;flex-direction:column;gap:var(--df-space-4)}
.stack-sm{display:flex;flex-direction:column;gap:var(--df-space-2)}
.row{display:flex;align-items:center;gap:var(--df-space-3);flex-wrap:wrap}
.row-between{display:flex;align-items:center;justify-content:space-between;gap:var(--df-space-3);flex-wrap:wrap}
.grid{display:grid;gap:var(--df-space-4)}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.grid-4{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
.muted{color:var(--c-muted)}
.small{font:var(--df-type-caption);color:var(--c-muted)}
.eyebrow{font:var(--df-type-eyebrow);letter-spacing:var(--df-tracking-eyebrow);text-transform:uppercase;color:var(--c-accent)}
.price{white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:var(--df-weight-bold)}
.num{font-variant-numeric:tabular-nums}
.mt-2{margin-top:var(--df-space-2)}.mt-4{margin-top:var(--df-space-4)}.mt-6{margin-top:var(--df-space-6)}.mt-8{margin-top:var(--df-space-8)}
.mb-2{margin-bottom:var(--df-space-2)}.mb-4{margin-bottom:var(--df-space-4)}.mb-6{margin-bottom:var(--df-space-6)}
.section{padding:var(--df-space-16) 0}
.section-head{margin-bottom:var(--df-space-8)}
.section-head p{margin-top:var(--df-space-2);color:var(--c-muted);max-width:60ch}

/* ── Cards ── */
.card{background:var(--c-surface);border:var(--df-border-width) solid var(--c-border);border-radius:var(--df-radius-lg);padding:var(--df-space-5);box-shadow:var(--df-shadow-1)}
.card-flush{padding:0;overflow:hidden}
.card h3{margin-bottom:var(--df-space-2)}
.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--df-space-3);margin-bottom:var(--df-space-3)}
.card-equal{display:flex;flex-direction:column;height:100%}
.card-equal .card-body{flex:1}
.kpi{display:flex;flex-direction:column;gap:var(--df-space-1)}
.kpi .kpi-value{font-size:var(--df-size-title-1);font-weight:var(--df-weight-extrabold);line-height:1;color:var(--c-heading);font-variant-numeric:tabular-nums}
.kpi .kpi-label{font:var(--df-type-label);color:var(--c-muted)}

/* ── Buttons ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--df-space-2);min-height:var(--df-hit-min);padding:var(--df-space-2) var(--df-space-5);border-radius:var(--df-radius-md);border:var(--df-border-width) solid transparent;font-weight:var(--df-weight-semibold);cursor:pointer;text-decoration:none;transition:var(--df-transition-control);background:var(--c-surface-2);color:var(--c-text);white-space:nowrap}
.btn:hover{background:var(--c-border)}
.btn:active{transform:scale(var(--df-press-scale))}
.btn:disabled,.btn[aria-busy="true"]{opacity:.6;cursor:progress}
.btn-primary{background:var(--c-accent-fill);color:var(--c-on-accent)}
.btn-primary:hover{background:color-mix(in srgb, var(--c-accent-fill) 85%, var(--c-text) 15%)}
.btn-outline{background:transparent;border-color:var(--c-border);color:var(--c-text)}
.btn-outline:hover{background:var(--c-surface-2)}
.btn-ghost{background:transparent;color:var(--c-accent)}
.btn-ghost:hover{background:var(--c-accent-soft)}
.btn-danger{background:var(--c-danger-soft);color:var(--c-danger);border-color:transparent}
.btn-danger:hover{background:color-mix(in srgb, var(--c-danger) 25%, var(--c-surface))}
.btn-sm{min-height:var(--df-space-10);padding:var(--df-space-1) var(--df-space-3);font:var(--df-type-label);font-weight:var(--df-weight-semibold)}
.btn-lg{min-height:var(--df-space-12);padding:var(--df-space-3) var(--df-space-8);font-size:var(--df-size-body-lg)}
.btn-block{width:100%}
.btn-icon{width:var(--df-hit-min);padding:0}
.hero-band .btn-primary{background:var(--brand-accent);color:var(--df-ink)}
.hero-band .btn-primary:hover{background:color-mix(in srgb, var(--brand-accent) 85%, var(--df-white) 15%)}
.hero-band .btn-outline{border-color:var(--df-border-on-navy);color:var(--df-white)}
.hero-band .btn-outline:hover{background:color-mix(in srgb, var(--df-white) 12%, transparent)}

/* ── Badges & status ── */
.badge{display:inline-flex;align-items:center;gap:var(--df-space-1);padding:2px var(--df-space-2);border-radius:var(--df-radius-pill);font:var(--df-type-caption);font-weight:var(--df-weight-semibold);background:var(--c-surface-2);color:var(--c-text);white-space:nowrap}
.badge-ok{background:var(--c-ok-soft);color:var(--c-ok)}
.badge-warn{background:var(--c-warn-soft);color:var(--c-warn)}
.badge-danger{background:var(--c-danger-soft);color:var(--c-danger)}
.badge-accent{background:var(--c-accent-soft);color:var(--c-accent)}
.dot{width:var(--df-space-2);height:var(--df-space-2);border-radius:var(--df-radius-pill);background:currentColor;display:inline-block}

/* ── Forms ── */
.field{display:flex;flex-direction:column;gap:var(--df-space-1)}
.field label,.label{font:var(--df-type-label);color:var(--c-text)}
.field .help{font:var(--df-type-caption);color:var(--c-muted)}
.field .error{font:var(--df-type-caption);color:var(--c-danger)}
.input,select,textarea,input[type="text"],input[type="email"],input[type="tel"],input[type="date"],input[type="time"],input[type="number"],input[type="search"],input[type="password"]{width:100%;min-height:var(--df-hit-min);padding:var(--df-space-2) var(--df-space-3);border:var(--df-border-width) solid var(--c-border);border-radius:var(--df-radius-md);background:var(--c-surface);color:var(--c-text);font:inherit;transition:var(--df-transition-control)}
textarea{min-height:calc(var(--df-hit-min) * 2.2);resize:vertical}
.input:focus,select:focus,textarea:focus,input:focus{border-color:var(--c-accent);outline:var(--df-focus-width) solid color-mix(in srgb, var(--c-accent) 35%, transparent);outline-offset:0}
.field.invalid .input,.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:var(--c-danger)}
.check{display:flex;gap:var(--df-space-3);align-items:flex-start;min-height:var(--df-hit-min);padding:var(--df-space-2) 0;cursor:pointer}
.check input{width:var(--df-space-5);height:var(--df-space-5);margin-top:2px;flex:none;accent-color:var(--c-accent-fill)}
.form-grid{display:grid;gap:var(--df-space-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.form-actions{display:flex;gap:var(--df-space-3);justify-content:flex-end;flex-wrap:wrap;margin-top:var(--df-space-4)}
.error-summary{background:var(--c-danger-soft);color:var(--c-danger);border-radius:var(--df-radius-md);padding:var(--df-space-3) var(--df-space-4);font:var(--df-type-label)}
.error-summary ul{margin:var(--df-space-1) 0 0;padding-left:var(--df-space-5)}
.scale{display:flex;gap:var(--df-space-2);flex-wrap:wrap}
.scale label{display:inline-flex;align-items:center;justify-content:center;min-width:var(--df-hit-min);min-height:var(--df-hit-min);padding:0 var(--df-space-3);border:var(--df-border-width) solid var(--c-border);border-radius:var(--df-radius-md);cursor:pointer;font-weight:var(--df-weight-semibold)}
.scale input{position:absolute;opacity:0;width:1px;height:1px}
.scale input:checked + span,.scale label.on{background:var(--c-accent-fill);color:var(--c-on-accent);border-color:var(--c-accent-fill)}
.scale label.on{border-color:var(--c-accent-fill)}
.chips{display:flex;gap:var(--df-space-2);flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:var(--df-space-1);min-height:var(--df-space-10);padding:var(--df-space-1) var(--df-space-3);border-radius:var(--df-radius-pill);border:var(--df-border-width) solid var(--c-border);background:var(--c-surface);cursor:pointer;font:var(--df-type-label)}
.chip.on,.chip[aria-pressed="true"]{background:var(--c-accent-fill);color:var(--c-on-accent);border-color:var(--c-accent-fill)}

/* ── Tables ── */
.table-wrap{overflow-x:auto;border:var(--df-border-width) solid var(--c-border);border-radius:var(--df-radius-lg);background:var(--c-surface)}
table.table{width:100%;border-collapse:collapse;font:var(--df-type-body);min-width:560px}
.table th,.table td{padding:var(--df-space-3) var(--df-space-4);text-align:left;border-bottom:var(--df-border-width) solid var(--c-border);vertical-align:middle}
.table th{position:sticky;top:0;background:var(--c-surface-2);font:var(--df-type-label);color:var(--c-muted);cursor:pointer;user-select:none;white-space:nowrap;z-index:1}
.table th[aria-sort="ascending"],.table th[aria-sort="descending"]{color:var(--c-accent)}
.table tbody tr:hover{background:var(--c-accent-soft)}
.table td.num,.table th.num{text-align:right;font-variant-numeric:tabular-nums}
.table-toolbar{display:flex;gap:var(--df-space-3);align-items:center;justify-content:space-between;flex-wrap:wrap;padding:var(--df-space-3) var(--df-space-4);border-bottom:var(--df-border-width) solid var(--c-border)}
.table-toolbar input{max-width:320px}
.table-foot{display:flex;justify-content:space-between;align-items:center;gap:var(--df-space-3);padding:var(--df-space-3) var(--df-space-4);font:var(--df-type-caption);color:var(--c-muted);flex-wrap:wrap}

/* ── States ── */
.skeleton{display:block;height:var(--df-space-5);border-radius:var(--df-radius-xs);background:linear-gradient(90deg,var(--c-skeleton),var(--c-surface),var(--c-skeleton));background-size:200% 100%;animation:shimmer 1.2s linear infinite;margin-bottom:var(--df-space-3)}
@keyframes shimmer{to{background-position:-200% 0}}
.empty{text-align:center;padding:var(--df-space-10) var(--df-space-5);color:var(--c-muted);display:flex;flex-direction:column;align-items:center;gap:var(--df-space-3)}
.empty .icon{width:var(--df-space-10);height:var(--df-space-10);color:var(--c-accent)}
.error-state{background:var(--c-danger-soft);color:var(--c-danger);padding:var(--df-space-4);border-radius:var(--df-radius-md);display:flex;justify-content:space-between;gap:var(--df-space-3);align-items:center;flex-wrap:wrap}

/* ── Toasts & dialogs ── */
.toast-host{position:fixed;left:50%;bottom:var(--df-space-5);transform:translateX(-50%);display:flex;flex-direction:column;gap:var(--df-space-2);z-index:1000;width:min(92vw,480px)}
.toast{background:var(--c-nav-bg);color:var(--c-nav-text);border:var(--df-border-width) solid var(--c-nav-border);border-radius:var(--df-radius-md);padding:var(--df-space-3) var(--df-space-4);box-shadow:var(--c-shadow);display:flex;gap:var(--df-space-3);align-items:center;font:var(--df-type-label)}
.toast-error{border-color:var(--c-danger)}
.toast-ok{border-color:var(--df-teal-300)}
dialog.dlg{border:none;border-radius:var(--df-radius-xl);background:var(--c-surface);color:var(--c-text);padding:0;width:min(94vw,560px);box-shadow:var(--df-shadow-3)}
dialog.dlg::backdrop{background:var(--c-scrim)}
.dlg-body{padding:var(--df-space-6)}
.dlg-head{display:flex;justify-content:space-between;align-items:center;gap:var(--df-space-3);margin-bottom:var(--df-space-4)}

/* ── Public shell ── */
.topnav{position:sticky;top:0;z-index:50;background:var(--c-nav-bg);color:var(--c-nav-text);border-bottom:var(--df-border-width) solid var(--c-nav-border)}
.topnav .container{display:flex;align-items:center;justify-content:space-between;gap:var(--df-space-4);min-height:calc(var(--df-header-height) + var(--df-space-2))}
.brand{display:flex;align-items:center;gap:var(--df-space-3);color:var(--c-nav-text);text-decoration:none;font-weight:var(--df-weight-extrabold);letter-spacing:var(--df-tracking-wordmark);font-size:var(--df-size-headline)}
.brand .logo-tile{width:var(--df-space-10);height:var(--df-space-10);border-radius:var(--df-radius-sm);background:var(--c-logo-tile);display:grid;place-items:center;color:var(--df-navy-700)}
.brand .logo-tile img{width:var(--df-space-6);height:var(--df-space-6)}
.nav-links{display:flex;gap:var(--df-space-1);align-items:center;list-style:none;margin:0;padding:0}
.nav-links a,.nav-links button{color:var(--c-nav-muted);text-decoration:none;padding:var(--df-space-2) var(--df-space-3);border-radius:var(--df-radius-sm);min-height:var(--df-hit-min);display:inline-flex;align-items:center;gap:var(--df-space-2);font:var(--df-type-label);background:transparent;border:none;cursor:pointer}
.nav-links a:hover,.nav-links a.active,.nav-links button:hover{color:var(--c-nav-text);background:color-mix(in srgb, var(--df-white) 10%, transparent)}
.nav-toggle{display:none}
@media(max-width:820px){
  .nav-links{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;background:var(--c-nav-bg);padding:var(--df-space-3) var(--df-gutter-mobile) var(--df-space-5);border-bottom:var(--df-border-width) solid var(--c-nav-border)}
  .nav-links.open{display:flex}
  .nav-toggle{display:inline-flex}
}
.hero-band{position:relative;color:var(--df-white);background:var(--df-navy-900) url('/assets/stock-1.jpg') center/cover no-repeat;isolation:isolate}
.hero-band::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg, color-mix(in srgb, var(--df-ink) 94%, transparent) 0%, color-mix(in srgb, var(--df-ink) 84%, transparent) 55%, color-mix(in srgb, var(--df-ink) 55%, transparent) 100%);z-index:-1}
.hero{padding:var(--df-space-20) 0 var(--df-space-16);display:grid;gap:var(--df-space-8);grid-template-columns:1fr}
.hero h1{color:var(--df-white);font-size:clamp(3rem, 6vw, 4.25rem);line-height:1.02;letter-spacing:var(--df-tracking-display);max-width:16ch}
.hero .lede{font-size:var(--df-size-body-lg);color:var(--df-text-on-navy-muted);max-width:56ch;margin-top:var(--df-space-5)}
.hero .cta{display:flex;gap:var(--df-space-3);flex-wrap:wrap;margin-top:var(--df-space-8)}
.hero .eyebrow{color:var(--brand-accent)}
.hero-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--df-space-3);margin-top:var(--df-space-10)}
.hero-stat{background:color-mix(in srgb, var(--df-white) 8%, transparent);border:var(--df-border-width) solid var(--df-border-on-navy);border-radius:var(--df-radius-md);padding:var(--df-space-3) var(--df-space-4)}
.hero-stat b{display:block;font-size:var(--df-size-title-2);color:var(--df-white);font-variant-numeric:tabular-nums}
.hero-stat span{font:var(--df-type-caption);color:var(--df-text-on-navy-muted)}
.photo{border-radius:var(--df-radius-tile);overflow:hidden;aspect-ratio:4/3;background:var(--c-surface-2)}
.photo img{width:100%;height:100%;object-fit:cover;display:block}
.feature{display:flex;gap:var(--df-space-4);align-items:flex-start}
.feature .icon-tile{flex:none;width:var(--df-space-12);height:var(--df-space-12);border-radius:var(--df-radius-md);background:var(--c-accent-soft);color:var(--c-accent);display:grid;place-items:center}
.steps{counter-reset:s;display:grid;gap:var(--df-space-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.step{counter-increment:s;position:relative;padding-top:var(--df-space-8)}
.step::before{content:counter(s);position:absolute;top:0;left:0;width:var(--df-space-8);height:var(--df-space-8);border-radius:var(--df-radius-pill);background:var(--c-accent-fill);color:var(--c-on-accent);display:grid;place-items:center;font-weight:var(--df-weight-bold);font-variant-numeric:tabular-nums}
.pricing-card{display:grid;grid-template-rows:auto 1fr auto;gap:var(--df-space-3);height:100%}
.pricing-card .price-row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--df-space-4)}
.pricing-card .price{font-size:var(--df-size-title-2);color:var(--c-heading)}
footer.site-footer{background:var(--c-nav-bg);color:var(--c-nav-muted);padding:var(--df-space-12) 0 var(--df-space-8);margin-top:var(--df-space-16)}
footer.site-footer h4{color:var(--c-nav-text);font-family:var(--df-font-core)}
footer.site-footer a{color:var(--c-nav-muted)}footer.site-footer a:hover{color:var(--c-nav-text)}
footer .trust{display:flex;gap:var(--df-space-3);flex-wrap:wrap;margin-top:var(--df-space-4)}
footer .trust .badge{background:color-mix(in srgb, var(--df-white) 10%, transparent);color:var(--c-nav-text)}
.page{padding:var(--df-space-8) 0 var(--df-space-16)}
.page-head{margin-bottom:var(--df-space-6)}
.page-head p{color:var(--c-muted);margin-top:var(--df-space-2);max-width:70ch}

/* ── Admin console shell ── */
.admin{display:grid;grid-template-columns:260px 1fr;min-height:100vh}
.sidebar{background:var(--c-nav-bg);color:var(--c-nav-text);padding:var(--df-space-5) var(--df-space-4);display:flex;flex-direction:column;gap:var(--df-space-6);position:sticky;top:0;height:100vh;overflow-y:auto}
.sidebar .brand{padding:0 var(--df-space-2)}
.sidebar .eyebrow{color:var(--c-nav-muted);padding:0 var(--df-space-3)}
.sidenav{display:flex;flex-direction:column;gap:2px;list-style:none;margin:0;padding:0}
.sidenav a{display:flex;align-items:center;gap:var(--df-space-3);padding:var(--df-space-2) var(--df-space-3);min-height:var(--df-hit-min);border-radius:var(--df-radius-sm);color:var(--c-nav-muted);text-decoration:none;font:var(--df-type-label)}
.sidenav a:hover,.sidenav a.active{background:color-mix(in srgb, var(--df-white) 10%, transparent);color:var(--c-nav-text)}
.sidenav a.active{box-shadow:inset 3px 0 0 var(--brand-accent)}
.admin-main{min-width:0;display:flex;flex-direction:column}
.admin-top{position:sticky;top:0;z-index:40;background:var(--c-surface);border-bottom:var(--df-border-width) solid var(--c-border);padding:var(--df-space-3) var(--df-gutter-mobile);display:flex;justify-content:space-between;align-items:center;gap:var(--df-space-3);flex-wrap:wrap}
.admin-content{padding:var(--df-space-6) var(--df-gutter-mobile) var(--df-space-16)}
@media(min-width:900px){.admin-content{padding:var(--df-space-8) var(--df-gutter-wide) var(--df-space-16)}}
.sidebar-toggle{display:none}
@media(max-width:900px){
  .admin{grid-template-columns:1fr}
  .sidebar{position:fixed;left:0;top:0;bottom:0;width:min(84vw,300px);transform:translateX(-100%);transition:transform var(--df-duration-base) var(--df-ease-standard);z-index:60}
  .sidebar.open{transform:none;box-shadow:var(--df-shadow-3)}
  .sidebar-toggle{display:inline-flex}
}
.tabs{display:flex;gap:var(--df-space-1);border-bottom:var(--df-border-width) solid var(--c-border);overflow-x:auto;margin-bottom:var(--df-space-5)}
.tabs button{background:none;border:none;border-bottom:var(--df-border-width-strong) solid transparent;padding:var(--df-space-3) var(--df-space-4);min-height:var(--df-hit-min);color:var(--c-muted);font:var(--df-type-label);cursor:pointer;white-space:nowrap}
.tabs button.active{color:var(--c-accent);border-bottom-color:var(--c-accent)}
.timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--df-space-3)}
.timeline li{display:grid;grid-template-columns:auto 1fr;gap:var(--df-space-3);align-items:start}
.timeline .when{font:var(--df-type-caption);color:var(--c-muted);white-space:nowrap;padding-top:2px}
.chart{width:100%;height:auto;display:block}
.chart .bar{fill:var(--c-accent-fill)}
.chart .axis{stroke:var(--c-border)}
.chart text{fill:var(--c-muted);font:var(--df-type-caption)}
.split{display:grid;gap:var(--df-space-5);grid-template-columns:1fr}
@media(min-width:1000px){.split{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}.split-3{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) minmax(0,1fr)}}
.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:var(--df-space-2)}
.slot{min-height:var(--df-hit-min);border:var(--df-border-width) solid var(--c-border);border-radius:var(--df-radius-sm);background:var(--c-surface);font-variant-numeric:tabular-nums;font-weight:var(--df-weight-semibold);cursor:pointer}
.slot.on{background:var(--c-accent-fill);color:var(--c-on-accent);border-color:var(--c-accent-fill)}
.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:var(--df-space-2);min-width:560px}
.week .day{background:var(--c-surface-2);border-radius:var(--df-radius-sm);padding:var(--df-space-2);min-height:var(--df-space-16)}
.week .day b{display:block;font:var(--df-type-caption);color:var(--c-muted);margin-bottom:var(--df-space-1)}
.week .rng{display:block;font:var(--df-type-caption);background:var(--c-surface);border-radius:var(--df-radius-xs);padding:2px var(--df-space-1);margin-bottom:2px;font-variant-numeric:tabular-nums}
.marker-row{display:grid;grid-template-columns:1.4fr .7fr .6fr 1fr auto;gap:var(--df-space-2);align-items:center;padding:var(--df-space-2) 0;border-bottom:var(--df-border-width) solid var(--c-border)}
.marker-row.flag-high,.marker-row.flag-low{background:var(--c-warn-soft)}
@media(max-width:640px){.marker-row{grid-template-columns:1fr 1fr}}
.soap textarea{min-height:120px}
.video{aspect-ratio:16/9;background:var(--df-ink);border-radius:var(--df-radius-lg);overflow:hidden;position:relative;display:grid;place-items:center;color:var(--df-text-on-navy-muted)}
.video video{width:100%;height:100%;object-fit:cover}
.video .overlay{position:absolute;left:var(--df-space-3);bottom:var(--df-space-3);display:flex;gap:var(--df-space-2)}
.rec-dot{color:var(--df-orange-500);animation:blink 1.2s steps(2) infinite}
@keyframes blink{50%{opacity:.2}}
.bodymap{width:100%;max-width:340px;margin:0 auto;display:block}
.bodymap .body{fill:var(--c-surface-2);stroke:var(--c-border);stroke-width:1.5}
.bodymap .zone{fill:transparent;stroke:transparent;cursor:pointer;transition:var(--df-transition-control)}
.bodymap .zone:hover,.bodymap .zone.sel{fill:color-mix(in srgb, var(--c-accent) 35%, transparent);stroke:var(--c-accent);stroke-width:2}
.bodymap .zone.sev-low{fill:color-mix(in srgb, var(--df-teal-500) 45%, transparent)}
.bodymap .zone.sev-medium{fill:color-mix(in srgb, var(--df-amber-500) 55%, transparent)}
.bodymap .zone.sev-high{fill:color-mix(in srgb, var(--df-orange-500) 60%, transparent)}
.progress{height:var(--df-space-2);background:var(--c-surface-2);border-radius:var(--df-radius-pill);overflow:hidden}
.progress > span{display:block;height:100%;background:var(--c-accent-fill)}
.stepper{display:flex;gap:var(--df-space-2);flex-wrap:wrap;margin-bottom:var(--df-space-5)}
.stepper span{display:inline-flex;align-items:center;gap:var(--df-space-1);font:var(--df-type-caption);color:var(--c-muted);padding:var(--df-space-1) var(--df-space-2);border-radius:var(--df-radius-pill);background:var(--c-surface-2)}
.stepper span.done{color:var(--c-ok);background:var(--c-ok-soft)}
.stepper span.now{color:var(--c-on-accent);background:var(--c-accent-fill)}
.notice{border-left:var(--df-space-1) solid var(--c-accent);background:var(--c-accent-soft);padding:var(--df-space-3) var(--df-space-4);border-radius:var(--df-radius-sm);font:var(--df-type-label)}
.notice-warn{border-color:var(--c-warn);background:var(--c-warn-soft);color:var(--c-warn)}
.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.list li{padding:var(--df-space-3) 0;border-bottom:var(--df-border-width) solid var(--c-border);display:flex;justify-content:space-between;gap:var(--df-space-3);align-items:center;flex-wrap:wrap}
.list li:last-child{border-bottom:none}
.theme-btn{color:inherit}
.install-bar{position:fixed;left:var(--df-space-4);right:var(--df-space-4);bottom:var(--df-space-4);z-index:90;display:none}
.install-bar.show{display:block}
@media print{.topnav,.sidebar,.admin-top,.toast-host,.btn{display:none !important}.admin{grid-template-columns:1fr}}