/* TRACES IN TIME — ERA I — MAP HOME V2
   Adds the approved game-map presentation while retaining original home content. */
.tracce-map-nav{position:absolute;z-index:8;inset:0;pointer-events:none}
.tracce-map-intro{position:absolute;left:50%;top:11%;transform:translateX(-50%);width:min(680px,62vw);text-align:center;text-shadow:0 4px 24px var(--skin-c282);pointer-events:none}
.tracce-map-intro .map-eyebrow{font:900 10px/1 var(--ui);letter-spacing:.28em;color:var(--skin-c283);text-transform:uppercase}
.tracce-map-intro h1{margin:8px 0 7px;font:700 clamp(31px,4vw,58px)/.98 var(--display);color:var(--skin-c284)}
.tracce-map-intro p{max-width:560px;margin:0 auto;color:var(--skin-c285);font:700 clamp(10px,.95vw,14px)/1.45 var(--ui)}
.tracce-map-route{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 3px 4px var(--skin-c145))}
.tracce-map-route .route-shadow{fill:none;stroke:var(--skin-c286);stroke-width:1.4;stroke-linecap:round;stroke-dasharray:1.15 2.2}
.tracce-map-route .route-main{fill:none;stroke:var(--skin-c287);stroke-width:.48;stroke-linecap:round;stroke-dasharray:1.15 2.2}
.tracce-map-node{--x:50%;--y:50%;position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);pointer-events:auto;text-decoration:none;color:var(--skin-c288);display:flex;flex-direction:column;align-items:center;gap:6px;filter:drop-shadow(0 7px 9px var(--skin-c289));transition:transform .2s ease,filter .2s ease;z-index:3}
.tracce-map-node:hover,.tracce-map-node:focus-visible{transform:translate(-50%,-50%) scale(1.08);filter:drop-shadow(0 10px 12px var(--skin-c290));outline:none}
.tracce-map-node .node-orb{position:relative;width:clamp(44px,4.8vw,66px);height:clamp(44px,4.8vw,66px);border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 38% 30%,var(--skin-c291),var(--skin-c292) 33%,var(--skin-c293) 60%,var(--skin-c294) 100%);border:3px solid var(--skin-c295);box-shadow:0 0 0 5px var(--skin-c296),0 0 0 7px var(--skin-c297),0 0 28px var(--skin-c298)}
.tracce-map-node .node-orb::after{content:"";position:absolute;inset:-10px;border:1px solid var(--skin-c299);border-radius:50%;animation:eraNodePulse 2.6s infinite}
.tracce-map-node .node-number{font:900 clamp(14px,1.4vw,20px)/1 var(--ui);color:var(--skin-c300);text-shadow:0 2px 5px var(--skin-c087)}
.tracce-map-node .node-label{white-space:nowrap;padding:5px 9px;border:1px solid var(--skin-c301);border-radius:9px;background:var(--skin-c302);backdrop-filter:blur(8px);font:900 clamp(8px,.82vw,11px)/1 var(--ui);letter-spacing:.04em;text-transform:uppercase}
.tracce-map-node .node-label small{display:block;margin-top:3px;color:var(--skin-c303);font-size:.72em;letter-spacing:.09em;text-align:center}
.tracce-map-node.completed .node-orb{background:radial-gradient(circle at 38% 30%,var(--skin-c304),var(--skin-c305) 38%,var(--skin-c306) 66%,var(--skin-c307) 100%);border-color:var(--skin-c308)}
.tracce-map-node.current .node-orb{box-shadow:0 0 0 5px var(--skin-c296),0 0 0 8px var(--skin-c309),0 0 38px var(--skin-c310)}
.tracce-map-node.locked{opacity:.58;filter:grayscale(.28) drop-shadow(0 7px 8px var(--skin-c311))}
.tracce-map-node.final .node-orb{background:radial-gradient(circle at 48% 42%,var(--skin-c312),var(--skin-c313) 38%,var(--skin-c314) 68%,var(--skin-c315) 100%);border-color:var(--skin-c316);box-shadow:0 0 0 5px var(--skin-c317),0 0 0 7px var(--skin-c318),0 0 34px var(--skin-c319)}
@keyframes eraNodePulse{0%,100%{transform:scale(.9);opacity:.18}50%{transform:scale(1.15);opacity:.72}}

/* Recompose original home controls around the map instead of removing them. */
@media (min-width:901px) and (min-aspect-ratio:4/3){
  .tracce-home .brand-plaque{top:18px!important;left:22px!important;width:auto!important;min-width:280px!important;max-width:360px!important;min-height:66px!important;padding:9px 22px!important;border-radius:17px!important}
  .tracce-home .brand-title{font-size:21px!important}.tracce-home .brand-sub{font-size:8px!important}
  .tracce-home .brand-glyphs{display:none!important}
  .tracce-home .surface-secondary-panel{left:22px!important;top:auto!important;bottom:22px!important;width:min(430px,36vw)!important;height:auto!important;min-height:0!important;max-height:none!important;padding:20px 22px 18px!important;border-radius:22px!important;overflow:visible!important}
  .tracce-home .surface-secondary-panel .panel-body{max-height:none!important;overflow:visible!important;padding-right:2px!important}
  .tracce-home .panel-mark{width:34px!important;height:34px!important;margin-bottom:3px!important}.tracce-home .panel-title{font-size:36px!important}.tracce-home .panel-subtitle{font-size:13px!important}.tracce-home .story-copy{font-size:12px!important}.tracce-home .story-detail{font-size:9px!important}.tracce-home .panel-actions{gap:7px!important}.tracce-home .panel-actions .btn{font-size:9px!important;padding:.75em .9em!important}.tracce-home .panel-footnote{display:none!important}
  .tracce-home .menu-column{right:22px!important;top:18px!important;width:235px!important;height:auto!important;gap:6px!important}
  .tracce-home .menu-card{min-height:54px!important;padding:7px 45px 7px 52px!important;border-radius:13px!important}.tracce-home .menu-icon{left:9px!important;width:38px!important}.tracce-home .menu-icon svg{width:34px!important;height:34px!important}.tracce-home .menu-title{font-size:15px!important}.tracce-home .menu-meta{font-size:7px!important}.tracce-home .menu-knot{right:11px!important;width:12px!important;height:12px!important}
  .tracce-home .stats-panel{right:22px!important;left:auto!important;bottom:22px!important;width:310px!important;min-height:86px!important;padding:17px 14px 12px!important;border-radius:20px!important}.tracce-home .stat strong{font-size:27px!important}.tracce-home .stat span{font-size:7px!important;margin-top:5px!important}
  .tracce-home .scene-caption,.tracce-home .utility-strip{display:none!important}
}

/* Tablet: map remains the hero, original panels become content below it. */
@media (max-width:1100px) and (min-width:561px){
  .tracce-map-intro{top:13%;width:70vw}.tracce-map-intro h1{font-size:clamp(32px,6vw,50px)}
  .tracce-map-node .node-label{font-size:8px}
}

/* Phone / narrow tablet: dedicated vertical map composition. */
@media (max-aspect-ratio:4/3),(max-width:900px){
  .tracce-map-nav{height:56vh;min-height:390px;inset:0 0 auto 0}
  .tracce-map-intro{top:16%;width:86vw}.tracce-map-intro .map-eyebrow{font-size:8px}.tracce-map-intro h1{font-size:clamp(28px,8vw,44px);margin-top:6px}.tracce-map-intro p{display:none}
  .tracce-map-node .node-orb{width:43px;height:43px;border-width:2px}.tracce-map-node .node-orb::after{inset:-7px}.tracce-map-node .node-label{font-size:7px;padding:4px 6px}.tracce-map-node .node-label small{display:none}
  .tracce-map-node.n1{--x:13%!important;--y:67%!important}.tracce-map-node.n2{--x:28%!important;--y:48%!important}.tracce-map-node.n3{--x:43%!important;--y:69%!important}.tracce-map-node.n4{--x:59%!important;--y:48%!important}.tracce-map-node.n5{--x:75%!important;--y:68%!important}.tracce-map-node.n6{--x:88%!important;--y:47%!important}
}
@media (max-width:560px){
  .tracce-map-nav{height:50vh;min-height:340px}.tracce-map-intro{top:19%}.tracce-map-intro h1{font-size:30px}
  .tracce-map-node .node-orb{width:37px;height:37px}.tracce-map-node .node-number{font-size:12px}.tracce-map-node .node-label{max-width:68px;white-space:normal;text-align:center;line-height:1.12}
  .tracce-map-node.n1{--x:11%!important;--y:69%!important}.tracce-map-node.n2{--x:27%!important;--y:51%!important}.tracce-map-node.n3{--x:43%!important;--y:71%!important}.tracce-map-node.n4{--x:60%!important;--y:51%!important}.tracce-map-node.n5{--x:76%!important;--y:70%!important}.tracce-map-node.n6{--x:89%!important;--y:50%!important}
}
@media(prefers-reduced-motion:reduce){.tracce-map-node .node-orb::after{animation:none!important}}

/* POINT 9 — MOBILE HOME MAP EMPHASIS
   Mobile only: enlarge the playable map area and its tappable level zones. */
.tracce-map-route .route-mobile{display:none}
@media (max-width:760px){
  .tracce-home{padding-top:63svh!important}
  .tracce-home .world-layer{height:66svh!important}
  .tracce-map-nav{height:64svh!important;min-height:440px!important}
  .tracce-map-intro{top:20%!important;width:90vw!important}
  .tracce-map-intro .map-eyebrow{font-size:9px!important;letter-spacing:.24em!important}
  .tracce-map-intro h1{font-size:clamp(32px,8.5vw,46px)!important;margin:6px 0 0!important}
  .tracce-map-node{gap:8px!important;min-width:78px!important}
  .tracce-map-node .node-orb{width:56px!important;height:56px!important;border-width:3px!important;box-shadow:0 0 0 5px var(--skin-c320),0 0 0 8px var(--skin-c321),0 0 30px var(--skin-c322)!important}
  .tracce-map-node .node-orb::after{inset:-9px!important}
  .tracce-map-node .node-number{font-size:16px!important}
  .tracce-map-node .node-label{min-width:78px!important;max-width:104px!important;white-space:normal!important;text-align:center!important;font-size:9px!important;line-height:1.14!important;padding:6px 8px!important;border-radius:10px!important;background:var(--skin-c323)!important}
  .tracce-map-node .node-label small{display:block!important;margin-top:3px!important;font-size:7px!important;line-height:1.05!important}
  .tracce-map-node.n1{--x:14%!important;--y:70%!important}
  .tracce-map-node.n2{--x:29%!important;--y:48%!important}
  .tracce-map-node.n3{--x:44%!important;--y:70%!important}
  .tracce-map-node.n4{--x:59%!important;--y:48%!important}
  .tracce-map-node.n5{--x:74%!important;--y:70%!important}
  .tracce-map-node.n6{--x:87%!important;--y:48%!important}
  .tracce-map-route .route-desktop{display:none}
  .tracce-map-route .route-mobile{display:block}
}
@media (max-width:560px){
  .tracce-home{padding-top:61svh!important}
  .tracce-home .world-layer{height:64svh!important}
  .tracce-map-nav{height:62svh!important;min-height:410px!important}
  .tracce-map-intro{top:21%!important}
  .tracce-map-intro h1{font-size:32px!important}
  .tracce-map-node{min-width:72px!important}
  .tracce-map-node .node-orb{width:52px!important;height:52px!important}
  .tracce-map-node .node-number{font-size:15px!important}
  .tracce-map-node .node-label{min-width:72px!important;max-width:88px!important;font-size:8px!important;padding:6px 5px!important}
  .tracce-map-node .node-label small{font-size:6.5px!important}
}