:root{--bg: #0a0f16;--panel: #101827;--panel-2: #0d1420;--line: #1d2a3c;--line-soft: #16202f;--ink: #dbe6f3;--muted: #7e8fa5;--faint: #8497ad;--ok: #35c87c;--warn: #e5b94e;--bad: #f0564a;--unknown: #5e7186;--sig-1: #56c8e8;--sig-2: #a08bff;--sig-3: #f2a85c;--display: "Archivo", system-ui, sans-serif;--body: "Inter", system-ui, sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace;--radius: 10px}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:14px;line-height:1.5}.shell{max-width:1280px;margin:0 auto;padding:0 24px 80px}.masthead{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;padding:26px 0 18px;border-bottom:1px solid var(--line);margin-bottom:24px}.brand{font-family:var(--display);font-variation-settings:"wdth" 78;font-weight:750;font-size:24px;letter-spacing:.04em;text-transform:uppercase}.brand .thin{color:var(--muted);font-weight:450}.env-switch{display:flex;gap:6px;align-self:center}.masthead .spacer{flex:1}.utc-clock{font-family:var(--mono);font-size:12px;color:var(--muted)}.linkbtn{background:none;border:none;color:var(--muted);cursor:pointer;font-family:var(--mono);font-size:12px;text-decoration:underline;text-underline-offset:3px}.linkbtn:hover{color:var(--ink)}.section{margin:34px 0}.section-head{display:flex;align-items:baseline;gap:14px;margin-bottom:14px}.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint)}.section-title{font-family:var(--display);font-variation-settings:"wdth" 82;font-weight:650;font-size:19px;margin:0}.section-note{color:var(--muted);font-size:12.5px;margin-left:auto}.card{background:linear-gradient(180deg,var(--panel),var(--panel-2));border:1px solid var(--line);border-radius:var(--radius);padding:18px}.card h3{margin:0 0 4px;font-family:var(--display);font-weight:600;font-size:14px;letter-spacing:.01em}.card .caption{color:var(--muted);font-size:12.5px;margin:0 0 12px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}@media (max-width: 980px){.grid-2,.grid-3{grid-template-columns:1fr}}.dot{width:8px;height:8px;border-radius:50%;display:inline-block}.st-healthy{color:var(--ok)}.st-degraded{color:var(--warn)}.st-unhealthy{color:var(--bad)}.st-unknown{color:var(--unknown)}.bg-healthy{background:var(--ok)}.bg-degraded{background:var(--warn)}.bg-unhealthy{background:var(--bad)}.bg-unknown{background:var(--unknown)}.pill{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:999px;border:1px solid var(--line);background:var(--panel-2)}.pill .dot{animation:pulse 2.4s ease-in-out infinite}@keyframes pulse{50%{opacity:.35}}@media (prefers-reduced-motion: reduce){.pill .dot{animation:none}}input,select,button.btn{background:var(--panel-2);color:var(--ink);border:1px solid var(--line);border-radius:7px;font-family:var(--mono);font-size:12.5px;padding:7px 10px}input:focus-visible,select:focus-visible,button:focus-visible{outline:2px solid var(--sig-1);outline-offset:1px}input::placeholder{color:var(--faint)}button.btn{cursor:pointer}button.btn:hover{border-color:var(--sig-1)}button.btn.primary{background:var(--sig-1);border-color:var(--sig-1);color:#06131a;font-weight:600}.controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.controls label{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);display:flex;flex-direction:column;gap:4px}.quick-ranges{display:flex;gap:6px}button.btn.active{border-color:var(--sig-1);color:var(--sig-1)}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:12.5px}th{text-align:left;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}td{padding:7px 10px;border-bottom:1px solid var(--line-soft);font-family:var(--mono);font-size:12px;white-space:nowrap}tr:hover td{background:#56c8e80a}td.dim{color:var(--muted)}.funnel-row{display:grid;grid-template-columns:150px 1fr 200px;gap:12px;align-items:center;margin:9px 0}.funnel-stage{font-family:var(--mono);font-size:11.5px;color:var(--muted);text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.funnel-bar-track{background:var(--panel-2);border:1px solid var(--line-soft);border-radius:5px;height:22px;overflow:hidden}.funnel-bar{height:100%;border-radius:4px;min-width:2px}.funnel-nums{font-family:var(--mono);font-size:11.5px;white-space:nowrap}.funnel-nums .pct{color:var(--muted);margin-left:8px}.notice{border:1px dashed var(--line);border-radius:var(--radius);padding:14px 16px;color:var(--muted);font-size:13px;font-family:var(--mono)}.error-line{color:var(--bad);font-family:var(--mono);font-size:12px}.empty{color:var(--faint);font-family:var(--mono);font-size:12.5px;padding:14px 0}.kpis{display:flex;gap:24px;flex-wrap:wrap;margin-bottom:14px}.kpi .num{font-family:var(--mono);font-size:26px;font-weight:600;line-height:1.1}.kpi .lbl{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:360px;max-width:100%;background:linear-gradient(180deg,var(--panel),var(--panel-2));border:1px solid var(--line);border-radius:14px;padding:32px 28px}.login-card .brand{font-size:20px;margin-bottom:4px}.login-card p{color:var(--muted);font-size:12.5px;margin:0 0 20px}.login-card form{display:flex;flex-direction:column;gap:12px}.login-card input{padding:10px 12px;font-size:14px}.chart-note{font-family:var(--mono);font-size:11px;color:var(--faint);margin-top:6px}.muted{color:var(--faint)}.warn{color:var(--warn)}.tabs{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 0;margin-bottom:8px;background:var(--bg);border-bottom:1px solid var(--line)}.tabs-list{display:flex;align-items:center;gap:2px;flex-wrap:wrap;flex:1}button.tab{background:none;border:1px solid transparent;border-radius:999px;cursor:pointer;white-space:nowrap;padding:7px 9px;font-family:var(--mono);font-size:11.5px;letter-spacing:.01em;color:var(--muted)}button.tab:hover{color:var(--ink);border-color:var(--line)}button.tab .n{color:var(--faint);margin-right:4px}button.tab[aria-selected=true]{color:var(--ink);border-color:var(--sig-1);background:#56c8e817}button.tab[aria-selected=true] .n{color:var(--sig-1)}.surface-block+.surface-block{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}.surface-head{font-family:var(--mono);font-size:11.5px;margin-bottom:10px;letter-spacing:.04em}.surface-head strong{color:var(--ink);text-transform:uppercase}button.surface-head.as-toggle{display:block;width:100%;text-align:left;background:none;border:0;padding:0;cursor:pointer;color:inherit;font:inherit;letter-spacing:.04em}button.surface-head.as-toggle:after{content:"▸";margin-left:8px;color:var(--faint);display:inline-block;transition:transform .12s ease}button.surface-head.as-toggle.is-open:after{transform:rotate(90deg)}button.surface-head.as-toggle:hover:after{color:var(--muted)}button.surface-head.as-toggle:hover strong{color:var(--sig-1)}.surface-block .chart-note:first-of-type{margin-top:14px}.donut-row{display:grid;grid-template-columns:250px 1fr;gap:18px;align-items:center}@media (max-width: 860px){.donut-row{grid-template-columns:1fr}}.scale-toggle{display:flex;gap:6px;justify-content:flex-end;margin-bottom:6px}.scale-toggle .btn{font-size:10.5px;padding:2px 9px}.scale-toggle .scale-why{font-family:var(--mono);font-size:10.5px;color:var(--muted);align-self:center;margin-right:4px}.tabs-env{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}.tabs-env.is-dev{color:var(--warn);border-color:var(--warn)}.tabs-env.is-staging{color:var(--sig-2);border-color:var(--sig-2)}.tabs-env b{color:var(--ink);font-weight:600}.tabs-env.is-dev b{color:var(--warn)}.tabs-env.is-staging b{color:var(--sig-2)}[role=tabpanel]>.section:first-child{margin-top:20px}.card .plain{color:var(--ink);font-size:13px;line-height:1.5;margin:0 0 8px}.card-note{font-size:12px;line-height:1.45;color:var(--muted);border-left:2px solid var(--sig-2);padding:2px 0 2px 9px;margin:0 0 10px}details.how{margin:0 0 12px}details.how>summary{cursor:pointer;width:fit-content;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}details.how>summary:hover{color:var(--muted)}details.how[open]>summary{margin-bottom:6px}details.how .caption{margin:0}details.how .card-note{border-left-color:var(--line);margin:8px 0 0}details.why{margin:8px 0 0}details.why>summary{cursor:pointer;width:fit-content;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}details.why>summary:hover{color:var(--muted)}details.why[open]>summary{margin-bottom:6px}details.why .why-body{font-size:12px;color:var(--muted);line-height:1.55}details.why .why-body p{margin:0 0 6px}details.why .why-body p:last-child{margin-bottom:0}.glossary{margin-bottom:8px}.glossary:not([open]){padding:13px 18px}.glossary>summary{cursor:pointer;width:fit-content;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.glossary>summary:hover{color:var(--ink)}.glossary dl{display:grid;grid-template-columns:170px 1fr;gap:8px 18px;margin:16px 0 0;max-width:90ch}.glossary dt{font-family:var(--mono);font-size:12px;color:var(--sig-1)}.glossary dd{margin:0;color:var(--muted);font-size:12.5px;line-height:1.5}@media (max-width: 720px){.glossary dl{grid-template-columns:1fr;gap:2px 0}.glossary dd{margin-bottom:10px}}
