:root { color-scheme: light; --bg:#f5f7fb; --panel:#ffffff; --text:#10233f; --muted:#65728a; --brand:#0f4c81; --line:#d9e1ee; --good:#16794c; --warn:#a15c00; --bad:#a11d2f; }
* { box-sizing:border-box; }
body { margin:0; font-family: Inter, Segoe UI, Arial, sans-serif; background:linear-gradient(180deg,#eef3fb 0%, var(--bg) 240px); color:var(--text); }
a { color:inherit; text-decoration:none; }
.shell { max-width:1400px; margin:0 auto; padding:24px; }
.topbar, .panel, .card, .navcard { background:var(--panel); border:1px solid var(--line); border-radius:16px; box-shadow:0 8px 24px rgba(16,35,63,.05); }
.topbar { padding:20px; display:flex; justify-content:space-between; gap:16px; align-items:center; margin-bottom:20px; }
.eyebrow { color:var(--brand); font-size:12px; letter-spacing:.08em; text-transform:uppercase; font-weight:700; }
.title { font-size:30px; font-weight:800; margin:4px 0; }
.muted { color:var(--muted); }
.grid { display:grid; gap:16px; }
.kpis { grid-template-columns:repeat(6,minmax(0,1fr)); margin:20px 0; }
.kpi { padding:18px; }
.kpi .label { color:var(--muted); font-size:13px; }
.kpi .value { font-size:28px; font-weight:800; margin-top:10px; }
.navgrid { grid-template-columns:repeat(3,minmax(0,1fr)); margin-bottom:20px; }
.navcard { padding:18px; min-height:96px; }
.navcard h3 { margin:0 0 8px; }
.layout { display:grid; grid-template-columns:1.6fr .9fr; gap:16px; }
.panel { padding:20px; }
table { width:100%; border-collapse:collapse; }
th, td { text-align:left; padding:12px 10px; border-bottom:1px solid var(--line); vertical-align:top; }
input, select, textarea, button { width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:10px; font:inherit; }
button { background:var(--brand); color:#fff; border:0; font-weight:700; cursor:pointer; }
.row { display:grid; gap:12px; grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:12px; }
.stack { display:grid; gap:12px; }
.pill { display:inline-block; padding:4px 10px; border-radius:999px; background:#edf4fb; color:var(--brand); font-size:12px; font-weight:700; }
.notice { margin-top:14px; padding:12px 14px; border:1px solid #f0c36d; border-radius:10px; background:#fff8e8; color:#6f4700; }
.activity { display:grid; gap:10px; }
.activity-item { padding:12px; border:1px solid var(--line); border-radius:12px; }
.page-title { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px; }
@media (max-width: 1100px) { .kpis,.navgrid,.layout,.row { grid-template-columns:1fr 1fr; } }
@media (max-width: 700px) { .kpis,.navgrid,.layout,.row { grid-template-columns:1fr; } .topbar { flex-direction:column; align-items:flex-start; } }