*{box-sizing:border-box;margin:0}
:root{
  --violet:#2E1F6B; --orange:#F2551F; --sky:#8FB0E0;
  --disp:"Cabinet Grotesk",system-ui,sans-serif;
  --sans:"Switzer",system-ui,-apple-system,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
  --ground:#120A2E; --ground-2:#0C0722; --surface:rgba(246,244,240,.055); --surface-solid:#1C1046;
  --text:#F6F4F0; --dim:rgba(246,244,240,.74); --faint:rgba(246,244,240,.5);
  --line:rgba(143,176,224,.24); --hair:rgba(143,176,224,.14); --accent:#F2551F; --cool:#8FB0E0;
}
:root[data-theme="light"]{
  --ground:#F4F1EC; --ground-2:#EAE5DC; --surface:#FFFDFA; --surface-solid:#FFFDFA;
  --text:#140F26; --dim:#4c4657; --faint:#77708a; --line:#D9D2C6; --hair:#E6E0D5; --cool:#4A32A8;
}
body{background:var(--ground);color:var(--text);font-family:var(--sans);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr)}
@media(max-width:900px){body{grid-template-columns:1fr}.aside{display:none}}
img{max-width:100%;display:block}
a{color:inherit}
h1{font-family:var(--disp);font-weight:900;letter-spacing:-.04em;line-height:.98;font-size:clamp(2.1rem,3.6vw,3rem)}
.pane{padding:clamp(28px,4vw,54px) clamp(24px,5vw,72px);display:flex;flex-direction:column}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;margin-bottom:auto}
.brand img{height:44px}
.brand b{font-family:var(--disp);font-weight:800;font-size:1.5rem;letter-spacing:-.04em}
.form{width:100%;max-width:26rem;margin:44px 0 auto}
.form p.sub{color:var(--dim);margin:14px 0 30px}
label{display:block;font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);margin-bottom:8px}
input{width:100%;font-family:var(--sans);font-size:1.02rem;padding:15px 18px;border-radius:12px;
  border:1.5px solid var(--line);background:var(--surface);color:var(--text);margin-bottom:20px}
input:focus{outline:none;border-color:var(--accent)}
.btn{display:block;width:100%;text-align:center;font-family:var(--sans);font-weight:600;font-size:1rem;
  padding:16px 30px;border-radius:999px;text-decoration:none;border:0;cursor:pointer;
  background:var(--accent);color:#fff;box-shadow:0 10px 30px rgba(242,85,31,.3)}
.alt{margin-top:24px;color:var(--dim);font-size:.96rem}
.alt a{color:var(--accent)}
.fine{margin-top:auto;padding-top:30px;font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;color:var(--faint)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.picker{display:flex;gap:9px;margin-bottom:26px;flex-wrap:wrap}
.opt{flex:1;min-width:104px;border:1.5px solid var(--line);border-radius:12px;padding:13px 14px;cursor:pointer;background:transparent;color:var(--text);text-align:left}
.opt[aria-pressed="true"]{border-color:var(--accent);background:var(--surface)}
.opt i{display:block;font-style:normal;font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;color:var(--faint);margin-bottom:5px}
.opt b{font-family:var(--disp);font-weight:800;font-size:1.16rem;letter-spacing:-.03em}
.opt[aria-pressed="true"] i{color:var(--accent)}
.aside{position:relative;overflow:hidden;background:var(--ground-2)}
.aside img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.aside .scrim{position:absolute;inset:0;background:linear-gradient(200deg,rgba(12,7,34,.72) 0%,rgba(30,18,80,.5) 60%,rgba(12,7,34,.86) 100%)}
.aside .say{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;
  padding:clamp(28px,4vw,58px);color:#F6F4F0}
.aside .rule{width:56px;height:4px;background:var(--accent);margin-bottom:22px}
.aside h2{font-family:var(--disp);font-weight:800;letter-spacing:-.035em;line-height:1.02;font-size:clamp(1.5rem,2.3vw,2.1rem);max-width:17ch}
.aside p{margin-top:14px;color:rgba(246,244,240,.8);max-width:32ch}
