:root{color-scheme:light;--ink:#2a1209;--muted:#775f54;--cream:#fff9f5;--paper:#fff;--orange:#ff6b20;--orange-dark:#d94b0d;--line:#eaded7;--green:#13865d;--shadow:0 30px 80px rgba(60,25,10,.14)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--cream)}
body{min-height:100vh;min-height:100dvh}.shell{display:grid;grid-template-columns:minmax(420px,1.05fr) minmax(480px,.95fr);min-height:100vh;min-height:100dvh}
.story{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:46px clamp(42px,6vw,110px);color:#fff;background:radial-gradient(circle at 74% 72%,rgba(255,119,43,.35),transparent 32%),linear-gradient(145deg,#260f07 0%,#451807 54%,#211008 100%)}
.story:before,.story:after{content:"";position:absolute;border:1px solid rgba(255,142,78,.25);border-radius:50%;width:500px;height:500px;right:-170px;bottom:-230px}.story:after{width:360px;height:360px;right:-90px;bottom:-175px}
.brand{display:flex;align-items:center;gap:13px;font-size:19px;font-weight:900;letter-spacing:-.02em}.brand>span:last-child>span{color:#ff7832}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:linear-gradient(145deg,#ff8d4d,#ff5d14);color:#2a1209;font:700 25px Georgia,serif;box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.story-copy{position:relative;z-index:1;max-width:720px;margin:80px 0}.eyebrow{margin:0 0 18px;color:var(--orange);font-size:12px;font-weight:900;letter-spacing:.22em}.story h1{max-width:720px;margin:0 0 28px;font:500 clamp(48px,5vw,82px)/.98 Georgia,serif;letter-spacing:-.045em}.story-copy>p:last-child{max-width:620px;margin:0;color:#e8d7cf;font-size:18px;line-height:1.7}
.mailboxes{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:10px}.mailboxes span{padding:10px 15px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.07);font-size:13px;font-weight:800;color:#f7e8e1;backdrop-filter:blur(8px)}
.login-panel{display:grid;place-items:center;padding:42px;background:radial-gradient(circle at 50% 30%,#fff 0,#fff8f3 65%,#f8eee7 100%)}.card{width:min(100%,520px);padding:54px;border:1px solid var(--line);border-radius:30px;background:rgba(255,255,255,.94);box-shadow:var(--shadow)}
.mobile-brand{display:none;align-items:center;gap:12px;margin-bottom:34px}.card h2{margin:0 0 12px;font:500 48px/1.05 Georgia,serif;letter-spacing:-.035em}.intro{margin:0 0 30px;color:var(--muted);font-size:16px;line-height:1.6}
form{display:grid;gap:18px}.field{display:grid;gap:8px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}label{font-size:13px;font-weight:850}input{width:100%;height:56px;padding:0 17px;border:1px solid #dfd2ca;border-radius:14px;background:#fff;color:var(--ink);font:inherit;outline:none;transition:border .15s,box-shadow .15s}input:focus{border-color:var(--orange);box-shadow:0 0 0 4px rgba(255,107,32,.12)}input[readonly]{background:#fbf5f1;color:#725f56}
button{min-height:56px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--orange),#ff7a32);color:#fff;font:850 15px/1 inherit;cursor:pointer;box-shadow:0 14px 30px rgba(255,107,32,.22);transition:transform .15s,filter .15s}button:hover{filter:saturate(1.1) brightness(.98);transform:translateY(-1px)}button:disabled{cursor:wait;opacity:.65;transform:none}.secondary{border:1px solid var(--line);background:#fff;color:var(--ink);box-shadow:none}.actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.hint{margin:0;color:#8b7468;font-size:12px;line-height:1.5}.notice{margin:0 0 22px;padding:13px 15px;border:1px solid #ffd2ba;border-radius:13px;background:#fff3eb;color:#933909;font-size:13px;line-height:1.5}.notice.success{border-color:#bde6d5;background:#edfaf4;color:#0b6a47}.trust{display:flex;align-items:center;gap:9px;margin-top:28px;color:#876f64;font-size:12px;font-weight:700}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(19,134,93,.1)}.divider{height:13px;width:1px;background:var(--line)}
.completion-page{display:grid;place-items:center;min-height:100vh;min-height:100dvh;padding:24px;background:#fff8f3}.completion-page .card{text-align:center}.completion-brand{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:34px}.completion-link{display:block;margin-top:12px;color:var(--orange-dark);font-weight:800}.loading{display:grid;place-items:center;gap:12px;padding:35px 0;color:var(--muted);font-size:13px}.loading span{width:30px;height:30px;border:3px solid #f2ddd1;border-top-color:var(--orange);border-radius:50%;animation:spin .8s linear infinite}.loading p{margin:0}@keyframes spin{to{transform:rotate(360deg)}}
.password-page .password-card{text-align:left}.password-page .completion-brand{justify-content:flex-start}.password-card{width:min(100%,620px)}.password-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px}.password-tools .secondary{min-height:48px}.check{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:13px;font-weight:750;cursor:pointer;white-space:nowrap}.check input{width:18px;height:18px;margin:0;padding:0;accent-color:var(--orange);box-shadow:none}.button-link{display:grid;place-items:center;min-height:56px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);font-size:15px;font-weight:850;text-decoration:none}.button-link:hover{border-color:#d9c6bb;background:#fffaf7}
@media(max-width:900px){.shell{display:block}.story{display:none}.login-panel{min-height:100vh;min-height:100dvh;padding:22px}.card{padding:34px 25px;border-radius:24px}.mobile-brand{display:flex}.card h2{font-size:41px}.field-row,.actions,.password-tools{grid-template-columns:1fr}.trust{flex-wrap:wrap}.check{white-space:normal}}
@media(max-width:400px){.login-panel{padding:12px}.card{padding:28px 20px}.card h2{font-size:36px}}