.account-page-body{min-height:100vh;min-height:100dvh;min-height:var(--tianji-visual-viewport-height,100dvh);background:var(--canvas);overflow:hidden}
.account-page-home{
  position:fixed;z-index:130;top:max(18px,env(safe-area-inset-top));left:max(20px,env(safe-area-inset-left));
  min-height:44px;display:inline-flex;align-items:center;gap:6px;padding:9px 13px;border:1px solid var(--line);border-radius:999px;
  color:var(--dim);background:color-mix(in srgb,var(--paper-strong) 88%,transparent);font:600 12px/1.3 var(--sans);text-decoration:none;
}
.account-page-home:hover,.account-page-home:focus-visible{outline:none;color:var(--ink);border-color:var(--line-strong);box-shadow:var(--focus-ring)}
.account-page-home span{font-size:20px;line-height:.7}
html[data-account-page="standalone"] .account-dialog{z-index:120}
html[data-account-page="standalone"] .account-dialog .app-dialog-mask{background:var(--canvas);backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-account-page="standalone"] .account-dialog[data-view="checking"] .account-dialog-surface,
html[data-account-page="standalone"] .account-dialog[data-view="unavailable"] .account-dialog-surface,
html[data-account-page="standalone"] .account-dialog[data-view="account"] .account-dialog-surface{box-shadow:none}
html[data-account-page="standalone"] .account-dialog[data-view="account"] .account-dialog-surface{width:min(660px,calc(100vw - 40px))}
html[data-account-page="standalone"] .account-dialog .account-dialog-surface{background-color:var(--paper-strong,#fffdf8)!important;background-image:none!important}
.account-page-policy{display:block;padding:0;overflow:hidden}
.account-page-policy summary{min-height:44px;display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:center;padding:13px 14px;cursor:pointer;list-style:none}
.account-page-policy summary::-webkit-details-marker{display:none}
.account-page-policy summary>span:last-child{color:var(--dim);font-size:11.5px;line-height:1.75}
.account-page-policy summary b{margin-left:4px;color:var(--sky);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.account-page-policy>div{display:grid;gap:8px;padding:0 14px 14px 46px}
.account-page-policy>div p{margin:0;color:var(--faint);font-size:11.5px;line-height:1.75}
.account-page-body button{min-height:44px}
@media(max-width:620px){
  .account-page-home{top:max(9px,env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left));padding:7px 10px;background:var(--paper-strong)}
  html[data-account-page="standalone"] .account-dialog[data-view="auth"] .account-dialog-surface{padding-top:max(62px,calc(env(safe-area-inset-top) + 48px))}
  html[data-account-page="standalone"] .account-dialog[data-view="checking"],
  html[data-account-page="standalone"] .account-dialog[data-view="unavailable"],
  html[data-account-page="standalone"] .account-dialog[data-view="account"]{place-items:start center;padding:0}
  html[data-account-page="standalone"] .account-dialog[data-view="checking"] .account-dialog-surface,
  html[data-account-page="standalone"] .account-dialog[data-view="unavailable"] .account-dialog-surface,
  html[data-account-page="standalone"] .account-dialog[data-view="account"] .account-dialog-surface{width:100%;max-height:100vh;max-height:100dvh;max-height:var(--tianji-visual-viewport-height,100dvh);min-height:100vh;min-height:100dvh;min-height:var(--tianji-visual-viewport-height,100dvh);border:0;border-radius:0;padding:max(64px,calc(env(safe-area-inset-top,0px) + 48px)) max(16px,env(safe-area-inset-right,0px)) max(20px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
}

/* Android browsers may enlarge the layout viewport after focusing an input,
   which can make the width breakpoint stop matching. A touch login page stays
   full-bleed regardless of that temporary layout-width change. */
@media(hover:none),(pointer:coarse){
  html[data-account-page="standalone"] .account-dialog[data-view="auth"]{place-items:start center;padding:0}
  html[data-account-page="standalone"] .account-dialog[data-view="auth"] .account-dialog-surface{
    width:100%;max-width:none;max-height:100vh;max-height:100dvh;max-height:var(--tianji-visual-viewport-height,100dvh);min-height:100vh;min-height:100dvh;min-height:var(--tianji-visual-viewport-height,100dvh);
    padding:max(62px,calc(env(safe-area-inset-top) + 48px)) max(22px,env(safe-area-inset-right)) max(26px,env(safe-area-inset-bottom)) max(22px,env(safe-area-inset-left));
    border:0;border-radius:0;overflow-y:auto;transform:none;
  }
  html[data-account-page="standalone"] .account-dialog[data-view="auth"] .app-dialog-surface::before{display:none}
  html[data-account-page="standalone"] .account-dialog[data-view="auth"] .account-field input{font-size:16px}
}
