:root{--brand:#168b46;--brand-dark:#0d3b29;--page:#f5f8f6;--page-glow:#e2f3e8;--surface:#fff;--line:#d7e4da;--field:#f8fbf9;--text:#17231d;--muted:#607067}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 10%,var(--page-glow),var(--page) 45%);font:16px Arial,sans-serif;color:var(--text)}main{width:min(560px,100%)}.brand{display:flex;align-items:center;justify-content:center;min-height:34px;margin:0 0 28px;color:var(--brand-dark);font-size:22px;font-weight:900;letter-spacing:.04em}.brand img{max-width:220px;max-height:48px;object-fit:contain}section{padding:38px;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:0 22px 60px color-mix(in srgb,var(--brand-dark) 12%,transparent)}.eyebrow{color:var(--brand);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}h1{margin:10px 0 12px;font-size:30px}p{color:var(--muted);line-height:1.6}label{display:grid;gap:8px;margin:24px 0;font-weight:700}select,input{width:100%;height:48px;padding:0 12px;border:1px solid color-mix(in srgb,var(--brand) 30%,var(--line));border-radius:9px;background:var(--field);font:inherit}input:focus,select:focus{outline:3px solid color-mix(in srgb,var(--brand) 12%,transparent);border-color:var(--brand)}button{width:100%;height:48px;border:0;border-radius:9px;background:var(--brand);color:#fff;font-weight:800;cursor:pointer}button:disabled{opacity:.6}.small{margin:22px 0 0;font-size:12px}.success h1{color:var(--brand)}@media(max-width:520px){section{padding:26px}h1{font-size:25px}}
:root{--brand:#0b7138;--brand-dark:#0d3b29;--page:#f5f8f6;--page-glow:#e2f3e8;--surface:#fff;--line:#d7e4da;--field:#f8fbf9;--text:#17231d;--muted:#607067}html[data-theme=ocean]{--brand:#08738d;--brand-dark:#0e5063;--page:#f0fdff;--page-glow:#cffafe;--line:#bae6fd;--field:#f0fdff}html[data-theme=royal]{--brand:#2057c7;--brand-dark:#1d3f9c;--page:#eff6ff;--page-glow:#dbeafe;--line:#bfdbfe;--field:#eff6ff}html[data-theme=violet]{--brand:#6a2fc0;--brand-dark:#55219d;--page:#faf5ff;--page-glow:#ede9fe;--line:#ddd6fe;--field:#faf5ff}html[data-theme=rose]{--brand:#c9183e;--brand-dark:#9f1233;--page:#fff1f2;--page-glow:#ffe4e6;--line:#fecdd3;--field:#fff1f2}html[data-theme=sunset]{--brand:#c54b0a;--brand-dark:#9f3608;--page:#fff7ed;--page-glow:#ffedd5;--line:#fed7aa;--field:#fff7ed}html[data-theme=amber]{--brand:#a85d05;--brand-dark:#884b04;--page:#fffbeb;--page-glow:#fef3c7;--line:#fde68a;--field:#fffbeb}html[data-theme=slate]{--brand:#3d4b5d;--brand-dark:#293544;--page:#f8fafc;--page-glow:#e2e8f0;--line:#cbd5e1;--field:#f8fafc}html[data-theme=teal]{--brand:#0b7169;--brand-dark:#0b5b56;--page:#f0fdfa;--page-glow:#ccfbf1;--line:#99f6e4;--field:#f0fdfa}html[data-theme=crimson]{--brand:#b52121;--brand-dark:#921b1b;--page:#fef2f2;--page-glow:#fee2e2;--line:#fecaca;--field:#fef2f2}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 10%,var(--page-glow),var(--page) 45%);font:16px system-ui,sans-serif;color:var(--text)}main{width:min(560px,100%)}.brand{display:flex;align-items:center;justify-content:center;min-height:34px;margin:0 0 28px;color:var(--brand-dark);font-size:22px;font-weight:900;letter-spacing:.04em}.brand-logo{width:220px;height:48px;background-position:center;background-repeat:no-repeat;background-size:contain}section{padding:38px;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:0 22px 60px color-mix(in srgb,var(--brand-dark) 12%,transparent)}h1{margin:10px 0 12px;font-size:30px}p{color:var(--muted);line-height:1.6}label{display:grid;gap:8px;margin:24px 0;font-weight:700}select,input{width:100%;height:48px;padding:0 12px;border:1px solid color-mix(in srgb,var(--brand) 30%,var(--line));border-radius:9px;background:var(--field);font:inherit}input:focus,select:focus{outline:3px solid color-mix(in srgb,var(--brand) 12%,transparent);border-color:var(--brand)}button{width:100%;height:48px;border:0;border-radius:9px;background:var(--brand);color:#fff;font-weight:800;cursor:pointer}button:disabled{opacity:.6}.small{margin:22px 0 0;font-size:12px}.success h1{color:var(--brand)}@media(max-width:520px){section{padding:26px}h1{font-size:25px}}
