:root {
    --auth-bg:#edf3f8; --auth-bg2:#d7e4ef; --auth-card:rgba(255,255,255,.86); --auth-border:rgba(45,69,92,.16);
    --auth-text:#172432; --auth-soft:#607080; --auth-faint:#7e8b98; --auth-accent:#1777c8; --auth-accent2:#0d61aa;
    --auth-input:rgba(248,251,253,.92); --auth-error:#a23e4a; --auth-error-bg:rgba(162,62,74,.09);
    --auth-shadow:0 32px 90px rgba(42,66,88,.2); --auth-font:"Segoe UI Variable","Segoe UI",system-ui,sans-serif;
}
html[data-reach-theme="dark"] {
    --auth-bg:#0e141b; --auth-bg2:#15212c; --auth-card:rgba(24,33,43,.90); --auth-border:rgba(222,233,243,.12);
    --auth-text:#f3f7fb; --auth-soft:#afbdca; --auth-faint:#7f91a2; --auth-accent:#5aa9e8; --auth-accent2:#78baf0;
    --auth-input:rgba(14,21,28,.72); --auth-error:#ef8a95; --auth-error-bg:rgba(239,138,149,.09);
    --auth-shadow:0 34px 100px rgba(0,0,0,.46);
}
*{box-sizing:border-box} html,body{min-height:100%;margin:0} html{background:var(--auth-bg)}
body.reach-auth-page{font-family:var(--auth-font);color:var(--auth-text);background:
radial-gradient(circle at 20% 10%,rgba(50,135,201,.16),transparent 26rem),
radial-gradient(circle at 83% 20%,rgba(88,101,184,.13),transparent 30rem),
linear-gradient(145deg,var(--auth-bg2),var(--auth-bg) 48%);}
.reach-auth-page::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.35;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,black,transparent 78%)}
.reach-auth-shell{min-height:100vh;display:grid;grid-template-rows:1fr auto;place-items:center;padding:34px 18px 18px}
.reach-auth-card{position:relative;width:min(430px,100%);padding:31px 32px 27px;border:1px solid var(--auth-border);border-radius:20px;background:var(--auth-card);backdrop-filter:blur(28px) saturate(120%);box-shadow:var(--auth-shadow)}
.reach-auth-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 1px rgba(255,255,255,.08)}
.reach-auth-brand{display:flex;align-items:baseline;gap:8px;margin-bottom:36px;letter-spacing:.1em}.reach-auth-brand span{font-size:15px;font-weight:760}.reach-auth-brand strong{font-size:13px;color:var(--auth-accent);font-weight:600}
.reach-auth-intro{margin-bottom:23px}.reach-auth-eyebrow{color:var(--auth-accent);font-size:10px;text-transform:uppercase;letter-spacing:.12em;font-weight:750}.reach-auth-intro h1{margin:5px 0 7px;font-size:31px;letter-spacing:-.035em;font-weight:660}.reach-auth-intro p{margin:0;color:var(--auth-soft);font-size:12.5px}
.reach-auth-error{margin-bottom:15px;padding:10px 12px;border:1px solid color-mix(in srgb,var(--auth-error) 35%,transparent);border-radius:9px;background:var(--auth-error-bg);color:var(--auth-error);font-size:12px}
.reach-auth-form{display:grid;gap:14px}.reach-auth-form label{display:grid;gap:6px}.reach-auth-form label>span{font-size:11px;font-weight:620;color:var(--auth-soft)}.reach-auth-form input{width:100%;height:42px;padding:0 11px;border:1px solid var(--auth-border);border-radius:9px;outline:none;background:var(--auth-input);color:var(--auth-text);font:inherit;font-size:13px;transition:.14s}.reach-auth-form input:focus{border-color:var(--auth-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--auth-accent) 16%,transparent)}.reach-auth-form button{height:43px;margin-top:3px;border:0;border-radius:9px;background:var(--auth-accent);color:#fff;font:inherit;font-size:12.5px;font-weight:650;cursor:pointer;box-shadow:0 7px 18px color-mix(in srgb,var(--auth-accent) 22%,transparent)}.reach-auth-form button:hover{background:var(--auth-accent2)}.reach-auth-form button:disabled{opacity:.62;cursor:wait;box-shadow:none}.reach-auth-form button:disabled:hover{background:var(--auth-accent)}
.reach-auth-note{display:grid;grid-template-columns:16px 1fr;gap:8px;margin-top:23px;padding-top:16px;border-top:1px solid var(--auth-border);color:var(--auth-faint);font-size:10px;line-height:1.45}.reach-auth-lock{position:relative;width:12px;height:10px;margin-top:4px;border:1.5px solid currentColor;border-radius:3px}.reach-auth-lock::before{content:"";position:absolute;left:2px;right:2px;bottom:7px;height:6px;border:1.5px solid currentColor;border-bottom:0;border-radius:6px 6px 0 0}
.reach-auth-footer{align-self:end;display:flex;gap:12px;align-items:center;color:var(--auth-faint);font-size:9.5px}.reach-auth-footer span+span::before{content:"•";margin-right:12px}
@media(max-width:520px){.reach-auth-shell{padding:18px 12px 14px}.reach-auth-card{padding:26px 22px 24px;border-radius:16px}.reach-auth-footer span:last-child{display:none}.reach-auth-footer span+span::before{display:none}}

:root {
    --auth-glass: rgba(255,255,255,.50);
    --auth-glass-border: rgba(255,255,255,.42);
    --auth-glass-shadow: 0 16px 46px rgba(20,35,50,.32), inset 0 1px 0 rgba(255,255,255,.24);
}

html[data-reach-theme="dark"] {
    --auth-glass: rgba(12,12,16,.52);
    --auth-glass-border: rgba(255,255,255,.09);
    --auth-glass-shadow: 0 18px 52px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.04);
}

body.reach-auth-page {
    background-image:
        linear-gradient(120deg, rgba(20,30,50,.04), rgba(10,18,32,.10)),
        url("../images/reach/Light.jpg");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

html[data-reach-theme="dark"] body.reach-auth-page {
    background-image:
        linear-gradient(120deg, rgba(15,23,42,.08), rgba(3,8,18,.15)),
        url("../images/reach/Dark.jpg");
}

.reach-auth-page::before {
    display: none;
}

.reach-auth-card {
    width: min(410px,100%);
    padding: 30px 32px 28px;
    border-color: var(--auth-glass-border);
    border-radius: 16px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--auth-glass) 88%, transparent), var(--auth-glass));
    -webkit-backdrop-filter: blur(17px) saturate(122%);
    backdrop-filter: blur(17px) saturate(122%);
    box-shadow: var(--auth-glass-shadow);
}

.reach-auth-card::after {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.reach-auth-brand {
    margin-bottom: 31px;
    text-shadow: 0 2px 10px rgba(0,0,0,.16);
}

.reach-auth-intro h1 {
    font-weight: 420;
}

.reach-auth-form input {
    height: 44px;
    border-color: color-mix(in srgb, var(--auth-glass-border) 62%, var(--auth-soft));
    border-radius: 11px;
    background: color-mix(in srgb, var(--auth-glass) 46%, rgba(0,0,0,.18));
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

html[data-reach-theme="light"] .reach-auth-form input {
    background: rgba(255,255,255,.70);
}

.reach-auth-form button {
    height: 44px;
    border-radius: 11px;
    box-shadow: 0 7px 20px color-mix(in srgb,var(--auth-accent) 28%,transparent);
}

.reach-auth-footer {
    padding: 7px 12px;
    border: 1px solid var(--auth-glass-border);
    border-radius: 999px;
    background: color-mix(in srgb, var(--auth-glass) 70%, transparent);
    box-shadow: 0 6px 18px rgba(2,6,23,.14);
    -webkit-backdrop-filter: blur(10px) saturate(115%);
    backdrop-filter: blur(10px) saturate(115%);
}


.reach-auth-product {
    display: grid;
    gap: 15px;
    margin-bottom: 26px;
}

.reach-auth-hub-badge {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    width: fit-content;
    min-height: 54px;
    padding: 9px 14px 9px 10px;
    border: 1px solid color-mix(in srgb, var(--auth-glass-border) 82%, rgba(255,255,255,.18));
    border-radius: 14px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--auth-glass) 76%, rgba(255,255,255,.18)), color-mix(in srgb, var(--auth-glass) 92%, transparent));
    box-shadow: 0 10px 24px rgba(2,6,23,.16), inset 0 1px 0 rgba(255,255,255,.08);
    -webkit-backdrop-filter: blur(14px) saturate(118%);
    backdrop-filter: blur(14px) saturate(118%);
}

.reach-auth-hub-mark {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 8px 18px rgba(21,69,126,.22);
}

.reach-auth-hub-mark img {
    display: block;
    width: 100%;
    height: 100%;
}

.reach-auth-hub-copy {
    display: grid;
    gap: 2px;
    line-height: 1.05;
}

.reach-auth-hub-copy strong {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -.01em;
}

.reach-auth-hub-copy small {
    color: var(--auth-soft);
    font-size: 10px;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-weight: 700;
}

.reach-auth-brand {
    margin-bottom: 0;
}

@media(max-width:520px){
    .reach-auth-product {
        margin-bottom: 22px;
    }

    .reach-auth-hub-badge {
        min-height: 50px;
        padding-right: 12px;
    }

    .reach-auth-hub-copy small {
        display: none;
    }
}

/* Zandoli Reach Hub logo */
.reach-auth-product,
.reach-auth-hub-badge { display: none !important; }
.reach-auth-brand {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 30px;
    letter-spacing: 0;
}
.reach-auth-hub-logo {
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    object-fit: contain;
    filter: drop-shadow(0 8px 16px rgba(0,0,0,.22));
}
.reach-auth-brand-copy {
    display: flex;
    align-items: baseline;
    gap: 8px;
    letter-spacing: .1em;
}
.reach-auth-brand-copy > span { font-size: 15px; font-weight: 760; }
.reach-auth-brand-copy > strong { font-size: 13px; color: var(--auth-accent); font-weight: 600; }
@media(max-width:520px) {
    .reach-auth-hub-logo { width: 52px; height: 52px; flex-basis: 52px; }
}

.reach-password-policy{display:flex;flex-wrap:wrap;gap:6px 10px;color:var(--auth-faint);font-size:10px;line-height:1.35;margin-top:-2px}
.reach-password-policy span{display:inline-flex;align-items:center;gap:5px}.reach-password-policy span::before{content:"○";font-size:9px}.reach-password-policy span.valid{color:#55b983}.reach-password-policy span.valid::before{content:"✓";font-weight:700}
.reach-auth-primary-link{display:grid;place-items:center;height:44px;border-radius:11px;background:var(--auth-accent);color:#fff;text-decoration:none;font-size:12.5px;font-weight:650;box-shadow:0 7px 20px color-mix(in srgb,var(--auth-accent) 28%,transparent)}
.reach-auth-primary-link:hover{background:var(--auth-accent2)}
.reach-auth-form-link,.reach-auth-secondary-link{color:var(--auth-accent);font-size:11px;text-decoration:none}.reach-auth-form-link{justify-self:end;margin-top:-5px}.reach-auth-form-link:hover,.reach-auth-secondary-link:hover{text-decoration:underline}.reach-auth-secondary-link{display:inline-block;margin-top:18px}.reach-auth-success{margin-bottom:16px;padding:10px 12px;border:1px solid rgba(85,185,131,.28);border-radius:9px;background:rgba(85,185,131,.08);color:#55b983;font-size:12px;line-height:1.45}

.reach-auth-card--setup{width:min(470px,100%)}
@media(max-width:520px){.reach-auth-card--setup{width:100%}}
