:root{color-scheme:light dark;--bg:#fff;--fg:#1a1a1a;--mut:#666;--line:#d0d0d0;--acc:#1d4ed8;--bad:#b91c1c}
@media (prefers-color-scheme:dark){:root{--bg:#121212;--fg:#eee;--mut:#9a9a9a;--line:#333;--acc:#7aa2ff;--bad:#ff7b7b}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.5 system-ui,sans-serif}
main{max-width:42rem;margin:0 auto;padding:1.5rem 1rem 4rem}
h1{font-size:1.6rem;margin:.5rem 0 1rem}h2{margin-top:2rem}h3{margin:.2rem 0}
a{color:var(--acc)}.muted{color:var(--mut)}.small{font-size:.85rem;margin:.2rem 0}
label{display:block;margin:.8rem 0;font-weight:500}label.row{display:flex;gap:.5rem;align-items:center;font-weight:400;margin:.3rem 0}
input:not([type=radio]):not([type=checkbox]),textarea{display:block;width:100%;padding:.55rem;margin-top:.3rem;border:1px solid var(--line);border-radius:6px;background:var(--bg);color:var(--fg);font:inherit}
input[type=radio],input[type=checkbox]{width:1.1rem;height:1.1rem}
fieldset{border:1px solid var(--line);border-radius:8px;margin:1rem 0;padding:.8rem 1rem}
fieldset.bad{border-color:var(--bad)}legend{font-weight:600;padding:0 .3rem}
.scale{display:flex;gap:1.2rem;flex-wrap:wrap}
button,.btn{display:inline-block;padding:.55rem 1.1rem;border:0;border-radius:6px;background:var(--acc);color:#fff;font:inherit;cursor:pointer;text-decoration:none}
button.danger{background:var(--bad);margin:.3rem .3rem 0 0}
button.link{background:none;color:var(--acc);padding:0;text-decoration:underline}
nav{display:flex;justify-content:space-between;gap:1rem;margin-bottom:1rem;padding-bottom:.6rem;border-bottom:1px solid var(--line)}
form.inline{display:inline;margin:0}
.err{color:var(--bad)}ul.err{padding-left:1.2rem}
ul.list{list-style:none;padding:0}ul.list li{padding:.7rem 0;border-bottom:1px solid var(--line)}
ul.texts{padding-left:1.2rem}ul.texts li{margin:.3rem 0;white-space:pre-wrap;overflow-wrap:anywhere}
table.bars{width:100%;border-collapse:collapse}table.bars td{padding:.15rem .4rem}table.bars td:first-child{width:35%}table.bars td:last-child{width:3rem;text-align:right}
meter{width:100%;height:1rem}
pre{background:rgba(127,127,127,.12);padding:.6rem;border-radius:6px;overflow:auto}code{background:rgba(127,127,127,.15);padding:0 .25rem;border-radius:3px}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
section{margin:1.2rem 0}
