/* Same palette and fonts as the application; independent of the JS build. */
@font-face { font-family:"Golos Text"; font-style:normal; font-weight:400; font-display:swap; src:url("/static/fonts/golos-text-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family:"Golos Text"; font-style:normal; font-weight:500; font-display:swap; src:url("/static/fonts/golos-text-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family:Unbounded; font-style:normal; font-weight:500; font-display:swap; src:url("/static/fonts/unbounded-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family:"Google Sans"; font-style:normal; font-weight:500; font-display:swap; src:url("/static/fonts/google-sans-latin-500-normal.woff2") format("woff2"); }
.account-page { margin:0; min-height:100vh; min-height:100svh; background:#242844; color:#24264b; font:400 16px/1.55 "Golos Text",system-ui,sans-serif; }
.account-page * { box-sizing:border-box; }
.account-page a { color:inherit; text-decoration:none; }
.account-page a:focus-visible,.account-page button:focus-visible,.account-page summary:focus-visible { outline:3px solid #294acc; outline-offset:4px; }
.account-header { padding:24px clamp(20px,4vw,56px); }
.account-brand { display:inline-flex; align-items:center; gap:10px; color:#fff5db!important; font:500 20px/1.4 Unbounded,sans-serif; }
.account-brand img { flex:none; }
.account-brand:focus-visible { outline-color:#f8c843!important; }
.account-main { display:flex; justify-content:center; padding:clamp(16px,7vh,76px) 20px 48px; }
.account-card { width:100%; max-width:440px; padding:32px; border:1px solid #d9ccb1; border-radius:16px; background:#fffcf1; }
.account-card h1 { margin:0; font:500 28px/1.3 Unbounded,sans-serif; letter-spacing:-.7px; overflow-wrap:anywhere; }
.account-intro { margin:12px 0 28px; color:#656078; }
.account-message { margin:14px 0 22px; color:#656078; }
.account-demo-entry { margin:22px 0; }
.account-demo-entry .account-primary { width:100%; }
.account-personal-label { margin:22px 0 14px; border-top:1px solid #d9ccb1; padding-top:20px; color:#656078; font-size:14px; }
.account-providers { display:grid; gap:12px; }
.account-provider { display:flex; align-items:center; justify-content:center; gap:12px; width:100%; min-height:48px; padding:12px; border:1px solid #747775; border-radius:6px; font:500 14px/20px "Golos Text",Arial,sans-serif; cursor:pointer; }
.account-provider-icon { flex:0 0 20px; object-fit:contain; }
.account-provider-google { background:#fff; color:#1f1f1f!important; font-family:"Google Sans",Arial,sans-serif; }
.account-provider-google:hover { background:#f8fafd; border-color:#515456; }
.account-provider-github { background:#24264b; border-color:#24264b; color:#fff5db!important; }
.account-provider-github:hover { background:#353865; border-color:#353865; }
.account-caption { color:#656078; font-size:13px; line-height:1.55; margin:14px 0 0; }
.account-existing { margin-top:22px; }
.account-guest { display:flex; align-items:center; justify-content:center; gap:10px; min-height:44px; margin-top:24px; border-top:1px solid #d9ccb1; padding-top:20px; font-weight:500; }
.account-guest:hover,.account-text-button:hover { text-decoration:underline; text-underline-offset:4px; }
.account-identity { display:flex; align-items:center; gap:12px; margin-top:22px; }
.account-identity p { margin:0; overflow-wrap:anywhere; }
.account-identity strong { font-weight:500; }
.account-avatar { display:grid; place-items:center; flex:0 0 40px; height:40px; border-radius:50%; color:#24264b; background:#c8c3f7; font-weight:500; }
.account-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin:20px 0 24px; }
.account-primary { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:44px; padding:10px 16px; border-radius:6px; background:#f8c843; font-weight:500; }
.account-primary:hover { background:#efbc2e; }
.account-text-button { min-height:44px; padding:8px 10px; border:0; border-radius:4px; color:#656078; background:transparent; font:inherit; cursor:pointer; }
.account-methods { padding-top:20px; border-top:1px solid #d9ccb1; }
.account-methods h2 { margin:0 0 12px; font-size:15px; font-weight:500; }
.account-connected { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:48px; padding:8px 0; }
.account-method-name { display:flex; align-items:center; gap:10px; font-weight:500; }
.account-connected-status { color:#3f6752; font-size:13px; white-space:nowrap; }
.account-connected-status>span { margin-right:4px; }
.account-methods form { margin-top:8px; }
.account-allowance { margin-top:22px; border-top:1px solid #d9ccb1; padding-top:10px; color:#656078; font-size:13px; }
.account-allowance summary { min-height:44px; display:list-item; align-content:center; cursor:pointer; width:fit-content; }
.account-allowance p { margin:4px 0 0; }
@media (max-width:480px) {
  .account-header { padding:18px 16px; }
  .account-brand { font-size:17px; gap:8px; }
  .account-brand img { width:38px; height:38px; }
  .account-main { padding:18px 16px 32px; }
  .account-card { padding:24px; border-radius:12px; }
  .account-card h1 { font-size:25px; }
}
@media (forced-colors:active) { .account-provider,.account-primary { border:1px solid ButtonText; } }
