:root{--ease-out:cubic-bezier(.22,1,.36,1);color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#fff;background:#2d1649;--gate-text:#fff;--gate-muted:#eadff4;--gate-soft:#d9c6ea;--gate-line:rgba(255,255,255,.2);--gate-focus:#e1c5ff;--gate-field:#341f46;--gate-field-line:#a993bd;--gate-on:#3a1856;--gate-fill:rgba(255,141,204,.3)}
*{box-sizing:border-box}[hidden]{display:none!important}
html{scrollbar-color:#9272ac #2d1649;scroll-padding-block:24px}
body{margin:0;min-width:280px;min-height:100svh;background:#2d1649;-webkit-font-smoothing:antialiased}
body:before{content:'';position:fixed;inset:0;pointer-events:none;background:none;filter:blur(44px);opacity:.8}
::selection{background:#ceb0e9;color:#28123e}
:focus-visible{outline:3px solid var(--gate-focus);outline-offset:4px}
/* Same language as the app: 28 px card, 14 px fields, pill actions, one duotone emblem. Neutral by contract: no name, logo or private font. */
.gate{position:relative;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left))}
.gate-card{width:min(100%,420px);padding:32px 28px 28px;border-radius:28px;border:1px solid var(--gate-line);background:rgba(255,255,255,.1);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);box-shadow:0 2px 6px rgba(10,3,20,.18),0 28px 70px -34px rgba(10,3,20,.7)}
.gate-heading{display:grid;justify-items:center;gap:10px;margin-bottom:26px;text-align:center}
.gate-emblem{display:grid;place-items:center;width:56px;height:56px;margin-bottom:4px;border-radius:20px;background:rgba(239,233,252,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.gate-emblem svg{width:28px;height:28px;fill:none;stroke:#f6edfc;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.gate-emblem .gate-emblem-fill{fill:var(--gate-fill)}
h1{margin:0;font-size:1.875rem;line-height:1.15;font-weight:700;letter-spacing:-.02em;text-wrap:balance}
.gate-intro{max-width:30ch;margin:0;font-size:1rem;line-height:1.45;color:var(--gate-muted);text-wrap:pretty}
.password-access{text-align:left}
#password-form{display:grid;gap:16px}
.form-field{display:grid;gap:7px}
#password-form label{font-size:.875rem;font-weight:600;line-height:1.35;color:var(--gate-text)}
#password-form input{display:block;width:100%;min-width:0;min-height:52px;padding:13px 16px;border:1px solid var(--gate-field-line);border-radius:16px;font:inherit;font-size:1rem;line-height:1.4;background:var(--gate-field);color:#fff;caret-color:#f6c4e3;transition:border-color 200ms var(--ease-out),background-color 200ms var(--ease-out);scroll-margin-block:24px}
@media (hover: hover) and (pointer: fine) { #password-form input:hover {border-color:#dcc7ee} }
#password-form input:focus{border-color:var(--gate-focus);outline:2px solid var(--gate-focus);outline-offset:2px;background:#2d1a3b}
#password-form input[aria-invalid=true]{border-color:#ffb6c7}
#password-form input:-webkit-autofill{-webkit-text-fill-color:#fff;caret-color:#fff;box-shadow:0 0 0 1000px var(--gate-field) inset}
.password-field{position:relative}.password-field input{padding-right:92px!important}
#password-reveal{position:absolute;right:4px;top:4px;min-height:44px;min-width:78px;padding:8px 12px;border:0;border-radius:12px;background:transparent;color:#f2e8fa;font:inherit;font-size:.875rem;font-weight:600;cursor:pointer}
@media (hover: hover) and (pointer: fine) { #password-reveal:hover {background:rgba(255,255,255,.08)} }
.password-submit{width:100%;min-height:52px;margin-top:6px;padding:13px 20px;border:0;border-radius:999px;background:#fff;color:var(--gate-on);font:inherit;font-size:1rem;font-weight:700;cursor:pointer;transition:background-color 200ms var(--ease-out),transform 200ms var(--ease-out)}
@media (hover: hover) and (pointer: fine) { .password-submit:hover:not(:disabled) {background:#f6eefc} }
.password-submit:active:not(:disabled){transform:scale(.96)}
.password-submit:disabled{opacity:.75;cursor:wait}
.login-divider{display:flex;align-items:center;gap:12px;margin:22px 0 16px;color:var(--gate-soft);font-size:.875rem;line-height:1.4}
.login-divider:before,.login-divider:after{content:'';flex:1;height:1px;background:var(--gate-line)}
.google-button{display:flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:12px 20px;border:1px solid #c2aacd;border-radius:999px;background:rgba(29,12,45,.24);color:#fff;text-decoration:none;font-size:1rem;font-weight:600;transition:background-color 200ms var(--ease-out),transform 200ms var(--ease-out)}
.google-button svg{width:20px;height:20px;flex:none}@media (hover: hover) and (pointer: fine) { .google-button:hover {background:rgba(255,255,255,.1)} }.google-button:active:not(:disabled){transform:scale(.96)}
.google-button[aria-disabled=true]{opacity:.7;pointer-events:none}
#google-credential-button{display:flex;justify-content:center;min-height:44px;overflow:hidden;border-radius:6px}
.password-help{margin:18px 0 0;color:var(--gate-muted);font-size:.875rem;line-height:1.5;text-align:center;text-wrap:pretty}
.login-status{margin:16px 0 0;color:#f2e8fa;font-size:.875rem;line-height:1.55;text-align:center}.login-status:empty{margin:0}
.login-status.is-error{color:#ffcad6}
.restart{display:block;margin:12px auto 0;min-height:48px;border:0;border-radius:999px;padding:10px 20px;color:#fff;background:rgba(255,255,255,.14);font:inherit;font-size:.875rem;line-height:1.4;font-weight:600;cursor:pointer}
.gate-privacy{width:min(100%,420px);color:var(--gate-muted);font-size:.875rem;line-height:1.55;text-align:left}
.gate-privacy summary{min-height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--gate-soft);text-decoration:underline;text-underline-offset:4px}
.gate-privacy summary:focus-visible{outline:2px solid #fff;outline-offset:4px;border-radius:8px}
.gate-privacy p{margin:10px 0}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.gate-card{background:#43235e}}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){.gate-card{background:#43235e;backdrop-filter:none;-webkit-backdrop-filter:none}.google-button{background:#352044}}
@media(max-width:440px){.gate{padding-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right));gap:14px}.gate-card{padding:28px 20px 22px;border-radius:24px}h1{font-size:1.5rem}.gate-heading{margin-bottom:22px}.gate-intro{font-size:.875rem}}
@media(max-width:350px){.gate{padding-inline:max(12px,env(safe-area-inset-left)) max(12px,env(safe-area-inset-right))}.gate-card{padding-inline:16px}h1{font-size:1.5rem}.gate-emblem{width:48px;height:48px;border-radius:16px}.login-divider{font-size:.75rem;gap:8px}.google-button{font-size:.875rem}}
@media(max-height:700px){.gate{gap:12px;padding-block:16px}.gate-card{padding-block:22px}.gate-heading{margin-bottom:18px;gap:8px}.gate-emblem{width:48px;height:48px}#password-form{gap:12px}.login-divider{margin-block:16px 12px}.password-help{margin-top:12px}}
@media(prefers-reduced-motion:no-preference){.gate-card{animation:gate-enter 360ms cubic-bezier(.22,1,.36,1) both}@keyframes gate-enter{from{transform:translateY(8px)}to{transform:none}}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){body:before{display:none}.gate-card,.google-button,.password-submit,#password-form input,.gate-emblem{border:1px solid ButtonText}.gate-emblem svg{stroke:CanvasText}.gate-emblem .gate-emblem-fill{fill:Canvas}}
/* Safari: 16 px avoids zoom; the page may scroll when the keyboard or larger text needs room. */
button{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}

:where(h1,h2,h3,legend){text-wrap-style:balance}:where(p,li,small,label){text-wrap-style:pretty}
.gate-home{display:flex;align-items:center;justify-content:center;text-decoration:none;box-sizing:border-box}

/* Error documents use the same private entry surface. */
.gate-error-code { margin: 12px 0 4px; font-size: clamp(2.5rem, 12vw, 4rem); font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1; opacity: .8; }
.gate-home { display: flex; align-items: center; justify-content: center; min-height: 48px; text-decoration: none; }
