:root{--ink:#111;--paper:#fff;--soft:#f5f3f0;--line:#d8d4cf;--muted:#625d58;--accent:#a8123e;--serif:"Didot","Bodoni MT","Playfair Display","Times New Roman",Georgia,serif;--sans:system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;color-scheme:light}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 var(--sans)}
.wrap{max-width:1080px;margin:0 auto;padding:0 1.25rem}
header.mast{border-bottom:1px solid var(--ink);padding:2.5rem 0 1.5rem;text-align:center}
.kicker{font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;color:var(--accent);margin:0 0 .6rem}
h1{font:400 clamp(2.2rem,6vw,3.8rem)/1.05 var(--serif);margin:0 0 .8rem;letter-spacing:-.01em}
h2{font:400 1.6rem/1.2 var(--serif);margin:0 0 .6rem}
.lede{max-width:64ch;margin:0 auto;color:var(--muted)}
.intro,.about{max-width:70ch;margin:2rem auto}
.tool{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);gap:2rem;margin:2rem 0;align-items:start}
@media(max-width:860px){.tool{grid-template-columns:1fr}}
.panel{border-top:3px solid var(--ink);padding-top:1rem}
.panel h2{font-size:1.2rem;text-transform:uppercase;letter-spacing:.14em;font-family:var(--sans);font-weight:600}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.8rem;margin-bottom:1.2rem}
label{display:flex;flex-direction:column;font-size:.8rem;letter-spacing:.04em;color:var(--muted);gap:.25rem}
label small{font-size:.72rem;color:var(--accent)}
.wide{grid-column:1/-1}
input,select{font:inherit;font-size:1rem;color:var(--ink);background:var(--paper);border:0;border-bottom:1px solid var(--ink);border-radius:0;padding:.45rem .1rem;width:100%}
input[type=checkbox]{width:auto;margin-right:.5rem}
.check{flex-direction:row;align-items:center}
input:focus-visible,select:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.hero{background:var(--ink);color:#fff;padding:1.2rem 1.4rem}
.hero span{font-size:.72rem;letter-spacing:.25em;text-transform:uppercase;opacity:.75}
.hero strong{display:block;font:400 clamp(1.7rem,4vw,2.5rem)/1.15 var(--serif)}
.warn{color:var(--accent);font-size:.9rem;min-height:1.3em;margin:.5rem 0}
.bar{display:flex;height:14px;margin:1rem 0;background:var(--line)}
.bar i{display:block;border-right:2px solid #fff}
.bar i:nth-child(odd){background:#111}.bar i:nth-child(even){background:#8d8782}.bar i.buf{background:var(--accent)}
table{width:100%;border-collapse:collapse;font-size:.9rem}
th{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);text-align:left;font-weight:600}
th,td{padding:.55rem .4rem;border-bottom:1px solid var(--line)}
td.n,th.n{text-align:right;white-space:nowrap}
.actions{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.2rem 0 0}
button{font:inherit;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;background:var(--ink);color:#fff;border:1px solid var(--ink);padding:.7rem 1.1rem}
button:hover{background:var(--accent);border-color:var(--accent)}
button.ghost{background:transparent;color:var(--ink)}button.ghost:hover{color:#fff}
.status{min-height:1.4em;font-size:.85rem;color:var(--muted)}
.about{border-top:1px solid var(--line);padding-top:1.5rem}
.about ul{padding-left:1.1rem}
a{color:var(--accent)}
footer.site{border-top:1px solid var(--ink);margin-top:3rem;padding:1.5rem 0 2.5rem;text-align:center;font-size:.85rem;color:var(--muted)}
footer.site a{color:var(--ink);margin:0 .55rem;text-decoration:none}
footer.site a:hover{color:var(--accent);text-decoration:underline}
footer.site p{margin:.8rem 0 0}