.account-main { width: min(1120px, calc(100% - 48px)); min-height: calc(100dvh - 190px); margin: 0 auto; padding: 44px 0 72px; }
.account-main:focus, .policy-main:focus { outline: none; }
.account-view { display: grid; grid-template-columns: 1fr minmax(340px, 470px); gap: clamp(48px, 8vw, 110px); align-items: center; }
.account-intro h1, .dashboard-heading h1 { max-width: 11ch; margin-top: 12px; font-size: clamp(44px, 6vw, 72px); }
.account-intro > p, .dashboard-heading p { max-width: 48ch; margin-top: 20px; color: var(--muted); font-size: 17px; line-height: 1.65; }
.account-kicker { color: var(--blue); font: 700 12px/1.2 "Courier New", monospace; letter-spacing: .14em; }
.account-form { display: grid; gap: 9px; padding: clamp(24px, 4vw, 40px); background: #fff; border-radius: 22px 18px 24px 19px; box-shadow: 8px 9px 0 #dfe6ef; }
.account-form h2 { margin-bottom: 14px; font-size: 30px; }
.account-form label:not(.show-password, .terms-check) { margin-top: 7px; font-weight: 600; font-size: 14px; }
.account-form input:not([type="checkbox"]) { width: 100%; min-height: 48px; padding: 11px 13px; color: var(--ink); background: var(--paper); border: 2px solid #d9e1ea; border-radius: 9px; font-size: 16px; }
.account-form input:not([type="checkbox"]):focus { border-color: var(--blue); outline: 3px solid #2559ce28; }
.account-form small { color: var(--muted); font-size: 12px; }
.show-password, .terms-check { display: flex; align-items: start; gap: 9px; min-height: 44px; padding-top: 9px; font-size: 13px; line-height: 1.5; }
.show-password input, .terms-check input { width: 18px; height: 18px; margin-top: 1px; accent-color: var(--blue); }
.account-form .primary-button { width: 100%; margin-top: 6px; }
.account-form > p { margin-top: 8px; color: var(--muted); font-size: 14px; text-align: center; }
.google-auth-button { display:flex;align-items:center;justify-content:center;gap:12px;min-height:50px;padding:10px 16px;border:2px solid #cbd5e3;border-radius:12px;background:#fff;color:var(--ink);font-weight:700;text-decoration:none; }
.google-auth-button:hover { border-color:#203653;background:#f8faff; }
.google-auth-button svg { width:22px;height:22px;flex:0 0 auto; }
.auth-divider { display:flex;align-items:center;gap:12px;margin:8px 0 2px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em; }
.auth-divider::before,.auth-divider::after { content:"";height:1px;flex:1;background:#d9e1ea; }
.forgot-link { justify-self:end;min-height:44px;display:inline-flex;align-items:center;font-size:14px;font-weight:600; }
.otp-fields { display:grid;gap:9px;margin-top:8px;padding-top:12px;border-top:1px solid #e0e6ef; }
.otp-fields[hidden] { display:none; }
.admin-field-group { display:grid;gap:8px; }
.admin-field-group[hidden] { display:none; }
.admin-reset-button { width:100%;margin-top:14px; }
.form-error { min-height: 0; color: #8f2929; font-size: 13px; }
.form-error:not(:empty) { padding: 11px 13px; background: #f7dddd; border-radius: 8px; }
.order-check-button { display: block; min-height: 44px; margin-top: 10px; padding: 8px 14px; color: #fff; background: var(--blue); border-radius: 8px; font-weight: 600; }
.order-check-button:disabled { opacity: .5; cursor: wait; }
.nav-link-button { min-height: 44px; padding: 0; background: transparent; color: var(--ink); font-size: 14px; font-weight: 500; }
.nav-link-button:hover { color: var(--blue); }
.admin-status { min-height: 1.5em; color: #275f43; font-size: 14px; }
.admin-toolbar { display: flex; align-items: end; flex-wrap: wrap; gap: 10px 16px; }
.admin-toolbar label { align-self: center; color: var(--muted); font-size: 13px; font-weight: 600; }
.admin-toolbar input, .admin-toolbar select { min-height: 46px; padding: 9px 12px; color: var(--ink); background: #fff; border: 2px solid #d9e1ea; border-radius: 9px; font-size: 15px; }
.admin-toolbar input { flex: 1 1 260px; }
.admin-toolbar select { min-width: 140px; }
.admin-count { margin-top: -16px; color: var(--muted); font-size: 13px; }
.admin-users { overflow: hidden; background: #fff; border-radius: 18px; }
.admin-user-row { display: grid; grid-template-columns: minmax(180px, 1fr) 130px 90px auto; gap: 20px; align-items: center; padding: 18px 22px; border-bottom: 1px solid #e2e8ef; }
.admin-user-row:last-child { border-bottom: 0; }
.admin-user-identity { min-width: 0; }
.admin-user-identity strong, .admin-user-identity span, .admin-user-identity small { display: block; overflow-wrap: anywhere; }
.admin-user-identity strong { font-size: 16px; }
.admin-user-identity span, .admin-user-identity small { color: var(--muted); font-size: 13px; }
.admin-user-quota strong, .admin-user-quota span { display: block; }
.admin-user-quota strong { font: 700 23px/1 "Courier New", monospace; font-variant-numeric: tabular-nums; }
.admin-user-quota span { margin-top: 5px; color: var(--muted); font-size: 11px; }
.admin-user-status { font-size: 13px; font-weight: 600; }
.admin-user-status.is-deleted { color: #8f2929; }
.admin-user-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.admin-action { min-height: 44px; padding: 8px 10px; color: var(--blue); background: #edf2fb; border-radius: 8px; font-size: 13px; font-weight: 600; }
.admin-action:hover { background: #dfe8f8; }
.admin-action--danger { color: #8f2929; background: #fbe9e9; }
.admin-action--danger:hover { background: #f8dddd; }
.admin-dialog { width: min(560px, calc(100% - 32px)); max-height: min(90dvh, 800px); padding: 24px; }
.admin-dialog::backdrop { background: #203653a8; }
.admin-dialog-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.admin-dialog-heading h2 { font-size: 27px; }
.admin-dialog-heading button { width: 44px; height: 44px; flex: 0 0 auto; background: #eef2f7; border-radius: 8px; font-size: 25px; }
.admin-dialog-fields { display: grid; gap: 8px; margin-top: 16px; }
.admin-dialog-fields label { margin-top: 8px; font-size: 14px; font-weight: 600; }
.admin-dialog-fields input { width: 100%; min-height: 46px; padding: 9px 12px; color: var(--ink); background: #fff; border: 2px solid #d9e1ea; border-radius: 9px; font-size: 16px; }
.admin-dialog-fields small { color: var(--muted); font-size: 12px; }
.admin-dialog-fields #admin-starting-credits-wrap { display: grid; gap: 8px; }
.admin-dialog-fields #admin-starting-credits-wrap[hidden] { display: none; }
.admin-dialog-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.admin-dialog-actions .primary-button { min-width: 130px; }
.danger-button { min-height: 44px; padding: 10px 18px; color: #fff; background: #a82e2e; border-radius: 9px; font-weight: 600; }
.danger-button:hover { background: #842222; }
#admin-delete-dialog > p, #admin-credits-current { margin-top: 12px; color: var(--muted); line-height: 1.6; }
.account-dashboard { display: grid; gap: 32px; }
.dashboard-heading { display: flex; align-items: end; justify-content: space-between; gap: 32px; }
.dashboard-heading h1 { max-width: none; }
.credit-balance { min-width: 210px; padding: 22px; background: var(--yellow); border-radius: 18px 14px 20px 15px; transform: rotate(1deg); }
.credit-balance strong, .credit-balance span { display: block; }
.credit-balance strong { font: 800 52px/1 "Courier New", monospace; }
.credit-balance span { margin-top: 5px; font-size: 13px; }
.credit-packs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.credit-pack { display: flex; flex-direction: column; min-height: 245px; padding: 26px; background: #fff; border-radius: 20px 16px 22px 17px; box-shadow: 6px 7px 0 #dfe6ef; }
.credit-pack h2 { font-size: 24px; }
.credit-pack p { margin-top: 8px; color: var(--muted); }
.credit-pack strong { margin-top: auto; padding-top: 24px; font: 700 30px/1 "Courier New", monospace; }
.credit-pack button { margin-top: 18px; }
.credit-pack button:disabled { opacity: .5; }
.checkout-notice { grid-column: 1 / -1; padding: 26px; background: #fff4cf; border-radius: 18px; color: #5e4a13; }
.credit-rules { max-width: 760px; padding-top: 12px; }
.credit-rules p { margin-top: 10px; color: var(--muted); line-height: 1.65; }
.credit-history { max-width: 760px; }
.credit-history h2 { margin-bottom: 14px; font-size: 24px; }
.credit-history-list { overflow: hidden; background: #fff; border-radius: 18px; }
.credit-history-row { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 16px 20px; border-bottom: 1px solid #e2e8ef; }
.credit-history-row:last-child { border-bottom: 0; }
.credit-history-row strong, .credit-history-row time { display: block; }
.credit-history-row time { margin-top: 3px; color: var(--muted); font-size: 13px; }
.credit-history-amount { flex: none; font: 700 15px/1.3 "Courier New", monospace; font-variant-numeric: tabular-nums; }
.admin-table-wrap { overflow-x: auto; background: #fff; border-radius: 18px; }
.admin-table { width: 100%; border-collapse: collapse; }
.admin-table th, .admin-table td { padding: 15px 18px; border-bottom: 1px solid #e2e8ef; text-align: left; vertical-align: middle; }
.admin-table th { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.admin-table td small { display: block; color: var(--muted); }
.credit-adjust { display: flex; gap: 8px; }
.credit-adjust input { width: 88px; min-height: 44px; padding: 8px; border: 2px solid #d9e1ea; border-radius: 8px; }
.credit-adjust button { min-height: 44px; padding: 8px 14px; color: #fff; background: var(--blue); border-radius: 8px; }
.account-footer { width: min(1120px, calc(100% - 48px)); display: flex; flex-wrap: wrap; gap: 18px; margin: 0 auto; padding: 24px 0 36px; border-top: 1px solid #dce3eb; }
.account-footer a { color: var(--muted); font-size: 13px; }
.policy-main { width: min(820px, calc(100% - 48px)); min-height: calc(100dvh - 190px); margin: 0 auto; padding: 44px 0 72px; }
.policy-content h1 { margin-top: 12px; font-size: clamp(44px, 7vw, 72px); }
.policy-intro { max-width: 62ch; margin-top: 20px; color: var(--muted); font-size: 18px; line-height: 1.65; }
.policy-date { margin-top: 8px; color: var(--muted); font-size: 13px; }
.policy-content section { margin-top: 42px; }
.policy-content section h2 { font-size: 24px; }
.policy-content section p { margin-top: 10px; color: #3f5066; line-height: 1.75; white-space: pre-line; }
.auth-popup-page .topbar, .auth-popup-page .account-footer, .auth-popup-page .skip-link, .auth-popup-page .account-intro { display: none; }
.auth-popup-page body { background: #fff; }
.auth-popup-page .account-main { width: 100%; min-height: 0; padding: 0; }
.auth-popup-page:not(.auth-ready) .account-main { visibility: hidden; }
.auth-popup-page .account-view { display: block; }
.auth-popup-page .account-form { box-shadow: none; border-radius: 0; padding: 32px; }
.auth-popup-page .account-form h2 { padding-right: 40px; }
.logout-dialog { width: min(420px, calc(100% - 32px)); padding: 28px; }
.logout-dialog p { margin-top: 12px; color: var(--muted); }
.logout-dialog-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 24px; }
@media (max-width: 800px) {
  .account-view { grid-template-columns: 1fr; gap: 32px; }
  .account-intro h1 { max-width: 12ch; }
  .credit-packs { grid-template-columns: 1fr; }
  .dashboard-heading { align-items: start; flex-direction: column; }
  .credit-balance { width: 100%; }
  .admin-user-row { grid-template-columns: minmax(0, 1fr) auto; gap: 12px; }
  .admin-user-status { justify-self: end; }
  .admin-user-actions { grid-column: 1 / -1; justify-content: flex-start; }
}
@media (max-width: 540px) {
  .account-main, .account-footer, .policy-main { width: calc(100% - 32px); }
  .account-main { padding-top: 24px; }
  .account-topbar .site-nav a { display: none; }
  .account-topbar .site-nav a[href="/dashboard"] { display: inline-flex; }
  .account-form { padding: 22px 18px; }
  .credit-history-row { padding: 14px 16px; }
  .admin-user-row { padding: 16px; }
  .admin-dialog { padding: 20px 16px; }
}
