:root { color-scheme: dark; --background:#101719; --surface:#1b272a; --text:#edf6f5; --muted:#b2c8c7; --accent:#66ddcc; --stroke:#3e5658; --danger:#ffb8b8; font-family:system-ui,sans-serif; font-size:17px }
* { box-sizing:border-box } body { margin:0; background:var(--background); color:var(--text); line-height:1.55 }
main { max-width:640px; margin:auto; padding:28px 22px 110px } h1 { font-size:2.35rem; line-height:1.15; letter-spacing:-.04em; margin:12px 0 24px } h2 { font-size:1.25rem; margin:30px 0 16px }
p { color:var(--muted) } .eyebrow { color:var(--accent); font-size:.8rem; font-weight:750; letter-spacing:.14em }
label { display:block; margin:20px 0 6px; font-weight:600 } input,textarea,select { width:100%; background:var(--surface); color:var(--text); border:1px solid var(--stroke); border-radius:8px; padding:13px; font:inherit; margin-top:7px } textarea { min-height:130px; resize:vertical }
button { border:0; border-radius:8px; padding:14px 18px; min-height:48px; background:var(--accent); color:var(--background); font:inherit; font-weight:700; cursor:pointer; margin:10px 8px 4px 0 }
button.secondary { background:var(--surface); color:var(--text); border:1px solid var(--stroke) } button.danger { background:var(--danger) } button:disabled { opacity:.5; cursor:default }
:focus-visible { outline:3px solid var(--accent); outline-offset:4px } a { color:var(--accent) } hr { border:0; border-top:1px solid var(--stroke); margin:30px 0 } pre { white-space:pre-wrap; word-break:break-word; font:inherit } [hidden] { display:none!important }
.status { border-left:3px solid var(--accent); padding:10px 14px; color:var(--text); background:var(--surface) } .row { display:flex; align-items:center; flex-wrap:wrap; gap:4px } .row button { flex:1 } .history { max-height:340px; overflow:auto; padding:8px 0 } .history p { white-space:pre-wrap; overflow-wrap:anywhere } small { color:var(--muted) } input[type=checkbox] { width:24px; height:24px; vertical-align:middle; margin:0 8px 0 0 }
@media(prefers-reduced-motion:no-preference) { button { transition:background-color .1s } }
canvas,video{max-width:100%;height:auto}video{border-radius:12px}canvas{image-rendering:pixelated}
fieldset { min-width:0; border:1px solid var(--stroke); border-radius:8px; margin:22px 0; padding:14px } legend { max-width:100%; padding:0 6px; font-weight:600 }