.wm-page { color:#364b65; }
.wm-shell { --wm-blue:#2385c8; --wm-ink:#284c6b; --wm-border:#deebf6; --wm-muted:#526f86; width:min(1440px,calc(100% - 64px)); margin:0 auto 56px; position:relative; z-index:1; }
.wm-skip { position:fixed; top:-100px; left:16px; z-index:9999; background:#fff; padding:12px 20px; border:2px solid #2385c8; border-radius:8px; }
.wm-skip:focus { top:12px; }
.wm-intro { display:flex; align-items:center; justify-content:space-between; gap:32px; padding:42px 0 26px; }
.wm-breadcrumb { display:flex; gap:10px; font-size:12px; color:#526f86; margin-bottom:25px; }
.wm-breadcrumb a { color:var(--wm-blue); text-decoration:none; }
.wm-eyebrow { display:block; margin:0 0 10px; font-size:10px; font-weight:600; letter-spacing:2px; color:#536f87; }
.wm-intro h1 { margin:0 0 16px; font-size:clamp(29px,3.1vw,44px); line-height:1.4; font-weight:650; color:var(--wm-ink); letter-spacing:-1px; }
.wm-intro h1 span { color:#389dd6; margin-left:12px; }
.wm-lead { margin:0; color:var(--wm-muted); font-size:14px; line-height:1.9; }
.wm-mobile-break { display:none; }
.wm-intro-mark { text-align:center; flex:0 0 180px; color:#536f87; }
.wm-intro-mark svg { width:110px; height:110px; fill:none; stroke:#8bc8e8; stroke-width:1; }
.wm-compass-fill { fill:#45a5d8; stroke:#45a5d8; }
.wm-intro-mark span { display:block; margin-top:8px; font-size:8px; letter-spacing:2px; }
.wm-stats { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--wm-border); border-radius:18px; background:linear-gradient(110deg,#f4faff,#fff); margin:0 0 28px; padding:22px 14px; }
.wm-stats>div { text-align:center; border-right:1px solid var(--wm-border); }
.wm-stats>div:last-child { border:0; }
.wm-stats strong { display:block; color:var(--wm-ink); font-size:29px; font-weight:600; line-height:1.3; }
.wm-stats strong.wm-renewal { font-size:26px; }
.wm-stats span { display:block; margin-top:7px; font-size:11px; color:var(--wm-muted); }
.wm-app { border:1px solid var(--wm-border); background:#fff; border-radius:22px; padding:24px; box-shadow:0 18px 50px #529bd00b; }
.wm-toolbar { display:flex; align-items:stretch; gap:16px; }
.wm-search { display:flex; align-items:center; gap:12px; flex:1; min-width:0; background:#f6faff; border:1px solid var(--wm-border); border-radius:12px; padding:0 16px; }
.wm-search svg { width:20px; height:20px; fill:none; stroke:#5b9cc7; stroke-width:1.8; flex:none; }
.wm-search input { width:100%; height:54px; min-width:0; border:0; background:transparent; color:var(--wm-ink); font:inherit; font-size:13px; outline:none; }
.wm-search:focus-within { outline:2px solid #53afe0; outline-offset:2px; }
.wm-search input::placeholder { color:#526f86; }
.wm-level { display:flex; gap:10px; align-items:center; color:var(--wm-muted); font-size:11px; }
.wm-level select { color:var(--wm-ink); font:inherit; font-size:12px; min-height:48px; border:1px solid var(--wm-border); border-radius:10px; padding:10px 30px 10px 12px; background:#fff; }
.wm-filterbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:16px 0 20px; }
.wm-type-tabs { display:flex; gap:6px; flex-wrap:wrap; }
.wm-type-tabs button,.wm-reset-filters,.wm-regions button { font:inherit; cursor:pointer; border:0; background:transparent; }
.wm-type-tabs button { font-size:11px; min-height:38px; padding:9px 15px; border-radius:8px; color:#526f86; }
.wm-type-tabs button[aria-pressed=true] { background:#eaf5ff; color:#1974b3; font-weight:600; }
.wm-reset-filters { flex:none; font-size:11px; color:#526f86; text-decoration:underline; text-underline-offset:3px; padding:10px 0; }
.wm-regions { display:flex; gap:5px; overflow-x:auto; padding-bottom:12px; scrollbar-width:thin; border-bottom:1px solid var(--wm-border); }
.wm-regions button { white-space:nowrap; font-size:11px; padding:11px 14px; min-height:42px; border:1px solid transparent; border-radius:9px; color:#526f86; }
.wm-regions button[aria-pressed=true] { color:#fff; background:#207ab2; border-color:#207ab2; box-shadow:0 3px 9px #207ab225; }
.wm-feedback { min-height:20px; margin:13px 0; font-size:11px; color:var(--wm-muted); }
.wm-feedback.is-error { color:#a93c50; }
.wm-layout { display:grid; grid-template-columns:minmax(0,1fr) 330px; grid-template-areas:'map detail' 'results detail'; align-items:start; gap:22px; }
.wm-map-panel { grid-area:map; border:1px solid var(--wm-border); border-radius:14px; overflow:hidden; min-width:0; }
.wm-panel-heading { display:flex; gap:12px; justify-content:space-between; align-items:center; padding:18px 20px; }
.wm-panel-heading .wm-eyebrow { font-size:8px; letter-spacing:1.5px; margin-bottom:5px; }
.wm-panel-heading h2 { font-size:19px; color:var(--wm-ink); margin:0; font-weight:600; }
.wm-zoom { display:flex; align-items:center; gap:3px; border:1px solid var(--wm-border); border-radius:9px; padding:3px; }
.wm-zoom button { min-width:34px; min-height:34px; border:0; background:#f3f8fc; color:#4b7392; border-radius:6px; font:inherit; font-size:15px; }
.wm-zoom button:last-child { font-size:10px; padding:0 8px; }
.wm-zoom output { font-size:10px; color:#526f86; width:38px; text-align:center; }
.wm-zoom button:disabled { opacity:.4; cursor:not-allowed; }
.wm-map-scroll { overflow:auto; height:clamp(340px,42vw,610px); position:relative; background:#eaf4f6; overscroll-behavior:contain; scrollbar-width:thin; touch-action:pan-x pan-y; }
.wm-map-canvas { position:relative; min-width:0; margin:0 auto; aspect-ratio:1; isolation:isolate; }
.wm-map-canvas img { display:block; width:100%; height:100%; user-select:none; }
.wm-map-canvas img[hidden] { display:none; }
.wm-map-canvas svg { position:absolute; width:100%; height:100%; inset:0; }
.wm-marker { cursor:pointer; outline:none; }
.wm-marker .wm-hit { fill:transparent; stroke:transparent; }
.wm-marker .wm-pin { fill:#65a77e; stroke:white; stroke-width:3px; }
.wm-marker[data-type=town] .wm-pin { fill:#368fca; }
.wm-marker[data-type=dungeon] .wm-pin { fill:#cb8e4c; }
.wm-marker .wm-pin-ring { fill:none; stroke:#fff; stroke-width:2px; opacity:.6; }
.wm-marker:hover .wm-hit,.wm-marker:focus .wm-hit { fill:#4aaaf037; stroke:#188bc2; stroke-width:2px; }
.wm-marker.is-selected .wm-hit { fill:#3f9eea40; stroke:#107bb5; stroke-width:2px; }
.wm-marker.is-selected .wm-pin { fill:#176ab1; stroke-width:4px; }
.wm-marker text { fill:#23425b; font:600 12px 'Prompt',sans-serif; paint-order:stroke; stroke:#fff; stroke-width:3px; stroke-linejoin:round; pointer-events:none; }
.wm-marker .wm-marker-count { font-size:10px; }
.wm-marker.is-filtered-out { opacity:.16; }
.wm-map-other { padding:100px 20px; text-align:center; color:#526f86; line-height:2; font-size:13px; }
.wm-map-footer { display:flex; justify-content:space-between; gap:12px; padding:13px 16px; font-size:9px; color:#526f86; }
.wm-legend { display:flex; gap:14px; flex-wrap:wrap; }
.wm-legend span { display:flex; align-items:center; gap:5px; }
.wm-legend span::before { content:''; width:7px; height:7px; border-radius:50%; background:#368fca; }
.wm-legend .wm-dot-field::before { background:#65a77e; }
.wm-legend .wm-dot-dungeon::before { background:#cb8e4c; }
.wm-detail { grid-area:detail; border:1px solid var(--wm-border); border-radius:14px; background:#fff; min-width:0; overflow:hidden; }
.wm-detail-placeholder { padding:25px; color:#526f86; line-height:1.8; }
.wm-detail-placeholder h2 { color:var(--wm-ink); font-size:20px; }
.wm-detail-placeholder p { font-size:12px; }
.wm-detail-header { padding:22px 20px 16px; background:linear-gradient(130deg,#f0f8ff,#fff); border-bottom:1px solid var(--wm-border); }
.wm-detail-header h2 { font-size:22px; color:var(--wm-ink); margin:8px 0 6px; overflow-wrap:anywhere; line-height:1.5; }
.wm-map-code { color:#526f86; font-family:ui-monospace,monospace; font-size:11px; background:#edf5fa; border-radius:5px; padding:3px 7px; }
.wm-tag { display:inline-block; padding:4px 8px; color:#1b6396; background:#e3f1fc; font-size:9px; border-radius:5px; }
.wm-tag-mvp { color:#a74e16; background:#fff0dc; margin-left:5px; }
.wm-minimap { padding:18px; background:#f6fafc; display:flex; align-items:center; justify-content:center; min-height:180px; }
.wm-minimap img { max-height:245px; max-width:100%; width:auto; object-fit:contain; border-radius:7px; }
.wm-no-image { font-size:11px; color:#526f86; margin:20px; text-align:center; }
.wm-detail-stats { display:grid; grid-template-columns:repeat(3,1fr); padding:16px 10px; border-top:1px solid var(--wm-border); border-bottom:1px solid var(--wm-border); }
.wm-detail-stats>div { text-align:center; border-right:1px solid var(--wm-border); }
.wm-detail-stats>div:last-child { border:0; }
.wm-detail-stats strong { display:block; font-size:15px; color:var(--wm-ink); }
.wm-detail-stats span { display:block; color:#526f86; font-size:8px; margin-top:5px; }
.wm-detail-section { padding:18px 18px 8px; }
.wm-detail-section h3 { font-size:13px; color:var(--wm-ink); margin:0 0 12px; }
.wm-monsters { list-style:none; padding:0; margin:0; max-height:440px; overflow:auto; scrollbar-width:thin; }
.wm-monster { padding:11px 0; border-bottom:1px solid #edf2f7; }
.wm-monster:first-child { padding-top:0; }
.wm-monster-heading { display:flex; justify-content:space-between; gap:8px; align-items:start; }
.wm-monster-name { color:#365570; font-size:11px; font-weight:600; overflow-wrap:anywhere; }
.wm-monster-level { flex:none; color:#3e6c8d; font-size:10px; }
.wm-monster-meta { display:flex; gap:5px; flex-wrap:wrap; margin:5px 0; color:#526f86; font-size:9px; }
.wm-monster-meta span { padding:3px 6px; background:#f3f7fa; border-radius:4px; }
.wm-monster small { display:block; color:#526f86; font-size:9px; line-height:1.7; }
.wm-monster .wm-mvp-label { color:#9e560b; background:#fff0da; }
.wm-detail-empty { font-size:11px; color:#748b9e; line-height:1.9; }
.wm-warp-list { display:flex; flex-wrap:wrap; gap:6px; }
.wm-warp-list button { font:inherit; font-size:10px; color:#206b9c; background:#f0f8fe; border:1px solid #deedf8; border-radius:7px; padding:8px; text-align:left; }
.wm-warp-list small { display:block; margin-top:4px; font:9px ui-monospace,monospace; color:#526f86; }
.wm-detail-actions { padding:16px 18px 18px; }
.wm-button { display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--wm-border); background:#f2f8fe; border-radius:8px; font:inherit; font-size:11px; color:#206b9c; min-height:44px; padding:9px 14px; }
.wm-detail-actions .wm-button { width:100%; }
.wm-retry { margin-bottom:16px; }
.wm-results-panel { grid-area:results; min-width:0; }
.wm-results-heading { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin:0 0 14px; }
.wm-results-heading h2 { margin:0; font-size:15px; font-weight:600; color:var(--wm-ink); }
.wm-results-heading span { font-size:10px; color:#526f86; }
.wm-results { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.wm-result { display:flex; align-items:center; gap:11px; width:100%; min-width:0; max-width:100%; text-align:left; padding:11px; border:1px solid var(--wm-border); border-radius:10px; background:#fff; font:inherit; cursor:pointer; }
.wm-result:hover { border-color:#9bceec; background:#f7fbff; }
.wm-result[aria-pressed=true] { border-color:#50a7dc; background:#f0f8ff; box-shadow:inset 0 0 0 1px #50a7dc; }
.wm-result img { width:45px; height:45px; object-fit:cover; border-radius:6px; background:#eff6fb; flex:none; }
.wm-result-icon { display:flex; align-items:center; justify-content:center; width:45px; height:45px; border-radius:6px; color:#91b1c9; background:#eff6fb; font-size:19px; flex:none; }
.wm-result-text { flex:1; min-width:0; }
.wm-result-text strong { display:block; font-size:11px; color:#3b5a74; font-weight:500; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.wm-result-text code { display:block; color:#526f86; font-size:9px; margin-top:4px; overflow:hidden; text-overflow:ellipsis; }
.wm-result-level { flex:none; font-size:9px; color:#526f86; text-align:right; line-height:1.8; }
.wm-result-level b { display:block; font-weight:500; color:#aa671f; }
.wm-load-more { width:100%; border:1px solid var(--wm-border); border-radius:9px; color:#206b9c; font:inherit; font-size:11px; padding:12px; background:#f8fbfe; margin-top:12px; }
.wm-empty { text-align:center; color:#526f86; padding:30px 16px; font-size:12px; line-height:1.9; }
.wm-data-note { display:flex; justify-content:space-between; gap:25px; padding:25px 4px 0; align-items:center; }
.wm-data-note strong { font-size:11px; color:#56758f; font-weight:500; }
.wm-data-note p { margin:7px 0 0 16px; color:#526f86; font-size:10px; line-height:1.8; }
.wm-data-note time { flex:none; color:#526f86; font-size:10px; }
.wm-live-dot { display:inline-block; width:6px; height:6px; background:#76ae95; border-radius:50%; margin-right:7px; }
.wm-unavailable,.wm-noscript { border:1px solid var(--wm-border); border-radius:16px; padding:30px; line-height:1.9; }
.wm-unavailable h2 { font-size:22px; color:var(--wm-ink); }
.wm-noscript ul { display:flex; flex-wrap:wrap; gap:14px 28px; font-size:12px; }
.wm-app button:focus-visible,.wm-app select:focus-visible,.wm-map-scroll:focus-visible { outline:3px solid #398dcc; outline-offset:3px; }
.wm-app button { transition:background .15s,border-color .15s; }
.wm-app [hidden] { display:none!important; }
@media(min-width:1600px) { .wm-layout { grid-template-columns:minmax(0,1fr) 350px; } }
@media(max-width:1100px) { .wm-shell { width:calc(100% - 40px); } .wm-app { padding:18px; } .wm-layout { grid-template-columns:minmax(0,1fr) 300px; gap:16px; } .wm-results { grid-template-columns:1fr; } .wm-map-footer { flex-direction:column; gap:8px; } .wm-level>span { display:none; } }
@media(max-width:800px) { .wm-layout { grid-template-columns:minmax(0,1fr); grid-template-areas:'map' 'detail' 'results'; gap:20px; } .wm-detail { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); } .wm-detail-header,.wm-detail-stats { grid-column:1/-1; } .wm-detail-placeholder { grid-column:1/-1; } .wm-minimap { align-self:start; } .wm-detail-section { padding:18px; } .wm-detail-actions { grid-column:1/-1; } .wm-results { grid-template-columns:repeat(2,minmax(0,1fr)); } .wm-map-scroll { height:500px; } .wm-intro-mark { flex-basis:130px; } .wm-intro-mark svg { width:90px; height:90px; } .wm-data-note { flex-direction:column; align-items:flex-start; gap:12px; } }
@media(max-width:520px) { .wm-shell { width:calc(100% - 24px); margin-bottom:32px; } .wm-intro { padding:28px 6px 22px; } .wm-breadcrumb { margin-bottom:22px; font-size:10px; } .wm-intro h1 { font-size:29px; } .wm-intro h1 span { display:block; margin-left:0; } .wm-intro-mark { display:none; } .wm-mobile-break { display:block; } .wm-lead { font-size:12px; } .wm-stats { grid-template-columns:repeat(2,1fr); padding:4px; gap:0; margin-bottom:18px; } .wm-stats>div { padding:16px 6px; } .wm-stats>div:nth-child(2) { border:0; } .wm-stats>div:nth-child(-n+2) { border-bottom:1px solid var(--wm-border); } .wm-stats strong { font-size:26px; } .wm-stats span { font-size:9px; } .wm-app { padding:12px; border-radius:16px; } .wm-toolbar { flex-direction:column; gap:9px; } .wm-search { padding:0 12px; gap:8px; } .wm-search input { font-size:11px; height:48px; } .wm-level { justify-content:space-between; } .wm-level>span { display:inline; } .wm-level select { width:58%; min-height:44px; } .wm-filterbar { flex-direction:column; align-items:flex-start; gap:2px; margin:12px 0; } .wm-type-tabs { gap:2px; } .wm-type-tabs button { padding:9px 10px; font-size:10px; min-height:44px; } .wm-reset-filters { align-self:flex-end; } .wm-regions button { min-height:44px; } .wm-feedback { line-height:1.8; font-size:10px; } .wm-panel-heading { padding:12px; gap:5px; flex-wrap:wrap; } .wm-panel-heading h2 { font-size:17px; } .wm-zoom button { min-width:36px; min-height:38px; } .wm-zoom output { width:32px; } .wm-map-scroll { height:390px; } .wm-map-footer { padding:12px; font-size:8px; } .wm-detail { display:block; } .wm-minimap img { max-height:220px; } .wm-monsters { max-height:380px; } .wm-results { grid-template-columns:1fr; } .wm-result { min-height:65px; } .wm-result-text strong { font-size:12px; } .wm-detail-section h3 { font-size:14px; } .wm-monster-name { font-size:12px; } .wm-monster-meta,.wm-monster small { font-size:10px; } .wm-data-note { padding:20px 5px 0; } .wm-data-note strong { font-size:10px; } .wm-data-note p { margin-left:0; font-size:9px; } }
@media(prefers-reduced-motion:reduce) { .wm-app button { transition:none; } }

@media(max-width:1100px) and (min-width:801px) { .wm-results { grid-template-columns:minmax(0,1fr); } }
@media(max-width:520px) { .wm-search input,.wm-level select { font-size:16px; } .wm-search input::placeholder { font-size:12px; } .wm-zoom button { min-width:40px; min-height:44px; } .wm-results { grid-template-columns:minmax(0,1fr); } .wm-map-scroll { height:clamp(260px,80vw,390px); } }