/* 위도 경도 도분초 변환기 전용 CSS (2026-10-21). 좌표 확대경 보드: ① 형식 표(v2-tone) ② 확대경 띠 ③ 엑셀 수식 ④ 여러 좌표.
   형식 표(v2in = 보드 폭): 540 이상 [형식 | 위도 | ⇄ | 경도 | 복사], 그 아래는 형식마다 [이름 · 복사] 아래 위도·경도 칸을 한 줄씩(칸 안에 축 이름).
   확대경(cdmz): 700 이상 [세계 지도 2 : 1° · 1′ · 1″ 칸 1씩] 한 줄, 그 아래는 지도 한 줄 + 칸 세 개.
   움직임(R45): 점·확대 자리가 transform으로 옮겨 간다(.45s), 첫 그림은 움직이지 않고 동작 줄이기면 바로. 공용 부품 assets/v2.css */
.cdm-work{container:cdm / inline-size}
.cdm-work .v2-status:empty{display:none}
.cdm-zh{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 10px;margin:0 0 10px}
.cdm-hint{font-family:var(--sans);font-size:12px;color:var(--muted);overflow-wrap:anywhere}

/* ① 형식 표 */
.cdm-board{padding:14px 18px 16px;border-bottom:1px solid var(--soft)}
.cdm-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;margin:0 0 12px}
.cdm-opt{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.cdm-form{display:grid;gap:8px}
.cdm-head,.cdm-row{display:grid;grid-template-columns:70px minmax(0,1fr) 30px minmax(0,1fr) 42px;align-items:center;gap:0 6px}
.cdm-head{align-items:end;margin-bottom:2px}
.cdm-ax{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0}
.cdm-ax[data-a="lat"]{grid-column:2}
.cdm-ax[data-a="lon"]{grid-column:4}
.cdm-axn{font-family:var(--sans);font-size:13px;font-weight:750;color:var(--ink)}
.cdm-hemi button{min-width:34px;padding:0 9px;font-family:var(--sans)}
.cdm-swap{grid-column:3;display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid var(--soft);border-radius:var(--radius);background:var(--paper);color:var(--muted);cursor:pointer;transition:background var(--ease),color var(--ease)}
.cdm-swap svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cdm-swap:hover{background:var(--btn);color:var(--ink)}
.cdm-swap:focus-visible,.cdm-pz:focus-visible,.cdm-exl button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.cdm-rl{display:flex;flex-direction:column;gap:1px;margin:0;min-width:0}
.cdm-rl b{font-family:var(--mono);font-size:13.5px;font-weight:700;letter-spacing:.04em;color:var(--ink)}
.cdm-rl small{font-family:var(--sans);font-size:11px;font-weight:600;color:var(--muted);overflow-wrap:anywhere}
.cdm-row > .cdm-in[data-a="lat"]{grid-column:2}
.cdm-row > .cdm-in[data-a="lon"]{grid-column:4}
.cdm-row > .cdm-cp{grid-column:5}
.cdm-in{min-width:0}
.cdm-in input{font-size:15px;letter-spacing:-.005em}
.cdm-in.is-src{border-color:var(--ink)}
.cdm-in.is-err{border-color:var(--accent)}
.cdm-in .cdm-tag{display:none;min-width:0;border-left:0;border-right:1px solid var(--soft)}
.cdm-ap{display:none;place-items:center;padding:0 0 0 10px;font-style:normal;font-family:var(--sans);font-size:14px;font-weight:700;color:var(--muted)}
.cdm-in.is-ap .cdm-ap{display:grid}
.cdm-cp{justify-content:center;width:42px;height:var(--v2-ctl,42px);padding:0}
.cdm-read{margin:12px 0 0;font-family:var(--sans);font-size:14px;font-weight:650;line-height:1.55;font-variant-numeric:tabular-nums lining-nums;overflow-wrap:anywhere;transition:opacity var(--ease)}
.cdm-read small{display:block;font-size:12px;font-weight:500;color:var(--muted)}
.cdm-read.is-error{color:var(--accent)}
.cdm-read.is-empty{font-weight:500;color:var(--muted)}
.cdm-swapfix{margin-left:6px;height:28px;vertical-align:middle;color:var(--ink)}
.cdm-board.is-pend .cdm-in:not(.is-src),.cdm-board.is-pend .cdm-read{opacity:.45}
.cdm-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 14px;margin-top:10px}
.cdm-acts,.cdm-maps{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.cdm-maps a{text-decoration:none}
.cdm-maps.is-off a{opacity:.45;pointer-events:none}
.cdm-ex{display:flex;flex-direction:column;gap:6px;margin-top:14px;padding-top:12px;border-top:1px dashed var(--line)}
.cdm-exl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.cdm-exl button{display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:0;min-height:44px;padding:6px 9px;border:1px solid var(--soft);border-radius:var(--radius);background:var(--paper);color:var(--ink);font-family:var(--sans);text-align:left;cursor:pointer;transition:background var(--ease),border-color var(--ease)}
.cdm-exl button b{font-size:13px;font-weight:750;overflow-wrap:anywhere}
.cdm-exl button small{font-size:11px;font-weight:600;color:var(--muted)}
.cdm-exl button:hover{background:var(--wash)}

/* ② 확대경: 세계 지도(viewBox 360 × 180, 등장방형) → 1°·1′·1″ 칸(viewBox 100, 그 위도의 남북:동서 비율) */
.cdm-zoom{margin:0;padding:14px 18px 14px;border-bottom:1px solid var(--soft);container:cdmz / inline-size}
.cdm-zs{display:grid;grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr) 26px minmax(0,1fr);align-items:start;gap:12px 0}
.cdm-p{min-width:0}
.cdm-p--w{grid-column:1 / -1}
.cdm-x{align-self:center;margin-top:-28px;font-family:var(--mono);font-size:10.5px;font-weight:700;text-align:center;color:var(--muted)}
.cdm-x--w{display:none}
.cdm-pz{display:block;width:100%;height:auto;aspect-ratio:1;cursor:crosshair;touch-action:manipulation}
.cdm-p--w .cdm-pz{aspect-ratio:2}
.cdm-pz *{vector-effect:non-scaling-stroke}
.cdm-sea{fill:color-mix(in srgb, var(--wash) 80%, var(--paper))}
.cdm-land{fill:color-mix(in srgb, var(--ink) 15%, var(--paper));stroke:color-mix(in srgb, var(--ink) 28%, var(--paper));stroke-width:.5}
.cdm-quad{fill:var(--accent-wash)}
.cdm-grat{fill:none;stroke:color-mix(in srgb, var(--ink) 10%, transparent);stroke-width:.6}
.cdm-axis{fill:none;stroke:color-mix(in srgb, var(--ink) 30%, transparent);stroke-width:.8}
.cdm-cross{fill:none;stroke:var(--accent);stroke-width:.8;stroke-dasharray:3 3;opacity:.7}
.cdm-dot circle{fill:var(--accent);stroke:var(--paper);stroke-width:1.6}
.cdm-ghost circle{fill:none;stroke:var(--ink);stroke-width:1.2;stroke-dasharray:2 2}
.cdm-frame{fill:var(--paper);stroke:var(--line);stroke-width:1}
.cdm-g1{fill:none;stroke:color-mix(in srgb, var(--ink) 9%, transparent);stroke-width:.5}
.cdm-g2{fill:none;stroke:color-mix(in srgb, var(--ink) 24%, transparent);stroke-width:.8}
.cdm-hc rect{fill:color-mix(in srgb, var(--accent) 26%, transparent);stroke:var(--accent);stroke-width:1}
.cdm-ub{fill:none;stroke:var(--ink);stroke-width:1;stroke-dasharray:3 2}
.cdm-ub.is-off,.cdm-ghost.is-off{display:none}
.cdm-zoom.is-off .cdm-dot,.cdm-zoom.is-off .cdm-hc,.cdm-zoom.is-off .cdm-cross,.cdm-zoom.is-off .cdm-ub,.cdm-zoom.is-off .cdm-ghost,.cdm-zoom.is-off .cdm-quad{display:none}
.cdm-zoom.is-ready .cdm-mv{transition:transform .45s cubic-bezier(.2,.75,.25,1)}
.cdm-pc{display:flex;flex-direction:column;gap:1px;margin:6px 0 0;min-width:0;font-family:var(--sans);font-variant-numeric:tabular-nums lining-nums}
.cdm-pc b{font-size:12.5px;font-weight:750;color:var(--ink);overflow-wrap:anywhere}
.cdm-pc small{font-size:11px;font-weight:600;color:var(--muted);overflow-wrap:anywhere}
.cdm-leg{display:flex;flex-wrap:wrap;gap:4px 16px;margin:12px 0 0;padding:0;list-style:none;font-family:var(--sans);font-size:11.5px;font-weight:600;color:var(--muted)}
.cdm-leg li{display:flex;align-items:center;gap:6px;min-width:0}
.cdm-leg i{flex:0 0 auto;width:12px;height:12px}
.cdm-leg-dot i{border-radius:50%;background:var(--accent)}
.cdm-leg-cell i{border:1px solid var(--accent);background:color-mix(in srgb, var(--accent) 26%, transparent)}
.cdm-leg-ub i{border:1px dashed var(--ink)}
.cdm-leg-ghost i{border-radius:50%;border:1.2px dashed var(--ink)}
.cdm-zoom.is-off .cdm-leg,.cdm-leg-ub:has(span:empty){display:none}
.cdm-leg-ub.is-nobox i{visibility:hidden;width:0;margin-right:-6px}

/* ③ 엑셀·구글 시트 수식 */
.cdm-xl{padding:14px 18px;border-bottom:1px solid var(--soft);container:cdmx / inline-size}
.cdm-fx{display:grid;grid-template-columns:minmax(0,1fr);gap:14px 20px}
.cdm-f{min-width:0}
.cdm-ft{margin:0 0 6px;font-family:var(--sans);font-size:13.5px;font-weight:750;color:var(--ink)}
.cdm-ft small{display:block;margin-top:1px;font-size:11.5px;font-weight:600;color:var(--muted)}
.cdm-xax{margin:0 0 8px}
.cdm-code{display:flex;align-items:flex-start;gap:8px}
.cdm-code code{flex:1 1 auto;min-width:0;padding:8px 10px;border:1px solid var(--soft);border-radius:var(--radius);background:var(--paper);font-family:var(--mono);font-size:12px;line-height:1.5;color:var(--ink);white-space:pre-wrap;word-break:break-all}
.cdm-fcp{flex:0 0 auto;justify-content:center;width:36px;padding:0}
.cdm-fs{margin:6px 0 0;font-family:var(--sans);font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums lining-nums;overflow-wrap:anywhere}
.cdm-fs:empty{display:none}

/* ④ 여러 좌표 한꺼번에 */
.cdm-batch{padding:14px 18px 16px;container:cdmb / inline-size}
.cdm-bg{display:grid;grid-template-columns:minmax(0,1fr);gap:10px 16px}
.cdm-bg textarea{display:block;width:100%;min-height:196px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);color:var(--ink);font-family:var(--mono);font-size:12.5px;line-height:1.6;resize:vertical;box-sizing:border-box}
.cdm-bg textarea:focus{outline:0;border-color:var(--ink);box-shadow:0 0 0 2px var(--accent-wash)}
.cdm-bo{display:flex;flex-direction:column;gap:8px;min-width:0;min-height:0}
.cdm-bbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.cdm-btbl{flex:1 1 auto;min-height:120px;max-height:320px;overflow:auto;border:1px solid var(--soft);border-radius:var(--radius);background:var(--paper)}
.cdm-btbl:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.cdm-btbl table{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:12.5px;font-variant-numeric:tabular-nums lining-nums}
.cdm-btbl th{position:sticky;top:0;padding:5px 8px;background:var(--wash);text-align:left;font-size:11.5px;font-weight:700;color:var(--muted)}
.cdm-btbl td{padding:5px 8px;border-top:1px solid var(--soft);white-space:nowrap}
.cdm-btbl td:first-child,.cdm-btbl th:first-child{width:1%;color:var(--muted)}
.cdm-btbl td i{margin-right:3px;font-style:normal;color:var(--muted)}
.cdm-btbl tr.is-err td{color:var(--accent);white-space:normal}
.cdm-btbl tr.is-empty td{color:var(--muted);white-space:normal}
.cdm-btbl tbody.is-demo td{color:var(--muted)}
.cdm-bsum{margin:0;font-family:var(--sans);font-size:12px;color:var(--muted)}
.cdm-bsum:empty{display:none}

/* 본문의 긴 수식(code)은 360px에서 줄바꿈 */
.v2-article code{overflow-wrap:anywhere;word-break:break-all}

@media (prefers-reduced-motion: reduce){ .cdm-zoom.is-ready .cdm-mv{transition:none} }

/* 폭 */
@container cdmz (min-width:700px){
  .cdm-zs{grid-template-columns:minmax(0,2fr) 22px minmax(0,1fr) 26px minmax(0,1fr) 26px minmax(0,1fr)}
  .cdm-p--w{grid-column:auto}
  .cdm-x--w{display:block}
}
@container v2in (min-width:700px){ .cdm-head,.cdm-row{grid-template-columns:96px minmax(0,1fr) 30px minmax(0,1fr) 42px} } /* es 'Grados decimales' 같은 형식 이름이 두 줄 안에 */
@container cdmx (min-width:640px){ .cdm-fx{grid-template-columns:repeat(2,minmax(0,1fr))} }
@container cdmb (min-width:600px){ .cdm-bg{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)} .cdm-btbl{max-height:none;flex-basis:0} }
@container cdm (max-width:479px){ .cdm-exl{grid-template-columns:repeat(2,minmax(0,1fr))} }
@container v2in (max-width:539px){ /* 형식마다 [이름 · 복사] 아래 위도·경도 칸 한 줄씩(DMS 경도 '126° 58′ 40.8913″ E'가 반쪽 칸에서 잘림) */
  .cdm-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}
  .cdm-head .cdm-corner{display:none}
  .cdm-ax{flex:1 1 140px}
  .cdm-swap{order:3;flex:0 0 auto}
  .cdm-ax[data-a="lon"]{order:4}
  .cdm-row{grid-template-columns:minmax(0,1fr) 42px;gap:6px 6px;padding-top:8px;border-top:1px solid var(--soft)}
  .cdm-rl{flex-direction:row;align-items:baseline;gap:8px}
  .cdm-row > .cdm-in[data-a="lat"],.cdm-row > .cdm-in[data-a="lon"]{grid-column:1 / -1}
  .cdm-row > .cdm-cp{grid-column:2;grid-row:1;width:42px;height:32px}
  .cdm-in .cdm-tag{display:grid;width:44px}
}
@container cdm (max-width:439px){
  .cdm-board,.cdm-zoom,.cdm-xl,.cdm-batch{padding-left:14px;padding-right:14px}
  .cdm-acts .v2-btn .i{display:none}
}