:root {
    --primary: #0f56a8;
    --primary-dark: #0d2f64;
    --primary-light: #eff8ff;
    --aqua: #0eaaaa;
    --aqua-light: #dff9f7;
    --text: #0f172a;
    --muted: #64748b;
    --border: #dfe7f1;
    --background: #f8fbff;
    --white: #ffffff;
    --danger: #b42318;
    --danger-background: #fff4f2;
    --danger-border: #fecdca;
    --success: #067647;
    --success-background: #ecfdf3;
    --success-border: #abefc6;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { width: 100%; min-height: 100%; }
body {
    min-height: 100svh;
    font-family: 'DM Sans', sans-serif;
    color: var(--text);
    background:
        radial-gradient(circle at 8% 8%, rgba(22,133,230,.12), transparent 28%),
        radial-gradient(circle at 92% 92%, rgba(14,170,170,.12), transparent 30%),
        var(--background);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: max(20px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
}
button, input { font: inherit; }
a { color: inherit; }
.auth-shell {
    width: 100%;
    max-width: 1050px;
    min-height: 650px;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(390px, .95fr);
    overflow: hidden;
    border-radius: 32px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 28px 80px rgba(15,47,100,.13), 0 8px 24px rgba(15,47,100,.06);
    animation: appear .55s ease-out;
}
@keyframes appear { from { opacity: 0; transform: translateY(18px) scale(.99); } to { opacity: 1; transform: translateY(0) scale(1); } }
.presentation {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 46px;
    color: var(--white);
    background: linear-gradient(145deg, rgba(13,47,100,.97), rgba(15,86,168,.93) 56%, rgba(14,170,170,.88));
}
.presentation::before, .presentation::after { content: ''; position: absolute; border-radius: 50%; pointer-events: none; }
.presentation::before { width: 330px; height: 330px; top: -140px; right: -120px; border: 1px solid rgba(255,255,255,.22); }
.presentation::after { width: 260px; height: 260px; bottom: -120px; left: -100px; background: rgba(255,255,255,.07); }
.presentation-content { position: relative; z-index: 1; }
.brand { display: inline-flex; align-items: center; gap: 13px; }
.brand-logo { width: 58px; height: 58px; flex-shrink: 0; overflow: hidden; border-radius: 50%; background: transparent; }
.brand-logo img { width: 100%; height: 100%; display: block; object-fit: contain; object-position: center; border-radius: 50%; }
.brand-name { font-family: 'Manrope', sans-serif; font-size: 25px; font-weight: 800; letter-spacing: -.8px; }
.presentation h1 { max-width: 500px; margin-top: 76px; font-family: 'Manrope', sans-serif; font-size: clamp(34px, 4vw, 52px); line-height: 1.08; letter-spacing: -1.8px; }
.presentation-description { max-width: 490px; margin-top: 20px; color: rgba(255,255,255,.78); font-size: 15px; line-height: 1.8; }
.presentation-features { position: relative; z-index: 1; display: grid; gap: 12px; margin-top: 50px; }
.presentation-feature { display: flex; align-items: center; gap: 12px; color: rgba(255,255,255,.86); font-size: 13px; font-weight: 600; }
.presentation-feature span { width: 31px; height: 31px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; background: rgba(255,255,255,.12); }
.form-panel { display: flex; align-items: center; padding: 46px 48px; background: rgba(255,255,255,.97); }
.form-container { width: 100%; max-width: 390px; margin: auto; }
.mobile-brand { display: none; margin-bottom: 28px; text-align: center; }
.mobile-logo { width: 78px; height: 78px; margin: 0 auto 12px; overflow: hidden; border-radius: 50%; }
.mobile-logo img { width: 100%; height: 100%; display: block; object-fit: contain; object-position: center; border-radius: 50%; }
.mobile-brand-name { font-family: 'Manrope', sans-serif; font-size: 27px; font-weight: 800; letter-spacing: -.8px; color: var(--primary-dark); }
.mobile-brand-name span { color: var(--aqua); }
.form-header h2 { font-family: 'Manrope', sans-serif; font-size: 31px; line-height: 1.2; letter-spacing: -1px; color: var(--primary-dark); }
.form-header p { margin-top: 10px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.alerts { margin-top: 24px; }
.alert { display: flex; align-items: flex-start; gap: 11px; padding: 14px 15px; border: 1px solid; border-radius: 15px; font-size: 13px; line-height: 1.55; }
.alert + .alert { margin-top: 10px; }
.alert i { margin-top: 3px; flex-shrink: 0; }
.alert-error { color: var(--danger); background: var(--danger-background); border-color: var(--danger-border); }
.alert-success { color: var(--success); background: var(--success-background); border-color: var(--success-border); }
.login-form { margin-top: 26px; }
.form-group + .form-group { margin-top: 18px; }
.form-label { display: block; margin-bottom: 8px; color: #344054; font-size: 13px; font-weight: 700; }
.label-line { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 8px; }
.label-line .form-label { margin-bottom: 0; }
.small-link { color: var(--primary); font-size: 12px; font-weight: 800; text-decoration: none; }
.small-link:hover { text-decoration: underline; }
.input-wrapper { position: relative; }
.input-icon { position: absolute; top: 50%; left: 17px; transform: translateY(-50%); color: #98a2b3; font-size: 15px; pointer-events: none; }
.form-input {
    width: 100%;
    height: 56px;
    padding: 0 48px 0 48px;
    border: 1px solid var(--border);
    border-radius: 16px;
    outline: none;
    background: var(--white);
    color: var(--text);
    font-size: 14px;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.form-input::placeholder { color: #98a2b3; }
.form-input:hover { border-color: #cbd5e1; }
.form-input:focus { border-color: var(--primary); box-shadow: 0 0 0 4px rgba(15,86,168,.1); }
.password-toggle { position: absolute; top: 50%; right: 9px; transform: translateY(-50%); width: 39px; height: 39px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 11px; color: #667085; background: transparent; cursor: pointer; transition: background .2s ease, color .2s ease; }
.password-toggle:hover, .password-toggle:focus-visible { color: var(--primary); background: var(--primary-light); outline: none; }
.remember-row { display: inline-flex; align-items: center; gap: 9px; margin-top: 18px; color: #475467; font-size: 13px; font-weight: 700; cursor: pointer; }
.remember-row input { width: 16px; height: 16px; accent-color: var(--primary); }
.submit-button {
    width: 100%;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 22px;
    border: 0;
    border-radius: 16px;
    color: var(--white);
    background: linear-gradient(135deg, var(--primary-dark), var(--primary) 62%, var(--aqua));
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 14px 28px rgba(15,86,168,.2);
    transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.submit-button:hover { transform: translateY(-1px); box-shadow: 0 18px 34px rgba(15,86,168,.27); }
.submit-button:focus-visible { outline: 3px solid rgba(15,86,168,.25); outline-offset: 3px; }
.submit-button:disabled { opacity: .72; cursor: wait; transform: none; }
.form-footer { margin-top: 24px; text-align: center; color: var(--muted); font-size: 12px; line-height: 1.65; }
.form-footer a { color: var(--primary); font-weight: 800; text-decoration: none; }
.form-footer a:hover { text-decoration: underline; }
@media (max-width: 900px) {
    body { align-items: flex-start; }
    .auth-shell { max-width: 520px; min-height: auto; display: block; margin: auto; border-radius: 26px; }
    .presentation { display: none; }
    .form-panel { min-height: auto; padding: 38px 34px; }
    .mobile-brand { display: block; }
}
@media (max-width: 520px) {
    body { padding: max(12px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left)); }
    .auth-shell { width: 100%; border-radius: 22px; }
    .form-panel { padding: 30px 22px; }
    .form-header h2 { font-size: 27px; }
    .mobile-logo { width: 70px; height: 70px; }
    .form-input, .submit-button { height: 54px; }
}
@media (max-width: 360px) {
    .form-panel { padding: 26px 17px; }
    .form-header h2 { font-size: 25px; }
    .form-input { padding-left: 44px; padding-right: 44px; }
}
@media (max-height: 700px) and (min-width: 901px) {
    body { align-items: flex-start; }
    .auth-shell { min-height: 610px; }
    .presentation, .form-panel { padding-top: 34px; padding-bottom: 34px; }
    .presentation h1 { margin-top: 42px; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}

.pwa-gate { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 18px; background: rgba(8,20,43,.58); backdrop-filter: blur(14px); }
.pwa-gate.is-hidden { display: none; }
.pwa-gate-card { width: min(440px, 100%); border-radius: 28px; background: #fff; box-shadow: 0 30px 90px rgba(8,20,43,.22); padding: 28px; text-align: center; border: 1px solid #e2e8f0; }
.pwa-gate-logo { width: 74px; height: 74px; margin: 0 auto 14px; border-radius: 22px; overflow: hidden; background: #eff8ff; display:grid; place-items:center; }
.pwa-gate-logo img { width: 58px; height: 58px; object-fit: contain; }
.pwa-gate-card h2 { font-family:'Manrope',sans-serif; font-size: 24px; line-height:1.1; letter-spacing:-.7px; color: var(--primary-dark); }
.pwa-gate-card p { margin: 10px auto 0; color: var(--muted); line-height:1.65; font-size: 14px; max-width: 350px; }
.pwa-gate-status { display:grid; gap:9px; margin: 18px 0; }
.pwa-gate-status span { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 13px; border-radius:15px; border:1px solid #e2e8f0; background:#f8fbff; text-align:left; }
.pwa-gate-status strong { color:#172033; font-size:13px; }
.pwa-gate-status em { color:#0f56a8; font-size:12px; font-weight:800; font-style:normal; }
.pwa-gate-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.pwa-gate-actions button, .pwa-gate-secondary { min-height: 48px; border:0; border-radius: 15px; font-weight:900; cursor:pointer; }
.pwa-gate-actions button:first-child { background: linear-gradient(135deg, var(--primary-dark), var(--primary)); color:#fff; }
.pwa-gate-actions button:last-child { background: var(--aqua-light); color: #087f7f; }
.pwa-gate-secondary { width:100%; margin-top:10px; background:#f1f5f9; color:#334155; }
.pwa-gate-help { display:inline-block; margin-top:13px; color:var(--primary); font-size:12px; font-weight:900; text-decoration:none; }
@media (max-width:520px){ .pwa-gate-card{padding:22px;border-radius:24px}.pwa-gate-actions{grid-template-columns:1fr}.pwa-gate-status span{display:grid;gap:4px} }

/* AssistFlow production install + legal + maintenance */
.public-install{min-height:100vh;padding:34px;display:grid;gap:28px;background:radial-gradient(circle at top left,#dff7ff 0,#f8fbff 32%,#ffffff 70%);color:#172033}
.install-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:32px;align-items:center;max-width:1180px;width:100%;margin:0 auto;padding:36px;border:1px solid rgba(15,61,145,.10);border-radius:36px;background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(239,248,255,.88));box-shadow:0 30px 90px rgba(15,47,100,.12);overflow:hidden;position:relative}
.install-hero:before{content:"";position:absolute;right:-110px;top:-130px;width:330px;height:330px;border-radius:999px;background:linear-gradient(135deg,rgba(14,170,170,.22),rgba(15,61,145,.18));filter:blur(2px)}
.install-hero-copy{position:relative;z-index:1}.eyebrow.light{background:#e8f8ff;color:#0f56a8;border:1px solid #caecff}.install-hero h1{font-family:'Manrope',sans-serif;font-size:clamp(34px,5vw,62px);line-height:.98;letter-spacing:-2.2px;color:#0d2f64;margin:14px 0}.install-hero p{font-size:17px;line-height:1.75;color:#506176;max-width:650px}.install-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.btn.btn-lg{min-height:52px;padding:0 20px;border-radius:17px}.btn.btn-primary,.btn-primary{background:linear-gradient(135deg,#0d2f64,#0f56a8);color:#fff;border:0;text-decoration:none;box-shadow:0 14px 28px rgba(15,86,168,.20)}.btn.btn-secondary{background:#e8fbfb;color:#087f7f;border:1px solid #aeeeee}.btn.btn-ghost{background:#fff;color:#334155;border:1px solid #dce6f1}.install-status{margin-top:14px;padding:13px 15px;border-radius:16px;background:#fff;border:1px solid #e1ebf6;color:#526174;font-weight:800;font-size:13px;display:inline-flex;max-width:100%}.install-phone{display:grid;place-items:center;position:relative;z-index:1}.phone-frame{width:260px;height:520px;border-radius:42px;background:#071e42;padding:13px;box-shadow:0 35px 70px rgba(8,25,56,.28);position:relative}.phone-notch{position:absolute;top:20px;left:50%;transform:translateX(-50%);width:88px;height:24px;border-radius:0 0 18px 18px;background:#071e42;z-index:2}.phone-screen{height:100%;border-radius:32px;background:linear-gradient(180deg,#fff,#eef8ff);display:grid;place-items:center;align-content:center;gap:10px;text-align:center;padding:24px}.phone-screen img{width:92px;height:92px;border-radius:24px;box-shadow:0 12px 30px rgba(15,47,100,.13)}.phone-screen strong{font-family:'Manrope',sans-serif;color:#0d2f64;font-size:22px}.phone-screen span{font-size:12px;color:#64748b;font-weight:900}.install-section,.install-feature-grid,.install-help{max-width:1180px;width:100%;margin:0 auto}.section-heading{display:flex;justify-content:space-between;gap:20px;align-items:end;margin:8px 0 18px}.section-heading h2,.install-help h2{font-family:'Manrope',sans-serif;font-size:30px;color:#0d2f64;letter-spacing:-1px}.section-heading p{max-width:650px;color:#64748b;line-height:1.65;font-weight:700}.install-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.install-card{background:#fff;border:1px solid #dfeaf6;border-radius:26px;padding:20px;box-shadow:0 18px 45px rgba(15,47,100,.07);transition:.2s ease}.install-card:hover{transform:translateY(-4px);box-shadow:0 25px 60px rgba(15,47,100,.12)}.install-card-head{display:flex;gap:12px;align-items:center;margin-bottom:14px}.install-os-icon{width:44px;height:44px;border-radius:16px;background:linear-gradient(135deg,#eff8ff,#dffafa);display:grid;place-items:center;color:#0f56a8;font-weight:900}.install-card h3{color:#0d2f64;font-family:'Manrope',sans-serif;font-size:19px}.install-card span{color:#64748b;font-size:12px;font-weight:900}.install-procedure{counter-reset:item;list-style:none;display:grid;gap:11px;padding:0;margin:0}.install-procedure li{display:flex;gap:10px;align-items:flex-start;color:#344256;font-size:13px;font-weight:800;line-height:1.45}.install-procedure li:before{counter-increment:item;content:counter(item);width:24px;height:24px;flex:0 0 24px;border-radius:999px;background:#eff8ff;color:#0f56a8;display:grid;place-items:center;font-size:12px;font-weight:900}.install-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.install-feature-card{display:flex;gap:14px;background:#fff;border:1px solid #e1ebf6;border-radius:24px;padding:18px;box-shadow:0 14px 35px rgba(15,47,100,.06)}.feature-icon{width:46px;height:46px;border-radius:16px;background:#f0fbff;display:grid;place-items:center;font-size:22px}.install-feature-card h3{font-size:16px;color:#0d2f64;margin-bottom:5px}.install-feature-card p,.install-help p{color:#64748b;line-height:1.6;font-weight:700;font-size:13px}.install-help{display:flex;justify-content:space-between;gap:18px;align-items:center;background:#0d2f64;color:#fff;border-radius:30px;padding:24px 28px;box-shadow:0 22px 50px rgba(13,47,100,.18)}.install-help h2,.install-help p{color:#fff}.install-help p{opacity:.78}.maintenance-page,.legal-page{min-height:100vh;padding:34px;display:grid;place-items:center;background:linear-gradient(135deg,#eff8ff,#fff)}.maintenance-card,.legal-card{width:min(980px,100%);background:#fff;border:1px solid #e1ebf6;border-radius:30px;box-shadow:0 30px 80px rgba(15,47,100,.12);padding:34px}.maintenance-card{text-align:center;width:min(620px,100%)}.maintenance-logo{width:90px;height:90px;margin:0 auto 14px;border-radius:26px;background:#eff8ff;display:grid;place-items:center}.maintenance-logo img{width:70px;height:70px}.maintenance-card h1,.legal-card h1{font-family:'Manrope',sans-serif;color:#0d2f64;font-size:clamp(30px,4vw,46px);letter-spacing:-1.4px;line-height:1.05;margin:10px 0}.maintenance-card p,.legal-card p,.legal-card li{color:#536174;line-height:1.75;font-weight:650}.legal-card h2{font-family:'Manrope',sans-serif;color:#0d2f64;margin-top:24px;font-size:24px}.legal-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}.legal-list{display:grid;gap:10px;margin:16px 0;padding-left:22px}
@media(max-width:980px){.install-hero{grid-template-columns:1fr}.install-phone{display:none}.install-grid,.install-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-heading{display:grid}.install-help{display:grid}}
@media(max-width:620px){.public-install{padding:16px}.install-hero{border-radius:28px;padding:24px}.install-grid,.install-feature-grid{grid-template-columns:1fr}.install-hero-actions{display:grid}.install-status{display:block}.section-heading h2,.install-help h2{font-size:25px}.legal-page,.maintenance-page{padding:16px}.legal-card,.maintenance-card{padding:24px;border-radius:24px}}

/* Step fix: login footer, install gate, legal pages and offline polish */
.login-legal-footer{
    margin-top:22px;
    padding-top:16px;
    border-top:1px solid #eef2f7;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
    color:#64748b;
    font-size:12px;
    font-weight:800;
    line-height:1.5;
    text-align:center;
}
.login-legal-footer a{color:#0f56a8;text-decoration:none;padding:5px 3px;border-radius:8px;}
.login-legal-footer a:hover,.login-legal-footer a:focus-visible{text-decoration:underline;outline:none;background:#eff8ff;}
.pwa-gate-actions.single{grid-template-columns:1fr;}
.pwa-gate-card .pwa-gate-secondary{background:#fff;color:#64748b;border:1px dashed #cbd5e1;}
.pwa-gate-card .pwa-gate-secondary:hover{background:#f8fafc;color:#0f56a8;}
.public-install{width:100%;align-self:stretch;}
.install-hero-actions .btn,.install-help .btn,.legal-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:900;text-decoration:none;cursor:pointer;}
.legal-card-wide{width:min(1120px,100%);padding:0;overflow:hidden;}
.legal-hero{display:grid;grid-template-columns:86px minmax(0,1fr);gap:18px;align-items:center;padding:34px 34px 24px;background:linear-gradient(135deg,#eff8ff,#fff 62%,#e8fbfb);border-bottom:1px solid #e1ebf6;}
.legal-mark{width:74px;height:74px;border-radius:24px;background:#fff;box-shadow:0 16px 38px rgba(15,47,100,.10);display:grid;place-items:center;overflow:hidden;}
.legal-mark img{width:58px;height:58px;object-fit:contain;}
.legal-nav{display:flex;gap:10px;flex-wrap:wrap;padding:16px 34px;border-bottom:1px solid #eaf0f7;background:#fff;position:sticky;top:0;z-index:2;}
.legal-nav a{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 14px;border-radius:999px;background:#f8fbff;border:1px solid #dfeaf6;color:#0f56a8;text-decoration:none;font-size:13px;font-weight:900;}
.legal-nav a:hover{background:#eff8ff;border-color:#bddcf8;}
.legal-section{padding:24px 34px;border-bottom:1px solid #f0f4f8;}
.legal-section:last-of-type{border-bottom:0;}
.legal-section h2{margin-top:0!important;margin-bottom:10px;font-size:23px!important;line-height:1.22;}
.legal-section p + p{margin-top:10px;}
.legal-warning{background:linear-gradient(135deg,#fff9ed,#ffffff);border-left:5px solid #f59e0b;}
.legal-actions-centered{padding:24px 34px 34px;margin-top:0!important;justify-content:center;}
.legal-actions .btn{min-height:44px;padding:0 16px;border-radius:14px;}
.legal-actions .btn-ghost{background:#fff;color:#334155;border:1px solid #dce6f1;box-shadow:none;}
@media(max-width:900px){
    .login-legal-footer{margin-top:20px;padding-top:14px;}
    .legal-hero{grid-template-columns:1fr;text-align:center;justify-items:center;padding:28px 22px 20px;}
    .legal-nav{justify-content:center;padding:14px 18px;position:static;}
    .legal-section{padding:22px;}
    .legal-actions-centered{padding:22px;}
}
@media(max-width:520px){
    .login-legal-footer{font-size:11px;gap:7px;}
    .pwa-gate-card h2{font-size:22px;}
    .legal-section h2{font-size:20px!important;}
    .legal-card p,.legal-card li{font-size:14px;}
    .legal-nav a{width:100%;}
    .legal-actions .btn{width:100%;}
}