.mapapp{height:calc(100dvh - var(--header-h) - var(--bar-h));background:#020509;grid-template-columns:22.5rem minmax(0,1fr);display:grid}.mapapp .viewport{touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none;background:radial-gradient(60% 60%,#143c5040,#0000 70%),#020509;outline:none;grid-area:1/2;position:relative;overflow:hidden}.mapapp .viewport:focus-visible{box-shadow:inset 0 0 0 2px var(--cyan)}.mapapp .viewport.dragging{cursor:grabbing}.mapapp .stage{transform-origin:0 0;will-change:transform;--k:1;width:1000px;height:1000px;position:absolute;top:0;left:0}.mapapp .stage.anim{transition:transform .5s var(--ease)}.mapapp .stage img{pointer-events:none;width:100%;max-width:none;height:100%;position:absolute;inset:0}.mapapp .chart{transition:filter .3s}.mapapp .stage.focus .chart{filter:grayscale(.7)brightness(.4)}.mapapp .lit{filter:saturate(1.2) brightness(1.15) drop-shadow(0 0 3px var(--c,#fff));pointer-events:none;display:none;position:absolute;inset:0;-webkit-mask-size:100% 100%;mask-size:100% 100%}.mapapp .stage.focus .lit{display:block}.mapapp .pin,.mapapp .blabel{transform:translate(-50%, -50%) scale(calc(1 / var(--k)));transform-origin:50%;position:absolute}.mapapp .pin{z-index:2;border-radius:50%;place-items:center;width:44px;height:44px;display:grid}.mapapp .pin span{transition:transform .15s var(--ease), box-shadow .15s;display:block}.mapapp .pin.port span{background:var(--gold);width:18px;height:18px;box-shadow:0 0 0 1.5px var(--gold), 0 0 14px rgb(var(--gold-rgb) / .8);border:2.5px solid #04090f;border-radius:5px}.mapapp .pin.port.home span{width:22px;height:22px}.mapapp .pin.landmark span{background:#fff;border:2.5px solid #04090f;width:15px;height:15px;transform:rotate(45deg);box-shadow:0 0 0 1.5px #fff,0 0 12px #ffffffb3}.mapapp .pin.cave{z-index:1;width:30px;height:30px}.mapapp .pin.cave span{background:var(--cyan);width:10px;height:10px;box-shadow:0 0 8px rgb(var(--cyan-rgb) / .8);border:2px solid #04090f;border-radius:50%}.mapapp .pin:hover span,.mapapp .pin:focus-visible span{transform:scale(1.35)}.mapapp .pin.landmark:hover span,.mapapp .pin.landmark:focus-visible span{transform:rotate(45deg)scale(1.35)}.mapapp .pin.on{z-index:3}.mapapp .pin.on:after{content:"";border:2px solid #fff;border-radius:50%;animation:1.6s ease-out infinite map-ping;position:absolute;inset:2px}@keyframes map-ping{0%{opacity:1;transform:scale(.5)}to{opacity:0;transform:scale(1.5)}}.mapapp .blabel{font-family:var(--font-text);white-space:nowrap;color:#ffffffeb;text-shadow:0 0 4px #04090f,0 0 4px #04090f,0 1px 8px #04090f;z-index:1;border-radius:8px;padding:.2rem .5rem;font-size:.875rem;font-weight:650}.mapapp .blabel:hover,.mapapp .blabel.on{background:#04090fcc;box-shadow:0 0 0 1px #fff6}.mapapp .stage.far .blabel,.mapapp .stage.hide-labels .blabel,.mapapp .stage.hide-port .pin.port,.mapapp .stage.hide-landmark .pin.landmark,.mapapp .stage.hide-cave .pin.cave{display:none}.mapapp .hud{pointer-events:none;flex-direction:column;align-items:flex-end;gap:.6rem;display:flex;position:absolute;inset:auto 1rem 1rem auto}.mapapp .zoom{border:1px solid var(--line-2);backdrop-filter:blur(10px);pointer-events:auto;background:#060e16e6;border-radius:12px;display:grid;overflow:hidden}.mapapp .zoom button{width:46px;height:46px;color:var(--text);place-items:center;display:grid}.mapapp .zoom button+button{border-top:1px solid var(--line)}.mapapp .zoom button:hover{background:rgb(var(--cyan-rgb) / .12);color:var(--cyan)}.mapapp .coords{border:1px solid var(--line);color:var(--text-2);background:#060e16d9;border-radius:8px;padding:.3rem .7rem;font-size:.875rem}.mapapp .panel{border-right:1px solid var(--line);background:var(--bg-1);flex-direction:column;grid-area:1/1;min-height:0;display:flex}.mapapp .handle{display:none}.mapapp .panel-body{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--surface-3) transparent;flex-direction:column;gap:1.6rem;padding:1.4rem 1.25rem 2rem;display:flex;overflow-y:auto}.mapapp .panel-body>*{flex:none}.mapapp .panel h1{margin-top:.3rem;font-size:1.45rem}.mapapp .hint{color:var(--text-3);margin-top:.5rem;font-size:.9375rem}.mapapp .panel h2{margin-bottom:.7rem}.mapapp .layers{gap:.1rem;display:grid}.mapapp .layers label{cursor:pointer;min-height:44px;color:var(--text);border-radius:10px;align-items:center;gap:.7rem;margin-inline:-.6rem;padding:0 .6rem;display:flex}.mapapp .layers label:hover{background:#ffffff0a}.mapapp .layers input{-webkit-appearance:none;appearance:none;border:1.5px solid var(--line-2);background:var(--surface);cursor:pointer;border-radius:6px;flex:none;place-items:center;width:22px;height:22px;display:grid}.mapapp .layers input:checked{background:var(--cyan);border-color:var(--cyan)}.mapapp .layers input:checked:after{content:"";border:0 solid #03222a;border-width:0 0 2.5px 2.5px;width:10px;height:6px;transform:rotate(-45deg)translate(1px,-1px)}.mapapp .layers b{font-family:var(--font-mono);color:var(--text-3);margin-left:auto;font-size:.875rem;font-weight:500}.mapapp .k{flex:none;width:14px;height:14px;display:inline-block}.mapapp .k.port{background:var(--gold);border-radius:4px}.mapapp .k.landmark{background:#fff;width:11px;height:11px;margin:0 1.5px;transform:rotate(45deg)}.mapapp .k.cave{background:var(--cyan);border-radius:50%;width:10px;height:10px;margin:0 2px}.mapapp .k.text{width:auto;height:auto;color:var(--text-2);font-size:.875rem;font-style:normal;font-weight:700}.mapapp .tname{font-family:var(--font-mono);color:var(--text-3);padding:.7rem 0 .2rem;font-size:.875rem}.mapapp .bbtn{text-align:left;width:calc(100% + 1.2rem);min-height:40px;color:var(--text-2);border-radius:10px;grid-template-columns:auto 1fr auto;align-items:center;gap:.65rem;margin-inline:-.6rem;padding:0 .6rem;display:grid}.mapapp .bbtn i{background:var(--c);border-radius:50%;width:10px;height:10px}.mapapp .bbtn small{color:var(--text-3);font-size:.875rem}.mapapp .bbtn:hover{color:var(--text);background:#ffffff0a}.mapapp .bbtn.on{background:color-mix(in srgb, var(--c) 16%, transparent);box-shadow:inset 2px 0 0 var(--c);color:var(--text)}.mapapp .detail{border-radius:var(--r);border:1px solid var(--line-2);background:var(--surface);animation:search-in .2s var(--ease);overflow:hidden}.mapapp .detail img{aspect-ratio:16/9;object-fit:cover;width:100%}.mapapp .d-body{padding:.9rem 1rem 1rem}.mapapp .d-k{font-family:var(--font-mono);color:var(--cyan);align-items:center;gap:.45rem;font-size:.875rem;display:flex}.mapapp .d-k i{background:var(--c);border-radius:50%;width:9px;height:9px}.mapapp .d-t{font-family:var(--font-display);margin-top:.2rem;font-size:1.2rem;font-weight:700;line-height:1.25}.mapapp .d-e{color:var(--text-3);font-size:.9375rem}.mapapp .detail p{color:var(--text-2);margin-top:.5rem;font-size:.9375rem;line-height:1.5}.mapapp .detail dl{flex-wrap:wrap;gap:.5rem 1.5rem;margin:.8rem 0;display:flex}.mapapp .detail dt{font-family:var(--font-mono);color:var(--text-3);font-size:.875rem}.mapapp .detail dd{font-weight:600}.mapapp .detail .btn{width:100%;min-height:44px}@media (width<=899px){.mapapp{grid-template-columns:1fr;position:relative}.mapapp .viewport{grid-column:1}.mapapp .panel{z-index:5;border-right:0;border-top:1px solid var(--line-2);border-radius:var(--r-lg) var(--r-lg) 0 0;max-height:62%;transition:transform .3s var(--ease);position:absolute;inset:auto 0 0;transform:translateY(calc(100% - 3.4rem));box-shadow:0 -20px 50px -20px #000}.mapapp .panel.open{transform:none}.mapapp .handle{width:100%;height:3.4rem;color:var(--text);flex:none;justify-items:center;gap:.35rem;padding-top:.45rem;display:grid}.mapapp .grip{background:var(--line-2);border-radius:2px;width:40px;height:4px}.mapapp .handle-t{align-items:center;gap:.5rem;font-weight:700;display:inline-flex}.mapapp .panel-body{padding-top:.5rem}.mapapp .panel header{display:none}.mapapp .hud{inset:1rem 1rem auto auto}.mapapp .coords{display:none}}
