/* Account screen owns its full-screen shell and forms; former stacked styles are removed. */
.account-page { min-height:100svh; background:#10131a; }
.account-header { position:absolute; z-index:4; top:0; left:0; right:0; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:calc(27px + env(safe-area-inset-top)) 42px 20px; pointer-events:none; }
.account-brand { display:inline-flex; align-items:center; gap:10px; color:#fff5ed; text-decoration:none; font-size:23px; font-weight:730; letter-spacing:-.05em; text-shadow:0 2px 16px #0008; pointer-events:auto; }
.account-brand-mark { display:grid; place-items:center; width:35px; height:35px; border-radius:11px; background:var(--ui-accent); color:#242126; font:700 25px Georgia,serif; }
.account-header nav { pointer-events:auto; }
.account-header nav a { display:inline-flex; align-items:center; min-height:44px; padding:5px 0; color:#f6ede6b8; font-size:11px; text-decoration:none; text-shadow:0 1px 12px #0008; }
.account-layout { position:relative; z-index:1; display:flex; align-items:center; justify-content:flex-end; min-height:100svh; padding:110px max(5vw,32px); pointer-events:none; }
.account-main { position:relative; z-index:3; width:360px; min-width:0; pointer-events:auto; }
.account-entry-panel { max-height:calc(100svh - 280px); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; padding:25px; border:1px solid #ffffff26; border-radius:22px; background:linear-gradient(145deg,#171b2499,#171b2461); box-shadow:0 20px 70px #0004,inset 0 1px 0 #ffffff0a; backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.account-main h1 { margin:0 0 14px; color:#f7eee7; font-size:18px; font-weight:600; line-height:1.4; letter-spacing:-.045em; }
.account-status { min-height:28px; margin:0 0 14px; color:#f1ddd1b8; font-size:10px; line-height:1.65; overflow-wrap:anywhere; }
.account-status[data-error="true"] { color:#ffd0c8; }
.account-tabs { display:flex; align-items:center; justify-content:center; gap:19px; margin-top:7px; }
.account-tabs button { min-height:44px; padding:6px 2px; border:0; border-radius:0; color:#f2e9e1b8; background:transparent; font-size:12px; text-shadow:0 1px 12px #000a; }
.account-tabs button[aria-current="page"] { color:#f9e5d9; font-weight:700; text-decoration:underline; text-underline-offset:6px; text-decoration-color:#e4bfb290; }
.account-card,.account-card form { display:grid; gap:13px; min-width:0; }
.account-card h2 { margin:0; font-size:16px; line-height:1.5; }
.account-card label { display:grid; gap:6px; color:#f2e8e1d9; font-size:11px; line-height:1.5; }
.account-card input:not([type=checkbox]) { height:46px; padding:0 13px; border:1px solid #ffffff1f; border-radius:10px; background:#10141d96; color:#fff5ec; font-size:16px; }
.account-card input::placeholder { color:#d6d2d09c; font-size:11px; }
.account-card small,.account-help { color:#e3d5cdb3; font-size:10px; line-height:1.6; word-break:keep-all; }
.account-card .account-check { display:flex; gap:8px; align-items:flex-start; color:#e3d5cdbd; font-size:10px; }
.account-check input { flex:0 0 18px; width:18px; height:18px; margin:0; accent-color:var(--ui-accent); }
.account-card button,.account-card .button-link { min-height:40px; padding:8px 12px; font-size:11px; }
.account-card .primary { display:inline-flex; align-items:center; justify-content:center; justify-self:end; gap:16px; min-height:40px; padding:8px 15px; border-radius:30px; background:#e4bfb2; color:#292027; font-size:11px; font-weight:650; }
.account-login-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.account-card .account-signup { display:inline-flex; align-items:center; min-height:44px; padding:6px 2px; border:0; border-radius:0; background:transparent; color:#f9d9c7; font-size:12px; font-weight:650; text-decoration:underline; text-underline-offset:4px; text-decoration-color:#e4bfb280; }
.account-card p { margin:0; font-size:11px; line-height:1.7; }
.account-card .account-help { font-size:10px; }
.account-recovery { display:block; padding:14px; border-radius:12px; background:#10141dd9; color:#f8d4c0; font:16px/1.8 monospace; overflow-wrap:anywhere; user-select:all; }
.account-actions { display:flex; flex-wrap:wrap; gap:8px; }
.account-entry .primary { justify-self:stretch; min-height:44px; }
.account-google-button { width:100%; min-width:0; }
.account-card .account-text-action { border:0; background:transparent; color:#f9d9c7; padding-inline:0; text-align:left; }
#googleConnection { padding-top:16px; border-top:1px solid #ffffff1c; }
.account-footnote { margin:16px 0 0; color:#f1ddd196; font-size:9px; line-height:1.6; }
#passwordForm,#recoveryCodeForm { padding-top:20px; border-top:1px solid #ffffff1c; }
#bootstrapLink { font-size:11px; line-height:1.6; }
.account-loading { display:grid; gap:14px; padding:8px 0 16px; }
.account-loading span { display:block; height:46px; border:1px solid #ffffff12; border-radius:10px; background:#10141d80; }
.account-page[data-account-mode="loading"] .account-entry-panel { min-height:360px; }
.account-page[data-account-mode="profile"] .account-main { width:420px; }
.account-page:is([data-account-mode="profile"],[data-account-mode="recovery-code"],[data-account-mode="guest-credentials"]) :is(.showcase-copy,.showcase-label,.showcase-controls,.showcase-state,.account-footnote) { display:none; }
.account-page[data-account-mode="recovery-code"] #accountTitle { display:none; }
.account-menu-link { display:flex; align-items:center; min-height:44px; padding:8px 12px; color:inherit; text-decoration:none; }
@media(max-width:860px) {
  .account-header { padding:calc(23px + env(safe-area-inset-top)) 24px 15px; }
  .account-brand { font-size:21px; }
  .account-brand-mark { width:31px; height:31px; border-radius:10px; font-size:23px; }
  .account-layout { align-items:flex-end; justify-content:center; padding:calc(100px + env(safe-area-inset-top)) 22px calc(83px + env(safe-area-inset-bottom)); }
  .account-main { width:min(100%,360px); }
  .account-page[data-account-mode="profile"] .account-main { width:min(100%,420px); }
  .account-entry-panel { max-height:calc(100svh - 235px); padding:21px; border-radius:21px; background:linear-gradient(145deg,#171b248c,#171b2461); }
  .account-main h1 { font-size:17px; }
  .account-tabs { gap:17px; margin-top:5px; }
}
@media(max-width:350px) { .account-header { padding-inline:18px; } .account-layout { padding-inline:16px; } .account-entry-panel { padding:18px; } .account-main h1 { font-size:16px; } }
@media(max-height:560px) { .account-layout { padding-top:82px; padding-bottom:65px; } .account-entry-panel { max-height:calc(100svh - 200px); } .account-page[data-account-mode="loading"] .account-entry-panel { min-height:0; } }