.account-page { min-height:100dvh; background:#182426; }

.account-shell { width:min(620px,100%); margin:auto; padding:32px 20px 48px; }
.account-back { display:inline-block; color:#f7e2b7; margin-bottom:26px; padding:12px 0; font-size:1rem; }
.account-panel { padding:34px; background:#efddb7; color:#332d29; border:4px solid #4a3c30; border-radius:13px 5px 16px 7px; box-shadow:7px 9px #111b2590; }
.account-brand { display:block; font-size:.875rem; letter-spacing:.12em; font-weight:900; color:#645038; }
.account-panel h1 { font-size:2.25rem; line-height:1.12; margin:16px 0 24px; }
.account-panel p { font-size:1rem; line-height:1.6; }
.account-tabs { display:flex; gap:8px; margin-bottom:24px; flex-wrap:wrap; }
.account-tabs button,.account-secondary { min-height:44px; padding:10px 14px; border:2px solid #79674e; border-radius:5px; background:transparent; color:#332d29; font:inherit; cursor:pointer; }
.account-tabs button[aria-pressed=true] { background:#293c38; color:#ffe7b7; }
.account-form { display:grid; gap:19px; }
.account-form label { display:grid; gap:8px; font-size:1rem; font-weight:800; }
.account-form input { min-width:0; width:100%; min-height:48px; padding:12px; background:#fff4db; border:2px solid #827255; border-radius:5px; font:inherit; color:#302d29; }
.account-form small,.account-note { font-size:.875rem; font-weight:400; line-height:1.5; }
.account-form button[type=submit] { min-height:50px; border:2px solid #293c38; border-radius:5px 9px 6px 4px; background:#293c38; color:#ffe7b7; font:inherit; font-weight:900; padding:13px; cursor:pointer; }
.account-form button:disabled { opacity:.55; cursor:wait; }
.account-error { padding:12px; border-left:4px solid #9c352c; background:#9c352c13; color:#72271f; font-size:1rem; line-height:1.5; }
.account-error:empty { display:none; }
.account-notice { border:2px solid #8e7452; border-radius:6px; padding:14px; line-height:1.6; }
.account-success { color:#294d38; font-weight:800; }
.account-links { display:flex; flex-wrap:wrap; gap:14px; margin-top:22px; }
.account-links button { color:#574932; font:inherit; background:none; border:0; padding:8px 0; text-decoration:underline; cursor:pointer; }
.account-footnote { text-align:center; color:#efdab1; font-size:.875rem; line-height:1.5; margin-top:24px; }
.account-panel :focus-visible,.account-back:focus-visible { outline:3px solid #b97529; outline-offset:3px; }
.account-button { display:inline-flex; align-items:center; min-height:44px; padding:8px 13px; border:2px solid #bba77880; border-radius:6px 3px 8px 4px; color:#efdab1; background:#202b2df2; font-size:.875rem; font-weight:800; cursor:pointer; text-decoration:none; max-width:180px; overflow-wrap:anywhere; }
.account-button:disabled { opacity:.6; }
.community-loading .game-card,.community-loading #spin-button,.community-loading #auto-button { pointer-events:none; opacity:.65; }
@media(max-width:600px){.account-panel{padding:25px 20px}.account-panel h1{font-size:1.9rem}.header-right{flex-wrap:wrap}.account-button{font-size:.875rem;max-width:120px;padding:8px}.site-header{height:auto;min-height:80px;padding-top:10px;padding-bottom:10px}}

.password-control{display:flex;align-items:stretch;min-width:0;position:relative}
.account-form .password-control input{padding-right:58px}
.password-toggle{position:absolute;right:3px;top:3px;bottom:3px;width:46px;display:flex;align-items:center;justify-content:center;border:0;border-left:1px solid #b89b68;border-radius:0 3px 3px 0;background:#e5ce9d;color:#4a3824;cursor:pointer}
.password-toggle[aria-pressed=true]{background:#293c38;color:#ffe7b7}

.account-page .account-shell{min-height:100dvh;display:flex;flex-direction:column;justify-content:center}.account-page .account-panel{width:100%}

.account-page{isolation:isolate}.account-lobby-preview{position:fixed;inset:-20px;z-index:-1;overflow:hidden;pointer-events:none;user-select:none;filter:blur(9px);background:#20212c url('./assets/lobby-casino.png') center/cover no-repeat;opacity:.65}.account-lobby-preview::after{content:'';position:absolute;inset:0;background:#101c244d;pointer-events:none}.preview-brand{height:90px;padding:30px 5%;font-size:26px;font-weight:900;color:#f1d19b;background:#1928299c}.preview-search{max-width:600px;margin:20px 0 28px;padding:18px;border:2px solid #c1a16b;border-radius:9px;color:#eedeb7;background:#20302b99}.account-lobby-preview .lobby{padding-top:25px}.account-lobby-preview .game-card{min-width:0}.account-page .account-panel{box-shadow:0 20px 80px #0008,7px 9px #111b2590}@media(max-width:600px){.account-lobby-preview{filter:blur(7px)}.preview-brand{font-size:22px}}

.account-loader{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;min-height:180px;padding:24px 8px;text-align:center}.account-loader p{margin:0;font-size:1rem;line-height:1.65;font-weight:700}.account-loader p span{font-family:Georgia,serif;font-style:italic;font-size:1.2rem;font-weight:400;opacity:.85}.loading-hourglass{overflow:visible;filter:drop-shadow(0 4px 3px #0003)}.hourglass-turn{transform-origin:32px 40px;animation:hourglass-flip 3.2s cubic-bezier(.65,0,.35,1) infinite}.sand-top{transform-origin:32px 35px;animation:sand-drain 3.2s linear infinite}.sand-bottom{transform-origin:32px 61px;animation:sand-fill 3.2s linear infinite}.sand-stream{animation:sand-fall 3.2s linear infinite}.account-progress[hidden]{display:none}.account-progress .account-loader{min-height:0;padding:16px 0;gap:10px}.account-progress .loading-hourglass{width:36px;height:45px}
@keyframes hourglass-flip{0%,72%{transform:rotate(0deg)}92%,100%{transform:rotate(180deg)}}
@keyframes sand-drain{0%{transform:scaleY(1)}70%,100%{transform:scaleY(.05)}}
@keyframes sand-fill{0%{transform:scaleY(.05)}70%,100%{transform:scaleY(1)}}
@keyframes sand-fall{0%,65%{opacity:1}70%,100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.hourglass-turn,.sand-top,.sand-bottom,.sand-stream{animation:none}.sand-bottom{transform:scaleY(.5)}}
