@font-face{font-family:Switzer;src:url(https://cdn.jsdelivr.net/gh/Fontshare/Fonts@main/WEB/fonts/Switzer/Switzer-Variable.woff2) format("woff2");font-display:swap;font-weight:100 900}
:root{--ink:#171717;--muted:#6b6f78;--line:#e5e5e5;--blue:#0066ff;--blue-dark:#0052d9;--blue-soft:#ebf3ff;--surface:#fff;--canvas:#f7f8fb}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Switzer,Inter,system-ui,sans-serif;color:var(--ink);background:var(--canvas)}
body{min-height:100vh;min-height:100dvh}
button,input{font:inherit}
a{color:inherit;text-decoration:none}
.shell{min-height:100vh;min-height:100dvh;display:grid;grid-template-columns:minmax(360px,.92fr) minmax(480px,1.08fr)}
.identity{display:flex;flex-direction:column;justify-content:space-between;min-height:100%;padding:40px 52px;color:#fff;background:#111827;overflow:hidden;position:relative}
.identity::before{content:"";position:absolute;width:520px;height:520px;right:-290px;bottom:-180px;border:1px solid rgba(255,255,255,.14);border-radius:50%;box-shadow:0 0 0 70px rgba(255,255,255,.025),0 0 0 140px rgba(255,255,255,.018)}
.brand{display:inline-flex;align-items:center;gap:11px;width:max-content;font-size:21px;font-weight:700;letter-spacing:-.03em;position:relative}
.mark{width:36px;height:36px;display:grid;place-items:center;border-radius:9px;background:var(--blue);position:relative}
.mark svg{width:28px;height:28px;display:block;fill:none;stroke:#fff;stroke-width:3.1;stroke-linecap:round;stroke-linejoin:round}
.identity-copy{max-width:560px;position:relative}.eyebrow{margin:0 0 15px;color:#8db8ff;font-size:13px;font-weight:650}.identity h1{margin:0;font-size:clamp(38px,4vw,62px);line-height:1.02;letter-spacing:-.055em}.identity-copy>p:last-child{max-width:500px;margin:24px 0 0;color:#b7c0d1;font-size:17px;line-height:1.65}
.trust{display:flex;flex-wrap:wrap;gap:8px;position:relative}.trust span{padding:7px 10px;border:1px solid rgba(255,255,255,.15);border-radius:999px;color:#cbd3df;font-size:11px}
.panel{display:grid;place-items:center;padding:32px;background:#fff}.card{width:min(100%,430px)}
.app-pill{display:inline-flex;padding:7px 10px;border-radius:999px;color:var(--blue-dark);background:var(--blue-soft);font-size:12px;font-weight:650}.card h2{margin:24px 0 7px;font-size:34px;letter-spacing:-.045em}.sub{margin:0 0 25px;color:var(--muted);font-size:15px;line-height:1.5}
.providers{display:grid;gap:9px}.provider{min-height:46px;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid #d9dadd;border-radius:8px;font-size:14px;font-weight:600;background:#fff}.provider:hover{border-color:#b4cfff;background:#f8fbff}.provider-mark{width:23px;height:23px;display:grid;place-items:center;border-radius:6px;font-size:11px;font-weight:800}.provider-mark.google{color:#4285f4;background:#eef4ff}.provider-mark.apple{color:#fff;background:#111}.provider-mark.github{color:#fff;background:#24292f;font-size:8px}
.divider{display:flex;align-items:center;gap:12px;margin:22px 0;color:#8b8e96;font-size:11px}.divider::before,.divider::after{content:"";height:1px;flex:1;background:var(--line)}
.form{display:grid;gap:15px}.form label{display:grid;gap:7px;font-size:12px;font-weight:650}.form input{width:100%;height:43px;padding:0 12px;border:1px solid #d7d8dc;border-radius:7px;color:var(--ink);background:#fff;outline:none}.form input:focus{border-color:#86b3ff;box-shadow:0 0 0 3px rgba(0,102,255,.12)}
.primary,.secondary{height:43px;border:0;border-radius:7px;font-weight:650;cursor:pointer}.primary{color:#fff;background:var(--blue)}.primary:hover{background:var(--blue-dark)}.secondary{border:1px solid #c9d9f5;color:var(--blue-dark);background:var(--blue-soft)}
.message{margin:0 0 18px;padding:11px 12px;border:1px solid #c9d9f5;border-radius:7px;color:#28568f;background:#f2f7ff;font-size:13px}.message.error{border-color:#f3c4c7;color:#9d3037;background:#fff4f4}
.register{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}.register summary{cursor:pointer;color:var(--blue-dark);font-size:13px;font-weight:600}.form.compact{margin-top:15px}.legal{margin:22px 0 0;color:#9699a0;font-size:10px;line-height:1.55}
:focus-visible{outline:3px solid rgba(0,102,255,.4);outline-offset:3px}
@media(max-width:820px){.shell{grid-template-columns:1fr}.identity{min-height:auto;padding:24px}.identity-copy,.trust{display:none}.panel{padding:38px 20px;place-items:start center}.card h2{font-size:30px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
