:root{--ink:#171617;--muted:#5e5a5b;--surface:#f7f7f5;--canvas:#e5e5e2;--line:#cbc8c5;--accent:#7a1731;--accent-pressed:#5d1025;--focus:#275bd8;--success:#1f6647;color:var(--ink);background:var(--canvas);font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--canvas);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
button,input,select,textarea{font:inherit}button,a{touch-action:manipulation}main{width:min(100%,620px);margin:0 auto;min-height:100vh;padding:18px 16px 40px}
.topbar{display:flex;align-items:flex-start;justify-content:space-between;padding:6px 4px 20px}.brand{font-size:.76rem;font-weight:800;letter-spacing:.09em}.topbar p{margin:2px 0 0;color:var(--muted);font-size:.85rem}
.panel{background:var(--surface);min-height:calc(100vh - 116px);padding:28px 22px;display:flex;flex-direction:column}.step{align-self:flex-start;padding:5px 9px;border-radius:999px;background:#e8e5e2;color:#474344;font-size:.76rem;font-weight:700}
h1{font-family:Georgia,serif;font-size:2.55rem;font-weight:400;letter-spacing:-.025em;line-height:1.03;margin:20px 0 14px;text-wrap:balance}.lede{color:#474344;margin:0 0 28px;max-width:65ch;text-wrap:pretty}
form{display:grid;gap:10px;margin-top:auto}label{font-size:.82rem;font-weight:700;margin-top:8px}input,select,textarea{width:100%;border:1px solid #918c8a;border-radius:3px;background:#fff;color:var(--ink);padding:14px;min-height:52px}textarea{resize:none;overflow-wrap:anywhere;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem}input::placeholder{color:#6a6665}input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.primary,.secondary{appearance:none;display:flex;align-items:center;justify-content:center;width:100%;min-height:54px;border:0;border-radius:4px;padding:14px 18px;font-size:.88rem;font-weight:800;letter-spacing:.07em;text-decoration:none;cursor:pointer}.primary{background:var(--accent);color:#fff}.primary:hover{background:var(--accent-pressed)}.primary:active{transform:translateY(1px)}.primary:disabled{background:#aaa6a4;cursor:not-allowed;transform:none}.secondary{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.text-button{appearance:none;border:0;background:transparent;color:var(--accent);padding:8px 0;font-size:.82rem;font-weight:700;cursor:pointer}.centered{justify-self:center}.form-error{min-height:1.4em;margin:2px 0;color:#7b1730;font-size:.82rem}.muted{color:var(--muted)}
.result{min-height:auto}.success-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#dcebe3;color:var(--success);font-size:1.3rem;font-weight:800}.result h1{margin-top:16px}.button-stack{display:grid;gap:10px;margin-top:12px}.copy-status{min-height:1.4em;margin:8px 0;color:var(--success);font-size:.82rem}.instruction{margin-top:24px;padding:16px;background:#ececea;color:#484445;font-size:.86rem}
[hidden]{display:none!important}[data-busy="true"]{opacity:.72;pointer-events:none}
@media(min-width:640px){main{padding-top:30px}.panel{padding:40px 36px;min-height:680px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}
