:root { --ink-900:#0f172a; --ink-700:#334155; --ink-500:#64748b; --accent:#4f46e5; --line:#e2e8f0; }
* { box-sizing: border-box; }
body { margin:0; font-family:"Inter",system-ui,-apple-system,Segoe UI,sans-serif; color:var(--ink-900); background:#f8fafc; }
.container { max-width:640px; margin:0 auto; padding:40px 20px 80px; }
.banner { background:#fef3c7; border:1px solid #fcd34d; color:#78350f; border-radius:10px; padding:12px 14px; font-size:13px; line-height:1.5; }
.banner code, code { background:rgba(15,23,42,.08); padding:1px 5px; border-radius:4px; font-size:.9em; }
.eyebrow { text-transform:uppercase; letter-spacing:.08em; font-size:12px; font-weight:700; color:var(--accent); margin:28px 0 0; }
h1 { font-size:34px; line-height:1.15; margin:8px 0 0; }
.sub { color:var(--ink-700); line-height:1.6; margin:12px 0 0; }
.form { margin-top:28px; display:flex; flex-direction:column; gap:16px; background:#fff; border:1px solid var(--line); border-radius:14px; padding:24px; box-shadow:0 4px 16px rgba(0,0,0,.04); }
.field { display:flex; flex-direction:column; gap:6px; }
label { font-size:14px; font-weight:600; color:var(--ink-700); }
input, textarea { font:inherit; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink-900); }
input:focus, textarea:focus { outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent); }
.actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; }
.status { font-size:14px; color:var(--ink-500); margin:0; }
.btn { background:var(--accent); color:#fff; border:none; padding:11px 22px; border-radius:8px; font-weight:600; font-size:15px; cursor:pointer; }
.btn:disabled { opacity:.6; cursor:not-allowed; }