*{ margin:0; padding:0; box-sizing:border-box; }
html,body{ width:100%; height:100%; }
body{
  overflow:hidden;
  font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC",sans-serif;
  background:#07140f;
  color:#f4f1e8;
}
button{ font:inherit; color:inherit; border:none; background:none; cursor:pointer; }

/* ========== 座舱首页 ========== */
.scene{
  width:100vw;
  height:100vh;
  position:relative;
  display:flex;
  flex-direction:column;
  padding:22px 36px 18px;
  overflow:hidden;
}
.scene-layers{ position:absolute; inset:0; z-index:0; }
.scene-photo{
  position:absolute; inset:0;
  background:url("../assets/home/terrace.jpg") center/cover;
  transform:scale(1.06);
  animation:kenburns 28s ease-in-out infinite alternate;
}
.scene-batik{
  position:absolute; inset:0;
  background-image:
    radial-gradient(circle at 20% 20%, rgba(212,181,106,.08), transparent 28%),
    repeating-radial-gradient(circle at 0 0, transparent 0 14px, rgba(255,255,255,.03) 15px 16px);
  mix-blend-mode:soft-light;
  opacity:.55;
}
.scene-vignette{
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(6,16,14,.62) 0%, rgba(6,16,14,.22) 40%, rgba(6,16,14,.08) 62%, rgba(6,16,14,.38) 100%),
    linear-gradient(180deg, rgba(6,16,14,.22) 0%, transparent 20%, transparent 68%, rgba(6,16,14,.58) 100%);
}
.scene-mist{
  position:absolute; left:-10%; width:120%; height:28%;
  background:linear-gradient(90deg, transparent, rgba(244,241,232,.12), transparent);
  filter:blur(28px); pointer-events:none;
}
.mist-a{ bottom:16%; animation:mistDrift 18s linear infinite; }
.mist-b{ bottom:28%; opacity:.45; animation:mistDrift 24s linear infinite reverse; }
@keyframes kenburns{
  from{ transform:scale(1.04) translate3d(0,0,0); }
  to{ transform:scale(1.12) translate3d(-2%, -1%, 0); }
}
@keyframes mistDrift{
  from{ transform:translateX(-8%); }
  to{ transform:translateX(8%); }
}

.home-bar,
.home-body,
.home-rail{ position:relative; z-index:2; }

.home-bar{
  display:flex; justify-content:space-between; align-items:center;
  padding-bottom:12px;
}
.home-brand{ display:flex; align-items:center; gap:12px; }
.home-brand strong{
  display:block;
  font-family:"Noto Serif SC","STKaiti","KaiTi",serif;
  font-size:22px; font-weight:600; letter-spacing:.28em;
}
.home-brand small{
  display:block; margin-top:4px;
  font-size:11px; letter-spacing:.18em; color:rgba(244,241,232,.62);
}
.peacock-dot{
  width:18px; height:24px; border-radius:50% 50% 48% 48%;
  background:
    radial-gradient(circle at 50% 42%, #e8efb0 0 14%, #2f9a86 15% 36%, #0b4d52 37% 62%, transparent 63%);
  box-shadow:0 0 16px rgba(47,154,134,.45);
  flex-shrink:0;
}
.home-hud{
  display:flex; align-items:center; gap:12px;
  padding:10px 18px;
  border:1px solid rgba(212,181,106,.28);
  background:rgba(7,20,15,.38);
  backdrop-filter:blur(16px);
  font-size:12px; letter-spacing:.14em;
  color:rgba(244,241,232,.82);
}
.home-hud i{ width:1px; height:12px; background:rgba(212,181,106,.35); }
.home-hud time{ color:#e6c56a; }

.home-body{
  flex:1;
  display:grid;
  grid-template-columns:minmax(280px, .86fr) minmax(0, 1.7fr);
  gap:36px;
  align-items:stretch;
  min-height:0;
  padding:8px 0 14px;
}
.home-copy{
  display:flex; flex-direction:column; justify-content:center;
  max-width:420px;
  animation:rise .9s ease both;
}
.home-kicker{
  font-size:11px; letter-spacing:.32em; color:#d4b56a; margin-bottom:18px;
}
.home-copy h1{
  font-family:"Noto Serif SC","STKaiti","KaiTi",serif;
  font-size:clamp(42px, 5vw, 68px);
  font-weight:600; line-height:1.18; letter-spacing:.12em;
  text-shadow:0 8px 28px rgba(6,16,14,.45);
}
.home-copy h1 em{
  font-style:normal;
  color:#e8d7a4;
}
.home-lead{
  margin-top:22px;
  font-size:16px; line-height:1.9; letter-spacing:.12em;
  color:rgba(244,241,232,.86);
  text-shadow:0 4px 18px rgba(6,16,14,.5);
}
.home-mosaic{
  display:grid;
  grid-template-columns:1.55fr 1fr 1fr;
  grid-template-rows:1.15fr .72fr .72fr;
  grid-template-areas:
    "hero meal market"
    "hero route safety"
    "video video music";
  gap:12px;
  min-height:0;
  animation:rise .9s ease .12s both;
}
.tile{
  position:relative; overflow:hidden;
  border:1px solid rgba(244,241,232,.14);
  text-align:left;
  isolation:isolate;
  min-height:0;
  border-radius:2px;
}
.tile-hero{
  box-shadow:inset 0 0 0 1px rgba(212,181,106,.22);
}
.tile-hero{ grid-area:hero; }
.tile-meal{ grid-area:meal; }
.tile-market{ grid-area:market; }
.tile-route{ grid-area:route; }
.tile-safety{ grid-area:safety; }
.tile-video{ grid-area:video; }
.tile-music{ grid-area:music; }
.tile-photo{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  transition:transform .8s cubic-bezier(.22,1,.36,1);
}
.tile-shade{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(6,16,14,.05) 20%, rgba(6,16,14,.78) 100%);
}
.tile-meta{
  position:absolute; left:16px; right:16px; bottom:14px;
  display:flex; flex-direction:column; gap:4px;
}
.tile-meta small{
  font-size:10px; letter-spacing:.2em; color:#d4b56a;
}
.tile-meta strong{
  font-family:"Noto Serif SC","STKaiti",serif;
  font-size:22px; font-weight:600; letter-spacing:.16em;
}
.tile-hero .tile-meta strong{ font-size:34px; }
.tile-meta em{
  font-style:normal; font-size:12px; letter-spacing:.1em;
  color:rgba(244,241,232,.72);
}
.tile:hover{ border-color:rgba(212,181,106,.7); }
.tile:hover .tile-photo{ transform:scale(1.08); }
.tile:focus-visible{ outline:2px solid #d4b56a; outline-offset:2px; }

.tile-hero .tile-photo{ background-color:#16352f; background-image:url("../assets/home/yulong.jpg"); }
.tile-meal .tile-photo{ background-color:#4a2c18; background-image:url("../assets/home/tea.jpg"); }
.tile-market .tile-photo{ background-color:#3a2a1c; background-image:url("../assets/home/lijiang.jpg"); background-position:center 80%; }
.tile-route .tile-photo{ background-color:#1c3a40; background-image:url("../assets/home/paddies.jpg"); }
.tile-safety .tile-photo{ background-color:#141820; background-image:url("../assets/home/sky.jpg"); }
.tile-video .tile-photo{ background-color:#243028; background-image:url("../assets/home/terrace.jpg"); }
.tile-music .tile-photo{ background-color:#163024; background-image:url("../assets/home/forest.jpg"); }

.home-rail{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding-top:10px;
  border-top:1px solid rgba(244,241,232,.12);
  font-size:12px; letter-spacing:.16em; color:rgba(244,241,232,.7);
}
.home-rail__code{ color:#d4b56a; }
.home-rail__path{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:center; }
.home-rail__path b{ font-weight:400; }
.home-rail__path i{
  width:28px; height:1px; background:linear-gradient(90deg, transparent, #d4b56a, transparent);
}
.home-rail__status{ display:flex; align-items:center; gap:8px; }
.home-rail__status i{
  width:7px; height:7px; border-radius:50%; background:#7ee0b0;
  box-shadow:0 0 10px rgba(126,224,176,.8);
  animation:pulse 2s infinite;
}
@keyframes pulse{
  0%,100%{ opacity:.45; transform:scale(.8); }
  50%{ opacity:1; transform:scale(1.15); }
}
@keyframes rise{
  from{ opacity:0; transform:translateY(18px); }
  to{ opacity:1; transform:translateY(0); }
}

/* ========== 内页 ========== */
.panel{
  display:none; position:absolute; inset:0; z-index:20; overflow:auto;
  background:linear-gradient(135deg, rgba(4,28,35,.97), rgba(9,48,50,.94), rgba(19,65,61,.91));
  animation:panelIn .8s ease;
}
.panel.is-open{ display:block; }
@keyframes panelIn{
  from{ opacity:0; transform:scale(1.04); }
  to{ opacity:1; transform:scale(1); }
}
.panel-bg{
  position:absolute; inset:0; z-index:0;
  background-size:cover; background-position:center;
  opacity:.28; pointer-events:none;
}
.panel-bg--erhai{
  background-image:
    linear-gradient(rgba(4,28,35,.55), rgba(7,28,38,.82)),
    url("https://images.unsplash.com/photo-1501785888041-af3ef285b470?auto=format&fit=crop&w=2000&q=70");
  opacity:1;
}
.panel-bg--mist{
  background-image:
    linear-gradient(rgba(4,28,35,.6), rgba(7,28,38,.85)),
    url("https://images.unsplash.com/photo-1464822759023-fed622ff2c3b?auto=format&fit=crop&w=2000&q=70");
  opacity:1;
}
.panel-bg--forest{
  background-image:
    linear-gradient(rgba(4,28,35,.62), rgba(7,28,38,.86)),
    url("https://images.unsplash.com/photo-1441974231531-c6227db76b6e?auto=format&fit=crop&w=2000&q=70");
  opacity:1;
}
.panel-bg--meal{
  background-image:
    linear-gradient(rgba(20,18,12,.45), rgba(7,28,38,.88)),
    url("https://images.unsplash.com/photo-1546069901-ba9599a7e63c?auto=format&fit=crop&w=2000&q=70");
  opacity:1;
}
.panel-bg--market{
  background-image:
    linear-gradient(rgba(20,16,10,.5), rgba(7,28,38,.88)),
    url("https://images.unsplash.com/photo-1548013146-72479768bada?auto=format&fit=crop&w=2000&q=70");
  opacity:1;
}

#panel-healing{
  background:
    radial-gradient(circle at 50% 48%, rgba(170,230,202,.12), transparent 28%),
    radial-gradient(circle at 50% 45%, rgba(44,154,151,.12), transparent 48%),
    linear-gradient(135deg, #061e25 0%, #0a3838 42%, #103f39 70%, #071f26 100%);
  overflow:hidden;
}
#panel-healing::before{
  content:""; position:absolute; width:800px; height:800px; left:-300px; bottom:-400px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(180,235,210,.16), transparent 68%);
  filter:blur(30px); animation:mistFloat 12s infinite alternate;
}
#panel-healing::after{
  content:""; position:absolute; width:700px; height:700px; right:-250px; top:-350px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(76,183,173,.16), transparent 68%);
  filter:blur(35px); animation:mistFloat2 15s infinite alternate;
}
@keyframes mistFloat{ from{transform:translate(-20px,20px)} to{transform:translate(120px,-50px)} }
@keyframes mistFloat2{ from{transform:translate(20px,-20px)} to{transform:translate(-100px,70px)} }

.botanical{ position:absolute; z-index:1; pointer-events:none; }
.plant{
  position:absolute; width:180px; height:360px; opacity:.48;
  filter:drop-shadow(0 0 15px rgba(137,220,184,.12));
}
.plant.left{ left:-20px; bottom:-20px; transform:rotate(-8deg); }
.plant.right{ right:-25px; top:130px; transform:rotate(185deg); }
.plant.left::before,.plant.right::before{
  content:""; position:absolute; width:4px; height:360px; left:80px; bottom:0;
  background:linear-gradient(to top, rgba(100,180,130,.05), rgba(137,211,161,.55));
  border-radius:50%;
}
.leaf{
  position:absolute; width:72px; height:32px;
  background:linear-gradient(135deg, rgba(94,179,133,.08), rgba(148,218,168,.38));
  border:1px solid rgba(173,235,194,.22);
  border-radius:100% 0 100% 0; transform:rotate(-30deg);
}
.leaf::after{
  content:""; position:absolute; width:70%; height:1px; left:10%; top:50%;
  background:rgba(206,245,217,.35);
}
.leaf.l1{ left:8px; bottom:150px; transform:rotate(-42deg); }
.leaf.l2{ left:80px; bottom:210px; transform:rotate(25deg); }
.leaf.l3{ left:20px; bottom:260px; transform:rotate(-45deg); }
.leaf.l4{ left:85px; bottom:95px; transform:rotate(30deg); }
.leaf.l5{ left:30px; bottom:40px; transform:rotate(-25deg); }

.peacock{
  position:absolute; z-index:2; width:260px; height:620px;
  pointer-events:none; opacity:.68;
  filter:drop-shadow(0 0 22px rgba(46,180,164,.16));
}
.peacock.left{ left:-20px; top:80px; transform:rotate(-12deg); }
.peacock.right{ right:-20px; top:80px; transform:scaleX(-1) rotate(-12deg); }
.peacock .shaft{
  position:absolute; width:3px; height:590px; left:128px; top:20px; border-radius:50%;
  background:linear-gradient(to top, rgba(220,244,211,.04), rgba(151,220,174,.55), rgba(218,245,211,.18));
  transform:rotate(-7deg);
}
.feather{
  position:absolute; width:110px; height:270px; border-radius:100% 0 100% 0;
  background:linear-gradient(135deg, rgba(26,91,84,.12), rgba(48,157,142,.22), rgba(158,205,132,.10));
  border:1px solid rgba(164,224,187,.17); transform:rotate(-12deg);
}
.feather::before{
  content:""; position:absolute; width:2px; height:220px; left:50%; top:25px;
  background:linear-gradient(to top, rgba(170,227,184,.05), rgba(190,234,188,.45));
  transform:rotate(15deg);
}
.eye{
  position:absolute; width:88px; height:118px; left:15px; top:28px;
  border-radius:55% 45% 60% 40%; transform:rotate(15deg);
  background:radial-gradient(ellipse at center, #d9e8a0 0 8%, #3c9d88 9% 23%, #0b5961 24% 42%, #164b53 43% 60%, transparent 61%);
  box-shadow:0 0 20px rgba(62,187,169,.18);
}
.eye::before{
  content:""; position:absolute; width:54px; height:70px; left:17px; top:22px;
  border-radius:50%; border:2px solid rgba(218,235,155,.38);
}
.eye::after{
  content:""; position:absolute; width:12px; height:12px; border-radius:50%;
  background:rgba(241,249,215,.8); left:22px; top:24px;
  box-shadow:0 0 15px rgba(232,249,211,.8);
}
.feather.main{ left:72px; top:15px; height:300px; }
.feather.small1{ left:25px; top:220px; width:75px; height:190px; transform:rotate(-28deg) scale(.7); opacity:.65; }
.feather.small2{ left:150px; top:270px; width:75px; height:190px; transform:rotate(18deg) scale(.65); opacity:.6; }

.healing-content{
  position:relative; z-index:5; width:1100px; max-width:92vw;
  margin:0 auto; text-align:center; padding:64px 0 40px;
}
.healing-label{
  font-family:"Courier New",monospace; font-size:11px; letter-spacing:7px;
  color:rgba(206,241,220,.65); margin-bottom:14px;
}
.healing-title{
  font-family:"STKaiti","KaiTi","Microsoft YaHei",serif;
  font-size:60px; font-weight:400; letter-spacing:20px;
  color:#edf8e9;
  text-shadow:0 0 30px rgba(179,232,191,.18), 0 3px 20px rgba(0,0,0,.35);
}
.healing-en{
  margin-top:13px; font-family:"Courier New",monospace;
  font-size:10px; letter-spacing:8px; opacity:.42;
}
.healing-line{
  width:230px; height:1px; margin:22px auto 18px; position:relative;
  background:linear-gradient(90deg, transparent, rgba(203,241,210,.75), transparent);
}
.healing-line::before,.healing-line::after{
  content:""; position:absolute; width:5px; height:5px; top:-2px; border-radius:50%;
  background:#dff5cf; box-shadow:0 0 14px rgba(204,245,205,.8);
}
.healing-line::before{ left:0; }
.healing-line::after{ right:0; }
.healing-text{
  width:760px; max-width:100%; margin:0 auto;
  font-family:"STKaiti","KaiTi","Microsoft YaHei",serif;
  font-size:17px; line-height:1.85; letter-spacing:3px;
  color:rgba(239,249,239,.82); text-shadow:0 2px 14px rgba(0,0,0,.35);
}
.healing-text em{
  font-style:normal; color:#dff5d5;
  text-shadow:0 0 18px rgba(184,237,194,.35);
}
.healing-text.is-speaking{ animation:scriptPulse 2.4s ease-in-out infinite; }
@keyframes scriptPulse{ 0%,100%{opacity:.75} 50%{opacity:1} }

.healing-actions{ display:flex; justify-content:center; gap:14px; margin:18px 0 8px; flex-wrap:wrap; }
.voice-btn{
  padding:11px 28px; border-radius:40px;
  border:1px solid rgba(212,241,216,.5);
  background:rgba(186,232,193,.16); color:#edf8e9;
  letter-spacing:3px; font-size:13px; transition:.35s;
}
.voice-btn:hover,.voice-btn.is-on{
  background:rgba(186,232,193,.28);
  box-shadow:0 0 28px rgba(175,230,188,.25);
}
.voice-btn.ghost{ background:rgba(255,255,255,.05); }

.senses{
  display:flex; justify-content:center; align-items:center;
  gap:20px; margin-top:22px; position:relative;
}
.senses::before{
  content:""; position:absolute; width:420px; height:90px; left:50%; top:50%;
  transform:translate(-50%,-50%);
  background:radial-gradient(ellipse, rgba(121,207,168,.13), transparent 70%);
  filter:blur(18px); pointer-events:none;
}
.sense{
  position:relative; width:115px; height:105px; padding-top:17px;
  border:1px solid rgba(187,232,194,.18); border-radius:50%;
  background:radial-gradient(circle, rgba(173,225,184,.11), rgba(255,255,255,.015) 65%);
  backdrop-filter:blur(10px); opacity:.78;
  transition:transform .45s, opacity .45s, box-shadow .45s; cursor:pointer;
}
.sense:hover,.sense.is-active{
  transform:translateY(-10px) scale(1.06); opacity:1;
  box-shadow:0 0 35px rgba(109,205,164,.2);
  border-color:rgba(205,242,204,.55);
}
.sense-icon{
  font-size:25px; height:30px; margin-bottom:5px; color:#d9f0d0;
  filter:drop-shadow(0 0 10px rgba(186,235,194,.45));
}
.sense-name{ font-size:13px; letter-spacing:4px; color:rgba(240,250,238,.9); }
.sense-en{ margin-top:4px; font-family:"Courier New",monospace; font-size:7px; letter-spacing:2px; opacity:.42; }
.peacock-center{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:100px; height:100px; border-radius:50%; z-index:-1;
  background:radial-gradient(circle, rgba(220,235,164,.2) 0 7%, rgba(58,157,136,.13) 8% 22%, rgba(20,96,96,.1) 23% 42%, transparent 43%);
  border:1px solid rgba(193,232,179,.13);
  box-shadow:0 0 50px rgba(66,178,158,.1);
  animation:centerPulse 5s infinite ease-in-out;
}
@keyframes centerPulse{
  0%,100%{ transform:translate(-50%,-50%) scale(.95); opacity:.55; }
  50%{ transform:translate(-50%,-50%) scale(1.08); opacity:1; }
}

.back-btn{
  margin-top:22px; padding:11px 40px; border-radius:40px;
  border:1px solid rgba(212,241,216,.38);
  background:rgba(255,255,255,.045); color:white;
  font-size:13px; letter-spacing:4px; cursor:pointer; transition:.4s;
  backdrop-filter:blur(10px);
}
.back-btn:hover{
  background:rgba(186,232,193,.12);
  border-color:rgba(216,244,215,.8);
  box-shadow:0 0 30px rgba(175,230,188,.15);
  transform:translateY(-3px);
}

.video-categories{
  display:grid; grid-template-columns:repeat(5, minmax(110px,1fr));
  gap:16px; width:min(860px,88vw); margin:16px auto 0;
}
.video-category{
  position:relative; overflow:hidden; min-height:92px; padding:18px 10px;
  border:1px solid rgba(212,241,216,.25); border-radius:18px;
  background:rgba(255,255,255,.06); color:rgba(240,250,238,.92);
  cursor:pointer; transition:.35s; backdrop-filter:blur(10px);
}
.video-category:hover,.video-category.active{
  transform:translateY(-6px);
  border-color:rgba(216,244,215,.8);
  background:rgba(186,232,193,.16);
  box-shadow:0 0 28px rgba(175,230,188,.2);
}
.video-category-icon{
  display:block; height:28px; color:#dff5d5; font-size:24px;
  filter:drop-shadow(0 0 9px rgba(186,235,194,.55));
}
.video-category-label{ display:block; margin-top:7px; font-size:16px; letter-spacing:3px; }
.video-category small{
  display:block; margin-top:7px; font-family:"Courier New",monospace;
  font-size:8px; letter-spacing:2px; opacity:.48;
}

.healing-code,.healing-status{
  position:absolute; top:38px; z-index:8;
  font-family:"Courier New",monospace; letter-spacing:3px; opacity:.4;
}
.healing-code{ left:45px; font-size:10px; }
.healing-status{ right:45px; font-size:9px; }

.particle{
  position:absolute; width:3px; height:3px; border-radius:50%;
  background:rgba(210,242,201,.8); box-shadow:0 0 12px rgba(195,241,198,.7);
  animation:particleFloat 8s infinite ease-in-out;
}
.p1{ left:22%; top:25%; }
.p2{ left:72%; top:30%; animation-delay:2s; }
.p3{ left:30%; top:68%; animation-delay:4s; }
.p4{ left:80%; top:72%; animation-delay:1s; }
@keyframes particleFloat{
  0%,100%{ transform:translateY(0) scale(.7); opacity:.2; }
  50%{ transform:translateY(-25px) scale(1.2); opacity:.8; }
}

/* 安全 */
.safety-video-wrap{ position:absolute; inset:0; z-index:1; overflow:hidden; background:#000; }
.safety-video-wrap video{ display:block; width:100%; height:100%; object-fit:cover; }
.safety-video-wrap::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(4,20,25,.6) 0%, rgba(4,20,25,0) 24%, rgba(4,20,25,0) 66%, rgba(4,20,25,.7) 100%);
}
.safety-content{
  position:relative; z-index:5; width:100%; height:100%;
  display:flex; flex-direction:column; align-items:center; justify-content:space-between;
  text-align:center; padding:56px 0 40px; pointer-events:none;
}
.safety-content .back-btn,.safety-actions{ pointer-events:auto; }
.safety-top{ width:1100px; max-width:88vw; }
.safety-actions{ display:flex; gap:16px; flex-wrap:wrap; justify-content:center; }
.safety-sheet{
  position:absolute; right:36px; top:50%; transform:translateY(-50%);
  z-index:8; width:320px; padding:24px 22px;
  background:rgba(7,28,38,.82); border:1px solid rgba(212,241,216,.28);
  border-radius:22px; backdrop-filter:blur(18px);
}
.safety-sheet[hidden]{ display:none; }
.safety-sheet h3{
  font-family:"STKaiti","KaiTi",serif; letter-spacing:6px; margin-bottom:14px; text-align:center;
}
.check-list{ list-style:none; display:grid; gap:10px; text-align:left; }
.check-list label{
  display:flex; gap:10px; align-items:flex-start;
  padding:10px 12px; border:1px solid rgba(212,241,216,.18);
  border-radius:12px; background:rgba(255,255,255,.04); cursor:pointer; font-size:14px; line-height:1.45;
}
.check-list label:has(input:checked){
  border-color:rgba(216,244,215,.7); background:rgba(186,232,193,.12);
}

/* 航线节点 */
.route-stops{
  display:grid; grid-template-columns:repeat(5,1fr);
  gap:12px; width:min(980px,92vw); margin:28px auto 0;
}
.route-stops article{
  padding:18px 10px; border:1px solid rgba(212,241,216,.22); border-radius:18px;
  background:rgba(255,255,255,.06); backdrop-filter:blur(10px);
}
.route-stops small{ font-family:"Courier New",monospace; opacity:.5; letter-spacing:2px; }
.route-stops h3{ font-family:"STKaiti","KaiTi",serif; font-size:26px; letter-spacing:6px; margin:8px 0 6px; }
.route-stops p{ font-size:13px; opacity:.7; letter-spacing:2px; }

/* 餐食 / 市集 */
.meal-grid,.market-grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:16px; width:min(1040px,94vw); margin:22px auto 0;
}
.meal-card,.product-card{
  text-align:left; overflow:hidden; border-radius:20px;
  border:1px solid rgba(212,241,216,.22);
  background:rgba(255,255,255,.07); backdrop-filter:blur(12px);
  cursor:pointer; transition:.35s;
}
.product-card{ color:inherit; }
.meal-card:hover,.product-card:hover{
  transform:translateY(-6px);
  border-color:rgba(216,244,215,.7);
  box-shadow:0 0 28px rgba(175,230,188,.18);
}
.meal-card__media,.product-card__media,.checkout-media{
  height:140px; background-size:cover; background-position:center;
}
.meal-card__body,.product-card__body{ padding:14px 16px 16px; }
.meal-card__course,.product-origin{
  font-size:11px; letter-spacing:3px; color:#d4b56a; margin-bottom:6px;
}
.meal-card h3,.product-card h3,.checkout-card h3{
  font-family:"STKaiti","KaiTi",serif; font-size:22px; letter-spacing:3px; margin-bottom:6px;
}
.meal-card p,.product-card p,.checkout-card p{
  font-size:13px; line-height:1.6; opacity:.78; letter-spacing:1px;
}
.meal-card__ingredients,.product-card__price,.checkout-price{
  margin-top:10px; color:#dff5d5; font-size:13px; letter-spacing:1px;
}
.checkout-price{ font-size:28px; margin:12px 0 16px; }

.music-list{
  width:min(720px,90vw); margin:20px auto 0; display:grid; gap:10px;
}
.music-item{
  display:flex; justify-content:space-between; align-items:center;
  padding:14px 20px; border-radius:16px;
  border:1px solid rgba(212,241,216,.2); background:rgba(255,255,255,.06);
  text-align:left; transition:.3s;
}
.music-item:hover,.music-item.is-on{
  border-color:rgba(216,244,215,.7); background:rgba(186,232,193,.14);
}
.music-item b{ letter-spacing:3px; }
.music-item small{ opacity:.55; letter-spacing:2px; }

.checkout-card{
  display:grid; grid-template-columns:1.1fr 1fr; gap:24px;
  width:min(820px,90vw); margin:10px auto 0; text-align:left;
  padding:22px; border-radius:22px;
  background:rgba(255,255,255,.06); border:1px solid rgba(212,241,216,.22);
}
.checkout-media{ min-height:240px; border-radius:16px; }
.qr-mock{
  display:flex; flex-direction:column; align-items:center; gap:10px;
  margin:8px 0 16px; padding:16px; background:rgba(0,0,0,.2); border-radius:14px;
}
.qr-mock__grid{
  width:110px; height:110px;
  background:
    linear-gradient(#edf8e9 50%, transparent 50%),
    linear-gradient(90deg, #edf8e9 50%, transparent 50%),
    #071c26;
  background-size:10px 10px,10px 10px,auto;
  border:8px solid rgba(255,255,255,.85);
}
.qr-mock span{ font-size:12px; letter-spacing:2px; opacity:.7; }

.success-mark{
  width:64px; height:64px; margin:0 auto 10px; border-radius:50%;
  background:#2a8a74; position:relative;
}
.success-mark::after{
  content:""; position:absolute; left:22px; top:14px;
  width:16px; height:28px; border-right:3px solid #edf8e9; border-bottom:3px solid #edf8e9;
  transform:rotate(45deg);
}

.visual-video-panel{
  display:none; position:absolute; inset:0; z-index:80;
  background:rgba(0,0,0,.86); align-items:center; justify-content:center;
}
.visual-video-panel.active{ display:flex; }
.visual-video-box{ width:min(1100px,92vw); }
.visual-video-box video{ width:100%; max-height:78vh; background:#000; }
.visual-video-close{
  display:block; margin:16px auto 0; padding:10px 28px;
  border:1px solid rgba(255,255,255,.5); border-radius:30px;
}
#marketVideoLayer{ position:fixed; inset:0; background:#000; z-index:90; display:none; }
#marketVideoLayer.is-open{ display:block; }
#marketVideoLayer video{ width:100%; height:100%; object-fit:cover; }
#marketVideoClose{
  position:absolute; top:25px; right:35px; z-index:2; color:#fff; font-size:36px; cursor:pointer;
}

.toast{
  position:fixed; left:50%; bottom:28px; transform:translateX(-50%) translateY(10px);
  background:rgba(7,28,38,.92); border:1px solid rgba(212,241,216,.35);
  padding:10px 20px; border-radius:30px; font-size:14px; letter-spacing:2px;
  z-index:100; opacity:0; transition:.3s; pointer-events:none;
}
.toast.is-show{ opacity:1; transform:translateX(-50%) translateY(0); }

@media (max-width:1550px){
  .scene{ padding:16px 20px 12px; }
  .home-body{ gap:22px; }
  .tile-meta strong{ font-size:18px; }
  .tile-hero .tile-meta strong{ font-size:28px; }
  .healing-title{ font-size:48px; letter-spacing:12px; }
  .meal-grid,.market-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:1180px){
  .home-body{ grid-template-columns:1fr; }
  .home-copy{ max-width:none; padding:6px 0 4px; }
  .home-copy h1{ font-size:40px; }
  .home-mosaic{ min-height:52vh; }
  .home-hud span:nth-child(3),
  .home-hud span:nth-child(5){ display:none; }
}
@media (max-width:1100px){
  .route-stops,.video-categories{ grid-template-columns:repeat(2,1fr); }
  .meal-grid,.market-grid,.checkout-card{ grid-template-columns:1fr; }
  .peacock,.plant{ opacity:.22; }
  .home-mosaic{
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto;
    grid-template-areas:
      "hero hero"
      "meal market"
      "route safety"
      "video music";
  }
}
@media (max-height:820px){
  .home-lead{ display:none; }
  .tile-meta em{ display:none; }
}
