:root {
  --bg: #f5f7fa; --card: #fff; --raised: #eceff4; --line: rgba(17,24,39,.09);
  --tx: #111827; --tx2: #4b5565; --mu: #6b7487;
  --ink: #111827; --ink-tx: #fff;
  --ac: #c2410c; --ac-tx: #fff; --ac-soft: #fdf1ea;
  --ok: #15803d; --ok-soft: #e8f5ec; --bad: #c2352b; --bad-soft: #fdecea;
  --info: #1d4ed8; --info-soft: #e8f0ff; --warn: #a16207; --warn-soft: #fbf3dd;
  --radius: 16px;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b0d14; --card: #11141c; --raised: #1a1e28; --line: rgba(238,240,245,.09);
    --tx: #eef0f5; --tx2: #a3a9b8; --mu: #8b93a7;
    --ink: #eef0f5; --ink-tx: #0b0d14;
    --ac: #fb923c; --ac-tx: #1a0d03; --ac-soft: #2a1a10;
    --ok: #4cc38a; --ok-soft: #12291e; --bad: #f2777a; --bad-soft: #321a1b;
    --info: #8db1ff; --info-soft: #17213a; --warn: #e3b341; --warn-soft: #2d2410;
  }
}
* { box-sizing: border-box; min-width: 0; }
body { margin: 0; background: var(--bg); color: var(--tx); font: 400 15px/1.55 "Wanted Sans Variable", "Wanted Sans", Pretendard, -apple-system, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; -webkit-text-size-adjust: 100%; }
a { color: var(--info); }
b, strong { font-weight: 600; }
.top { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 8px;
  height: 56px; padding: 0 20px; background: var(--bg); border-bottom: 1px solid var(--line); }
.logo { font-size: 17px; font-weight: 600; color: var(--tx); text-decoration: none; white-space: nowrap; }
.logo b { color: var(--ac); font-weight: 600; }
#nav { display: flex; gap: 4px; align-items: center; }
#nav a, #nav button { font-size: 14px; min-height: 36px; padding: 0 12px; border: 0; background: none; color: var(--tx2); border-radius: 8px; text-decoration: none; font-family: inherit; cursor: pointer; display: inline-flex; align-items: center; }
#nav a:hover, #nav button:hover { background: var(--raised); }
#nav a.primary { background: var(--ink); color: var(--ink-tx); font-weight: 500; }
main { max-width: 1040px; margin: 0 auto; padding: 8px 20px 96px; }
.foot { max-width: 1040px; margin: 24px auto 96px; padding: 0 20px; color: var(--mu); font-size: 12px; line-height: 18px; }
h1 { font-size: 24px; line-height: 32px; font-weight: 600; margin: 20px 0 12px; }
h2 { font-size: 17px; line-height: 24px; font-weight: 600; margin: 0 0 12px; }
h3 { font-weight: 600; }
.muted { color: var(--mu); }
.small { font-size: 13px; line-height: 20px; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; margin: 12px 0; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 16px;
  border-radius: 12px; border: 1px solid var(--line); background: var(--card); color: var(--tx); font: inherit; font-weight: 500; cursor: pointer; text-decoration: none; }
.btn.primary { background: var(--ink); border-color: var(--ink); color: var(--ink-tx); }
.btn.soft { background: var(--raised); border-color: transparent; color: var(--tx); }
.btn.danger { color: var(--bad); }
.btn.block { width: 100%; min-height: 48px; }
.btn:disabled { opacity: .5; cursor: default; }
.btn.big { min-height: 48px; padding: 0 24px; font-size: 15px; }
.btn.ghost { background: var(--card); }
.filters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
@media (max-width: 600px) { .filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
label { display: block; font-size: 13px; color: var(--mu); }
input, select, textarea { width: 100%; margin-top: 4px; min-height: 44px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px;
  background: var(--card); color: var(--tx); font: inherit; font-size: 15px; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--ink); outline-offset: -1px; }
textarea { min-height: 96px; resize: vertical; }
.form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
.form .full { grid-column: 1 / -1; }
@media (max-width: 520px) { .form { grid-template-columns: 1fr; } }
.check { display: flex; gap: 12px; align-items: flex-start; color: var(--tx); font-size: 15px; margin: 8px 0; }
.check input { width: 20px; min-height: 0; height: 20px; margin-top: 2px; accent-color: var(--ink); flex: none; }
.consent { background: var(--raised); border-radius: 12px; padding: 12px 16px; font-size: 13px; color: var(--tx2); }
.consent ul { margin: 6px 0 0; padding-left: 18px; }
.err { color: var(--bad); font-size: 14px; min-height: 1em; margin: 8px 0 0; }
.tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.tag { display: inline-flex; align-items: center; min-height: 24px; padding: 0 8px; border-radius: 6px; background: var(--raised); color: var(--tx2); font-size: 12px; line-height: 16px; }
.tag.good { background: var(--ok-soft); color: var(--ok); }
.tag.hot { background: var(--ac-soft); color: var(--ac); }
.tag.off { background: var(--bad-soft); color: var(--bad); }
.price { font-weight: 600; color: var(--tx); white-space: nowrap; font-variant-numeric: tabular-nums; }
.spec { display: grid; grid-template-columns: 96px 1fr; gap: 8px 12px; margin: 16px 0 0; }
.spec dt { color: var(--mu); font-size: 14px; }
.spec dd { margin: 0; }
.row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.space { justify-content: space-between; }
.notice { background: var(--info-soft); color: var(--info); border-radius: 12px; padding: 12px 16px; font-size: 14px; margin: 12px 0; }
.notice.warn { background: var(--warn-soft); color: var(--warn); }
.thread { display: flex; flex-direction: column; gap: 8px; margin: 12px 0; }
.bubble { max-width: 80%; padding: 8px 12px; border-radius: 16px; background: var(--raised); white-space: pre-wrap; overflow-wrap: anywhere; }
.bubble.mine { align-self: flex-end; background: var(--ink); color: var(--ink-tx); }
.bubble time { display: block; font-size: 11px; opacity: .7; margin-top: 2px; }
.empty { text-align: center; color: var(--mu); padding: 32px 0; }
.phone { font-size: 18px; font-weight: 600; }
.lbl { font-size: 13px; color: var(--mu); margin: 0 0 8px; }
.choice { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.choice:last-child { border-bottom: 0; }
.choice > span { font-size: 14px; }
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; flex-shrink: 0; background: var(--card); }
.seg label { display: block; margin: 0; padding: 0; color: var(--tx); font-size: 13px; cursor: pointer; }
.seg input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; min-height: 0; }
.seg label:has(input) { padding: 8px 12px; border-left: 1px solid var(--line); }
.seg label:first-child { border-left: 0; }
.seg label:has(input:checked) { background: var(--ink); color: var(--ink-tx); }
.seg label:has(input:focus-visible) { outline: 2px solid var(--info); outline-offset: -2px; }
.neg { color: var(--bad); }

/* 첫 화면 */
.hero3 { padding: 24px 0 4px; }
.hero3 h1 { font-size: 28px; line-height: 38px; margin: 0 0 8px; }
.hero3 p { color: var(--tx2); margin: 0; font-size: 15px; line-height: 22px; }
.hero3 .row { margin-top: 20px; }
.searchbar { display: flex; gap: 8px; margin: 20px 0 8px; }
.searchbar input { margin: 0; flex: 1; min-height: 52px; }
.searchbar button { min-height: 52px; }
.qchips { display: flex; gap: 8px; overflow-x: auto; padding: 4px 0; scrollbar-width: none; }
.qchips::-webkit-scrollbar { display: none; }
.qchip { flex: none; display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 18px; background: var(--card);
  border: 1px solid var(--line); font-size: 14px; color: var(--tx2); text-decoration: none; }
.qchip:hover { border-color: var(--ink); }
.qchip.on { background: var(--ink); color: var(--ink-tx); border-color: var(--ink); }
.stats { display: flex; gap: 20px; margin: 16px 0 0; color: var(--mu); font-size: 13px; }
.stats b { color: var(--tx); font-weight: 600; font-variant-numeric: tabular-nums; margin-right: 4px; }
.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 8px 0 24px; }
.steps div { padding: 0; }
.steps i { font-style: normal; font: 500 12px/16px inherit; color: var(--mu); }
.steps h3 { font-size: 14px; margin: 4px 0; }
.steps p { font-size: 13px; line-height: 18px; color: var(--tx2); margin: 0; }
.sect { display: flex; align-items: baseline; justify-content: space-between; margin: 32px 0 12px; }
.sect h2 { margin: 0; }
.list-title { font-size: 17px; margin: 0; }
@media (max-width: 640px) {
  .steps { grid-template-columns: 1fr; gap: 12px; }
  .hero3 h1 { font-size: 24px; line-height: 34px; }
}

/* 요청 카드 */
.wish { display: block; color: inherit; text-decoration: none; transition: border-color .15s; }
.wish:hover { border-color: var(--ink); }
.wish-top { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.wish h3 { font-size: 16px; line-height: 24px; margin: 0; font-weight: 500; }
.wish .wprice { font-size: 22px; line-height: 28px; font-weight: 600; margin-top: 8px; font-variant-numeric: tabular-nums; }
.wish .wprice small { font-size: 14px; font-weight: 500; color: var(--tx2); margin-left: 2px; }
.wish .wfoot { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; color: var(--mu); margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.wish .wfoot b { color: var(--tx); font-weight: 500; }
.wish .wfoot .hot { color: var(--ac); font-weight: 500; }
#list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 12px; }
@media (max-width: 720px) { #list { grid-template-columns: 1fr; } }
#list > .empty { grid-column: 1 / -1; }

/* 하단 탭 바 */
.tabbar { display: none; }
@media (max-width: 720px) {
  #nav { display: none; }
  .tabbar { display: grid; grid-template-columns: repeat(4, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 6; height: 64px;
    background: var(--card); border-top: 1px solid var(--line); padding-bottom: env(safe-area-inset-bottom); }
  .tabbar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-size: 12px; color: var(--mu); text-decoration: none; }
  .tabbar a.on { color: var(--tx); font-weight: 500; }
  .tabbar svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
}

/* 유튜브 매물 */
.chip-btn { border: 1px solid var(--line); background: var(--card); color: var(--tx); border-radius: 18px; min-height: 36px; padding: 0 14px; font: inherit; font-size: 14px; cursor: pointer; }
.chip-btn.on { background: var(--ink); border-color: var(--ink); color: var(--ink-tx); }
.vfilter .lbl { margin-bottom: 8px; }
.vgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 12px 0; }
@media (max-width: 560px) { .vgrid { grid-template-columns: 1fr; } }
html.pc .vgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vcard { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; }
.vthumb { position: relative; display: block; aspect-ratio: 16 / 9; background: #000; }
.vthumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vnothumb { display: flex; align-items: center; justify-content: center; height: 100%; color: #fff; }
.vplay { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: rgba(0,0,0,.65); color: #fff; border-radius: 999px; padding: 8px 16px; font-size: 18px; }
.vplay.small { font-size: 13px; }
.vframe { aspect-ratio: 16 / 9; }
.vframe iframe { width: 100%; height: 100%; border: 0; display: block; }
.vbody { padding: 12px 16px 16px; }
.vtitle { font-size: 14px; margin: 0 0 8px; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.danger-link { color: var(--bad); margin-left: 12px; }
.small-btn { min-height: 36px; padding: 0 12px; font-size: 13px; }
.policy h2 { font-size: 15px; margin: 20px 0 8px; }
.policy p { margin: 0; font-size: 14px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chipbox { position: relative; margin: 0; cursor: pointer; }
.chipbox input { position: absolute; opacity: 0; width: 1px; height: 1px; min-height: 0; }
.chipbox span { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border: 1px solid var(--line); border-radius: 18px; font-size: 14px; color: var(--tx); background: var(--card); }
.chipbox input:checked + span { background: var(--ink); border-color: var(--ink); color: var(--ink-tx); }
.chipbox input:focus-visible + span { outline: 2px solid var(--info); outline-offset: 2px; }

/* 요청서 단계 */
fieldset.step { border: 0; margin: 0; padding: 0; min-width: 0; }
fieldset.step[hidden] { display: none; }
.stepper { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; margin: 0 0 24px; }
.step-tab { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 0; border: 0; background: none; color: var(--mu);
  font: inherit; font-size: 12px; cursor: pointer; text-align: left; line-height: 1.3; }
.step-tab::before { content: ''; display: block; width: 100%; height: 3px; border-radius: 2px; background: var(--raised); }
.step-tab i { font-style: normal; font-weight: 500; display: none; }
.step-tab.on { color: var(--tx); font-weight: 500; }
.step-tab.on::before { background: var(--ink); }
.step-nav { margin: 24px 0 8px; }
.cost { background: var(--raised); border-radius: 16px; padding: 16px; margin-top: 16px; }
.cost table { width: 100%; border-collapse: collapse; font-size: 13px; margin: 8px 0; }
.cost td { padding: 4px 0; border-bottom: 1px solid var(--line); }
.cost td:last-child { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.card.cost { background: var(--card); }
.more-filter { margin: 4px 0 12px; }
.more-filter > summary { cursor: pointer; color: var(--tx2); font-size: 14px; padding: 8px 0; }

/* 판매 제안서 */
.prop { border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; margin: 12px 0; background: var(--card); }
.prop.best { border-color: var(--ink); }
.prop .plabel { font-size: 12px; font-weight: 500; margin-bottom: 4px; color: var(--mu); }
.prop .plabel.ok { color: var(--ok); }
.prop .plabel.near { color: var(--warn); }
.prop .plabel.bad { color: var(--bad); }
.prop .pcar { font-size: 16px; font-weight: 500; margin: 4px 0 2px; }
.prop .ptotal { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; margin-top: 12px; }
.prop .ptotal .big { font-size: 22px; line-height: 28px; font-weight: 600; font-variant-numeric: tabular-nums; }
.prop .ptotal .big small { font-size: 14px; font-weight: 500; color: var(--tx2); margin-left: 2px; }
.prop .ptotal .side { text-align: right; font-variant-numeric: tabular-nums; }
.money2 { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 8px 0; font-size: 14px; }
.money2 b { font-weight: 600; }
.cmp-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
table.cmp { width: 100%; border-collapse: collapse; font-size: 13px; }
table.cmp th { text-align: left; color: var(--mu); font-weight: 500; padding: 8px 4px; border-bottom: 1px solid var(--line); }
table.cmp td { padding: 8px 4px; border-bottom: 1px solid var(--line); vertical-align: top; }
table.cmp td:first-child { color: var(--mu); width: 30%; }
table.cmp .mark { display: inline-block; width: 1.2em; font-weight: 600; }
table.cmp tr.st-ok .mark { color: var(--ok); }
table.cmp tr.st-near .mark, table.cmp tr.st-near td:last-child { color: var(--warn); }
table.cmp tr.st-bad .mark, table.cmp tr.st-bad td:last-child { color: var(--bad); }
table.cmp tr.st-info td { color: var(--mu); }
.dealer-card .phone { font-size: 18px; }
.safe { border-color: var(--warn); }
.safe ul { margin: 0; padding-left: 18px; font-size: 14px; }
.safe li { margin: 4px 0; }
.confirm-box { background: var(--raised); border-radius: 12px; padding: 8px 16px; margin: 16px 0; }
.view-switch { text-align: center; margin-top: 16px; }
.view-switch a { color: var(--mu); font-size: 12px; }

/* PC 버전 */
html.pc main, html.pc .foot { max-width: 1080px; }
html.pc .filters { grid-template-columns: repeat(4, minmax(0, 1fr)); }
html.pc .form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
html.pc #list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
html.pc .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
html.pc #nav { display: flex; }
html.pc .tabbar { display: none; }

/* ---- 시각 자료(차 일러스트) ---- */
:root { --tile: #e9e6df; --tile-2: #f1eee8; }
@media (prefers-color-scheme: dark) { :root { --tile: #1a1e28; --tile-2: #151922; } }
.display { font-weight: 800; font-size: 22px; line-height: 30px; letter-spacing: -0.3px; }
.carsvg { display: block; width: 100%; height: auto; }
.hero4 { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: center; margin: 12px 0 0; padding: 40px 32px;
  border-radius: 28px; background: #111827; color: #fff; position: relative; overflow: hidden; }
.hero4 h1 { font-size: 40px; line-height: 50px; font-weight: 800; letter-spacing: -0.8px; margin: 0 0 12px; color: #fff; }
.hero4 p { color: #b9c0cf; margin: 0; font-size: 16px; line-height: 24px; }
.hero4 .searchbar { margin: 24px 0 12px; }
.hero4 .searchbar input { background: #fff; color: #111827; border: 0; border-radius: 14px; }
.hero4 .btn.acc { background: #f0792a; border-color: #f0792a; color: #1a0d03; font-weight: 600; border-radius: 14px; }
.hero4 .btn.primary { background: #fff; border-color: #fff; color: #111827; }
.hero4 .btn.ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.3); }
.hero4 .notice { background: rgba(255,255,255,.1); color: #fff; }
.hero4-car { position: relative; padding: 24px 0 8px; }
.hero4-car .carsvg { filter: drop-shadow(0 12px 18px rgba(0,0,0,.35)); transform: scale(1.12); transform-origin: 60% 70%; }
.hero4-car::before { content: ''; position: absolute; left: 6%; right: 2%; top: 4%; bottom: 0; border-radius: 50%; background: #1f2a44; z-index: 0; }
.hero4-car .carsvg { position: relative; z-index: 1; }
.float { position: absolute; z-index: 2; background: #fff; color: #111827; border-radius: 12px; padding: 8px 12px; font-size: 12px; line-height: 16px; box-shadow: 0 8px 20px rgba(0,0,0,.25); display: flex; flex-direction: column; }
.float b { font-weight: 700; font-size: 13px; }
.float span { color: #4b5565; }
.float.f1 { left: 0; top: 0; }
.float.f2 { right: 0; bottom: 4px; background: #15803d; color: #fff; }
.float.f2 span { color: #fff; font-weight: 600; }
.hero3 { display: none; }
.stats { margin: 16px 4px 0; }
.tiles { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.tile { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 8px; padding: 16px 8px 12px; border-radius: 20px; background: var(--tile);
  color: var(--tx); text-decoration: none; transition: transform .15s; }
.tile:hover { transform: translateY(-2px); }
.tile b { font-weight: 600; font-size: 14px; }
.tile .carsvg { width: 100%; }
.tiles.budget { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.num-tile { align-items: flex-start; justify-content: space-between; min-height: 96px; padding: 16px; }
.num-tile strong { font-size: 20px; line-height: 26px; font-weight: 800; font-variant-numeric: tabular-nums; letter-spacing: -0.3px; }
.num-tile span { font-size: 13px; color: var(--tx2); }
.steps { margin-top: 0; }
.steps div { background: var(--tile-2); border-radius: 20px; padding: 20px; }
.steps i { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 50%; background: var(--ink); color: var(--ink-tx); font-size: 13px; font-weight: 600; }
.steps h3 { font-size: 16px; margin: 12px 0 4px; }
/* 요청 카드 */
.whead { display: flex; gap: 16px; align-items: center; }
.wtile { flex: none; width: 104px; padding: 12px 8px 8px; border-radius: 14px; background: var(--tile); }
.wmain { flex: 1; min-width: 0; }
.wish .wprice { margin-top: 4px; }
@media (max-width: 900px) {
  .tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tiles.budget { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .hero4 { grid-template-columns: 1fr; padding: 28px 20px 12px; border-radius: 24px; gap: 8px; }
  .hero4 h1 { font-size: 32px; line-height: 42px; }
  .hero4-car { order: -1; margin-bottom: -8px; padding: 8px 0 0; }
  .hero4-car .carsvg { transform: scale(1); }
  .float.f1 { left: 0; top: 4px; }
  .tiles { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; margin: 0 -20px; padding: 0 20px 4px; scrollbar-width: none; }
  .tiles::-webkit-scrollbar { display: none; }
  .tiles .tile { flex: none; width: 148px; scroll-snap-align: start; }
  .tiles.budget { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; padding: 0; overflow: visible; }
  .tiles.budget .tile { width: auto; }
}

/* 모델 검색: 연식별 */
.wrapchips { flex-wrap: wrap; overflow: visible; }
.yr { padding: 16px 20px; }
.yr-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.y { font-size: 24px; line-height: 32px; font-weight: 800; font-variant-numeric: tabular-nums; letter-spacing: -.3px; }
.y small { font-size: 14px; font-weight: 500; color: var(--tx2); margin-left: 2px; }
.yr-stats { display: flex; gap: 16px; font-size: 13px; color: var(--mu); }
.yr-stats b { color: var(--tx); font-weight: 600; margin-left: 2px; font-variant-numeric: tabular-nums; }
.yr-price { margin: 8px 0 0; font-size: 14px; color: var(--tx2); }
.yr-price b { color: var(--tx); font-weight: 600; font-variant-numeric: tabular-nums; }
.yr-req { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 8px; }
.yr-req summary { cursor: pointer; font-size: 14px; color: var(--tx2); padding: 4px 0; }
.yr-link { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); color: var(--tx); text-decoration: none; font-size: 14px; }
.yr-link:last-child { border-bottom: 0; }
.yrow.zero { display: flex; align-items: baseline; gap: 16px; padding: 8px 20px; margin: 0; }
.yrow.zero .y { font-size: 16px; font-weight: 600; color: var(--tx2); min-width: 64px; }
.yrow.zero a { margin-left: auto; color: var(--tx2); }
.searchbar input { background: var(--card); }

/* 세대 구간 */
.gen { background: var(--card); border: 1px solid var(--line); border-radius: 20px; padding: 20px; margin: 12px 0; }
.gen-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.gen-name { font-size: 20px; line-height: 28px; font-weight: 800; letter-spacing: -.3px; margin: 0; }
.gen-years { margin-top: 4px; }
.gen-years > summary { cursor: pointer; font-size: 14px; color: var(--tx2); padding: 8px 0; }
.grow { padding: 12px 0; border-top: 1px solid var(--line); }
.grow-top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.grow-top > b { font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; }
.grow.zero { display: flex; align-items: baseline; gap: 16px; padding: 8px 0; }
.grow.zero b { font-size: 15px; font-weight: 500; color: var(--tx2); min-width: 72px; }
.grow.zero a { margin-left: auto; color: var(--tx2); }

/* 제조사·인기 모델 */
.kind { margin: 16px 0 8px; font-size: 13px; font-weight: 600; color: var(--mu); }
.brandgrid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.btile { display: flex; flex-direction: column; gap: 4px; padding: 16px; border-radius: 16px; background: var(--tile); color: var(--tx); text-decoration: none; transition: transform .15s; }
.btile:hover { transform: translateY(-2px); }
.btile b { font-size: 17px; font-weight: 700; letter-spacing: -.2px; }
.btile span { font-size: 12px; color: var(--tx2); }
.mrow { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--line); color: var(--tx); text-decoration: none; flex-wrap: wrap; }
.mrow:last-child { border-bottom: 0; }
.mrow > div { display: flex; flex-direction: column; min-width: 0; }
.mrow b { font-size: 17px; font-weight: 600; }
@media (max-width: 900px) { .brandgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 520px) { .brandgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* 차 고르기 */
.picker { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 720px) { .picker { grid-template-columns: 1fr; } }
.picker label { font-size: 12px; }
.picker select:disabled { opacity: .55; }
.pickcard { margin: 24px 0 12px; padding: 16px; border-radius: 20px; background: #fff; display: grid; gap: 12px; }
.pickcard label { color: #4b5565; }
.pickcard select { background: #f5f7fa; color: #111827; border-color: rgba(17,24,39,.12); }
.pickcard .picker { grid-template-columns: 1fr; gap: 8px; }
.pickcard .picker select { margin-top: 2px; }
@media (min-width: 721px) { .pickcard .picker { grid-template-columns: 1fr 1fr 1.4fr; } }
.hero-sub { margin: 0; font-size: 14px; color: #b9c0cf; }
.hero-sub a { color: #fff; }
.tiles.budget { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 900px) { .tiles.budget { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* 한 단계씩 고르기 */
.wz { display: grid; gap: 10px; text-align: left; }
.wz-done { display: grid; gap: 6px; }
.wz-ans { display: flex; align-items: baseline; gap: 10px; width: 100%; padding: 12px 14px; border: 0; border-radius: 12px; background: #f5f7fa; color: #111827; font: inherit; cursor: pointer; text-align: left; }
.wz-ans span { font-size: 12px; color: #6b7280; min-width: 64px; }
.wz-ans b { font-size: 15px; font-weight: 700; flex: 1; }
.wz-ans em { font-style: normal; font-size: 12px; color: #c2410c; }
.wz-cur.in { animation: wzin .28s ease-out; }
@keyframes wzin { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.wz-q { margin: 4px 0 10px; font-size: 19px; line-height: 26px; font-weight: 800; letter-spacing: -.3px; color: var(--tx); }
.wz-grp { margin: 10px 0 6px; font-size: 12px; color: #6b7280; }
.wz-opts { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 8px; }
.wz-list { display: grid; gap: 8px; }
.wz-opt { padding: 13px 10px; border: 1px solid rgba(17,24,39,.12); border-radius: 12px; background: #fff; color: #111827; font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; transition: background .12s, border-color .12s; }
.wz-opt:hover, .wz-opt:active { background: #fff4ec; border-color: #c2410c; }
.wz-opt.ghost { color: #6b7280; font-weight: 500; background: #f5f7fa; }
.wz-opt.row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; text-align: left; padding: 14px 16px; }
.wz-opt small { font-size: 12px; font-weight: 400; color: #6b7280; }
.wz-note { margin: 0; font-size: 13px; color: #6b7280; }
.pickcard .wz-q { color: #111827; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .wz:not(.pickcard .wz) .wz-ans { background: var(--tile); color: var(--tx); } }
.wz-cur { transition: opacity .16s ease, transform .16s ease; }
.wz-cur.out { opacity: 0; transform: translateX(-14px); }
.wz-cur.in { animation: wzin .34s cubic-bezier(.22,.8,.3,1); }
@keyframes wzin { from { opacity: 0; transform: translateX(22px); } to { opacity: 1; transform: none; } }
.wz-ans.new { animation: wzans .34s cubic-bezier(.22,.8,.3,1); }
@keyframes wzans { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.wz-opt { transition: background .15s, border-color .15s, transform .12s; }
.wz-opt:active { transform: scale(.97); }
@media (prefers-reduced-motion: reduce) { .wz-cur, .wz-cur.in, .wz-ans.new { animation: none; transition: none; } }

/* 홈: 세 갈래 시작 + 구매 희망서 */
.entry { padding: 28px 0 8px; }
.entry h1 { margin: 0 0 6px; font-size: 28px; line-height: 36px; letter-spacing: -.5px; }
.entry > p { margin: 0 0 18px; color: var(--tx2); }
.entry-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.entry-card { display: flex; flex-direction: column; gap: 4px; padding: 16px 14px; border-radius: 18px; background: var(--card); border: 1px solid var(--line); color: var(--tx); text-decoration: none; transition: transform .25s cubic-bezier(.22,.8,.3,1), box-shadow .25s, border-color .25s; }
.entry-card:hover { transform: translateY(-3px); border-color: #c2410c; box-shadow: 0 10px 24px -14px rgba(194,65,12,.45); }
.entry-card:active { transform: scale(.98); }
.entry-card i { width: 40px; height: 40px; border-radius: 12px; background: #fff4ec; display: grid; place-items: center; margin-bottom: 8px; }
.entry-card i svg { width: 22px; height: 22px; fill: none; stroke: #c2410c; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.entry-card b { font-size: 16px; font-weight: 800; letter-spacing: -.3px; }
.entry-card span { font-size: 12px; color: var(--tx2); }
@media (max-width: 420px) { .entry-card { padding: 14px 10px; } .entry-card b { font-size: 14px; } }
.filter-fold { margin: 6px 0 12px; }
.filter-fold > summary { cursor: pointer; font-size: 14px; color: var(--tx2); padding: 8px 2px; }

/* 화면 전환: 포근하게 */
#app { transition: opacity .26s ease, transform .26s ease; }
#app.leaving { opacity: 0; transform: translateY(-10px); }
#app.page-in { animation: pagein .5s cubic-bezier(.22,.8,.3,1); }
@keyframes pagein { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { #app, #app.page-in { animation: none; transition: none; } }

/* 요청서: 차를 다 고르기 전에는 질문 하나만 보인다 */
#wf:not(.open) .stepper, #wf:not(.open) .gate, #wf:not(.open) .step-nav, #wf:not(.open) .notice, #wf:not(.open) .err, #wf:not(.open) button[type="submit"] { display: none; }
#wf.manual .wz { display: none; }
#wf.revealing .stepper, #wf.revealing .gate, #wf.revealing .step-nav, #wf.revealing .notice, #wf.revealing button[type="submit"] { animation: reveal .6s cubic-bezier(.22,.8,.3,1) .25s both; }
@keyframes reveal { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
.wz-opts.types { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
.wz-opt.type { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 8px; }
.wz-opt.type svg { width: 100%; max-width: 96px; height: auto; }
/* 고르기 전환을 더 느긋하게 */
.wz-cur { transition: opacity .2s ease, transform .2s ease; }
.wz-cur.in { animation: wzin .5s cubic-bezier(.22,.8,.3,1); }
.wz-ans.new { animation: wzans .5s cubic-bezier(.22,.8,.3,1); }

/* 고르기 버튼이 하나씩 차례로 «샤라락» 나타나기 */
.wz-cur.in .wz-opt, .wz-models.in .wz-opt { animation: optin .5s cubic-bezier(.22,.8,.3,1) both; animation-delay: calc(min(var(--i, 0), 12) * 45ms + 120ms); }
@keyframes optin { from { opacity: 0; transform: translateY(12px) scale(.98); filter: blur(2px); } to { opacity: 1; transform: none; filter: none; } }
.wz-opts.two { grid-template-columns: 1fr 1fr; }
.wz-opt.big { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 22px 18px; font-size: 18px; text-align: left; }
.wz-opt.big small { font-size: 12px; }
.wz-tabs { display: flex; gap: 6px; overflow-x: auto; padding: 2px 0 12px; scrollbar-width: none; }
.wz-tabs::-webkit-scrollbar { display: none; }
.wz-tab { flex: none; padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(17,24,39,.12); background: #fff; color: #4b5565; font: inherit; font-size: 14px; cursor: pointer; transition: background .2s, color .2s; }
.wz-tab.on { background: #111827; color: #fff; border-color: #111827; }

/* 요청서 질문 하나씩 */
#wf.wizard { padding: 20px; }
.wq-step { margin: 0 0 6px; font-size: 12px; color: var(--tx2); }
.wq-done { display: grid; gap: 6px; margin-top: 6px; }
.wq-done:empty { display: none; }
.wq { margin-top: 14px; }
.wq.in { animation: wqin .55s cubic-bezier(.22,.8,.3,1); }
.wq.out { opacity: 0; transform: translateX(-14px); transition: opacity .2s, transform .2s; }
@keyframes wqin { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.wq.in .wq-body > *, .wq.in .wq-nav { animation: optin .5s cubic-bezier(.22,.8,.3,1) both; }
.wq.in .wq-body > *:nth-child(2) { animation-delay: .06s; } .wq.in .wq-body > *:nth-child(3) { animation-delay: .12s; } .wq.in .wq-body > *:nth-child(n+4) { animation-delay: .18s; } .wq.in .wq-nav { animation-delay: .22s; }
.wq-sub { margin: -4px 0 12px; font-size: 13px; color: var(--tx2); }
.wq-nav { margin-top: 16px; }
.wq-err { margin: 8px 0 0; color: #dc2626; font-size: 13px; min-height: 0; }
.wq-err:empty { display: none; }
.wq-seg { margin-top: 12px; }
.wq-quick { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.wq-pick { padding: 12px 8px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); color: var(--tx); font: inherit; font-weight: 600; cursor: pointer; transition: background .15s, border-color .15s; }
.wq-pick.on, .wq-pick:hover { border-color: #c2410c; background: #fff4ec; color: #111827; }
.wq-more { margin-top: 12px; }
.wq-more > summary { cursor: pointer; font-size: 14px; color: var(--tx2); padding: 6px 0; }
.wq textarea { width: 100%; min-height: 110px; }
@media (prefers-reduced-motion: reduce) { .wz-cur.in .wz-opt, .wz-models.in .wz-opt, .wq.in, .wq.in .wq-body > *, .wq.in .wq-nav { animation: none; } }
.rep-row { flex-wrap: wrap; }
.repmax, .repcnt { width: auto; min-width: 120px; margin-left: 8px; padding: 6px 10px; }
.wq-pane.in { animation: wqin .4s cubic-bezier(.22,.8,.3,1); }

/* 판매 제안서: 구매자 조건에 답하기 */
.psec { margin: 22px 0 8px; font-size: 17px; font-weight: 800; letter-spacing: -.2px; }
.arows { display: grid; gap: 10px; }
.arow { padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--card); transition: border-color .2s, background .2s; }
.arow.is-ok { border-color: #16a34a; background: color-mix(in srgb, #16a34a 6%, var(--card)); }
.arow.is-diff { border-color: #ea580c; background: color-mix(in srgb, #ea580c 6%, var(--card)); }
.arow-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.arow-head b { font-size: 15px; }
.arow-want { font-size: 13px; color: var(--tx2); }
.fitseg { margin-bottom: 8px; }
.arow-detail { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.arow-detail input, .arow-detail select { margin: 0; }
table.ans td:first-child { width: 38%; }

/* 답하기 줄: 왼쪽 구매자 조건 · 오른쪽 내 차 */
.arow { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 12px; align-items: start; }
.arow-buyer { padding: 10px 12px; border-radius: 10px; background: var(--tile, #f5f7fa); }
.arow-buyer b { display: block; font-size: 13px; color: var(--tx2); font-weight: 600; }
.arow-buyer p { margin: 2px 0 0; font-size: 15px; font-weight: 700; color: var(--tx); }
.arow-me .fitseg { margin-bottom: 8px; }
.arow-cols { padding: 0 14px; border: 0; background: none; font-size: 12px; color: var(--tx2); }
.arow-cols span:last-child { padding-left: 2px; }
.arow-detail { grid-template-columns: 1fr; }
@media (min-width: 640px) { .arow-detail { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); } }
/* PC: 구매 희망서 왼쪽 고정, 제안서 오른쪽 */
@media (min-width: 1000px) {
  main:has(.wish-split) { max-width: 1320px; }
  .wish-split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 20px; align-items: start; }
  .ws-left { position: sticky; top: 72px; max-height: calc(100vh - 88px); overflow: auto; }
  .ws-left .card { margin: 0; }
  .ws-right > .card { margin-top: 0; }
}
@media (max-width: 520px) { .arow { gap: 8px; padding: 10px; } .arow-buyer { padding: 8px 10px; } .arow-buyer p { font-size: 14px; } }

/* 판매 제안서 3칸: 구매 희망서 | 만들어지는 제안서 | 하나씩 답하기 */
.pw-cap { margin: 0 0 6px; font-size: 12px; color: var(--tx2); font-weight: 600; }
.pw-grid { display: grid; gap: 16px; }
.pw-grid .card { margin: 0; }
.pw-preview { order: 1; } .pw-input { order: 2; } .pw-buyer { order: 0; }
.pwiz .wq .arow { display: block; padding: 0; border: 0; background: none; }
.pv dd { transition: background .3s; border-radius: 6px; }
.pv dd.flash { animation: pvflash 1.2s ease; }
@keyframes pvflash { 0% { background: #fff1e6; } 100% { background: transparent; } }
.pv-blank { color: var(--mu, #9aa3af); font-size: 13px; }
.pv-want { display: block; margin-top: 2px; font-size: 12px; color: var(--tx2); }
.pmark { display: inline-block; margin-left: 6px; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; vertical-align: 1px; }
.pmark.ok { background: #dcfce7; color: #166534; } .pmark.diff { background: #ffedd5; color: #9a3412; }
#pv dd { cursor: pointer; }
@media (max-width: 899px) {
  .pw-buyer .card { max-height: 260px; overflow: auto; }
}
@media (min-width: 900px) {
  main:has(.pw-grid) { max-width: 1400px; }
  .pw-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
  .pw-buyer { grid-column: 1; grid-row: 1 / span 2; position: sticky; top: 72px; }
  .pw-preview { grid-column: 2; grid-row: 1; }
  .pw-input { grid-column: 2; grid-row: 2; }
}
@media (min-width: 1240px) {
  .pw-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.1fr); }
  .pw-buyer { grid-column: 1; grid-row: 1; }
  .pw-preview { grid-column: 2; grid-row: 1; position: sticky; top: 72px; }
  .pw-input { grid-column: 3; grid-row: 1; position: sticky; top: 72px; }
}
@media (max-width: 899px) { .pw-input { order: 1; } .pw-preview { order: 2; } }

/* 관리자 */
.admin-tabs { margin: 0 0 16px; }
.st-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; margin-bottom: 16px; }
.st-tile { padding: 14px; border-radius: 14px; background: var(--card); border: 1px solid var(--line); display: flex; flex-direction: column; gap: 2px; }
.st-tile span { font-size: 12px; color: var(--tx2); }
.st-tile b { font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; }
.st-tile small { font-size: 12px; color: var(--tx2); }
.bars { display: grid; grid-template-columns: repeat(14, 1fr); gap: 6px; height: 140px; align-items: end; }
.bar { height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 2px; position: relative; }
.bar i { display: block; width: 70%; min-height: 2px; border-radius: 4px 4px 0 0; background: #c2410c; }
.bar span { font-size: 11px; color: var(--tx2); order: -1; }
.bar em { font-style: normal; font-size: 11px; color: var(--tx2); }
.u-row.off, .t-row.off { opacity: .6; }
.t-spec dt { width: 90px; }

/* 색 견본 */
.swatches { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; }
.swatch { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; cursor: pointer; font-size: 14px; }
.swatch input { position: absolute; opacity: 0; pointer-events: none; }
.swatch i { flex: none; width: 22px; height: 22px; border-radius: 50%; border: 1px solid rgba(0,0,0,.18); box-shadow: inset 0 0 0 2px rgba(255,255,255,.25); }
.swatch i.none { background: repeating-linear-gradient(45deg, #ddd 0 4px, #fff 4px 8px); }
.swatch:has(input:checked) { border-color: #c2410c; background: #fff4ec; color: #111827; }
.sw-inline { display: inline-flex; align-items: center; gap: 4px; }
.sw-inline i { width: 12px; height: 12px; border-radius: 50%; border: 1px solid rgba(0,0,0,.2); display: inline-block; }

/* 판매 제안서 보기: PC 는 왼쪽 차·연락, 오른쪽 비교표(스크롤 없이 한눈에) */
.done-banner { border-color: #16a34a; background: color-mix(in srgb, #16a34a 7%, var(--card)); }
.psay { display: block; margin-top: 3px; font-size: 12px; font-weight: 600; }
.psay.ok { color: #15803d; } .psay.diff { color: #c2410c; }
.prop-grid { display: grid; gap: 16px; }
.prop-grid .card { margin: 0 0 12px; }
@media (min-width: 1000px) {
  main:has(.prop-grid) { max-width: 1320px; }
  .prop-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); align-items: start; }
  .prop-right { position: sticky; top: 72px; max-height: calc(100vh - 88px); overflow: auto; margin: 0; }
  .prop-right table.cmp td, .prop-right table.cmp th { padding: 6px 8px; font-size: 13px; }
}
.sw-other { margin-top: 6px; }
.arow-detail .swatches, .arow-detail .sw-other { grid-column: 1 / -1; }
.arow-detail:has(.swatches) { grid-template-columns: 1fr; }
.swatch { position: relative; }
.swatch input { left: 0; top: 0; width: 1px; height: 1px; }

/* ---- 11/13 정리: 굵기·장식 줄이기, 헤더 뒤로가기, 목록 카드 단순화 ---- */
.display, .hero4 h1, .num-tile strong, .y, .gen-name, .wz-q, .entry-card b, .psec, .st-tile b, .wz-opt.big { font-weight: 600; letter-spacing: -0.01em; }
.wz-q { font-weight: 600; }
.top-left { display: flex; align-items: center; gap: 4px; min-width: 0; }
.back { display: inline-grid; place-items: center; width: 36px; height: 36px; margin-left: -8px; border: 0; border-radius: 8px; background: none; color: var(--tx); cursor: pointer; }
.back:hover { background: var(--raised); }
.back svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.back[hidden] { display: none; }
#mnav { display: none; }
#mnav a, #mnav button { font: inherit; font-size: 14px; color: var(--tx2); background: none; border: 0; padding: 8px 4px; text-decoration: none; cursor: pointer; }
@media (max-width: 720px) { #mnav { display: block; } }
html.pc #mnav { display: none; }
.tabbar { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)) !important; }
/* 첫 화면 */
.entry { padding: 32px 0 16px; }
.entry h1 { font-size: 32px; line-height: 40px; font-weight: 600; letter-spacing: -0.02em; margin: 0 0 8px; }
.entry > p { font-size: 15px; color: var(--tx2); margin: 0 0 24px; }
.entry-card { padding: 16px; border-radius: 12px; box-shadow: none; transition: border-color .15s, background-color .15s; }
.entry-card:hover { transform: none; box-shadow: none; border-color: var(--tx); }
.entry-card:active { transform: scale(.98); }
.entry-card i { width: auto; height: auto; background: none; margin: 0 0 12px; display: block; }
.entry-card i svg { width: 20px; height: 20px; stroke: var(--tx2); stroke-width: 1.5; }
.entry-card b { font-size: 15px; font-weight: 600; }
.entry-card span { font-size: 13px; }
@media (max-width: 520px) { .entry h1 { font-size: 26px; line-height: 34px; } }
.list-title { font-size: 18px; line-height: 26px; font-weight: 600; letter-spacing: 0; margin: 32px 0 12px; }
/* 목록 카드: 차량명·가격만 */
.wish.slim { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 12px 16px; }
.wish.slim .wtile { width: 72px; padding: 6px; border-radius: 10px; }
.wish.slim h3 { font-size: 15px; line-height: 22px; font-weight: 500; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wish.slim .wprice { font-size: 17px; line-height: 24px; font-weight: 600; margin: 2px 0 0; }
.wish.slim .wprice small { font-size: 13px; font-weight: 400; color: var(--tx2); margin-left: 2px; }
.wish.slim .wmeta .pc { font-size: 12px; color: var(--tx2); font-variant-numeric: tabular-nums; }
.wish.slim:hover { border-color: var(--tx); }
.entry .hero-sub { color: var(--tx2); font-size: 13px; margin: 12px 0 0; }
.entry .hero-sub a { color: var(--tx); text-decoration: underline; text-underline-offset: 3px; }
.entry-card b { white-space: nowrap; }
@media (max-width: 520px) { .entry-row { gap: 8px; } .entry-card { padding: 12px; } .entry-card span { font-size: 12px; line-height: 16px; } }

/* 로고: 번호판 마크 + 글자 */
.logo { display: inline-flex; align-items: center; gap: 8px; }
.logo .plate { display: inline-flex; align-items: center; height: 22px; padding: 0 6px; border: 1.5px solid var(--tx); border-radius: 5px; font-size: 11px; font-weight: 600; letter-spacing: .06em; line-height: 1; }
.logo .plate::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background: var(--ac); margin-right: 5px; }
.logo .wm { font-size: 17px; font-weight: 600; letter-spacing: -0.01em; }
.logo .wm small { font-size: 12px; font-weight: 500; color: var(--mu); margin-left: 5px; }
.logo b { display: none; }

/* ---- 로고: 글자만 ---- */
.logo .wm { font-size: 19px; font-weight: 600; letter-spacing: -0.02em; }
.logo .wm i { font-style: normal; color: var(--ac); margin: 0 1px; }
.logo .plate, .logo small { display: none; }
/* ---- 홈: 첫 화면 채우기(단순하게) ---- */
.hero-grid { display: grid; gap: 24px; align-items: center; }
@media (min-width: 880px) { .hero-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 48px; } }
.hero-demo { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 20px; }
.demo-tag { display: inline-block; margin: 0 0 12px; font-size: 12px; color: var(--mu); border: 1px solid var(--line); border-radius: 6px; padding: 2px 8px; }
.demo-wish { display: grid; gap: 2px; padding: 12px 14px; border-radius: 10px; background: var(--raised); }
.demo-wish span { font-size: 12px; color: var(--mu); }
.demo-wish b { font-size: 15px; font-weight: 600; }
.demo-wish small { font-size: 13px; color: var(--tx2); }
.demo-arrow { margin: 14px 0 8px; font-size: 13px; color: var(--tx2); }
.demo-props { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.demo-props li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 10px 0; border-top: 1px solid var(--line); }
.demo-props li span { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.demo-props li b { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }
.demo-props li em { grid-column: 1 / -1; font-style: normal; font-size: 12px; }
.demo-props em.ok { color: #15803d; } .demo-props em.near { color: #c2410c; }
.trust { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 24px 0 0; padding: 14px 0 0; border-top: 1px solid var(--line); font-size: 13px; color: var(--tx2); }
.trust li::before { content: ""; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--ac); margin: 0 8px 2px 0; vertical-align: middle; }
.sect-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.sect-head h2 { margin: 0; font-size: 18px; font-weight: 600; }
.sect-head a { font-size: 13px; color: var(--tx2); }
.info { margin: 40px 0 8px; }
.info .sect-head { margin-bottom: 12px; }
.info-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.info-card { display: grid; gap: 4px; padding: 16px; border-radius: 12px; background: var(--card); border: 1px solid var(--line); color: var(--tx); text-decoration: none; transition: border-color .15s; }
.info-card:hover { border-color: var(--tx); }
.info-card b { font-size: 15px; font-weight: 600; }
.info-card span { font-size: 13px; color: var(--tx2); }
.info-card.calc { background: var(--tx); color: var(--bg); border-color: var(--tx); }
.info-card.calc span { color: color-mix(in srgb, var(--bg) 75%, transparent); }
.list-head { margin: 40px 0 12px; }
.list-head .list-title { margin: 0; }
.live-stats { font-size: 13px; color: var(--tx2); font-variant-numeric: tabular-nums; }
@media (max-width: 520px) { .info-grid { grid-template-columns: 1fr 1fr; } .info-card { padding: 12px; } .info-card b { font-size: 14px; } }