.account-bar { height:64px; padding:10px 20px; display:flex; justify-content:flex-end; align-items:center; border-bottom:1px solid var(--line); background:var(--card); position:relative; z-index:30; }
.has-account #gallery { min-height:calc(100dvh - 64px); }
.account-bar summary { display:flex; align-items:center; gap:10px; cursor:pointer; min-height:40px; font-size:14px; }
.account-bar summary img { width:30px; height:30px; border-radius:50%; }
.account-menu { position:absolute; right:16px; top:56px; width:min(300px,calc(100vw - 32px)); padding:8px; border:1px solid var(--line); border-radius:16px; background:var(--card); box-shadow:0 20px 50px #0003; }
.account-menu button { width:100%; text-align:left; border:0; background:transparent; }
.account-dialog { box-sizing:border-box; width:min(440px,calc(100vw - 32px)); padding:32px; border:1px solid var(--line); border-radius:16px; color:var(--ink); background:var(--card); }
.account-dialog::backdrop { background:var(--bg); opacity:.97; }
.account-dialog h1 { font-size:30px; line-height:1.2; letter-spacing:-.02em; margin:16px 0; }
.account-dialog p { color:var(--muted); line-height:1.6; }
.account-dialog button { display:block; width:100%; margin-top:12px; min-height:46px; }
.account-dialog .account-primary { background:var(--accent); color:white; }
.account-dialog label { display:grid; gap:8px; }
.account-dialog input { width:100%; box-sizing:border-box; border:1px solid var(--line); border-radius:10px; padding:12px; font:inherit; color:var(--ink); background:var(--bg); }
.account-dialog [role=alert] { color:var(--bad,#b23b32); }
.cloud-progress { position:fixed; top:0; left:0; width:100%; height:3px; border:0; z-index:100; accent-color:var(--accent); }
@media(max-width:600px) { .account-dialog { padding:24px; } .account-dialog h1 { font-size:28px; } .account-bar { padding-inline:16px; } }

.sync-pill { position:fixed; left:16px; bottom:16px; z-index:100; border:1px solid var(--line); border-radius:999px; padding:8px 14px; font:inherit; font-size:13px; background:var(--card,#fff); color:var(--muted,#6b7785); box-shadow:0 6px 24px rgba(15,20,30,.12); }
.sync-pill[hidden] { display:none; }
.sync-pill[data-kind=error] { color:var(--bad,#b23b32); cursor:pointer; }