/* 결로 위험 계산기 전용 CSS (2026-10-20). 결과·벽면 그림(cnd-hero) → 조건 줄(cnd-in) → 부위 카드(cnd-parts) → 고른 부위·결로 지도(cnd-low) → 표. 공용 부품은 assets/v2.css.
   상태 색(마름·물 맺힘·성에·곰팡이 조건)은 밝은 고정색 + 어두운 고정 글자(--cnd-t)라 라이트·다크 모두 대비를 지킨다. accent는 지도의 '지금 조건' 점 한 곳.
   움직임: 물방울 흘러내림 2.4s(동작 줄이기면 멈춤), 카드·표식 색 전환 200ms. 테마 --ease는 120ms 지연을 품고 있어 쓰지 않음. */
.cnd-work{container:cnd / inline-size;--cnd-t:#1f1a14;--cnd-water:#4f8fd0;--cnd-water2:#2f6fb5;--cnd-dry:#d6e6cc;--cnd-dry2:#6f9a5a;--cnd-wet:#a9cdf2;--cnd-wet2:#3d7fc4;--cnd-frost:#e6f0fa;--cnd-frost2:#8fb3d9;--cnd-mold:#ecd894;--cnd-mold2:#a8841a;text-spacing-trim:space-all}
.cnd-hero{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);grid-template-areas:"stage ans";border-bottom:1px solid var(--soft)}
.cnd-ans{grid-area:ans;display:flex;flex-direction:column;gap:9px;padding:16px 18px;min-width:0;border-left:1px solid var(--soft)}
.cnd-stage-box{grid-area:stage;min-width:0;padding:12px 12px 10px;display:flex;align-items:center}
.cnd-stage{display:block;width:100%;height:auto}
.cnd-verdict{display:flex;align-items:flex-start;gap:8px;margin:0;font-family:var(--sans);font-size:18.5px;font-weight:750;line-height:1.35;color:var(--ink);word-break:keep-all}
.cnd-verdict:empty{display:none}
.cnd-verdict::before{content:"";flex:0 0 auto;width:11px;height:11px;margin-top:6px;border-radius:50%;background:var(--soft)}
.cnd-verdict.s-wet::before{background:var(--cnd-wet2)}
.cnd-verdict.s-frost::before{background:var(--cnd-frost2)}
.cnd-verdict.s-mold::before{background:var(--cnd-mold2)}
.cnd-verdict.s-dry::before{background:var(--cnd-dry2)}
.cnd-big{flex-wrap:wrap;row-gap:4px;font-size:44px}
.cnd-big.is-word{font-size:22px;line-height:1.3}
.cnd-big small{flex:1 1 140px;font-family:var(--sans);font-size:13.5px;font-weight:600;line-height:1.4;letter-spacing:0;color:var(--muted)}
.cnd-sub{margin:0;font-family:var(--sans);font-size:13px;line-height:1.6;color:var(--ink)}
.cnd-rows li{flex-wrap:wrap}
.cnd-rows li b{text-align:right;margin-left:auto}
.cnd-foot{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:auto;padding-top:4px}
:lang(ko) .cnd-sub,:lang(ko) .cnd-help,:lang(ko) .cnd-big small,:lang(ko) .cnd-part small,:lang(ko) .cnd-det-src{word-break:keep-all}

/* 벽면 그림 */
.cnd-wall{fill:var(--wash)}
.cnd-ceil,.cnd-floor{fill:var(--btn)}
.cnd-edge{stroke:var(--line);stroke-width:1;fill:none}
.cnd-corner{fill:var(--ink);opacity:.05}
.cnd-sky0{stop-color:#b4cfe8}.cnd-sky1{stop-color:#e8f0f6}
.cnd-stage.is-warm .cnd-sky0{stop-color:#f2c27e}.cnd-stage.is-warm .cnd-sky1{stop-color:#fbe8c8}
.cnd-glass{stroke:none}
.cnd-frame{fill:#f2efe8;stroke:#8a8172;stroke-width:1}
.cnd-sash{fill:none;stroke:#8a8172;stroke-width:4}
.cnd-sill{fill:#d9d2c3;stroke:#8a8172;stroke-width:1}
.cnd-fog{fill:#fff;opacity:.6;transition:opacity 400ms}
.cnd-fog.is-ice{fill:#f5f9fd;opacity:.78}
.cnd-fogc{stop-color:#fff}
.cnd-ice{stroke:#fff;stroke-width:1;opacity:.95}
.cnd-icep{opacity:.9}
.cnd-otag{font-family:var(--sans);font-size:13px;font-weight:700;fill:var(--cnd-t)}
.cnd-otag2{font-family:var(--sans);font-size:11.5px;font-weight:700;fill:var(--cnd-t)}
.cnd-div{stroke:var(--line);stroke-width:1;stroke-dasharray:4 4}
.cnd-dlab{font-family:var(--sans);font-size:12.5px;font-weight:600;fill:var(--muted)}
.cnd-door{fill:#c9b08e;stroke:#7a6448;stroke-width:1.2}
.cnd-door-in{fill:none;stroke:#7a6448;stroke-width:1;opacity:.6}
.cnd-knob{fill:#6b5a44}
.cnd-itag{font-family:var(--sans);font-size:15px;font-weight:750;fill:var(--ink)}
.cnd-itag2{font-family:var(--sans);font-size:13px;font-weight:600;fill:var(--muted)}
.cnd-mk{cursor:pointer}
.cnd-dot{fill:#fff;stroke:var(--cnd-t);stroke-width:1.5;transition:fill 200ms}
.cnd-mk.s-dry .cnd-dot{fill:var(--cnd-dry)}
.cnd-mk.s-wet .cnd-dot{fill:var(--cnd-wet2)}
.cnd-mk.s-frost .cnd-dot{fill:var(--cnd-frost)}
.cnd-mk.s-mold .cnd-dot{fill:var(--cnd-mold)}
.cnd-mk.s-need .cnd-dot{fill:var(--paper);stroke-dasharray:3 2}
.cnd-ring{fill:none;stroke:var(--ink);stroke-width:2;opacity:0;transition:opacity 200ms}
.cnd-mk.is-sel .cnd-ring{opacity:1}
.cnd-mt{font-family:var(--sans);font-size:13.5px;font-weight:750;fill:var(--ink);paint-order:stroke;stroke:var(--wash);stroke-width:3px;stroke-linejoin:round;font-variant-numeric:tabular-nums}

.cnd-mk.in-glass .cnd-mt{fill:var(--cnd-t);stroke:#eef4f9}
.cnd-dp{fill:var(--cnd-water);animation:cndDrip 2.4s ease-in infinite}
.cnd-dp.on-glass{fill:var(--cnd-water2);opacity:.85}
@keyframes cndDrip{0%{transform:translateY(-4px);opacity:0}20%{opacity:1}80%{opacity:1}100%{transform:translateY(14px);opacity:0}}
.cnd-spk circle{fill:#4d5a24;opacity:.7}
@media (prefers-reduced-motion:reduce){.cnd-dp{animation:none}.cnd-dot,.cnd-ring,.cnd-fog,.cnd-part{transition:none}}

/* 조건 줄 */
.cnd-in{display:flex;flex-direction:column;gap:10px;padding:14px 18px;border-bottom:1px solid var(--soft)}
.cnd-air{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px 12px}
.cnd-orh[hidden]{display:none}
.cnd-house{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 12px}
.cnd-regf{flex:1 1 240px}
.cnd-glf{flex:1 1 220px}
.cnd-sel{width:100%;height:var(--v2-ctl);padding:0 30px 0 10px;border:1px solid var(--line);border-radius:var(--radius);background-color:var(--paper);font-family:var(--sans);font-size:14px;font-weight:600;color:var(--ink)}
.cnd-unit{flex:0 0 auto;align-self:stretch;margin:0;padding:0 24px 0 10px;border:0;border-left:1px solid var(--soft);border-radius:0 var(--radius) var(--radius) 0;background-color:transparent;font-family:var(--sans);font-size:13px;font-weight:650;color:var(--muted);cursor:pointer}
.cnd-unit:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.cnd-seg{display:flex;flex-wrap:nowrap}
.cnd-seg button{height:var(--v2-ctl);padding:0 14px;font-size:13px}
.cnd-btns{display:flex;gap:6px;margin-left:auto}
.cnd-help{margin:0;font-family:var(--sans);font-size:12px;line-height:1.55;color:var(--muted)}
.cnd-help:empty{display:none}

/* 부위 카드 = 고르는 버튼 */
.cnd-parts{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;padding:14px 18px;border-bottom:1px solid var(--soft)}
.cnd-parts:has(> :nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
.cnd-parts:has(> :nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.cnd-part{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0;padding:9px 10px 10px;border:1px solid var(--line);border-left:4px solid var(--soft);border-radius:var(--radius);background:var(--paper);text-align:left;cursor:pointer;transition:background 200ms,border-color 200ms}
.cnd-part:hover{background:var(--btn)}
.cnd-part[aria-pressed="true"]{background:var(--wash);border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.cnd-part.s-dry{border-left-color:var(--cnd-dry2)}
.cnd-part.s-wet{border-left-color:var(--cnd-wet2)}
.cnd-part.s-frost{border-left-color:var(--cnd-frost2)}
.cnd-part.s-mold{border-left-color:var(--cnd-mold2)}
.cnd-part.s-need{border-left-style:dashed}
.cnd-pn{font-family:var(--sans);font-size:12px;font-weight:650;color:var(--muted);line-height:1.3}
.cnd-pt{font-family:var(--sans);font-size:20px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.cnd-part small{font-family:var(--sans);font-size:11.5px;line-height:1.35;color:var(--muted)}
.cnd-part.is-ms .cnd-pn::after{content:" ●";color:var(--ink);font-size:9px;vertical-align:2px}
.cnd-chip{display:inline-block;padding:1px 7px;border-radius:var(--radius);background:var(--soft);font-family:var(--sans);font-size:11.5px;font-weight:700;color:var(--cnd-t);white-space:nowrap}
.cnd-chip:empty{display:none}
.s-dry > .cnd-chip,.cnd-chip.s-dry{background:var(--cnd-dry)}
.s-wet > .cnd-chip,.cnd-chip.s-wet{background:var(--cnd-wet)}
.s-frost > .cnd-chip,.cnd-chip.s-frost{background:var(--cnd-frost);box-shadow:inset 0 0 0 1px var(--cnd-frost2)}
.s-mold > .cnd-chip,.cnd-chip.s-mold{background:var(--cnd-mold)}
.s-need > .cnd-chip,.cnd-chip.s-need{background:transparent;color:var(--muted);box-shadow:inset 0 0 0 1px var(--line)}

/* 고른 부위 + 결로 지도 */
.cnd-low{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr)}
.cnd-det{display:flex;flex-direction:column;gap:9px;padding:16px 18px;min-width:0;border-right:1px solid var(--soft)}
.cnd-det-h{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.cnd-det-h b{font-family:var(--sans);font-size:16px;font-weight:750;color:var(--ink)}
.cnd-det-src{margin:0;font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--ink)}
.cnd-f{margin:0;font-size:12.5px;line-height:1.55;white-space:normal;overflow-x:visible;overflow-wrap:anywhere}
.cnd-f:empty,.cnd-det-src:empty{display:none}
.cnd-drows li{flex-wrap:wrap}
.cnd-drows li b{text-align:right;margin-left:auto}
.cnd-ms{max-width:260px}
.cnd-note{padding-top:2px}
.cnd-mapbox{display:flex;flex-direction:column;gap:6px;padding:14px 16px;min-width:0}
.cnd-map-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.cnd-hint{font-family:var(--sans);font-size:11.5px;color:var(--muted)}
.cnd-map{display:block;width:100%;height:auto;touch-action:manipulation}
.cnd-m-grid{stroke:var(--soft);stroke-width:1}
.cnd-m-tick{stroke:var(--line)}
.cnd-m-ax{font-family:var(--sans);font-size:11px;fill:var(--muted);font-variant-numeric:tabular-nums}
.cnd-m-c{fill:none;stroke:var(--muted);stroke-width:1.5;opacity:.6}
.cnd-m-alt{fill:none;stroke:var(--muted);stroke-width:1.2;stroke-dasharray:3 3;opacity:.5}
.cnd-m-area{fill:var(--cnd-water);opacity:.13}
.cnd-m-sel{fill:none;stroke:var(--cnd-water2);stroke-width:3;stroke-linejoin:round}
.cnd-m-mold{fill:none;stroke:var(--cnd-mold2);stroke-width:2;stroke-dasharray:6 4}
.cnd-m-now{stroke:var(--ink);stroke-width:1;stroke-dasharray:2 3;opacity:.45}
.cnd-m-pt{fill:var(--accent);stroke:var(--paper);stroke-width:2;transition:cx 300ms cubic-bezier(.22,1,.36,1),cy 300ms cubic-bezier(.22,1,.36,1)}
.cnd-m-lab{font-family:var(--sans);font-size:11.5px;font-weight:600;fill:var(--muted);paint-order:stroke;stroke:var(--card);stroke-width:3px;stroke-linejoin:round}
.cnd-m-lab.sel{fill:var(--ink);font-weight:750}
.cnd-m-lab.mold{fill:var(--cnd-mold2)}
.cnd-m-hit{fill:transparent;cursor:crosshair}
.cnd-legend{display:flex;flex-wrap:wrap;gap:4px 14px;margin:0;padding:0;list-style:none;font-family:var(--sans);font-size:11.5px;color:var(--muted)}
.cnd-legend i{display:inline-block;width:16px;height:0;margin-right:5px;vertical-align:3px;border-top:3px solid var(--cnd-water2)}
.cnd-legend .k-oth{border-top:1.5px solid var(--muted)}
.cnd-legend .k-mold{border-top:2px dashed var(--cnd-mold2)}
.cnd-legend .k-now{width:9px;height:9px;border:0;border-radius:50%;background:var(--accent);vertical-align:0}

/* 표 */
.cnd-tbl{padding:12px 18px 16px;border-top:1px solid var(--soft)}
.cnd-tbl summary{cursor:pointer;font-family:var(--sans);font-size:13px;font-weight:650;color:var(--ink)}
.cnd-tbl .cnd-help{margin:8px 0}
.cnd-tbl td small{display:block;font-size:11px;color:var(--muted)}
.cnd-tbl[hidden]{display:none}

@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cnd-m-lab.mold{fill:#d9b44a}:root:not([data-theme="light"]) .cnd-m-sel{stroke:#7fb2ea}}
:root[data-theme="dark"] .cnd-m-lab.mold{fill:#d9b44a}
:root[data-theme="dark"] .cnd-m-sel{stroke:#7fb2ea}

@container cnd (max-width:760px){
  .cnd-parts{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cnd-low{grid-template-columns:minmax(0,1fr)}
  .cnd-det{border-right:0;border-bottom:1px solid var(--soft)}
}
@container cnd (max-width:640px){
  .cnd-hero{grid-template-columns:minmax(0,1fr);grid-template-areas:"ans" "stage"}
  .cnd-ans{border-left:0;border-bottom:1px solid var(--soft)}
  .cnd-btns{margin-left:0}
}
@container cnd (max-width:520px){
  .cnd-air{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cnd-air:has(.cnd-orh[hidden]) > .v2-f:nth-child(3){grid-column:1 / -1}
}
@container cnd (max-width:430px){
  .cnd-parts,.cnd-parts:has(> :nth-child(3):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
  .cnd-in,.cnd-parts,.cnd-ans,.cnd-det{padding-left:14px;padding-right:14px}
  .cnd-big{font-size:38px}
}
