:root{--account-safe-top:env(safe-area-inset-top,0px);--account-bar-height:calc(48px + var(--account-safe-top))}
.account-strip{position:fixed;left:0;right:0;top:0;z-index:95;display:flex;justify-content:flex-end;align-items:center;height:var(--account-bar-height);box-sizing:border-box;padding:calc(4px + var(--account-safe-top)) max(10px,env(safe-area-inset-right,0px)) 4px max(10px,env(safe-area-inset-left,0px));background:#07140f;border-bottom:1px solid #c9b36a22}
#app{padding-top:var(--account-bar-height);box-sizing:border-box}
#overlay{top:var(--account-bar-height);padding-bottom:max(18px,env(safe-area-inset-bottom,0px))}
#overlay .modal{max-height:calc(100dvh - var(--account-bar-height) - 36px - env(safe-area-inset-bottom,0px))}
.account-home[hidden],#homeName[hidden],label[for=homeName][hidden]{display:none!important}
.account-strip button,.account-home button{display:flex;align-items:center;gap:6px;max-width:100%;font-size:11px;padding:3px 9px;min-height:26px}
.account-strip .account-open{height:40px;min-height:40px;padding:4px 10px;box-sizing:border-box;line-height:1.25;overflow:hidden;flex:none}
.account-strip button span[dir]{max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-strip.account-has-update .account-open{max-width:calc(100% - 144px)}
.account-strip button span[dir]{min-width:0}
.account-strip .account-current{order:-1;margin-right:auto;max-width:140px;min-height:40px;height:40px;padding:4px 7px;line-height:1.25;font-size:10px;white-space:normal;box-sizing:border-box;flex:none}
.account-avatar{width:24px;height:24px;box-sizing:border-box;object-fit:cover;border-radius:50%;border:1px solid #ccb471;flex:none;display:block}
.account-symbol{font-size:18px;line-height:1}
.account-home{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;margin:5px 0 12px}.account-home small{font-size:9px;opacity:.7;text-align:end}
.account-dialog{font:inherit;color:#f3eedc;background:linear-gradient(160deg,#173b2e,#0a1e16);border:1px solid #c7ab64;border-radius:17px;padding:20px;width:min(430px,calc(100vw - 28px));max-height:88dvh;overflow:auto;box-sizing:border-box;box-shadow:0 20px 80px #000b}
.account-dialog::backdrop{background:#0009;backdrop-filter:blur(3px)}
.account-title{display:flex;gap:8px;justify-content:space-between;align-items:center;margin-bottom:12px}.account-title h2{font-size:21px;margin:0}
.account-dialog form{display:grid;gap:12px}.account-dialog label{display:grid;gap:5px;font-size:13px}.account-dialog input{width:100%;box-sizing:border-box;padding:10px;border:1px solid #a48d50;border-radius:8px;background:#07180f;color:#fff;font:inherit}
.account-dialog input:focus{outline:2px solid #e3c169;outline-offset:1px}.account-dialog small{font-size:11px;line-height:1.5;opacity:.75}.account-dialog .btn{font:inherit;font-size:13px}.account-dialog .account-check{display:flex;align-items:center;gap:8px}.account-check input{width:auto}
.account-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.account-links small{width:100%}#accountMessage{font-size:12px;color:#dfe8cb;min-height:17px}#accountMessage.error{color:#ffb7a5}
.account-google{display:block;width:100%;margin-bottom:14px}
.account-preview{display:flex;align-items:center;gap:12px}.account-preview .account-avatar{width:64px;height:64px}.account-future{display:grid;gap:6px;border-top:1px solid #baa45f55;padding-top:12px;margin-top:5px}.account-future button{opacity:.55}
@media(max-width:500px){.account-dialog{padding:16px;max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 24px)}.account-home{align-items:flex-start}}
