/* Login and Register pages. Relies on the tokens and header/footer in styles.css. */
.auth{position:relative;overflow:hidden;padding-block:clamp(20px,5vw,56px) clamp(32px,6vw,72px);background:radial-gradient(70% 50% at 50% 0%,var(--hero-glow),transparent 70%)}
.auth-wrap{width:100%;max-width:520px;margin-inline:auto;display:grid;gap:16px}
.auth-card{background:var(--card);border:1px solid var(--line-card);border-radius:26px;box-shadow:var(--shadow);padding:clamp(18px,5vw,32px);display:grid;gap:16px;min-width:0}
.auth-art{display:grid;place-items:center;margin:-4px auto 0}
.auth-art svg{width:min(190px,56vw);height:auto}
.auth-card h1{font-size:clamp(1.55rem,1.2rem + 1.8vw,2.1rem);text-align:center}
.auth-sub{text-align:center;color:var(--text-soft2);font-size:.98rem;line-height:1.6;margin-top:-6px}
.auth-form{display:grid;gap:14px;min-width:0}
.fld{display:grid;gap:6px;min-width:0}
.fld>label,.fld>.lbl,.roles legend{font-weight:600;font-size:.95rem;color:var(--ink)}
.opt{font-weight:500;color:var(--muted);font-size:.85rem;margin-left:6px}
.fld input[type=text],.fld input[type=email],.fld input[type=tel],.fld input[type=password],.fld select{width:100%;min-height:52px;padding:0 14px;border-radius:14px;border:1.5px solid var(--line-field);background:var(--field-bg);color:var(--ink);font-size:1rem;min-width:0}
.fld select{appearance:none;-webkit-appearance:none;background-image:var(--select-arrow);background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}
.fld input::placeholder{color:var(--muted);opacity:.85}
.fld input:focus,.fld select:focus{outline:3px solid color-mix(in srgb,var(--primary) 35%,transparent);outline-offset:0;border-color:var(--primary)}
.fld.bad input,.fld.bad select{border-color:var(--coral)}
.hint{font-size:.85rem;color:var(--muted);line-height:1.5}
.err{font-size:.88rem;line-height:1.5;color:#BE123C;font-weight:600}
:root[data-theme="dark"] .err{color:#FDA4AF}
.err[hidden]{display:none}
.pw{position:relative;display:grid}
.pw input{padding-right:84px!important}
.pw-t{position:absolute;right:4px;top:4px;bottom:4px;min-width:64px;padding:0 12px;border:0;border-radius:10px;background:var(--tint);color:var(--primary);font-weight:700;font-size:.85rem;cursor:pointer}
.pw-t:hover{background:var(--tint-soft)}
.row-between{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 12px}
.chk{display:flex;align-items:flex-start;gap:10px;min-height:44px;cursor:pointer;line-height:1.5;font-size:.95rem}
.chk input{flex:none;width:22px;height:22px;margin:11px 0 0;accent-color:var(--btn-bg)}
.chk span{align-self:center;padding-block:6px}
.lnk{display:inline-flex;align-items:center;min-height:44px;color:var(--primary);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.auth-card .btn{width:100%;min-height:52px;font-size:1.05rem}
.btn-google{background:var(--card);color:var(--ink);border:1.5px solid var(--line-field);gap:10px}
.btn-google:hover{border-color:var(--primary)}
.btn-google svg{width:20px;height:20px;flex:none}
.or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.85rem}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}
.switch{text-align:center;color:var(--text-soft2);display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:0 6px}
.notice{padding:12px 14px;border-radius:14px;background:var(--tint);color:var(--ink);border:1px solid var(--btn-line);font-weight:600;line-height:1.5}
.notice[hidden]{display:none}
.roles{border:0;margin:0;padding:0;min-width:0;display:grid;gap:10px}
.roles legend{padding:0;margin-bottom:6px}
.role{position:relative;display:block;cursor:pointer}
.role input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.role-in{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:center;padding:14px;min-height:64px;border-radius:18px;border:2px solid var(--line-field);background:var(--card);transition:border-color .2s,background .2s,box-shadow .2s}
.role-ic{grid-row:span 2;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--tint);color:var(--primary)}
.role-ic svg{width:24px;height:24px}
.role-in b{font-family:var(--font-head);font-size:1.1rem;line-height:1.3;min-width:0;overflow-wrap:anywhere}
.role-in small{color:var(--text-soft2);font-size:.88rem;line-height:1.45;min-width:0}
.role input:checked+.role-in{border-color:var(--primary);background:var(--tint-soft);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 20%,transparent)}
.role-t input:checked+.role-in{border-color:var(--accent);background:var(--tint-warm);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 28%,transparent)}
.role-t .role-ic{background:linear-gradient(135deg,#FBBF24,#F59E0B);color:#2A1700}
.role input:focus-visible+.role-in{outline:3px solid var(--primary);outline-offset:2px}
.role-note{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:14px;background:var(--tag-bg);color:var(--tag-fg);font-size:.9rem;line-height:1.5}
.role-note svg{flex:none;width:18px;height:18px;margin-top:3px}
.role-note[hidden],.rx[hidden]{display:none}
.rx{display:grid;gap:14px}
@media(min-width:480px){.roles{grid-template-columns:1fr 1fr}.roles legend{grid-column:1/-1}.role-in{grid-template-columns:1fr;justify-items:start;height:100%;align-content:start}.role-ic{grid-row:auto;margin-bottom:6px}}
@media(max-width:350px){.auth-card{padding:16px 14px;border-radius:22px}.pw-t{min-width:56px;padding:0 8px}}
@media(prefers-reduced-motion:reduce){.role-in,.reg-car{transition:none}}
.auth-foot{padding:20px 0 28px;background:var(--footer-bg);color:#cbd5e1;margin-top:0}
.auth-foot .container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.auth-foot .lang-toggle{background:transparent;color:#fff;border-color:rgba(255,255,255,.3)}
.auth-foot .lang-toggle .on{color:var(--accent)}
.auth-foot p{font-size:.9rem}
.fld input,.fld select,.chk input{scroll-margin-top:96px}
@media(max-width:480px){.auth-art svg{width:min(140px,40vw)}}