:root{color-scheme:light;--bg:#eef3f7;--card:white;--ink:#10113a;--blue:#2868eb} :root[data-theme=dark]{color-scheme:dark;--bg:#101325;--card:#1a2135;--ink:#eef3ff;--blue:#82aaff}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.5 system-ui,sans-serif}main{max-width:760px;margin:32px auto;padding:24px}header{display:flex;justify-content:space-between;align-items:center;gap:20px}h1{font-size:clamp(26px,4vw,40px);line-height:1.2}section{background:var(--card);padding:24px;border-radius:16px;margin-top:24px}.stamp{font-size:13px}button,input,textarea{font:inherit}button{padding:12px 16px;border:2px solid var(--blue);color:var(--ink);border-radius:9px;background:var(--card);cursor:pointer}button:disabled{opacity:.55;cursor:default}button[aria-pressed=true]{background:var(--blue);color:var(--bg)}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #e38600;outline-offset:3px}#options{display:grid;gap:12px}label{display:block;margin:16px 0}input,textarea{display:block;width:100%;padding:10px;border:1px solid #74839a;background:var(--card);color:var(--ink)}textarea{min-height:120px}.result{margin:14px 0}.bar{height:18px;background:var(--blue);max-width:100%}#qr{width:170px;height:170px}a{color:var(--blue)}