.stats-page { color:#17324d; margin:1rem 0 2.5rem; }
.stats-breadcrumb { margin-bottom:.8rem; }.stats-breadcrumb a { color:#0f766e; font-weight:700; text-decoration:none; }
.stats-header h1 { color:#102a43; font-size:clamp(1.8rem,4vw,2.45rem); line-height:1.1; margin:.1rem 0 .4rem; }.stats-header p { color:#52616f; margin:0; }.stats-eyebrow { color:#6d28d9!important; font-size:.76rem; font-weight:900; letter-spacing:.09em; text-transform:uppercase; }
.stats-input-card,.stats-card { background:#f8fafc; border:1px solid #cbd5e1; border-radius:9px; padding:1rem; }.stats-input-card { margin-top:1.2rem; }.stats-input-card label { color:#102a43; display:block; font-weight:850; margin-bottom:.35rem; }.stats-input-card textarea { background:#fff; border:1px solid #aab8c5; border-radius:7px; color:#102a43; font:inherit; min-height:95px; padding:.7rem; resize:vertical; width:100%; }.stats-input-card textarea:focus { border-color:#6d28d9; box-shadow:0 0 0 3px rgba(109,40,217,.13); outline:0; }.stats-input-card > p,.stats-note { color:#627d98; font-size:.78rem; margin:.35rem 0 .75rem; }
.stats-actions { display:flex; flex-wrap:wrap; gap:.5rem; }.stats-actions button { background:#5b21b6; font-weight:800; }.stats-actions button:hover { background:#4c1d95; }.stats-actions .stats-secondary { background:#64748b; }.stats-actions .stats-example { background:#e0e7ff; color:#3730a3; }.stats-error { background:#fef2f2; border-left:4px solid #dc2626; color:#991b1b; font-weight:700; margin-top:.75rem; padding:.65rem .8rem; }
.stats-results { display:grid; gap:1rem; margin-top:1.2rem; }.stats-results h2 { color:#102a43; font-size:1.08rem; margin:0 0 .7rem; }.stats-metrics { display:grid; gap:.65rem; grid-template-columns:repeat(4,minmax(0,1fr)); }.stats-metric { background:#fff; border:1px solid #d7dee7; border-radius:8px; min-width:0; padding:.75rem; }.stats-metric span { color:#627d98; display:block; font-size:.72rem; font-weight:750; }.stats-metric strong { color:#3730a3; display:block; font-size:clamp(1rem,2.2vw,1.3rem); margin-top:.2rem; overflow-wrap:anywhere; }
.stats-five { display:grid; gap:.5rem; grid-template-columns:repeat(5,1fr); }.stats-five div { background:#eef2ff; border-radius:7px; padding:.6rem; text-align:center; }.stats-five span { color:#64748b; display:block; font-size:.7rem; }.stats-five strong { color:#3730a3; font-size:1.05rem; }.stats-ordered { background:#fff; border:1px solid #e2e8f0; border-radius:6px; color:#334155; font-family:ui-monospace,monospace; font-size:.82rem; max-height:7rem; overflow:auto; padding:.65rem; }
.stats-frequency-wrap { max-height:260px; overflow:auto; }.stats-frequency-wrap table { border-collapse:collapse; font-size:.82rem; width:100%; }.stats-frequency-wrap th,.stats-frequency-wrap td { border-bottom:1px solid #e2e8f0; padding:.45rem .55rem; text-align:right; }.stats-frequency-wrap th:first-child,.stats-frequency-wrap td:first-child { text-align:left; }.stats-frequency-wrap th { background:#eef2ff; color:#3730a3; position:sticky; top:0; }
.stats-chart-grid { display:grid; gap:1rem; grid-template-columns:repeat(2,minmax(0,1fr)); }.stats-chart { min-height:250px; overflow-x:auto; }.stats-chart svg { display:block; height:auto; min-width:420px; width:100%; }.stats-box-chart { align-content:center; display:grid; }.stats-explain { background:#f4f1ff; border-radius:9px; padding:1rem 1.2rem; }.stats-explain > div { display:grid; gap:1rem; grid-template-columns:repeat(3,1fr); }.stats-explain p { color:#486581; font-size:.84rem; line-height:1.55; margin:0; }
@media(max-width:800px){.stats-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.stats-chart-grid{grid-template-columns:1fr}.stats-explain>div{grid-template-columns:1fr}}
@media(max-width:480px){.stats-five{grid-template-columns:repeat(2,1fr)}.stats-metrics{grid-template-columns:1fr}}