@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Playfair+Display:wght@600;700;900&family=Lora:wght@400;600&display=block');
:root { color-scheme:light; }
html, body { background-color:var(--paper); color:var(--ink); }
body { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4'%3E%3Cpath fill='%23111111' fill-opacity='.04' d='M1 3h1v1H1zm2-2h1v1H3z'/%3E%3C/svg%3E"); }
body * { border-radius:0 !important; box-shadow:none !important; }
:is(button,a,input,select,textarea):focus-visible { outline:2px solid var(--ink) !important; outline-offset:3px; }
:is(button,input,select) { min-height:44px; }
h1,h2,h3 { font-family:'Playfair Display', 'Times New Roman',serif; }
input,select,textarea,time { font-family:'JetBrains Mono',monospace; }
input,select,textarea { border-color:var(--ink) !important; }
[class*="bg-slate-50"], [class*="bg-slate-100"], .bg-white { background-color:var(--paper); }
[class*="text-slate-"] { color:var(--ink); }
[class*="border-slate-"] { border-color:var(--divider); }
[class*="backdrop-blur"] { backdrop-filter:none; }
#sidebar { background:var(--ink); border-right:1px solid var(--ink); }
#sidebar a { min-height:44px; }
#sidebar a:hover { background:var(--paper); color:var(--ink); }
#app-content { max-width:1280px; width:100%; margin-inline:auto; }
main > header { border-bottom:2px solid var(--ink) !important; }
.dashboard-shell { --dashboard-ink:var(--ink); --dashboard-ink-soft:#404040; --dashboard-muted:#525252; --dashboard-line:var(--ink); --dashboard-canvas:var(--paper); --dashboard-paper:var(--paper); --dashboard-blue:var(--ink); --dashboard-teal:var(--status-success); --dashboard-amber:var(--status-warning); --dashboard-coral:var(--status-danger); gap:24px; max-width:1280px; }
.dashboard-shell :is(h1,h2,strong,b) { font-family:'Playfair Display',serif; }
.dashboard-hero { background:var(--paper); color:var(--ink); border:0; border-block:4px solid var(--ink); padding:32px 0; grid-template-columns:minmax(0,2fr) minmax(260px,1fr); }
.dashboard-hero::before,.dashboard-hero::after { display:none; }
.dashboard-hero-main h1 { color:var(--ink); font-size:clamp(3rem,6vw,6.8rem); line-height:.95; font-weight:900; }
.dashboard-hero-description { color:#404040; font-family:'Lora',Georgia,serif; }
.dashboard-hero-description::first-letter { float:left; font-size:3rem; line-height:1; margin-right:8px; }
.dashboard-hero-actions { border-left:1px solid var(--ink); padding-left:24px; }
.dashboard-action { min-height:44px; text-transform:uppercase; letter-spacing:.08em; border-color:var(--ink); }
.dashboard-action-primary { background:var(--ink); color:var(--paper); }
.dashboard-action-quiet { color:var(--ink); background:transparent; }
.dashboard-action:hover { background:var(--paper); color:var(--ink); border-color:var(--ink); }
.dashboard-kpi-grid { gap:0; border-left:1px solid var(--ink); border-top:1px solid var(--ink); }
.dashboard-kpi-card { border:0; border-right:1px solid var(--ink); border-bottom:1px solid var(--ink); background:var(--paper); }
.dashboard-panel { border:1px solid var(--ink); background:var(--paper); }
.dashboard-panel-header { border-bottom:1px solid var(--ink); padding-bottom:16px; }
.dashboard-eyebrow,.dashboard-chart-legend,.dashboard-activity-table th { font-family:'JetBrains Mono',monospace; text-transform:uppercase; letter-spacing:.1em; }
.dashboard-attention { background:var(--ink); color:var(--paper); border:1px solid var(--ink); }
.dashboard-attention :is(strong,p,span,svg) { color:var(--paper); }
.dashboard-shell :is(.dashboard-status,.dashboard-movement,.dashboard-person-avatar,.dashboard-empty-icon) { background:var(--divider); color:var(--ink); }
.dashboard-shell :is(.dashboard-status--late,.dashboard-status--early) { color:var(--editorial); background:var(--paper); border:1px solid var(--editorial); }
.dashboard-activity-live { color:var(--ink); }
.dashboard-activity-live i { background:var(--ink); }
.dashboard-inline-link:hover { color:var(--editorial); text-decoration:underline; }
.dashboard-data-status { border-bottom:1px solid var(--ink); padding:12px 0; font:12px 'JetBrains Mono',monospace; }
.dashboard-data-status[data-state="error"] { color:var(--editorial); }
.dashboard-data-status button { margin-left:16px; border:1px solid currentColor; padding:8px 16px; }
.dashboard-shell[data-load-state="error"] :is(.dashboard-kpi-grid,.dashboard-analytics-grid,.dashboard-activity-panel) { display:none; }
.dashboard-shell[data-load-state="loading"] :is(.dashboard-kpi-grid,.dashboard-analytics-grid,.dashboard-activity-panel) { visibility:hidden; }
#login-screen { background:var(--paper); }
#login-screen > div:first-child { background:var(--ink); }
@media(max-width:767px) { .dashboard-hero { grid-template-columns:1fr; padding:24px 0; } .dashboard-hero-actions { border-left:0; border-top:1px solid var(--ink); padding:16px 0 0; align-items:stretch; } .dashboard-action-row { justify-content:stretch; } .dashboard-action { width:100%; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }
.dashboard-pulse { border-top:1px solid var(--ink); }
.dashboard-pulse :is(p,strong,b), .dashboard-pulse-legend, .dashboard-eyebrow-light { color:var(--ink); }
.dashboard-pulse-track { background:var(--divider); }
.dashboard-pulse-segment-late { background:var(--editorial); }
.dashboard-attention .dashboard-attention-icon { background:transparent; border:1px solid var(--paper); }
.dashboard-attention a { color:var(--paper); }
.dashboard-series-table { width:100%; border-collapse:collapse; font:12px 'JetBrains Mono',monospace; margin-top:16px; }
.dashboard-series-table :is(th,td) { padding:8px; border-bottom:1px solid var(--divider); text-align:right; }
.dashboard-series-table :is(th,td):first-child { text-align:left; }
.dashboard-series-table caption { text-align:left; padding:8px; font-family:'Inter',sans-serif; }

.brand-gradient,.auth-bg { background-image:none; background-color:var(--ink); }
.confirm-overlay { backdrop-filter:none; }
.dashboard-shell[data-load-state="error"] :is(.dashboard-pulse,.dashboard-attention),
.dashboard-shell[data-load-state="loading"] :is(.dashboard-pulse,.dashboard-attention) { visibility:hidden; }
img { filter:grayscale(1); }
img:hover { filter:grayscale(1) sepia(.5); }
.bg-blue-50,.bg-blue-100 { background-color:var(--divider); }
.bg-blue-600,.bg-blue-700 { background-color:var(--ink); }
.text-blue-500,.text-blue-600,.text-blue-700,.text-blue-800 { color:var(--ink); }
.bg-indigo-50,.bg-indigo-100 { background-color:var(--divider); }
.bg-indigo-600,.bg-indigo-700 { background-color:var(--ink); }
.text-indigo-500,.text-indigo-600,.text-indigo-700,.text-indigo-800 { color:var(--ink); }
.bg-purple-50,.bg-purple-100 { background-color:var(--divider); }
.bg-purple-600,.bg-purple-700 { background-color:var(--ink); }
.text-purple-500,.text-purple-600,.text-purple-700,.text-purple-800 { color:var(--ink); }
.bg-cyan-50,.bg-cyan-100 { background-color:var(--divider); }
.bg-cyan-600,.bg-cyan-700 { background-color:var(--ink); }
.text-cyan-500,.text-cyan-600,.text-cyan-700,.text-cyan-800 { color:var(--ink); }

#sidebar .text-slate-400 { color:#A3A3A3; }
#sidebar .text-slate-300 { color:var(--paper); }

/* Status colors retain their meaning across legacy Tailwind components. */
.bg-emerald-50,.bg-emerald-100 { background-color:var(--status-success-soft); }
.bg-emerald-500,.bg-emerald-600,.bg-emerald-700 { background-color:var(--status-success); }
.text-emerald-500,.text-emerald-600,.text-emerald-700,.text-emerald-800 { color:var(--status-success); }
.border-emerald-200,.border-emerald-300,.border-emerald-400,.border-emerald-500,.border-emerald-600 { border-color:var(--status-success); }
.hover\:bg-emerald-100:hover { background-color:var(--status-success-soft); }
.hover\:bg-emerald-700:hover { background-color:var(--status-success); }
.hover\:text-emerald-700:hover { color:var(--status-success); }
.bg-green-50,.bg-green-100 { background-color:var(--status-success-soft); }
.bg-green-500,.bg-green-600,.bg-green-700 { background-color:var(--status-success); }
.text-green-500,.text-green-600,.text-green-700,.text-green-800 { color:var(--status-success); }
.border-green-200,.border-green-300,.border-green-400,.border-green-500,.border-green-600 { border-color:var(--status-success); }
.hover\:bg-green-100:hover { background-color:var(--status-success-soft); }
.hover\:bg-green-700:hover { background-color:var(--status-success); }
.hover\:text-green-700:hover { color:var(--status-success); }
.bg-teal-50,.bg-teal-100 { background-color:var(--status-success-soft); }
.bg-teal-500,.bg-teal-600,.bg-teal-700 { background-color:var(--status-success); }
.text-teal-500,.text-teal-600,.text-teal-700,.text-teal-800 { color:var(--status-success); }
.border-teal-200,.border-teal-300,.border-teal-400,.border-teal-500,.border-teal-600 { border-color:var(--status-success); }
.hover\:bg-teal-100:hover { background-color:var(--status-success-soft); }
.hover\:bg-teal-700:hover { background-color:var(--status-success); }
.hover\:text-teal-700:hover { color:var(--status-success); }
.bg-amber-50,.bg-amber-100 { background-color:var(--status-warning-soft); }
.bg-amber-500,.bg-amber-600,.bg-amber-700 { background-color:var(--status-warning); }
.text-amber-500,.text-amber-600,.text-amber-700,.text-amber-800 { color:var(--status-warning); }
.border-amber-200,.border-amber-300,.border-amber-400,.border-amber-500,.border-amber-600 { border-color:var(--status-warning); }
.hover\:bg-amber-100:hover { background-color:var(--status-warning-soft); }
.hover\:bg-amber-700:hover { background-color:var(--status-warning); }
.hover\:text-amber-700:hover { color:var(--status-warning); }
.bg-orange-50,.bg-orange-100 { background-color:var(--status-warning-soft); }
.bg-orange-500,.bg-orange-600,.bg-orange-700 { background-color:var(--status-warning); }
.text-orange-500,.text-orange-600,.text-orange-700,.text-orange-800 { color:var(--status-warning); }
.border-orange-200,.border-orange-300,.border-orange-400,.border-orange-500,.border-orange-600 { border-color:var(--status-warning); }
.hover\:bg-orange-100:hover { background-color:var(--status-warning-soft); }
.hover\:bg-orange-700:hover { background-color:var(--status-warning); }
.hover\:text-orange-700:hover { color:var(--status-warning); }
.bg-rose-50,.bg-rose-100 { background-color:var(--status-danger-soft); }
.bg-rose-500,.bg-rose-600,.bg-rose-700 { background-color:var(--status-danger); }
.text-rose-500,.text-rose-600,.text-rose-700,.text-rose-800 { color:var(--status-danger); }
.border-rose-200,.border-rose-300,.border-rose-400,.border-rose-500,.border-rose-600 { border-color:var(--status-danger); }
.hover\:bg-rose-100:hover { background-color:var(--status-danger-soft); }
.hover\:bg-rose-700:hover { background-color:var(--status-danger); }
.hover\:text-rose-700:hover { color:var(--status-danger); }
.bg-red-50,.bg-red-100 { background-color:var(--status-danger-soft); }
.bg-red-500,.bg-red-600,.bg-red-700 { background-color:var(--status-danger); }
.text-red-500,.text-red-600,.text-red-700,.text-red-800 { color:var(--status-danger); }
.border-red-200,.border-red-300,.border-red-400,.border-red-500,.border-red-600 { border-color:var(--status-danger); }
.hover\:bg-red-100:hover { background-color:var(--status-danger-soft); }
.hover\:bg-red-700:hover { background-color:var(--status-danger); }
.hover\:text-red-700:hover { color:var(--status-danger); }

.dashboard-shell .dashboard-status--ontime,
.dashboard-shell .dashboard-status--justified { color:var(--status-success); background:var(--status-success-soft); border:1px solid var(--status-success); }
.dashboard-shell .dashboard-status--late,
.dashboard-shell .dashboard-status--early { color:var(--status-warning); background:var(--status-warning-soft); border-color:var(--status-warning); }
.dashboard-shell .dashboard-status--absent { color:var(--status-danger); background:var(--status-danger-soft); border:1px solid var(--status-danger); }
.dashboard-pulse-segment-late { background:var(--status-warning); }
.dashboard-kpi-card-present .dashboard-kpi-icon { color:var(--status-success); background:var(--status-success-soft); }
.dashboard-kpi-card-late .dashboard-kpi-icon { color:var(--status-warning); background:var(--status-warning-soft); }
.dashboard-kpi-card-absent .dashboard-kpi-icon { color:var(--status-danger); background:var(--status-danger-soft); }
.dashboard-attention--warning .dashboard-attention-icon { color:#FDBA74; border-color:#FDBA74; }
.dashboard-attention--success .dashboard-attention-icon { color:#86EFAC; border-color:#86EFAC; }
/* Explicit contrast for the inverted navigation and its connection panel. */
#sidebar [data-brand-name] { color:var(--paper); background-image:none; background-clip:initial; }
#sidebar [data-brand-subtitle] { color:#D4D4D4; }
#sidebar .sidebar-connection { background:var(--ink); border-color:#737373; }
#sidebar .sidebar-connection :is(#live-clock,#iot-link-status) { color:var(--paper); background:transparent; }
#sidebar .sidebar-connection > span { color:#D4D4D4; }
#sidebar a:focus-visible { outline-color:var(--paper) !important; }
#sidebar a:hover { color:var(--ink); }
