:root{color-scheme:light dark;--bg:#f3f5f7;--fg:#18232d;--panel:#fff;--muted:#526070;--accent:#176753;--line:#a8b4bd;--error:#ba283b}
@media(prefers-color-scheme:dark){:root{--bg:#121b24;--fg:#eef3f6;--panel:#1c2935;--muted:#b4c1cb;--accent:#3cbe96;--line:#607789;--error:#ff9caa}}
:root[data-theme="dark"]{--bg:#121b24;--fg:#eef3f6;--panel:#1c2935;--muted:#b4c1cb;--accent:#3cbe96;--line:#607789;--error:#ff9caa}
:root[data-theme="light"]{--bg:#f3f5f7;--fg:#18232d;--panel:#fff;--muted:#526070;--accent:#176753;--line:#a8b4bd;--error:#ba283b}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:17px/1.55 system-ui,sans-serif}main{max-width:660px;margin:auto;padding:32px 20px calc(24px + env(safe-area-inset-bottom))}h1{font-size:30px;line-height:1.2;margin:8px 0 24px}.eyebrow{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}label{display:block;font-weight:650}#hint,.note{color:var(--muted);font-size:14px}textarea{display:block;resize:vertical;width:100%;min-height:200px;border:1px solid var(--line);border-radius:12px;padding:14px;font:inherit;background:var(--panel);color:var(--fg)}textarea:focus,button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}#count{text-align:right;font-size:13px;color:var(--muted);padding:6px 0}button{width:100%;border:0;border-radius:12px;padding:15px;font:inherit;font-weight:650;background:var(--accent);color:var(--bg);cursor:pointer;margin:10px 0}button:disabled{opacity:.5;cursor:default}#error{color:var(--error);font-size:14px;min-height:1.4em}#status{white-space:pre-wrap;border-left:3px solid var(--accent);padding-left:14px}form[hidden],button[hidden]{display:none}.note{margin-top:24px}@media(min-width:700px){main{padding-top:56px}}