/* Styles. Every colour, length, shadow, type size, z-index and timing comes from tokens.css.
   Order: fonts, base, layout, components (button, field, card, badge, notice and banner, stepper,
   table, empty state), then views. Each component is defined once; views only place and size it. */

/* ---- Fonts ----
   Script faces: installed fonts only (no download), limited by unicode-range to their script.
   Noto Sans first, then the platform's own Devanagari and Gujarati fonts. */
@font-face{font-family:"PRI Devanagari";font-weight:100 549;font-display:swap;unicode-range:U+0900-097F,U+1CD0-1CFF,U+A8E0-A8FF,U+200C-200D,U+25CC;
  src:local("Noto Sans Devanagari"),local("NotoSansDevanagari-Regular"),local("Nirmala UI"),local("Kohinoor Devanagari"),local("Mangal")}
@font-face{font-family:"PRI Devanagari";font-weight:550 900;font-display:swap;unicode-range:U+0900-097F,U+1CD0-1CFF,U+A8E0-A8FF,U+200C-200D,U+25CC;
  src:local("Noto Sans Devanagari Bold"),local("NotoSansDevanagari-Bold"),local("Nirmala UI Bold"),local("Kohinoor Devanagari Bold"),local("Mangal Bold")}
@font-face{font-family:"PRI Gujarati";font-weight:100 549;font-display:swap;unicode-range:U+0A80-0AFF,U+200C-200D,U+25CC;
  src:local("Noto Sans Gujarati"),local("NotoSansGujarati-Regular"),local("Nirmala UI"),local("Gujarati Sangam MN"),local("Shruti")}
@font-face{font-family:"PRI Gujarati";font-weight:550 900;font-display:swap;unicode-range:U+0A80-0AFF,U+200C-200D,U+25CC;
  src:local("Noto Sans Gujarati Bold"),local("NotoSansGujarati-Bold"),local("Nirmala UI Bold"),local("Gujarati Sangam MN Bold"),local("Shruti Bold")}

/* ---- Base ---- */
*{box-sizing:border-box}
html{scroll-behavior:var(--scroll-behavior)}
body{margin:0;font-family:var(--font-sans);font-size:var(--text-md);background:var(--color-bg);color:var(--color-text);line-height:var(--leading-normal)}
h1{font-size:var(--text-h1);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);margin:var(--space-4) 0 var(--space-5);max-width:var(--measure-wide)}
h2{font-size:var(--text-h2);line-height:var(--leading-heading);letter-spacing:var(--tracking-snug);margin:0 0 var(--space-3)}
:is(h1,h2,h3,h4):is(:lang(hi),:lang(gu)){letter-spacing:var(--tracking-indic)}
h3{line-height:var(--leading-heading);margin:0 0 var(--space-2)}
select,input,textarea,button{font:inherit}
.hidden{display:none!important}
/* One focus indicator for every control, in both themes (contrast measured in tests/contrast.mjs). */
:focus-visible,input:focus,select:focus,textarea:focus{outline:var(--focus-width) solid var(--color-focus);outline-offset:var(--focus-offset)}
/* Touch targets: every control is at least 44×44px. Checkboxes and radios are reached through their
   label, which is at least as large. */
.btn,.link-btn,summary,select,input:not([type=checkbox],[type=radio],[type=file]),.brand{min-height:var(--target)}
.btn,.link-btn,.brand{min-width:var(--target)}
.visually-hidden{position:absolute;width:var(--hairline);height:var(--hairline);margin:calc(-1 * var(--hairline));padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.eyebrow{text-transform:uppercase;letter-spacing:var(--tracking-caps);font-size:var(--text-xs);font-weight:var(--weight-heavy);color:var(--color-primary-text)}
.lead{font-size:var(--text-lg);color:var(--color-text-muted);max-width:var(--measure)}
.microcopy,.muted,.disclaimer{color:var(--color-text-muted)}
.skip-link{position:absolute;left:var(--space-4);top:var(--space-4);z-index:var(--z-skip);display:inline-flex;align-items:center;min-height:var(--target);padding:var(--space-3);border-radius:var(--radius-md);background:var(--color-surface);transform:translateY(-200%)}
.skip-link:focus{transform:none}

/* ---- Layout ---- */
.container{width:min(var(--container),calc(100% - 2 * var(--gutter)));margin:auto}
.narrow{width:min(var(--container-narrow),calc(100% - 2 * var(--gutter)))}
.view{display:none}
.view.active{display:block}
/* Once the route script in index.html has set data-route, it alone decides the visible view, from the first paint */
html[data-route] .view{display:none}
html[data-route="home"] #view-home,html[data-route="report"] #view-report,html[data-route="confirmation"] #view-confirmation,
html[data-route="status"] #view-status,html[data-route="public"] #view-public,html[data-route="admin"] #view-admin,
html[data-route="privacy"] #view-privacy,html[data-route="terms"] #view-terms{display:block}
/* Until the app has rendered (data-ready, set by src/main.js), a deep link shows the view's heading (and the admin
   demo banner, and static content marked .first-paint) only: the parts the app fills in, and the footer below them,
   then appear once instead of moving */
html[data-route]:not([data-route="home"]):not([data-ready]) .view>*>:not(.section-head):not(.demo-banner):not(.first-paint),
html[data-route]:not([data-route="home"]):not([data-ready]) footer{display:none}
.section{padding:var(--space-10) 0}
.soft{background:var(--color-surface-accent);border-block:1px solid var(--color-border)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:var(--space-6);margin-bottom:var(--space-7)}
.section-head h1{font-size:var(--text-5xl);margin:var(--space-2) 0}
.cta-row,.form-actions,.action-stack{display:flex;gap:var(--space-3);flex-wrap:wrap}
.cta-row,.form-actions{margin-top:var(--space-6)}
.feature-grid,.report-grid,.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-5)}
.report-grid{grid-template-columns:repeat(3,1fr)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-10);align-items:center}
.form-grid{display:grid;gap:var(--space-4)}
.form-grid.two{grid-template-columns:repeat(2,1fr)}

/* ---- Component: button ----
   .btn with a tone (primary, secondary, ghost, danger, quiet) and an optional size (small).
   .link-btn is a button that reads as a link. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);border:1px solid transparent;padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);background:transparent;color:var(--color-text);font-weight:var(--weight-bold);text-align:center;text-decoration:none;cursor:pointer;transition:var(--duration-fast) transform,var(--duration-fast) background}
.btn:hover{transform:translateY(var(--lift))}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.btn.primary{background:var(--color-primary);color:var(--color-on-primary)}
.btn.primary:hover{background:var(--color-primary-hover)}
.btn.brand{background:var(--color-brand);color:var(--color-on-brand)}
.btn.brand:hover{background:var(--color-brand-hover)}
.btn.secondary{background:var(--color-surface);border-color:var(--color-border)}
.btn.ghost{border-color:var(--color-border)}
.btn.small{padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);font-weight:var(--weight-medium)}
.btn.quiet{font-weight:var(--weight-regular)}
.btn.quiet:hover{background:var(--color-surface-accent);transform:none}
.link-btn{display:inline-flex;align-items:center;border:0;background:none;padding:0;color:var(--color-primary-text);font:inherit;font-weight:var(--weight-semibold);text-decoration:underline;text-align:left;cursor:pointer}

/* ---- Component: field ----
   A label wrapping its control, with an optional hint and error. Only form fields fill their column. */
label{display:grid;gap:var(--space-2);font-weight:var(--weight-semibold)}
.field{display:grid;gap:var(--space-2);align-content:start}
.field-hint{margin:0}
.field-error{margin:var(--space-2) 0 0;color:var(--color-danger-text);font-weight:var(--weight-semibold)}
input:not([type=checkbox],[type=radio],[type=file]),select,textarea{border:1px solid var(--color-border-control);border-radius:var(--radius-md);padding:var(--space-3);background:var(--color-surface);color:var(--color-text)}
label>:is(input,select):not([type=checkbox],[type=radio]),textarea{width:100%}
input[type=checkbox],input[type=radio]{width:var(--choice);height:var(--choice);margin:0;flex:none;accent-color:var(--color-primary)}
.check-option{display:flex;align-items:flex-start;gap:var(--space-3)}
.check-option input,.consent-list input{margin-top:var(--space-1)}
fieldset.plain{border:0;margin:0;padding:0;min-width:0}
fieldset.plain legend{padding:0;margin:0 0 var(--space-1)}

/* ---- Component: card ----
   A surface. Modifiers: flat (no shadow), sunken (inset, for summaries and previews), compact. */
.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-card)}
.card.flat{border-radius:var(--radius-lg);box-shadow:none}
.card.sunken{background:var(--color-surface-subtle);border-radius:var(--radius-md);padding:var(--space-4);box-shadow:none}
.card.compact{padding:var(--space-3) var(--space-4)}

/* ---- Component: badge ---- */
.badge{display:inline-flex;align-items:center;border-radius:var(--radius-pill);padding:var(--space-1) var(--space-2);background:var(--color-neutral-bg);color:var(--color-neutral-text);font-size:var(--text-xs);font-weight:var(--weight-heavy)}
.badge.accent{background:var(--color-surface-accent);color:var(--color-primary-text)}

/* ---- Component: notice and banner ----
   .notice is an inline message with a tone (info, warning, success, danger); compact for lists.
   .banner is a notice at the top of a page or section, with room for actions. */
.notice{margin:var(--space-4) 0 0;padding:var(--space-3) var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-subtle)}
.notice.info{background:var(--color-info-bg);color:var(--color-info-text);border-color:var(--color-info-border)}
.notice.warning{background:var(--color-warning-bg);color:var(--color-warning-text);border-color:var(--color-warning-border)}
.notice.success{background:var(--color-success-bg);color:var(--color-success-text);border-color:var(--color-success-border)}
/* The danger tone is shared with the destructive button. */
.notice.danger,.btn.danger{background:var(--color-danger-bg);color:var(--color-danger-text);border-color:var(--color-danger-border)}
.notice.compact{margin:0;padding:var(--space-2) var(--space-3)}
.notice>p{margin:0 0 var(--space-2)}
.notice>p:last-child{margin-bottom:0}
.banner{display:grid;justify-items:start;gap:var(--space-2);margin:0 0 var(--space-5)}
.banner .cta-row{margin-top:var(--space-2)}

/* ---- Component: stepper ---- */
.step-status{margin:var(--space-6) 0 var(--space-2);color:var(--color-text-muted);font-weight:var(--weight-semibold)}
.stepper{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-2);margin:0 0 var(--space-6);padding:0;list-style:none}
.step{height:var(--step-height);background:var(--color-track);border-radius:var(--radius-pill)}
.step.active{background:var(--color-primary)}

/* ---- Component: table ----
   Narrow screens stack each row; cells show their column name from data-label. */
.table-wrap{overflow:auto;position:relative}
.table-toolbar{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3)}
.table-toolbar h2{font-size:var(--text-xl)}
.table{width:100%;border-collapse:collapse}
.table th,.table td{text-align:left;padding:var(--space-3);border-bottom:1px solid var(--color-border);vertical-align:top}
.table th{color:var(--color-text-muted);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em}

/* ---- Component: empty state ---- */
.empty-state{text-align:center;padding:var(--space-8) var(--space-3);color:var(--color-text-muted)}
.empty-state .icon{font-size:var(--text-icon-lg)}

/* ---- Header ---- */
.topbar{position:sticky;top:0;z-index:var(--z-header);background:var(--color-header-bg);border-bottom:1px solid var(--color-border)}
.nav-wrap{min-height:var(--header-height);display:flex;align-items:center;gap:var(--space-6)}
.brand{display:flex;align-items:center;gap:var(--space-3);text-decoration:none;color:inherit;margin-right:auto}
.brand-mark{display:block;width:var(--icon-md);height:var(--icon-md);border-radius:var(--radius-md)}
.brand span:last-child{display:grid}
.brand strong,.brand small{white-space:nowrap}
.brand small{color:var(--color-text-muted);font-size:var(--text-xs)}
.topbar nav{display:flex;flex-wrap:nowrap;gap:var(--space-1)}
.nav-btn{white-space:nowrap}
.nav-toggle{display:none}
/* The language select sizes to its content; only form fields fill their column. */
#languageSelect{flex:none;width:auto;max-width:var(--lang-select-max);padding:var(--space-2) var(--space-3)}

/* ---- Home ---- */
.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--space-9);align-items:center;padding:var(--space-11) 0}
.hero-card{padding:var(--space-7)}
.hero-card ol{list-style:none;padding:0;margin:var(--space-5) 0 0;display:grid;gap:var(--space-4)}
.hero-card li{display:flex;gap:var(--space-3);align-items:center}
.hero-card li>span:first-child{display:grid;place-items:center;flex:none;width:var(--icon-sm);height:var(--icon-sm);border-radius:50%;background:var(--color-brand);color:var(--color-on-brand);font-weight:var(--weight-heavy)}
.hero-art{display:block;width:100%;height:auto;margin-bottom:var(--space-6)}
/* Icons from /assets/icons.svg: stroked in currentColor, on a yellow-tinted tile. */
.icon{flex:none;width:var(--glyph);height:var(--glyph)}
.icon-tile{display:grid;place-items:center;flex:none;width:var(--icon-md);height:var(--icon-md);border-radius:var(--radius-md);background:var(--color-icon-bg);color:var(--color-icon)}
.feature-grid .icon-tile{margin-bottom:var(--space-4)}
.feature-grid .card p{color:var(--color-text-muted)}
.stats-grid{gap:var(--space-4)}
.stat{display:flex;gap:var(--space-4);align-items:center}
.stat strong{display:block;font-size:var(--text-3xl);letter-spacing:var(--tracking-tight)}
.stat span{color:var(--color-text-muted)}
.pipeline{display:grid;gap:var(--space-2)}
.pipeline .card{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3)}
.pipeline .card>span{display:flex;align-items:center;gap:var(--space-3)}
.pipeline .icon{width:var(--glyph-sm);height:var(--glyph-sm);color:var(--color-icon)}
.pipeline b{color:var(--color-primary-text);font-size:var(--text-xs)}
.pipeline>span{text-align:center;color:var(--color-text-muted)}

/* ---- Report wizard ---- */
.panel{margin-bottom:var(--space-5)}
.form-step{display:none}
.form-step.active{display:block}
.check-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3);margin-top:var(--space-4)}
.dropzone{position:relative;display:grid;gap:var(--space-1);border:var(--border-thick) dashed var(--color-border-strong);border-radius:var(--radius-lg);padding:var(--space-7);text-align:center;cursor:pointer;background:var(--color-surface-subtle)}
.dropzone span{font-weight:var(--weight-regular);color:var(--color-text-muted)}
.dropzone:focus-within{outline:var(--focus-width) solid var(--color-focus);outline-offset:var(--focus-offset)}
.dropzone.dragging{border-color:var(--color-primary);background:var(--color-surface-accent)}
.file-list{display:grid;gap:var(--space-2);margin-top:var(--space-4)}
.file-item{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3)}
.file-item>span{flex:1;min-width:0}
.evidence-items{list-style:none;padding:0;margin:0;display:grid;gap:var(--space-2)}
.evidence-thumb{width:var(--thumb);height:var(--thumb);object-fit:cover;border-radius:var(--radius-sm);flex:none}
.evidence-video{display:grid;place-items:center;background:var(--color-surface-accent);color:var(--color-primary-text)}
#err-evidence ul,.error-summary ul{margin:var(--space-2) 0 0;padding-left:var(--space-5)}
.error-summary .notice{margin:0 0 var(--space-5)}
.consent-list{display:grid;gap:var(--space-3);margin-top:var(--space-6)}
.consent-list legend{font-weight:var(--weight-semibold)}
.consent-list label{display:flex;align-items:flex-start;gap:var(--space-3);min-height:var(--target);font-weight:var(--weight-medium)}
.consent-item{display:grid;gap:var(--space-1)}
.consent-item details{margin-left:var(--space-7);color:var(--color-text-muted)}
.consent-item summary{padding:var(--space-2) 0;cursor:pointer;color:var(--color-primary-text);font-weight:var(--weight-semibold)}
.consent-item details p{margin:var(--space-2) 0 0}
.review-summary dl{display:grid;grid-template-columns:var(--label-col) 1fr auto;gap:var(--space-2);margin:0}
.review-summary dt{color:var(--color-text-muted)}
.review-summary dd{margin:0;font-weight:var(--weight-semibold)}
.review-row{display:contents}
.review-value{white-space:pre-wrap}
.draft-saved{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-3)}

/* ---- Confirmation and status ---- */
.confirm-box{margin:var(--space-2) 0 var(--space-5);padding:var(--space-6);border-radius:var(--radius-xl)}
.reference-id{font-size:var(--text-3xl);font-weight:var(--weight-heavy);letter-spacing:.02em}
.access-token{font-family:var(--font-mono);font-size:var(--text-xl);overflow-wrap:anywhere}
.timeline{margin:0;padding-left:var(--space-6);display:grid;gap:var(--space-3)}
.timeline li.done{font-weight:var(--weight-semibold)}
.timeline small{color:var(--color-text-muted);font-weight:var(--weight-regular)}
.status-result h3{margin-top:var(--space-5)}
.status-message{margin:var(--space-3) 0}

/* ---- Public reports ---- */
.filters{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);align-items:start}
.filter-actions{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap}
.filter-actions p{margin:0}
.report-card .meta{display:flex;gap:var(--space-2);flex-wrap:wrap;margin:var(--space-3) 0}
.report-card p{color:var(--color-text-muted)}
.report-card .public-text{white-space:pre-wrap}
.detail-list{display:grid;gap:var(--space-3)}
.detail-row{display:grid;grid-template-columns:var(--label-col-sm) 1fr;gap:var(--space-3)}
.detail-row span:first-child{color:var(--color-text-muted)}
.report-card p,.report-card h3,.file-item span,.file-item small,.post-preview,.detail-row strong,.review-summary dd,.moderation-panel p{overflow-wrap:anywhere}

/* ---- Admin ---- */
.demo-tokens{margin:0;padding-left:var(--space-5)}
.demo-tokens .access-token{font-size:var(--text-sm)}
.x-post{margin-top:var(--space-6)}
.turnstile{margin-block:var(--space-4)}
.mfa-qr{display:block;background:var(--color-qr-ground);padding:var(--space-2);border-radius:var(--radius-md);margin-block:var(--space-3)}
.admin-layout{display:grid;grid-template-columns:1.3fr .7fr;gap:var(--space-5);align-items:start}
.admin-layout>*{min-width:0}
.status-tabs{display:flex;gap:var(--space-2);flex-wrap:wrap;margin:var(--space-3) 0}
.status-tab[aria-selected="true"]{background:var(--color-surface-accent);border-color:var(--color-primary);color:var(--color-primary-text);font-weight:var(--weight-bold)}
.moderation-panel{position:sticky;top:calc(var(--header-height) + var(--space-5))}
.moderation-title{font-size:var(--text-2xl);margin-top:var(--space-2)}
.moderation-subhead{margin-top:var(--space-5)}
.privacy-checks,.manual-checks{display:grid;gap:var(--space-2);margin:var(--space-4) 0}
.manual-checks legend{font-weight:var(--weight-bold);margin-bottom:var(--space-2)}
.manual-checks p{margin:0}
.post-preview{margin:var(--space-4) 0;white-space:pre-wrap}
.statement{white-space:pre-wrap}
mark.pii{background:var(--color-warning-bg);color:var(--color-warning-text);border-radius:var(--space-1);padding:0 var(--space-1)}
.public-pii ul{list-style:none;padding:0;margin:var(--space-2) 0;display:grid;gap:var(--space-2)}
.public-pii li{display:flex;gap:var(--space-2);align-items:center;flex-wrap:wrap}
.decision-form{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--color-border)}
.decision-form .field{margin:var(--space-3) 0}
.decision-form legend{font-weight:var(--weight-bold)}
.audit-list{list-style:none;padding:0;margin:0}
.audit-item{display:flex;justify-content:space-between;gap:var(--space-4);padding:var(--space-3) 0;border-bottom:1px solid var(--color-border)}
.audit-item small{color:var(--color-text-muted)}

/* ---- Footer and dialog ---- */
footer{border-top:1px solid var(--color-border);padding:var(--space-7) 0;background:var(--color-surface)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--space-7)}
.footer-grid p{color:var(--color-text-muted);margin:var(--space-1) 0}
.footer-brand{display:grid;grid-template-columns:auto 1fr;gap:var(--space-3);align-content:start;align-items:center}
.footer-brand .footer-note{grid-column:1/-1;max-width:var(--measure);margin-top:var(--space-2)}
.footer-col{display:flex;flex-direction:column;align-items:flex-start}
.footer-col h2{margin:0 0 var(--space-1)}
dialog{width:min(var(--dialog-width),calc(100% - 2 * var(--gutter)));border:0;border-radius:var(--radius-xl);padding:0;box-shadow:var(--shadow-dialog);background:var(--color-surface);color:var(--color-text)}
dialog::backdrop{background:var(--color-backdrop)}
.dialog-head{display:flex;justify-content:space-between;align-items:center;padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--color-border)}
.dialog-head h2{margin:0}
.dialog-close{font-size:var(--text-2xl)}
.dialog-head+div{padding:var(--space-6)}
.dialog-head+div h3{margin-top:var(--space-6)}

@media(max-width:900px){
  .topbar nav{display:none}
  .nav-wrap{position:relative;gap:var(--space-3)}
  .nav-toggle{display:inline-flex}
  .topbar nav.open{display:grid;gap:var(--space-1);position:absolute;top:100%;left:0;right:0;padding:var(--space-2) 0 var(--space-3);background:var(--color-bg);border-bottom:1px solid var(--color-border)}
  .topbar nav.open .nav-btn{justify-content:flex-start}
  .hero,.two-col,.admin-layout{grid-template-columns:1fr}
  .feature-grid,.report-grid,.stats-grid{grid-template-columns:repeat(2,1fr)}
  .moderation-panel{position:static}
  .footer-grid{grid-template-columns:repeat(3,1fr)}
  .footer-brand{grid-column:1/-1}
}

@media(max-width:620px){
  .footer-grid{grid-template-columns:1fr}
  .hero{padding:var(--space-9) 0}
  .feature-grid,.report-grid,.stats-grid,.check-grid,.form-grid.two,.filters{grid-template-columns:1fr}
  .section{padding:var(--space-9) 0}
  .section-head{align-items:start;flex-direction:column}
  .section-head h1{font-size:var(--text-4xl)}
  .brand small{display:none}
  .review-summary dl{grid-template-columns:1fr}
  .review-summary dd{margin-bottom:var(--space-2)}
  .nav-wrap{min-height:var(--header-height-sm)}
  .brand strong{font-size:var(--text-sm);white-space:normal}
  #languageSelect{max-width:var(--lang-select-sm)}
  .table thead{position:absolute;width:var(--hairline);height:var(--hairline);overflow:hidden;clip-path:inset(50%)}
  .table,.table tbody,.table tr,.table td{display:block}
  .table tr{padding:var(--space-3) 0;border-bottom:1px solid var(--color-border)}
  .table td{display:grid;grid-template-columns:var(--label-col-sm) 1fr;gap:var(--space-3);padding:var(--space-1) 0;border:0}
  .table td[data-label]::before{content:attr(data-label);color:var(--color-text-muted)}
  .table td.empty-state{display:block}
}

@media(max-width:400px){
  .brand span:last-child{display:none}
  .nav-wrap{gap:var(--space-2)}
}