:root{font-family:system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif;color:#172033;background:#f4f7fb}
*{box-sizing:border-box}body{margin:0}.container{width:min(920px,calc(100% - 32px));margin:0 auto}
.hero{min-height:100vh;display:grid;place-items:center;text-align:center}.card{background:#fff;border-radius:18px;padding:32px;box-shadow:0 14px 45px rgba(31,45,75,.1)}
h1{margin:0 0 10px}p{color:#687386}.actions{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:28px}
.btn{display:inline-block;border:0;border-radius:10px;padding:13px 20px;background:#246bfd;color:#fff;text-decoration:none;font-size:16px;cursor:pointer}
.btn.secondary{background:#eef3ff;color:#246bfd}.btn.danger{background:#dc3545}.btn.disabled{background:#aab3c2;pointer-events:none}
.topbar{background:#172033;color:#fff;padding:15px 0}.topbar .container{display:flex;justify-content:space-between;align-items:center}.topbar a{color:#fff}
.panel{margin-top:30px}.row{display:grid;grid-template-columns:160px 1fr auto;gap:12px;align-items:end;margin:18px 0}
label{display:block;font-weight:600;margin-bottom:7px}input{width:100%;padding:12px;border:1px solid #d7deea;border-radius:9px;font-size:15px}
.notice{padding:12px 14px;border-radius:8px;background:#e9f8ef;color:#167442;margin:16px 0}.error{background:#fff0f0;color:#b42318}
.login{max-width:430px;margin:10vh auto}.login .btn{width:100%;margin-top:18px}.muted{font-size:13px;color:#7a8494}
@media(max-width:650px){.actions{grid-template-columns:1fr}.row{grid-template-columns:1fr}.card{padding:24px}.topbar .container{gap:16px}}

/* 前端图片导航页 */
.navigation-page{margin:0;background:#000}
.navigation-wrap{position:relative;width:min(100%,1080px);margin:0 auto;line-height:0;overflow:hidden}
.navigation-image{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}
.image-hotspot{position:absolute;z-index:2;display:flex;align-items:center;justify-content:center;text-decoration:none;-webkit-tap-highlight-color:transparent}
.hotspot-primary{
  left:2.8%;top:37.1%;width:94.4%;height:6.7%;
  border-radius:999px;background:linear-gradient(180deg,#3ae900 0%,#21cc00 100%);
  color:#fff;font-size:clamp(18px,5.4vw,49px);font-weight:500;line-height:1;
  text-shadow:0 2px 2px rgba(0,0,0,.12)
}
.hotspot-secondary{left:67%;top:91.5%;width:29.4%;height:6.9%}
.image-hotspot.disabled{pointer-events:none}
.navigation-error{position:absolute;z-index:3;left:5%;right:5%;top:2%;padding:12px;border-radius:8px;background:rgba(180,20,20,.92);color:#fff;line-height:1.5;text-align:center}