/* 수영 칼로리 계산기 전용 CSS (2026-10-09). 입력·결과·종목별 막대 sw-*. 공용 부품은 assets/v2.css */
.sw-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-bottom:1px solid var(--soft)}
.sw-set{display:flex;flex-direction:column;gap:12px;padding:16px 18px;min-width:0}
.sw-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 12px}
.sw-select{display:block;width:100%;max-width:100%;height:var(--v2-ctl,42px);padding:0 8px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:14px;font-weight:600}
.sw-select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sw-target{max-width:220px}
.sw-help{margin:0;font-family:var(--sans);font-size:12px;line-height:1.55;color:var(--muted)}
.sw-set .v2-status:empty{display:none}
.sw-head{padding:16px 18px;min-width:0;border-left:1px solid var(--soft)}
.sw-head>.v2-label{display:block;margin-bottom:6px}
.sw-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;margin-top:14px;padding-top:12px;border-top:1px solid var(--soft)}
.sw-grid b{display:block;margin-top:2px;font-family:var(--sans);font-size:18px;font-weight:750;color:var(--ink);font-variant-numeric:tabular-nums}
.sw-dist{margin:12px 0 0;font-family:var(--sans);font-size:12.5px;line-height:1.55;color:var(--muted)}
.sw-dist:empty{display:none}
.sw-box{padding:14px 18px 16px;min-width:0}
.sw-box>.v2-label{display:block;margin-bottom:8px}
/* 종목별 막대: 2열 격자, 값이 바뀌면 너비가 부드럽게 바뀜(R45 계산형). 막대를 누르면 그 종목으로 계산 */
.sw-bars{list-style:none;margin:0 0 8px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:4px 18px}
.sw-bars button{display:grid;grid-template-columns:minmax(0,118px) minmax(0,1fr) 46px;gap:8px;align-items:center;width:100%;padding:5px 6px;border:1px solid transparent;border-radius:var(--radius);background:none;font-family:var(--sans);font-size:12px;color:var(--ink);text-align:left;cursor:pointer}
.sw-bars button:hover{background:var(--btn)}
.sw-bars button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.sw-bars .nm{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-height:1.25} /* 이름이 길면 두 줄까지(잘려서 구별 못 하는 일 방지) */
.sw-bars .bar{height:10px;border-radius:5px;background:var(--soft);overflow:hidden}
.sw-bars .bar b{display:block;height:100%;background:var(--line);border-radius:5px;transition:width .45s var(--ease,ease)}
.sw-bars .v{text-align:right;font-variant-numeric:tabular-nums;color:var(--muted)}
.sw-bars li.is-on button{border-color:var(--accent);background:var(--accent-wash)}
.sw-bars li.is-on .bar b{background:var(--accent)}
.sw-bars li.is-on .nm,.sw-bars li.is-on .v{font-weight:750;color:var(--ink)}
@media (prefers-reduced-motion:reduce){ .sw-bars .bar b{transition:none} }
@media (max-width:720px){
  .sw-top{display:flex;flex-direction:column}
  .sw-head{order:-1;border-left:0;border-bottom:1px solid var(--soft)}
}
@media (max-width:480px){
  .sw-set,.sw-head,.sw-box{padding-left:12px;padding-right:12px}
  .sw-bars button{grid-template-columns:minmax(0,104px) minmax(0,1fr) 40px}
}
