:root { color-scheme: light; --pine:#153c31; --ink:#203431; --muted:#637670; --sage:#b8d1c0; --line:#dce5de; --paper:#fbfcfa; }
* { box-sizing:border-box; }
html,body { min-height:100%; margin:0; }
body { font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; color:var(--ink); background:#f6f8f5; }
button,input { font:inherit; }
button { cursor:pointer; }
[hidden] { display:none!important; }
.auth-layout { min-height:100svh; display:grid; grid-template-columns:minmax(350px,42%) minmax(0,1fr); }
.story { min-height:100svh; padding:42px clamp(34px,5vw,80px); display:flex; flex-direction:column; background:radial-gradient(circle at 84% 71%,rgba(184,209,192,.19),transparent 32%),var(--pine); color:#fbfaf5; }
.brand { display:flex; align-items:center; gap:12px; }
.brand-mark { width:37px; height:37px; display:grid; place-items:center; flex:none; border:1.5px solid #d8e4db; border-radius:50%; }
.brand-mark:after { content:""; width:21px; height:21px; border:1px solid #d8e4db; border-radius:50%; }
.brand strong { display:block; font:700 25px Georgia,serif; line-height:1; letter-spacing:-.03em; }
.brand small { display:block; margin-top:3px; font-size:9px; letter-spacing:.17em; text-transform:uppercase; color:#d8e4db; }
.story-content { margin:auto 0; padding:55px 0; }
.eyebrow { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.18em; color:#b8d1c0; }
h1 { margin:18px 0; font:400 clamp(38px,4.5vw,67px)/1.14 Georgia,serif; letter-spacing:-.04em; }
.story-content>p:last-child { max-width:385px; color:#d8e4db; line-height:1.7; font-size:15px; }
.story-foot { margin:0; font-size:11px; color:#b8d1c0; }
.access { display:grid; place-items:center; padding:34px 20px; }
.access-card { width:min(100%,420px); padding:32px; background:var(--paper); border:1px solid var(--line); border-radius:23px; box-shadow:0 25px 65px rgba(21,60,49,.08); }
.mobile-brand { display:none; }
.tabs { display:flex; gap:18px; border-bottom:1px solid var(--line); margin-bottom:30px; }
.tabs button { border:0; border-bottom:2px solid transparent; padding:0 0 12px; background:none; color:var(--muted); font-size:13px; }
.tabs button[aria-selected="true"] { color:var(--pine); border-bottom-color:var(--pine); font-weight:700; }
h2 { margin:0; color:var(--pine); font:400 29px Georgia,serif; letter-spacing:-.03em; }
.supporting { margin:8px 0 26px; color:var(--muted); font-size:13px; line-height:1.55; }
form { display:grid; gap:17px; }
label { display:grid; gap:7px; color:var(--pine); font-size:12px; font-weight:700; }
.hint { color:var(--muted); font-weight:400; }
input { width:100%; height:44px; border:1px solid #cbd9ce; border-radius:10px; padding:0 12px; outline:none; background:white; color:var(--ink); font-size:14px; }
input:focus { border-color:#78a58a; box-shadow:0 0 0 3px rgba(184,209,192,.45); }
.primary { margin-top:8px; min-height:46px; border:0; border-radius:11px; background:var(--pine); color:white; font-size:13px; font-weight:700; }
.primary:hover { background:#245343; }
.primary:disabled { opacity:.6; cursor:default; }
.error { margin:16px 0 0; color:#a13c32; font-size:12px; line-height:1.5; }
.footnote { margin:27px 0 0; padding-top:19px; border-top:1px solid var(--line); color:var(--muted); font-size:11px; line-height:1.5; }
@media(max-width:820px) { .auth-layout { grid-template-columns:1fr; } .story { display:none; } .access { min-height:100svh; } .mobile-brand { display:block; margin-bottom:26px; color:var(--pine); font:700 24px Georgia,serif; } .mobile-brand span { display:block; margin-top:3px; color:var(--muted); font:400 9px "Helvetica Neue",Helvetica,Arial,sans-serif; letter-spacing:.16em; text-transform:uppercase; } }
@media(max-width:500px) { .access { padding:16px; align-items:start; } .access-card { margin-top:16px; padding:23px; border-radius:19px; } }

.pilot-notice { padding:16px; border:1px solid var(--line); border-radius:12px; background:#eef3f1; color:var(--ink); }
.pilot-notice h3 { margin:0 0 10px; font-size:15px; }
.pilot-notice p { font-size:13px; line-height:1.6; margin:0 0 12px; }
.pilot-notice details { margin:14px 0; }
.pilot-notice summary { cursor:pointer; font-size:13px; font-weight:700; line-height:1.5; padding:8px 0; text-decoration:underline; text-underline-offset:3px; }
.pilot-notice details[open] summary { margin-bottom:8px; }
.pilot-notice .notice-confirmation { display:flex; align-items:flex-start; gap:12px; font-size:13px; line-height:1.5; cursor:pointer; padding:10px 0 2px; }
.notice-confirmation input[type="checkbox"] { width:21px; height:21px; flex:0 0 21px; margin:0; padding:0; accent-color:#395a65; }
.pilot-notice .notice-version { font-size:11px; }
.pilot-notice summary:focus-visible { outline:2px solid #395a65; outline-offset:4px; }
