/* 테마 v3 (2026-11-04 사용자 결정: 전문 도구형·밝은 배경·포인트 남색). body.v3 일 때만. 끄려면 index.html 에서 이 줄만 빼면 됨 */
body.v3 {
  --bg: #FFFFFF; --bg2: #F4F5F7; --fg: #15191E; --fg2: #3F4852; --fg3: #7A8491; --edge: #D9DEE3;
  --accent: #1E3A5F; --warn: #B7791F; --bad: #C0392B; --ok: #1F7A4D; --halo: #FFFFFF;
  --mono: 'SF Mono', 'JetBrains Mono', Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark) { body.v3 { --bg: #15181C; --bg2: #1C2025; --fg: #E8ECF0; --fg2: #B4BCC5; --fg3: #7C8690; --edge: #2A3037; --accent: #8FB3E0; --ok: #4CC38A; --halo: #15181C; } }
@media (min-width: 821px) {
  body.v3 { font-size: 14px; }
  body.v3 .adPanel { background: var(--bg); border-right: 1px solid var(--edge); }
  body.v3 .v3Top { padding: 10px 14px; background: var(--bg2); }
  body.v3 .v3Top .brand { font-size: 14px; letter-spacing: -.01em; }
  body.v3 .v3Top .aboutLink { font-size: 12px; }
  body.v3 .v3Tabs { background: transparent; border: 1px solid var(--edge); border-radius: 4px; padding: 0; }
  body.v3 .v3Tabs button { border-radius: 0; padding: 4px 10px; font-size: 12px; }
  body.v3 .v3Tabs button.on { background: var(--accent); color: #fff; box-shadow: none; }
  body.v3 .adHead { padding: 10px 14px 6px; }
  body.v3 .adHead b { font-size: 13px; font-weight: 700; text-transform: none; color: var(--fg2); }
  body.v3 .adHead em { font-family: var(--mono); color: var(--fg); font-size: 13px; }
  /* 필터: 알약 → 직각 토글 */
  body.v3 .v3Filt { padding: 0 14px 8px; gap: 4px; }
  body.v3 .v3Filt .seg { border-radius: 3px; border-color: var(--edge); }
  body.v3 .v3Filt .seg button { padding: 3px 8px; font-size: 11.5px; }
  body.v3 .v3Filt .seg button.on { background: var(--accent); color: #fff; }
  body.v3 .v3Filt .chip, body.v3 .v3Filt select { border-radius: 3px; padding: 3px 8px; font-size: 11.5px; }
  body.v3 .v3Filt .chip.on { border-color: var(--accent); color: var(--accent); background: transparent; }
  body.v3 .v3Filt .chip.soon.on { border-color: var(--bad); color: var(--bad); background: transparent; }
  /* 카드 → 행 */
  body.v3 .adCard { grid-template-columns: 64px 1fr; gap: 10px; padding: 9px 14px 9px 14px; border-bottom: 1px solid var(--edge); }
  body.v3 .adCard:hover { background: var(--bg2); }
  body.v3 .adCard.sel { background: var(--bg2); box-shadow: inset 3px 0 0 var(--accent); }
  body.v3 .adThumb { width: 64px; height: 52px; border-radius: 2px; filter: saturate(.7); }
  body.v3 .adGr { left: 14px; top: 9px; width: 18px; height: 18px; border-radius: 0 0 3px 0; font-size: 11px; background: #7A8491; }
  body.v3 .adGr.A { background: var(--ok); } body.v3 .adGr.B { background: var(--warn); }
  body.v3 .adPrice { font-size: 15px; font-family: var(--mono); letter-spacing: -.01em; }
  body.v3 .adPrice em { font-family: var(--mono); font-size: 12px; color: var(--accent); margin-left: 8px; }
  body.v3 .obTag { background: var(--accent); border-radius: 2px; font-size: 10.5px; padding: 1px 4px; vertical-align: 2px; font-weight: 600; }
  body.v3 .adMeta { font-size: 11.5px; color: var(--fg2); }
  body.v3 .adMeta b[style*="1a7f37"] { color: var(--ok) !important; font-weight: 600; }
  body.v3 .adMeta .per { font-family: var(--mono); }
  body.v3 .adAddr { font-size: 11.5px; color: var(--fg3); }
  body.v3 .adEnd { font-family: var(--mono); font-size: 11px; color: var(--fg3); }
  body.v3 .adEnd b { color: var(--fg2); font-weight: 600; } body.v3 .adEnd b.soon { color: var(--bad); }
  body.v3 .adMore { font-size: 12px; padding: 10px; }
  body.v3 .adFoot { font-family: var(--mono); font-size: 10.5px; background: var(--bg2); }
  body.v3 .v3Search { padding: 8px 10px; background: var(--bg2); }
  body.v3 .v3Search input { border-radius: 3px; font-size: 13px; padding: 7px 10px; }
  body.v3 .v3Search button { border-radius: 3px; width: 34px; }
  /* 지도 위 요소 */
  body.v3 .v3Legend { border-radius: 3px; font-size: 11px; padding: 5px 8px; box-shadow: none; }
  body.v3 .v3Legend i { border-radius: 1px; }
  body.v3 .leaflet-control-zoom a { border-radius: 0 !important; }
  body.v3 .leaflet-control-zoom { border-radius: 0 !important; box-shadow: none !important; border: 1px solid var(--edge) !important; }
  body.v3 .baseLite { filter: grayscale(.9) contrast(.96) brightness(1.02); }   /* 바탕 지도는 회색톤, 핀·선로만 색 */
  body.v3 #browse, body.v3 #detail { border-radius: 4px; box-shadow: 0 2px 10px rgba(0,0,0,.08); }
  body.v3 #hint { border-radius: 3px; font-size: 12px; }
  /* 핀: 직각 라벨, 고정폭 숫자 */
  body.v3 .obPin span { border-radius: 2px; font-family: var(--mono); font-weight: 600; font-size: 11px; padding: 3px 6px; box-shadow: 0 1px 2px rgba(0,0,0,.25); }
  body.v3 .obPin.grA span, body.v3 .obPin.ok span { background: var(--ok); } body.v3 .obPin.grA span::after, body.v3 .obPin.ok span::after { border-top-color: var(--ok); } body.v3 .obPin.grA i, body.v3 .obPin.ok i { background: var(--ok); }
  body.v3 .obPin.grB span { background: var(--warn); } body.v3 .obPin.grB span::after { border-top-color: var(--warn); } body.v3 .obPin.grB i { background: var(--warn); }
  body.v3 .obPin.bPin span { background: var(--accent); } body.v3 .obPin.bPin span::after { border-top-color: var(--accent); } body.v3 .obPin.bPin i { background: var(--accent); }
  body.v3 .obPin.bPin.grB span { background: #5B7FA8; } body.v3 .obPin.bPin.grB span::after { border-top-color: #5B7FA8; } body.v3 .obPin.bPin.grB i { background: #5B7FA8; }
  /* 변전소: 육각형, 크기 = 여유 MW, 채움 = 여유 구간, 라벨 = 이름 + MW */
  body.v3 .subMk { display: flex; align-items: center; gap: 4px; transform: translate(-50%, -50%); }
  body.v3 .subHex { flex: none; clip-path: polygon(25% 3%, 75% 3%, 100% 50%, 75% 97%, 25% 97%, 0 50%); background: var(--accent); box-shadow: none; border: 0; display: grid; place-items: center; }
  body.v3 .subHex::before { content: ''; width: 58%; height: 58%; clip-path: inherit; background: var(--bg); opacity: 0; }
  body.v3 .subHex.f0::before { opacity: 1; }                 /* 여유 0: 속 빈 육각형 */
  body.v3 .subHex.f0 { background: var(--bad); }
  body.v3 .subHex.f1 { background: #9FB6D1; } body.v3 .subHex.f2 { background: #5B7FA8; } body.v3 .subHex.f3 { background: var(--accent); }
  body.v3 .subHex.na { background: #B6BEC7; }
  body.v3 .subHex.est { opacity: .6; }
  body.v3 .subNm { font: 600 11px/1.15 var(--font); color: var(--fg); background: rgba(255,255,255,.92); padding: 2px 5px; border-radius: 2px; box-shadow: 0 0 0 1px var(--edge); white-space: nowrap; }
  body.v3 .subNm em { font-style: normal; font-family: var(--mono); color: var(--accent); margin-left: 4px; font-size: 10.5px; }
  body.v3 .subNm em.bad { color: var(--bad); }
  @media (prefers-color-scheme: dark) { body.v3 .subNm { background: rgba(21,24,28,.92); } }
}