/* ================================================================
   东坡行迹 H5 · 竖版时间轴 + 示意地图
   设计语言复用「东坡有画说 / 东坡朋友圈」：松绿主色 / 金点缀 / 米底
   ================================================================ */
:root{
  --c-bg:#f7f3ed;
  --c-bg-deep:#efe8dd;
  --c-text:#2a2020;
  --c-sub:#8a7e72;
  --c-primary:#008073;
  --c-primary-light:#1ba495;
  --c-primary-dark:#006660;
  --c-accent:#c9a050;
  --c-accent-dark:#9a7a30;
  --c-card:#fffdf8;
  --c-line:#e0d6c6;
  --c-line-dark:#c8bca8;
  --c-ink:#1a1410;
  --radius:14px;
  --shadow-sm:0 3px 12px rgba(0,80,70,.08);
  --shadow-md:0 8px 28px rgba(0,80,70,.16);
  --ease:cubic-bezier(.4,0,.2,1);
  --maxw:480px;
  /* 节点类型色 */
  --t-birth:#c9a050;
  --t-office:#008073;
  --t-exile:#b5483a;
  --t-travel:#5b8c5a;
  --t-ghost:#9a9488;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;}
body{
  font-family:-apple-system,"PingFang SC","Microsoft YaHei","STSong",serif;
  background:var(--c-bg);color:var(--c-text);line-height:1.65;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}

#app{max-width:var(--maxw);margin:0 auto;min-height:100vh;position:relative;background:var(--c-bg);}
.page{display:none;animation:fadeUp .4s var(--ease);}
.page.active{display:block;}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}

/* ===== 头部 ===== */
.home-header{
  position:relative;text-align:center;padding:42px 20px 30px;
  background-color:var(--c-primary);
  background-image:url("images/bamboo-bg.png");
  background-repeat:repeat;background-size:300px auto;background-position:center top;
  overflow:hidden;
}
.brand-mark{
  font-size:36px;font-weight:900;color:#f4faf6;letter-spacing:12px;margin-right:-12px;
  text-shadow:0 2px 14px rgba(0,0,0,.35);margin-bottom:2px;white-space:nowrap;
}
.brand-sub{display:flex;flex-direction:column;align-items:center;gap:3px;color:rgba(244,250,246,.92);margin:0 auto;width:100%;}
.brand-sub-line{font-size:15px;font-weight:500;letter-spacing:3px;color:#e6c877;
  text-shadow:0 1px 6px rgba(0,0,0,.35);margin-right:-3px;white-space:nowrap;}

/* 吸顶检索区 */
.sticky-bar{position:sticky;top:0;z-index:50;background:var(--c-bg);padding:0 0 8px;}
.search-wrap{
  display:flex;align-items:center;gap:8px;margin:12px 16px 6px;
  padding:10px 14px;border-radius:30px;background:var(--c-card);
  border:1.5px solid var(--c-line);box-shadow:var(--shadow-sm);
}
.search-ico{font-size:15px;opacity:.6;}
.search-input{flex:1;border:none;outline:none;background:transparent;font-size:14px;color:var(--c-ink);}
.search-input::placeholder{color:#cbb8a0;font-size:13px;}
.search-clear{flex:none;width:22px;height:22px;border-radius:50%;background:var(--c-line);color:#fff;
  font-size:15px;line-height:1;display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;}
.search-clear[hidden]{display:none;}

/* 阶段 tab：4 列网格严格两行、两边对齐 */
.phase-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:4px 12px 12px;}
.phase-tab{
  padding:6px 3px 6px 6px;border-radius:14px;font-size:11px;font-weight:600;color:var(--c-sub);
  background:var(--c-card);border:1px solid var(--c-line);border-left-width:4px;transition:all .25s var(--ease);
  line-height:1.25;text-align:center;min-width:0;
}
.phase-tab .pt-years{display:block;font-size:9.5px;color:var(--c-accent-dark);font-weight:700;margin-top:1px;white-space:nowrap;}
.phase-tab.active{background:var(--c-primary);color:#f4f7e8;border-color:var(--c-primary);box-shadow:0 4px 14px rgba(0,128,115,.4);}
.phase-tab.active .pt-years{color:#e6c877;}

/* ===== 竖版时间轴（五阶段五色） ===== */
.axis{position:relative;padding:6px 16px 10px 12px;}
.phase-sep{display:flex;align-items:center;gap:10px;margin:18px 4px 10px;}
.phase-sep::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;
  background:var(--ph-color,var(--c-accent));box-shadow:0 0 0 4px rgba(0,0,0,.06);}
.phase-sep h3{font-size:17px;font-weight:800;color:var(--c-primary-dark);letter-spacing:.5px;white-space:nowrap;min-width:0;flex:0 1 auto;overflow:hidden;}
.phase-sep .ps-years{font-size:13.5px;color:var(--c-ink);margin-left:auto;font-weight:800;flex:none;}

.spine{position:relative;padding:4px 0;}
.spine::before{content:"";position:absolute;left:82px;top:0;bottom:0;width:3px;
  background:var(--ph-color,var(--c-primary));border-radius:3px;opacity:.55;transform:translateX(-50%);}

.node{position:relative;display:flex;align-items:flex-start;margin:0 0 14px;}
.node:not(.overview){cursor:pointer;}
.node:not(.overview):active .node-card{transform:scale(.985);}
.node-year{flex:none;width:72px;text-align:right;padding-right:6px;padding-top:11px;}
.node-year .ny{font-size:13px;font-weight:800;color:var(--c-primary);line-height:1.15;white-space:nowrap;}
.node-year .ny-sm{font-size:11px;letter-spacing:0;}
.node-year .na{font-size:11px;font-weight:700;color:#6f6458;line-height:1.3;white-space:nowrap;}
/* 标签（类型/总览）：统一放左列时段下方 */
.node-year .nt{display:inline-block;margin-top:4px;font-size:10px;font-weight:700;color:#fff;
  padding:2px 6px;border-radius:9px;line-height:1.35;white-space:nowrap;}
.node-year .nt-sm{font-size:9px;padding:2px 4px;border-radius:7px;line-height:1.4;}
.node-year .nt-ov{font-size:9px;padding:2px 4px;border-radius:7px;letter-spacing:0;}
.node-dot-col{flex:none;width:20px;display:flex;justify-content:center;padding-top:12px;}
.node-dot{width:16px;height:16px;border-radius:50%;
  border:3px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.18);z-index:2;transition:transform .2s var(--ease);}
.node:hover .node-dot,.node.open .node-dot{transform:scale(1.2);}
.node-card{flex:1;min-width:0;overflow:hidden;background:var(--c-card);border:1px solid var(--c-line);border-radius:var(--radius);
  padding:11px 13px;margin:0 2px 0 10px;box-shadow:var(--shadow-sm);position:relative;transition:transform .2s var(--ease),box-shadow .2s;}
.node:hover .node-card,.node.open .node-card{transform:translateX(2px);box-shadow:var(--shadow-md);}
.node-card .nc-top{display:flex;align-items:center;gap:7px;flex-wrap:nowrap;overflow:hidden;}
.nc-title{font-size:17px;font-weight:900;color:var(--c-ink);white-space:nowrap;min-width:0;flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;}
.nc-stars{flex:none;font-size:12px;color:var(--c-accent);letter-spacing:1px;line-height:1;}
.nc-place{font-size:12px;color:var(--c-sub);margin-top:3px;text-wrap:balance;}
.nc-oneline{font-size:12.5px;color:var(--c-primary-dark);margin-top:6px;line-height:1.55;text-wrap:balance;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
/* 途经子节点：浅色虚线，弱化显示 */
.node.sub .node-card{background:var(--c-bg-deep);border-style:dashed;}
.node.sub .node-dot{background:var(--c-ghost);box-shadow:0 0 0 2px rgba(154,148,136,.25);}
.node.sub .nc-title{font-size:15px;font-weight:700;}
/* 长路总卡 */
/* 长路总卡 → 本段路线总览说明块（不可点、统一样式） */
.node.overview{cursor:default;}
.node.overview .node-card{background:#fdf9f1;border:1.5px dashed var(--ph,var(--c-accent));
  box-shadow:none;padding:12px 14px;}
.node.overview:hover .node-card{transform:none;box-shadow:none;}
.node.overview .node-dot{background:var(--ph,var(--c-accent));}
.ov-text{font-size:12.5px;color:var(--c-text);line-height:1.75;margin-top:6px;text-align:justify;}
.node.open .node-card{border-color:var(--c-primary);}

/* 悬停/轻点 极简提示（标题 + 点击提示），锚在卡片右上角，不压标题 */
.node-popup{position:absolute;right:2px;bottom:-16px;width:auto;max-width:78%;background:var(--c-ink);
  border-radius:10px;box-shadow:var(--shadow-md);padding:8px 12px;z-index:20;white-space:nowrap;
  display:none;animation:pop .18s var(--ease);}
.node.open .node-popup{display:block;}
@keyframes pop{from{opacity:0;transform:translateY(6px) scale(.98);}to{opacity:1;transform:translateY(0) scale(1);}}
.node-popup .pp-title{font-size:13.5px;font-weight:800;color:#fdf9f0;line-height:1.4;}
.node-popup .pp-tip{font-size:10.5px;color:rgba(253,249,240,.72);margin-top:2px;white-space:nowrap;}

/* ===== 诗词全文卡 ===== */
/* 多篇诗文：滑动浏览容器 */
.poem-scroll{max-height:520px;overflow-y:auto;-webkit-overflow-scrolling:touch;
  margin:0 -2px;padding:0 6px 0 2px;scrollbar-width:thin;}
.poem-scroll::-webkit-scrollbar{width:4px;}
.poem-scroll::-webkit-scrollbar-thumb{background:var(--c-line);border-radius:4px;}
.poem-card{background:var(--c-card);border:1px solid var(--c-line);border-left:4px solid var(--c-accent);
  border-radius:var(--radius);padding:14px 16px 12px;margin-bottom:12px;box-shadow:var(--shadow-sm);}
.poem-group-head{font-size:13px;font-weight:800;color:var(--c-primary);letter-spacing:3px;margin:16px 0 9px;padding-left:11px;border-left:3px solid var(--c-primary);}
.poem-title{font-size:15px;font-weight:800;color:var(--c-accent-dark);font-family:"STSong","SimSun",serif;margin-bottom:6px;}
.poem-tag{display:inline-block;font-size:10px;font-weight:400;padding:1px 7px;margin-left:6px;border-radius:9px;background:rgba(0,128,115,.1);color:var(--c-primary);vertical-align:2px;white-space:nowrap;letter-spacing:0;}
.poem-sub{font-size:12.5px;color:var(--c-sub);line-height:1.6;margin-bottom:6px;padding-bottom:6px;border-bottom:1px dashed var(--c-line);}
.poem-text{font-size:15px;line-height:1.95;color:var(--c-ink);font-family:"STSong","SimSun",serif;}
/* 诗：一联一行（两句一行） */
.poem-shi-line{margin:0 0 4px;}
.poem-shi-line:last-child{margin-bottom:0;}
/* 词：上下阕各成一段，阕间留空，段内连续排 */
.poem-ci-pian{margin:0 0 14px;}
.poem-ci-pian:last-child{margin-bottom:0;}
/* 文：按自然段，段首缩进两格 */
.poem-para{margin:0 0 10px;text-indent:2em;}
.poem-para:last-child{margin-bottom:0;}
.works-more{font-size:13px;color:var(--c-sub);line-height:1.7;margin:2px 2px 14px;}

/* ===== 尾部（复用朋友圈） ===== */
.home-footer{text-align:center;padding:26px 20px 44px;color:var(--c-sub);}
.page-detail .home-footer{padding-top:8px;}
.interlink-row{display:flex;gap:10px;margin:0 0 18px;padding:0 2px;}
.interlink-btn{flex:1;display:block;padding:12px 6px;border-radius:30px;text-align:center;
  background:linear-gradient(135deg,var(--c-primary),var(--c-primary-light));color:#f4f7e8;
  font-size:14px;font-weight:700;letter-spacing:.5px;box-shadow:0 6px 16px rgba(0,128,115,.32);white-space:nowrap;}
.interlink-btn:active{transform:scale(.97);}
.back-home-btn{display:block;width:100%;padding:12px;border-radius:30px;background:transparent;
  border:1.5px solid var(--c-line);color:var(--c-text);font-size:14px;font-weight:600;margin:0;cursor:pointer;}
.back-home-btn:active{transform:scale(.98);background:var(--c-bg-deep);}

/* 返回 + 分享 双按钮行（footer 返回按钮拆分） */
.footer-btn-row{display:flex;gap:10px;margin:0 0 12px;}
.footer-btn-row .half{flex:1;min-width:0;}
.share-guide-btn{flex:1;min-width:0;padding:12px;border-radius:30px;border:none;
  background:linear-gradient(135deg,#b5483a,#9c3a2e);color:#fff;font-size:14px;font-weight:600;cursor:pointer;
  box-shadow:0 3px 10px rgba(181,72,58,.28);}
.share-guide-btn:active{transform:scale(.98);opacity:.9;}

/* 分享指引浮层（同明信片 H5：箭头指右上角 ···） */
.share-tip-overlay{display:none;position:fixed;inset:0;z-index:220;background:rgba(0,0,0,.42);}
.share-tip-overlay.active{display:block;animation:fadeUp .25s ease;}
.share-tip-arrow{
  position:absolute;top:10px;right:44px;font-size:38px;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.45));
  animation:tap 1.2s ease-in-out infinite;transform:rotate(38deg);
}
.share-tip-bubble{
  position:absolute;top:66px;right:16px;
  background:rgba(16,42,38,.92);color:#fff;
  font-size:14px;font-weight:600;line-height:1.9;
  padding:12px 18px;border-radius:14px;text-align:right;
  box-shadow:0 10px 26px rgba(0,0,0,.3);
}
.share-tip-bubble b{color:#7fd8c9;font-size:16px;}
@keyframes tap{0%,100%{transform:rotate(38deg) translateY(0);}50%{transform:rotate(38deg) translateY(7px);}}

/* 非微信：复制链接提示 toast */
.copy-toast{display:none;position:fixed;left:50%;bottom:88px;transform:translateX(-50%);
  z-index:230;background:rgba(16,42,38,.92);color:#fff;font-size:13.5px;font-weight:600;
  padding:11px 20px;border-radius:24px;white-space:nowrap;box-shadow:0 8px 20px rgba(0,0,0,.28);}
.copy-toast.active{display:block;animation:fadeUp .25s ease;}
.home-qr-block{display:flex;flex-direction:column;align-items:center;margin:0 auto 20px;}
.home-qr-img{display:block;width:120px;height:120px;border-radius:8px;background:#fff;padding:6px;box-shadow:0 2px 10px rgba(0,0,0,.06);}
.home-qr-tip{margin:10px 0 0;font-size:13px;line-height:1.7;color:var(--c-primary);letter-spacing:.5px;}
.home-logo{display:block;width:240px;height:auto;margin:0 auto;opacity:.92;}
.home-icp{display:inline-block;margin-top:14px;font-size:11px;color:var(--c-sub);letter-spacing:.5px;opacity:.85;}
.home-icp a{color:var(--c-sub);text-decoration:none;}
.home-icp-sep{margin:0 4px;opacity:.6;}

/* ===== 详情页 ===== */
.detail-topbar{display:flex;align-items:center;gap:10px;padding:14px 16px;position:sticky;top:0;z-index:20;
  background:var(--c-bg);border-bottom:1px solid var(--c-line);}
.back-btn{font-size:15px;font-weight:600;color:var(--c-primary);padding:6px 10px;border-radius:8px;}
.back-btn:active{background:var(--c-bg-deep);}
.detail-title{font-size:17px;font-weight:700;flex:1;text-align:center;padding-right:42px;}
.detail-body{padding:14px 16px 6px;}
.detail-hero{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-md);background:var(--c-bg-deep);margin-bottom:14px;position:relative;}
.detail-hero .hero-box{position:relative;width:100%;height:200px;overflow:hidden;
  background:linear-gradient(135deg,var(--c-primary),var(--c-accent));}
.detail-hero .hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:2;}
.detail-hero .hero-ph{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;
  padding:0 24px;text-align:center;
  background:linear-gradient(135deg,var(--c-primary),var(--c-accent));color:#fff;
  font-size:26px;font-weight:900;line-height:1.6;letter-spacing:3px;}
.detail-badges{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 14px;}
.badge{font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px;letter-spacing:.5px;}
.badge-type{background:rgba(0,128,115,.12);color:var(--c-primary-dark);}
.badge-chapter{background:rgba(201,160,80,.18);color:var(--c-accent-dark);}
.badge-level{background:var(--c-primary);color:#f4f7e8;}

.archive-box{background:var(--c-card);border:1px solid var(--c-line);border-radius:var(--radius);
  margin-bottom:14px;box-shadow:var(--shadow-sm);overflow:hidden;}
.archive-label{font-size:11px;font-weight:700;color:var(--c-sub);letter-spacing:2px;
  padding:9px 14px 7px;background:var(--c-bg-deep);border-bottom:1px solid var(--c-line);}
.ar-row{display:flex;align-items:stretch;border-bottom:1px solid var(--c-line);}
.ar-row:last-child{border-bottom:none;}
.ar-key{flex:none;width:76px;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;color:var(--c-primary-dark);background:rgba(0,128,115,.07);
  border-right:1px solid var(--c-line);padding:9px 4px;letter-spacing:1px;}
.ar-val{flex:1;font-size:15px;color:var(--c-text);line-height:1.7;padding:9px 12px;text-align:justify;text-justify:inter-ideograph;}

.story-card{background:var(--c-card);border:1px solid var(--c-line);border-radius:var(--radius);
  padding:18px;margin-bottom:16px;box-shadow:var(--shadow-sm);position:relative;}
.story-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--c-primary),var(--c-accent));border-radius:var(--radius) var(--radius) 0 0;}
.story-heading{font-size:17px;font-weight:800;color:var(--c-primary);margin-bottom:8px;letter-spacing:1px;}
.story-text{font-size:15.5px;line-height:1.9;color:var(--c-text);text-align:justify;text-justify:inter-ideograph;}
.story-text::first-letter{font-size:1.25em;font-weight:700;color:var(--c-primary);}
.overview-card{background:#fbf6ec;border:1px solid var(--c-accent);border-radius:var(--radius);padding:16px;margin-bottom:16px;}
.overview-card .ov-label{font-size:11px;font-weight:700;color:var(--c-accent-dark);letter-spacing:2px;margin-bottom:6px;}
.overview-text{font-size:15px;line-height:1.85;color:var(--c-text);text-align:justify;text-justify:inter-ideograph;}

.sec-heading{font-size:16px;font-weight:800;color:var(--c-primary);margin:22px 0 12px;
  letter-spacing:2px;padding-left:11px;position:relative;}
.sec-heading::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:4px;border-radius:3px;
  background:linear-gradient(180deg,var(--c-primary),var(--c-accent));}
.quote-card{background:#fbf6ec;border:1px solid var(--c-line);border-radius:var(--radius);
  padding:16px 16px 14px;margin-bottom:14px;position:relative;}
.quote-mark{font-size:38px;line-height:1;color:var(--c-accent);font-family:"STSong",serif;opacity:.5;position:absolute;top:4px;left:10px;}
.quote-text{font-size:15.5px;font-weight:600;color:var(--c-ink);line-height:1.8;padding-left:26px;position:relative;white-space:pre-wrap;}

/* 打卡资源（前置，嗨东坡打卡受众最爱） */
.spot-item{background:var(--c-card);border:1px solid var(--c-line);border-radius:var(--radius);
  padding:12px 14px;margin-bottom:10px;box-shadow:var(--shadow-sm);position:relative;}
.spot-item .spot-lv{position:absolute;top:12px;right:12px;font-size:11px;font-weight:800;color:var(--c-accent-dark);}
.spot-item .spot-txt{font-size:15px;line-height:1.75;color:var(--c-text);padding-right:48px;text-align:justify;text-justify:inter-ideograph;}
.spot-item .spot-name{font-weight:800;color:var(--c-ink);}
.spot-item .spot-rest{color:var(--c-text);}
.spot-item .spot-flag{display:inline-block;font-size:10px;color:var(--c-primary-dark);background:rgba(0,128,115,.1);
  padding:1px 7px;border-radius:9px;margin-right:5px;margin-top:5px;}

/* ===== 美食打卡 ===== */
.food-box{background:var(--c-card);border:1px solid var(--c-line);border-radius:var(--radius);
  padding:16px 14px 12px;margin-bottom:16px;box-shadow:var(--shadow-sm);position:relative;}
.food-box::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--c-accent),var(--c-primary));border-radius:var(--radius) var(--radius) 0 0;}
.food-tagline{font-size:14.5px;line-height:1.8;color:var(--c-accent-dark);font-weight:600;
  margin:0 2px 4px;padding-bottom:10px;border-bottom:1px dashed var(--c-line);}
.food-sub{font-size:13px;font-weight:800;color:var(--c-primary);letter-spacing:2px;margin:14px 0 9px;}
.food-item{background:#fbf6ec;border:1px solid var(--c-line);border-radius:10px;padding:10px 12px;margin-bottom:9px;}
.food-name{font-size:15px;font-weight:800;color:var(--c-ink);line-height:1.6;}
.food-cat{display:inline-block;font-size:10px;font-weight:400;padding:1px 7px;margin-left:6px;border-radius:9px;
  background:rgba(201,160,80,.15);color:var(--c-accent-dark);vertical-align:2px;white-space:nowrap;}
.food-strength{display:inline-block;font-size:10px;font-weight:400;padding:1px 7px;margin-left:6px;border-radius:9px;
  vertical-align:2px;white-space:nowrap;letter-spacing:0;}
.st-hi{background:rgba(0,128,115,.12);color:var(--c-primary);}
.st-mid{background:rgba(201,160,80,.16);color:var(--c-accent-dark);}
.st-lo{background:rgba(0,0,0,.06);color:var(--c-sub);}
.food-quote{font-size:13.5px;line-height:1.75;color:var(--c-primary-dark);margin-top:5px;font-family:"STSong","SimSun",serif;}
.food-work{font-size:11.5px;color:var(--c-sub);margin-left:4px;}
.food-pitch{font-size:13px;line-height:1.7;color:var(--c-sub);margin-top:4px;}
.food-story{border-left:3px solid var(--c-accent);background:#fbf6ec;border-radius:0 10px 10px 0;
  padding:10px 12px;margin-bottom:9px;}
.fs-title{font-size:14.5px;font-weight:800;color:var(--c-ink);margin-bottom:5px;line-height:1.6;}
.fs-text{font-size:14px;line-height:1.8;color:var(--c-text);text-align:justify;text-justify:inter-ideograph;}
.fs-src{font-size:11.5px;color:var(--c-sub);margin-top:5px;}
.food-poem-toggle{font-size:12.5px;font-weight:700;color:var(--c-primary);margin-top:7px;cursor:pointer;
  user-select:none;-webkit-user-select:none;}
.food-poem-more{font-size:13px;font-weight:700;color:var(--c-primary);margin:4px 0 2px;padding:9px 12px;
  border:1px dashed var(--c-line);border-radius:10px;text-align:center;cursor:pointer;
  user-select:none;-webkit-user-select:none;}
.food-poem-wrap{margin-top:8px;}
.food-poem-wrap .poem-card{background:#fff;}
.food-poem-wrap .poem-scroll{max-height:420px;}
.food-eat{border:1px dashed var(--c-line);border-radius:10px;padding:10px 12px;margin-bottom:9px;}
.fe-name{font-size:15px;font-weight:800;color:var(--c-ink);line-height:1.6;}
.fe-note{font-size:13.5px;line-height:1.7;color:var(--c-text);margin-top:4px;}
.fe-verify{font-size:11.5px;color:var(--c-sub);margin-top:4px;}
.food-nodoc{font-size:12.5px;color:var(--c-sub);line-height:1.7;margin:12px 2px 0;}

/* 轨迹导航 */
.route-box{background:var(--c-card);border:1px solid var(--c-line);border-radius:var(--radius);padding:14px;margin-bottom:14px;box-shadow:var(--shadow-sm);}
.route-line{font-size:15px;line-height:1.8;color:var(--c-text);text-align:justify;text-justify:inter-ideograph;}
.route-line .rl-label{color:var(--c-sub);font-weight:700;margin-right:6px;}

.rel-nodes{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.rel-node{font-size:12px;padding:7px 12px;border-radius:16px;background:var(--c-bg-deep);border:1px solid var(--c-line);color:var(--c-primary-dark);cursor:pointer;}
.rel-node:active{background:rgba(0,128,115,.12);}
.detail-body .interlink-row{margin-bottom:8px;}
.detail-back{display:block;width:100%;padding:12px;border-radius:30px;background:transparent;
  border:1.5px solid var(--c-line);color:var(--c-text);font-size:14px;font-weight:600;margin:0;}
.detail-back:active{transform:scale(.98);background:var(--c-bg-deep);}

.empty-tip{text-align:center;color:var(--c-sub);padding:40px 0;font-size:14px;}

.back-top-btn{position:fixed;left:0;top:50%;transform:translateY(-50%);width:24px;height:82px;
  border:none;border-radius:0 10px 10px 0;padding:10px 0;
  background:linear-gradient(180deg,var(--c-primary),var(--c-primary-light));
  color:#f4faf6;font-size:11px;font-weight:700;letter-spacing:2px;writing-mode:vertical-rl;
  line-height:1;cursor:pointer;box-shadow:1px 2px 8px rgba(0,128,115,.25);z-index:60;
  opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s;}
.back-top-btn.show{opacity:1;visibility:visible;}

@media (max-width:360px){
  .brand-mark{font-size:30px;letter-spacing:9px;margin-right:-9px;}
  .brand-sub-line{font-size:13px;letter-spacing:2px;margin-right:-2px;}
}

/* ===== 背景音乐悬浮按钮 ===== */
.bgm-fab{position:fixed;right:16px;bottom:18px;z-index:60;width:46px;height:46px;border:none;
  border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--c-primary),var(--c-primary-light));
  box-shadow:0 4px 14px rgba(0,80,70,.32);-webkit-tap-highlight-color:transparent;}
.bgm-fab .bgm-disc{font-size:34px;line-height:46px;color:#fff;line-height:1;display:flex;align-items:center;justify-content:center;
  width:100%;height:100%;border-radius:50%;}
.bgm-fab.playing .bgm-disc{animation:bgm-spin 3.2s linear infinite;}
.bgm-fab.playing{box-shadow:0 4px 16px rgba(0,80,70,.45);}
@keyframes bgm-spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.bgm-fab:active{transform:scale(.94);}
/* 返回顶部按钮让位，避免重叠 */
.back-top-btn{bottom:74px;}

/* 关闭态：斜线提示 */
.bgm-fab:not(.playing)::after{content:'';position:absolute;left:10px;top:50%;width:26px;height:2px;
  background:#fff;border-radius:2px;transform:rotate(-45deg);}