/* 站点外壳样式：导航、正文、页脚、赞助弹窗
   导航与赞助弹窗的视觉风格对齐 nieyi.cn/f/
   ------------------------------------------------------------------ */
:root{
  --gold:#d6b779; --gold-light:#f1d7a0; --line:#36312a;
  --s-text:#e7e2d8; --s-muted:#9d9c97;
  --nav-h:52px;
}

/* ---------- 可访问性 ---------- */
.skip-link{position:absolute;left:-9999px;top:0;z-index:2000;padding:8px 14px;background:var(--gold);color:#1a1409;border-radius:0 0 6px 0}
.skip-link:focus{left:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- 布局：导航 + 地图 + 正文 + 页脚 ---------- */
html,body{height:auto;min-height:100%}
body{background:#101111;color:var(--s-text)}
#app{height:calc(100vh - var(--nav-h));min-height:520px}
@media (max-width:820px){
  #app{height:calc(100vh - 118px)}
}

/* ---------- 顶部自媒体导航 ---------- */
.socialnav{position:sticky;top:0;z-index:1000;display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  padding:8px 14px;min-height:var(--nav-h);box-sizing:border-box;
  background:linear-gradient(180deg,#17181a,#121314);
  border-bottom:1px solid var(--line);
  font-size:12.5px;color:var(--s-text);
  box-shadow:0 2px 12px rgba(0,0,0,.5)}
.socialnav .tag{color:var(--gold);font-weight:700;letter-spacing:.5px;margin-right:2px}
.socialnav .tag-tools{margin-left:6px}
.socialnav a{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border:1px solid var(--line);
  border-radius:999px;color:var(--s-text);text-decoration:none;line-height:1.25;
  transition:border-color .15s,color .15s,background .15s}
.socialnav a:hover,.socialnav a:focus-visible{border-color:var(--gold);color:var(--gold-light);background:#232322}
.socialnav .ic{font-size:13px;line-height:1}
.socialnav .sponsor-open{margin-left:auto;display:inline-flex;align-items:center;gap:6px;padding:5px 13px;
  border:1px solid var(--gold);border-radius:999px;background:#2a2317;color:var(--gold-light);
  cursor:pointer;font:inherit;font-size:12px;font-weight:700}
.socialnav .sponsor-open:hover,.socialnav .sponsor-open:focus-visible{background:#3b3019}

/* ---------- 正文（SEO / GEO 内容） ---------- */
.seo{background:#121314;border-top:1px solid var(--line);padding:34px 20px 26px}
.seo article{max-width:980px;margin:0 auto}
.seo h1{margin:0 0 14px;font-size:24px;line-height:1.4;color:var(--gold-light)}
.seo h2{margin:26px 0 10px;font-size:16px;color:var(--gold);border-left:3px solid var(--gold);padding-left:9px}
.seo p,.seo li,.seo dd{color:#cfcac0;line-height:1.85;font-size:13.5px}
.seo .lead{font-size:14.5px;color:#ded8cc}
.seo strong,.seo b{color:#fff8e8}
.seo code{background:#20211f;border:1px solid var(--line);border-radius:3px;padding:1px 5px;font-size:12.5px;color:var(--gold-light)}
.seo a{color:var(--gold);text-decoration:underline;text-underline-offset:2px}
.seo a:hover{color:var(--gold-light)}
.seo-list{margin:0 0 6px;padding-left:20px}
.seo-list li{margin:4px 0}
.seo-faq{display:grid;gap:8px;margin:0}
.seo-faq dt{color:#fff8e8;font-weight:700;font-size:13.5px}
.seo-faq dt::before{content:"Q：";color:var(--gold)}
.seo-faq dd{margin:0 0 4px;padding-left:14px;border-left:1px solid var(--line)}
.seo-faq dd::before{content:"A：";color:var(--gold)}

/* ---------- 页脚 ---------- */
.site-footer{padding:20px;text-align:center;background:#0d0e0f;border-top:1px solid var(--line);color:var(--s-muted);font-size:12px}
.site-footer p{margin:4px 0}
.footer-brand{color:var(--gold);font-weight:700}
.footer-divider{color:var(--line);margin:0 6px}
.site-footer a{color:var(--gold)}

/* ---------- 赞助弹窗 ---------- */
.sponsor-dialog{width:min(92vw,430px);max-height:92vh;padding:0;border:1px solid var(--gold);
  border-radius:6px;background:#191a1b;color:var(--s-text)}
.sponsor-dialog::backdrop{background:rgba(0,0,0,.75)}
.sponsor-inner{display:flex;flex-direction:column;gap:11px;padding:16px;max-height:92vh;overflow:auto}
.sponsor-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0;padding:0}
.sponsor-head h2{margin:0;font-size:17px;color:var(--gold-light)}
.sponsor-head button{padding:6px 12px;border:1px solid var(--line);border-radius:3px;background:#232322;
  color:var(--s-text);cursor:pointer;font:inherit;font-size:12px}
.sponsor-note{margin:0;padding:10px 12px;border:1px solid #c08a2e;border-left:5px solid #ffb61e;
  border-radius:4px;background:#2c2010;color:#ffdf9e;font-weight:700;font-size:13px;line-height:1.65}
.sponsor-note a{color:#ffd77a}
.sponsor-qr{width:100%;height:auto;max-height:56vh;object-fit:contain;border-radius:4px;background:#111}
.sponsor-foot{margin:0;font-size:11px;color:var(--s-muted);text-align:center}
.sponsor-siteqr{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:4px;padding-top:12px;
  border-top:1px solid var(--line)}
.sponsor-siteqr .sponsor-qr{width:auto;max-width:188px;max-height:none}
.sponsor-siteqr a{color:var(--gold);text-decoration:none}
.sponsor-siteqr a:hover{text-decoration:underline}

@media(max-width:600px){
  .socialnav{font-size:11px;gap:6px}
  .socialnav a,.socialnav .sponsor-open{padding:5px 9px}
  .socialnav .sponsor-open{margin-left:0}
  .seo h1{font-size:20px}
}