:root { --ink:#122033; --muted:#5b6b80; --line:#d7deea; --paper:#f6f3ec; --green:#1f5b49; --vac:#c2410c; --occ:#166534; --rep:#1d4ed8; }
* { box-sizing:border-box }
body { margin:0; font-family:Inter,ui-sans-serif,system-ui,sans-serif; color:var(--ink); background:var(--paper) }
a { color:inherit }
.shell { width:min(1080px,calc(100% - 32px)); margin:0 auto; padding-bottom:48px }
.topbar { display:flex; justify-content:space-between; align-items:center; min-height:76px }
.brand { display:flex; gap:10px; align-items:center; text-decoration:none }
.mark { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; background:#143f35; color:#fff; font-family:Georgia,serif; font-weight:800 }
.eyebrow { color:var(--green); font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; margin:0 0 8px }
h1 { font-family:Georgia,serif; font-size:clamp(28px,5vw,44px); margin:0 0 10px }
h2 { font-size:16px; margin:22px 0 8px }
.intro, .note { color:var(--muted); line-height:1.5 }
.card { background:#fffef9; border:1px solid var(--line); border-radius:20px; padding:22px; margin:18px 0 }
.steps { margin:0; padding-left:18px; color:var(--muted) }
.steps li { margin:6px 0 }
.kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:16px 0 }
.kpi { background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px }
.kpi b { display:block; font-size:24px }
.kpi span { font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em }
.chips { display:flex; flex-wrap:wrap; gap:6px }
.chip { border-radius:999px; padding:5px 10px; font-size:13px; font-weight:700; background:#fff; border:1px solid var(--line) }
.occ { color:var(--occ); background:#f0fdf4; border-color:#86efac }
.vac { color:var(--vac); background:#fff7ed; border-color:#fdba74 }
.rep { color:var(--rep); background:#eff6ff; border-color:#93c5fd }
table { width:100%; border-collapse:collapse; background:#fff }
th,td { text-align:left; padding:8px; border-bottom:1px solid var(--line); font-size:13px }
th { color:var(--muted) }
.status { font-size:12px; color:var(--muted) }
.err { color:#9d362e }
@media (max-width:720px) { .kpis { grid-template-columns:1fr 1fr } }
