html[data-auth-state="pending"] body{visibility:hidden}html[data-auth-state="error"] body{visibility:visible}.account-menu{display:flex;align-items:center;gap:10px;font-size:12px;min-width:0}.account-username{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-logout{font:inherit;font-size:11px;background:transparent;border:1px solid #dce5e1;border-radius:5px;padding:5px 9px;color:#58736a;white-space:nowrap;cursor:pointer}.account-logout:hover{background:#eef5f1}.account-logout:focus-visible{outline:3px solid #72bda3;outline-offset:3px}.account-logout:disabled{opacity:.5;cursor:wait}.topbar-account{display:flex;align-items:center;gap:22px}.user-area .account-username{display:inline!important}.user-area .account-logout{display:inline-block!important}.auth-unavailable{margin:0!important;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center;font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;color:#20323c;background:#f5f7f5}.auth-unavailable h1{font-size:24px;margin:0 0 10px}.auth-unavailable p{color:#78868b;font-size:14px;margin:0 0 24px}.auth-primary{width:100%;min-height:48px;border:0;border-radius:7px;background:#16765e;color:white;font:inherit;font-weight:600;font-size:14px;padding:12px 20px;cursor:pointer}.auth-primary:hover{background:#105f4b}.auth-primary:disabled{opacity:.6;cursor:wait}.auth-unavailable .auth-primary{width:auto;min-width:140px}.login-page{margin:0;color:#20323c;background:#f4f7f4;font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;font-size:14px;line-height:1.7}.login-page *{box-sizing:border-box}.login-page button,.login-page input{font:inherit}.login-page button:focus-visible,.login-page a:focus-visible{outline:3px solid #72bda3;outline-offset:3px}.login-page [hidden]{display:none!important}.auth-shell{display:grid;grid-template-columns:minmax(340px,1fr) minmax(440px,1fr);min-height:100vh}.auth-story{background:#142e3c;color:#fff;position:relative;padding:44px 11%;display:flex;flex-direction:column;overflow:hidden}.auth-story:after{content:"";position:absolute;right:-160px;bottom:-280px;width:650px;height:650px;border:1px solid #34535c;border-radius:50%;box-shadow:0 0 0 70px #29465030,0 0 0 140px #29465020;pointer-events:none}.auth-brand{display:flex;align-items:center;gap:12px;align-self:flex-start;color:#fff;text-decoration:none;font-size:21px;font-weight:600;letter-spacing:1px}.auth-brand-mark{display:grid;place-items:center;width:42px;height:47px;background:#274654;border:1px solid #728c97;border-radius:9px;font-size:24px}.auth-brand small{display:block;color:#93abb6;font-size:10px;font-weight:400;letter-spacing:2px;margin-top:2px}.auth-story-body{margin:auto 0;position:relative;z-index:1;padding:70px 0}.auth-eyebrow{color:#95c3b0;font-size:10px;font-weight:600;letter-spacing:2px}.auth-story h1{font-size:clamp(32px,3.3vw,48px);font-weight:500;letter-spacing:2px;line-height:1.5;margin:19px 0 20px}.auth-story-body>p{color:#abc0c7;font-size:14px;line-height:2;margin:0 0 42px}.auth-story-card{max-width:370px;background:#ffffff09;border:1px solid #56717a75;border-radius:9px;display:flex;align-items:center;gap:13px;padding:18px}.auth-card-icon{border:1px solid #709b8f66;border-radius:7px;width:38px;height:42px;color:#a4cabc;font-size:25px;display:grid;place-items:center;flex-shrink:0}.auth-story-card strong{display:block;font-size:12px;font-weight:500}.auth-story-card div>span{display:block;color:#93aeb7;font-size:10px;margin-top:4px;line-height:1.8}.auth-card-check{margin-left:auto;color:#94bca7}.auth-story-footer{position:relative;z-index:1;color:#7998a4;font-size:10px;letter-spacing:.5px}.auth-panel{padding:44px 11% 30px;background:#fff;display:flex;flex-direction:column;justify-content:center}.auth-form-wrap{width:100%;max-width:368px;margin:auto}.auth-tabs{display:flex;border-bottom:1px solid #e3e9e5;gap:28px;margin-bottom:34px}.auth-tabs button{position:relative;border:0;background:transparent;color:#89988f;padding:10px 0 13px;font-size:13px;cursor:pointer}.auth-tabs button.selected{color:#16765e;font-weight:600}.auth-tabs button.selected:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#16765e}.auth-tabs button:disabled{cursor:wait}.auth-panel h2{font-size:26px;font-weight:600;margin:0 0 8px;letter-spacing:.4px}.auth-description{font-size:12px;color:#829087;margin:0 0 30px}.auth-panel label{display:block;font-size:12px;color:#536e60;margin-top:18px}.auth-panel input{display:block;width:100%;height:46px;border:1px solid #dfe6e1;border-radius:6px;padding:10px 13px;margin-top:8px;color:#20323c;background:#fbfcfa;font-size:13px}.auth-panel input:focus{outline:2px solid #72bda3;outline-offset:1px;background:#fff}.auth-panel input::placeholder{font-size:12px;color:#a1ada5}.auth-field-help{font-size:10px;color:#8e9d93;margin:7px 0 0}.auth-show-password{font-size:11px!important;color:#6f8377;border:0;background:transparent;padding:0;margin:13px 0 3px;cursor:pointer}.auth-message{font-size:12px;color:#16765e;min-height:21px;margin:13px 0;overflow-wrap:anywhere}.auth-message.is-error{color:#a14c42}.auth-privacy{font-size:10px;color:#95a197;text-align:center;margin:22px 0 0}.auth-privacy span{color:#709b84;margin-right:3px}.auth-panel-footer{margin-top:40px;font-size:10px;letter-spacing:1px;color:#a1ada5;text-align:center}@media(max-width:1000px){.auth-story,.auth-panel{padding-left:9%;padding-right:9%}.auth-story-card{padding:14px;gap:9px}.auth-story-card div>span{font-size:9px}}@media(max-width:760px){.auth-shell{display:block}.auth-story{padding:24px 26px 26px;min-height:0}.auth-brand{font-size:18px;gap:10px}.auth-brand-mark{width:34px;height:38px;font-size:20px}.auth-brand small{font-size:9px}.auth-story-body{padding:32px 0 0;margin:0}.auth-eyebrow{font-size:9px}.auth-story h1{font-size:28px;margin:10px 0 8px;line-height:1.4}.auth-story h1 br{display:none}.auth-story-body>p{font-size:11px;margin:0}.auth-story-body>p br{display:none}.auth-story-card,.auth-story-footer{display:none}.auth-story:after{width:400px;height:400px;bottom:-340px;right:-100px}.auth-panel{padding:24px 26px 28px;min-height:calc(100vh - 222px)}.auth-tabs{margin-bottom:25px}.auth-panel h2{font-size:24px}.auth-description{margin-bottom:24px}.auth-panel-footer{margin-top:32px}.topbar-account{gap:12px}.account-menu{gap:7px}.account-username{max-width:95px}}@media(max-width:550px){.topbar-account .back-map{display:none}.topbar-account{gap:8px}.account-logout{font-size:10px;padding:4px 7px}.account-menu{font-size:11px;gap:6px}.account-username{max-width:85px}.user-area .demo-label{display:none!important}.user-area{gap:6px!important}.user-area .avatar{display:none!important}.auth-story{padding:20px 23px 24px}.auth-story-body{padding-top:25px}.auth-story h1{font-size:25px}.auth-panel{padding:22px 23px 25px}.auth-panel-footer{font-size:9px}.auth-unavailable h1{font-size:21px}}
/* Touch layouts keep the form readable without disabling browser zoom. */
@media (max-width: 900px) {
  .login-page { min-height: 100vh; min-height: 100dvh; }
  .login-page .auth-shell { display: block; min-height: 100vh; min-height: 100dvh; }
  .login-page .auth-story {
    padding: max(20px, env(safe-area-inset-top)) max(22px, env(safe-area-inset-right)) 24px max(22px, env(safe-area-inset-left));
    min-height: 0;
  }
  .login-page .auth-brand { font-size: 19px; gap: 11px; }
  .login-page .auth-brand-mark { width: 36px; height: 40px; font-size: 21px; }
  .login-page .auth-brand small { font-size: 10px; }
  .login-page .auth-story-body { padding: 23px 0 0; margin: 0; }
  .login-page .auth-eyebrow { font-size: 10px; letter-spacing: 1.6px; }
  .login-page .auth-story h1 { font-size: clamp(24px, 6.3vw, 30px); line-height: 1.45; letter-spacing: 1px; margin: 9px 0; }
  .login-page .auth-story h1 br, .login-page .auth-story-body > p br,
  .login-page .auth-story-card, .login-page .auth-story-footer { display: none; }
  .login-page .auth-story-body > p { font-size: 13px; line-height: 1.75; margin: 0; }
  .login-page .auth-story:after { width: 400px; height: 400px; right: -100px; bottom: -340px; }
  .login-page .auth-panel {
    display: block; min-height: 0;
    padding: 22px max(22px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(22px, env(safe-area-inset-left));
  }
  .login-page .auth-form-wrap { max-width: 460px; margin: 0 auto; min-width: 0; }
  .login-page .auth-tabs { margin-bottom: 22px; gap: 28px; }
  .login-page .auth-tabs button { min-width: 80px; min-height: 44px; font-size: 15px; padding: 9px 3px; }
  .login-page .auth-panel h2 { font-size: 24px; line-height: 1.5; }
  .login-page .auth-description { font-size: 13px; line-height: 1.8; margin-bottom: 22px; }
  .login-page .auth-panel label { font-size: 14px; margin-top: 17px; }
  .login-page .auth-panel input { font-size: 16px; min-height: 50px; padding: 11px 13px; scroll-margin-block: 24px; }
  .login-page .auth-panel input::placeholder { font-size: 14px; }
  .login-page .auth-field-help { font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
  .login-page .auth-show-password { min-height: 44px; padding: 6px 0; margin: 5px 0 0; font-size: 13px !important; }
  .login-page .auth-message { font-size: 13px; margin: 5px 0 13px; }
  .login-page .auth-primary { min-height: 50px; font-size: 16px; }
  .login-page .auth-privacy { font-size: 12px; line-height: 1.8; margin-top: 19px; }
  .login-page .auth-panel-footer { display: block; margin-top: 28px; font-size: 11px; }
  .account-logout { min-height: 44px; padding: 8px 10px; font-size: 12px; }
  .account-menu { min-width: 0; gap: 8px; }
  .account-username { max-width: min(24vw, 128px); font-size: 12px; }
  .auth-unavailable .auth-primary { font-size: 16px; min-height: 48px; }
}
@media (max-width: 900px) and (max-height: 520px) {
  .login-page .auth-story { padding-top: max(12px, env(safe-area-inset-top)); padding-bottom: 12px; }
  .login-page .auth-story-body { display: none; }
}
@media (max-width: 360px) {
  .login-page .auth-story h1 br { display: block; }
}

/* Account menu: admin link and the change-password dialog (auth.js). */
.account-link{font:inherit;font-size:11px;background:transparent;border:0;color:#58736a;text-decoration:none;cursor:pointer;padding:5px 4px;white-space:nowrap}
.account-link:hover{color:#16765e}
.account-link[hidden]{display:none!important}
.auth-password-dialog{width:400px;max-width:calc(100vw - 32px);border:1px solid #dfe9e5;border-radius:12px;padding:22px;box-shadow:0 16px 60px #1a455c2b;color:#20323c}
.auth-password-dialog::backdrop{background:#15374965}
.auth-password-dialog form{display:grid;gap:12px}
.auth-password-dialog h2{margin:0;font-size:17px}
.auth-password-dialog label{display:grid;gap:5px;font-size:12px;color:#5f776f}
.auth-password-dialog input{font:inherit;font-size:15px;border:1px solid #dce5e1;border-radius:7px;padding:9px 11px;min-height:44px}
.auth-password-note{margin:0;font-size:11px;color:#7c958c}
.auth-password-message{margin:0;font-size:12px;color:#2f7a52;min-height:18px}
.auth-password-message.is-error{color:#a14c42}
.auth-password-actions{display:flex;justify-content:flex-end;gap:10px}
.auth-password-actions button{font:inherit;font-size:13px;min-height:42px;padding:0 16px;border-radius:7px;cursor:pointer}
.auth-secondary{border:1px solid #dce5e1;background:#fff;color:#50636c}
@media (max-width:780px){.auth-password-dialog input{font-size:16px}}
.auth-password-actions .auth-primary{width:auto}
/* Narrow phones: the record and admin page headers keep only the name and sign-out; "管理后台" and "修改密码" stay in the map page's account menu. */
@media (max-width:480px){.topbar .account-link{display:none!important}}