/* 직접 만든 상단 영역 바 · 하단 탭 바 */
#areaBar { display: flex; gap: 6px; padding: 5px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface2); }
#areaBar button { min-width: 108px; padding: 9px 14px; border: 0; border-radius: 10px; background: transparent; color: var(--dim); font-weight: 850; font-size: 14px; }
#areaBar button.on { background: var(--acSoft); color: var(--ac); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ac) 34%, transparent); }

#tabBar { position: fixed; left: 12px; right: 12px; bottom: max(10px, env(safe-area-inset-bottom)); z-index: 50;
  display: flex; gap: 6px; padding: 6px; border: 1px solid var(--line); border-radius: 18px;
  background: color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter: blur(16px); box-shadow: 0 16px 40px rgba(0,0,0,.28); }
#tabBar[hidden] { display: none !important; }
#tabBar button { flex: 1; display: grid; justify-items: center; gap: 2px; padding: 9px 4px; border: 0; border-radius: 12px; background: transparent; color: var(--dim); font-size: 12px; font-weight: 850; }
#tabBar button i { font-style: normal; font-size: 17px; }
#tabBar button.on { background: var(--acSoft); color: var(--ac); }
body { padding-bottom: 96px; }
@media (min-width: 981px) {
  #tabBar { left: 50%; right: auto; transform: translateX(-50%); width: min(520px, 90%); }
}

/* 세트 비교 — 가로 스크롤 없는 3열 */
.cmp-wrap { border-top: 1px solid var(--line); }
.cmp-head, .cmp-row { display: grid; grid-template-columns: 34px minmax(0, 1fr) minmax(0, 1fr); gap: 8px; align-items: center; padding: 9px 13px; }
.cmp-head { color: var(--dim); font-size: 11px; font-weight: 900; letter-spacing: .03em; border-bottom: 1px solid var(--line); }
.cmp-head small { font-weight: 700; opacity: .8; }
.cmp-row { border-bottom: 1px solid color-mix(in srgb, var(--line) 70%, transparent); font-size: 14px; font-variant-numeric: tabular-nums; }
.cmp-row:last-child { border-bottom: 0; }
.cmp-no { color: var(--dim); font-weight: 800; }
.cmp-now { color: var(--tx); font-weight: 800; }
.cmp-prev { color: var(--dim); }
.cmp-row.changed .cmp-now { color: var(--ac); }