.auth-landing { min-height:100dvh;display:flex;flex-direction:column; }
.auth-landing .landing-header { width:100%;height:100px;flex-shrink:0; }
.auth-home-link { display:flex;align-items:center;gap:12px;font-size:13px;font-weight:550;color:var(--lp-muted)!important;margin-left:auto;margin-right:15px; }
.auth-home-link:hover { color:var(--accent)!important; }
.auth-home-link>span { font-size:18px; }
.auth-landing-main { width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:90px;align-items:center;flex:1;padding-top:36px;padding-bottom:48px; }
.auth-presentation { padding:0 0 0 5px;min-width:0; }
.auth-landing .auth-presentation h2 { font-size:clamp(40px,4.5vw,60px);line-height:1.12;letter-spacing:-2.2px;margin:20px 0; }
.auth-presentation h2>span { color:#0b9468; }
.auth-presentation>p { color:var(--lp-muted);font-size:16px;line-height:1.85;max-width:430px;margin-bottom:20px; }
.auth-product-scene { position:relative;isolation:isolate;max-width:440px;padding:26px 22px 46px 0;margin-top:10px; }
.auth-scene-orbit { position:absolute;inset:4px -15px 0 18px;background:var(--lp-mint);border-radius:48% 45% 43% 48%;z-index:-1;transform:rotate(-9deg); }
.auth-preview-card { padding:22px 24px;background:var(--lp-surface);border:1px solid var(--lp-line);border-radius:21px;box-shadow:0 18px 45px #173e3112;transform:rotate(-3deg); }
.auth-preview-heading { display:flex;align-items:center;gap:12px;margin-bottom:16px; }
.auth-preview-icon { display:grid;place-items:center;width:37px;height:37px;background:var(--lp-mint);color:#0b9468;border-radius:11px;flex-shrink:0; }
.auth-preview-icon svg { width:21px;height:21px; }
.auth-preview-heading small { display:block;font-size:10px;color:var(--lp-muted); }
.auth-preview-heading strong { display:block;font-size:15px;font-weight:650;margin-top:2px; }
.auth-preview-status { margin-left:auto;color:var(--lp-muted);font-size:21px; }
.auth-preview-total { position:relative;border-top:1px solid var(--lp-line);padding-top:16px; }
.auth-preview-total>span:first-child { display:block;font-size:9px;letter-spacing:.7px;color:var(--lp-muted); }
.auth-preview-total>strong { display:block;font-size:28px;line-height:1.4;letter-spacing:-.8px;margin-top:3px;font-variant-numeric:tabular-nums; }
.auth-preview-month { position:absolute;right:0;top:21px;font-size:8px;padding:3px 7px;border-radius:5px;background:var(--lp-mint);color:#0b9468; }
.auth-preview-breakdown { display:flex;align-items:center;gap:28px;padding-top:17px; }
.auth-preview-donut { width:104px;height:104px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#0e9f6e 0 42%,#4f8fea 42% 65%,#9670d8 65% 86%,#f2aa43 86% 100%); }
.auth-preview-donut>span { display:flex;align-items:center;justify-content:center;width:73px;height:73px;border-radius:50%;background:var(--lp-surface);font-size:23px;font-weight:650; }
.auth-preview-donut small { font-size:11px;font-weight:400;margin-left:2px; }
.auth-preview-legend { display:grid;gap:10px;flex:1;min-width:0; }
.auth-preview-legend>span { display:flex;align-items:center;gap:7px;font-size:10px; }
.auth-preview-legend i { width:6px;height:6px;border-radius:50%;flex-shrink:0; }
.auth-preview-legend b { font-size:10px;font-weight:600;margin-left:auto; }
.auth-preview-float { display:flex;align-items:center;gap:10px;position:absolute;bottom:23px;right:-7px;padding:12px 14px;background:var(--lp-surface);border:1px solid var(--lp-line);border-radius:13px;box-shadow:0 10px 28px #173e3112;transform:rotate(3deg); }
.auth-preview-float>span { width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:var(--lp-lilac);color:#9670d8; }
.auth-preview-float svg { width:20px;height:20px; }
.auth-preview-float small { display:block;font-size:9px;color:var(--lp-muted); }
.auth-preview-float strong { display:block;font-size:11px;font-weight:650;margin-top:2px; }
.auth-preview-float>i { font-size:11px;font-style:normal;width:20px;height:20px;display:grid;place-items:center;background:var(--lp-mint);color:var(--accent);border-radius:50%;margin-left:4px; }
.auth-preview-caption { display:block;position:relative;text-align:center;font-size:9px;color:var(--lp-muted);margin-top:21px;top:20px; }
.auth-feature-tags { display:flex;align-items:center;gap:18px;color:var(--lp-muted);font-size:11px;margin-top:8px;flex-wrap:wrap; }
.auth-feature-tags>span { display:flex;align-items:center;gap:7px; }
.auth-feature-tags svg { width:15px;height:15px;color:#0b9468; }
.auth-landing .auth-form-panel { grid-template-columns:minmax(0,1fr);min-width:0;padding:36px;background:var(--lp-surface);border:1px solid var(--lp-line);border-radius:26px;box-shadow:0 12px 40px #173e3107;min-height:0;align-self:center; }
.auth-landing .auth-box { width:100%;max-width:400px;min-width:0; }
.auth-form-symbol { display:grid;place-items:center;width:43px;height:43px;background:var(--lp-mint);border-radius:13px;margin-bottom:22px;color:#0b9468; }
.auth-form-symbol svg { width:25px;height:25px; }
.auth-landing .auth-box>.landing-kicker { font-size:10px;letter-spacing:1.4px;margin-bottom:9px; }
.auth-landing .auth-box h1 { font-size:31px;letter-spacing:-1px;line-height:1.2;margin:0 0 13px;overflow-wrap:anywhere; }
.auth-landing .auth-box>p.muted { color:var(--lp-muted);font-size:14px;line-height:1.7;margin-bottom:24px; }
.auth-landing .auth-box label { font-size:14px;margin:18px 0;gap:8px;color:var(--lp-ink); }
.auth-landing .auth-box input { background:var(--lp-bg);border-color:var(--lp-line);border-radius:10px;min-height:48px;padding:11px 13px;color:var(--lp-ink); }
.auth-landing .auth-box input:focus { outline:2px solid #0e9f6e40;outline-offset:2px;border-color:var(--accent); }
.auth-landing .auth-box .forgot { color:var(--lp-muted);font-size:12px; }
.auth-landing .auth-box .forgot:hover { color:var(--accent); }
.auth-landing .auth-box form .primary { min-height:50px;background:#0b8c62;border-color:#0b8c62;border-radius:11px;font-size:15px;margin-top:23px;box-shadow:0 5px 16px #0b8c6215; }
.auth-landing .auth-box form .primary:hover { background:#08774f; }
.auth-landing .auth-box .auth-switch { font-size:13px;margin-top:23px;line-height:1.8;color:var(--lp-muted); }
.auth-landing .auth-switch a { color:#0b9468;font-weight:650; }
.auth-landing .auth-box>.auth-sync-note { display:flex;align-items:center;justify-content:center;gap:8px;color:var(--lp-muted);font-size:11px;line-height:1.7;border-top:1px solid var(--lp-line);padding-top:20px;margin-top:25px;text-align:start; }
.auth-sync-note svg { width:18px;height:18px;color:var(--lp-muted); }
.auth-landing .social-auth-section { margin-top:23px; }
.auth-landing #google-auth-button svg { width:18px;height:18px;stroke:none;stroke-width:0; }
.auth-landing .divider { font-size:11px;color:var(--lp-muted);margin:21px 0; }
.auth-landing .auth-box .form-error { font-size:13px;line-height:1.65; }
.auth-landing-footer { width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:17px;padding-bottom:25px;text-align:start;font-size:11px;color:var(--lp-muted); }
.auth-landing-footer>span { margin:0; }
@media(min-width:1500px) { .auth-landing-main { padding-top:50px;padding-bottom:60px;gap:110px; }.auth-landing .auth-form-panel { padding:42px; } }
@media(max-width:1100px) { .auth-landing-main { gap:45px;grid-template-columns:minmax(0,1fr) minmax(0,1fr); }.auth-landing .auth-presentation h2 { font-size:48px; }.auth-landing .auth-form-panel { padding:29px; }.auth-preview-breakdown { gap:20px; }.auth-preview-month { display:none; }.auth-product-scene { padding-right:12px; }.auth-preview-card { padding:20px; }.auth-preview-float { right:-6px; }.auth-feature-tags { gap:14px; } }
@media(max-width:850px) { .auth-landing-main { max-width:600px;grid-template-columns:minmax(0,1fr);gap:0;padding-top:22px;padding-bottom:36px; }.auth-presentation { display:none; }.auth-landing .auth-form-panel { padding:36px; }.auth-landing .auth-box { max-width:400px; }.auth-landing .landing-header { height:90px; }.auth-landing-footer { max-width:600px; } }
@media(max-width:520px) { .auth-landing .landing-header { height:82px;flex-wrap:nowrap; }.auth-home-link { display:none; }.auth-landing-main { padding-top:12px;padding-bottom:28px; }.auth-landing .auth-form-panel { padding:25px 22px;border-radius:22px; }.auth-landing .auth-box h1 { font-size:29px; }.auth-form-symbol { width:39px;height:39px;margin-bottom:20px; }.auth-landing .auth-box>.landing-kicker { font-size:9px; }.auth-landing .auth-box>p.muted { font-size:14px;margin-bottom:20px; }.auth-landing .auth-box input { font-size:16px; }.auth-landing-footer { font-size:10px;justify-content:center; }.auth-landing-footer>span:last-child { display:none; } }

/* Fit the login content to the viewport by reducing decoration and spacing,
   rather than hiding overflow or cutting off form controls. Other entry modes keep their layout. */
@media(max-height:1100px) {
    .auth-landing[data-entry-mode=login] .landing-header { height:68px; }
    .auth-landing[data-entry-mode=login] .auth-landing-main { padding-top:10px;padding-bottom:14px; }
    .auth-landing[data-entry-mode=login] .auth-landing-footer,
    .auth-landing[data-entry-mode=login] .auth-form-symbol,
    .auth-landing[data-entry-mode=login] .auth-sync-note { display:none; }
    .auth-landing[data-entry-mode=login] .auth-form-panel { padding:24px 30px; }
    .auth-landing[data-entry-mode=login] .auth-box h1 { font-size:28px;margin-bottom:8px; }
    .auth-landing[data-entry-mode=login] .auth-box>.landing-kicker { margin-bottom:6px; }
    .auth-landing[data-entry-mode=login] .auth-box>p.muted { font-size:13px;line-height:1.6;margin-bottom:12px; }
    .auth-landing[data-entry-mode=login] .social-auth-section { margin-top:12px; }
    .auth-landing[data-entry-mode=login] .auth-box .divider { margin:10px 0;font-size:10px;line-height:1.4; }
    .auth-landing[data-entry-mode=login] .auth-box label { font-size:13px;line-height:1.4;margin:10px 0;gap:6px; }
    .auth-landing[data-entry-mode=login] .auth-box input { min-height:44px;padding:9px 12px;line-height:1.35; }
    .auth-landing[data-entry-mode=login] .auth-box form .primary { min-height:44px;margin-top:12px;padding:10px 15px;line-height:1.4; }
    .auth-landing[data-entry-mode=login] .auth-box .auth-switch { margin:14px 0 0;font-size:13px;line-height:1.6; }
    .auth-landing[data-entry-mode=login] .auth-presentation h2 { font-size:46px;margin:15px 0; }
    .auth-landing[data-entry-mode=login] .auth-presentation>p { font-size:14px;line-height:1.7;margin-bottom:12px; }
    .auth-landing[data-entry-mode=login] .auth-product-scene { padding:15px 18px 28px 0;margin-top:0; }
    .auth-landing[data-entry-mode=login] .auth-preview-card { padding:16px 20px; }
    .auth-landing[data-entry-mode=login] .auth-preview-heading { margin-bottom:10px; }
    .auth-landing[data-entry-mode=login] .auth-preview-total { padding-top:12px; }
    .auth-landing[data-entry-mode=login] .auth-preview-breakdown { padding-top:12px; }
    .auth-landing[data-entry-mode=login] .auth-preview-donut { width:86px;height:86px; }
    .auth-landing[data-entry-mode=login] .auth-preview-donut>span { width:60px;height:60px;font-size:20px; }
    .auth-landing[data-entry-mode=login] .auth-preview-caption { top:7px;margin-top:14px; }
    .auth-landing[data-entry-mode=login] .auth-preview-float { bottom:14px; }
}
@media(max-height:720px) {
    .auth-landing[data-entry-mode=login] .landing-header { height:56px; }
    .auth-landing[data-entry-mode=login] .auth-landing-main { padding-top:4px;padding-bottom:4px; }
    .auth-landing[data-entry-mode=login] .auth-box>.landing-kicker,
    .auth-landing[data-entry-mode=login] .auth-box>p.muted,
    .auth-landing[data-entry-mode=login] .auth-product-scene { display:none; }
    .auth-landing[data-entry-mode=login] .auth-form-panel { padding:18px 22px; }
    .auth-landing[data-entry-mode=login] .auth-box h1 { font-size:26px;margin-bottom:12px; }
    .auth-landing[data-entry-mode=login] .social-auth-section { margin-top:0; }
    .auth-landing[data-entry-mode=login] .auth-box label { margin:8px 0;gap:5px; }
    .auth-landing[data-entry-mode=login] .auth-box .divider { margin:8px 0; }
    .auth-landing[data-entry-mode=login] .auth-box form .primary { margin-top:10px; }
    .auth-landing[data-entry-mode=login] .auth-box .auth-switch { margin-top:12px; }
    .auth-landing[data-entry-mode=login] .auth-box #auth-form { margin-top:0; }
}
@media(max-height:600px) {
    .auth-landing[data-entry-mode=login] .landing-header { height:48px; }
    .auth-landing[data-entry-mode=login] .auth-form-panel { padding:14px 20px; }
    .auth-landing[data-entry-mode=login] .auth-box h1 { font-size:22px;margin-bottom:10px; }
    .auth-landing[data-entry-mode=login] .auth-box label { margin:6px 0; }
    .auth-landing[data-entry-mode=login] .auth-box .divider { margin:4px 0; }
    .auth-landing[data-entry-mode=login] .auth-box .auth-switch { margin-top:10px; }
}
@media(min-width:520px) and (max-height:500px) {
    .auth-landing[data-entry-mode=login] .auth-home-link { display:none; }
    .auth-landing[data-entry-mode=login] .auth-presentation { display:none; }
    .auth-landing[data-entry-mode=login] .auth-landing-main { max-width:880px;grid-template-columns:minmax(0,1fr); }
    .auth-landing[data-entry-mode=login] .auth-box { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:16px;max-width:none;align-items:start; }
    .auth-landing[data-entry-mode=login] .auth-box h1 { grid-column:1;grid-row:1;margin-bottom:14px; }
    .auth-landing[data-entry-mode=login] .social-auth-section { grid-column:1;grid-row:2; }
    .auth-landing[data-entry-mode=login] .auth-box .divider { display:none; }
    .auth-landing[data-entry-mode=login] .auth-box #auth-form { grid-column:2;grid-row:1 / span 4; }
    .auth-landing[data-entry-mode=login] .auth-box .auth-switch { grid-column:1;grid-row:3; }
}
