:root{--bg: #0a0812;--panel: rgba(18, 14, 30, .82);--panel-solid: #120e1e;--border: rgba(139, 92, 246, .28);--border-strong: rgba(139, 92, 246, .55);--text: #ece7f6;--text-dim: #a79cc0;--accent: #8b5cf6;--accent-bright: #a855f7;--green: #9bd275;--shadow: 0 10px 40px rgba(0, 0, 0, .55);--radius: 14px;--topbar-h: 56px;--font: "Trebuchet MS", "Segoe UI", system-ui, -apple-system, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased}body:not(.page){display:flex;flex-direction:column;height:100dvh;overflow:hidden}.topbar{flex:0 0 auto;height:var(--topbar-h);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;padding-top:env(safe-area-inset-top,0);background:linear-gradient(to bottom,rgba(10,8,18,.96),rgba(10,8,18,.82));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);z-index:20;position:relative}.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--text)}.brand__logo{width:30px;height:30px;filter:drop-shadow(0 0 6px rgba(168,85,247,.6))}.brand__name{font-size:20px;font-weight:700;letter-spacing:.5px}.brand__dot{color:var(--accent-bright)}.nav{display:flex;align-items:center;gap:6px;position:relative}.nav__btn{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 13px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--text);font:inherit;font-size:14px;cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s}.nav__btn:hover{background:rgba(139,92,246,.14)}.nav__btn.active{background:rgba(139,92,246,.22);border-color:var(--border-strong)}.nav__icon{font-size:15px;line-height:1}.filter-panel{position:absolute;top:calc(100% + 10px);right:0;min-width:190px;background:var(--panel-solid);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);padding:8px;opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .15s,transform .15s;z-index:30}.filter-panel.open{opacity:1;transform:translateY(0);pointer-events:auto}.filter-panel__title{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--text-dim);padding:4px 8px 8px}.filter-row{display:flex;align-items:center;gap:10px;padding:8px;border-radius:9px;cursor:pointer}.filter-row:hover{background:rgba(139,92,246,.12)}.filter-row input{accent-color:var(--accent-bright);width:16px;height:16px}.filter-row__icon{width:22px;height:22px;object-fit:contain}.filter-row__label{font-size:14px}.map{flex:1 1 auto;position:relative;width:100%;background:var(--bg)}.maplibregl-canvas{outline:none}.maplibregl-ctrl-group{background:var(--panel-solid)!important;border:1px solid var(--border)!important;box-shadow:var(--shadow)!important}.maplibregl-ctrl-group button+button{border-top:1px solid var(--border)!important}.maplibregl-ctrl-group button .maplibregl-ctrl-icon{filter:invert(1) hue-rotate(180deg) brightness(1.1)}.maplibregl-ctrl-attrib{background:rgba(10,8,18,.7)!important;color:var(--text-dim)!important}.maplibregl-ctrl-attrib a{color:var(--text-dim)!important}.card{color:var(--text)}.card__badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.6px;color:var(--cat, var(--accent-bright));background:color-mix(in srgb,var(--cat, var(--accent)) 16%,transparent);border:1px solid color-mix(in srgb,var(--cat, var(--accent)) 45%,transparent);padding:4px 9px;border-radius:999px}.card__badge img{width:16px;height:16px;object-fit:contain}.card__title{margin:12px 0 6px;font-size:20px;line-height:1.2;font-weight:700}.card__loc{font-size:14px;color:var(--text);font-weight:600}.card__place{font-size:13px;color:var(--text-dim);margin-top:2px}.card__desc{margin:12px 0 0;font-size:14.5px;line-height:1.55;color:#d8d0ea}.card-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(5,4,10,.5);opacity:0;pointer-events:none;transition:opacity .2s;z-index:40}.card-backdrop.show{opacity:1;pointer-events:auto}.card-sheet{position:fixed;left:0;right:0;bottom:0;max-height:42vh;min-height:33vh;background:var(--panel-solid);border-top:1px solid var(--border-strong);border-radius:20px 20px 0 0;box-shadow:0 -12px 40px #0009;padding:10px 20px calc(22px + env(safe-area-inset-bottom,0));transform:translateY(110%);transition:transform .28s cubic-bezier(.22,1,.36,1);z-index:50;overflow-y:auto}.card-sheet.open{transform:translateY(0)}.sheet__handle{width:40px;height:4px;border-radius:999px;background:var(--border-strong);margin:2px auto 14px}.sheet__close{position:absolute;top:12px;right:14px;width:32px;height:32px;border-radius:50%;border:1px solid var(--border);background:rgba(139,92,246,.14);color:var(--text);font-size:14px;cursor:pointer}.spooky-popup .maplibregl-popup-content{background:var(--panel-solid);color:var(--text);border:1px solid var(--border-strong);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px}.spooky-popup .maplibregl-popup-close-button{color:var(--text-dim);font-size:18px;padding:2px 8px}.spooky-popup.maplibregl-popup-anchor-bottom .maplibregl-popup-tip{border-top-color:var(--panel-solid)}.spooky-popup.maplibregl-popup-anchor-top .maplibregl-popup-tip{border-bottom-color:var(--panel-solid)}.spooky-popup.maplibregl-popup-anchor-left .maplibregl-popup-tip{border-right-color:var(--panel-solid)}.spooky-popup.maplibregl-popup-anchor-right .maplibregl-popup-tip{border-left-color:var(--panel-solid)}.about{min-height:calc(100dvh - var(--topbar-h));background:radial-gradient(1200px 600px at 50% -10%,rgba(139,92,246,.12),transparent 60%),var(--bg);padding:48px 20px 80px}.about__inner{max-width:680px;margin:0 auto}.about__ghost{width:72px;height:72px;filter:drop-shadow(0 0 16px rgba(168,85,247,.55))}.about h1{font-size:34px;margin:16px 0 10px}.about__lead{font-size:18px;color:var(--text-dim);line-height:1.6}.about h2{font-size:20px;margin:32px 0 8px;color:var(--green)}.about p{line-height:1.7;color:#d8d0ea}.about a{color:var(--accent-bright)}.about__back{margin-top:36px}@media (max-width: 768px){.nav__label{display:none}.nav__btn{padding:0 10px}.nav__icon,.brand__name{font-size:18px}}@media (min-width: 769px){.card-sheet,.card-backdrop{display:none}}
