/* VirtualX — component layer on the Practice token system. Every value is a token. */

/* ── Themes ─────────────────────────────────────────────────────────────────── */
/* Measured contrast adaptations (WCAG AA): muted text and the settled green move one step darker
   on light surfaces so 12–14px text clears 4.5:1 and bars/icons clear 3:1. Same hues, deeper tints. */
:root{color-scheme:light;--text-muted:var(--teal-600);--text-success:var(--glow-800);--success-fg:var(--glow-800);--text-link:var(--teal-700)}
[data-theme="dark"]{
  color-scheme:dark;
  --surface-page:var(--teal-950);
  --surface-page-alt:var(--teal-900);
  --surface-card:var(--teal-900);
  --surface-sunken:var(--teal-800);
  --surface-soft:var(--teal-800);
  --surface-hover:var(--teal-800);
  --surface-selected:var(--teal-800);
  --surface-disabled:var(--teal-800);
  --surface-inverse:var(--teal-950);
  --surface-inverse-alt:var(--teal-900);
  --text-heading:var(--df-white);
  --text-body:var(--teal-100);
  --text-muted:var(--teal-200);
  --text-subtle:var(--teal-300);
  --text-disabled:var(--teal-400);
  --text-link:var(--glow-300);
  --text-link-hover:var(--glow-200);
  --text-success:var(--glow-300);
  --text-warning:var(--amber-200);
  --text-danger:var(--rust-200);
  --border-subtle:var(--teal-800);
  --border-default:var(--teal-700);
  --border-strong:var(--teal-500);
  --success-bg:var(--teal-800);--success-border:var(--glow-800);--success-fg:var(--glow-200);
  --warning-bg:var(--teal-800);--warning-border:var(--amber-700);--warning-fg:var(--amber-200);
  --danger-bg:var(--teal-800);--danger-border:var(--rust-700);--danger-fg:var(--rust-200);
  --info-bg:var(--teal-800);--info-border:var(--teal-600);--info-fg:var(--teal-100);
  --overlay-glass:rgba(31,51,54,.78);
  --chart-grid:var(--teal-800);
  --chart-3:var(--teal-400);
  --chart-6:var(--teal-700);
}
[data-theme="dark"] ::selection{background:var(--glow-700);color:var(--df-white)}

/* ── Base helpers ───────────────────────────────────────────────────────────── */
html,body{min-height:100%}
body{background:var(--surface-page);color:var(--text-body)}
.container{width:100%;max-width:var(--container-xl);margin:0 auto;padding:0 var(--space-20)}
@media (min-width:768px){.container{padding:0 var(--gutter-page)}}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.money,.num{font-variant-numeric:var(--numeric-tabular);font-feature-settings:"tnum" 1}
.money{white-space:nowrap}
.muted{color:var(--text-muted)}
.small{font:var(--type-body-sm)}
.caption{font:var(--type-caption);color:var(--text-muted)}
.eyebrow{font:var(--type-eyebrow);letter-spacing:var(--tracking-widest);text-transform:uppercase;color:var(--text-muted)}
.stack>*+*{margin-top:var(--stack)}
.stack-tight>*+*{margin-top:var(--stack-tight)}
.row{display:flex;flex-wrap:wrap;gap:var(--inline-gap);align-items:center}
.row.between{justify-content:space-between}
.grid{display:grid;gap:var(--grid-gap)}
.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))}
.icon{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;vertical-align:-4px}
.icon.sm{width:16px;height:16px;vertical-align:-3px}
.icon.lg{width:28px;height:28px}

/* ── Buttons & controls ─────────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--control-gap);min-height:var(--tap-target-min);padding:0 var(--control-pad-x-md);border:var(--border-control);border-radius:var(--radius-control);background:var(--surface-card);color:var(--text-body);font:var(--type-button);cursor:pointer;text-decoration:none;transition:var(--transition-control);white-space:nowrap}
.btn:hover{background:var(--surface-hover);border-color:var(--border-strong);color:var(--text-heading)}
.btn:active{transform:scale(var(--press-scale))}
.btn:disabled,.btn[aria-busy="true"]{opacity:.6;cursor:progress}
.btn-primary{background:var(--surface-brand);border-color:var(--surface-brand);color:var(--text-on-brand)}
.btn-primary:hover{background:var(--surface-brand-hover);border-color:var(--surface-brand-hover);color:var(--text-on-brand)}
.btn-accent{background:var(--surface-highlight);border-color:var(--surface-highlight);color:var(--text-on-highlight)}
.btn-accent:hover{background:var(--surface-highlight-hover);border-color:var(--surface-highlight-hover);color:var(--text-on-highlight)}
.btn-ghost{background:transparent;border-color:transparent}
.btn-ghost:hover{background:var(--surface-hover);border-color:transparent}
.btn-danger{color:var(--text-danger);border-color:var(--danger-border)}
.btn-lg{min-height:var(--control-h-lg);padding:0 var(--control-pad-x-lg);font-size:var(--text-md)}
.btn-sm{min-height:var(--tap-target-min);padding:0 var(--control-pad-x-sm);font-size:var(--text-xs)}
.btn-icon{width:var(--tap-target-min);padding:0}
.field{display:flex;flex-direction:column;gap:var(--space-6)}
.field label,.field .label{font:var(--type-label);color:var(--text-heading)}
.field .hint{font:var(--type-caption);color:var(--text-muted)}
.field .error{font:var(--type-caption);color:var(--text-danger)}
.input,.select,.textarea{width:100%;min-height:var(--tap-target-min);padding:var(--space-8) var(--space-12);border:var(--border-control);border-radius:var(--radius-input);background:var(--surface-card);color:var(--text-body);font:var(--type-body);transition:var(--transition-control)}
.textarea{min-height:120px;resize:vertical;line-height:var(--leading-normal)}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--border-focus);box-shadow:var(--ring-focus)}
.input[aria-invalid="true"],.select[aria-invalid="true"],.textarea[aria-invalid="true"]{border-color:var(--danger-solid)}
.select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 12px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:var(--space-32)}
.check{display:flex;gap:var(--space-12);align-items:flex-start;min-height:var(--tap-target-min);padding:var(--space-8) 0;cursor:pointer}
.check input{width:20px;height:20px;margin-top:2px;accent-color:var(--glow-500);flex:none}
.form-grid{display:grid;gap:var(--space-16);grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.form-grid .span-2{grid-column:1/-1}
.form-summary{padding:var(--space-12) var(--space-16);border:var(--border-width-hairline) solid var(--danger-border);background:var(--danger-bg);color:var(--danger-fg);border-radius:var(--radius-card);font:var(--type-body-sm)}
.form-actions{display:flex;flex-wrap:wrap;gap:var(--inline-gap);justify-content:flex-end;padding-top:var(--space-8)}

/* ── Surfaces ───────────────────────────────────────────────────────────────── */
.card{background:var(--surface-card);border:var(--border-card);border-radius:var(--radius-card);box-shadow:var(--shadow-xs);padding:var(--gutter-card)}
.card.compact{padding:var(--gutter-card-compact)}
.card-head{display:flex;flex-wrap:wrap;gap:var(--inline-gap);align-items:center;justify-content:space-between;margin-bottom:var(--space-16)}
.card-head h2,.card-head h3{margin:0}
.panel{background:var(--surface-sunken);border-radius:var(--radius-panel);padding:var(--gutter-card)}
.badge{display:inline-flex;align-items:center;gap:var(--space-4);padding:2px var(--space-8);border-radius:var(--radius-badge);font:var(--type-eyebrow);letter-spacing:var(--tracking-wide);text-transform:uppercase;white-space:nowrap;border:var(--border-width-hairline) solid var(--info-border);background:var(--info-bg);color:var(--info-fg)}
.badge.ok,.badge.met,.badge.compliant,.badge.published,.badge.resolved,.badge.closed,.badge.released,.badge.submitted,.badge.active{background:var(--success-bg);border-color:var(--success-border);color:var(--success-fg)}
.badge.warn,.badge.warning,.badge.attention,.badge.pending,.badge.reconciled{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-fg)}
.badge.danger,.badge.overdue,.badge.urgent,.badge.suspended{background:var(--danger-bg);border-color:var(--danger-border);color:var(--danger-fg)}
.kpi{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--gutter-card-compact) var(--gutter-card);background:var(--surface-card);border:var(--border-card);border-radius:var(--radius-card)}
.kpi .value{font:var(--weight-bold) var(--text-3xl)/var(--leading-tight) var(--font-core);color:var(--text-heading);letter-spacing:var(--tracking-tight)}
.kpi .label{font:var(--type-caption);color:var(--text-muted)}
.kpi.accent{border-left:var(--keyline-highlight)}
.kpi.danger{border-left:var(--border-width-accent) solid var(--danger-solid)}
.alert{display:flex;gap:var(--space-12);align-items:flex-start;padding:var(--space-12) var(--space-16);border-radius:var(--radius-card);border:var(--border-width-hairline) solid var(--info-border);background:var(--info-bg);color:var(--info-fg);font:var(--type-body-sm)}
.alert.warn{border-color:var(--warning-border);background:var(--warning-bg);color:var(--warning-fg)}
.alert.danger{border-color:var(--danger-border);background:var(--danger-bg);color:var(--danger-fg)}
.alert.ok{border-color:var(--success-border);background:var(--success-bg);color:var(--success-fg)}
.divider{border:0;border-top:var(--divider);margin:var(--space-16) 0}
.progress{height:8px;background:var(--surface-sunken);border-radius:var(--radius-pill);overflow:hidden}
.progress>span{display:block;height:100%;background:var(--glow-700);border-radius:var(--radius-pill)}
[data-theme="dark"] .progress>span{background:var(--glow-400)}
.tabs{display:flex;gap:var(--space-4);border-bottom:var(--divider);overflow-x:auto;scrollbar-width:none}
.tabs button{min-height:var(--tap-target-min);padding:0 var(--space-16);border:0;border-bottom:var(--border-width-thick) solid transparent;background:none;color:var(--text-muted);font:var(--type-label);cursor:pointer;white-space:nowrap}
.tabs button[aria-selected="true"]{color:var(--text-heading);border-bottom-color:var(--glow-400)}
.list{list-style:none;margin:0;padding:0}
.list>li{display:flex;gap:var(--space-12);align-items:center;justify-content:space-between;padding:var(--space-12) 0;border-bottom:var(--divider)}
.list>li:last-child{border-bottom:0}
.list .title{font:var(--type-label);color:var(--text-heading)}

/* ── Tables ─────────────────────────────────────────────────────────────────── */
.table-wrap{overflow-x:auto;border:var(--border-card);border-radius:var(--radius-card);background:var(--surface-card)}
.table-wrap table{min-width:640px}
.table-wrap thead th{position:sticky;top:0;background:var(--surface-sunken);color:var(--text-body);z-index:var(--z-raised);white-space:nowrap}
.table-wrap th button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:var(--space-4);min-height:var(--space-32)}
.table-wrap th button:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}
.table-wrap tbody tr:hover{background:var(--surface-hover)}
.table-wrap tbody tr.clickable{cursor:pointer}
.table-tools{display:flex;flex-wrap:wrap;gap:var(--inline-gap);align-items:center;justify-content:space-between;padding:var(--space-12) var(--space-16);border-bottom:var(--divider)}
.table-tools .input{max-width:320px}
.table-foot{display:flex;flex-wrap:wrap;gap:var(--inline-gap);align-items:center;justify-content:space-between;padding:var(--space-12) var(--space-16);border-top:var(--divider);font:var(--type-body-sm);color:var(--text-muted)}
.table-wrap td.num,.table-wrap th.num{text-align:right}

/* ── States ─────────────────────────────────────────────────────────────────── */
.skeleton{display:grid;gap:var(--space-12)}
.skeleton span{display:block;height:14px;border-radius:var(--radius-sm);background:linear-gradient(90deg,var(--surface-sunken),var(--surface-soft),var(--surface-sunken));background-size:200% 100%;animation:vx-shimmer 1.4s linear infinite}
@keyframes vx-shimmer{to{background-position:-200% 0}}
.empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-12);padding:var(--space-40) var(--space-24);color:var(--text-muted);border:var(--border-width-hairline) dashed var(--border-default);border-radius:var(--radius-card)}
.empty .icon{width:32px;height:32px;color:var(--text-subtle)}
.state-error{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-12);padding:var(--space-24);border-radius:var(--radius-card);background:var(--danger-bg);color:var(--danger-fg);border:var(--border-width-hairline) solid var(--danger-border)}

/* ── Toasts & dialogs ───────────────────────────────────────────────────────── */
.toast-host{position:fixed;left:var(--space-16);right:var(--space-16);bottom:var(--space-16);display:flex;flex-direction:column;gap:var(--space-8);z-index:var(--z-toast);pointer-events:none}
@media (min-width:640px){.toast-host{left:auto;width:360px}}
.toast{pointer-events:auto;display:flex;gap:var(--space-12);align-items:flex-start;padding:var(--space-12) var(--space-16);border-radius:var(--radius-card);background:var(--surface-inverse);color:var(--text-on-inverse);box-shadow:var(--shadow-lg);font:var(--type-body-sm);animation:tmp-rise-in var(--duration-base) var(--ease-out)}
.toast.ok{border-left:var(--keyline-highlight)}
.toast.danger{border-left:var(--border-width-accent) solid var(--rust-400)}
.toast button{all:unset;cursor:pointer;margin-left:auto;min-width:var(--tap-target-min);min-height:var(--space-24);text-align:center;color:var(--text-on-inverse-muted)}
dialog.dialog{border:0;border-radius:var(--radius-dialog);padding:0;background:var(--surface-card);color:var(--text-body);box-shadow:var(--shadow-xl);width:min(100% - var(--space-32),560px);max-height:calc(100dvh - var(--space-32))}
dialog.dialog::backdrop{background:var(--overlay-scrim)}
dialog.dialog .dialog-body{padding:var(--gutter-card);display:grid;gap:var(--space-16)}
dialog.dialog header{display:flex;justify-content:space-between;align-items:center;gap:var(--space-12)}
dialog.dialog.wide{width:min(100% - var(--space-32),860px)}

/* ── Public site shell ──────────────────────────────────────────────────────── */
.site-header{position:sticky;top:0;z-index:var(--z-header);background:var(--overlay-glass);backdrop-filter:var(--blur-glass);-webkit-backdrop-filter:var(--blur-glass);border-bottom:var(--divider)}
.site-header .container{display:flex;align-items:center;justify-content:space-between;gap:var(--space-16);min-height:var(--site-header-h)}
.brand{display:inline-flex;align-items:center;gap:var(--space-12);text-decoration:none;color:var(--text-heading);font:var(--type-wordmark);letter-spacing:var(--tracking-tight)}
.brand img{height:32px;width:auto}
.site-nav{display:none;gap:var(--space-4);align-items:center}
.site-nav a{display:inline-flex;align-items:center;min-height:var(--tap-target-min);padding:0 var(--space-12);border-radius:var(--radius-control);color:var(--text-body);text-decoration:none;font:var(--type-label)}
.site-nav a:hover,.site-nav a[aria-current="page"]{background:var(--surface-hover);color:var(--text-heading)}
@media (min-width:900px){.site-nav{display:flex}.nav-toggle{display:none}}
@media (max-width:600px){#portal-link{display:none}.brand img{height:28px}}
.admin .topbar .who{max-width:38vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mobile-nav{display:grid;gap:var(--space-4);padding:var(--space-12) var(--space-20) var(--space-20);border-top:var(--divider)}
.mobile-nav a{display:flex;align-items:center;min-height:var(--tap-target-min);padding:0 var(--space-12);border-radius:var(--radius-control);color:var(--text-body);text-decoration:none;font:var(--type-label)}
.mobile-nav[hidden]{display:none}
.hero{position:relative;isolation:isolate;color:var(--df-white);background:var(--teal-900) url('/assets/hero-generated.webp') center/cover no-repeat;min-height:min(92dvh,760px);display:flex;align-items:center}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(18,31,33,.92) 0%,rgba(18,31,33,.78) 45%,rgba(18,31,33,.42) 100%)}
.hero .container{padding-top:var(--space-64);padding-bottom:var(--space-64)}
.hero h1{color:var(--df-white);font:var(--weight-bold) clamp(3rem,6vw,var(--text-6xl))/var(--leading-tight) var(--font-core);letter-spacing:var(--tracking-tightest);max-width:16ch}
.hero p.lede{font:var(--type-body-lg);color:var(--teal-100);max-width:var(--measure-narrow);margin-top:var(--space-20)}
.hero .eyebrow{color:var(--glow-300)}
.hero .actions{display:flex;flex-wrap:wrap;gap:var(--inline-gap);margin-top:var(--space-32)}
.hero .proof{display:flex;flex-wrap:wrap;gap:var(--space-24);margin-top:var(--space-40);padding-top:var(--space-24);border-top:var(--border-width-hairline) solid var(--border-inverse)}
.hero .proof strong{display:block;font:var(--weight-bold) var(--text-2xl)/1 var(--font-core);color:var(--df-white)}
.hero .proof span{font:var(--type-caption);color:var(--teal-200)}
.section{padding:var(--section-y-compact) 0}
@media (min-width:900px){.section{padding:var(--section-y) 0}}
.section.alt{background:var(--surface-page-alt)}
.section-head{max-width:var(--measure-prose);margin-bottom:var(--space-40)}
.section-head h2{font:var(--weight-bold) clamp(1.75rem,3.5vw,var(--text-4xl))/var(--leading-snug) var(--font-core)}
.section-head p{margin-top:var(--space-12);color:var(--text-muted);font:var(--type-body-lg)}
.pain{display:grid;gap:var(--space-8)}
.pain h3{font:var(--type-h3)}
.pain .impact{color:var(--text-muted);font:var(--type-body-sm)}
.price-card{display:flex;flex-direction:column;gap:var(--space-16);height:100%}
.price-card .price-line{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:var(--space-8)}
.price-card .price{font:var(--weight-bold) var(--text-3xl)/1 var(--font-core);color:var(--text-heading)}
.price-card .per{font:var(--type-caption);color:var(--text-muted)}
.price-card ul{margin:0;padding:0;list-style:none;display:grid;gap:var(--space-8);flex:1}
.price-card li{display:flex;gap:var(--space-8);font:var(--type-body-sm)}
.price-card li .icon{color:var(--text-success)}
.price-card.featured{border-color:var(--glow-400);box-shadow:var(--shadow-md)}
.steps{display:grid;gap:var(--space-24);counter-reset:step}
@media (min-width:768px){.steps{grid-template-columns:repeat(4,1fr)}}
.step{position:relative;padding-top:var(--space-12);counter-increment:step}
.step::before{content:counter(step,decimal-leading-zero);font:var(--weight-bold) var(--text-xs)/1 var(--font-mono);color:var(--text-success);letter-spacing:var(--tracking-wide)}
[data-theme="dark"] .step::before{color:var(--glow-300)}
.step h3{margin-top:var(--space-8)}
.step p{margin-top:var(--space-8);color:var(--text-muted);font:var(--type-body-sm)}
.site-footer{background:var(--surface-inverse);color:var(--text-on-inverse-muted);padding:var(--space-48) 0 var(--space-32)}
.site-footer h4{color:var(--text-on-inverse);margin-bottom:var(--space-12)}
.site-footer a{color:var(--text-on-inverse);text-decoration-color:var(--border-inverse)}
.site-footer .legal{margin-top:var(--space-32);padding-top:var(--space-16);border-top:var(--border-width-hairline) solid var(--border-inverse);font:var(--type-caption);display:flex;flex-wrap:wrap;gap:var(--space-12);justify-content:space-between}
.trust{display:flex;flex-wrap:wrap;gap:var(--space-8)}
.trust span{display:inline-flex;align-items:center;gap:var(--space-6);padding:var(--space-4) var(--space-12);border:var(--border-width-hairline) solid var(--border-inverse);border-radius:var(--radius-pill);font:var(--type-caption);color:var(--text-on-inverse)}

/* ── Sign-in and portal ─────────────────────────────────────────────────────── */
.signin{max-width:440px;margin:var(--space-48) auto}
.page{padding:var(--space-32) 0 var(--space-64)}
.page-head{display:flex;flex-wrap:wrap;gap:var(--space-16);align-items:flex-end;justify-content:space-between;margin-bottom:var(--space-24)}
.page-head h1{font:var(--weight-bold) clamp(1.6rem,3vw,var(--text-4xl))/var(--leading-tight) var(--font-core)}

/* ── Admin shell ────────────────────────────────────────────────────────────── */
.admin{display:grid;min-height:100dvh;grid-template-rows:var(--app-topbar-h) 1fr}
@media (min-width:1024px){.admin{grid-template-columns:var(--app-sidebar-w) 1fr;grid-template-rows:var(--app-topbar-h) 1fr}.admin .sidebar{grid-row:1/3}}
.admin .topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-12);padding:0 var(--space-20);background:var(--surface-card);border-bottom:var(--divider);position:sticky;top:0;z-index:var(--z-header)}
.admin .topbar .who{font:var(--type-caption);color:var(--text-muted);text-align:right}
.admin .sidebar{background:var(--surface-inverse);color:var(--text-on-inverse);display:none;flex-direction:column;padding:var(--space-16)}
.admin .sidebar.open{display:flex;position:fixed;inset:var(--app-topbar-h) 0 0 0;z-index:var(--z-dialog);overflow:auto}
@media (min-width:1024px){.admin .sidebar{display:flex;position:sticky;top:0;height:100dvh;overflow:auto}.admin .menu-toggle{display:none}}
.admin .sidebar .brand{color:var(--text-on-inverse);padding:var(--space-8) var(--space-8) var(--space-24)}
.admin .sidebar nav{display:grid;gap:var(--space-2)}
.admin .sidebar nav a{display:flex;align-items:center;gap:var(--space-12);min-height:var(--tap-target-min);padding:0 var(--space-12);border-radius:var(--radius-control);color:var(--text-on-inverse-muted);text-decoration:none;font:var(--type-label)}
.admin .sidebar nav a:hover{background:var(--surface-inverse-hover);color:var(--text-on-inverse)}
.admin .sidebar nav a[aria-current="page"]{background:var(--surface-inverse-alt);color:var(--text-on-inverse);box-shadow:inset var(--border-width-accent) 0 0 var(--glow-400)}
.admin .sidebar .foot{margin-top:auto;padding-top:var(--space-16);border-top:var(--border-width-hairline) solid var(--border-inverse);font:var(--type-caption);color:var(--text-on-inverse-muted)}
.admin main{padding:var(--space-24) var(--space-20) var(--space-64);min-width:0}
@media (min-width:768px){.admin main{padding:var(--space-32) var(--gutter-page) var(--space-64)}}
.chart{width:100%;height:auto;display:block}
.chart text{font:var(--type-caption);fill:var(--text-muted)}
.chart line{stroke:var(--chart-grid)}
.detail{display:grid;gap:var(--space-24)}
@media (min-width:1024px){.detail{grid-template-columns:2fr 1fr}}
.dl{display:grid;grid-template-columns:auto 1fr;gap:var(--space-6) var(--space-16);font:var(--type-body-sm)}
.dl dt{color:var(--text-muted)}
.dl dd{margin:0;color:var(--text-heading)}
.roster-grid{display:grid;grid-template-columns:repeat(7,minmax(120px,1fr));gap:var(--space-8);min-width:860px}
.roster-day h4{font:var(--type-eyebrow);text-transform:uppercase;letter-spacing:var(--tracking-wide);color:var(--text-muted);padding-bottom:var(--space-8);border-bottom:var(--divider)}
.shift{margin-top:var(--space-8);padding:var(--space-8);border-radius:var(--radius-md);background:var(--surface-sunken);font:var(--type-caption)}
.shift strong{display:block;color:var(--text-heading);font:var(--type-label)}
.question{display:grid;gap:var(--space-8);padding:var(--space-16) 0;border-bottom:var(--divider)}
.question .answers{display:flex;gap:var(--space-8)}
.question .answers label{display:inline-flex;align-items:center;gap:var(--space-6);min-height:var(--tap-target-min);padding:0 var(--space-16);border:var(--border-control);border-radius:var(--radius-pill);cursor:pointer;font:var(--type-label)}
.question .answers input{accent-color:var(--glow-500)}
.question .answers label:has(input:checked){border-color:var(--glow-500);background:var(--success-bg);color:var(--success-fg)}
.task{display:flex;flex-wrap:wrap;gap:var(--space-8);align-items:center;justify-content:space-between;padding:var(--space-8) 0;border-bottom:var(--divider)}
.task .pct{width:60px}
.module{padding:var(--space-16);border:var(--border-card);border-radius:var(--radius-card);background:var(--surface-card)}
.install-banner{display:none;gap:var(--space-12);align-items:center;justify-content:space-between;padding:var(--space-12) var(--space-16);background:var(--surface-sunken);border-radius:var(--radius-card)}
.install-banner.show{display:flex}
@media print{.site-header,.site-footer,.admin .sidebar,.admin .topbar,.no-print{display:none!important}}