/* 단위 변환기 전용 CSS (2026-10-07). 2패널 계산형(퍼센트계산기와 같은 골격) + 아래 '모든 단위' 목록. 공용 부품은 assets/v2.css */
.uc-cats{padding:14px 18px 12px;border-bottom:1px solid var(--soft)}
.uc-cats .v2-seg{flex-wrap:wrap}
.uc-cats .v2-seg button{height:32px;padding:0 11px;font-family:var(--sans);font-size:12.5px;font-weight:700}
.uc-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.uc-in{padding:16px 18px 18px;min-width:0}
.uc-fields{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.uc-select{display:block;width:100%;max-width:100%;height:var(--v2-ctl,42px);margin-top:6px;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;text-overflow:ellipsis}
.uc-select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.uc-help{margin:12px 0 0;font-family:var(--sans);font-size:12.5px;line-height:1.6;color:var(--muted)}
.uc-acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:14px}
.uc-out{padding:16px 18px 18px;min-width:0;border-left:1px solid var(--soft);display:flex;flex-direction:column;container:ucout / inline-size}
.uc-out .v2-formula{white-space:normal;overflow-wrap:anywhere;line-height:1.6}
.uc-out .v2-label{display:block;margin-bottom:6px;font-variant-numeric:tabular-nums}
.uc-out .v2-big{flex-wrap:wrap}
.uc-out .v2-big:not(.is-empty) span{white-space:nowrap;font-size:clamp(20px, calc(100cqi / (var(--uc-len, 6) * .62)), 1em)} /* 자릿수 중간에서 줄바꿈하지 않도록 글자 수로 크기를 줄인다(1181px 4.166666667) */
.uc-rows{margin-top:14px;flex:1}
.uc-rows li b{white-space:normal;text-align:right}
.uc-foot{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid var(--soft)}
.uc-foot .v2-status{margin-left:auto}
.v2-big.is-empty span{font-size:18px;font-weight:600;color:var(--muted)}
.uc-allbox{padding:14px 18px 18px;border-top:1px solid var(--soft);container:ucall / inline-size}
.uc-allhead{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0 0 8px}
.uc-allhint{font-family:var(--sans);font-size:12px;color:var(--muted)}
.uc-all{list-style:none;margin:0;padding:0;columns:2;column-gap:18px}
.uc-all li{break-inside:avoid}
.uc-all button{display:flex;width:100%;justify-content:space-between;align-items:baseline;gap:10px;min-height:36px;padding:7px 8px;border:0;border-bottom:1px solid var(--soft);border-left:2px solid transparent;background:none;color:var(--ink);font-family:var(--sans);font-size:13px;text-align:left;cursor:pointer}
.uc-all button span{min-width:0;color:var(--muted)}
.uc-all button span i{font-style:normal;font-size:11px;font-weight:700;color:var(--muted);margin-left:4px}
.uc-all button b{font-weight:700;font-variant-numeric:tabular-nums;text-align:right;overflow-wrap:anywhere}
.uc-all button b small{font-weight:600;color:var(--muted);white-space:nowrap}
.uc-all button:hover{background:var(--wash)}
.uc-all button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.uc-all button[aria-pressed="true"]{border-left-color:var(--accent);background:var(--wash)}
.uc-all button[aria-pressed="true"] span{color:var(--ink);font-weight:700}
@media (max-width:720px){
  .uc-grid{grid-template-columns:minmax(0,1fr)}
  .uc-out{order:-1;border-left:0;border-bottom:1px solid var(--soft)}
}
@media (max-width:420px){
  .uc-cats,.uc-in,.uc-out,.uc-allbox{padding-left:12px;padding-right:12px}
}
@container ucall (max-width:620px){ .uc-all{columns:1} } /* 두 열이면 한 열이 300px 아래로 줄어 es·id 단위 이름과 기호가 줄바뀜한다(1181px 화면) */
