/* ==========================================================================
   PishPish 缅因猫舍 · 官网样式
   设计语言移植自 outputs/website-prototype/index.html（主理人已确认方向 A/B）
   双主题：A 静谧暖白 / B 暗调金影。默认按时间切换，头部可手动切换。
   ========================================================================== */

/* ============ 主题变量 ============ */
:root{
  --font-sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --font-serif:"Songti SC","STSong","Source Han Serif SC",Georgia,serif;
  --r:14px; --maxw:1180px;
}
/* 方向 A：静谧暖白 —— 自然、干净、高级 */
html[data-theme="a"]{
  --bg:#FBFAF7; --bg2:#FFFFFF; --bg3:#F3F1EC;
  --fg:#1C1B19; --fg2:#5B5852; --fg3:#8E8A81;
  --line:rgba(28,27,25,.10);
  --accent:#1A8A7D; --accent-fg:#FFFFFF; --accent-soft:rgba(26,138,125,.10);
  --shadow:0 1px 2px rgba(28,27,25,.04),0 12px 32px rgba(28,27,25,.06);
  --head-bg:rgba(251,250,247,.82);
  --overlay:linear-gradient(180deg,rgba(12,12,11,.10) 0%,rgba(12,12,11,.55) 62%,rgba(12,12,11,.78) 100%);
  --radius-img:6px;
  color-scheme:light;
}
/* 方向 B：暗调金影 —— 稀有、影棚感、仪式感 */
html[data-theme="b"]{
  --bg:#0A0A0C; --bg2:#121215; --bg3:#1A1A1E;
  --fg:#EDEAE6; --fg2:#A8A49C; --fg3:#75716B;
  --line:rgba(237,234,230,.12);
  --accent:#C9A96E; --accent-fg:#0A0A0C; --accent-soft:rgba(201,169,110,.12);
  --shadow:0 1px 2px rgba(0,0,0,.5),0 18px 48px rgba(0,0,0,.55);
  --head-bg:rgba(10,10,12,.72);
  --overlay:linear-gradient(180deg,rgba(10,10,12,.20) 0%,rgba(10,10,12,.66) 58%,rgba(10,10,12,.92) 100%);
  --radius-img:2px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg); color:var(--fg);
  font-family:var(--font-sans); font-size:16px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
  transition:background .35s ease,color .35s ease;
  overflow-wrap:break-word;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
.serif{font-family:var(--font-serif)}
.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}
.skip{position:absolute;left:-9999px;top:0;z-index:99;background:var(--accent);color:var(--accent-fg);padding:10px 16px;border-radius:0 0 8px 0}
.skip:focus{left:0}

/* ============ 站点头部 ============ */
.site-head{
  position:sticky;top:0;z-index:40;
  background:var(--head-bg);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.head-in{max-width:var(--maxw);margin:0 auto;padding:14px 28px;display:flex;align-items:center;gap:14px}
.brand{display:flex;align-items:center;gap:12px;font-weight:600;letter-spacing:.02em;min-width:0}
/* 46→48px：logo 是带弧形文字的圆形徽标，34px 下文字糊成一团（2026-10-06 换新 logo 后实测）。
   flex 布局会自动撑开，不影响右侧 nav。 */
.brand img{height:48px;width:auto;flex:0 0 auto}
/* logo 是透明底黑色线稿：暗色主题反色成白线，否则在黑底上看不见 */
html[data-theme="b"] .brand img,
html[data-theme="b"] .foot-brand img{filter:brightness(0) invert(1)}
.brand .bt{line-height:1.15;min-width:0}
.brand .bt b{display:block;font-size:16px;letter-spacing:.04em;white-space:nowrap}
.brand .bt span{display:block;font-size:11px;color:var(--fg3);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
.nav{display:flex;gap:26px;margin-left:auto;font-size:14.5px}
.nav a{padding:6px 0;color:var(--fg2);border-bottom:1px solid transparent;white-space:nowrap}
.nav a:hover{color:var(--fg)}
.nav a.on{color:var(--fg);border-bottom-color:var(--accent)}
.head-lang{border-left:1px solid var(--line);padding-left:16px;margin-left:4px;font-size:13px;color:var(--fg3);white-space:nowrap}
.head-lang b{color:var(--accent);font-weight:600}
.head-lang a:hover{color:var(--fg)}
.head-theme{padding-right:4px;font-size:13px;color:var(--fg3);white-space:nowrap;display:inline-block}
.head-theme .td,.head-theme .tn{color:var(--fg3)}
.head-theme.is-day .td,.head-theme.is-night .tn{color:var(--accent);font-weight:600}
.head-theme:hover{color:var(--fg)}

/* ============ Hero ============ */
.hero{position:relative;min-height:74vh;display:flex;align-items:flex-end;overflow:hidden;background:var(--bg3)}
.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero .ov{position:absolute;inset:0;background:var(--overlay)}
.hero .hi{position:relative;z-index:2;padding:110px 28px 66px;max-width:var(--maxw);margin:0 auto;width:100%;color:#fff}
.kicker{font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--accent);margin-bottom:18px}
html[data-theme="a"] .hero .kicker{color:#7FE3D6}
h1.hero-t{font-family:var(--font-serif);font-weight:600;font-size:clamp(30px,4.6vw,56px);line-height:1.22;letter-spacing:.01em;margin:0 0 18px;max-width:15em;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.hero-s{font-size:clamp(14px,1.5vw,17px);color:rgba(255,255,255,.88);max-width:36em;margin:0 0 30px}
.btns{display:flex;gap:14px;flex-wrap:wrap}
.btn{display:inline-block;padding:13px 30px;border-radius:999px;font-size:14.5px;letter-spacing:.04em;cursor:pointer;border:1px solid transparent;transition:.2s}
.btn.pri{background:var(--accent);color:var(--accent-fg)}
.btn.pri:hover{filter:brightness(1.08)}
.btn.gh{border-color:rgba(255,255,255,.5);color:#fff}
.btn.gh:hover{background:rgba(255,255,255,.12)}
.btn.line{border-color:var(--line);color:var(--fg)}
.btn.line:hover{background:var(--accent-soft);border-color:var(--accent)}

/* 没有任何可用 Hero 图时的兜底（主理人还没上传封面照）：
   保持与有图时完全相同的盒子高度（min-height 74vh），上半是「暂无图片」占位、
   下半是文案，文字改用主题前景色，避免白字压在浅底上看不清；真图上线后无跳动。 */
.hero.noimg{flex-direction:column;justify-content:space-between;background:var(--bg3)}
.hero.noimg .hero-ph{flex:1 1 auto;min-height:0;display:flex}
.hero.noimg .hero-ph .ph-ph{flex:1 1 auto;height:auto;border:0;border-radius:0;font-size:14px}
.hero.noimg .hi{color:var(--fg);padding:26px 28px 62px}
.hero.noimg .kicker{color:var(--accent)}
.hero.noimg h1.hero-t{text-shadow:none}
.hero.noimg .hero-s{color:var(--fg2)}
.hero.noimg .btn.gh{border-color:var(--line);color:var(--fg)}
.hero.noimg .btn.gh:hover{background:var(--accent-soft);border-color:var(--accent)}

/* ============ 通用区块 ============ */
.sec{padding:84px 0}
.sec.alt{background:var(--bg2)}
.sec-h{display:flex;align-items:flex-end;gap:20px;margin-bottom:40px;flex-wrap:wrap}
.sec-h .st{font-family:var(--font-serif);font-size:clamp(22px,2.6vw,32px);font-weight:600;margin:0;letter-spacing:.01em}
.sec-h .ss{color:var(--fg3);font-size:14px;margin:0 0 5px}
.sec-h .more{margin-left:auto;font-size:13.5px;color:var(--accent);white-space:nowrap}
.rule{height:1px;background:var(--line);margin:0}
.crumb{font-size:13px;color:var(--fg3);margin:0 0 26px}
.crumb a:hover{color:var(--accent)}
.crumb span{margin:0 7px;opacity:.55}

/* 信任点 */
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}
.trust .it .n{font-family:var(--font-serif);font-size:13px;color:var(--accent);letter-spacing:.2em;margin-bottom:10px}
.trust .it h3,.trust .it h4{margin:0 0 8px;font-size:17px;font-weight:600}
.trust .it p{margin:0;color:var(--fg2);font-size:14.5px}

/* 猫卡片 */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);transition:transform .25s ease}
a.card{display:block}
.card:hover{transform:translateY(-4px)}
.card .ph{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--bg3)}
.card .ph img{width:100%;height:100%;object-fit:cover;border-radius:0}
.card .tag{position:absolute;top:12px;left:12px;background:rgba(12,12,12,.62);color:#fff;font-size:11.5px;letter-spacing:.08em;padding:5px 11px;border-radius:999px;backdrop-filter:blur(6px)}
.card .tag.on{background:var(--accent);color:var(--accent-fg)}
.card .bd{padding:16px 17px 19px}
.card .nm{font-size:16.5px;font-weight:600;margin-bottom:5px}
.card .mt{font-size:12.8px;color:var(--fg3);letter-spacing:.02em}
.card .mt b{color:var(--fg2);font-weight:500}
.nb{white-space:nowrap}

/* 文章 */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.post{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);transition:transform .25s ease}
a.post{display:block}
a.post:hover{transform:translateY(-4px)}
.post .ph{aspect-ratio:16/10;overflow:hidden;background:var(--bg3)}
.post .ph img{width:100%;height:100%;object-fit:cover}
.post .bd{padding:18px 19px 22px}
.post .cat{font-size:11.5px;letter-spacing:.14em;color:var(--accent);text-transform:uppercase;margin-bottom:9px}
.post h3,.post h4{margin:0 0 9px;font-size:16.5px;line-height:1.5;font-weight:600}
.post p{margin:0;color:var(--fg2);font-size:13.8px;line-height:1.65}
.post .dt{margin-top:12px;font-size:12.5px;color:var(--fg3)}

/* ============ 猫咪详情 ============ */
.detail{display:grid;grid-template-columns:1.15fr .85fr;gap:52px;align-items:start}
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.gal .m{aspect-ratio:1;overflow:hidden;border-radius:var(--radius-img);background:var(--bg3);cursor:pointer;position:relative;opacity:.62;transition:opacity .18s ease;outline:none}
.gal .m:hover,.gal .m:focus-visible{opacity:1}
.gal .m.on{opacity:1}
/* 选中态用 inset 阴影描边：不占布局空间，主图尺寸不会因切换跳动 */
.gal .m.on::after{content:"";position:absolute;inset:0;border-radius:var(--radius-img);box-shadow:inset 0 0 0 2px var(--accent);pointer-events:none}
.gal .m img{width:100%;height:100%;object-fit:cover}
.gal .main{grid-column:1/-1;aspect-ratio:4/5;border-radius:var(--radius-img);overflow:hidden;background:var(--bg3)}
.gal .main img{width:100%;height:100%;object-fit:cover}
.d-name{font-family:var(--font-serif);font-size:clamp(26px,3vw,34px);font-weight:600;margin:0 0 6px;line-height:1.3}
.d-code{color:var(--fg3);font-size:13.5px;letter-spacing:.1em;margin-bottom:22px;word-break:break-all}
.kv{display:grid;grid-template-columns:96px 1fr;gap:11px 16px;font-size:14.5px;margin:0 0 26px}
.kv dt{color:var(--fg3)}
.kv dd{margin:0;color:var(--fg);min-width:0;word-break:break-word}
.pill{display:inline-block;font-size:12px;padding:4px 12px;border-radius:999px;background:var(--accent-soft);color:var(--accent);border:1px solid transparent;margin:0 6px 8px 0}
.block{border-top:1px solid var(--line);padding:22px 0}
.block h5,.block .blk{margin:0 0 14px;font-size:13px;letter-spacing:.16em;color:var(--fg3);text-transform:uppercase;font-weight:600}
.tl{position:relative;padding-left:20px}
.tl:before{content:"";position:absolute;left:4px;top:6px;bottom:6px;width:1px;background:var(--line)}
.tl .ev{position:relative;margin-bottom:14px;font-size:14px;color:var(--fg2)}
.tl .ev:before{content:"";position:absolute;left:-20px;top:8px;width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--bg2)}
.tl .ev b{color:var(--fg);font-weight:600}
.tl .ev .tp{color:var(--accent);font-size:12.5px;letter-spacing:.06em;margin-left:2px}
.tl .ev .orig{display:block;color:var(--fg3);font-size:13px;margin-top:2px}

/* ============ 小程序码 ============ */
.mini{display:flex;gap:26px;align-items:center;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:26px 28px;box-shadow:var(--shadow)}
.mini .qr{width:126px;height:126px;flex:0 0 126px;border-radius:10px;background:
  repeating-linear-gradient(45deg,var(--bg3),var(--bg3) 6px,var(--bg2) 6px,var(--bg2) 12px);
  border:1px solid var(--line);display:flex;align-items:center;justify-content:center;text-align:center;
  font-size:11.5px;color:var(--fg3);line-height:1.5;padding:8px;overflow:hidden}
.mini .qr img{width:100%;height:100%;object-fit:contain;border-radius:8px;background:#fff}
.mini .qr .ph-ph{border-radius:8px;border:0;background:transparent}
.mini h3,.mini h4{margin:0 0 8px;font-size:17px}
.mini p{margin:0 0 6px;color:var(--fg2);font-size:14px}
.mini .hint{color:var(--fg3);font-size:12.5px}

/* ============ 联系页 ============ */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:44px}
.cbox{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:26px 28px;box-shadow:var(--shadow)}
.cbox h3,.cbox h4{margin:0 0 16px;font-size:15px;letter-spacing:.06em}
.crow{display:flex;gap:14px;padding:13px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.crow:last-child{border-bottom:0}
.crow .k{color:var(--fg3);width:74px;flex:0 0 74px}
.crow .v{min-width:0;word-break:break-word}
.map{aspect-ratio:16/11;border-radius:var(--r);border:1px solid var(--line);background:
  repeating-linear-gradient(0deg,var(--bg3),var(--bg3) 1px,transparent 1px,transparent 26px),
  repeating-linear-gradient(90deg,var(--bg3),var(--bg3) 1px,transparent 1px,transparent 26px),var(--bg2);
  display:flex;align-items:center;justify-content:center;color:var(--fg3);font-size:13px;text-align:center;padding:20px}

/* 真地图（腾讯地图 GL JS）：容器必须有**确定的像素高度**，否则地图不渲染
   （aspect-ratio 在部分布局下算不出高，所以这里直接给 height）。同时清掉占位网格底纹。 */
.map.has-map{aspect-ratio:auto;height:clamp(280px,34vw,420px);display:block;padding:0;overflow:hidden;background:var(--bg3);position:relative}
/* 地图兜底层：绝对定位铺满，地图渲染成功后被 site.js 移除（见 map-fb 移除逻辑）。 */
.map-fb{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  padding:24px;text-align:center;font-size:13px;line-height:1.7;color:var(--fg3)}
.map-addr{margin:14px 0 6px;font-size:14.5px;color:var(--fg);word-break:break-word}
.map-addr span{cursor:pointer;border-bottom:1px dashed var(--line)}
.map-hint{margin:0;font-size:12.5px;color:var(--fg3);line-height:1.6}

/* 地图未配置（缺 key）时的降级卡片：不加载第三方脚本，信息照样给全 */
.mapcard{border:1px solid var(--line);border-radius:var(--r);background:var(--bg2);padding:24px 26px;box-shadow:var(--shadow)}
.mapcard h3{margin:0 0 12px;font-size:16.5px}
.mapcard-addr{margin:0 0 14px;font-size:14.5px;color:var(--fg);word-break:break-word}
.mapcard-addr span{cursor:pointer;border-bottom:1px dashed var(--line)}
.mapcard ul{margin:0;padding-left:18px;color:var(--fg2);font-size:13.5px;line-height:1.8}
.mapcard ul li+li{margin-top:6px}

/* ============ 「暂无图片」占位 ============
   服务端输出，双主题各有对比度（A 浅灰底+深灰字 / B 深灰底+浅灰字）；
   放在已定宽高比的容器里 fill 100% → 换成真图不会跳。
   没有图就显示它，绝不塞假图。 */
.ph-ph{
  width:100%;height:100%;
  display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center;text-align:center;
  padding:10px;background:var(--bg3);color:var(--fg2);
  border:1px dashed var(--line);border-radius:inherit;
  font-size:12.5px;letter-spacing:.08em;line-height:1.45;
}
.ph-ph .ph-ico{opacity:.75;flex:0 0 auto}
.ph-ph .ph-t{display:block}
/* 满铺：首页 Hero 没有可用图时铺满整块，不出现黑块空白 */
.ph-ph.full{
  position:absolute;inset:0;border:0;border-radius:0;
  justify-content:flex-start;padding-top:clamp(48px,11vh,110px);
  font-size:13.5px;background:var(--bg3);
}
/* 小尺寸：小程序码那种方框 */
.ph-ph.sm{font-size:11px;gap:4px;padding:8px;letter-spacing:.04em}
.ph-ph.sm .ph-ico{width:18px;height:18px}

/* ============ 空态 ============ */
.empty{border:1px dashed var(--line);border-radius:var(--r);padding:48px 28px;text-align:center;background:var(--bg2)}
.empty .et{font-size:16px;font-weight:600;margin:0 0 8px}
.empty .ep{margin:0 auto;max-width:38em;color:var(--fg3);font-size:14px}
.empty .ea{margin-top:18px}
.note{color:var(--fg3);font-size:13.5px}

/* ============ 文章正文 ============ */
.article-body{max-width:760px;margin:0 auto}
.article-body p{margin:0 0 20px;font-size:16.5px;line-height:1.85;color:var(--fg)}
.article-body h2{font-family:var(--font-serif);font-size:clamp(20px,2.2vw,26px);margin:38px 0 14px}
.article-head{max-width:760px;margin:0 auto 26px}
.article-head h1{font-family:var(--font-serif);font-size:clamp(24px,3.2vw,38px);line-height:1.32;margin:0 0 12px}
.article-meta{color:var(--fg3);font-size:13px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.article-cover{max-width:760px;margin:0 auto 32px;aspect-ratio:16/9;overflow:hidden;border-radius:var(--r);background:var(--bg3)}
.article-cover img{width:100%;height:100%;object-fit:cover}
.tagline{margin-top:34px;display:flex;gap:8px;flex-wrap:wrap}

/* ============ 页脚 ============ */
.site-foot{border-top:1px solid var(--line);background:var(--bg2);padding:52px 0 40px;font-size:13.5px;color:var(--fg2)}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px}
.site-foot h6,.site-foot h3{margin:0 0 14px;font-size:13px;letter-spacing:.1em;color:var(--fg3);font-weight:600}
.site-foot a{color:var(--fg2)}
.site-foot a:hover{color:var(--accent)}
.site-foot p{margin:0 0 7px;line-height:1.75}
.legal{margin-top:34px;padding-top:22px;border-top:1px solid var(--line);display:flex;gap:18px;flex-wrap:wrap;color:var(--fg3);font-size:12.5px}
.legal a{color:var(--fg3);text-decoration:underline;text-underline-offset:2px}

/* ============ 响应式 ============ */
@media(max-width:1080px){
  .grid{grid-template-columns:repeat(3,1fr)}
  .detail{grid-template-columns:1fr;gap:34px}
}
@media(max-width:820px){
  .grid,.posts,.trust{grid-template-columns:repeat(2,1fr)}
  .contact{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr 1fr}
  .sec{padding:60px 0}
  .hero{min-height:56vh}
  .hero .hi{padding:84px 28px 52px}
  /* 不做汉堡菜单：栏目直接换到第二排铺满，保证窄屏也能全站导航 */
  /* 手机头部压缩：缩小 logo、收紧内边距、日/夜与中/EN 给足点击高度 */
  .head-in{flex-wrap:wrap;row-gap:6px;padding:8px 20px}
  .brand img{height:36px}
  .brand .bt b{font-size:14px}
  .head-theme{margin-left:auto;padding:9px 4px;display:inline-flex;align-items:center;min-height:38px}
  .head-lang{display:inline-flex;align-items:center;min-height:38px}
  .nav{
    order:3;flex-basis:100%;margin-left:0;gap:20px;font-size:13.5px;
    overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .nav::-webkit-scrollbar{display:none}
  .nav a{padding:8px 0}
  .head-lang{border-left:1px solid var(--line)}
}
@media(max-width:560px){
  .posts,.trust,.fgrid{grid-template-columns:1fr}
  /* 小猫卡片在手机上改双列：一屏能看更多，少滑很多 */
  .grid{grid-template-columns:repeat(2,1fr);gap:12px}
  /* 左右留白 + 刘海屏安全区（微信/全屏模式下不贴边） */
  .wrap,.head-in,.hero .hi{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
  .mini{flex-direction:column;text-align:center}
  .sec{padding:48px 0}
  .sec-h{margin-bottom:26px}
  .kv{grid-template-columns:82px 1fr;font-size:14px}
  .crow .k{width:62px;flex:0 0 62px}
  .btn{padding:12px 22px}
  /* 头部第一排塞下「品牌 + 日/夜 + 中/EN」，收掉分隔竖线 */
  .head-in{gap:6px}
  .brand{gap:8px}
  .brand .bt b{font-size:14px}
  /* 手机隐藏品牌副标题，给导航与控制项腾出整排空间 */
  .brand .bt span{display:none}
  /* 日/夜、中/EN 给足点击高度，且去掉多余竖线（padding 只加在 <a> 本身，避免撑高外层 .head-lang） */
  .head-theme{font-size:12px;padding:9px 4px;display:inline-flex;align-items:center}
  .head-lang{font-size:12px;display:inline-flex;align-items:center}
  .head-lang{border-left:0;margin-left:0}
  .head-lang a{display:inline-flex;align-items:center;min-height:38px;padding:0 4px}
  .nav{gap:16px;font-size:13px}
  /* 导航链接加高点击区（≥40px），手指好点 */
  .nav a{padding:9px 2px}
  /* 首屏大图压低，露出更多内容，不再一屏空荡荡 */
  .hero{min-height:48vh}
  .hero .hi{padding-top:56px;padding-bottom:36px}
  /* 小字标签提到 12px，低于可读下限的 10–11.5px 不再出现 */
  .card .tag,.post .cat{font-size:12px}
  /* 页脚链接加点击高度、字号略增 */
  .site-foot{font-size:14px;padding-bottom:calc(40px + env(safe-area-inset-bottom))}
  .site-foot a{display:inline-block;padding:8px 0}
}
@media print{
  .site-head,.btns,.mini{display:none}
}

/* 文章末尾「常见问题」：给搜索引擎与 AI 的 Q&A 区块，双主题都要看得清 */
.faq .faq-item{border-top:1px solid var(--line);padding:16px 0}
.faq .faq-item:first-of-type{border-top:0;padding-top:4px}
.faq .faq-item h3{margin:0 0 8px;font-size:16.5px;font-weight:600;line-height:1.5;color:var(--fg)}
.faq .faq-item p{margin:0;color:var(--fg2);font-size:14.8px;line-height:1.85}

/* ---- 体重曲线（猫详情页）：点任意一点 → 显示该点的日期与体重 ---- */
.wcurve{position:relative;margin:0 0 20px;border:1px solid var(--line);border-radius:14px;background:var(--bg3);padding:14px 12px 6px}
.wc-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:0 2px 6px}
.wc-head b{font-size:14.5px;font-weight:600;color:var(--fg)}
.wc-hint{font-size:12.5px;color:var(--fg3)}
.wc-svg{display:block;width:100%;height:auto;overflow:visible}
.wc-axis{stroke:var(--line);stroke-width:1}
.wc-tick{fill:var(--fg3);font-size:12px}
.wc-line{fill:none;stroke:var(--accent);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.wpt{fill:var(--bg3);stroke:var(--accent);stroke-width:2.4;cursor:pointer}
.wpt:hover,.wpt.on{fill:var(--accent);stroke:var(--accent-fg);stroke-width:2}
.wc-tip{position:absolute;transform:translate(-50%,-150%);background:var(--bg);color:var(--fg);border:1px solid var(--accent);border-radius:999px;padding:4px 12px;font-size:12.5px;white-space:nowrap;pointer-events:none;box-shadow:0 8px 22px rgba(0,0,0,.28);z-index:3}
