/* 청실홍실 화면 보정. 색은 tokens.css, 여기에는 배치와 글꼴만. */
body { font-family: var(--font-body); color: var(--c-ink); }
h1, h2, .start-title, .t-h1, .t-display, .t-h2, .mp-title, .v-h1, .compare-title, .report-title, .home-logo b, .q-title {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: -0.01em;
}
.num, .home-market__v, .vq-fig, .srow-v { font-family: var(--font-body); font-variant-numeric: tabular-nums; font-weight: 700; }
.home-market__src, .reg-ref__src, .reg-ref__src small, .mp-base, .mp-base small,
.mp-ref, .mp-src, .mp-count, .mp-count small, .mp-keynote, .mp-item__meta,
.v-small, .v-example-top, .v-count, .vendor-card__meta, .price-empty__d, .price-disclose, .v-ext2, .v-law,
.home-legal, .home-logo small, .q-desc, .q-eyebrow, .src, .vq-note, .legal,
.note, .d--muted, .gsub, .qs-kicker, .empty-state__d, .cl-when, .srow-v small, .trust-note, .srow-f,
.price-block__src, .v-ext2 small, .sec small, .total .d, .total .d--muted,
.tip, .softlist li, .meta > span:first-child, .v-cmeta, .v-compare__msg,
.v-head__meta, .mp-item__sub > span {
  font-size: 16px;
  line-height: 24px;
}
.tag, .badge, .status, .cat-tag { font-size: 14px; line-height: 20px; }
.tabbar { height: calc(var(--tabbar-h) + env(safe-area-inset-bottom)); background: var(--c-card); overflow: visible; }
.tabbar__btn { min-height: var(--tabbar-h); font: 600 13px/16px var(--font-body); color: var(--c-ink-3); position: relative; }
.tabbar__btn.is-on { color: var(--c-cheong); font-weight: 700; }
.tabbar__btn.is-on::before { content: ""; position: absolute; top: 6px; width: 22px; height: 4px; border-radius: 4px; background: var(--c-hong); }
.tabbar__btn--home::before { display: none; }
.tabbar__btn--home { justify-content: flex-end; padding-bottom: 8px; }
.tabbar__knob {
  position: absolute; top: -22px; left: 50%; width: var(--tab-center); height: var(--tab-center); margin-left: calc(var(--tab-center) / -2);
  border-radius: 50%; display: grid; place-items: center; background: var(--c-card); color: var(--c-cheong);
  border: 2px solid var(--c-cheong-line); box-shadow: var(--sh-2);
}
.tabbar__knob::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 1.5px dashed var(--c-hong-line); pointer-events: none; }
.tabbar__btn--home.is-on .tabbar__knob { background: var(--c-cheong); border-color: var(--c-cheong); color: var(--c-card); box-shadow: var(--sh-cta); }
.tabbar__btn--home .tabbar__ico, .tabbar__knob svg { width: 28px; height: 28px; }
.tabbar__btn { --icon-accent: transparent; }
.tabbar__btn.is-on { --icon-accent: var(--c-hong); }
#app.has-tabs .bottom-bar, #app.has-tabs[data-screen="map"] .mp { bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom)); }
.cta, .cta-line, .chip, .tabbar__btn, .icon-btn, .contrib-line__x, .banner-x, .more-row, .home-tile { min-height: 44px; }
button:not(.price-badge):not([data-price-badge]) { min-height: 44px; }
.price-badge, [data-price-badge] { min-height: 0; }
.cta { border-radius: 16px; box-shadow: var(--sh-cta); }
.cta-line, .cta--ghost { font-size: 16px; color: var(--c-cheong); border-color: var(--c-cheong-line); background: var(--c-card); }
.focus-banner, .banner {
  margin: 8px 0; padding: 0; display: flex; align-items: stretch; min-height: var(--banner-h);
  background: var(--c-actual-soft); border: 1px solid var(--c-actual-line); border-radius: 14px; box-shadow: none;
}
.contrib-line__go, .banner-main {
  flex: 1; min-width: 0; min-height: 48px; border: 0; background: transparent; text-align: left;
  padding: 0 8px 0 14px; font: 600 16px/24px var(--font-body); color: var(--c-ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.contrib-line__x, .banner-x {
  width: 44px; min-width: 44px; height: 46px; border: 0; border-left: 1px solid var(--c-actual-line);
  background: transparent; color: var(--c-ink-2); font: 600 20px/1 var(--font-body);
}
.home-hero, .card.invite { position: relative; }
.home-geese { position: absolute; right: 12px; top: 12px; width: 120px; height: auto; pointer-events: none; }
.home-logo { display: flex; flex-direction: row; align-items: center; gap: 10px; }
.home-logo > div { display: flex; flex-direction: column; min-width: 0; }
.home-logo small { display: block; font-family: var(--font-body); color: var(--c-ink-3); }
.home-logo img { width: 30px; height: 32px; flex: none; }
.content--start > .home-hero,
.content--start > .home-grid,
.content--start > .home-market,
.content--start > .home-report,
.content--start > .home-next,
.content--start > .focus-banner,
.content--start > .home-legal { margin-inline: 20px; }
.home-market, .home-report, .reg-ref { padding: 16px 18px; box-sizing: border-box; }
.home-report__btns { width: 100%; margin: 0; }
.home-market.price-rough, .mp-base.price-rough, .reg-ref.price-rough { background: var(--c-rough-soft); border: 1px solid var(--c-rough-line); }
.home-market__v, .mp-base .num, .mp-base b.num, .reg-ref .srow-v { color: var(--c-rough); }
.price-badge { position: relative; overflow: visible; height: var(--pd-h, 18px); }
.price-badge::before { content: ""; position: absolute; left: 50%; top: 50%; width: max(100%, 44px); height: 44px; transform: translate(-50%, -50%); }
.price-disclose, .cl-search, .cl-quote, .cl-stage__title, .v-fchip, .mp-search input, .reg-ref summary { min-height: 44px; display: inline-flex; align-items: center; }
.name-field label { display: flex; align-items: center; gap: 8px; min-height: 44px; }
.lab-rough {
  display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 999px;
  background: var(--c-rough-soft); color: var(--c-rough); font: 700 14px/20px var(--font-body); border: 1px solid var(--c-rough-line);
}
.reg-ref { background: var(--c-rough-soft); border: 1px solid var(--c-rough-line); box-shadow: none; }
.srows { display: flex; flex-direction: column; margin: 8px 0; }
.srow + .srow { border-top: 1px dashed var(--c-line); padding-top: 12px; margin-top: 12px; }
.srow-h { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.srow-n { font-weight: 600; }
.srow-v { font-size: 20px; line-height: 26px; color: var(--c-rough); white-space: nowrap; }
.srow-v small { font-size: 16px; line-height: 24px; font-weight: 600; color: var(--c-rough); }
.srow-f { display: flex; justify-content: space-between; gap: 8px; font-size: 16px; line-height: 24px; color: var(--c-ink-2); }
.rbar { position: relative; height: 16px; margin: 6px 0; }
.rbar::before { content: ""; position: absolute; left: 0; right: 0; top: 6px; height: 4px; border-radius: 4px; background: repeating-linear-gradient(90deg, var(--c-rough-line) 0 6px, transparent 6px 9px); }
.rbar .band { position: absolute; top: 3px; height: 10px; border-radius: 6px; background: var(--c-card); border: 1.5px solid var(--c-rough); }
.rbar .tick { position: absolute; top: 0; width: 4px; height: 16px; margin-left: -2px; border-radius: 2px; background: var(--c-ink); }
.vq.price-actual { border-left: 5px solid var(--c-actual); padding-left: 12px; }
.vq-fig, .vq-fig .num { color: var(--c-actual); }
.vq-bar > span { background: var(--c-actual); }
.card { background: var(--c-card); border-color: var(--c-line); }
.home-tile { background: var(--c-card); border: 1px solid var(--c-line); border-radius: 18px; }
.empty-state__icon img { width: 72px; height: auto; }
