*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;height:100%;overflow:hidden}
body{background:#0b0c0f;color:#ece8df;font:14px/1.5 system-ui,sans-serif;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
#map{position:fixed;inset:0}
#map:focus{outline:0}
#map:focus-visible{outline:2px solid #d6ff5c;outline-offset:-2px}
#tabs{position:fixed;z-index:25;display:flex;gap:2px;padding:3px;border-radius:9px;background:rgba(14,15,18,.86);border:1px solid #30343c;backdrop-filter:blur(8px)}
#tabs a{padding:4px 10px;border-radius:6px;text-decoration:none;color:inherit;font-size:12px}
#tabs a[aria-current]{font-weight:600}
#notice{position:fixed;z-index:40;left:50%;bottom:16px;transform:translateX(-50%);max-width:min(560px,90vw);padding:8px 14px;border-radius:8px;background:#ffb000;color:#111;font-size:13px}
#map-error{position:fixed;z-index:50;inset:0;display:grid;place-content:center;gap:8px;text-align:center;background:#0b0c0f;color:#ece8df;padding:24px}
#map-error a{color:#d6ff5c}
#map-error button{border:1px solid currentColor;border-radius:7px;padding:6px 14px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.img-ph{display:grid;place-items:center;padding:8px;text-align:center;background:#1a1d22;color:#8b909a;font-size:12px;overflow:hidden}
.pe-dialog,.pe-lightbox{border:0;padding:0;color:#ece8df;background:#0e0f12}
.pe-dialog{max-width:420px;border-radius:12px;border:1px solid #30343c}
.pe-dialog form{padding:20px 22px}
.pe-dialog h2{margin:0 0 8px;font-size:18px}
.pe-dialog .acts{display:flex;gap:8px;margin-top:16px}
.pe-dialog .btn{height:36px;padding:0 14px;border-radius:8px;border:1px solid #30343c}
.pe-dialog .btn.pri{background:#d6ff5c;color:#08090b;border-color:#d6ff5c}
::backdrop{background:rgba(0,0,0,.6)}
.pe-lightbox{width:100vw;height:100vh;max-width:none;max-height:none;background:rgba(5,6,8,.96)}
.pe-lightbox figure{margin:0;height:100%;display:grid;grid-template-rows:1fr auto;place-items:center;padding:48px 72px 16px}
.pe-lightbox img,.pe-lightbox .img-ph{width:100%;height:calc(100vh - 120px);object-fit:contain}
.pe-lightbox figcaption{font-size:13px;color:#cfcbc2;padding-top:10px}
.pe-lightbox .cr{display:block;font-size:11px;color:#8b909a}
.pe-lightbox .cr a{color:#8b909a}
.pe-lightbox button{position:fixed;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.08);font-size:18px}
.pe-lightbox .lb-prev{left:16px;top:50%}.pe-lightbox .lb-next{right:16px;top:50%}.pe-lightbox .lb-close{right:16px;top:16px}
:focus-visible{outline:2px solid #d6ff5c;outline-offset:2px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.ic{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
/* Shared marker skins (markers.js); tabs restyle them under their scope. No position here: MapLibre's
   .maplibregl-marker is absolute, which also anchors the absolute children. MapLibre writes the element's transform,
   so scaling goes on children. */
.pe-photo,.pe-token{display:block;border:0;padding:0;cursor:pointer;--c:#ece8df}
.pe-photo .fr{display:block;width:46px;height:46px;border-radius:8px;overflow:hidden;border:3px solid var(--c);background:var(--c);box-shadow:0 6px 16px rgba(0,0,0,.35)}
.pe-photo img,.pe-photo .img-ph{width:100%;height:100%;object-fit:cover;display:block;font-size:8px;padding:2px}
/* a failed photo's name: centred and wrapped inside the frame (the marker keeps its full aria-label) */
.pe-photo .img-ph{display:grid;overflow-wrap:anywhere;line-height:1}
.pe-photo .ico{position:absolute;left:-6px;bottom:-6px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--c);color:#111;font-size:12px}
.pe-photo .ct{display:none}
.pe-photo.stack .ct{display:grid;place-items:center;position:absolute;right:-8px;top:-8px;min-width:22px;height:22px;padding:0 5px;border-radius:11px;background:#111;color:#fff;font:600 11px/1 system-ui}
.pe-photo.stack .fr{box-shadow:4px 4px 0 -1px #fff,4px 4px 0 1px var(--c),8px 8px 0 -1px #fff,8px 8px 0 1px var(--c)}
.pe-token{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--c);color:#111;border:2px solid #fff;font-size:14px;box-shadow:0 3px 8px rgba(0,0,0,.35)}
.pe-token .ico{display:grid}
.pe-num{display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:var(--c);color:#08090b;border:1.5px solid #fff;font:700 10px/1 system-ui;pointer-events:none}
.pe-photo.gone,.pe-token.gone,.pe-photo.under{visibility:hidden;pointer-events:none}
.pe-photo.cur .fr,.pe-token.cur{outline:3px solid #fff;outline-offset:2px}
.pe-photo.on .fr,.pe-token.on .ico{transform:scale(1.15)}