/* the death map speaks the site's language: nag-tokens (one gold ramp, hairlines, 5/8 px radii, shadow-depth, no glows),
   Poppins, the site header + footer. Only the heat keeps its own inferno ramp, and class identity keeps WoW class colours. */
.atlas-page{--gold:var(--nag-gold-fill);--muted:var(--nag-text-mute);--line:var(--nag-hairline);--panel:var(--nag-panel)}
.atlas-hero{padding:92px 0 16px}
.atlas-hero .nag-display{font-size:clamp(1.7rem,3.2vw,2.5rem);margin:0 0 .25em}
.atlas-hero__row{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:end;justify-content:space-between}
.atlas-hero__copy{flex:1 1 460px}
.sub{color:var(--nag-text-dim);font-size:.95rem;margin:0;max-width:62ch}
.status{color:var(--muted);font-size:.8rem;margin-top:6px;letter-spacing:.02em}.status b{color:var(--nag-text);font-weight:600}
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.filters label{color:var(--nag-gold-eyebrow);font-size:.72rem;font-weight:700;letter-spacing:.105em;text-transform:uppercase}
.atlas-page select,.atlas-page .board-pill{min-height:38px;padding:6px 14px;border:1px solid rgba(255,255,255,.12);border-radius:3px;background:rgba(0,0,0,.24);color:var(--nag-text);font:500 .88rem var(--font);cursor:pointer;transition:border-color var(--dur-fast) var(--ease-out)}
.atlas-page select:hover,.atlas-page .board-pill:hover{border-color:var(--nag-gold-fill)}
.atlas-page select:focus-visible,.atlas-page .board-pill:focus-visible,.ico:focus-visible{outline:2px solid var(--nag-gold-hover);outline-offset:3px}
.pill[hidden]{display:none}.pill{min-height:38px;display:inline-flex;align-items:center;padding:6px 12px;border:1px solid var(--nag-gold-edge-strong);border-radius:3px;background:var(--nag-gold-edge);color:var(--nag-text);font-weight:600;font-size:.84rem}
.atlas{display:grid;grid-template-columns:auto minmax(0,1fr) var(--pw,340px);gap:14px;padding:0 24px 28px;height:calc(100vh - 96px);min-height:620px;max-width:1800px;margin:0 auto}
.mapcol{display:flex;flex-direction:column;min-height:0}
.crumbs{display:flex;gap:8px;align-items:center;margin:0 0 8px;font-weight:700;font-size:.8rem;text-transform:uppercase;letter-spacing:.105em;color:var(--nag-text)}
.crumbs a{color:var(--nag-gold-eyebrow);cursor:pointer;text-decoration:none}.crumbs a:hover{color:var(--nag-gold-hover)}.crumbs .sep{color:var(--muted)}
#view{position:relative;flex:1;min-height:0;overflow:hidden;border-radius:var(--nag-radius-lg);background:var(--nag-ink);border:1px solid var(--nag-gold-edge);box-shadow:var(--nag-frame-shadow);touch-action:none;user-select:none;-webkit-user-select:none}
#stage{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
#stage.anim{transition:transform var(--dur-layout) var(--ease-out),opacity var(--dur-drawer) var(--ease-out)}
#stage>img,#stage>canvas,#stage>svg{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
#heat{transition:opacity var(--dur-surface) var(--ease-out)}
/* the blobs' 1-px border (owner 2026-10-30), a vector layer: non-scaling-stroke undoes the viewBox scale and
   --ik (1/zoom, set by apply()) undoes the stage's CSS zoom, so it is 1 CSS px on screen at every zoom.
   Dark and half-transparent: at the rim the heat is nearly clear, so the line sits on the map art, where a dark
   line reads on every map and the heat's own deep purple would vanish on the dark ones. */
#rings path{fill:none;stroke:rgba(20,10,0,.55);stroke-width:calc(1px * var(--ik,1));vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.rail{display:flex;gap:10px;padding-top:28px}.rg{display:flex;flex-direction:column;gap:7px;align-items:center}
.rg>span{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.105em;color:var(--nag-gold-eyebrow)}
.ico{position:relative;width:40px;height:40px;padding:0;border-radius:50%;border:1px solid var(--nag-edge);background:#000 center/cover;cursor:pointer;transition:border-color var(--dur-fast) var(--ease-out),opacity var(--dur-fast) var(--ease-out),filter var(--dur-fast) var(--ease-out)}
.ico:hover{border-color:var(--nag-edge-hover)}
.ico.on{border:2px solid var(--nag-gold-fill);box-shadow:0 0 0 2px var(--nag-ink),0 0 0 3px var(--c,var(--nag-gold-fill))}
.rail.sel .rg.picked .ico:not(.on){opacity:.4;filter:grayscale(.8)}
.ico i{position:absolute;right:-2px;bottom:-2px;width:12px;height:12px;border-radius:50%;border:2px solid var(--nag-ink)}
.legend b{display:inline-block;width:10px;height:10px;border-radius:50%;margin-left:8px;border:1px solid #fff}
#marks{position:absolute;inset:0}
.mk{position:absolute;transform:translate(-50%,-50%) scale(var(--ik,1))}
.peak{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:13px;color:#0b0c0e;background:var(--c);border:2px solid #fff;box-shadow:0 0 0 3px rgba(7,9,12,.55),var(--nag-over-art-shadow);cursor:help}
.peak::after{content:"";position:absolute;inset:-9px;border-radius:50%;border:2px solid var(--c);animation:ping 1.8s ease-out infinite}
.peak:nth-child(n){z-index:2}@keyframes ping{from{transform:scale(.6);opacity:.9}to{transform:scale(1.5);opacity:0}}
@media(prefers-reduced-motion:reduce){.peak::after{animation:none;opacity:.5}#stage.anim{transition:none}}
.pin:hover,.pin.hot{z-index:3;outline:2px solid var(--nag-gold-hover);outline-offset:2px}
.pin{width:24px;height:24px;border-radius:50%;background:var(--nag-ink);border:1px solid var(--nag-gold-edge-strong);color:var(--nag-text);display:grid;place-items:center;font-size:14px;line-height:1;cursor:help;box-shadow:var(--nag-over-art-shadow)}
.pin.sm{width:18px;height:18px;font-size:11px}
.zeph{padding:6px 12px 6px 6px;border-radius:var(--nag-radius);background:rgba(8,10,12,.9);border:1px solid var(--nag-gold-edge-strong);display:flex;gap:10px;align-items:center;cursor:pointer;font-size:.78rem;white-space:nowrap;color:var(--nag-text-dim)}
.zeph:hover{border-color:var(--nag-gold-fill)}
.zeph img{width:64px;height:43px;border-radius:3px;object-fit:cover}.zeph b{display:block;font-size:.86rem;color:var(--nag-text);font-weight:600}
.hint,.legend{position:absolute;bottom:8px;font-size:.74rem;color:var(--nag-text-dim);background:rgba(8,10,12,.78);border:1px solid var(--nag-hairline);padding:4px 9px;border-radius:3px;pointer-events:none}
.hint{left:10px}.legend{right:10px;display:flex;align-items:center;gap:6px}
.legend i{display:block;width:90px;height:8px;border-radius:2px;background:linear-gradient(90deg,#3b0f70,#8c2981,#de4968,#fe9f6d,#fcfdbf)}
aside{background:var(--panel);border:1px solid var(--nag-gold-edge);border-radius:var(--nag-radius-lg);padding:16px 18px;overflow:auto;overflow-x:hidden;min-height:0;box-shadow:var(--nag-frame-shadow)}
body.slim{--pw:230px}
.tog{float:right;margin:-4px -6px 0 8px;min-height:30px!important;padding:3px 10px!important;font-size:.76rem!important}
.tile{padding:10px 0;border-top:1px solid var(--line);cursor:pointer}.tile:first-of-type{border-top:0}
.tile .k{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.105em;color:var(--nag-gold-eyebrow)}
.tile .v{font-weight:700;font-size:1rem;line-height:1.3;margin-top:3px;color:var(--nag-text)}.tile .s{color:var(--nag-gold-text);font-weight:500;font-size:.82rem}
.tile:hover .v{color:var(--nag-gold-hover)}
aside h2{margin:0;font-size:1.15rem;font-weight:700;letter-spacing:-.01em;line-height:1.2;color:var(--nag-text)}
aside .where{color:var(--muted);font-size:.78rem;margin-bottom:12px}
.big{font-size:1.9rem;font-weight:700;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--nag-text)}.big small{font-size:.8rem;font-weight:500;color:var(--muted);letter-spacing:0}
.rr{display:inline-block;margin-top:8px;font-weight:600;font-size:.76rem;padding:2px 8px;border-radius:3px;border:1px solid var(--nag-gold-edge-strong);background:var(--nag-gold-edge);color:var(--nag-text)}
aside h3{margin:18px 0 6px;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.105em;color:var(--nag-gold-eyebrow)}
aside h3 span{color:var(--muted)!important}
.hb{display:grid;grid-template-columns:104px 1fr 54px;gap:8px;align-items:center;font-size:.82rem;padding:2px 4px;border-radius:3px;cursor:pointer;color:var(--nag-text-dim)}
.hb:hover{background:var(--nag-panel-raised)}.hb .t{height:8px;background:rgba(255,255,255,.05);border-radius:0 2px 2px 0;position:relative}
.hb .f{position:absolute;left:0;top:0;bottom:0;background:rgba(221,163,67,.42);border-radius:0 2px 2px 0}.hb.on .f{background:var(--nag-gold-fill)}.hb.on{font-weight:600;color:var(--nag-text)}
.hb .n{text-align:right;font-variant-numeric:tabular-nums}.hb .one{position:absolute;top:-3px;bottom:-3px;width:1px;background:var(--nag-text-mute)}
.row{display:flex;justify-content:space-between;gap:8px;padding:5px 6px;border-radius:3px;cursor:pointer;font-size:.84rem;color:var(--nag-text-dim);border-bottom:1px solid var(--line)}.row:hover{background:var(--nag-panel-raised);color:var(--nag-text)}.row span:last-child{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.note{color:var(--muted);font-size:.78rem;margin-top:6px}
#tip{position:fixed;pointer-events:none;background:rgba(8,10,12,.97);border:1px solid var(--nag-gold-edge-strong);border-radius:var(--nag-radius);padding:9px 12px;font-size:.84rem;line-height:1.45;color:var(--nag-text-dim);display:none;z-index:99;max-width:290px;box-shadow:var(--nag-plate-shadow)}
#tip b{color:var(--nag-text);font-weight:600}#tip .m{color:var(--muted)}#tip .pct{font-size:1.7rem;font-weight:700;line-height:1.1;color:var(--nag-gold-fill);margin-top:6px}
.atlas-foot{max-width:1800px;margin:0 auto;padding:0 24px 34px;color:var(--muted);font-size:.76rem}
@media(max-width:900px){.atlas-hero{padding-top:96px}.atlas{grid-template-columns:1fr;height:auto;min-height:0;padding:0 16px 20px}.rail{flex-direction:column;padding-top:0}.rg{flex-direction:row;flex-wrap:wrap;justify-content:flex-start}.rg>span{width:44px}.ico{width:34px;height:34px}#view{height:auto;aspect-ratio:1022/668;flex:none}.pin{width:16px;height:16px;font-size:10px}.pin.sm{width:12px;height:12px;font-size:8px}.zeph img{display:none}.hint,.legend{display:none}aside{overflow:visible}.atlas-foot{padding:0 16px 24px}}