:root{
  --v7-ink:#17352f;
  --v7-muted:#65756e;
  --v7-line:#e3dacd;
  --v7-cream:#fbf8f1;
  --v7-green:#276c5a;
  --v7-orange:#cf7d43;
  --v7-nav:76px;
}

*,*::before,*::after{box-sizing:border-box}
html{font-size:16px;background:#f1eadf}
body{color:var(--v7-ink);font-size:14px}
.app,.page,.content,.section,.route-card,.next-card,.expense-summary{min-width:0;max-width:100%}
img,svg,canvas{max-width:100%}
.table-wrap{max-width:100%;overscroll-behavior-x:contain;touch-action:pan-x}
.lodge-main,.transport-main,.route-body,.section-head>div{min-width:0}
.lodge-main span,.transport-main p,.route-body p{overflow-wrap:anywhere}
.app{padding-bottom:calc(var(--v7-nav) + 48px)}
.content{padding-left:18px;padding-right:18px}
.topbar{min-height:64px;padding:10px 14px;gap:10px}
.brand span{font-size:14px}
.top-actions{margin-left:auto;gap:6px}
.ghost-btn{min-width:44px;min-height:44px;padding:8px 10px;font-size:12px}
.sync-pill{display:flex;align-items:center;gap:6px;min-height:44px;border:0;border-radius:999px;padding:0 10px;background:#eaf3ed;color:#2d6857;font-size:11px;font-weight:800;white-space:nowrap}
.sync-pill::before{content:"";width:8px;height:8px;border-radius:50%;background:#52a67d;box-shadow:0 0 0 4px rgba(82,166,125,.12)}
.sync-pill.syncing::before{background:#d09942;animation:v7pulse 1s infinite}
.sync-pill.offline,.sync-pill.failed{background:#fff0e5;color:#91532e}
.sync-pill.offline::before,.sync-pill.failed::before{background:#d26e42}
@keyframes v7pulse{50%{opacity:.35}}

.section{padding:22px 0}
.section-title{font-size:20px}
.section-sub,.todo-item p,.reminder p,.timeline span,.route-body p,.lodge-main span,.next-detail{font-size:12px;line-height:1.65}
.text-link,.todo-action,.status-chip,.toggle-state,.nav-place-btn,.cost-quick-open{min-height:44px;padding:9px 13px;font-size:12px}
.filter-chip,.preflight-chip,.day-chip,.choice,.payer-chip,.cat-pick,.guide-head-actions button{min-height:44px;font-size:12px}
.day-chip{min-width:74px;padding:9px 12px}
.day-chip strong{font-size:14px}.day-chip span{font-size:11px}
.day-strip{top:64px;padding-top:10px;padding-bottom:10px}
.day-strip::after,.home-action-row::after,.guide-ribbon::after{content:"向右滑 →";display:flex;align-items:center;flex:0 0 auto;padding:0 8px;color:#7b837e;font-size:11px}
.day-strip .day-chip:last-of-type{margin-right:0}
.next-card{padding:18px;border-radius:22px}
.next-label{font-size:13px}.next-time{font-size:34px}.next-route{font-size:17px}.day-brief-item small{font-size:11px}.day-brief-item b{font-size:13px}
.preflight-title b{font-size:14px}.preflight-title span{font-size:11px}
.data-status-chip{font-size:11px;padding:7px 9px}
.transport-v63-time{font-size:18px}.transport-v63-route{font-size:14px}.transport-v63-meta{font-size:12px}
.time-row strong{font-size:14px}.time-row span{font-size:12px}
.stay-main strong,.reminder b,.tomorrow-box h3,.todo-item h3{font-size:15px}
.todo-level,.todo-meta span,.fallback,.route-mode{font-size:11px}
.todo-action{min-width:64px}

.float-add{width:auto;height:52px;right:max(16px,calc((100vw - 720px)/2 + 16px));bottom:calc(var(--v7-nav) + env(safe-area-inset-bottom) + 14px);padding:0 18px;border-radius:999px;font-size:15px;font-weight:800;transition:opacity .18s,transform .18s}
.float-add.is-hidden{opacity:0;pointer-events:none;transform:translateY(10px)}
.bottom-nav{height:calc(var(--v7-nav) + env(safe-area-inset-bottom));padding:7px 8px calc(7px + env(safe-area-inset-bottom))}
.nav-btn{min-height:58px;font-size:11px}.nav-btn .ico{font-size:20px}
.sheet{padding:20px 18px calc(24px + env(safe-area-inset-bottom))}
.sheet h2{font-size:22px}.sheet p{font-size:14px;line-height:1.65}
.sheet-done,.sheet-cancel{min-height:48px;font-size:14px}
.share-code{padding:12px;border-radius:14px;background:#f3efe7;color:#52615b;font-size:12px;word-break:break-all}
.sync-list{display:grid;gap:8px;margin:14px 0}.sync-list>div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--v7-line);font-size:13px}

/* 费用：计划与实际分开展示，触控不再压成小圆点 */
.expense-summary{padding:18px;border-radius:20px}
.expense-summary .big{font-size:34px}
.budget-dual{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.budget-pane{padding:12px;border-radius:15px;background:rgba(255,255,255,.09)}
.budget-pane>small{display:block;color:rgba(255,255,255,.72);font-size:11px;margin-bottom:7px}
.budget-pane>strong{display:block;font-size:20px}
.budget-pane .budget-segments{margin:9px 0 6px;height:8px}
.budget-pane .budget-legend{gap:6px;flex-wrap:wrap}.budget-pane .budget-legend span{font-size:10px;color:rgba(255,255,255,.78)}
.expense-day{padding:12px 0}
.expense-day-head strong{font-size:15px}.expense-day-head span{font-size:12px}
.day-cost-inline{font-size:11px;gap:9px}
.expense-entry{padding:12px;border-radius:15px}
.expense-entry-top{grid-template-columns:minmax(0,1fr) 92px 44px;gap:8px}
.expense-entry-title strong,.expense-label-input{font-size:14px}
.expense-money-wrap{min-height:44px}.expense-money-input{font-size:16px}
.expense-delete{width:44px;height:44px}
.expense-controls{display:grid;gap:8px;overflow:visible}
.expense-control-line{display:flex;align-items:center;gap:6px;overflow-x:auto;padding-bottom:2px}
.expense-control-label{font-size:12px;min-width:34px}
.payer-chip,.cat-pick{padding:8px 12px;font-size:12px;flex:0 0 auto}
.add-extra-inline{min-height:48px;font-size:13px}
.expense-row-actions{display:flex;gap:8px;margin-top:10px}
.expense-lock,.expense-clear{min-height:42px;border-radius:12px;padding:8px 13px;font-size:12px;font-weight:800}
.expense-lock{border:1px solid #c8ddd4;background:#edf6f1;color:#1f6653}
.expense-lock.locked{width:100%;border-color:#d9c9ae;background:#f6f0e5;color:#755c38;text-align:left}
.expense-lock:disabled{opacity:.45}
.expense-clear{border:1px solid #ead3c8;background:#fff7f3;color:#a2563f}
.expense-entry.is-locked{border-color:#ded0ba;background:#fffcf6}
.expense-entry.is-locked .expense-controls{opacity:.5}
.expense-entry.is-locked .payer-chip,.expense-entry.is-locked .cat-pick{pointer-events:none}
.todo-action.done{min-width:100px;background:#eef5f0;color:#276c5a}

/* 网络图失败时也保留每个地点自己的视觉，避免相同占位图和空白卡片。 */
.hero-fallback[class*="visual-"]{color:transparent;background-size:cover;background-position:center}
.visual-lijiang{background:linear-gradient(145deg,#d8c4a3 0 34%,#eef0df 35% 59%,#7da18a 60%)}
.visual-yulong{background:linear-gradient(155deg,#dcebee 0 32%,#9eb7b0 33% 55%,#f2eee4 56%),linear-gradient(35deg,transparent 45%,#fff 46% 54%,transparent 55%)}
.visual-lugu{background:radial-gradient(ellipse at 58% 53%,#8ec4cf 0 27%,#c7e1dd 28% 40%,transparent 41%),linear-gradient(150deg,#6e947d,#e8dec8)}
.visual-lugu-grass{background:repeating-linear-gradient(95deg,#81a66e 0 18px,#a8c78b 19px 37px),linear-gradient(180deg,#b9d9e4 0 40%,transparent 41%)}
.visual-tiger{background:linear-gradient(115deg,#7a9a91 0 38%,transparent 39%),linear-gradient(65deg,#d1ad80 0 35%,transparent 36%),#d8e5df}
.visual-dukezong{background:linear-gradient(30deg,transparent 45%,#8b6041 46% 57%,transparent 58%),repeating-linear-gradient(90deg,#e9d9bd 0 30px,#c99d71 31px 59px)}
.visual-pudacuo{background:radial-gradient(circle at 27% 72%,#4f826c 0 6%,transparent 7%),radial-gradient(circle at 72% 38%,#5c9276 0 8%,transparent 9%),linear-gradient(155deg,#d2e7e1,#859f7c)}
.visual-songzanlin{background:linear-gradient(165deg,#9db5b0 0 38%,transparent 39%),linear-gradient(25deg,transparent 46%,#b8954c 47% 58%,transparent 59%),#e6ddd0}
.visual-napa{background:linear-gradient(180deg,#a8d0df 0 31%,#dbe3b8 32% 56%,#9ab071 57%)}
.visual-erhai{background:linear-gradient(160deg,#b8dce5 0 46%,#eae0c8 47% 57%,#7b9d7d 58%)}
.visual-balagezong{background:linear-gradient(118deg,#6d8c7f 0 36%,transparent 37%),linear-gradient(62deg,#b69b78 0 38%,transparent 39%),#d8e8df}

/* V7 景点执行路线卡 */
.route-card{overflow:hidden;border:1px solid #ddd3c5;border-radius:24px;background:#fffdf9;box-shadow:0 14px 34px rgba(34,55,46,.08)}
.route-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 16px 13px}
.route-card-head small{display:block;color:var(--v7-green);font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.route-card-head h3{margin:4px 0 0;font-size:20px;line-height:1.25}
.route-card-head button{min-height:44px;border:1px solid #d8d0c5;background:white;color:var(--v7-green);border-radius:999px;padding:8px 12px;font-size:12px;font-weight:800}
.route-visual{position:relative;height:270px;overflow:hidden;border-block:1px solid #e3dbd0;background:#edf3ef}
.route-visual::before,.route-visual::after{content:"";position:absolute;pointer-events:none}
.route-card--mountain .route-visual{background:linear-gradient(180deg,#dfeae5 0,#edf2e9 54%,#d2e4dc 55%,#f3eee2 100%)}
.route-card--mountain .route-visual::before{left:-8%;right:-8%;bottom:50px;height:170px;background:linear-gradient(135deg,transparent 35%,#9eb8ad 36% 54%,transparent 55%),linear-gradient(225deg,transparent 35%,#c3d4cc 36% 55%,transparent 56%);opacity:.75}
.route-card--lake .route-visual,.route-card--erhai .route-visual{background:radial-gradient(ellipse at 55% 52%,#a9d5dd 0 27%,#c9e4e6 28% 40%,transparent 41%),linear-gradient(145deg,#dce9df,#f2eadc)}
.route-card--forest .route-visual{background:radial-gradient(circle at 20% 80%,#6e9b83 0 5%,transparent 6%),radial-gradient(circle at 72% 35%,#7ca38c 0 7%,transparent 8%),repeating-linear-gradient(110deg,#dce8df 0 22px,#edf2e8 23px 48px)}
.route-card--valley .route-visual{background:linear-gradient(155deg,#c5d8cd 0 27%,transparent 28%),linear-gradient(25deg,#ddcdb6 0 30%,transparent 31%),linear-gradient(100deg,#f4efe5,#dbe5dd)}
.route-card--city .route-visual{background:linear-gradient(90deg,transparent 47%,#d6c5a9 48% 52%,transparent 53%),linear-gradient(0deg,transparent 47%,#d6c5a9 48% 52%,transparent 53%),#eee9de;background-size:72px 72px}
.route-card--transfer .route-visual{background:linear-gradient(155deg,#e7eee8,#f3eadf)}
.route-path-svg{position:absolute;inset:0;width:100%;height:100%;z-index:1}
.route-path-svg .line{fill:none;stroke:#2d7564;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 2px rgba(23,53,47,.12))}
.route-card--transfer .route-path-svg .line{stroke:#4d8dab;stroke-dasharray:8 7}
.route-path-svg .halo{fill:#fffdf9;stroke:#d6cbbb;stroke-width:2}
.route-path-svg .node{fill:#276c5a}.route-path-svg .must{fill:#cf7d43}.route-path-svg .optional{fill:#909b96}
.route-path-svg text{font-family:system-ui,sans-serif;paint-order:stroke;stroke:#fffdf9;stroke-width:5px;stroke-linejoin:round}
.route-path-svg .number{fill:white;stroke:none;font-size:11px;font-weight:900}
.route-path-svg .label{fill:#17352f;font-size:12px;font-weight:850}
.route-path-svg .time{fill:#61716a;font-size:10px;font-weight:700}
.route-steps{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px;background:#faf6ee}
.route-step-card{position:relative;display:grid;grid-template-columns:38px minmax(0,1fr);gap:10px;align-items:center;min-height:72px;border:1px solid #e1d8cc;border-radius:16px;background:white;color:inherit;padding:10px;text-align:left}
.route-step-card .step-number{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#276c5a;color:white;font-size:15px;font-weight:900}
.route-step-card.must .step-number{background:#cf7d43}.route-step-card.optional .step-number{background:#909b96}
.route-step-card b{display:block;font-size:13px;line-height:1.25}.route-step-card small{display:block;margin-top:4px;color:#68766f;font-size:11px;line-height:1.35}
.route-step-card .step-next{grid-column:1/-1;display:flex;align-items:center;gap:6px;padding-top:7px;border-top:1px dashed #e1d8cc;color:#4d6c62;font-size:11px}
.route-step-card .step-next::before{content:"→";font-weight:900}
.route-card-meta{display:flex;gap:8px;flex-wrap:wrap;padding:10px 12px;border-top:1px solid #e3dbd0;background:#fffdf9}
.route-card-meta span{padding:6px 8px;border-radius:999px;background:#eef3ef;color:#52655e;font-size:11px}

@media(max-width:430px){
  body{font-size:14px;padding:0}.app{border-radius:0;box-shadow:none}
  .content{padding-left:14px;padding-right:14px}
  .topbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;padding:8px 10px;gap:6px 8px}
  .brand{min-width:0}.brand span{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.brand-mark{width:28px;height:28px}
  .top-actions{grid-column:2;grid-row:1}.sync-pill{grid-column:1/-1;grid-row:2;min-height:34px;justify-self:start}
  .top-actions{gap:4px}.ghost-btn{padding:7px 8px;font-size:11px}.sync-pill{padding:0 8px;font-size:10px}
  .section{padding:19px 0}.section-title{font-size:19px}.section-sub{font-size:12px}
  .hero{min-height:270px}.hero h1{font-size:30px}.hero p{font-size:13px}
  .day-strip{top:108px;padding-left:14px;padding-right:14px}
  .day-brief{grid-template-columns:1fr}.day-brief-item b{white-space:normal}
  .budget-dual{grid-template-columns:1fr}
  .expense-entry-top{grid-template-columns:minmax(0,1fr) 86px 44px}
  .expense-row-actions{display:grid;grid-template-columns:1fr 1fr}.expense-lock.locked{grid-column:1/-1}
  .route-visual{height:255px}.route-steps{grid-template-columns:1fr}.route-step-card{min-height:76px}
  .route-card-head h3{font-size:18px}
  .route-card-head{align-items:center}.route-card-head>div{min-width:0}.route-card-head h3{overflow-wrap:anywhere}
  .route-step-card>span{min-width:0}.route-step-card b,.route-step-card small,.route-step-card .step-next{overflow-wrap:anywhere}
  .route-path-svg .label{font-size:11px}.route-path-svg .time{font-size:9px}
  .float-add{right:14px}
}

@media(min-width:721px){
  .route-visual{height:310px}
}
