
:root {
  --bg: #0a0d12;
  --surface: #12161e;
  --surface-2: #1a1f2b;
  --sunk: #0b0e12;
  --line: #242c37;
  --line-hi: #39445280;
  --text-primary: #e8edf3;
  --text-secondary: #9aa7b6;
  --text-tertiary: #6b7989;
  --threat: #ff6369;
  --attention: #e8a33d;
  --info: #7d9cbb;
  --dismissed: #8b939e;
  --healthy: #4ac45f;
  --system: #9d8cff;
  --focus: #63a2ff;
  --t-threat: rgba(255, 99, 105, .10);
  --t-attention: rgba(232, 163, 61, .10);
  --t-map: rgba(125, 156, 187, .08);
  --t-map-context: rgba(125, 156, 187, .035);
  --t-map-subject: rgba(99, 162, 255, .15);
  --t-healthy: rgba(74, 196, 95, .08);
  --t-system: rgba(157, 140, 255, .10);
  --video-surface: #10151d;
  --t-body: 14px;
  --t-label: 12px;
  --t-subhead: 16px;
  --t-headline: 20px;
  --t-title: 28px;
  --lh-tight: 1.25;
  --lh-body: 1.5;
  --w-normal: 400;
  --w-med: 550;
  --w-semi: 650;
  --w-bold: 750;
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --bw: 1px;
  --r-1: 6px;
  --r-2: 10px;
  --r-3: 14px;
  --r-full: 999px;
  --sh-1: none;
  --shadow: var(--sh-1);
  --max-content: 1120px;
  --max-content-wide: 1440px;
  --content-gutter: 32px;
  --sidebar-w: 248px;
  --breakpoint: 768px;
}
@media (prefers-color-scheme: light) {
  :root {
    --bg: #f6f7f9;
    --surface: #ffffff;
    --surface-2: #f0f2f5;
    --sunk: #eef0f3;
    --line: #dfe3e8;
    --line-hi: #c3cbd4;
    --text-primary: #11161d;
    --text-secondary: #5a6470;
    --text-tertiary: #8a949f;
    --threat: #c62a30;
    --attention: #8a5a00;
    --info: #3f6183;
    --dismissed: #5f666f;
    --healthy: #1a7f37;
    --system: #5b46c9;
    --focus: #0b62d6;
    --t-threat: rgba(198, 42, 48, .07);
    --t-attention: rgba(138, 90, 0, .07);
    --t-map: rgba(63, 97, 131, .08);
    --t-map-context: rgba(63, 97, 131, .035);
    --t-map-subject: rgba(11, 98, 214, .12);
    --t-healthy: rgba(26, 127, 55, .07);
    --t-system: rgba(91, 70, 201, .07);
    --video-surface: #11161d;
    --sh-1: 0 1px 2px rgba(16, 24, 40, .05), 0 1px 3px rgba(16, 24, 40, .06);
  }
}

* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text-primary);
  font: var(--w-normal) var(--t-body)/var(--lh-body) -apple-system, BlinkMacSystemFont,
        "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-text-size-adjust: 100%;
}
a { color: inherit; }
b, strong, .n, .v, time, .num, .big, .kpi-value, code {
  font-variant-numeric: tabular-nums;
}
h1, h2, h3, p { overflow-wrap: anywhere; }
h1, h2, h3 { line-height: var(--lh-tight); }
h1 { margin: 0 0 var(--sp-4); font-size:var(--t-title); font-weight: var(--w-semi); letter-spacing:-.02em; }
h2 { margin: var(--sp-6) 0 var(--sp-3); font-weight: var(--w-semi); }
h2 { font-size:var(--t-headline); }
h3 { margin: 0 0 var(--sp-2); font-size:var(--t-subhead); font-weight: var(--w-med); }
.meta, .proof, .why, .src, summary { color: var(--text-secondary); font-size: var(--t-label); }
.big, .huge, .t, .num { font-size: var(--t-headline); line-height: var(--lh-tight); }
:focus-visible { outline: var(--bw) solid var(--focus); outline-offset: var(--sp-1); }

.app-shell { display: grid; grid-template-columns: var(--sidebar-w) minmax(0, 1fr); min-height: 100vh; }
.shell-main { min-width: 0; }
.page { width: 100%; }
.content { width:100%; max-width: var(--max-content); margin: 0 auto; padding: var(--sp-6) var(--content-gutter) var(--sp-7); }
.mode-wide .content { max-width:var(--max-content-wide); }
.shell-context { display:flex; align-items:center; gap:var(--sp-2); min-height:var(--sp-5); margin:0 0 var(--sp-3); color:var(--text-tertiary); font-size:var(--t-label); }
.shell-context a { color:var(--text-secondary); text-decoration:none; }
.shell-context a:hover { color:var(--text-primary); }
.shell-context [aria-current="page"] { color:var(--text-secondary); }
.shell-context .scope { margin-left:auto; }
.grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--sp-4); }
.col-12 { grid-column: span 12; }
.col-8 { grid-column: span 8; }
.col-7 { grid-column: span 7; }
.col-6 { grid-column: span 6; }
.col-5 { grid-column: span 5; }
.col-4 { grid-column: span 4; }
.col-3 { grid-column: span 3; }
.card-grid, .kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-4); }

.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  overflow:hidden;
  background: var(--surface);
  border-right: var(--bw) solid var(--line);
}
.sidebar-brand { flex:0 0 auto; padding:var(--sp-5) var(--sp-5) var(--sp-4); border-bottom:var(--bw) solid var(--line); }
.sidebar-brand b { display:block; font-size:var(--t-headline); letter-spacing:-.02em; }
.sidebar-brand span { display:block; margin-top:var(--sp-1); color:var(--text-tertiary); font-size:var(--t-label); }
.sidebar-nav { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:var(--sp-3); scrollbar-gutter:stable; }
.sidebar-nav, .site-options, .mobile-sites, .mobile-links { scrollbar-width:thin; scrollbar-color:var(--line-hi) transparent; }
.sidebar-nav::-webkit-scrollbar, .site-options::-webkit-scrollbar,
.mobile-sites::-webkit-scrollbar, .mobile-links::-webkit-scrollbar { width:8px; height:8px; }
.sidebar-nav::-webkit-scrollbar-track, .site-options::-webkit-scrollbar-track,
.mobile-sites::-webkit-scrollbar-track, .mobile-links::-webkit-scrollbar-track { background:transparent; }
.sidebar-nav::-webkit-scrollbar-thumb, .site-options::-webkit-scrollbar-thumb,
.mobile-sites::-webkit-scrollbar-thumb, .mobile-links::-webkit-scrollbar-thumb { background:var(--line-hi); border-radius:var(--r-full); }
.sidebar-area { margin:0 0 var(--sp-2); }
.sidebar-area > summary {
  display:grid; grid-template-columns:minmax(0,1fr) var(--sp-5); align-items:center; gap:var(--sp-2);
  min-height:40px; padding:var(--sp-2) var(--sp-3);
  border-radius:var(--r-1); color:var(--text-secondary); font-size:var(--t-label);
  font-weight:var(--w-bold); letter-spacing:.055em; text-transform:uppercase; cursor:pointer;
}
.sidebar-area > summary::-webkit-details-marker { display:none; }
.sidebar-area > summary::after { content:"+"; color:var(--text-tertiary); font-size:var(--t-subhead); font-weight:var(--w-normal); line-height:1; text-align:center; }
.sidebar-area[open] > summary::after { content:"−"; }
.sidebar-area.active > summary { color:var(--text-primary); background:var(--surface-2); }
.sidebar-area.single > summary { display:none; }
.sidebar-links { padding:var(--sp-1) 0 var(--sp-2); }
.nav-subgroup { min-width:0; }
.nav-subgroup + .nav-subgroup { margin-top:var(--sp-2); padding-top:var(--sp-2); border-top:var(--bw) solid var(--line); }
.nav-subgroup-label { margin:0 var(--sp-3) var(--sp-1); color:var(--text-tertiary); font-size:var(--t-label); font-weight:var(--w-semi); }
.nav-subgroup-list { list-style:none; margin:0; padding:0; }
.nav-subgroup-list li { min-width:0; }
.sidebar-links .nav-subgroup-list a { width:100%; min-width:0; }
.sidebar-label {
  color: var(--text-tertiary);
  font-size: var(--t-label);
  font-weight: var(--w-bold);
  letter-spacing: .06em;
  text-transform: uppercase;
  margin: 0 0 var(--sp-2);
}
.sidebar a { display:flex; align-items:center; min-height:38px; color:var(--text-secondary); text-decoration:none; padding:var(--sp-2) var(--sp-3); border-radius:var(--r-1); }
.sidebar a:hover { color:var(--text-primary); background:var(--surface-2); }
.sidebar a.on { color:var(--text-primary); background:var(--surface-2); box-shadow:inset 3px 0 var(--focus); font-weight:var(--w-semi); }
.sidebar-footer { flex:0 0 auto; padding:var(--sp-3); border-top:var(--bw) solid var(--line); background:var(--surface); }
.sidebar-user { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--sp-1) var(--sp-2); align-items:center; padding:0 var(--sp-2) var(--sp-3); }
.sidebar-user .meta:first-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sidebar-user > a { min-height:auto; padding:var(--sp-1); }
.site-switch { margin:0; }
.site-switch > summary { display:flex; align-items:center; gap:var(--sp-2); min-height:42px; padding:var(--sp-2) var(--sp-3); border:var(--bw) solid var(--line); border-radius:var(--r-1); cursor:pointer; list-style:none; }
.site-switch > summary::-webkit-details-marker { display:none; }
.site-switch > summary span { color:var(--text-tertiary); font-size:var(--t-label); }
.site-switch > summary strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--t-body); font-weight:var(--w-med); }
.site-switch > summary::after { content:"+"; margin-left:auto; color:var(--text-tertiary); }
.site-switch[open] > summary::after { content:"−"; }
.site-options { max-height:34vh; overflow-y:auto; padding-top:var(--sp-2); }
.site-options a { min-height:36px; }
.mobile-top { display: none; }
.mobile-links { display:flex; }
.mobile-context { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); flex-wrap: wrap; padding-bottom: var(--sp-2); border-bottom: var(--bw) solid var(--line); }
.mobile-sites { display: flex; gap: var(--sp-1); flex-wrap: wrap; }
.mobile-sites a { border: var(--bw) solid var(--line); border-radius: var(--r-full); }

.status-bar {
  position:sticky;
  top:0;
  z-index:10;
  min-height: calc(var(--sp-7) - var(--sp-2));
  background: var(--surface);
  border-bottom: var(--bw) solid var(--line);
  color: var(--text-secondary);
  font-size: var(--t-label);
}
.status-inner { display:flex; align-items:center; gap:var(--sp-3); width:100%; max-width:var(--max-content); min-height:inherit; margin:0 auto; padding:var(--sp-2) var(--content-gutter); }
.mode-wide .status-inner { max-width:var(--max-content-wide); }
.status-dot { width: var(--sp-2); height: var(--sp-2); border-radius: var(--r-full); flex: 0 0 auto; }
.status-dot.ok { background: var(--healthy); }
.status-dot.warn { background: var(--attention); }
.status-dot.unknown { background: var(--text-tertiary); }
.status-dot.roto { background: var(--system); box-shadow: 0 0 0 var(--sp-1) var(--t-system); }

.alert-card, .card, .group, .cfg, .kpi-widget, .photo-viewer, .transcript {
  background: var(--surface);
  border: var(--bw) solid var(--line);
  border-radius: var(--r-2);
  box-shadow: var(--sh-1);
}
.alert-card {
  display: grid;
  grid-template-columns: calc(var(--sp-7) + var(--sp-7)) minmax(0, 1fr);
  overflow: hidden;
  margin: 0 0 var(--sp-3);
}
.alert-card.notify {
  border: 2px solid var(--threat);
  border-left-width: var(--sp-2);
  background: linear-gradient(90deg, var(--t-threat), var(--surface) 42%);
  box-shadow: 0 0 0 3px var(--t-threat), var(--sh-1);
}
.alert-card.hot { border-left: var(--sp-1) solid var(--attention); }
.alert-card.cold { border-left: var(--sp-1) solid var(--info); }
.alert-card.ignore { border-left: var(--sp-1) solid var(--dismissed); }
.alert-photo { background: var(--sunk); min-height: calc(var(--sp-7) + var(--sp-7)); }
.alert-photo img, .card > img.shot, .card > a > img.shot { width: 100%; height: 100%; object-fit: cover; display: block; }
.alert-body, .card .body { padding: var(--sp-3) var(--sp-4); min-width: 0; }
.alert-meta { display: flex; gap: var(--sp-2); align-items: center; flex-wrap: wrap; color: var(--text-secondary); font-size: var(--t-label); }
.alert-reason { margin: var(--sp-2) 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.alert-actions, .bar { display: flex; gap: var(--sp-2); flex-wrap: wrap; margin-top: var(--sp-2); }
.alarm-state { display:flex; align-items:flex-start; gap:var(--sp-3); margin:var(--sp-3) 0; padding:var(--sp-3); border-left:var(--sp-1) solid var(--threat); border-radius:var(--r-1); background:var(--t-threat); }
.alarm-state::before { content:"!"; display:grid; place-items:center; flex:0 0 var(--sp-6); width:var(--sp-6); height:var(--sp-6); border-radius:var(--r-full); background:var(--threat); color:white; font-weight:var(--w-bold); }
.alarm-state strong, .alarm-state span { display:block; }
.alarm-state span { margin-top:var(--sp-1); color:var(--text-secondary); font-size:var(--t-label); }
.reported-location { margin:var(--sp-3) 0; padding:var(--sp-3); border:var(--bw) solid var(--line); border-radius:var(--r-1); background:var(--surface-2); }
.reported-location p { margin:0 0 var(--sp-2); }
.draft { border-left: 3px solid var(--line); padding: var(--sp-1) var(--sp-3); margin-top: var(--sp-3); opacity: .92; }
.draft p { margin: 2px 0; }
button.sugerido { outline: 2px dashed currentColor; outline-offset: 2px; }
.today-title { margin-bottom:var(--sp-5); }
.today-section { margin:0 0 var(--sp-7); }
.today-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:var(--sp-3); flex-wrap:wrap; margin-bottom:var(--sp-3); }
.today-section-head h2, .today-section-head p { margin:0; }
.today-section-lead { max-width:52rem; color:var(--text-secondary); }
.today-empty { padding:var(--sp-4); border-left:var(--sp-1) solid var(--healthy); background:var(--surface-2); border-radius:var(--r-1); }
.today-empty p { margin:var(--sp-1) 0 0; color:var(--text-secondary); }
.live-notify-monitor { display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); margin:0 0 var(--sp-4); padding:var(--sp-3) var(--sp-4); border:var(--bw) solid var(--line); border-radius:var(--r-2); background:var(--surface-2); }
.live-notify-monitor p { margin:0; color:var(--text-secondary); font-size:var(--t-label); }
.live-notify-monitor button { flex:0 0 auto; }
.live-notify-monitor button[aria-pressed=true] { border-color:var(--healthy); color:var(--healthy); }
.live-notify-toast { position:fixed; top:var(--sp-4); right:var(--sp-4); z-index:100; width:min(28rem,calc(100vw - var(--sp-5))); padding:var(--sp-4); border:2px solid var(--threat); border-left-width:var(--sp-2); border-radius:var(--r-2); background:var(--surface); box-shadow:var(--sh-2); }
.live-notify-toast[hidden] { display:none; }
.live-notify-toast-head { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-3); }
.live-notify-toast h2, .live-notify-toast p { margin:0; }
.live-notify-toast h2 { color:var(--threat); font-size:var(--t-subhead); }
.live-notify-toast p { margin-top:var(--sp-2); color:var(--text-secondary); }
.live-notify-toast .bar { margin-top:var(--sp-3); }
.live-notify-toast-close { min-width:44px; min-height:44px; padding:var(--sp-1); font-size:var(--t-headline); line-height:1; }
.console-summary { margin:0 0 var(--sp-4); }
.console-summary p { margin:0; }
.console-counts { display:flex; gap:var(--sp-2) var(--sp-4); flex-wrap:wrap; color:var(--text-secondary); }
.console-counts b { color:var(--text-primary); }
.console-range { margin-top:var(--sp-2) !important; color:var(--text-secondary); }
.console-layout { display:grid; grid-template-columns:minmax(0,5fr) minmax(320px,3fr); gap:var(--sp-5); align-items:start; }
.incident-focus { position:sticky; top:calc(var(--sp-7) + var(--sp-3)); margin:0 0 var(--sp-5); scroll-margin-top:var(--sp-6); }
.incident-focus > .meta { display: flex; justify-content: space-between; gap: var(--sp-2); flex-wrap: wrap; }
.incident-focus .alert-card { margin-bottom: var(--sp-2); }
.incident-members { margin: var(--sp-2) 0 var(--sp-4); }
.incident-members ul { margin: var(--sp-2) 0 0; padding-left: var(--sp-5); }
.incident-members li { padding: var(--sp-1) 0; }
.incident-index { margin:0; }
.incident-index-head { display:flex; align-items:flex-end; justify-content:space-between; gap:var(--sp-3); flex-wrap:wrap; margin-bottom:var(--sp-3); }
.incident-index-head h3, .incident-index-head p { margin:0; }
.incident-queue { list-style:none; margin:0; padding:0; border:var(--bw) solid var(--line); border-radius:var(--r-2); overflow:hidden; background:var(--surface); }
.incident-queue-item { margin:0; border-bottom:var(--bw) solid var(--line); }
.incident-queue-item:last-child { border-bottom:0; }
.incident-queue-link { display:grid; grid-template-columns:var(--sp-7) minmax(0,1fr) auto; gap:var(--sp-3); align-items:center; min-height:56px; padding:var(--sp-3) var(--sp-4); text-decoration:none; }
.incident-queue-link:hover { background:var(--surface-2); }
.incident-rank { color:var(--text-tertiary); font-size:var(--t-subhead); font-weight:var(--w-semi); text-align:center; }
.incident-queue-main { min-width:0; }
.incident-queue-top { display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; }
.incident-queue-when { color:var(--text-secondary); font-size:var(--t-label); }
.incident-queue-reason { display:block; margin:var(--sp-1) 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-secondary); }
.incident-queue-side { display:grid; justify-items:end; gap:var(--sp-1); color:var(--text-secondary); font-size:var(--t-label); white-space:nowrap; }
.incident-queue-side .unattended { color:var(--attention); font-weight:var(--w-semi); }
.incident-pager { display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); margin-top:var(--sp-3); }
.incident-pager a { display:inline-flex; align-items:center; min-height:44px; padding:var(--sp-2) var(--sp-3); border:var(--bw) solid var(--line); border-radius:var(--r-1); text-decoration:none; }
.incident-pager a:hover { background:var(--surface-2); }
.alert-review-nav { margin:var(--sp-3) 0 var(--sp-4); }
.alert-review-nav .incident-pager { margin-top:0; }
.alert-review-nav .pager-boundary { display:inline-flex; align-items:center; min-height:44px; padding:var(--sp-2) var(--sp-3); border:var(--bw) solid var(--line); border-radius:var(--r-1); color:var(--text-tertiary); opacity:.65; }
.alert-review-position { margin:var(--sp-2) 0; text-align:center; }
.alert-day-reference { border:var(--bw) solid var(--line); border-radius:var(--r-1); background:var(--surface); }
.alert-day-reference > summary { min-height:44px; padding:var(--sp-2) var(--sp-3); cursor:pointer; color:var(--text-secondary); }
.alert-day-list { max-height:18rem; overflow-y:auto; list-style:none; margin:0; padding:0; border-top:var(--bw) solid var(--line); }
.alert-day-list li { margin:0; border-bottom:var(--bw) solid var(--line); }
.alert-day-list li:last-child { border-bottom:0; }
.alert-day-list a, .alert-day-current { display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); min-height:44px; padding:var(--sp-2) var(--sp-3); text-decoration:none; }
.alert-day-list a:hover { background:var(--surface-2); }
.alert-day-current { background:var(--surface-2); font-weight:var(--w-semi); }
.alert-day-identity { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.alert-day-tier { color:var(--text-secondary); font-size:var(--t-label); white-space:nowrap; }
.hot-record-list { border-left:var(--sp-1) solid var(--attention); }
.hot-policy { color:var(--text-secondary); font-size:var(--t-label); }
.hot-record-members { margin:0; padding:0 var(--sp-4) var(--sp-3) calc(var(--sp-7) + var(--sp-7)); }
.hot-record-members summary { cursor:pointer; color:var(--text-secondary); font-size:var(--t-label); }
.hot-record-members ul { margin:var(--sp-2) 0 0; padding-left:var(--sp-5); }
.hot-record-members li { padding:var(--sp-1) 0; }
.cold-summary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--sp-3); }
.cold-site { padding:var(--sp-4); border:var(--bw) solid var(--line); border-left:var(--sp-1) solid var(--info); border-radius:var(--r-2); background:var(--surface); }
.cold-site header { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-3); }
.cold-site h3, .cold-site p { margin:0; }
.cold-site-counts { text-align:right; color:var(--text-secondary); }
.cold-site-range { margin-top:var(--sp-2) !important; color:var(--text-secondary); font-size:var(--t-label); }
.cold-reasons { margin:var(--sp-3) 0 0; padding-left:var(--sp-5); color:var(--text-secondary); }
.cold-reasons li { padding:var(--sp-1) 0; }
.cold-digest-link { display:inline-flex; align-items:center; min-height:44px; margin-top:var(--sp-2); }
.card { overflow: hidden; margin: var(--sp-4) 0; }
.card.notify { border-color: var(--threat); }
.card.hot { border-left: var(--sp-1) solid var(--attention); }
.card.cold { border-left: var(--sp-1) solid var(--info); }
.card.ignore { border-left: var(--sp-1) solid var(--dismissed); }
.card .tier, .tier-badge { margin: 0; }

.tier-badge, .tier {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  font-size: var(--t-label);
  font-weight: var(--w-bold);
  letter-spacing: .06em;
  text-transform: uppercase;
}
.tier-badge::before { content: ""; width: var(--sp-2); height: var(--sp-2); border-radius: var(--r-full); background: currentColor; }
.tier-badge.notify, .tier.notify { color: var(--threat); }
.tier-badge.hot, .tier.hot { color: var(--attention); }
.tier-badge.cold, .tier.cold { color: var(--info); }
.tier-badge.ignore, .tier.ignore { color: var(--dismissed); }
.tier-badge.pending, .tier.pending { color: var(--text-tertiary); }

.table-wrap, .logwrap {
  overflow-x: auto;
  border: var(--bw) solid var(--line);
  border-radius: var(--r-2);
  background: var(--surface);
  margin: var(--sp-4) 0;
}
table.data-table, table.log, table.kpi { width: 100%; border-collapse: collapse; font-size: var(--t-body); font-variant-numeric: tabular-nums; }
table.data-table th, table.log th, table.kpi th {
  text-align: left;
  color: var(--text-secondary);
  font-size: var(--t-label);
  font-weight: var(--w-med);
  padding: var(--sp-2) var(--sp-3);
  border-bottom: var(--bw) solid var(--line);
  white-space: nowrap;
}
table.data-table td, table.log td, table.kpi td { padding: var(--sp-2) var(--sp-3); border-bottom: var(--bw) solid var(--line); vertical-align: top; }
table.data-table tr:hover td, table.log tr:hover td, table.kpi tr:hover td { background: var(--surface-2); }
table.data-table img { width: calc(var(--sp-7) + var(--sp-7)); height: var(--sp-7); object-fit: cover; border-radius: var(--r-1); display: block; }
table .who { font-weight: var(--w-semi); white-space: nowrap; }
table .when, table .meta { color: var(--text-secondary); white-space: nowrap; }
table.kpi td.v { text-align: right; font-weight: var(--w-semi); }

.kpi-widget { padding: var(--sp-4); }
.kpi-value { font-size: var(--t-headline); font-weight: var(--w-bold); }
.kpi-label { color: var(--text-secondary); font-size: var(--t-label); }
.metric-ledger { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:var(--sp-4) 0; border-block:var(--bw) solid var(--line); }
.metric-ledger > div { min-width:0; padding:var(--sp-3) var(--sp-4); border-right:var(--bw) solid var(--line); }
.metric-ledger > div:nth-child(4n) { border-right:0; }
.metric-ledger dt { color:var(--text-secondary); font-size:var(--t-label); }
.metric-ledger dd { margin:var(--sp-1) 0 0; color:var(--text-primary); font-size:var(--t-headline); font-weight:var(--w-bold); font-variant-numeric:tabular-nums; }
.notice, .banner, .receipt, .safety {
  padding: var(--sp-3) var(--sp-4);
  margin: var(--sp-3) 0;
  border: var(--bw) solid var(--line);
  border-radius: var(--r-2);
  background: var(--sunk);
  font-size: var(--t-label);
}
.notice.debt, .banner.debt { border-left: var(--sp-1) solid var(--system); background: var(--t-system); }
.notice.warn, .banner.amarillo, .safety { border-left: var(--sp-1) solid var(--attention); background: var(--t-attention); }
.notice.ok { border-left: var(--sp-1) solid var(--healthy); background: var(--t-healthy); }
.receipt { border-left: var(--sp-1) solid var(--healthy); background: var(--t-healthy); }
.notices details { margin: var(--sp-2) 0; }

button, .btn {
  font: inherit;
  font-size: var(--t-body);
  padding: var(--sp-2) var(--sp-4);
  min-height: calc(var(--sp-7) - var(--sp-1));
  border: var(--bw) solid var(--line-hi);
  border-radius: var(--r-2);
  background: var(--surface);
  color: var(--text-primary);
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
button:hover, .btn:hover { border-color: var(--focus); background: var(--sunk); }
button.primary { border-color: var(--healthy); color: var(--healthy); }
button.esc { border-color: var(--attention); color: var(--attention); }
button.no { color: var(--text-secondary); }
button.small { font-size: var(--t-label); min-height: var(--sp-6); }
button[disabled] { opacity: .5; cursor: not-allowed; }
form.inline { display: inline; }
input, select, textarea {
  font: inherit;
  min-height: calc(var(--sp-7) - var(--sp-1));
  padding: var(--sp-2) var(--sp-3);
  border: var(--bw) solid var(--line-hi);
  border-radius: var(--r-2);
  background: var(--surface);
  color: var(--text-primary);
}
textarea { resize: vertical; }

.integration-form .cfg { padding-bottom: var(--sp-4); }
.integration-form { position:relative; }
.active-config-disclosure { overflow:hidden; }
.active-config-disclosure > .cfg { margin:0; border:0; border-top:var(--bw) solid var(--line); border-radius:0; }
.active-config-disclosure > .cfg > h2 { display:none; }
.integration-editor-head { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-4); margin:var(--sp-4) 0; }
.integration-editor-head > p { margin:0; max-width:68ch; }
.integration-steps { display:grid; gap:var(--sp-2); margin:var(--sp-4) 0; }
.integration-step { overflow:hidden; scroll-margin-top:calc(var(--sp-7) * 2); }
.integration-step > summary { justify-content:space-between; gap:var(--sp-4); min-height:64px; padding:var(--sp-3) var(--sp-4); color:var(--text-primary); }
.integration-step[open] > summary { background:var(--surface-2); border-bottom:var(--bw) solid var(--line); }
.integration-step-title { min-width:0; }
.integration-step-title > b { display:block; font-size:var(--t-body); }
.integration-step-title > .meta { display:block; margin-top:var(--sp-1); }
.integration-step-state { flex:0 0 auto; white-space:nowrap; }
.integration-step > .cfg { margin:0; border:0; border-radius:0; }
.integration-step > .cfg > h2 { display:none; }
.integration-step.advanced > summary { color:var(--text-secondary); }
.integration-review-bar { position:sticky; bottom:var(--sp-3); z-index:8; display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); margin:var(--sp-3) 0; padding:var(--sp-3) var(--sp-4); border:var(--bw) solid var(--line-hi); border-radius:var(--r-2); background:var(--surface-2); box-shadow:var(--sh-1); }
.integration-review-bar > span { max-width:64ch; color:var(--text-secondary); font-size:var(--t-label); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); padding: var(--sp-4); }
.form-field { display: flex; flex-direction: column; gap: var(--sp-1); min-width: 0; }
.form-field.full { grid-column: 1 / -1; }
.form-field > span, .check-field > span { color: var(--text-secondary); font-size: var(--t-label); font-weight: var(--w-med); }
.form-field input, .form-field textarea, .form-field select { width: 100%; }
.form-help { color: var(--text-tertiary); font-size: var(--t-label); }
.period-filter { margin:var(--sp-4) 0; padding:var(--sp-4); border:var(--bw) solid var(--line); border-radius:var(--r-2); background:var(--surface); }
.period-filter h2 { margin-top:0; }
.period-filter-form { display:grid; grid-template-columns:minmax(10rem,1fr) minmax(10rem,1fr) auto; align-items:end; gap:var(--sp-3); }
.period-filter-form button { white-space:nowrap; }
.period-shortcuts { margin-top:var(--sp-3); }
.check-field { display: flex; align-items: center; gap: var(--sp-2); min-height: calc(var(--sp-7) - var(--sp-1)); }
.check-field input { min-height: var(--sp-5); width: var(--sp-5); }
.secret-controls { border-top: var(--bw) solid var(--line); padding-top: var(--sp-2); }
.proposal-actions { display: flex; flex-wrap: wrap; align-items: end; gap: var(--sp-3); padding: var(--sp-4); border-top: var(--bw) solid var(--line); }
.proposal-actions .form-field { flex: 1 1 calc(var(--sidebar-w) + var(--sp-7)); }
.connection-ledger { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin:var(--sp-4) 0; border-top:var(--bw) solid var(--line); border-left:var(--bw) solid var(--line); }
.connection-row { min-width:0; padding:var(--sp-3) var(--sp-4); border-right:var(--bw) solid var(--line); border-bottom:var(--bw) solid var(--line); background:var(--surface); }
.connection-row-head { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-3); }
.connection-row h3 { display:flex; align-items:center; gap:var(--sp-2); min-width:0; margin:0; }
.connection-row .connection-state { flex:0 0 auto; margin:0; font-weight:var(--w-med); }
.connection-row .connection-description { min-height:2.5em; margin:var(--sp-2) 0; }
.connection-row .connection-facts { display:flex; flex-wrap:wrap; gap:var(--sp-1) var(--sp-3); margin:0; color:var(--text-tertiary); font-size:var(--t-label); }
.connection-row .connection-facts span { white-space:nowrap; }
.connection-detail { border: var(--bw) solid var(--line); border-radius: var(--r-2); background: var(--surface); }
.config-scope-note { margin:var(--sp-2) 0 var(--sp-4); }
.plant-config-list { display:grid; gap:var(--sp-2); margin:var(--sp-4) 0; }
.plant-config { overflow:hidden; }
.plant-config > summary { justify-content:space-between; gap:var(--sp-4); min-height:64px; padding:var(--sp-3) var(--sp-4); color:var(--text-primary); }
.plant-config-summary-main { min-width:0; }
.plant-config-summary-main > b { display:block; font-size:var(--t-body); }
.plant-config-summary-main > .meta { display:block; margin-top:var(--sp-1); }
.plant-config-summary-state { flex:0 0 auto; white-space:nowrap; }
.plant-config > .cfg { margin:0; border:0; border-top:var(--bw) solid var(--line); border-radius:0; }
.live-status-card { margin: var(--sp-4) 0; padding: var(--sp-4); background: var(--sunk); border: var(--bw) solid var(--line); border-radius: var(--r-2); }
.live-status-card > h2 { margin: 0; }
.live-signal-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:var(--sp-4); border-top:var(--bw) solid var(--line); border-left:var(--bw) solid var(--line); }
.live-signal-row { min-width:0; padding:var(--sp-3); border-right:var(--bw) solid var(--line); border-bottom:var(--bw) solid var(--line); background:var(--surface); }
.live-signal-head { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-3); }
.live-signal-name { display:flex; align-items:center; gap:var(--sp-2); min-width:0; font-weight:var(--w-semi); }
.live-signal-state { flex:0 0 auto; color:var(--text-primary); font-size:var(--t-label); }
.live-signal-detail { min-height:2.5em; margin:var(--sp-2) 0; }
.live-signal-age { margin:0; color:var(--text-tertiary); }
.live-projection-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--sp-4); align-items:start; }
.stream-panel { background: var(--surface); border: var(--bw) solid var(--line); border-radius: var(--r-2); overflow: hidden; }
.stream-panel.compact { margin:var(--sp-4) 0; }
.live-video { display:block; width:100%; min-height:18rem; max-height:70vh; background:var(--video-surface); border-radius:var(--r-1); }
.stream-frame { aspect-ratio: 16 / 9; display: grid; place-items: center; background: var(--sunk); min-height: calc(var(--sp-7) * 3); }
.stream-frame img { width: 100%; height: 100%; object-fit: contain; display: block; }
.stream-frame img[hidden] { display:none; }
.stream-copy { padding: var(--sp-4); }
.cockpit { display:grid; grid-template-columns:minmax(0,2fr) minmax(20rem,1fr); gap:var(--sp-4); margin-top:var(--sp-4); }
.cockpit-video { grid-column:1 / -1; order:1; }
.cockpit-connection, .cockpit-telemetry, .cockpit-detections { padding:var(--sp-4); border:var(--bw) solid var(--line); border-radius:var(--r-2); background:var(--surface); }
.cockpit-connection { grid-column:1; order:2; }
.cockpit-telemetry { grid-column:1; order:3; }
.cockpit-detections { grid-column:2; grid-row:2 / span 2; order:4; }
.cockpit > details { grid-column:1 / -1; order:5; }
.cockpit-section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-4); margin-bottom:var(--sp-3); }
.cockpit-section-head h2 { margin:0; }
.session-state { flex:0 0 auto; padding:var(--sp-1) var(--sp-2); border-radius:var(--r-full); background:var(--surface-2); font-size:var(--t-label); }
.equipment-ledger { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--sp-2); margin:var(--sp-4) 0; }
.equipment-ledger > div { min-width:0; padding:var(--sp-3); border:var(--bw) solid var(--line); border-radius:var(--r-1); background:var(--surface-2); }
.equipment-ledger dt { color:var(--text-tertiary); font-size:var(--t-label); }
.equipment-ledger dd { margin:var(--sp-1) 0 0; overflow-wrap:anywhere; font-weight:var(--w-semi); }
.telemetry-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--sp-2); }
.telemetry-grid article { min-width:0; padding:var(--sp-3); border:var(--bw) solid var(--line); border-radius:var(--r-1); background:var(--sunk); }
.telemetry-grid span { display:block; color:var(--text-tertiary); font-size:var(--t-label); }
.telemetry-grid strong { display:block; margin-top:var(--sp-1); font-size:var(--t-h3); font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.cockpit-map { margin-top:var(--sp-4); }
.drone-position-map, .empty-instrument { display:block; width:100%; min-height:13rem; border:var(--bw) solid var(--line); border-radius:var(--r-1); background:var(--sunk); }
.empty-instrument { display:grid; place-items:center; color:var(--text-tertiary); }
.cockpit-grid { fill:none; stroke:var(--line); stroke-width:1; }
.drone-range { fill:var(--t-map); stroke:var(--focus); stroke-width:2; opacity:.35; }
.drone-marker { fill:var(--focus); stroke:var(--text-primary); stroke-width:2; }
.drone-position-map text { fill:var(--text-secondary); font-size:14px; font-variant-numeric:tabular-nums; }
.cockpit-detections .table-wrap { max-height:24rem; overflow:auto; }
.cockpit-feed { display:grid; gap:var(--sp-2); max-height:24rem; margin:0; padding:0; overflow:auto; list-style:none; }
.cockpit-feed li { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-3); padding:var(--sp-3); border-bottom:var(--bw) solid var(--line); }
.cockpit-feed span { color:var(--text-tertiary); font-size:var(--t-label); }
.integration-status { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); }
.integration-status > section { min-width: 0; }
.notification-setup { display:grid; grid-template-columns:repeat(auto-fit,minmax(13rem,1fr)); gap:var(--sp-2); margin:var(--sp-4) 0; padding:0; list-style:none; }
.notification-setup-step { display:flex; min-width:0; min-height:13rem; flex-direction:column; padding:var(--sp-3); border:var(--bw) solid var(--line); border-radius:var(--r-2); background:var(--surface); }
.notification-setup-step.current { border:2px solid var(--focus); }
.notification-setup-step.done { border-color:var(--text-tertiary); }
.notification-setup-step.external { border-style:dashed; }
.notification-setup-head { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-2); }
.notification-setup-head b { color:var(--text-primary); }
.notification-setup-status { flex:0 0 auto; white-space:normal; text-align:right; }
.notification-setup-step > p { margin:var(--sp-2) 0 0; }
.notification-setup-action { margin-top:auto !important; padding-top:var(--sp-3); }
.notification-boundary { padding-top:var(--sp-3); border-top:var(--bw) solid var(--line); }
.notification-mail-setup, #notification-proposal, #notification-dry-run { scroll-margin-top:calc(var(--sp-7) * 2); }
.cfg[id^="proposal-"] { scroll-margin-top:calc(var(--sp-7) * 2); }
.acceptance-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--sp-2); margin:var(--sp-4) 0; }
.acceptance-step { border:var(--bw) solid var(--line); border-radius:var(--r-1); padding:var(--sp-3); background:var(--surface); }
.acceptance-step.done { border-color:var(--text-tertiary); }
.acceptance-step.current { border-width:2px; border-color:var(--focus); }
.acceptance-step b { display:block; margin-bottom:var(--sp-1); }
.email-preview { border:var(--bw) solid var(--line); border-radius:var(--r-2); padding:var(--sp-4); background:var(--surface); }
.email-body { white-space:pre-wrap; overflow-wrap:anywhere; font:inherit; line-height:1.55; background:var(--sunk); padding:var(--sp-4); border-radius:var(--r-1); }
.plant-map { width:100%; min-height:28rem; max-height:72vh; display:block; background:var(--sunk); border:var(--bw) solid var(--line); border-radius:var(--r-2); }
.map-region { scroll-margin-top:calc(var(--sp-7) + var(--sp-4)); }
.map-provenance { margin:var(--sp-3) 0; }
.map-provenance-body { padding:0 var(--sp-4) var(--sp-3); }
.map-provenance-body p { margin:var(--sp-2) 0 0; }
.map-shell { border:var(--bw) solid var(--line); border-radius:var(--r-2); overflow:hidden; background:var(--surface); }
.map-shell .plant-map { border:0; border-radius:0; touch-action:none; cursor:grab; }
.map-shell .plant-map.dragging { cursor:grabbing; }
.map-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:var(--sp-2); padding:var(--sp-2); border-bottom:var(--bw) solid var(--line); }
.map-toolbar .meta { margin-left:auto; }
.map-plant-area { fill:var(--t-map-context); stroke:var(--text-tertiary); stroke-width:1; vector-effect:non-scaling-stroke; }
.map-fence { fill:none; stroke:var(--healthy); stroke-width:4; vector-effect:non-scaling-stroke; }
.map-analytic { fill:none; stroke:var(--attention); stroke-width:1.5; stroke-dasharray:9 7; opacity:.58; vector-effect:non-scaling-stroke; }
.map-context { fill:var(--t-map); stroke:var(--text-tertiary); stroke-width:1; opacity:.35; vector-effect:non-scaling-stroke; }
.map-context.provisional { fill:none; stroke-dasharray:5 5; }
.map-search { fill:var(--t-attention); stroke:var(--attention); stroke-width:2; stroke-dasharray:8 6; vector-effect:non-scaling-stroke; }
.map-subject-area { fill:var(--t-map-subject); stroke:var(--focus); stroke-width:2; vector-effect:non-scaling-stroke; }
.map-search.selected, .map-subject-area.selected { opacity:.42; }
.map-cluster { stroke-width:2; vector-effect:non-scaling-stroke; }
.map-cluster-hit { fill:none; stroke:transparent; stroke-width:42px; vector-effect:non-scaling-stroke; pointer-events:stroke; }
.map-cluster.camera { fill:var(--surface); stroke:var(--attention); stroke-dasharray:4 3; }
.map-cluster.subject { fill:var(--surface); stroke:var(--focus); }
.map-cluster-count { fill:var(--text-primary); font-size:9.5px; font-weight:var(--w-bold); pointer-events:none; }
.map-legend { display:flex; flex-wrap:wrap; gap:var(--sp-3); margin:var(--sp-3) 0; }
.map-key { min-width:0; }
.map-key::before { content:""; display:inline-block; width:1rem; height:1rem; margin-right:.4rem; vertical-align:-.15rem; border:2px solid var(--text-tertiary); border-radius:50%; }
.map-key.plant::before { border-radius:var(--r-1); background:var(--t-map-context); }
.map-key.fence::before { border-radius:0; border:0; border-top:4px solid var(--healthy); height:.5rem; }
.map-key.analytic::before { border-radius:0; border:0; border-top:2px dashed var(--attention); height:.5rem; }
.map-key.camera::before { border-style:dashed; border-color:var(--attention); background:var(--t-attention); }
.map-key.subject::before { border-color:var(--focus); background:var(--t-map-subject); }
.map-key.context::before { border-style:dotted; border-color:var(--text-tertiary); background:transparent; }
.example-boundary { position:sticky; top:0; z-index:5; display:inline-flex; padding:var(--sp-2) var(--sp-3); border:2px solid var(--attention); border-radius:var(--r-full); background:var(--surface); color:var(--attention); font-weight:var(--w-bold); font-size:var(--t-label); letter-spacing:.03em; }
.example-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--sp-4); margin:var(--sp-4) 0; }
.example-card { overflow:hidden; }
.example-card .example-boundary { position:static; margin:var(--sp-3) var(--sp-3) 0; }
.example-visual { display:grid; place-items:center; margin:var(--sp-3) 0 0; background:var(--sunk); border-block:var(--bw) solid var(--line); }
.example-visual a { display:block; width:100%; }
.example-visual img { display:block; width:100%; aspect-ratio:4/3; object-fit:contain; background:var(--sunk); }
.example-visual figcaption { width:100%; padding:var(--sp-2) var(--sp-4); color:var(--text-tertiary); font-size:var(--t-label); border-top:var(--bw) solid var(--line); }
.example-body { padding:var(--sp-4); }
.example-notification { margin:var(--sp-3) 0; padding:var(--sp-4); border:var(--bw) solid var(--line-hi); border-left:var(--sp-1) solid var(--attention); border-radius:var(--r-2); background:var(--sunk); }
.example-status { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin:var(--sp-3) 0; border-block:var(--bw) solid var(--line); }
.example-status > div { padding:var(--sp-3) 0; }
.example-status > div:nth-child(odd) { padding-right:var(--sp-3); }
.example-status > div:nth-child(even) { padding-left:var(--sp-3); border-left:var(--bw) solid var(--line); }
.example-status dt { color:var(--text-tertiary); font-size:var(--t-label); }
.example-status dd { margin:var(--sp-1) 0 0; color:var(--text-primary); font-weight:var(--w-semi); }
.example-section { margin-top:var(--sp-7); scroll-margin-top:var(--sp-7); }
.example-section-head { max-width:52rem; }
.example-section-head h2 { margin-bottom:var(--sp-1); }
.example-evidence { overflow:hidden; border:var(--bw) solid var(--line); border-radius:var(--r-2); background:var(--surface); }
.example-evidence > summary { font-weight:var(--w-semi); }
.example-evidence-body { padding:0 var(--sp-4) var(--sp-4); border-top:var(--bw) solid var(--line); }
.example-evidence-body > :first-child { margin-top:var(--sp-4); }
.council-seat { padding:var(--sp-3) 0; border-top:var(--bw) solid var(--line); }
.council-seat:first-of-type { border-top:0; }
.council-seat h3 { margin:0 0 var(--sp-2); font-size:var(--t-body); }
.evidence-call-list { margin:0; padding-left:var(--sp-5); }
.evidence-call-list li { margin:0 0 var(--sp-3); }
.evidence-call-list span { display:block; margin-top:var(--sp-1); color:var(--text-secondary); }
.evidence-hash { overflow-wrap:anywhere; word-break:break-all; }
.example-fact-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 var(--sp-4); margin:var(--sp-3) 0; }
.example-fact-list > div { padding:var(--sp-2) 0; border-bottom:var(--bw) solid var(--line); }
.example-fact-list dt { color:var(--text-tertiary); font-size:var(--t-label); }
.example-fact-list dd { margin:var(--sp-1) 0 0; overflow-wrap:anywhere; }
.shadow-feature-list { margin:var(--sp-3) 0 0; padding:0; list-style:none; }
.shadow-feature-list li { padding:var(--sp-2) 0; border-top:var(--bw) solid var(--line); }
.shadow-feature-list span { display:block; color:var(--text-secondary); font-size:var(--t-label); }
.example-actions { display:grid; gap:var(--sp-2); margin-top:var(--sp-3); }
.example-actions .bar { justify-content:flex-start; }
.example-actions button { min-height:44px; }

.place-disclosure { overflow:hidden; margin:var(--sp-3) 0; border:var(--bw) solid var(--line); border-radius:var(--r-2); background:var(--surface); scroll-margin-top:var(--sp-7); }
.place-disclosure > summary { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--sp-3); min-height:64px; padding:var(--sp-3) var(--sp-4); }
.place-disclosure[open] > summary { border-bottom:var(--bw) solid var(--line); }
.place-disclosure-title, .place-disclosure-meta { display:block; }
.place-disclosure-title { color:var(--text-primary); font-weight:var(--w-semi); }
.place-disclosure-meta { margin-top:var(--sp-1); color:var(--text-secondary); font-size:var(--t-label); }
.place-disclosure-state { align-self:center; color:var(--text-secondary); font-size:var(--t-label); text-align:right; white-space:nowrap; }
.place-disclosure .card.place { margin:0; border:0; border-radius:0; box-shadow:none; }
.place .meta a { display:inline-flex; align-items:center; min-height:44px; }

.calm, .empty-state { text-align: center; padding: var(--sp-7) var(--sp-5); }
.calm .t, .empty-title { font-size: var(--t-headline); font-weight: var(--w-semi); }
.calm p, .empty-state p { margin: var(--sp-2) 0; }
.calm .proof, .empty-proof { margin-top: var(--sp-5); color: var(--text-tertiary); font-size: var(--t-label); }
.chips { display: flex; gap: var(--sp-2); flex-wrap: wrap; margin: var(--sp-3) 0; }
.chip, .pill { padding: var(--sp-1) var(--sp-2); border: var(--bw) solid var(--line); border-radius: var(--r-full); color: var(--text-secondary); font-size: var(--t-label); }
.chip.warn { border-color: var(--attention); color: var(--attention); }
.chip.unk { border-style: dashed; }
.filter-chips { display:flex; align-items:center; flex-wrap:wrap; gap:var(--sp-2); margin:var(--sp-3) 0; }
.filter-chips > b { margin-right:var(--sp-1); color:var(--text-secondary); font-size:var(--t-label); }
.filter-chips a { display:inline-flex; align-items:center; min-height:44px; padding:var(--sp-2) var(--sp-3); border:var(--bw) solid var(--line); border-radius:var(--r-full); color:var(--text-secondary); text-decoration:none; font-size:var(--t-label); }
.filter-chips a:hover, .filter-chips a.on { border-color:var(--focus); color:var(--text-primary); background:var(--surface-2); }
.filter-disclosure > .filter-chips { padding:0 var(--sp-3) var(--sp-3); margin:0; }
.audit-table th:first-child, .audit-table td:first-child { position:sticky; left:0; z-index:1; background:var(--surface); }
.audit-table th:first-child { z-index:2; }
.audit-table tr:hover td:first-child { background:var(--surface-2); }
.received-alerts-table th, .received-alerts-table td { min-width:8rem; }
.received-alerts-table th:first-child, .received-alerts-table td:first-child { min-width:12rem; }
.received-alerts-table .received-detail { min-width:18rem; max-width:30rem; white-space:normal; }
.received-alerts-table .received-device { min-width:12rem; }
.noimg { display: grid; place-items: center; min-height: calc(var(--sp-7) + var(--sp-7)); background: var(--sunk); color: var(--text-tertiary); font-size: var(--t-label); }
.photo-viewer { overflow: hidden; margin: 0; }
.photo-viewer img, .photo-viewer-inline img, .card > img.shot { display: block; width: 100%; max-height: 80vh; object-fit: contain; background: var(--sunk); }
.photo-viewer figcaption { padding: var(--sp-3) var(--sp-4); color: var(--text-secondary); font-size: var(--t-label); }
.transcript, details { margin: var(--sp-4) 0; }
.transcript summary, details > summary { display:flex; align-items:center; padding: var(--sp-2) var(--sp-3); min-height:44px; cursor: pointer; }
.delib, .transcript-body { border-top: var(--bw) solid var(--line); padding: var(--sp-4); }
.delib .who { color: var(--text-secondary); font-size: var(--t-label); font-weight: var(--w-semi); text-transform: uppercase; }
.delib p { margin: var(--sp-1) 0 var(--sp-4); }

.cfg { overflow: hidden; margin: var(--sp-4) 0; }
.cfg h2 { margin: 0; padding: var(--sp-4); border-bottom: var(--bw) solid var(--line); }
.cfg .r { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: var(--sp-4); padding: var(--sp-3) var(--sp-4); border-bottom: var(--bw) solid var(--line); }
.cfg .r:last-child { border-bottom: 0; }
.cfg .k, .cfg .src { color: var(--text-secondary); font-size: var(--t-label); }
.cfg .src { display: block; margin-top: var(--sp-1); }
.cfg .miss, .err { color: var(--system); }
code.raw, .cfg code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: var(--t-label); background: var(--sunk); padding: var(--sp-1) var(--sp-2); border-radius: var(--r-1); }

.group { padding: var(--sp-4); margin: var(--sp-3) 0; }
.group.unattended { border-left: var(--sp-1) solid var(--attention); }
.group .thumb { width: calc(var(--sp-7) + var(--sp-7)); float: right; margin-left: var(--sp-3); border-radius: var(--r-1); }
.row { display: grid; grid-template-columns: calc(var(--sp-7) + var(--sp-3)) minmax(0, 1fr); gap: var(--sp-3); padding: var(--sp-3) 0; border-top: var(--bw) solid var(--line); }
.row > a { display: block; min-width: 0; }
.row img, .row .noimg { width: 100%; height: var(--sp-7); object-fit: cover; border-radius: var(--r-1); }
.row p { margin: var(--sp-1) 0; }
.archive-group { background: var(--surface); border: var(--bw) solid var(--line); border-radius: var(--r-2); padding: var(--sp-4); margin: var(--sp-4) 0; }
.archive-group > header { display: flex; justify-content: space-between; gap: var(--sp-3); align-items: baseline; flex-wrap: wrap; }
.archive-group h2 { margin: 0; }
.filter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: var(--sp-3); align-items: end; margin: var(--sp-4) 0; }
.filter-grid label { display: block; color: var(--text-secondary); font-size: var(--t-label); }
.filter-grid input { width: 100%; margin-top: var(--sp-1); }
.band { margin: var(--sp-6) 0 var(--sp-2); }
.band h2 { margin: 0; }
.funnel { display: flex; min-height: var(--sp-6); overflow: hidden; border: var(--bw) solid var(--line); border-radius: var(--r-1); }
.funnel .s-notify { background: var(--threat); }
.funnel .s-hot { background: var(--attention); }
.funnel .s-cold { background: var(--info); }
.funnel .s-ignore { background: var(--dismissed); }
.legend { display: flex; flex-direction: column; gap: var(--sp-2); margin: var(--sp-3) 0; }
.legend .k { display: inline-block; width: var(--sp-2); height: var(--sp-2); border-radius: var(--r-1); margin-right: var(--sp-2); }
.legend a { display:inline-flex; align-items:center; min-height:44px; padding-inline:var(--sp-1); }
.miles { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: var(--t-label); background: var(--sunk); border: var(--bw) solid var(--line); border-radius: var(--r-2); padding: var(--sp-3); overflow-x: auto; }
.mqtt-history-map { width:100%; min-height:320px; background:var(--sunk); border:var(--bw) solid var(--line); border-radius:var(--r-2); }
.mqtt-history-map .mqtt-map-fallback { fill:var(--sunk); }
.mqtt-history-map .mqtt-tile { opacity:.92; }
.mqtt-history-map .mqtt-plant-area { fill:var(--t-map-subject); stroke:var(--healthy); stroke-width:3; vector-effect:non-scaling-stroke; }
.mqtt-history-map .mqtt-plant-line { fill:none; stroke:var(--healthy); stroke-width:3; vector-effect:non-scaling-stroke; }
.mqtt-history-map .mqtt-path-halo { fill:none; stroke:var(--surface); stroke-width:7; opacity:.82; vector-effect:non-scaling-stroke; }
.mqtt-history-map .mqtt-path { fill:none; stroke:var(--focus); stroke-width:3; vector-effect:non-scaling-stroke; }
.mqtt-basemap-note { display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--sp-2); margin:var(--sp-2) 0; }
.mqtt-basemap-note a { color:var(--text-secondary); }
.evidence { display: flex; gap: var(--sp-4); flex-wrap: wrap; }
.bar-progress { height: var(--sp-2); background: var(--line); border-radius: var(--r-full); overflow: hidden; }
.bar-progress i { display: block; height: 100%; background: var(--healthy); }
.prog { position: sticky; top: 0; z-index: 2; background: var(--surface); border: var(--bw) solid var(--line); border-radius: var(--r-2); padding: var(--sp-4); }

.login { max-width: calc(var(--sidebar-w) + var(--sidebar-w)); margin: var(--sp-7) auto; padding: 0 var(--sp-4); }
.login-card { padding: var(--sp-6); background: var(--surface); border: var(--bw) solid var(--line); border-radius: var(--r-2); }
.login-brand { display: flex; gap: var(--sp-3); align-items: center; margin-bottom: var(--sp-5); }
.login-mark { width: var(--sp-7); height: var(--sp-7); display: grid; place-items: center; border: var(--bw) solid var(--system); border-radius: var(--r-2); background: var(--t-system); color: var(--system); font-size: var(--t-headline); font-weight: var(--w-bold); }
.login label { display: block; margin-top: var(--sp-3); color: var(--text-secondary); font-size: var(--t-label); }
.login input, .login button { width: 100%; margin: var(--sp-1) 0; }
.login .privacy { margin-top: var(--sp-5); color: var(--text-secondary); font-size: var(--t-label); }
.error-state { max-width: calc(var(--sidebar-w) + var(--sidebar-w)); margin: var(--sp-7) auto; text-align: center; padding: var(--sp-6); }
.error-state .code { color: var(--system); font-size: var(--t-label); }

@media (max-width: 1100px) {
  :root { --sidebar-w:232px; --content-gutter:24px; }
  .card-grid, .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .console-layout { grid-template-columns:1fr; }
  .incident-focus { position:static; }
}
@media (max-width: 768px) {
  :root { --content-gutter:16px; }
  .app-shell { grid-template-columns: 1fr; }
  .sidebar { display: none; }
  .mobile-top { position:sticky; top:0; z-index:30; display:block; background:var(--surface); border-bottom:var(--bw) solid var(--line); padding:var(--sp-2) var(--sp-3); }
  .mobile-primary { display:flex; align-items:center; gap:var(--sp-2); min-width:0; }
  .mobile-brand { flex:0 0 auto; color:var(--text-primary); font-weight:var(--w-bold); letter-spacing:-.01em; }
  .mobile-brand-short { display:none; }
  .mobile-areas { display:flex; flex:1 1 auto; gap:var(--sp-1); min-width:0; }
  .mobile-areas a { flex:1 1 auto; justify-content:center; min-width:0; }
  .mobile-site-switch { position:relative; flex:0 0 auto; margin:0; }
  .mobile-site-switch > summary { display:flex; align-items:center; min-height:44px; padding:var(--sp-1) var(--sp-2); border:var(--bw) solid var(--line); border-radius:var(--r-full); font-size:var(--t-label); list-style:none; cursor:pointer; }
  .mobile-site-switch > summary::-webkit-details-marker, .mobile-screen-switch > summary::-webkit-details-marker { display:none; }
  .mobile-sites { position:absolute; right:0; top:calc(100% + var(--sp-2)); z-index:40; min-width:15rem; max-height:65vh; overflow:auto; padding:var(--sp-2); background:var(--surface); border:var(--bw) solid var(--line-hi); border-radius:var(--r-2); box-shadow:var(--sh-1); }
  .mobile-account { padding:var(--sp-2); border-bottom:var(--bw) solid var(--line); margin-bottom:var(--sp-1); }
  .mobile-account .meta { display:block; margin-bottom:var(--sp-1); }
  .mobile-sites a { display:flex !important; width:100%; }
  .mobile-top a { display:inline-flex; align-items:center; min-height:44px; padding:var(--sp-1) var(--sp-2); border-radius:var(--r-1); white-space:nowrap; color:var(--text-secondary); text-decoration:none; font-size:var(--t-label); }
  .mobile-top a:hover, .mobile-top a.on { color:var(--text-primary); background:var(--surface-2); }
  .mobile-top a.on { font-weight:var(--w-semi); }
  .mobile-screen-row { position:relative; margin-top:var(--sp-2); padding-top:var(--sp-2); border-top:var(--bw) solid var(--line); }
  .mobile-screen-switch { position:relative; margin:0; }
  .mobile-screen-switch > summary { display:flex; align-items:center; gap:var(--sp-2); min-height:44px; padding:var(--sp-2) var(--sp-3); border-radius:var(--r-1); background:var(--surface-2); color:var(--text-primary); list-style:none; cursor:pointer; font-size:var(--t-body); font-weight:var(--w-semi); }
  .mobile-screen-switch > summary::after { content:"+"; margin-left:auto; color:var(--text-tertiary); font-weight:var(--w-normal); }
  .mobile-screen-switch[open] > summary::after { content:"−"; }
  .mobile-screen-area { color:var(--text-tertiary); font-size:var(--t-label); font-weight:var(--w-normal); }
  .mobile-links { position:absolute; left:0; right:0; top:calc(100% + var(--sp-1)); z-index:40; display:grid; grid-template-columns:1fr; max-height:58vh; overflow-y:auto; padding:var(--sp-2); border:var(--bw) solid var(--line-hi); border-radius:var(--r-2); background:var(--surface); box-shadow:var(--sh-1); }
  .mobile-links .nav-subgroup + .nav-subgroup { margin-top:var(--sp-1); padding-top:var(--sp-1); }
  .mobile-links .nav-subgroup-label { margin:var(--sp-1) var(--sp-2); }
  .mobile-links a { width:100%; min-width:0; min-height:44px; white-space:normal; line-height:var(--lh-tight); }
  .mobile-links a.on { box-shadow:inset 3px 0 var(--focus); }
  .status-bar { position:static; min-height:44px; }
  .status-inner { align-items:flex-start; padding:var(--sp-2) var(--sp-4); }
  .status-dot { margin-top:5px; }
  .shell-context { display:none; }
  .content, .mode-wide .content { max-width:none; padding:var(--sp-5) var(--sp-4) var(--sp-7); }
  h1 { font-size:24px; }
  .grid, .card-grid, .kpi-grid, .connection-ledger, .live-signal-list, .live-projection-grid, .example-grid { grid-template-columns: 1fr; }
  .equipment-ledger, .telemetry-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cockpit { grid-template-columns:1fr; }
  .cockpit-video, .cockpit-connection, .cockpit-telemetry, .cockpit-detections,
  .cockpit > details { grid-column:auto; grid-row:auto; }
  .cockpit-section-head { flex-direction:column; }
  .example-status, .example-fact-list { grid-template-columns:1fr; }
  .example-status > div:nth-child(odd), .example-status > div:nth-child(even) { padding-inline:0; border-left:0; }
  .col-12, .col-8, .col-7, .col-6, .col-5, .col-4, .col-3 { grid-column: span 12; }
  .alert-card { grid-template-columns: calc(var(--sp-7) + var(--sp-7)) minmax(0, 1fr); }
  .alert-actions { grid-column: 1 / -1; }
  .today-section-head, .incident-index-head { align-items:flex-start; flex-direction:column; }
  .live-notify-monitor { align-items:stretch; flex-direction:column; }
  .live-notify-monitor button { width:100%; }
  .live-notify-toast { top:var(--sp-2); right:var(--sp-2); width:calc(100vw - var(--sp-4)); }
  .incident-queue-link { grid-template-columns:var(--sp-6) minmax(0,1fr); min-height:48px; padding:var(--sp-3); }
  .incident-queue-side { grid-column:2; grid-auto-flow:column; justify-content:start; justify-items:start; white-space:normal; }
  .incident-queue-reason { white-space:normal; }
  .incident-pager { align-items:stretch; }
  .incident-pager a, .incident-pager .pager-boundary { flex:1; justify-content:center; }
  .hot-record-members { padding-left:calc(var(--sp-6) + var(--sp-3) + var(--sp-3)); }
  .cold-summary-grid { grid-template-columns:1fr; }
  .cfg .r { grid-template-columns: 1fr; gap: var(--sp-1); }
  .filter-grid { grid-template-columns: 1fr; }
  .form-grid, .integration-status, .acceptance-steps, .notification-setup { grid-template-columns: 1fr; }
  .notification-setup-step { min-height:0; }
  .integration-editor-head, .integration-review-bar { align-items:stretch; flex-direction:column; }
  .integration-review-bar .btn { width:100%; }
  .integration-step > summary { align-items:flex-start; }
  .integration-step-state { white-space:normal; text-align:right; }
  .map-region { scroll-margin-top:8rem; }
  .map-region { display:flex; flex-direction:column; }
  .map-region > .notice { order:0; }
  .map-region > .map-shell { order:1; }
  .map-region > .map-legend { order:2; }
  .map-region > details { order:3; }
  .map-legend { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--sp-2); }
  .map-key { font-size:var(--t-label); }
  .metric-ledger { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .metric-ledger > div { border-right:var(--bw) solid var(--line); border-bottom:var(--bw) solid var(--line); }
  .metric-ledger > div:nth-child(4n) { border-right:var(--bw) solid var(--line); }
  .metric-ledger > div:nth-child(2n) { border-right:0; }
  .metric-ledger > div:last-child, .metric-ledger > div:nth-last-child(2):nth-child(odd) { border-bottom:0; }
  .weekly-rule-wrap { overflow:visible; border:0; background:transparent; }
  .weekly-rule-table, .weekly-rule-table tbody, .weekly-rule-table tr, .weekly-rule-table td { display:block; width:100%; }
  .weekly-rule-table thead { display:none; }
  .weekly-rule-table tr { margin-bottom:var(--sp-2); padding:var(--sp-3); border:var(--bw) solid var(--line); border-radius:var(--r-2); background:var(--surface); }
  .weekly-rule-table td { display:grid; grid-template-columns:7rem minmax(0,1fr); gap:var(--sp-3); padding:var(--sp-2) 0; border:0; white-space:normal; }
  .weekly-rule-table td::before { content:attr(data-label); color:var(--text-tertiary); font-size:var(--t-label); font-weight:var(--w-normal); }
  .weekly-rule-table .who { white-space:normal; }
  .weekly-rule-table a { display:inline-flex; align-items:center; min-height:44px; }
  .place-disclosure > summary { grid-template-columns:1fr; }
  .place-disclosure-state { text-align:left; white-space:normal; }
  .user-table-wrap { overflow:visible; border:0; background:transparent; }
  .user-table, .user-table tbody, .user-table tr, .user-table td { display:block; width:100%; }
  .user-table thead { display:none; }
  .user-table tr { margin-bottom:var(--sp-2); padding:var(--sp-3); border:var(--bw) solid var(--line); border-radius:var(--r-2); background:var(--surface); }
  .user-table td { display:grid; grid-template-columns:7rem minmax(0,1fr); gap:var(--sp-3); padding:var(--sp-2) 0; border:0; white-space:normal; }
  .user-table td::before { content:attr(data-label); color:var(--text-tertiary); font-size:var(--t-label); font-weight:var(--w-normal); }
  .user-table .meta { white-space:normal; overflow-wrap:anywhere; }
  .user-table td:empty { display:none; }
  .user-table form.inline { display:block; }
  .user-table button { width:100%; }
  .audit-table a { display:inline-flex; align-items:center; min-height:44px; }
  .plant-config > summary { align-items:flex-start; }
  .plant-config-summary-state { white-space:normal; text-align:right; }
  .form-field.full { grid-column: auto; }
  .bar form.inline { display: block; width: 100%; }
  .bar button, .bar .btn { width: 100%; }
}
@media (max-width: 480px) {
  .mobile-brand-full { display:none; }
  .mobile-brand-short { display:inline; }
  .mobile-areas a { padding-inline:var(--sp-1); }
  .period-filter-form { grid-template-columns:1fr; }
}
@media print {
  .sidebar, .mobile-top, .status-bar, .shell-context, .bar, button, .notices { display: none !important; }
  .app-shell { display: block; }
  .content { max-width: none; padding: 0; }
}
