:where(:root){--bg:#0c0a0a;--text:#f4efe9;--dim:#b9aea4;--accent:#ff5a1f;--font:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font);margin:0;overflow:hidden}#view{width:100vw;height:100vh;display:block;position:fixed;inset:0}.back{z-index:2;color:var(--dim);font-size:14px;text-decoration:none;position:fixed;top:14px;left:16px}.back:hover{color:var(--text)}#unsupported{z-index:3;text-align:center;background:var(--bg);place-items:center;padding:16px;font-size:16px;line-height:1.5;display:grid;position:fixed;inset:0}#unsupported[hidden]{display:none}#unsupported code{background:#2a2320;border-radius:4px;padding:1px 6px}input[type=range]{appearance:none;cursor:pointer;background:0 0;height:28px;margin:0}input[type=range]::-webkit-slider-runnable-track{background:var(--text);border-radius:5px;height:10px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent);border:4px solid var(--text);box-sizing:border-box;border-radius:50%;width:26px;height:26px;margin-top:-8px}input[type=range]:focus-visible{outline:none}input[type=range]:focus-visible::-webkit-slider-thumb{border-color:#ffd27a}.field-row{grid-template-columns:92px 1fr 52px;align-items:center;gap:14px;width:100%;display:grid}.field-row label{color:var(--dim);font-size:15px;font-weight:600}.field-row output{text-align:right;font-variant-numeric:tabular-nums;font-size:15px;font-weight:700}.pill{color:var(--text);font:600 16px var(--font);cursor:pointer;background:#24201f;border:0;border-radius:999px;align-items:center;gap:12px;padding:8px 18px 8px 8px;display:inline-flex}.pill .knob-track{background:#3b3533;border-radius:999px;width:56px;height:32px;transition:background .2s;position:relative}.pill .knob-track:after{content:"";background:var(--text);border-radius:50%;width:24px;height:24px;transition:transform .2s;position:absolute;top:4px;left:4px}.pill[aria-checked=true] .knob-track{background:var(--accent)}.pill[aria-checked=true] .knob-track:after{transform:translate(24px)}.pill:focus-visible{outline:2px solid var(--accent);outline-offset:3px}input[type=color]{cursor:pointer;background:0 0;border:0;border-radius:8px;width:44px;height:32px;padding:0}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:3px solid var(--text);border-radius:8px}