/* 시장 지도 공통 (2026-10-19) — 항상 어두운 무대 */
body.map-page{background:#04060c;margin:0;overflow:hidden}
.map-stage{position:relative;width:100%;height:calc(100vh - 52px);overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#0b1530 0%,#060a16 55%,#03050a 100%);color:#cfe0ff;font-family:Pretendard Variable,Pretendard,sans-serif}
.map-stage canvas{display:block}
.map-hud{position:absolute;z-index:5;pointer-events:none;font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;letter-spacing:.04em;color:#8fb2e8}
.map-hud .pe{pointer-events:auto}
.map-top{left:16px;right:16px;top:12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.map-tabs{display:flex;gap:4px;pointer-events:auto}
.map-tabs a{font-family:Pretendard Variable,Pretendard,sans-serif;font-size:12.5px;font-weight:700;letter-spacing:0;color:#9bb5dd;text-decoration:none;padding:5px 12px;border:1px solid #1f2d4d;border-radius:6px;background:rgba(10,18,36,.75)}
.map-tabs a.on{color:#fff;border-color:#3d6bff;background:rgba(47,107,255,.25);box-shadow:0 0 12px rgba(61,107,255,.45)}
.chip{display:inline-block;border:1px solid #22345a;background:rgba(8,14,30,.78);border-radius:4px;padding:4px 8px;color:#a9c4ee;white-space:nowrap}
.chip b{color:#fff;font-weight:700}
.chip.hot{border-color:#7a2a3a;color:#ffb3c0}.chip.cool{border-color:#24477a;color:#a8ccff}
.map-ctl{display:flex;gap:6px;align-items:center;pointer-events:auto}
.map-ctl select,.map-ctl input,.map-ctl button{font:inherit;font-family:Pretendard Variable,Pretendard,sans-serif;font-size:12px;color:#d7e5ff;background:rgba(8,14,30,.85);border:1px solid #22345a;border-radius:5px;padding:4px 8px}
.map-ctl input{width:120px}
.map-ctl button.on{border-color:#3d6bff;background:rgba(47,107,255,.3);color:#fff}
.map-legend{left:16px;bottom:14px;max-width:min(560px,calc(100% - 32px));display:flex;flex-wrap:wrap;gap:4px 10px}
.map-legend span{display:inline-flex;align-items:center;gap:5px;cursor:pointer;pointer-events:auto}
.map-legend span.off{opacity:.3}
.map-legend i{width:8px;height:8px;border-radius:50%;display:inline-block;box-shadow:0 0 6px currentColor}
.map-note{right:16px;bottom:14px;max-width:360px;text-align:right;font-family:Pretendard Variable,Pretendard,sans-serif;font-size:10.5px;letter-spacing:0;color:#5f7699;line-height:1.5}
.map-tip{position:absolute;z-index:8;pointer-events:none;background:rgba(6,11,24,.94);border:1px solid #2c4a85;border-radius:6px;padding:8px 10px;font-size:12px;color:#dbe7ff;min-width:170px;box-shadow:0 0 18px rgba(47,107,255,.35);display:none;font-family:Pretendard Variable,Pretendard,sans-serif}
.map-tip b{font-size:13.5px}.map-tip small{color:#7f97bf}.map-tip .r{display:flex;justify-content:space-between;gap:14px;margin-top:2px}
.map-panel{position:absolute;z-index:6;right:330px;top:100px;width:280px;max-height:calc(100% - 120px);overflow:auto;background:rgba(6,11,24,.92);border:1px solid #23406f;border-radius:8px;padding:12px 14px;font-family:Pretendard Variable,Pretendard,sans-serif;font-size:12.5px;color:#d5e3ff;display:none;box-shadow:0 0 24px rgba(47,107,255,.25)}
.map-panel h3{margin:0 0 4px;font-size:16px;color:#fff}.map-panel a{color:#7fb0ff}.map-panel .x{position:absolute;right:10px;top:8px;cursor:pointer;color:#7f97bf;background:none;border:0;font-size:16px}
.map-panel .nb{display:flex;justify-content:space-between;padding:3px 0;border-bottom:1px dashed #1b2a48;cursor:pointer}
.map-panel .nb:hover{color:#fff}
.map-ticker{left:0;right:0;bottom:44px;height:20px;overflow:hidden;white-space:nowrap;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.map-ticker .in{display:inline-block;padding-left:100%;animation:tick 90s linear infinite}
.map-ticker em{font-style:normal;margin-right:22px}
@keyframes tick{to{transform:translateX(-100%)}}
.map-loading{position:absolute;inset:0;display:grid;place-items:center;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12px;color:#5f86c9;letter-spacing:.2em;z-index:4}
@media (max-width:720px){.map-ticker{right:16px!important}.map-note{display:none}.map-panel{left:12px;right:12px;width:auto;top:auto;bottom:12px;max-height:45%}.map-ctl input{width:90px}.map-legend{bottom:10px}}

.map-stage [hidden]{display:none!important}

/* 한눈 요약(2026-10-19) — 숫자 카드·순위 목록 */
.kpis{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px}
.kpi{border:1px solid #1d2c4c;background:rgba(6,11,24,.82);border-radius:6px;padding:5px 7px;min-width:0}
.kpi small{display:block;font-size:10px;color:#6f86ad;white-space:nowrap}.kpi b{display:block;font-size:17px;color:#fff;font-weight:800;white-space:nowrap;letter-spacing:-.3px}.kpi i{font-style:normal;font-size:10px;color:#6f86ad}
.breadth{display:flex;height:6px;border-radius:3px;overflow:hidden;margin:6px 0 2px;background:#13203a}.breadth span{display:block}
.bl{display:flex;justify-content:space-between;font-size:10.5px;color:#6f86ad}
.lsts{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}
.lst{border:1px solid #16243f;background:rgba(6,11,24,.78);border-radius:6px;padding:5px 6px;min-width:0}
.lst h4{margin:0 0 3px;font-size:10px;font-weight:700;color:#7d9bd0;letter-spacing:.04em;white-space:nowrap}
.lst .r{position:relative;display:flex;justify-content:space-between;gap:4px;font-size:11.5px;padding:2px 3px;cursor:pointer;border-radius:3px;overflow:hidden}
.lst .r:hover{background:rgba(61,107,255,.18)}
.lst .r .bg{position:absolute;left:0;top:0;bottom:0;opacity:.18;border-radius:3px}
.lst .r span,.lst .r b{position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lst .r span{color:#dfe9ff}.lst .r b{font-weight:700}
.rcol{right:16px;top:100px;width:300px;pointer-events:auto;font-family:Pretendard Variable,Pretendard,sans-serif;letter-spacing:0;max-height:calc(100% - 150px);overflow:auto;scrollbar-width:none}
/* 2026-10-22: 좁은 화면 — 오른쪽 패널을 아래에서 올라오는 시트로(손잡이 탭으로 열고 닫기, map-common.js 가 손잡이를 끼움) */
@media (max-width:900px){
  .rcol{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;max-height:62vh;max-width:none;border-radius:14px 14px 0 0;border-bottom:0;padding-top:30px;transform:translateY(calc(100% - 42px));transition:transform .28s cubic-bezier(.2,.8,.2,1);z-index:60;background:rgba(6,11,24,.96);box-shadow:0 -8px 28px rgba(0,0,0,.45);overflow:auto;overscroll-behavior:contain}
  .rcol.open{transform:none}
  .rcol-handle{position:sticky;top:-30px;margin:-30px -12px 6px;height:30px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:11.5px;color:#9db1d8;background:rgba(6,11,24,.96);cursor:pointer;user-select:none;z-index:2}
  .rcol-handle::before{content:"";width:36px;height:4px;border-radius:2px;background:#33466f}
  .rcol-handle span{white-space:nowrap}
  body.map-page .map-stage{padding-bottom:48px}
}
@media (max-width:760px){.rcol{bottom:62px;max-height:calc(62vh - 62px)}}
@media (min-width:901px){.rcol-handle{display:none}}
/* 2026-10-19: 좁은 화면에서 버튼 줄이 페이지를 옆으로 넓히지 않게 */
body.map-page{overflow-x:hidden;max-width:100vw}
.map-stage{max-width:100vw}
.map-ctl{flex-wrap:wrap;justify-content:flex-end;min-width:0}
@media (max-width:720px){.map-ctl .ly:not([data-ly=money]){display:none}.map-top{right:16px;flex-wrap:wrap}}

/* 2026-10-19: 국내·해외·전체 선택 */
.seg{display:inline-flex;border:1px solid #2a3f6c;border-radius:6px;overflow:hidden;background:rgba(8,14,30,.85)}.seg button{border:0!important;border-radius:0!important;background:none!important;color:#9fb6dc!important;padding:4px 10px!important;font-weight:700;cursor:pointer}.seg button+button{border-left:1px solid #2a3f6c!important}.seg button.on{background:rgba(61,107,255,.35)!important;color:#fff!important;box-shadow:inset 0 0 10px rgba(61,107,255,.5)}


/* ── 2026-10-20: datalab 다른 탭과 같은 글꼴·색·모양으로(ui.css 어두운 테마 토큰과 같은 값) ── */
.map-stage{--m-bg:#0F1319;--m-card:rgba(22,27,35,.94);--m-card2:#1D242E;--m-line:#273040;--m-line2:#36415A;--m-ink:#E6EAF0;--m-ink2:#B4BCC8;--m-ink3:#8791A0;--m-ink4:#5B6574;--m-blue:#4D8DFF;--m-blue-soft:#1C2B4A;--m-up:#F0555E;--m-down:#4D8DFF;
  font-family:var(--font);color:var(--m-ink2);background:radial-gradient(ellipse at 55% 45%,#16203a 0%,#10151f 55%,var(--m-bg) 100%)}
body.map-page{background:var(--m-bg,#0F1319)}
.map-hud,.map-tip,.map-panel,.map-note,.map-loading,.rcol,.lcol,.sec-lbl,.story,.map-tabs a,.chip,.map-ctl select,.map-ctl input,.map-ctl button,.seg button{font-family:var(--font)!important;letter-spacing:0!important}
.map-hud{font-size:12px;color:var(--m-ink3)}
.map-loading{font-size:13px;color:var(--m-ink3)}
/* 제목 — 다른 탭의 page-h 와 같은 굵기·크기 체계 */
.mtitle{display:inline-flex;align-items:baseline;gap:8px;margin-right:4px;pointer-events:none}
.mtitle b{font-size:20px;font-weight:800;letter-spacing:-.02em!important;color:var(--m-ink)}
.mtitle small{font-size:12.5px;color:var(--m-ink3)}
/* 탭 — 주목도 페이지와 같은 밑줄 탭 */
.map-tabs{gap:2px;border-bottom:1px solid var(--m-line);margin-right:6px}
.map-tabs a{border:0;border-bottom:2px solid transparent;border-radius:0;background:none;padding:6px 10px;margin-bottom:-1px;font-size:13px;font-weight:600;color:var(--m-ink3)}
.map-tabs a.on{color:var(--m-ink);border-bottom-color:var(--m-blue);background:none;box-shadow:none}
.map-tabs a:hover{color:var(--m-ink)}
/* 칩·버튼·선택 상자 — ui.css .btn/.fsel 과 같은 둥근 정도(6px)·굵기 */
.chip{border:1px solid var(--m-line);background:var(--m-card);border-radius:6px;padding:4px 9px;font-size:12px;color:var(--m-ink3)}
.chip b{color:var(--m-ink);font-weight:700;font-variant-numeric:tabular-nums}
.chip.hot{border-color:#5a2a33;color:#f3a7ae}
.map-ctl select,.map-ctl input,.map-ctl button{font-size:12.5px;font-weight:600;color:var(--m-ink2);background:var(--m-card2);border:1px solid var(--m-line2);border-radius:6px;padding:5px 10px}
.map-ctl button:hover{color:var(--m-ink);border-color:var(--m-ink3)}
.map-ctl button.on{background:var(--m-blue-soft);border-color:#2E4B8A;color:var(--m-ink);box-shadow:none}
.map-ctl input::placeholder{color:var(--m-ink4)}
.seg{border:1px solid var(--m-line2);border-radius:6px;background:var(--m-card2)}
.seg button{color:var(--m-ink3)!important;font-weight:600!important;font-size:12.5px!important;padding:5px 11px!important}
.seg button+button{border-left:1px solid var(--m-line2)!important}
.seg button.on{background:var(--m-blue)!important;color:#fff!important;box-shadow:none!important}
/* 숫자 카드·순위 목록·범례 — tile/panel 과 같은 카드 */
.kpi{background:var(--m-card);border:1px solid var(--m-line);border-radius:6px;padding:7px 9px}
.kpi small{font-size:11px;color:var(--m-ink3);font-weight:500}.kpi b{font-size:18px;color:var(--m-ink);letter-spacing:-.02em!important;font-variant-numeric:tabular-nums}.kpi i{font-size:10.5px;color:var(--m-ink4)}
.breadth{background:var(--m-line)}.bl{font-size:11px;color:var(--m-ink3)}
.lst{background:var(--m-card);border:1px solid var(--m-line);border-radius:6px;padding:6px 7px}
.lst h4{font-size:11px;font-weight:600;color:var(--m-ink3);letter-spacing:0!important}
.lst .r{font-size:12px}.lst .r span{color:var(--m-ink)}.lst .r b{font-variant-numeric:tabular-nums}.lst .r:hover{background:rgba(77,141,255,.12)}
.lgd{background:var(--m-card)!important;border:1px solid var(--m-line)!important;border-radius:6px!important;color:var(--m-ink3)!important;font-size:11.5px!important}
.map-legend{font-size:11.5px;color:var(--m-ink3)}
.map-note{font-size:11px;color:var(--m-ink4)}
/* 툴팁·상세 창 — panel 모양 */
.map-tip{background:var(--m-card);border:1px solid var(--m-line2);border-radius:6px;box-shadow:0 8px 28px rgba(0,0,0,.5);color:var(--m-ink2);font-size:12.5px}
.map-tip b{color:var(--m-ink);font-size:13.5px}.map-tip small{color:var(--m-ink3)}
.map-panel{background:var(--m-card);border:1px solid var(--m-line2);border-radius:6px;box-shadow:0 8px 28px rgba(0,0,0,.5);color:var(--m-ink2);font-size:12.5px}
.map-panel h3{color:var(--m-ink);font-size:17px;font-weight:800;letter-spacing:-.02em}.map-panel a{color:var(--m-blue)}.map-panel .x{color:var(--m-ink3)}
.map-panel .nb{border-bottom:1px solid var(--m-line)}.map-panel .nb:hover{color:var(--m-ink)}
.map-ticker em{font-size:12px}
/* 해설·타임라인 */
.story{background:var(--m-card)!important;border:1px solid var(--m-line);border-radius:6px;color:var(--m-ink2)!important;font-size:13px!important}
.story:after{display:none}
.story b{color:var(--m-ink)}
.tl select,.tl button{font-family:var(--font)!important;font-weight:600;color:var(--m-ink2)!important;background:var(--m-card2)!important;border:1px solid var(--m-line2)!important;border-radius:6px!important}
.tl button.on{background:var(--m-blue-soft)!important;color:var(--m-ink)!important}
.tl canvas{background:var(--m-card)!important;border:1px solid var(--m-line)!important;border-radius:6px!important}
.tl .when{color:var(--m-ink2);font-size:12.5px}
.sec-board .row{background:var(--m-card)!important;border:1px solid var(--m-line)!important;border-radius:6px!important}
.mtitle{order:-1;margin-right:14px}

/* 2026-10-20: 시각 정리 — 레이어 메뉴·색 막대 범례 */
.lyr{position:relative;display:inline-block}
.lyr-pop{position:absolute;right:0;top:calc(100% + 6px);z-index:30;background:var(--m-card);border:1px solid var(--m-line2);border-radius:6px;box-shadow:0 8px 28px rgba(0,0,0,.5);padding:6px;display:grid;gap:2px;min-width:200px}
.lyr-pop label{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--m-ink2);padding:5px 8px;border-radius:4px;cursor:pointer;white-space:nowrap}
.lyr-pop label:hover{background:var(--m-card2);color:var(--m-ink)}
.lyr-pop input{accent-color:var(--m-blue)}
#lyrn{color:var(--m-ink3);font-weight:500}
.cscale{left:330px;top:100px;width:230px;pointer-events:none;background:var(--m-card);border:1px solid var(--m-line);border-radius:6px;padding:7px 10px}
.cs-t{font-size:11.5px;font-weight:600;color:var(--m-ink2);margin-bottom:5px}
.cs-bar{height:7px;border-radius:4px}
.cs-l{display:flex;justify-content:space-between;font-size:10.5px;color:var(--m-ink3);margin-top:3px;font-variant-numeric:tabular-nums}
@media (max-width:900px){.cscale{left:16px;top:auto;bottom:130px;width:190px}}

/* 2026-10-20: 사건 타임라인 띠·섹터 확대 표 */
.evline{left:330px;right:16px;bottom:10px;pointer-events:auto;display:flex;align-items:center;gap:8px}
.ev-h{font-size:11.5px;font-weight:600;color:var(--m-ink3);white-space:nowrap}
.ev-row{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;flex:1}
.ev-row .ev{display:inline-flex;align-items:center;gap:6px;flex:none;font-family:var(--font);font-size:12px;color:var(--m-ink2);background:var(--m-card);border:1px solid var(--m-line);border-radius:6px;padding:4px 9px;cursor:pointer;white-space:nowrap}
.ev-row .ev:hover{border-color:var(--m-line2);color:var(--m-ink)}
.ev-row .ev[disabled]{cursor:default;opacity:.7}
.ev-row .ev i{width:7px;height:7px;border-radius:50%;flex:none}
.ev-row .ev .t{color:var(--m-ink4);font-variant-numeric:tabular-nums}
.ev-row .ev b{color:var(--m-ink)}
.ev-empty{font-size:12px;color:var(--m-ink4)}
.map-panel.wide{width:470px}
.sp-t{font-size:12px}
.sp-h,.sp-r{display:grid;grid-template-columns:1.1fr 70px .9fr .6fr .8fr .8fr .7fr;gap:6px;align-items:center;padding:4px 2px;border-bottom:1px solid var(--m-line)}
.sp-h{color:var(--m-ink3);font-size:11px;font-weight:600}
.sp-r{cursor:pointer;font-variant-numeric:tabular-nums}.sp-r:hover{background:var(--m-card2)}
.sp-r span:not(:first-child),.sp-h span:not(:first-child){text-align:right}.sp-r span:nth-child(2),.sp-h span:nth-child(2){text-align:center}
@media (max-width:900px){.evline{left:16px}.map-panel.wide{width:auto}}