/* 共享展示层：仅调整门户布局，不参与星盘计算与盘面绘制。 */
:root {
  --gold: #886520; --gold-l: #e4d3aa; --ink: #302e29; --sub: #706b60;
  --bg: #f7f5ef; --card: #fffefa; --line: #e7e2d7; --ok: #267244; --err: #b53737;
}
body { font-size: 15px; line-height: 1.75; background: radial-gradient(ellipse at 85% 0, #eee5cf 0, transparent 38rem), var(--bg); }
a, button, input, select { -webkit-tap-highlight-color: transparent; }
a, button { transition: background-color .18s, color .18s, box-shadow .18s; }
button, input, select { font-family: inherit; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }
input:focus-visible, select:focus-visible { outline: 3px solid var(--gold-l); outline-offset: 2px; }
header.nav { background: rgba(255,254,250,.96); backdrop-filter: blur(14px); }
.nav-in { max-width: 1240px; min-height: 76px; padding: 12px 28px; gap: 12px; flex-wrap: wrap; }
.nav-brand { margin-right: auto; letter-spacing: .3px; font-size: 20px; }
.nav a.nav-item { display: inline-flex; align-items: center; min-height: 44px; margin-left: 0; padding: 8px 14px; border-radius: 8px; color: var(--sub); }
.nav a.nav-item:hover, .nav a.nav-item.on { background: #f1ead9; color: var(--gold); }
main { max-width: 1240px; padding: 24px 28px 40px; }
.hero { padding: clamp(36px, 6vw, 76px) 12px 42px; }
.hero h1 { font-size: clamp(28px, 4vw, 46px); line-height: 1.35; letter-spacing: -.8px; }
.hero p { max-width: 760px; margin: 18px auto 0; font-size: 16px; }
.hero .badges { margin-top: 24px; }
.badge { padding: 6px 14px; font-size: 13px; background: #fffefa; }
.hero-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
section { padding: clamp(20px, 3vw, 34px); margin-top: 24px; border-radius: 18px; box-shadow: 0 4px 22px #48391805; scroll-margin-top: 160px; min-width: 0; }
section h2 { font-size: 22px; margin-bottom: 10px; letter-spacing: -.3px; }
section h2::before { height: 20px; width: 3px; margin-right: 12px; }
section .desc { font-size: 14px; line-height: 1.85; margin-bottom: 22px; }
.api-card { background: #fff; border-radius: 12px; padding: 22px; margin-bottom: 18px; overflow-x: auto; }
.api-card h3 { font-size: 17px; }
.api-card h3 .m { display: inline-block; font-size: 13px; overflow-wrap: anywhere; }
.api-card .row { font-size: 14px; margin: 10px 0 16px; }
table { font-size: 14px; }
th, td { padding: 13px 14px; }
th { background: #f5f1e7; color: #635a47; font-size: 13px; }
tr:last-child td { border-bottom: 0; }
tbody tr:hover td { background: #faf7ef; }
code { font-size: 13px; overflow-wrap: anywhere; color: var(--gold); }
pre { background: #302f2b; border: 1px solid #444138; font-size: 14px; line-height: 1.85; padding: 22px; border-radius: 12px; }
pre .c { color: #bcb8ab; }
label { font-size: 14px; font-weight: 500; color: #5d574c; margin-bottom: 7px; }
input, select { min-height: 46px; max-width: 100%; min-width: 0; font-size: 16px; padding: 10px 12px; border-radius: 9px; background: #fff; color: var(--ink); }
.form-grid { gap: 20px; }
.form-grid > * { min-width: 0; }
.btn { display: inline-flex; justify-content: center; align-items: center; min-height: 46px; padding: 10px 22px; border-radius: 9px; font-size: 15px; font-weight: 600; letter-spacing: .2px; line-height: 1.5; }
.btn:hover { background: #705218; box-shadow: 0 3px 10px #88652020; }
.btn.ghost { background: #fffefa; color: var(--gold); border: 1px solid #d6c49d; }
.btn.ghost:hover { background: #f3ecdb; }
.btn.sm { min-height: 44px; font-size: 13px; padding: 8px 13px; border-radius: 8px; letter-spacing: 0; }
.btn.danger { background: #fff; border: 1px solid #e6c7c3; color: var(--err); }
.btn.danger:hover { background: #fff0ed; }
button:active { transform: translateY(1px); }
button:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; }
.tab { gap: 8px; margin: 20px 0; flex-wrap: wrap; }
.tab button { min-height: 44px; padding: 9px 16px; font-size: 14px; color: #635d51; }
.tab button:hover { background: #f3ecdb; }
.tab button.on { background: var(--gold); color: #fff; }
.tab .tab-grp { font-size: 14px; font-weight: 600; margin-top: 16px; color: #5d574c; }
.form-box { max-width: 460px; }
.form-box .tab { background: #f3efe5; padding: 5px; border-radius: 12px; }
.form-box .tab button { flex: 1; border: 0; }
.form-box .row, .login-box .row { margin-bottom: 20px; }
.form-box form > .btn, .login-box form > .btn { width: 100%; }
.login-box { max-width: 460px; margin-top: 52px; }
.login-box input, .two-col input { width: 100%; }
.msg, .muted, .login-box .tip { font-size: 14px; }
.key-box { padding: 8px 0; }
.key-box code { min-width: 0; font-size: 15px; padding: 18px; background: #faf6eb; }
.kv { grid-template-columns: 110px minmax(0, 1fr); font-size: 14px; gap: 12px 18px; }
.kv > span { overflow-wrap: anywhere; }
.stats { gap: 16px; }
.stat { padding: 22px; background: linear-gradient(135deg, #fffdf7, #f6f0e2); border-radius: 12px; }
.stat .n { font-size: 34px; line-height: 1.4; font-variant-numeric: tabular-nums; }
.stat .t { font-size: 14px; margin-top: 6px; }
.tag { padding: 4px 11px; font-size: 13px; white-space: nowrap; }
.act-bar { gap: 8px; }
.table-scroll { overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; }
.table-scroll table { min-width: 960px; }
.table-scroll td { max-width: 280px; overflow-wrap: anywhere; }
.table-scroll td:last-child { white-space: nowrap; }
.two-col { gap: 28px; }
.two-col > div { min-width: 0; background: #faf8f2; border: 1px solid var(--line); padding: 22px; border-radius: 12px; }
.admin-heading { padding: 22px 0 0; }
.admin-heading h1 { font-size: clamp(26px, 3vw, 34px); }
.admin-heading p { color: var(--sub); margin-top: 6px; }
.section-nav { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 18px; }
.section-nav a { min-height: 44px; padding: 8px 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--card); }
.section-nav a:hover { background: #f1ead9; }
.pv-head { padding: 14px 18px; }
.pv-head b { font-size: 16px; }
.pv-close { width: 44px; height: 44px; flex-shrink: 0; }
.pv-phone { min-height: 0; flex-shrink: 1; }
.pv-tab button { min-height: 44px; }
.pv-card p, .pv-card h4, .pv-table, .pv-note { font-size: 14px; }
footer { color: var(--sub); font-size: 13px; }
@media (max-width: 720px) {
  .nav-in { padding: 10px 16px; gap: 4px; }
  .nav-brand { flex-basis: 100%; font-size: 18px; }
  .nav a.nav-item { padding: 8px 10px; font-size: 13px; }
  main { padding: 16px 14px 28px; }
  .hero { padding: 32px 4px 20px; }
  .hero p { font-size: 14px; }
  section { border-radius: 14px; padding: 20px 16px; }
  .api-card { padding: 16px 12px; }
  .api-card table { min-width: 480px; }
  .form-grid { grid-template-columns: 1fr; }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .stat { padding: 16px 12px; }
  .stat .n { font-size: 26px; overflow-wrap: anywhere; }
  .key-box { flex-wrap: wrap; }
  .key-box code { flex-basis: 100%; }
  .login-box { margin-top: 28px; }
  .two-col > div { padding: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}