:root { --bg:#0f1720; --card:#17212b; --ink:#e8eef4; --mut:#90a0b0; --acc:#2f9e6b; --acc2:#3b82f6; --line:#283543; }
* { box-sizing: border-box; }
body { margin:0; font:16px/1.4 -apple-system,system-ui,sans-serif; background:var(--bg); color:var(--ink); padding-bottom:40px; }
header { padding:14px 16px; border-bottom:1px solid var(--line); position:sticky; top:0; background:var(--bg); z-index:5; }
.card { background:var(--card); margin:14px; padding:16px; border-radius:14px; }
h2 { margin:0 0 12px; font-size:17px; }
input, select, textarea { width:100%; padding:12px; margin:6px 0; background:#0c141c; color:var(--ink); border:1px solid var(--line); border-radius:10px; font-size:16px; }
button { cursor:pointer; border:none; border-radius:10px; font-size:16px; }
.primary { width:100%; padding:14px; background:var(--acc); color:#fff; margin-top:10px; }
.primary.big { padding:18px; font-size:18px; font-weight:600; }
.ghost { background:transparent; color:var(--acc2); border:1px dashed var(--line); padding:10px; width:100%; margin:8px 0; }
.err { color:#e06b6b; }
.bigtoggle { display:flex; gap:12px; }
.bigtoggle .vbtn { flex:1; padding:28px; font-size:20px; font-weight:700; background:#0c141c; color:var(--ink); border:2px solid var(--line); }
.vbtn.on { border-color:var(--acc); color:var(--acc); }
.results { list-style:none; padding:0; margin:6px 0; }
.results li { padding:12px; border:1px solid var(--line); border-radius:10px; margin:6px 0; }
.results small { color:var(--mut); }
.sel { color:var(--mut); }
fieldset { border:1px solid var(--line); border-radius:12px; margin:12px 0; padding:12px; }
legend { color:var(--mut); font-size:13px; padding:0 6px; }
.chips { display:flex; flex-wrap:wrap; gap:8px; margin:6px 0; }
.chips.small .chip { padding:6px 10px; font-size:13px; }
.chip { padding:10px 14px; background:#0c141c; color:var(--ink); border:1px solid var(--line); }
.chip.on { background:var(--acc2); border-color:var(--acc2); color:#fff; }
.row { display:flex; align-items:center; gap:8px; }
.unit { color:var(--mut); }
.switch { display:flex; align-items:center; gap:8px; color:var(--ink); }
label { color:var(--mut); font-size:13px; }
details summary { color:var(--acc2); cursor:pointer; margin:8px 0; }
