:root {
  --tour-ink: #05080d;
  --tour-panel: rgba(8, 13, 21, .9);
  --tour-cyan: #00e5ff;
  --tour-lime: #c8ff25;
  --tour-pink: #ff2ca8;
  --tour-gold: #ffd34f;
}

.title-screen .mode-preview { width:72%; grid-template-columns:repeat(4,1fr); }

.tour-screen {
  min-height: 100vh;
  padding: 112px clamp(22px, 4vw, 70px) 70px;
  color: #f8fbff;
  background:
    linear-gradient(180deg, rgba(4, 8, 14, .18), #05080d 72%),
    url("assets/wte-night-city.webp") center top / cover no-repeat,
    #05080d;
  overflow: hidden;
}

.tour-screen::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0, 229, 255, .04) 1px, transparent 1px),
    linear-gradient(rgba(0, 229, 255, .035) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: linear-gradient(#000, transparent 72%);
}

.tour-atmosphere,
.tour-atmosphere i { position: absolute; inset: 0; pointer-events: none; }
.tour-atmosphere i:nth-child(1) { background: radial-gradient(circle at 15% 28%, rgba(0,229,255,.18), transparent 27%); animation: tourPulse 5s ease-in-out infinite; }
.tour-atmosphere i:nth-child(2) { background: radial-gradient(circle at 88% 20%, rgba(255,44,168,.18), transparent 25%); animation: tourPulse 6s 1s ease-in-out infinite reverse; }
.tour-atmosphere i:nth-child(3) { background: linear-gradient(110deg, transparent 45%, rgba(200,255,37,.05) 50%, transparent 55%); animation: tourSweep 8s linear infinite; }

.tour-heading-row { position: relative; max-width: 1500px; margin-inline: auto; }
.tour-heading-row h2 { color: #fff; text-shadow: 0 0 32px rgba(0,229,255,.24); }
.tour-heading-row h2 em { color: var(--tour-gold); font-style: normal; }
.tour-heading-row p { color: #aebdcb; }
.chapter-label.globe { color: var(--tour-cyan); border-color: rgba(0,229,255,.35); }
.chapter-label.globe span { background: var(--tour-cyan); color: #061119; }
.scene-kpi.globe { background: linear-gradient(135deg, rgba(0,229,255,.16), rgba(255,44,168,.13)); border-color: rgba(0,229,255,.35); }

.tour-hud {
  position: relative;
  max-width: 1500px;
  margin: 24px auto 14px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: rgba(3, 7, 12, .82);
  border: 1px solid rgba(157, 214, 230, .2);
  box-shadow: 0 16px 60px rgba(0,0,0,.35), inset 0 0 35px rgba(0,229,255,.03);
  backdrop-filter: none;
}
.tour-hud > div { padding: 13px 18px; border-right: 1px solid rgba(157,214,230,.15); }
.tour-hud > div:last-child { border-right: 0; }
.tour-hud small { display: block; color: #678093; font: 700 9px/1.2 ui-monospace, monospace; letter-spacing: .18em; }
.tour-hud b { display: block; margin-top: 5px; color: #e8fbff; font: 800 15px/1.2 ui-monospace, monospace; }

.tour-layout {
  position: relative;
  z-index: 1;
  max-width: 1500px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 14px;
  align-items: stretch;
}

.world-board,
.plant-passport,
.passport-atlas {
  background: var(--tour-panel);
  border: 1px solid rgba(151, 206, 224, .2);
  box-shadow: 0 28px 80px rgba(0,0,0,.55), inset 0 0 45px rgba(0,229,255,.025);
  backdrop-filter: none;
}
.world-board > header {
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 18px;
  border-bottom: 1px solid rgba(151,206,224,.15);
  font: 700 10px/1 ui-monospace, monospace;
  letter-spacing: .12em;
}
.world-board > header > div { display: flex; align-items: center; gap: 10px; color: #dffbff; }
.world-board > header p { color: #6e8290; }

.world-map {
  position: relative;
  min-height: 540px;
  overflow: hidden;
  contain: layout paint style;
  isolation: isolate;
  background:
    radial-gradient(circle at 48% 45%, rgba(0,229,255,.08), transparent 42%),
    repeating-linear-gradient(0deg, transparent 0 35px, rgba(90,190,220,.035) 36px),
    repeating-linear-gradient(90deg, transparent 0 35px, rgba(90,190,220,.035) 36px),
    #060c14;
}
.world-map::after {
  content: "WORLD WtE NETWORK / 60 SOURCED FACILITY & PROJECT RECORDS";
  position: absolute;
  right: 14px;
  bottom: 12px;
  color: rgba(185,222,231,.22);
  font: 800 11px/1 ui-monospace, monospace;
  letter-spacing: .18em;
  pointer-events: none;
}
.continent { position: absolute; pointer-events:none; opacity: .15; filter: drop-shadow(0 0 25px rgba(0,229,255,.22)); }
.continent::before,
.continent::after,
.continent i { content:""; position:absolute; display:block; background: linear-gradient(135deg, #5e7e8d, #174555); }
.c-americas { left: 3%; top: 15%; width: 25%; height: 62%; }
.c-americas::before { inset: 0 23% 45% 0; clip-path: polygon(8% 10%,70% 0,100% 25%,70% 42%,82% 65%,44% 72%,25% 100%,0 65%); }
.c-americas::after { left: 43%; top: 45%; width: 42%; height: 55%; clip-path: polygon(10% 0,65% 9%,100% 33%,72% 50%,58% 100%,30% 72%,0 30%); }
.c-europe { left: 31%; top: 13%; width: 24%; height: 33%; }
.c-europe::before { inset: 15% 0 5% 8%; clip-path: polygon(0 30%,24% 0,47% 17%,68% 2%,100% 27%,82% 58%,55% 50%,36% 100%,15% 70%); }
.c-asia { left: 48%; top: 13%; width: 46%; height: 55%; }
.c-asia::before { inset: 0; clip-path: polygon(0 25%,20% 0,55% 9%,75% 25%,100% 35%,82% 64%,62% 56%,50% 100%,28% 76%,8% 68%); }
.c-oceania { right: 7%; bottom: 6%; width: 17%; height: 22%; }
.c-oceania::before { inset: 0; clip-path: polygon(0 25%,44% 0,100% 30%,82% 92%,40% 100%,10% 68%); }

#tour-route-lines { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events:none; }
#tour-route-lines polyline { fill: none; stroke: rgba(0,229,255,.19); stroke-width: 1.5; stroke-dasharray: 5 7; vector-effect: non-scaling-stroke; }
#tour-route-lines .route-glow { stroke: rgba(255,44,168,.16); stroke-width: 7; filter: blur(5px); }

#tour-nodes { position:absolute; inset:0; z-index:4; pointer-events:none; }
#tour-nodes .tour-node { pointer-events:auto; }

.tour-node {
  position: absolute;
  width: 44px;
  height: 44px;
  padding: 0;
  transform: translate(-50%, -50%);
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #fff;
  box-shadow: none;
  cursor: pointer;
  z-index: 3;
  touch-action: manipulation;
  transition: transform .15s, box-shadow .15s;
}
.tour-node::before {
  content:"";
  position:absolute;
  inset:10px;
  border:2px solid rgba(220,242,249,.8);
  border-radius:50%;
  background:#08121c;
  box-shadow:0 0 0 3px rgba(2,7,12,.78),0 0 15px rgba(0,229,255,.15);
  transition:transform .15s,background .15s,box-shadow .15s;
}
.tour-node::after { content: attr(data-number); position: absolute; left: 50%; top: 31px; transform: translateX(-50%); color: rgba(220,239,245,.72); font: 800 9px/1 ui-monospace, monospace; }
.tour-node:hover,
.tour-node:focus-visible { transform: translate(-50%,-50%) scale(1.12); z-index: 8; outline: 3px solid #fff; outline-offset: 2px; }
.tour-node:hover::before,
.tour-node:focus-visible::before { transform:scale(1.35); background:var(--tour-cyan); box-shadow:0 0 0 3px #06121a,0 0 22px var(--tour-cyan); }
.tour-node.is-visited::before { background: var(--tour-gold); border-color: #fff0a5; box-shadow: 0 0 0 3px #0b1014, 0 0 18px rgba(255,211,79,.65); }
.tour-node.is-current { animation:none; z-index: 7; }
.tour-node.is-current::before { background:var(--tour-pink); border-color:#fff; box-shadow:0 0 0 3px #0b1014,0 0 24px rgba(255,44,168,.8); }
.tour-node.is-preview { box-shadow:0 0 0 3px var(--tour-cyan); }
.map-scan { position: absolute; left:0; right:0; height:2px; top:0; pointer-events:none; background: linear-gradient(90deg,transparent,var(--tour-cyan),transparent); opacity:.35; box-shadow:0 0 22px var(--tour-cyan); animation: mapScan 5s linear infinite; }

/* The world board stays vivid without continuously moving the whole scene.
   Static ambience keeps taps, scrolling and focus recovery stable on phones. */
.tour-atmosphere i,.map-scan { animation:none; }

/* During an input transition, trade invisible glow work for guaranteed input
   latency.  The board returns to its full visual treatment as soon as it is idle. */
#tour-screen.is-tour-processing :where(.continent,#tour-route-lines .route-glow) { filter:none!important; }
#tour-screen.is-tour-processing .dice { animation:none!important; }
#tour-screen.is-tour-processing .tour-node::before { transition:none!important; }
@media (max-width:900px), (pointer:coarse) {
  #tour-screen :where(.continent,#tour-route-lines .route-glow) { filter:none!important; }
  #tour-screen :where(.world-board,.plant-passport) { box-shadow:none!important; }
}

.dice-console {
  min-height: 112px;
  display: grid;
  grid-template-columns: 82px minmax(230px,1fr) 150px 178px;
  align-items: center;
  gap: 16px;
  padding: 13px 16px;
  border-top: 1px solid rgba(151,206,224,.15);
  background: linear-gradient(90deg, rgba(0,229,255,.06), transparent 45%, rgba(255,44,168,.06));
}
.dice { width:72px; height:72px; display:grid; place-items:center; border:1px solid rgba(0,229,255,.5); background:linear-gradient(145deg,#132534,#050a10); box-shadow: inset 0 0 24px rgba(0,229,255,.1),0 0 25px rgba(0,229,255,.09); transform:rotate(-3deg); }
.dice span { font-size:34px; line-height:1; color:#fff; text-shadow:0 0 18px var(--tour-cyan); }
.dice b { margin-top:-11px; color:var(--tour-cyan); font:800 8px/1 ui-monospace,monospace; letter-spacing:.2em; }
.dice.is-rolling { animation: diceRoll .55s cubic-bezier(.2,.8,.2,1) infinite; }
.dice-console small { color:#6d8493; font:700 9px/1 ui-monospace,monospace; letter-spacing:.12em; }
.dice-console > div:nth-child(2) b { display:block; margin:7px 0 4px; font-size:17px; }
.dice-console p { color:#8da1af; font-size:12px; line-height:1.5; }
.dice-console button { min-height:68px; border:0; color:#071016; background:var(--tour-gold); box-shadow:8px 8px 0 var(--tour-pink),0 0 26px rgba(255,211,79,.22); cursor:pointer; transform:skew(-4deg); touch-action:manipulation; transition:filter .12s,transform .12s,opacity .12s; }
.dice-console button span,.dice-console button b { display:block; transform:skew(4deg); }
.dice-console button span { font:800 9px/1 ui-monospace,monospace; letter-spacing:.15em; }
.dice-console button b { margin-top:5px; font-size:16px; }
.dice-console button:hover { filter:brightness(1.12); transform:skew(-4deg) translateY(-2px); }
.dice-console button:active:not(:disabled) { filter:brightness(1.2); transform:skew(-4deg) translate(3px,3px) scale(.98); box-shadow:4px 4px 0 var(--tour-pink),0 0 18px rgba(255,211,79,.28); }
.dice-console button:disabled { opacity:.45; cursor:wait; }
.dice-console button.is-busy { opacity:.72; cursor:progress; }
.dice-console button.is-temporarily-locked { opacity:.62; cursor:progress; }
.dice-console .tour-quick-challenge { color:#fff; background:linear-gradient(90deg,var(--tour-pink),#ff5a1f); box-shadow:8px 8px 0 var(--tour-cyan),0 0 26px rgba(255,44,168,.24); }
.dice-console .tour-quick-challenge:disabled { opacity:.45; }

.plant-passport { position:relative; display:flex; min-height:780px; padding:18px; overflow:hidden; flex-direction:column; }
.plant-passport::after { content:"MEGURU\A WtE\A PASSPORT"; white-space:pre; position:absolute; right:-8px; top:90px; color:rgba(255,255,255,.025); font:900 72px/.77 sans-serif; transform:rotate(-90deg) translateX(-100%); transform-origin:right top; pointer-events:none; }
.passport-top { display:flex; justify-content:space-between; align-items:center; }
.passport-top span { color:var(--tour-cyan); font:900 10px/1 ui-monospace,monospace; letter-spacing:.18em; }
.passport-top b { padding:5px 8px; color:var(--tour-lime); border:1px solid currentColor; font:800 9px/1 ui-monospace,monospace; }
.passport-number { display:flex; align-items:baseline; gap:7px; margin:22px 0 7px; }
.passport-number small { color:#687e8e; writing-mode:vertical-rl; font:800 8px/1 ui-monospace,monospace; letter-spacing:.16em; }
.passport-number strong { color:#fff; font:900 76px/.8 ui-monospace,monospace; letter-spacing:-.09em; text-shadow:5px 5px 0 rgba(255,44,168,.52); }
.passport-number span { color:#657886; font:800 14px/1 ui-monospace,monospace; }
#plant-location { color:#7c95a4; font:700 10px/1 ui-monospace,monospace; letter-spacing:.14em; }
.plant-passport h3 { position:relative; max-width:310px; margin:11px 0 9px; font-size:clamp(22px,2.1vw,34px); line-height:1.02; letter-spacing:-.04em; }
.plant-type { display:inline-block; padding:6px 9px; color:#081016; background:var(--tour-lime); font-size:11px; font-weight:900; transform:skew(-5deg); }
.passport-specs { display:grid; grid-template-columns:1fr 1fr; margin:20px 0 0; border-top:1px solid rgba(151,206,224,.17); border-left:1px solid rgba(151,206,224,.17); }
.passport-specs > div { min-height:70px; padding:11px; border-right:1px solid rgba(151,206,224,.17); border-bottom:1px solid rgba(151,206,224,.17); }
.passport-specs small,.plant-feature small,.plant-mission small { display:block; color:#607786; font:800 8px/1 ui-monospace,monospace; letter-spacing:.13em; }
.passport-specs b { display:block; margin-top:8px; color:#effcff; font:800 15px/1.1 ui-monospace,monospace; }
.plant-feature,.plant-mission { position:relative; margin-top:14px; padding:13px 14px; background:rgba(111,153,171,.08); border-left:3px solid var(--tour-cyan); }
.plant-feature p,.plant-mission p { margin-top:7px; color:#b9c8d1; font-size:12px; line-height:1.65; }
.plant-mission { border-left-color:var(--tour-pink); background:rgba(255,44,168,.07); }
.plant-mission b { display:block; margin-top:7px; color:var(--tour-pink); font:900 13px/1 ui-monospace,monospace; letter-spacing:.08em; }
#plant-source { display:block; margin:13px 0; color:#9fb4c0; font:700 10px/1.2 ui-monospace,monospace; text-decoration:none; }
#plant-source:hover { color:var(--tour-cyan); }
.tour-crew-pick {
  position:relative;
  display:grid;
  grid-template-columns:54px 1fr;
  gap:10px;
  align-items:center;
  margin:2px 0 10px;
  padding:9px;
  border:1px solid rgba(255,211,79,.26);
  background:linear-gradient(105deg,rgba(255,211,79,.08),rgba(255,44,168,.06));
}
.tour-pick-portrait {
  width:54px;
  height:54px;
  border:2px solid #fff;
  border-radius:16px;
  background:#18303b url("assets/meguru-crew-roster-v2.webp") var(--tour-pick-x,0%) var(--tour-pick-y,0%)/300% 200% no-repeat;
  box-shadow:0 7px 18px rgba(0,0,0,.3);
}
.tour-pick-portrait[data-crew="mio"] { --tour-pick-x:0%;--tour-pick-y:0%; }
.tour-pick-portrait[data-crew="rin"] { --tour-pick-x:50%;--tour-pick-y:0%; }
.tour-pick-portrait[data-crew="mei"] { --tour-pick-x:100%;--tour-pick-y:0%; }
.tour-pick-portrait[data-crew="sara"] { --tour-pick-x:0%;--tour-pick-y:100%; }
.tour-pick-portrait[data-crew="haru"] { --tour-pick-x:50%;--tour-pick-y:100%; }
.tour-pick-portrait[data-crew="ren"] { --tour-pick-x:100%;--tour-pick-y:100%; }
.tour-crew-pick div { min-width:0; }
.tour-crew-pick small { display:block; overflow:hidden; color:var(--tour-gold); font:850 8px/1.2 ui-monospace,monospace; text-overflow:ellipsis; white-space:nowrap; }
.tour-crew-pick b { display:block; margin-top:4px; color:#fff; font-size:12px; }
.tour-crew-pick p { display:-webkit-box; margin:4px 0 0; overflow:hidden; color:#9fb5c0; font-size:10px; line-height:1.45; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.tour-atlas-detail {
  width:100%;
  min-height:54px;
  margin:0 0 9px;
  padding:9px 12px;
  border:1px solid rgba(0,229,255,.5);
  color:#eaffff;
  background:linear-gradient(90deg,rgba(0,229,255,.17),rgba(0,229,255,.06));
  text-align:left;
  cursor:pointer;
  touch-action:manipulation;
  transition:background .12s,transform .12s,opacity .12s;
}
.tour-atlas-detail span,.tour-atlas-detail b { display:block; }
.tour-atlas-detail span { color:var(--tour-cyan); font:850 8px/1 ui-monospace,monospace; letter-spacing:.1em; }
.tour-atlas-detail b { margin-top:5px; font-size:12px; }
.tour-atlas-detail:hover,.tour-atlas-detail:focus-visible { background:rgba(0,229,255,.2); }
.tour-atlas-detail:active:not(:disabled) { transform:scale(.985); }
.tour-atlas-detail.is-busy { opacity:.7; cursor:progress; }
.tour-start { width:100%; min-height:54px; margin-top:auto; background:linear-gradient(90deg,var(--tour-pink),#ff5a1f)!important; box-shadow:0 0 28px rgba(255,44,168,.22); }
.tour-start,.tour-back { touch-action:manipulation; }
.tour-start:active:not(:disabled) { transform:translateY(2px) scale(.985); }
.tour-start.is-busy { opacity:.72; cursor:progress; }
.tour-start.is-temporarily-locked { opacity:.62; cursor:progress; }
.tour-back { width:100%; margin-top:8px; padding:9px; border:1px solid rgba(151,206,224,.18); color:#718796; background:transparent; font-size:11px; cursor:pointer; }

.passport-atlas { position:relative; z-index:1; max-width:1500px; margin:14px auto 0; padding:16px; }
.atlas-heading { display:flex; justify-content:space-between; align-items:center; padding-bottom:12px; border-bottom:1px solid rgba(151,206,224,.16); }
.atlas-heading span { color:var(--tour-gold); font:900 11px/1 ui-monospace,monospace; letter-spacing:.16em; }
.atlas-heading b { color:#768d9b; font-size:11px; }
.atlas-filter { display:flex; flex-wrap:wrap; gap:7px; margin:12px 0; }
.atlas-filter button { padding:7px 10px; border:1px solid rgba(151,206,224,.18); color:#86a0ad; background:rgba(255,255,255,.02); font:800 9px/1 ui-monospace,monospace; letter-spacing:.08em; cursor:pointer; }
.atlas-filter button.is-active { color:#071016; border-color:var(--tour-cyan); background:var(--tour-cyan); }
.atlas-list { display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); gap:6px; max-height:208px; overflow:auto; scrollbar-color:var(--tour-cyan) #0a1118; }
.atlas-card { min-height:62px; padding:8px; text-align:left; border:1px solid rgba(151,206,224,.14); color:#c3d2da; background:rgba(255,255,255,.025); cursor:pointer; content-visibility:auto; contain-intrinsic-size:100px 82px; }
.atlas-card span { display:block; color:#667f8d; font:800 8px/1 ui-monospace,monospace; }
.atlas-card b { display:block; margin-top:5px; overflow:hidden; color:#dfeef3; font-size:10px; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.atlas-card small { display:block; margin-top:4px; color:#708796; font-size:8px; }
.atlas-card.is-visited { border-color:rgba(255,211,79,.45); background:rgba(255,211,79,.06); }
.atlas-card.is-current { border-color:var(--tour-pink); box-shadow:inset 0 0 16px rgba(255,44,168,.12); }
.atlas-card:hover { border-color:var(--tour-cyan); }

.real-spec-brief {
  display:grid;
  grid-template-columns:auto minmax(190px,1fr) auto auto minmax(220px,1.3fr);
  align-items:center;
  gap:15px;
  max-width:1500px;
  margin:0 auto 18px;
  padding:12px 16px;
  color:#dffaff;
  background:linear-gradient(90deg,rgba(0,229,255,.12),rgba(4,10,16,.92) 35%,rgba(255,44,168,.08));
  border:1px solid rgba(0,229,255,.28);
  box-shadow:0 14px 40px rgba(0,0,0,.18),inset 0 0 28px rgba(0,229,255,.03);
}
.real-spec-brief > span { color:var(--tour-cyan); font:900 9px/1 ui-monospace,monospace; letter-spacing:.15em; }
.real-spec-brief > b { font-size:18px; }
.real-spec-brief div { padding-left:14px; border-left:1px solid rgba(151,206,224,.2); }
.real-spec-brief small { display:block; color:#728d9c; font-size:9px; }
.real-spec-brief strong { display:block; margin-top:3px; font:900 14px/1 ui-monospace,monospace; }
.real-spec-brief p { color:#9eb1bc; font-size:11px; line-height:1.5; }
.operate-spec { margin-top:-10px; border-color:rgba(255,44,168,.28); }
.operate-spec > span { color:var(--tour-pink); }

.passport-result {
  display:grid;
  grid-template-columns:110px 1fr 240px;
  align-items:center;
  gap:20px;
  max-width:1180px;
  margin:0 auto 22px;
  padding:18px 22px;
  color:#eafeff;
  background:linear-gradient(115deg,#07121b,#0c1922 60%,#241222);
  border:1px solid rgba(0,229,255,.25);
  box-shadow:0 22px 55px rgba(0,0,0,.24),inset 0 0 35px rgba(0,229,255,.03);
}
.passport-stamp { width:88px; height:88px; display:grid; place-items:center; border:3px double var(--tour-gold); border-radius:50%; color:var(--tour-gold); transform:rotate(-7deg); box-shadow:0 0 18px rgba(255,211,79,.18); }
.passport-stamp span,.passport-stamp small { font:900 8px/1 ui-monospace,monospace; letter-spacing:.12em; }
.passport-stamp b { margin:-8px 0; font-size:28px; }
.passport-result > div:not(:first-child) small { color:#718895; font:800 8px/1 ui-monospace,monospace; letter-spacing:.13em; }
.passport-result h3 { margin:5px 0; font-size:22px; }
.passport-result p { color:#9cb0bb; font-size:11px; }
.passport-result > div:last-child { padding-left:18px; border-left:1px solid rgba(151,206,224,.18); }
.passport-result > div:last-child b { display:block; margin:7px 0 4px; color:var(--tour-cyan); font:900 25px/1 ui-monospace,monospace; }

@keyframes tourPulse { 50% { opacity:.45; transform:scale(1.08); } }
@keyframes tourSweep { to { transform:translateX(70%); } }
@keyframes mapScan { from { transform:translateY(0); } to { transform:translateY(540px); } }
@keyframes currentNode { 50% { transform:translate(-50%,-50%) scale(1.4); box-shadow:0 0 0 6px rgba(255,44,168,.15),0 0 30px var(--tour-pink); } }
@keyframes diceRoll { 25% { transform:rotate(16deg) scale(.88); } 55% { transform:rotate(190deg) scale(1.12); } 100% { transform:rotate(360deg); } }

@media (max-width: 1180px) {
  .tour-layout { grid-template-columns:1fr 320px; }
  .atlas-list { grid-template-columns:repeat(6,minmax(0,1fr)); }
  .real-spec-brief { grid-template-columns:auto 1fr auto auto; }
  .real-spec-brief p { grid-column:1/-1; }

  /* Geographic points become too dense for 44 px touch targets at tablet
     widths. Use the same numbered route as a non-overlapping stop grid. */
  .world-map { min-height:540px; }
  .world-map .continent,#tour-route-lines,.world-map .map-scan { display:none; }
  #tour-nodes {
    position:absolute;
    inset:16px 14px 54px;
    z-index:4;
    display:grid;
    grid-template-columns:repeat(8,minmax(44px,1fr));
    grid-auto-rows:52px;
    align-content:start;
  }
  .tour-node {
    position:relative;
    left:auto!important;
    top:auto!important;
    place-self:center;
    transform:none;
  }
  .tour-node:hover,.tour-node:focus-visible { transform:scale(1.08); }
}

@media (max-width: 880px) {
  .title-screen .mode-preview { width:100%; grid-template-columns:repeat(2,1fr); min-height:132px; }
  .tour-screen { padding:92px 12px 40px; }
  .tour-hud { grid-template-columns:1fr 1fr; }
  .tour-hud > div:nth-child(2) { border-right:0; }
  .tour-layout { grid-template-columns:1fr; }
  .world-map { min-height:690px; }
  #tour-nodes {
    inset:14px 10px 54px;
    grid-template-columns:repeat(5,minmax(44px,1fr));
    grid-auto-rows:52px;
  }
  .dice-console { grid-template-columns:64px 1fr; }
  .dice { width:58px; height:58px; }
  .dice-console button { grid-column:1/-1; min-height:52px; }
  .dice-console .tour-quick-challenge { margin-top:2px; }
  .plant-passport { min-height:auto; }
  .atlas-list { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .real-spec-brief { grid-template-columns:1fr 1fr; gap:10px; }
  .real-spec-brief > span,.real-spec-brief > b,.real-spec-brief p { grid-column:1/-1; }
  .real-spec-brief div { padding-left:0; border-left:0; }
  .passport-result { grid-template-columns:82px 1fr; }
  .passport-result > div:last-child { grid-column:1/-1; padding:12px 0 0; border-left:0; border-top:1px solid rgba(151,206,224,.18); }
}

@media (prefers-reduced-motion: reduce) {
  .tour-atmosphere i,.map-scan,.tour-node.is-current,.dice.is-rolling { animation:none!important; }
}
