:root{--ink:#173126;--paper:#f4f2e8;--accent:#bd4b26;--line:#c9d1bd}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:radial-gradient(ellipse at top right,#dbe9cd,transparent 65%),var(--paper);font-family:Georgia,serif}header,main,footer{max-width:1080px;margin:auto;padding:2rem}header{padding-top:4rem}.eyebrow,footer,select,.muted,#status{font: .9rem ui-monospace,monospace}.eyebrow{text-transform:uppercase;letter-spacing:.15em;color:var(--accent)}h1{font-size:clamp(3rem,8vw,6rem);line-height:.95;letter-spacing:-.04em;margin:1.5rem 0}h2{font-size:1.5rem}p{line-height:1.6;max-width:85ch}.notice{border-left:4px solid var(--accent);padding:0 1.5rem}.controls{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:2rem 0}label{display:flex;flex-direction:column;gap:.5rem}select{padding:.7rem;background:#fff;border:1px solid var(--line);color:var(--ink);width:100%}.row{display:grid;grid-template-columns:minmax(230px,1fr) 2fr 110px;align-items:center;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line)}.track{background:#dde3d6;height:24px}.bar{height:100%;background:var(--ink);min-width:2px;animation:reveal .5s ease-out}.row:first-child .bar{background:var(--accent)}.value{text-align:right;font: .9rem ui-monospace,monospace}.muted{color:#526251;line-height:1.6}a{color:var(--accent)}details{margin:2rem 0}pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#e9ecdf;padding:1rem;font-size:.85rem}footer{border-top:1px solid var(--line)}@keyframes reveal{from{transform:scaleX(0);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}@media(max-width:650px){header,main,footer{padding:1.3rem}.controls{grid-template-columns:1fr 1fr}.row{grid-template-columns:1fr 80px}.track{grid-column:1/3;grid-row:2}.value{grid-column:2;grid-row:1}}@media(prefers-reduced-motion:reduce){.bar{animation:none}}
