:root { font-family: var(--cn-font-family); color: var(--cn-ink); background: var(--cn-background); font-synthesis: none; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: var(--cn-background); }
button, input { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
.portal-shell { min-height: 100vh; display: flex; flex-direction: column; }
.portal-nav { width: min(1180px, calc(100% - 48px)); margin: 0 auto; padding: 25px 0; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.portal-brand { display: inline-flex; align-items: center; gap: 10px; font-size: 1rem; font-weight: 600; letter-spacing: -.02em; }
.portal-brand-mark { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; color: white; background: var(--cn-ink); font-size: .78rem; }
.portal-nav-links { display: flex; align-items: center; gap: 22px; color: var(--cn-muted); font-size: .82rem; }
.portal-nav-links a:hover { color: var(--cn-ink); }
.portal-nav-actions { display: flex; align-items: center; gap: 10px; }
.portal-button { min-height: 38px; padding: 8px 15px; border: 1px solid var(--cn-border); border-radius: 999px; background: transparent; color: var(--cn-ink); }
.portal-button:hover { background: var(--cn-surface); }
.portal-button.primary { border-color: var(--cn-blue); background: var(--cn-blue); color: white; }
.portal-button.primary:hover { background: #0077ed; }
.hero { width: min(1180px, calc(100% - 48px)); flex: 1; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr); align-items: center; gap: 80px; padding: 72px 0 120px; }
.hero-kicker { color: var(--cn-blue); font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; margin: 0 0 18px; }
.hero h1 { max-width: 650px; margin: 0; font-family: var(--cn-font-display); font-size: clamp(3rem, 6vw, 5.8rem); font-weight: 650; letter-spacing: -.07em; line-height: .98; }
.hero-lead { max-width: 540px; margin: 26px 0 30px; color: var(--cn-muted); font-size: 1.05rem; line-height: 1.7; }
.hero-actions { display: flex; align-items: center; gap: 16px; }
.hero-link { color: var(--cn-blue); font-size: .9rem; }
.hero-link:hover { text-decoration: underline; }
.hero-card { min-height: 390px; display: flex; flex-direction: column; justify-content: space-between; padding: 30px; border: 1px solid var(--cn-divider); border-radius: 24px; background: rgba(255,255,255,.72); box-shadow: 0 20px 60px rgba(29,29,31,.06); }
.hero-card-top { display: flex; justify-content: space-between; align-items: center; color: var(--cn-subtle); font-size: .75rem; }
.hero-card-dot { width: 10px; height: 10px; border-radius: 50%; background: #34c759; }
.hero-card h2 { margin: 0; max-width: 340px; font-family: var(--cn-font-display); font-size: 2.1rem; line-height: 1.1; letter-spacing: -.05em; font-weight: 600; }
.hero-steps { display: grid; gap: 14px; }
.hero-step { display: flex; align-items: center; gap: 12px; padding-top: 14px; border-top: 1px solid var(--cn-divider); color: var(--cn-muted); font-size: .86rem; }
.hero-step-number { width: 24px; height: 24px; flex: 0 0 24px; display: grid; place-items: center; border-radius: 50%; color: var(--cn-blue); background: var(--cn-blue-soft); font-size: .72rem; }
.portal-footer { width: min(1180px, calc(100% - 48px)); margin: 0 auto; padding: 0 0 28px; color: var(--cn-subtle); font-size: .75rem; }
.auth-shell { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.auth-card { width: min(390px, 100%); padding: 34px; border: 1px solid var(--cn-divider); border-radius: var(--cn-radius-lg); background: var(--cn-surface); box-shadow: 0 20px 60px rgba(29,29,31,.06); }
.auth-card h1 { margin: 0; font-family: var(--cn-font-display); font-size: 1.9rem; letter-spacing: -.05em; }
.auth-card > p { color: var(--cn-muted); font-size: .86rem; line-height: 1.6; }
.auth-form { display: grid; gap: 16px; margin-top: 24px; }
.auth-form label { color: var(--cn-muted); font-size: .78rem; }
.auth-form input { width: 100%; margin-top: 7px; padding: 11px 12px; border: 1px solid var(--cn-border); border-radius: var(--cn-radius-sm); background: #fff; }
.auth-form button { width: 100%; min-height: 42px; border: 1px solid var(--cn-blue); border-radius: var(--cn-radius-sm); background: var(--cn-blue); color: white; }
.auth-switch { display: block; margin-top: 20px; color: var(--cn-blue); font-size: .8rem; text-align: center; }
.auth-message { margin-top: 14px; padding: 11px 12px; border-radius: var(--cn-radius-sm); color: var(--cn-red); background: #fff1f1; font-size: .78rem; line-height: 1.6; overflow-wrap: anywhere; }
.auth-message.success { color: var(--cn-green); background: #edf9f1; }
.portal-loading { padding-top: 20vh; color: var(--cn-subtle); text-align: center; }
@media (max-width: 800px) { .portal-nav-links { display: none; } .hero { grid-template-columns: 1fr; gap: 42px; padding-top: 45px; } .hero h1 { font-size: clamp(3rem, 16vw, 5rem); } .hero-card { min-height: 330px; } }
@media (max-width: 480px) { .portal-nav, .hero, .portal-footer { width: min(100% - 36px, 1180px); } .portal-nav { padding-top: 18px; } .portal-nav-actions .portal-button:first-child { display: none; } .auth-card { padding: 27px 22px; } }
:root{color-scheme:light}
.auth-links{display:flex;justify-content:space-between;margin-top:24px;font-size:13px}.auth-message:empty{display:none}.policy-consent{display:flex!important;align-items:center;gap:8px;font-size:12px!important}.policy-consent input{flex-shrink:0}.policy-consent span{display:inline!important}.policy-page{max-width:760px;margin:64px auto}.policy-content{white-space:pre-wrap;line-height:1.9}.portal-footer{display:flex;gap:20px;flex-wrap:wrap}.hero-price{margin-top:28px;font-size:13px;color:#6e6e73}
.hero h1{font-size:clamp(32px,3.4vw,64px);line-height:1.12;letter-spacing:-.045em}