:root { --ink:#10233f; --paper:#f4f7fb; --line:#cad7e5; --muted:#5b6d80; --blue:#086be6; --yellow:#f5a615; font-family:"DIN Alternate","Bahnschrift","Noto Sans SC","PingFang SC",sans-serif; color-scheme:light; }
* { box-sizing:border-box; }
body { min-width:320px; min-height:100vh; margin:0; color:var(--ink); background:var(--paper); background-image:linear-gradient(rgba(16,35,63,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(16,35,63,.025) 1px,transparent 1px); background-size:32px 32px; }
button,input { font:inherit; }
button:focus-visible,a:focus-visible,input:focus-visible { outline:3px solid var(--yellow); outline-offset:3px; }
.auth-header { max-width:1200px; min-height:76px; margin:auto; padding:10px 24px; display:flex; justify-content:space-between; align-items:center; gap:20px; border-bottom:1px solid var(--line); }
.auth-header img { width:146px; height:54px; object-fit:contain; }
.auth-header span,.eyebrow { color:var(--muted); font-size:12px; letter-spacing:.08em; }
.auth-layout { width:min(1120px,calc(100% - 40px)); min-height:calc(100vh - 76px); margin:auto; display:grid; grid-template-columns:1fr minmax(320px,420px); align-items:center; gap:clamp(36px,7vw,110px); padding:50px 0; }
.auth-intro h1 { margin:20px 0; font-size:clamp(40px,5vw,72px); line-height:1.12; letter-spacing:-.03em; }
.auth-intro p { max-width:430px; color:var(--muted); font-size:17px; line-height:1.8; }
.auth-card { padding:clamp(24px,4vw,38px); background:#fff; border:1px solid var(--line); box-shadow:8px 8px 0 rgba(16,35,63,.06); }
.auth-card h2 { margin:10px 0; font-size:30px; }
.auth-card > p { color:var(--muted); line-height:1.6; }
form { display:grid; gap:10px; margin-top:30px; }
label { font-size:14px; font-weight:700; }
input { min-width:0; width:100%; min-height:48px; padding:10px 12px; border:1px solid var(--line); border-radius:3px; background:#fff; font-size:16px; }
.code-row { display:grid; grid-template-columns:1fr auto; gap:8px; }
.code-row button { min-height:48px; padding:0 14px; color:var(--blue); background:#eef5ff; border:1px solid var(--blue); border-radius:3px; cursor:pointer; }
.code-row button:disabled { color:var(--muted); border-color:var(--line); cursor:default; }
.mock-hint { margin:0; color:var(--muted); font-size:13px; }
.form-message { min-height:20px; margin:0; color:var(--muted); font-size:13px; }
.form-message.is-error { color:#b42c21; }
.submit-button { min-height:50px; color:#fff; background:var(--blue); border:1px solid var(--blue); border-radius:3px; cursor:pointer; font-weight:700; }
.submit-button:disabled { opacity:.6; cursor:wait; }
@media (max-width:760px) { .auth-layout { grid-template-columns:1fr; align-content:start; gap:22px; padding:36px 0; } .auth-intro h1 { font-size:38px; } .auth-intro p { font-size:15px; } .auth-card { width:min(100%,480px); } .auth-header span { display:none; } }