/* ================================================================
   MPRM V62.2.10 — Login polish + public PWA download page
   Scoped to the public entry surfaces to avoid changing app pages.
   ================================================================ */

/* Login page ------------------------------------------------------ */
.v57-login-shell .login-panel {
    position: relative;
    overflow: hidden;
}
.v57-login-shell .login-panel::before {
    content: "";
    position: absolute;
    width: 360px;
    height: 360px;
    top: -190px;
    right: -150px;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(18, 148, 191, .13), rgba(37, 99, 235, .035) 58%, transparent 72%);
    pointer-events: none;
}
.v57-login-card {
    position: relative;
    isolation: isolate;
}
.v57-login-heading .eyebrow {
    color: #1d68aa;
    background: #eef7ff;
    border: 1px solid #d4e8fb;
    border-radius: 999px;
    padding: 6px 9px;
    letter-spacing: .075em;
}
.v57-login-fields .login-button {
    background: linear-gradient(135deg, #123f70 0%, #16649b 58%, #1288a8 100%);
    border: 0;
    box-shadow: 0 11px 24px rgba(15, 75, 128, .22);
}
.v57-login-fields .login-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(15, 75, 128, .27);
}
.pwa-download-cta {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 28px;
    align-items: center;
    gap: 10px;
    min-height: 58px;
    margin-top: 11px;
    padding: 8px 10px;
    border: 1px solid #cfe0ef;
    border-radius: 14px;
    background: linear-gradient(135deg, #f7fbff 0%, #eef8fb 100%);
    color: #173956;
    text-decoration: none;
    box-shadow: 0 5px 16px rgba(16, 57, 91, .055);
    transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease, background .16s ease;
}
.pwa-download-cta:hover {
    border-color: #8cbfe0;
    background: linear-gradient(135deg, #f2f9ff 0%, #e8f8fb 100%);
    color: #0f4169;
    transform: translateY(-1px);
    box-shadow: 0 9px 22px rgba(16, 73, 116, .11);
}
.pwa-download-cta:focus-visible {
    outline: none;
    border-color: #3f8ed2;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .13);
}
.pwa-download-cta-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(145deg, #185489, #1194a6);
    box-shadow: 0 7px 15px rgba(17, 115, 151, .18);
}
.pwa-download-cta-icon svg { width: 20px; height: 20px; }
.pwa-download-cta-copy { display: grid; gap: 2px; min-width: 0; }
.pwa-download-cta-copy b { font-size: 13px; line-height: 1.2; color: #173e61; }
.pwa-download-cta-copy small { color: #687e91; font-size: 10.5px; line-height: 1.35; }
.pwa-download-cta-arrow { color: #7291aa; display: grid; place-items: center; }
.pwa-download-cta-arrow svg { width: 18px; height: 18px; }

html[data-theme="dark"] .v57-login-heading .eyebrow {
    color: #9cd8f4;
    background: #122b42;
    border-color: #274b65;
}
html[data-theme="dark"] .pwa-download-cta {
    border-color: #31506b;
    background: linear-gradient(135deg, #102438 0%, #102c37 100%);
    color: #e8f4ff;
}
html[data-theme="dark"] .pwa-download-cta:hover {
    border-color: #4e85a7;
    background: linear-gradient(135deg, #132b41 0%, #123441 100%);
}
html[data-theme="dark"] .pwa-download-cta-copy b { color: #e8f4ff; }
html[data-theme="dark"] .pwa-download-cta-copy small { color: #abc1d2; }
html[data-theme="dark"] .pwa-download-cta-arrow { color: #8eb9d2; }

/* Dedicated PWA download page ------------------------------------ */
.pwa-download-body {
    min-height: 100vh;
    margin: 0;
    color: #17324c;
    background:
        radial-gradient(circle at 8% 12%, rgba(20, 157, 184, .11), transparent 27%),
        radial-gradient(circle at 92% 4%, rgba(37, 99, 235, .11), transparent 30%),
        linear-gradient(180deg, #f7fbff 0%, #edf3f8 100%);
}
.pwa-download-topbar {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    min-height: 78px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}
.pwa-download-brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: #123551;
    text-decoration: none;
}
.pwa-download-brand img { width: 46px; height: 46px; object-fit: contain; }
.pwa-download-brand > span { display: grid; gap: 1px; }
.pwa-download-brand strong { font-size: 18px; letter-spacing: .065em; }
.pwa-download-brand small { font-size: 9px; color: #71859a; letter-spacing: .12em; }
.pwa-download-top-actions { display: flex; align-items: center; gap: 9px; }
.pwa-download-theme-toggle,
.pwa-download-signin-link {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 12px;
    border: 1px solid #d3e0eb;
    border-radius: 12px;
    background: rgba(255,255,255,.82);
    color: #355069;
    font-size: 11px;
    font-weight: 800;
    text-decoration: none;
    box-shadow: 0 4px 14px rgba(31, 58, 82, .045);
}
.pwa-download-theme-toggle svg,
.pwa-download-signin-link svg { width: 16px; height: 16px; }
.pwa-download-main {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    padding: 40px 0 64px;
}
.pwa-download-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(330px, .72fr);
    align-items: center;
    gap: clamp(36px, 7vw, 96px);
    min-height: 560px;
}
.pwa-download-kicker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 10px;
    border: 1px solid #cce4ef;
    border-radius: 999px;
    color: #156a89;
    background: rgba(236, 249, 252, .9);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .11em;
}
.pwa-download-kicker svg { width: 15px; height: 15px; }
.pwa-download-hero h1 {
    max-width: 720px;
    margin: 20px 0 18px;
    color: #102e49;
    font-size: clamp(42px, 6vw, 72px);
    line-height: .98;
    letter-spacing: -.045em;
}
.pwa-download-lead {
    max-width: 670px;
    margin: 0;
    color: #60778b;
    font-size: clamp(15px, 1.5vw, 18px);
    line-height: 1.7;
}
.pwa-download-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 30px; }
.pwa-download-install-button {
    min-width: 285px;
    min-height: 64px;
    display: grid;
    grid-template-columns: 43px minmax(0, 1fr);
    align-items: center;
    gap: 11px;
    padding: 9px 16px 9px 10px;
    border: 0;
    border-radius: 16px;
    color: #fff;
    background: linear-gradient(135deg, #123e6c 0%, #176b9a 55%, #1598a4 100%);
    box-shadow: 0 15px 32px rgba(20, 86, 132, .25);
    cursor: pointer;
    text-align: left;
    transition: transform .16s ease, box-shadow .16s ease;
}
.pwa-download-install-button:hover { transform: translateY(-2px); box-shadow: 0 18px 38px rgba(20, 86, 132, .3); }
.pwa-download-install-button[hidden] { display: none !important; }
.pwa-download-install-icon {
    width: 43px;
    height: 43px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    color: #154d75;
    background: rgba(255,255,255,.94);
}
.pwa-download-install-icon svg { width: 21px; height: 21px; }
.pwa-download-install-button > span:last-child { display: grid; gap: 2px; }
.pwa-download-install-button b { font-size: 14px; }
.pwa-download-install-button small { color: rgba(255,255,255,.8); font-size: 10px; line-height: 1.3; }
.pwa-download-back {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 10px 15px;
    border: 1px solid #ccdae6;
    border-radius: 14px;
    background: rgba(255,255,255,.8);
    color: #39536b;
    font-size: 12px;
    font-weight: 850;
    text-decoration: none;
}
.pwa-download-back svg { width: 17px; height: 17px; }
.pwa-download-pwa-note {
    max-width: 660px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    margin-top: 22px;
    padding: 13px 15px;
    border: 1px solid #d9e7ef;
    border-radius: 14px;
    background: rgba(255,255,255,.68);
}
.pwa-download-pwa-note > svg { width: 22px; height: 22px; margin: 2px auto 0; color: #168195; }
.pwa-download-pwa-note p { margin: 0; color: #597083; font-size: 12px; line-height: 1.55; }
.pwa-download-pwa-note strong { color: #294963; }
.pwa-download-visual { position: relative; min-height: 480px; display: grid; place-items: center; }
.pwa-download-visual::before {
    content: "";
    position: absolute;
    width: 390px;
    height: 390px;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(32, 157, 184, .18), rgba(37, 99, 235, .08) 52%, transparent 68%);
}
.pwa-device-card {
    position: relative;
    z-index: 2;
    width: min(285px, 72vw);
    min-height: 425px;
    padding: 18px;
    border: 7px solid #102e49;
    border-radius: 38px;
    color: #143550;
    background: linear-gradient(180deg, #fff 0%, #f1f8fb 100%);
    box-shadow: 0 34px 60px rgba(13, 46, 74, .22), inset 0 0 0 1px rgba(255,255,255,.8);
    transform: rotate(3deg);
}
.pwa-device-top { display: flex; align-items: center; justify-content: space-between; min-height: 26px; font-size: 9px; color: #688096; }
.pwa-device-top > span:first-child { width: 48px; height: 5px; border-radius: 999px; background: #d5e1ea; }
.pwa-device-dot { width: 8px !important; height: 8px !important; border-radius: 50% !important; background: #31a4a7 !important; }
.pwa-device-app-icon { width: 78px; height: 78px; margin: 43px auto 18px; display: grid; place-items: center; border-radius: 21px; background: #fff; box-shadow: 0 15px 30px rgba(16, 57, 91, .14); }
.pwa-device-app-icon img { width: 65px; height: 65px; object-fit: contain; }
.pwa-device-card h2 { margin: 0; text-align: center; color: #153c5c; font-size: 24px; line-height: 1.08; letter-spacing: -.025em; }
.pwa-device-lines { display: grid; gap: 8px; width: 72%; margin: 25px auto; }
.pwa-device-lines span { height: 7px; border-radius: 999px; background: #dbe8ef; }
.pwa-device-lines span:nth-child(2) { width: 84%; }
.pwa-device-lines span:nth-child(3) { width: 62%; }
.pwa-device-status { width: max-content; display: flex; align-items: center; gap: 7px; margin: 25px auto 0; padding: 8px 10px; border-radius: 999px; color: #177a72; background: #e5f7f3; font-size: 10px; font-weight: 850; }
.pwa-device-status svg { width: 15px; height: 15px; }
.pwa-download-orbit {
    position: absolute;
    z-index: 3;
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.8);
    border-radius: 17px;
    color: #fff;
    background: linear-gradient(145deg, #17628f, #1da1a7);
    box-shadow: 0 12px 24px rgba(14, 75, 111, .18);
}
.pwa-download-orbit svg { width: 23px; height: 23px; }
.orbit-one { top: 12%; left: 4%; transform: rotate(-8deg); }
.orbit-two { right: 1%; top: 34%; transform: rotate(8deg); }
.orbit-three { left: 4%; bottom: 10%; transform: rotate(-4deg); }
.pwa-download-benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 18px 0 84px;
}
.pwa-download-benefits article {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 12px;
    padding: 18px;
    border: 1px solid #dbe6ee;
    border-radius: 18px;
    background: rgba(255,255,255,.76);
    box-shadow: 0 8px 24px rgba(23, 51, 75, .055);
}
.pwa-benefit-icon,
.pwa-platform-icon,
.pwa-security-icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    color: #176688;
    background: #eaf6fb;
}
.pwa-benefit-icon svg,
.pwa-platform-icon svg,
.pwa-security-icon svg { width: 21px; height: 21px; }
.pwa-download-benefits strong { color: #21435e; font-size: 13px; }
.pwa-download-benefits p { margin: 5px 0 0; color: #708396; font-size: 11px; line-height: 1.55; }
.pwa-download-guide {
    padding: clamp(26px, 4vw, 46px);
    border: 1px solid #d8e5ee;
    border-radius: 30px;
    background: rgba(255,255,255,.79);
    box-shadow: 0 24px 60px rgba(23, 51, 75, .08);
}
.pwa-download-section-heading { max-width: 700px; }
.pwa-download-section-heading h2 { margin: 16px 0 8px; color: #163a57; font-size: clamp(28px, 4vw, 42px); letter-spacing: -.035em; }
.pwa-download-section-heading p { margin: 0; color: #6b8092; font-size: 13px; line-height: 1.65; }
.pwa-download-platform-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 30px; }
.pwa-platform-card { padding: 20px; border: 1px solid #dfe8ef; border-radius: 19px; background: #f8fbfd; }
.pwa-platform-title { display: grid; gap: 2px; margin: 14px 0 15px; }
.pwa-platform-title strong { color: #1d405d; font-size: 15px; }
.pwa-platform-title small { color: #7c8fa0; font-size: 10px; }
.pwa-platform-card ol { margin: 0; padding-left: 20px; color: #63798c; font-size: 11.5px; line-height: 1.65; }
.pwa-platform-card li + li { margin-top: 7px; }
.pwa-platform-card b { color: #31536e; }
.pwa-download-security {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin: 22px 0 0;
    padding: 19px 22px;
    border: 1px solid #d8e5ed;
    border-radius: 20px;
    background: rgba(255,255,255,.68);
}
.pwa-download-security > div { display: grid; grid-template-columns: 46px minmax(0, 1fr); align-items: center; gap: 12px; }
.pwa-download-security strong { color: #234763; font-size: 13px; }
.pwa-download-security p { margin: 4px 0 0; color: #708497; font-size: 11px; line-height: 1.5; }
.pwa-download-footer-login { display: inline-flex; align-items: center; gap: 7px; color: #17688f; font-size: 12px; font-weight: 850; text-decoration: none; white-space: nowrap; }
.pwa-download-footer-login svg { width: 17px; height: 17px; }
.pwa-download-footer { min-height: 76px; display: flex; align-items: center; justify-content: center; gap: 9px; padding: 14px 20px; color: #7a8d9e; font-size: 10px; }
.pwa-download-footer strong { color: #31506b; letter-spacing: .06em; }

/* Dark mode ------------------------------------------------------- */
html[data-theme="dark"] .pwa-download-body {
    color: #e6f0f8;
    background:
        radial-gradient(circle at 8% 12%, rgba(20, 157, 184, .13), transparent 27%),
        radial-gradient(circle at 92% 4%, rgba(61, 129, 255, .13), transparent 30%),
        linear-gradient(180deg, #07111f 0%, #0a1726 100%);
}
html[data-theme="dark"] .pwa-download-brand { color: #eff8ff; }
html[data-theme="dark"] .pwa-download-brand small { color: #91a9bd; }
html[data-theme="dark"] .pwa-download-theme-toggle,
html[data-theme="dark"] .pwa-download-signin-link,
html[data-theme="dark"] .pwa-download-back {
    border-color: #2e4961;
    background: rgba(15, 32, 49, .88);
    color: #d8e8f5;
}
html[data-theme="dark"] .pwa-download-kicker { border-color: #22506a; background: #102b3e; color: #83d2e2; }
html[data-theme="dark"] .pwa-download-hero h1,
html[data-theme="dark"] .pwa-download-section-heading h2 { color: #f3f8fd; }
html[data-theme="dark"] .pwa-download-lead,
html[data-theme="dark"] .pwa-download-section-heading p { color: #a9bed0; }
html[data-theme="dark"] .pwa-download-pwa-note,
html[data-theme="dark"] .pwa-download-benefits article,
html[data-theme="dark"] .pwa-download-guide,
html[data-theme="dark"] .pwa-download-security {
    border-color: #284259;
    background: rgba(13, 30, 47, .82);
}
html[data-theme="dark"] .pwa-download-pwa-note p,
html[data-theme="dark"] .pwa-download-benefits p,
html[data-theme="dark"] .pwa-download-security p { color: #a4b9ca; }
html[data-theme="dark"] .pwa-download-pwa-note strong,
html[data-theme="dark"] .pwa-download-benefits strong,
html[data-theme="dark"] .pwa-download-security strong { color: #e4f0f8; }
html[data-theme="dark"] .pwa-platform-card { border-color: #2a4358; background: #0d1e2f; }
html[data-theme="dark"] .pwa-platform-title strong,
html[data-theme="dark"] .pwa-platform-card b { color: #dcecf7; }
html[data-theme="dark"] .pwa-platform-title small,
html[data-theme="dark"] .pwa-platform-card ol { color: #a4b8c8; }
html[data-theme="dark"] .pwa-benefit-icon,
html[data-theme="dark"] .pwa-platform-icon,
html[data-theme="dark"] .pwa-security-icon { color: #8cd3e4; background: #123149; }
html[data-theme="dark"] .pwa-download-footer { color: #839caf; }
html[data-theme="dark"] .pwa-download-footer strong { color: #d2e4f1; }

/* Responsive ------------------------------------------------------ */
@media (max-width: 900px) {
    .pwa-download-main { padding-top: 22px; }
    .pwa-download-hero { grid-template-columns: 1fr; min-height: 0; text-align: center; }
    .pwa-download-hero-copy { display: grid; justify-items: center; }
    .pwa-download-visual { min-height: 420px; }
    .pwa-download-benefits,
    .pwa-download-platform-grid { grid-template-columns: 1fr; }
    .pwa-download-benefits { margin-top: 0; margin-bottom: 54px; }
    .pwa-download-security { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 620px) {
    .pwa-download-topbar,
    .pwa-download-main { width: min(100% - 24px, 1180px); }
    .pwa-download-topbar { min-height: 68px; }
    .pwa-download-brand img { width: 39px; height: 39px; }
    .pwa-download-brand strong { font-size: 15px; }
    .pwa-download-brand small { font-size: 7.5px; }
    .pwa-download-signin-link span,
    .pwa-download-theme-toggle [data-theme-toggle-label] { display: none; }
    .pwa-download-signin-link,
    .pwa-download-theme-toggle { width: 42px; padding: 8px; }
    .pwa-download-main { padding-bottom: 38px; }
    .pwa-download-hero { gap: 10px; }
    .pwa-download-hero h1 { margin-top: 17px; font-size: clamp(38px, 13vw, 56px); }
    .pwa-download-lead { font-size: 14px; }
    .pwa-download-actions { width: 100%; display: grid; }
    .pwa-download-install-button { min-width: 0; width: 100%; }
    .pwa-download-back { width: 100%; box-sizing: border-box; }
    .pwa-download-visual { min-height: 390px; transform: scale(.92); margin: -12px 0; }
    .pwa-download-benefits article { padding: 16px; }
    .pwa-download-guide { padding: 22px 16px; border-radius: 22px; }
    .pwa-platform-card { padding: 17px; }
    .pwa-download-security { padding: 16px; }
    .pwa-download-security > div { grid-template-columns: 40px minmax(0, 1fr); }
    .pwa-security-icon { width: 40px; height: 40px; }
    .pwa-download-footer { display: grid; gap: 3px; text-align: center; }
}
