html,body,body *,button,input,select,textarea,dialog,svg text{font-family:"Nunito","Segoe UI",Arial,sans-serif!important}
.map-timeline{height:154px;padding:17px 25px 14px;border-top:1px solid var(--line);background:linear-gradient(180deg,#091c20,#071519)}
.map-time-head{display:flex;justify-content:space-between;align-items:center}
.map-header-tools{display:flex;flex-direction:column;align-items:flex-end;gap:9px}
.map-layer-controls{display:flex;gap:6px}
.map-layer-toggle{display:flex;align-items:center;gap:5px;height:27px;padding:0 9px;border:1px solid #26474d;background:#0a1b1f;color:#6f8b90;font-size:7px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:.2s}
.map-layer-toggle i{font-style:normal;color:#49666b;font-size:8px}
.map-layer-toggle.active{border-color:#3a8c83;background:#12302f;color:#c0e4df;box-shadow:inset 0 0 12px #63f4de12}
.map-layer-toggle.active i{color:var(--cyan);text-shadow:0 0 8px #63f4de}
.map-stage #buildingNodes,.map-stage .workshop-layer{transition:opacity .25s,filter .25s}
.map-stage.hide-buildings #buildingNodes,.map-stage.hide-gathering .workshop-layer{opacity:0;filter:blur(3px);pointer-events:none}
.map-panel>.phase-note{position:relative;left:auto;right:auto;bottom:auto;width:100%;max-width:none;min-height:64px;align-items:center;gap:14px;padding:11px 24px;border-left:0;border-top:1px solid #17373c;border-bottom:1px solid #17373c;background:linear-gradient(90deg,#082126,#07171b)}
.phase-note>span{flex:0 0 58px;line-height:1.1}
.phase-note>div{min-width:0;padding-top:1px}
.phase-note strong{line-height:1.3;white-space:normal}
.phase-note small{display:block;margin-top:4px;line-height:1.35}
html[dir=rtl] .map-panel>.phase-note{left:auto;right:auto;border-right:0;border-left:0;direction:rtl}
.map-time-head>div{display:flex;align-items:center;gap:12px}
.map-time-head strong{font:400 18px Georgia,serif;color:var(--cyan)}
.map-play{width:31px;height:28px;border:1px solid #275057;background:#10272c;color:var(--cyan);cursor:pointer}
.map-play.active{background:var(--cyan);color:#061411}
.map-time-track{height:58px;position:relative;margin:8px 13px 0;direction:ltr}
.map-time-track:before{content:"";position:absolute;left:0;right:0;top:13px;height:3px;background:#19363b;border-radius:3px}
.map-time-progress{position:absolute;left:0;top:13px;height:3px;width:0;background:var(--cyan);box-shadow:0 0 12px #63f4de88;pointer-events:none}
.map-time-track>input{position:absolute;z-index:4;top:2px;left:-2px;width:calc(100% + 4px);height:25px;margin:0;opacity:0;cursor:ew-resize}
.time-event{position:absolute;top:6px;transform:translateX(-50%);border:0;background:transparent;color:#6f898e;padding:0;cursor:pointer;text-align:center;z-index:3}
.time-event.start{left:0}.time-event.center{left:25%}.time-event.wave1{left:50%}.time-event.wave2{left:75%}.time-event.end{left:100%}
.time-event i{display:block;width:15px;height:15px;border:3px solid #19363b;background:#071519;border-radius:50%;margin:auto;transition:.2s}
.time-event span{display:block;margin-top:4px;font:700 8px/1 sans-serif;color:#80999d}
.time-event small{display:block;margin-top:2px;font-size:7px;white-space:nowrap}
.time-event.reached i{border-color:var(--cyan);background:var(--cyan);box-shadow:0 0 12px #63f4de80}
.time-event.reached small{color:#b9d7d2}
.time-event.current i{transform:scale(1.25);box-shadow:0 0 0 5px #63f4de16,0 0 14px #63f4de}
.map-time-status{display:flex;justify-content:space-between;align-items:center;margin-top:1px;font-size:9px}
.map-time-status>span{color:var(--amber);font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.map-time-status>small{color:#5e777c}
.building-node.timeline-active{animation:objectiveReveal .5s ease both}
.workshop-group-label{position:absolute;z-index:3;transform:translate(-50%,-100%);padding:2px 5px;border:1px solid #31545a;background:#061317e8;color:#94b7b9;font-size:6px;font-weight:800;white-space:nowrap;pointer-events:none}
.workshop-node{position:absolute;z-index:4;width:25px;height:25px;transform:translate(-50%,-50%);border:1px solid #d49142;border-radius:50%;background:#102629;box-shadow:0 0 10px #f2a84e48;cursor:pointer;animation:workshopReveal .35s ease both}
.workshop-node .workshop-sprite{inset:2px;filter:drop-shadow(0 2px 3px #000)}
.workshop-node b{position:absolute;right:-4px;bottom:-4px;min-width:12px;height:12px;padding:0 2px;border-radius:7px;background:#f3a64f;color:#142123;font:800 7px/12px sans-serif}
.workshop-node.wave-2{border-color:#63f4de;box-shadow:0 0 10px #63f4de55}
.workshop-node.wave-2 b{background:#63f4de}
.workshop-node:hover{z-index:9;transform:translate(-50%,-50%) scale(1.28)}
.workshop-node.claimed{opacity:.38;filter:grayscale(1)}
@keyframes workshopReveal{from{opacity:0;transform:translate(-50%,-50%) scale(.3)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes objectiveReveal{from{opacity:0;transform:translate(-50%,-50%) scale(.7)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
html[dir=rtl] .map-time-head,html[dir=rtl] .map-time-status{direction:rtl}
html[dir=rtl] .map-time-progress{left:auto;right:0}
@media(max-width:620px){.map-header-tools{align-items:flex-start}.map-layer-toggle{padding-inline:7px}.map-panel>.phase-note{left:auto!important;width:100%;max-width:none;padding-inline:13px}.map-timeline{height:165px;padding-inline:13px}.time-event small{font-size:6px;max-width:55px;white-space:normal}.map-time-status{display:block}.map-time-status>small{display:block;margin-top:5px}}