/* Full-bleed artwork with image-specific glass, independent of storefront styling. */
.auth-page { --auth-tint: 23,54,89; --auth-accent:#b8e2f4; min-height:100svh; margin:0; padding:0; color:#fff; background:rgb(var(--auth-tint)); font-size:1rem; }
.auth-background,.auth-shade { position:fixed; inset:0; width:100%; height:100%; }
.auth-background { object-fit:cover; object-position:center; z-index:-3; }
.auth-shade { z-index:-2; background:linear-gradient(180deg,rgba(5,13,20,.24),rgba(5,13,20,.08) 40%,rgba(5,13,20,.64)),linear-gradient(90deg,rgba(var(--auth-tint),.2),transparent); }
.auth-page::before { display:none; }
.auth-page { isolation:isolate; position:relative; }
.auth-topbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:22px clamp(16px,4vw,64px); }
.auth-brand { display:flex; align-items:center; gap:10px; color:#fff; min-width:0; font-weight:800; text-shadow:0 2px 12px #111; }
.auth-brand img { width:48px; height:48px; border-radius:50%; box-shadow:0 3px 16px #0003; }
.auth-brand span { max-width:190px; font-size:.9rem; }
.auth-topbar .language-switch { background:rgba(var(--auth-tint),.6); border:1px solid #ffffff60; color:#fff; backdrop-filter:blur(20px); }
.auth-topbar .language-switch .is-selected { color:#172329; background:var(--auth-accent); }
.auth-main { display:grid; place-items:center; padding:20px 16px 32px; min-height:calc(100svh - 168px); }
.auth-glass { width:min(100%,460px); padding:clamp(25px,6vw,40px); border-radius:36px; border:1px solid rgba(255,255,255,.55); background:linear-gradient(140deg,rgba(255,255,255,.09),rgba(255,255,255,.025)),rgba(var(--auth-tint),.80); backdrop-filter:blur(22px) saturate(135%); -webkit-backdrop-filter:blur(22px) saturate(135%); box-shadow:inset 0 1px 0 #ffffff50,0 28px 80px #0004; }
.auth-kicker { display:flex; align-items:center; gap:8px; color:var(--auth-accent); font-size:.875rem; font-weight:700; }
.auth-kicker .icon { width:21px; height:21px; }
.auth-heading h1 { margin:13px 0 8px; font-size:clamp(1.9rem,7vw,2.55rem); line-height:1.2; letter-spacing:-.035em; color:#fff; overflow-wrap:anywhere; }
.auth-heading p { margin:0 0 23px; color:#f4f7fa; font-size:1rem; line-height:1.6; }
.auth-form { display:grid; gap:16px; }
.auth-field { display:grid; gap:7px; min-width:0; }
.auth-field > span:first-child { font-size:.875rem; color:#fff; font-weight:700; }
.auth-field input { width:100%; min-width:0; min-height:52px; padding:13px 19px; border:1px solid #ffffff80; border-radius:999px; background:rgba(var(--auth-tint),.34); color:#fff; font:inherit; outline:none; box-shadow:inset 0 1px 5px #0001; }
.auth-field input:focus { border-color:var(--auth-accent); box-shadow:0 0 0 3px rgba(255,255,255,.2); background:rgba(var(--auth-tint),.6); }
.auth-field input:-webkit-autofill { -webkit-text-fill-color:#fff; box-shadow:0 0 0 1000px rgb(var(--auth-tint)) inset; }
.auth-password { display:block; position:relative; }
.auth-password input { padding-right:58px; }
.auth-password button { display:grid; place-items:center; position:absolute; right:5px; top:4px; width:44px; height:44px; padding:0; border:0; border-radius:50%; background:transparent; color:#fff; cursor:pointer; }
.auth-password .icon { width:20px; height:20px; }
.auth-submit { min-height:52px; margin-top:3px; padding:13px 22px; border:0; border-radius:999px; background:var(--auth-accent); color:#152c35; font:inherit; font-weight:900; cursor:pointer; box-shadow:0 8px 28px rgba(0,0,0,.14); }
.auth-submit:hover { filter:brightness(1.08); }
.auth-divider { display:flex; align-items:center; gap:12px; margin:20px 0; font-size:.875rem; color:#fff; }
.auth-divider::before,.auth-divider::after { content:""; flex:1; height:1px; background:#ffffff4a; }
.auth-google { display:flex; align-items:center; justify-content:center; gap:12px; min-height:52px; padding:11px 14px; color:#fff; background:rgba(var(--auth-tint),.3); border:1px solid #ffffff90; border-radius:999px; font-size:.9375rem; font-weight:700; }
.auth-google:hover { background:rgba(255,255,255,.15); }
.auth-google-g { display:grid; place-items:center; flex-shrink:0; width:26px; height:26px; border-radius:50%; color:#4285f4; background:#fff; font:bold 19px Arial,sans-serif; }
.auth-switch { margin:20px 0 0; text-align:center; color:#fff; font-size:.9375rem; line-height:1.7; }
.auth-switch a { color:var(--auth-accent); font-weight:900; text-decoration:underline; text-underline-offset:4px; }
.auth-note,.auth-form small { color:#edf4f7; line-height:1.6; font-size:.875rem; }
.auth-note { margin:15px 0 0; text-align:center; }
.auth-message { padding:12px 15px; margin-bottom:18px; border:1px solid #fff8; border-radius:16px; background:rgba(7,25,30,.72); color:#fff; font-size:.9375rem; }
.auth-message--error { background:rgba(86,18,35,.88); }
.auth-footer { display:flex; justify-content:center; flex-wrap:wrap; gap:16px; padding:10px 18px 24px; color:#fff; font-size:.875rem; text-shadow:0 1px 8px #000; }
.auth-footer a { text-decoration:underline; text-underline-offset:4px; }
.auth-page a:focus-visible,.auth-page button:focus-visible { outline:3px solid var(--auth-accent); outline-offset:4px; }
@media(min-width:900px) { .auth-background { object-position:center 47%; } .auth-main { padding-block:32px 44px; } .auth-glass { margin-left:32%; } }
@media(max-width:380px) { .auth-brand span { max-width:120px; font-size:.8rem; } .auth-topbar { padding:16px; } .auth-glass { border-radius:28px; padding:24px 20px; } }
@supports not (backdrop-filter:blur(2px)) { .auth-glass { background:rgba(var(--auth-tint),.94); } }
html[lang="bn"] .auth-heading h1 { line-height:1.45; letter-spacing:0; }