/* Find the Way: a warm paper town map laid on the night arena. Mint is this game's accent. */
.gm-theme-route{--accent:#2fc48d;--accent2:#128a5e}
.gm-poster.gm-route{--c:#2fc48d}
.rt-intro .rt-host{max-height:250px}
.rt-facts{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:8px}
.rt-facts li{display:flex;align-items:center;gap:10px;font-weight:700}
.rt-facts li span:first-child{display:grid;place-items:center;width:34px;height:34px;border-radius:12px;background:rgba(255,255,255,.1);font-size:18px;flex:none}

/* Round layout: recording on top, map left, controls right (one column on phones). */
.rt-hud{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.rt-hud .rt-round{background:linear-gradient(180deg,var(--accent),var(--accent2))}
.rt-hud .rt-clock{margin-left:auto;font-variant-numeric:tabular-nums}
.rt-hud .rt-score{color:var(--gold)}
.rt-play{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,320px);grid-template-areas:'map top' 'map ctrl' 'map .';grid-template-rows:auto auto 1fr;gap:14px;align-items:start}
.rt-top{grid-area:top}.rt-mapbox{grid-area:map;width:100%;justify-self:center}.rt-controls,.rt-result{grid-area:ctrl}
.rt-card{background:var(--glass);border:1px solid var(--line);border-radius:20px;padding:14px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.rt-goal{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.rt-goal-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:16px;background:linear-gradient(180deg,#ffe28a,#ffb84d);font-size:26px;flex:none;box-shadow:inset 0 -3px 0 rgba(0,0,0,.15)}
.rt-goal small{display:block;color:var(--muted);font-weight:800;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.rt-goal strong{display:block;font-family:var(--display);font-size:28px;line-height:1.05}
.rt-listen{display:flex;align-items:center;gap:12px}
.rt-play-btn{flex:1 1 auto;min-height:50px}
.rt-eq{display:flex;align-items:flex-end;gap:3px;height:34px;flex:none}
.rt-eq i{width:5px;height:6px;border-radius:3px;background:linear-gradient(180deg,#b6ffe3,var(--accent))}
.rt-eq.on i{animation:rt-eq .45s ease-in-out infinite alternate;animation-delay:calc(var(--i)*-61ms)}
@keyframes rt-eq{from{height:6px}to{height:32px}}

/* The map board */
.rt-mapbox{position:relative;padding:8px;border-radius:24px;background:linear-gradient(180deg,#fff4dc,#ecd9b4);box-shadow:0 26px 50px -26px #000,inset 0 0 0 2px rgba(255,255,255,.55);color:#4a3a22}
.rt-svg{display:block;width:100%;height:auto;max-height:min(76vh,760px);margin:0 auto;user-select:none;-webkit-user-select:none;touch-action:manipulation;font-family:'Be Vietnam Pro',system-ui,sans-serif}
.rt-compass{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#fffaf0;border:2px solid #d8c49c;color:#b2452f;font-family:var(--display);font-weight:800;font-size:15px;box-shadow:0 4px 10px -4px rgba(0,0,0,.35);pointer-events:none}
.rt-compass::before{content:'';position:absolute;top:-9px;border:6px solid transparent;border-bottom:8px solid #b2452f}
.rt-toast{position:absolute;left:50%;bottom:16px;max-width:calc(100% - 32px);margin:0;padding:8px 14px;border-radius:14px;background:#2a1f45;color:#fff;font-weight:700;font-size:14px;text-align:center;
  transform:translate(-50%,10px);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
.rt-toast.show{animation:rt-toast 2.6s ease forwards}
@keyframes rt-toast{0%{opacity:0;transform:translate(-50%,10px)}10%,80%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,0)}}
.rt-paper{fill:#f4e7cc}
.rt-block{fill:#ead9b8}
.rt-kerb{fill:#d6c29b}.rt-kerb.bridge{fill:#9b7046}
.rt-road{fill:#fffaf0}.rt-road.bridge{fill:#e3c294}
.rt-lane{stroke:#eadcc0;stroke-width:1.4;stroke-dasharray:5 5}
.rt-rail{stroke:#8a5e36;stroke-width:1.6}
.rt-ring{fill:#fffaf0;stroke:#d6c29b;stroke-width:1.6}.rt-island{fill:#9fd68c;stroke:#7fc06c;stroke-width:1.4}
.rt-street{font-size:9.5px;font-weight:800;fill:#8b7252;letter-spacing:.02em;paint-order:stroke;stroke:#fffaf0;stroke-width:2.6px;pointer-events:none}
.rt-pill rect{fill:#fffdf7;stroke:#d9c6a0;stroke-width:1}
.rt-pill text{font-weight:800;fill:#4a3a22;pointer-events:none}
.rt-pill{pointer-events:none}
.rt-pill.feature rect{fill:#ffffffd9;stroke:none}
.rt-pill.start rect{fill:#2a1f45;stroke:#2fc48d;stroke-width:1.4}.rt-pill.start text{fill:#fff}
.rt-pill.tag rect{stroke-width:2}
.rt-pill.tag.right rect{fill:#e6fff3;stroke:#1fa772}.rt-pill.tag.right text{fill:#0f5f40}
.rt-pill.tag.wrong rect{fill:#ffe9ec;stroke:#e0455f}.rt-pill.tag.wrong text{fill:#9b1c33}
.rt-pill.rt-here{transition:opacity .4s}.rt-pill.rt-here.gone{opacity:0}
.rt-pill.tag{animation:rt-pop .45s cubic-bezier(.2,1.5,.4,1) backwards;transform-box:fill-box;transform-origin:center}
@keyframes rt-pop{from{transform:scale(.2);opacity:0}}
.rt-lm-wall{fill:#fffdf6;stroke:#cdb894;stroke-width:1.4}
.rt-lm-icon{pointer-events:none}
.rt-shop{cursor:pointer;transform-box:fill-box;transform-origin:center;transition:transform .15s}
.rt-wall{filter:drop-shadow(0 2px 0 rgba(90,60,20,.18))}
.rt-q{fill:#fff;stroke:#f0a91e;stroke-width:2}
.rt-q-mark{font-weight:900;fill:#d0680a;pointer-events:none;font-family:'Baloo 2','Be Vietnam Pro',sans-serif}
.rt-shop.close .rt-q{stroke:var(--accent2);stroke-width:2.6}
.rt-shop.close{animation:rt-near 1.6s ease-in-out infinite}
@keyframes rt-near{50%{transform:scale(1.045)}}
.rt-shop:hover{transform:scale(1.05)}
.rt-shop.sel{animation:none;transform:scale(1.08)}
.rt-shop.sel .rt-wall{stroke:#2fc48d;stroke-width:4;filter:drop-shadow(0 0 6px rgba(47,196,141,.9))}
.rt-shop.sel .rt-q{fill:#2fc48d;stroke:#fff}.rt-shop.sel .rt-q-mark{fill:#fff}
.rt-shop:focus-visible{outline:none}.rt-shop:focus-visible .rt-wall{stroke:var(--gold);stroke-width:3}
.answered .rt-shop{cursor:default;animation:none}
.rt-shop.found .rt-wall{stroke:#1fa772;stroke-width:4;filter:drop-shadow(0 0 8px rgba(31,167,114,.9))}.rt-shop.found .rt-q{fill:#1fa772;stroke:#fff}.rt-shop.found .rt-q-mark{fill:#fff}
.rt-shop.miss .rt-wall{stroke:#e0455f;stroke-width:4}.rt-shop.miss .rt-q{fill:#e0455f;stroke:#fff}.rt-shop.miss .rt-q-mark{fill:#fff}
.rt-dot{fill:#cbb48a;transition:r .2s}
.rt-dot.near{fill:#2fc48d;r:5.5px;stroke:#fff;stroke-width:2;animation:rt-dot 1.4s ease-in-out infinite}
.rt-dot.hint{fill:#ffb020;r:7px;stroke:#fff;stroke-width:2;animation:rt-hint .5s ease-in-out 4 alternate}
@keyframes rt-dot{50%{stroke-width:4;stroke:#c9ffe9}}
@keyframes rt-hint{to{r:10px}}
.rt-start-ring{fill:#2fc48d33;stroke:#2fc48d;stroke-width:2;stroke-dasharray:4 3}
.rt-node{fill:transparent;cursor:pointer}
.answered .rt-node{cursor:default}
.rt-trail{fill:none;stroke:#2fc48d;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 7;opacity:.9}
.rt-answer{fill:none;stroke:#ff9f1c;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;opacity:.92;filter:drop-shadow(0 1px 1px rgba(0,0,0,.25))}
.rt-answer.draw{animation:rt-draw 1.6s ease-out forwards}
@keyframes rt-draw{to{stroke-dashoffset:0}}
.rt-answer-dot{fill:#ff9f1c;stroke:#fff;stroke-width:2}
.rt-otter{transition:transform .19s linear;pointer-events:none}
.rt-otter-body{transform-box:fill-box;transform-origin:50% 100%}
.rt-otter-body.flip image{transform:scaleX(-1);transform-box:fill-box;transform-origin:center}
.rt-otter-body image{animation:rt-bob 1.2s ease-in-out infinite}
@keyframes rt-bob{50%{transform:translateY(-1.5px)}}
.rt-otter-body.flip image{animation:none}
.rt-otter-body.bump{animation:rt-bump .35s}
@keyframes rt-bump{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
.rt-shadow{fill:rgba(60,40,10,.28)}

/* Controls */
.rt-controls{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:'pad hint' 'go go';align-items:center;gap:12px 14px}
.rt-ctrl-right{display:contents}.rt-pad{grid-area:pad}.rt-confirm{grid-area:go}.rt-hint{grid-area:hint}
.rt-pad{display:grid;grid-template-columns:repeat(3,48px);grid-template-rows:repeat(3,48px);gap:5px;flex:none}
.rt-arrow{min-height:0;padding:0;font-size:22px;border-radius:14px;background:rgba(255,255,255,.14)}
.rt-N{grid-area:1/2}.rt-W{grid-area:2/1}.rt-E{grid-area:2/3}.rt-S{grid-area:3/2}
.rt-pad-otter{grid-area:2/2;border-radius:50%;background:rgba(47,196,141,.18) center/78% no-repeat;border:2px solid rgba(47,196,141,.5)}
.rt-confirm{width:100%;padding-inline:14px}
.rt-confirm:not(:disabled){animation:gm-glow 1.6s ease-in-out infinite}
.rt-hint{margin:0;color:var(--muted);font-size:13px;line-height:1.4}
.rt-result h3{margin:0 0 6px;font-family:var(--display);font-size:26px}
.rt-result.right h3{color:var(--good)}.rt-result.wrong h3{color:#ffb4c0}
.rt-result-name{margin:0;font-weight:800;font-size:17px}
.rt-points{margin:4px 0 10px;color:var(--muted);font-size:13px}
.rt-transcript{border-radius:14px;background:rgba(0,0,0,.25);padding:10px 12px}
.rt-transcript summary{cursor:pointer;font-weight:800}
.rt-transcript p{margin:8px 0 0;line-height:1.6;font-size:14px}
.rt-transcript mark{background:rgba(47,196,141,.28);color:#d9fff0;border-radius:4px;padding:0 2px}
.rt-result .gm-actions{margin-top:12px}
.rt-found-line{margin:0;font-family:var(--display);font-size:22px;font-weight:800}

@media (max-width:760px){
  .rt-play{grid-template-columns:1fr;grid-template-areas:'top' 'map' 'ctrl';grid-template-rows:auto}
  .rt-top{padding:10px 12px}.rt-goal{margin-bottom:8px}.rt-goal-icon{width:40px;height:40px;font-size:22px}.rt-goal strong{font-size:23px}
  .rt-play-btn{min-height:46px}
  .rt-hud .rt-town{display:none}
}
@media (max-width:640px){
  .gm-theme-route .gm-stage{padding:12px 10px}
  .rt-mapbox{padding:5px;border-radius:18px}
  .rt-street{font-size:12.5px}
  .rt-hud{gap:6px}.rt-hud .gm-pill{font-size:12px;padding:4px 10px}
  .rt-compass{top:9px;right:9px;width:28px;height:28px;font-size:13px}
  .rt-controls{gap:10px;padding:10px}
  .rt-pad{grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,44px);gap:4px}
}
@media (prefers-reduced-motion:reduce){.rt-otter{transition:none}.rt-shop.close,.rt-dot.near,.rt-otter-body image{animation:none}}