/* Staging-only UI: deliberately restricted to xPense overlay and device tools.
   Do not introduce unscoped body, main, button or heading rules here;
   dashboard.css owns the responsive dashboard layout. */
#xpense-auth-gate{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;background:#0f1522;color:white;padding:20px}.xpense-gate-card{width:min(460px,100%);border:1px solid #53467e;border-radius:24px;padding:32px;background:#1b2036;box-shadow:0 20px 60px #0008}.xpense-gate-card h1{font-size:1.8rem}.xpense-gate-card p{line-height:1.6}.xpense-gate-button{display:inline-block;padding:13px 20px;background:#8061f3;border:0;border-radius:12px;color:white;text-decoration:none;cursor:pointer}
/* Account actions are inline on Settings, not fixed over transactions. */
#xpense-device-tools { margin-top: 20px; color: var(--text); }
#xpense-device-tools[hidden], #xpense-pending-banner[hidden] { display: none !important; }
#xpense-device-tools h2 { margin: 0 0 8px; font-size: calc(19px * var(--xp-text-scale, 1)); }
#xpense-device-tools .xp-settings-note { line-height: 1.6; }
.xpense-sync-row { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; margin:18px 0 10px; }
#xpense-sync-status { color:var(--muted); font-size:calc(12px * var(--xp-text-scale, 1)); }
#xpense-pending-items { border:1px solid var(--border); border-radius:12px; background:var(--panel2); padding:10px 14px; font-size:calc(12px * var(--xp-text-scale, 1)); color:var(--muted); }
#xpense-pending-items > div { padding:8px 0; border-bottom:1px solid var(--border); }
#xpense-pending-items > div:last-child { border-bottom:0; }
.xpense-account-actions { display:flex; flex-wrap:wrap; gap:10px; margin:18px 0 12px; }
.xpense-account-actions button, #xpense-pending-banner button {
  border:1px solid var(--border); border-radius:10px; background:var(--panel2); color:var(--text);
  min-height:40px; padding:9px 13px; font:inherit; cursor:pointer;
}
.xpense-account-actions button:hover { border-color:var(--purple); }
.xpense-account-actions button:focus-visible, #xpense-pending-banner button:focus-visible { outline:2px solid var(--purple); outline-offset:2px; }
.xpense-account-actions .xpense-danger-action { color:var(--red); border-color:currentColor; }
#xpense-pending-banner { position:fixed; z-index:890; bottom:20px; right:20px; max-width:calc(100vw - 40px); display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding:10px 14px; background:var(--panel); color:var(--text); border:1px solid var(--purple); border-radius:14px; box-shadow:0 10px 28px #0006; font-size:13px; }
#xpense-pending-banner button { background:#7546d8; color:#fff; border-color:#9973e1; }
@media(max-width:720px) {
  #xpense-pending-banner { bottom:94px; right:12px; left:12px; justify-content:space-between; }
  .xpense-account-actions { flex-direction:column; }
  .xpense-account-actions button { width:100%; text-align:center; }
}

/* Hide financial interface until the server confirms the Google session. */
body.xp-auth-pending .shell, body.xp-auth-pending .xp-add, body.xp-auth-pending .mobile-nav, body.xp-auth-pending #xpEditor { visibility: hidden !important; }
#xpense-boot-screen { position:fixed; inset:0; z-index:9000; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:12px; background:#0f1522; color:#f4f0ff; font:15px system-ui; }
#xpense-boot-screen strong{font-size:30px;letter-spacing:-1px;}
#xpense-boot-screen span{color:#bfc1d6;}
#xpense-auth-gate { z-index:10000; }
.xpense-gate-card .xpense-links { display:flex; flex-wrap:wrap; gap:14px; margin-top:20px; font-size:13px; }
.xpense-gate-card .xpense-links a { color:#d9c9ff; text-underline-offset:3px; }
.xpense-gate-card .xpense-gate-copy{font-size:14px;color:#c6c9df;}
.xpense-gate-card .xpense-gate-button:focus-visible{outline:3px solid white;outline-offset:3px;}
@media(prefers-reduced-motion:reduce){#xpense-auth-gate,* {scroll-behavior:auto!important;}}

.xpense-account-link{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 13px;border:1px solid var(--border);border-radius:10px;color:var(--text);text-decoration:none;font:inherit}.xpense-account-link:hover{border-color:var(--purple)}.xpense-account-link:focus-visible{outline:2px solid var(--purple);outline-offset:2px}