@font-face{font-family:Archivo;src:url('/vendor/fonts/archivo-latin.woff2') format('woff2');font-display:swap}
@font-face{font-family:Archivo;src:url('/vendor/fonts/archivo-latin-ext.woff2') format('woff2');font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{--ink:#102448;--muted:#50617b;--line:#d5dfeb;--soft:#e6edf4;--gold:#ffd04a;--teal:#14665d;--red:#a42a3b;--paper:#fff;--bg:#f0f4f8}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 Archivo,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
main{padding:22px 24px 18px}
h1{font-size:24px;line-height:1.2;margin:0 0 4px;letter-spacing:-.3px}
h2{font-size:16px;margin:0 0 4px}
.sub{font-size:14px;color:var(--muted);margin:0 0 14px}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px 18px;min-width:0}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #167d91;outline-offset:2px}
.seg{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.seg button{border:1px solid #b4c1d2;background:#fff;border-radius:8px;padding:6px 11px;font-size:13.5px;font-weight:600;transition:background .2s,color .2s,border-color .2s}
.seg button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
label.slider{display:block;font-size:13px;font-weight:700;margin:10px 0 2px}
label.slider output{float:right;font-variant-numeric:tabular-nums}
input[type=range]{width:100%;accent-color:var(--ink)}
svg{display:block;width:100%;height:auto;overflow:visible}
svg text{font-family:Archivo,system-ui,sans-serif;fill:var(--ink)}
.num{font-variant-numeric:tabular-nums}
.readout{font-size:14px;color:#233a5e;margin:10px 0 0;min-height:44px}
.readout strong{color:var(--ink)}
.foot{font-size:12px;color:var(--muted);margin-top:12px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.foot a{color:var(--teal);font-weight:700}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media (max-width:640px){main{padding:16px 14px}h1{font-size:20px}}