:root{ --bg:#0B1220; --panel:#111827; --panel2:#0f172a; --text:#E5E7EB; --muted:#9CA3AF; --accent:#60A5FA; --accent-2:#8B5CF6; --danger:#F87171; --ring:#1f2937; --card:#0b1220; }
*{ box-sizing:border-box; }
body.dark{ background:radial-gradient(1200px 600px at -10% -10%, #0b1530 0%, #0B1220 50%), linear-gradient(160deg, #0B1220, #0a0f1d); color:var(--text); margin:0; font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"; }
.container{ max-width:1200px; margin:0 auto; padding:2rem 1.25rem; }
.site-header{ position:sticky; top:0; z-index:20; backdrop-filter:saturate(180%) blur(8px); background:rgba(17,24,39,0.85); border-bottom:1px solid #1f2937; }
.header-inner{ display:flex; align-items:center; justify-content:space-between; padding:.6rem 0; }
.brand{ display:flex; align-items:center; gap:.6rem; }
.logo-mark{ width:100px; height:28px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-weight:800; background:linear-gradient(135deg, var(--accent), var(--accent-2)); color:#0b1220; box-shadow:0 10px 20px rgba(96,165,250,0.2); font-size:0.9rem; }
.logo-text{ font-weight:700; letter-spacing:.2px; }
.main-nav a{ color:var(--text); text-decoration:none; margin-right:.25rem; opacity:.9; padding:.45rem .7rem; border-radius:8px; transition:background .15s ease, opacity .15s ease; }
.main-nav a:hover{ background:#0d1527; opacity:1; }
.main-nav a.active{ background:linear-gradient(135deg, rgba(96,165,250,0.18), rgba(139,92,246,0.18)); border:1px solid #263044; }
.site-footer{ background:#000; min-height:4.5rem; padding:0; display:flex; align-items:center; justify-content:center; color:#A1A1AA; border-top:1px solid #0a0a0a; font-size:1rem; }
.site-footer p{ margin:0; }
.site-footer p{ margin:0; }
.site-footer .container{ padding:0 1.25rem; }
.site-header .logo{ font-weight:700; letter-spacing:.2px; }
.site-header nav a{ color:var(--text); text-decoration:none; margin-right:1rem; opacity:.9; padding:.4rem .6rem; border-radius:8px; }
.site-header nav a:hover{ background:#111827; opacity:1; }
.site-header nav a:last-child{ margin-right:0; }
.grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap:1.25rem; }
.quick-nav{ display:flex; align-items:center; gap:.5rem; margin: .25rem 0 1.25rem 0; }
.quick-nav .spacer{ flex:1; }
.quick-nav .tab{ background:#0d1527; border:1px solid #1f2937; color:var(--text); text-decoration:none; padding:.5rem .9rem; border-radius:999px; opacity:.9; }
.quick-nav .tab.active{ background:linear-gradient(135deg, rgba(96,165,250,0.18), rgba(139,92,246,0.18)); }
.cards-4{ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); margin-bottom:1.25rem; }
.kpi{ position:relative; }
.kpi .kpi-title{ opacity:.85; margin-bottom:.35rem; font-weight:600; }
.kpi .kpi-value{ font-size:1.8rem; font-weight:800; letter-spacing:.5px; }
.kpi .kpi-sub{ opacity:.75; margin-top:.25rem; }
.kpi.warm{ background:linear-gradient(180deg, rgba(30,27,75,0.6), rgba(17,24,39,0.4)); }
.kpi.amber{ background:linear-gradient(180deg, rgba(120,53,15,0.35), rgba(17,24,39,0.35)); }
.kpi.teal{ background:linear-gradient(180deg, rgba(13,148,136,0.25), rgba(17,24,39,0.35)); }

.two-col-gap{ grid-template-columns: 1fr 1fr; }
@media (max-width: 1000px){ .two-col-gap{ grid-template-columns:1fr; } }
.timeline{ display:flex; flex-direction:column; gap:.6rem; }
.time-row{ display:grid; grid-template-columns: 90px 1fr auto; align-items:center; gap:.75rem; background:#0b1220; border:1px solid #1f2937; border-radius:10px; padding:.55rem .7rem; }
.time-row .time{ color:var(--muted); font-weight:600; }
.time-row .entry{ font-weight:500; }
.time-row .tag{ font-size:.8rem; padding:.25rem .5rem; border-radius:999px; background:#0d1527; border:1px solid #263044; }
.time-row .tag.warn{ background:#2a1032; border-color:#3f1a53; }
.insight{ margin:.6rem 0; border-radius:12px; border:1px solid #1f2937; padding:.8rem 1rem; }
.insight.success{ background:linear-gradient(180deg, rgba(17,24,39,0.55), rgba(17,24,39,0.35)); }
.insight.ok{ background:linear-gradient(180deg, rgba(17,24,39,0.45), rgba(17,24,39,0.30)); }
.inline-form input, .inline-form select, .inline-form button{ padding:0.6rem .7rem; border-radius:10px; border:1px solid #263044; background:#0b1220; color:var(--text); margin-right:0.5rem; outline:none; }
.inline-form input:focus, .inline-form select:focus{ border-color:#2f3b57; box-shadow: 0 0 0 3px rgba(96,165,250,0.15); }
.inline-form button, .button{ background:linear-gradient(135deg, #10B981, #22D3EE); color:#0a0f1d; border:none; cursor:pointer; padding:.55rem .85rem; border-radius:10px; font-weight:600; box-shadow:0 10px 20px rgba(16,185,129,0.18); }
.button.ghost{ background:transparent; color:var(--text); border:1px solid #263044; }
.card{ background:linear-gradient(180deg, rgba(17,24,39,0.5), rgba(17,24,39,0.4)); border:1px solid #1f2937; border-radius:14px; padding:1rem; box-shadow:0 10px 30px rgba(0,0,0,0.25); }
.table{ width:100%; border-collapse: collapse; margin-top:1rem; }
.table th, .table td{ border-bottom:1px solid #1f2937; padding:0.7rem; text-align:left; }
.stats{ display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:1rem; margin-bottom:1rem; }
.stats > div{ background:linear-gradient(180deg, rgba(17,24,39,0.55), rgba(17,24,39,0.35)); padding:1rem; border-radius:14px; border:1px solid #1f2937; }
.two-col{ display:grid; grid-template-columns:260px 1fr; gap:2rem; align-items:start; }
.two-col > .sidebar{ margin-top:0.2rem; }
@media (max-width: 1000px){ .two-col{ grid-template-columns: 1fr; } }
.sidebar .card{ background:linear-gradient(180deg, rgba(17,24,39,0.55), rgba(17,24,39,0.35)); border:1px solid #1f2937; padding:0.75rem; border-radius:14px; margin-bottom:1rem; }
.sidebar h3{ margin-top:0; }
.sidebar .inline-form input, .sidebar .inline-form select, .sidebar .inline-form button{ width:100%; margin:0 0 .5rem 0; }
.sidebar .inline-form button{ width:100%; }
.month-grid .day:hover{ background:#0d1527; }
.button{ padding:.5rem .8rem; border-radius:10px; text-decoration:none; display:inline-block; }
.month-grid-header > div{ min-width:0; color:var(--muted); }
.month-grid-days{ grid-auto-rows: 140px; }
.month-grid-days .day{ min-width:0; height: 100%; display:flex; flex-direction:column; border:1px solid #1f2937; background:linear-gradient(180deg, rgba(15,23,42,0.55), rgba(15,23,42,0.35)); border-radius:12px; }
.month-grid-days .day > div:last-child{ overflow:auto; }