:root { --ink:#001f2b; --lime:#d9ff3f; --aqua:#00d5df; --paper:#f3f1eb; --muted:#65757b; }
* { box-sizing:border-box; }
html { background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; font-size:10px; }
body { margin:0; min-height:100vh; }
a { color:inherit; text-decoration:none; }
.help a, .check a { text-decoration:underline; text-underline-offset:.2em; }
.auth-header { align-items:center; background:var(--ink); color:#fff; display:flex; height:9rem; justify-content:space-between; padding:1.6rem 5vw; }
.brand { align-items:center; display:flex; }
.brand-logo { display:block; height:auto; width:clamp(16rem,18vw,22rem); }
.back { font-size:1.1rem; font-weight:700; letter-spacing:.12em; }
.auth-shell { display:grid; grid-template-columns:minmax(30rem,1fr) minmax(38rem,64rem); min-height:calc(100vh - 9rem); }
.auth-intro { background:var(--ink); color:#fff; padding:10vh 7vw; position:relative; }
.auth-intro::after { background:var(--lime); bottom:7rem; clip-path:polygon(50% 0,100% 100%,66% 72%,54% 93%,37% 56%,0 100%); content:''; height:15rem; opacity:.95; position:absolute; right:7vw; width:18rem; }
.auth-intro > span,.form-heading > span { color:var(--aqua); font-size:1.1rem; font-weight:700; letter-spacing:.2em; }
.auth-intro h1 { font-size:clamp(5rem,7vw,10rem); letter-spacing:-.065em; line-height:.9; margin:3rem 0; }
.auth-intro p { font-size:1.6rem; line-height:1.65; max-width:48rem; }
.auth-intro ul { font-size:1.2rem; line-height:2; list-style:none; margin:4rem 0 0; padding:0; }
.auth-intro li { display:flex; align-items:flex-start; gap:1rem; }
.auth-intro li .ui-icon { color:var(--lime); width:1.4rem; height:1.4rem; margin-top:.35rem; }
.auth-card { align-self:center; padding:6rem 7vw; position:relative; }
.tabs { border-bottom:.1rem solid #b8c2c3; display:flex; gap:2.5rem; margin-bottom:5rem; }
.tabs button { background:none; border:0; border-bottom:.3rem solid transparent; color:#526468; cursor:pointer; font-size:1.1rem; font-weight:700; letter-spacing:.12em; padding:0 0 1.5rem; }
.tabs button.active { border-color:var(--ink); color:var(--ink); }
.form-heading h2 { font-size:clamp(3.2rem,4vw,5rem); letter-spacing:-.06em; line-height:.95; margin:1.5rem 0 4rem; }
.form-heading em { color:#008995; font-style:normal; }
.auth-form { display:grid; gap:2rem; }
.auth-form label:not(.check) { display:grid; font-size:1.1rem; font-weight:700; gap:.8rem; letter-spacing:.06em; text-transform:uppercase; }
.auth-form input:not([type=checkbox]) { background:#fff; border:.1rem solid #b8c2c3; border-radius:0; color:var(--ink); font-size:1.6rem; min-height:5.6rem; padding:1.4rem 1.6rem; width:100%; }
.auth-form input:focus { border-color:#008995; outline:.2rem solid rgba(0,137,149,.2); }
.check { align-items:flex-start; display:flex; font-size:1.1rem; gap:1rem; line-height:1.5; }
.check input { accent-color:var(--ink); margin:.1rem 0 0; }
.help { color:var(--muted); font-size:1.1rem; line-height:1.5; margin:0; }
.auth-form .help { margin-top:-1rem; }
.submit { align-items:center; background:var(--lime); border:0; color:var(--ink); cursor:pointer; display:flex; font-size:1.2rem; font-weight:700; justify-content:space-between; margin-top:1rem; min-height:6rem; padding:0 2.2rem; }
.submit.secondary { background:var(--ink); color:#fff; justify-content:center; }
.submit:disabled { cursor:wait; opacity:.7; }
.message { border-left:.3rem solid transparent; font-size:1.2rem; line-height:1.5; margin-top:2rem; min-height:2rem; padding-left:1rem; }
.message.error { border-color:#e51e3a; color:#a40c24; }
.field-error { background:#fdecee; border-left:3px solid #e51e3a; color:#a40c24; display:block; font-size:.78rem; font-weight:700; letter-spacing:0; line-height:1.4; padding:.45rem .6rem; text-transform:none; }
.auth-form [aria-invalid="true"] { border-color:#e51e3a; }
.message.success { border-color:#008995; color:#006c74; }
.loading { font-size:1.2rem; font-weight:700; letter-spacing:.1em; padding:5rem 0; }
.account-data { background:#fff; margin:0 0 4rem; padding:1rem 2.5rem; }
.account-data div { align-items:center; border-bottom:.1rem solid #d6dcda; display:flex; justify-content:space-between; padding:1.8rem 0; }
.account-data div:last-child { border:0; }
.account-data dt { color:var(--muted); font-size:1.1rem; text-transform:uppercase; }
.account-data dd { font-size:1.3rem; font-weight:700; margin:0; }
#account-view h3 { font-size:1.6rem; margin:0 0 2rem; }
.account-registrations { margin:0 0 4rem; }
.registration-list { display:grid; gap:1.2rem; }
.registration-list > p { color:var(--muted); font-size:1.2rem; }
.registration-list > a { color:#006c74; font-size:1.1rem; font-weight:700; }
.registration-list article { background:#fff; border-left:.3rem solid #008995; display:grid; gap:.7rem; padding:1.8rem 2rem; }
.registration-list article > strong { font-size:1.5rem; }
.registration-list article > span { color:#006c74; font-size:1.1rem; font-weight:700; text-transform:uppercase; }
.registration-list article > small { color:var(--muted); font-size:1.1rem; }
.registration-list dl { border-top:.1rem solid #d6dcda; display:grid; gap:.7rem; margin:.5rem 0 0; padding-top:1rem; }
.registration-list dl div { display:flex; justify-content:space-between; }
.registration-list dt { color:var(--muted); font-size:1rem; text-transform:uppercase; }
.registration-list dd { font-size:1.1rem; font-weight:700; margin:0; }
.registration-list article > a { color:#a40c24; font-size:1rem; font-weight:700; margin-top:.5rem; }
.logout { background:none; border:0; color:#a40c24; cursor:pointer; font-size:1.1rem; font-weight:700; margin-top:3rem; padding:0; text-decoration:underline; text-underline-offset:.6rem; }
.why-account { background:var(--ink); color:#fff; margin:-1.5rem 0 1rem; padding:2.2rem 2.4rem; position:relative; }
.why-account::before { background:var(--lime); content:''; height:100%; left:0; position:absolute; top:0; width:.5rem; }
.why-account strong { color:var(--lime); display:block; font-size:clamp(2rem,2.6vw,2.6rem); letter-spacing:-.04em; line-height:1; }
.why-account ul { display:grid; font-size:1.25rem; gap:1rem; line-height:1.5; list-style:none; margin:1.8rem 0 0; padding:0; }
.why-account li { color:#c4d0d2; padding-left:2.2rem; position:relative; }
.why-account li .ui-icon { color:var(--aqua); position:absolute; left:0; top:.15rem; width:1.4rem; height:1.4rem; }
.why-account b { color:#fff; }
.name-row { display:grid; gap:1.6rem; grid-template-columns:1fr 1fr; }
.name-row label { min-width:0; }
.password-toggle { align-items:center; background:#fff; border:.1rem solid #b8c2c3; color:var(--ink); cursor:pointer; display:flex; font-size:1.2rem; font-weight:700; justify-content:space-between; letter-spacing:.08em; min-height:5.2rem; padding:0 2rem; text-transform:uppercase; width:100%; }
.password-toggle b { font-size:2rem; font-weight:400; line-height:1; }
.password-toggle[aria-expanded="true"] { border-bottom-color:transparent; }
.password-form { background:#fff; border:.1rem solid #b8c2c3; border-top:0; padding:0 2rem 2rem; }
.password-toggle:focus-visible, .submit:focus-visible { outline:.3rem solid var(--aqua); outline-offset:.3rem; }
.login-options { align-items:center; display:flex; flex-wrap:wrap; gap:1rem 2rem; justify-content:space-between; }
.forgot-link { color:#006c74; font-size:1.2rem; font-weight:700; text-decoration:underline; text-underline-offset:.3em; }
.verify-view, .state-view, .confirm-view { display:grid; gap:2rem; }
.verify-view .form-heading h2, .confirm-view .form-heading h2 { margin-bottom:0; }
.verify-view .form-heading h2, .state-view .form-heading h2 { margin-bottom:0; }
.verify-lead, .state-text { font-size:1.5rem; line-height:1.65; margin:0; }
.verify-lead strong, .state-text strong { background:#fff; border:.1rem solid #d6dcda; display:inline-block; font-weight:700; padding:.1rem .8rem; word-break:break-all; }
.verify-tips { background:#fff; border-left:.4rem solid var(--lime); display:grid; font-size:1.25rem; gap:.8rem; line-height:1.5; list-style:none; margin:0; padding:1.8rem 2rem; }
.verify-tips li .ui-icon { color:#008995; margin-right:1rem; width:1.4rem; height:1.4rem; }
.verify-links { display:flex; flex-wrap:wrap; gap:1rem 2.4rem; }
.link-button { background:none; border:0; color:#006c74; cursor:pointer; font-size:1.2rem; font-weight:700; padding:0; text-align:left; text-decoration:underline; text-underline-offset:.3em; }
.link-button:focus-visible, .forgot-link:focus-visible { outline:.3rem solid var(--aqua); outline-offset:.3rem; }
.state-action { text-decoration:none; }
.state-action[hidden] { display:none !important; }
.resend-form { margin-top:2.4rem; }
.cooldown { margin:0; min-height:1.6rem; }
.auth-form input.code-input { font-family:'Courier New',Courier,monospace; font-size:2.6rem; font-weight:700; letter-spacing:.6em; padding-left:1.6rem; text-align:left; }
.code-form { gap:1.4rem; }
.submit:disabled { background:#c9d2cf; color:#46585c; }
[hidden] { display:none !important; }
@media (max-width:850px) { .auth-shell { grid-template-columns:1fr; } .auth-intro { min-height:48rem; padding:7rem 3rem; } .auth-intro > * { position:relative; z-index:1; } .auth-intro::after { bottom:1rem; height:10rem; opacity:.28; right:1rem; width:12rem; } .auth-card { padding:5rem 3rem 8rem; } }
@media (max-width:480px) { .name-row { grid-template-columns:1fr; } .why-account { padding:2rem 2rem 2rem 2.6rem; } }

.back { display:inline-flex; align-items:center; gap:.65rem; }
.submit .ui-icon { width:1.6rem; height:1.6rem; }