:root {
  color-scheme: light;
  --bg: #f3f3f1;
  --surface-1: #fcfcfb;
  --border: #e2e1dc;
  --grid: #ebeae6;
  --text-primary: #0b0b0b;
  --text-secondary: #52514e;
  --text-muted: #7a7974;
  --series-1: #2a78d6;
  --series-2: #eb6834;
  --series-3: #1baf7a;
  --series-4: #eda100;
  --other: #a8a7a1;
  --series-5: #e87ba4;
  --series-6: #008300;
  --series-7: #6250d6;
  --cost: #8a8984;
  --good: #0a7a3a;
  --bad: #c4312f;
  --accent: #2a78d6;
  --chip: #ecebe7;
  --mast: #12161e;
  --mast-text: #e6e8ec;
  --ph-a: #2b313c;
  --ph-b: #12161e;
}
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --bg: #111110;
    --surface-1: #1a1a19;
    --border: #2e2e2c;
    --grid: #2a2a28;
    --text-primary: #f0efec;
    --text-secondary: #c3c2b7;
    --text-muted: #8f8e88;
    --series-1: #3987e5;
    --series-2: #d95926;
    --series-3: #199e70;
    --series-4: #c98500;
    --other: #6e6d68;
    --series-5: #d55181;
    --series-6: #008300;
    --series-7: #9085e9;
    --cost: #9a9993;
    --good: #4cc27a;
    --bad: #f07070;
    --accent: #3987e5;
    --chip: #262624;
    --mast: #0b0d12;
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text-primary);
  font: 15px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
a { color: inherit; }
h1, h2, h3 { margin: 0; }
h2 { font-size: 17px; }
.wrap { max-width: 1880px; margin: 0 auto; padding: 0 24px; }
.small { font-size: 13px; }

/* fejléc + menü */
.masthead { background: var(--mast); color: var(--mast-text); position: sticky; top: 0; z-index: 10; }
.mast-inner { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-top: 12px; padding-bottom: 10px; flex-wrap: wrap; }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; font-size: 22px; font-weight: 700; letter-spacing: .2px; }
.mast-right { display: flex; gap: 10px; align-items: center; }
.masthead input[type=search] { font: inherit; padding: 7px 12px; border: 1px solid #333a46; border-radius: 6px;
  background: #1c222c; color: var(--mast-text); min-width: 260px; }
.nav { display: flex; flex-wrap: wrap; gap: 0 2px; } /* keskenyebb ablakban két sorba törik, nem lóg ki */
.nav a { text-decoration: none; color: #b9bec8; padding: 9px 7px 11px; font-size: 13.5px; white-space: nowrap; border-bottom: 3px solid transparent; }
.nav a:hover { color: #fff; }
.nav a.on { color: #fff; border-bottom-color: var(--series-1); font-weight: 600; }
.nav .n { opacity: .55; font-size: 11.5px; margin-left: 3px; font-variant-numeric: tabular-nums; }
.statusbar { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; color: var(--text-muted); font-size: 12.5px; padding-top: 8px; }
main { padding-top: 14px; padding-bottom: 40px; }

.btn { background: var(--accent); color: #fff; border: 0; border-radius: 6px; padding: 8px 14px; cursor: pointer; font: inherit; }
.btn:disabled { opacity: .6; cursor: progress; }
.btn.ghost { background: transparent; color: var(--accent); border: 1px solid var(--border); margin-top: 14px; }
.card { background: var(--surface-1); border: 1px solid var(--border); border-radius: 10px; padding: 18px 20px; }
.section-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.page-title { font-size: 24px; margin: 6px 0 16px; }
.empty { color: var(--text-muted); padding: 20px 0; }

/* képek, helyettesítő kép */
.thumb { position: relative; overflow: hidden; background: linear-gradient(135deg, var(--ph-a), var(--ph-b)); border-radius: 8px; }
.thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; z-index: 1; }
.thumb .ph { position: absolute; inset: 0; display: grid; place-items: center; }
.thumb .ph svg { width: 34%; max-width: 90px; opacity: .55; }
.ratio-16x9 { aspect-ratio: 16 / 9; }
.ratio-4x3 { aspect-ratio: 4 / 3; }

.meta { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; font-size: 12.5px; color: var(--text-muted); }
.badge { background: var(--chip); color: var(--text-secondary); border-radius: 4px; padding: 1px 7px; font-size: 11.5px; font-weight: 650; text-transform: uppercase; letter-spacing: .3px; }
.badge.car { background: var(--series-1); color: #fff; }
.story a.t { text-decoration: none; font-weight: 650; }
.story a.t:hover { text-decoration: underline; }
.story.read a.t { color: var(--text-secondary); }
.story p { margin: 4px 0 0; color: var(--text-secondary); }
.orig { font-size: 12px; color: var(--text-muted); margin-top: 4px; font-style: italic; }

/* címlap */
.home { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 24px; }
@media (max-width: 1000px) { .home { grid-template-columns: 1fr; } }
.lead { display: grid; grid-template-columns: 1.6fr 1fr; gap: 16px; margin-bottom: 22px; }
@media (max-width: 760px) { .lead { grid-template-columns: 1fr; } }
.hero { position: relative; border-radius: 10px; overflow: hidden; min-height: 380px; }
.hero .thumb { position: absolute; inset: 0; border-radius: 0; aspect-ratio: auto; }
.hero .over { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; padding: 60px 20px 18px;
  background: linear-gradient(transparent, rgba(0,0,0,.85)); color: #fff; }
.hero .meta { color: #d4d6da; }
.hero .badge { background: rgba(255,255,255,.18); color: #fff; }
.hero a.t { font-size: 26px; line-height: 1.2; display: block; margin-top: 6px; color: #fff; }
.hero p { color: #e0e2e6; }
.lead-side { display: grid; gap: 16px; }
.lead-side .story .thumb { margin-bottom: 8px; }
.lead-side a.t { font-size: 17px; line-height: 1.25; display: block; margin-top: 4px; }
.grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 760px) { .grid3 { grid-template-columns: 1fr 1fr; } }
.grid3 .thumb { margin-bottom: 8px; }
.grid3 a.t { display: block; font-size: 15.5px; line-height: 1.3; margin-top: 4px; }
.block-title { font-size: 13px; text-transform: uppercase; letter-spacing: .8px; color: var(--text-secondary); margin: 26px 0 12px;
  padding-bottom: 6px; border-bottom: 2px solid var(--text-primary); display: flex; justify-content: space-between; }
.block-title a { text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--accent); text-decoration: none; }
.compact { display: grid; gap: 0; }
.compact .story { padding: 10px 0; border-bottom: 1px solid var(--border); }
.compact a.t { font-size: 15px; display: block; margin-top: 2px; }

.side { display: grid; gap: 20px; align-content: start; }
.side .card { padding: 14px 16px; }
.side h3 { font-size: 13px; text-transform: uppercase; letter-spacing: .8px; color: var(--text-secondary); margin-bottom: 10px;
  display: flex; justify-content: space-between; }
.side h3 a { text-transform: none; letter-spacing: 0; color: var(--accent); text-decoration: none; font-weight: 400; }
.stock-mini .big { font-size: 28px; font-weight: 700; font-variant-numeric: tabular-nums; }
.stock-mini .row { display: flex; justify-content: space-between; font-size: 13.5px; padding: 3px 0; font-variant-numeric: tabular-nums; }
.stock-mini .row span:first-child { color: var(--text-secondary); }
.spark { height: 70px; margin: 8px 0; }
.side-list .story { display: grid; grid-template-columns: 84px 1fr; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--border); }
.side-list .story:last-child { border-bottom: 0; }
.side-list a.t { font-size: 14px; line-height: 1.3; }
.side-list .thumb { aspect-ratio: 4 / 3; }

/* rovat lista */
.list .story { display: grid; grid-template-columns: 240px 1fr; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--border); }
@media (max-width: 640px) { .list .story { grid-template-columns: 1fr; } }
.list a.t { font-size: 18px; line-height: 1.3; display: block; margin-top: 4px; }

/* részvény oldal */
.seg { display: inline-flex; border: 1px solid var(--border); border-radius: 6px; overflow: hidden; }
.seg button { background: transparent; border: 0; padding: 6px 12px; color: var(--text-secondary); cursor: pointer; font: inherit; font-size: 13px; }
.seg button.on { background: var(--chip); color: var(--text-primary); font-weight: 600; }
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 18px; }
.tile { border: 1px solid var(--border); border-radius: 8px; padding: 10px 14px; }
.tile .label { color: var(--text-secondary); font-size: 13px; }
.tile .value { font-size: 22px; font-weight: 650; font-variant-numeric: tabular-nums; }
.tile .sub { color: var(--text-muted); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.up { color: var(--good); } .down { color: var(--bad); }
.charts { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 900px) { .charts { grid-template-columns: 1fr; } }
figure { margin: 0; }
figcaption { font-weight: 600; font-size: 14px; margin-bottom: 6px; display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.legend { font-weight: 400; color: var(--text-secondary); font-size: 12.5px; display: inline-flex; align-items: center; gap: 6px; }
.sw { display: inline-block; width: 16px; height: 0; border-top: 2px solid; margin-left: 6px; }
.sw-value { border-color: var(--series-1); }
.sw-cost { border-color: var(--cost); border-top-style: dashed; }
.chart-box { position: relative; height: 280px; }
details { margin-top: 14px; }
summary { cursor: pointer; color: var(--text-secondary); font-size: 14px; }
.table-wrap { max-height: 320px; overflow: auto; margin-top: 8px; }
table { border-collapse: collapse; width: 100%; font-size: 13px; font-variant-numeric: tabular-nums; }
th, td { padding: 5px 10px; border-bottom: 1px solid var(--border); text-align: right; white-space: nowrap; }
th:first-child, td:first-child { text-align: left; }
th { position: sticky; top: 0; background: var(--surface-1); color: var(--text-secondary); font-weight: 600; }

/* videók */
.grid4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 1000px) { .grid4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.grid4 .thumb { margin-bottom: 8px; }
.grid4 a.t { display: block; font-size: 14.5px; line-height: 1.3; margin-top: 4px; }
.vthumb { display: block; }
.play { position: absolute; z-index: 2; left: 50%; top: 50%; width: 54px; height: 38px; margin: -19px 0 0 -27px;
  background: rgba(0,0,0,.72); border-radius: 10px; }
.play::after { content: ""; position: absolute; left: 22px; top: 11px; border-style: solid; border-width: 8px 0 8px 14px;
  border-color: transparent transparent transparent #fff; }
.vthumb:hover .play { background: #c4312f; }
.dur { position: absolute; z-index: 2; right: 6px; bottom: 6px; background: rgba(0,0,0,.8); color: #fff; font-size: 12px;
  padding: 1px 5px; border-radius: 4px; font-variant-numeric: tabular-nums; }
.badge.hu { background: #2f7d4f; color: #fff; }
dialog.player { width: min(1100px, 94vw); padding: 0; border: 0; border-radius: 10px; background: #000; color: #fff; }
dialog.player::backdrop { background: rgba(0,0,0,.75); }
.player-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 8px 8px 14px; font-weight: 600; }
.player-head .btn.ghost { margin: 0; color: #fff; border-color: #444; }
.player-box { aspect-ratio: 16 / 9; }
.player-box iframe { width: 100%; height: 100%; border: 0; display: block; }

/* irány-jelzés */
.dir { display: flex; gap: 10px; align-items: center; margin-top: 10px; padding: 8px 10px; border-radius: 8px;
  background: var(--chip); text-decoration: none; font-size: 13.5px; }
.dir small { display: block; color: var(--text-muted); font-size: 11.5px; }
.dir .arrow { font-size: 16px; }
.dir-up .arrow { color: var(--good); } .dir-down .arrow { color: var(--bad); } .dir-flat .arrow { color: var(--text-muted); }
.big-dir { font-size: 17px; padding: 12px 14px; margin: 0 0 14px; }
.big-dir .arrow { font-size: 24px; }
.outlook-card { margin-top: 20px; }
.factors { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.small-val { font-size: 17px; text-transform: capitalize; }
.heads { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 14px; }
@media (max-width: 800px) { .heads { grid-template-columns: 1fr; } }
.heads .label { color: var(--text-secondary); font-size: 13px; font-weight: 600; }
.heads ul { margin: 6px 0 0; padding-left: 18px; }
.heads li { margin-bottom: 6px; font-size: 14px; }
.heads li a { text-decoration: none; }
.heads li a:hover { text-decoration: underline; }
.note { color: var(--text-muted); font-size: 12.5px; margin: 12px 0 0; }

/* autó */
.car-img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 8px; display: block; margin-bottom: 8px; }
.car-mini .big { font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; margin-top: 4px; }
.car-mini .row { display: flex; justify-content: space-between; font-size: 13.5px; padding: 3px 0; font-variant-numeric: tabular-nums; }
.car-mini .row span:first-child { color: var(--text-secondary); }
.car-mini .meta:last-child { margin-top: 6px; }
.car-card { display: grid; grid-template-columns: minmax(0, 420px) 1fr; gap: 24px; align-items: start; }
@media (max-width: 900px) { .car-card { grid-template-columns: 1fr; } }
.car-card h2 { font-size: 20px; margin-bottom: 4px; }
.specs { color: var(--text-secondary); font-size: 14px; margin: 10px 0 14px; }
.car-card .tiles { margin-bottom: 0; }
.comps { margin-top: 16px; }
.comps table td.eq { text-align: left; white-space: normal; color: var(--text-secondary); min-width: 220px; }
.comps table td:first-child { white-space: normal; }
.comps table a { text-decoration: none; color: var(--accent); }
.sub-title { font-size: 19px; margin: 26px 0 4px; }

/* km-űrlap */
.km-form { margin: 12px 0 8px; padding-top: 10px; border-top: 1px solid var(--border); }
.km-form label { font-size: 13px; color: var(--text-secondary); font-weight: 600; }
.km-row { display: flex; gap: 6px; align-items: center; margin: 4px 0; }
.km-row input { font: inherit; width: 100%; min-width: 0; padding: 6px 8px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--bg); color: var(--text-primary); font-variant-numeric: tabular-nums; }
.km-row span { color: var(--text-muted); font-size: 13px; }
.km-row .btn { padding: 6px 12px; white-space: nowrap; }
.tile .value.small-val2 { font-size: 16px; line-height: 1.35; }
.muted-inline { color: var(--text-muted); font-size: 12px; }
tr.close td { background: color-mix(in srgb, var(--series-1) 8%, transparent); }

/* elemzői verdikt */
.verdict { display: block; margin-top: 10px; padding: 7px 10px; border-radius: 8px; text-decoration: none; font-size: 13.5px;
  border-left: 4px solid var(--text-muted); background: var(--chip); }
.verdict small { color: var(--text-muted); }
.v-up { border-left-color: var(--good); } .v-up b { color: var(--good); }
.v-down { border-left-color: var(--bad); } .v-down b { color: var(--bad); }
.big-verdict { margin: 0 0 12px; padding: 12px 14px; }
.big-verdict .label { display: block; color: var(--text-secondary); font-size: 13px; }
.big-verdict b { font-size: 22px; letter-spacing: .5px; }
.big-verdict small { display: block; margin-top: 2px; }

/* vásárlások */
#lots tfoot th { border-top: 2px solid var(--border); text-align: right; }
#lots tfoot th:first-child { text-align: left; }
.link-btn { background: none; border: 0; color: var(--bad); cursor: pointer; font: inherit; font-size: 12.5px; padding: 0; }
.link-btn:hover { text-decoration: underline; }
.lot-form { margin-top: 14px; }
.lot-fields { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; }
.lot-fields label { display: grid; gap: 3px; font-size: 13px; color: var(--text-secondary); }
.lot-fields input { font: inherit; padding: 6px 8px; border: 1px solid var(--border); border-radius: 6px; background: var(--bg);
  color: var(--text-primary); width: 150px; }
.lot-fields input[name=note] { width: 220px; }
.lot-preview { margin: 8px 0 4px; font-size: 13.5px; color: var(--text-secondary); min-height: 1.2em; }

/* új autó kártyák */
.newcars { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.side .newcars .card.newcar { padding: 10px 12px; }
.newcar { display: block; }
.newcar:hover { border-color: var(--accent); }
.nc-img { background: #fff; border-radius: 6px; aspect-ratio: 2 / 1; display: grid; place-items: center; overflow: hidden; margin-bottom: 6px; }
.nc-img img { width: 100%; height: 100%; object-fit: contain; }
.nc-title { font-weight: 700; font-size: 14px; }
.nc-price { font-size: 19px; font-weight: 700; font-variant-numeric: tabular-nums; margin-top: 4px; }
.nc-swap { margin-top: 4px; color: var(--text-secondary); }
.nc-note { margin: 8px 0 0; font-size: 11.5px; }
.side .nc-note { margin-top: -8px; }
main > .newcars { grid-template-columns: repeat(2, minmax(0, 320px)); }

/* rovat-blokkok a címlapon */
.sections { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 24px; }
@media (max-width: 760px) { .sections { grid-template-columns: 1fr; } }
.sec .sec-lead .thumb { margin-bottom: 8px; }
.sec .sec-lead a.t { display: block; font-size: 16px; line-height: 1.3; margin-top: 4px; }
.sec .compact .story { padding: 8px 0; }
.sec .compact a.t { font-size: 14px; }
.badge.vet { background: #8a6d3b; color: #fff; }
.origin { font-size: 10.5px; font-weight: 700; letter-spacing: .4px; color: var(--text-muted); border: 1px solid var(--border);
  border-radius: 3px; padding: 0 4px; }

/* eladási grafikon */
.sales-fig { margin-top: 20px; }
.sales-box { height: 240px; }
.sq { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-left: 6px; }
.sq-cars { background: var(--series-1); } .sq-bev { background: var(--series-2); }
.lot-date { font: inherit; font-size: 13px; padding: 2px 4px; border: 1px solid var(--border); border-radius: 4px;
  background: var(--bg); color: var(--text-primary); }

/* új autó kártya: kivitel-váltó nyíl, motorválasztó */
.newcar { position: relative; }
.nc-img { position: relative; }
.nc-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 26px; height: 26px; border-radius: 50%;
  border: 1px solid #d6d6d2; background: rgba(255,255,255,.92); color: #222; font-size: 18px; line-height: 22px;
  cursor: pointer; padding: 0; }
.nc-arrow:hover { background: #fff; border-color: var(--accent); }
.nc-arrow.prev { left: 4px; } .nc-arrow.next { right: 4px; }
.nc-trim { position: absolute; left: 6px; top: 6px; font-size: 10.5px; font-weight: 700; letter-spacing: .4px;
  background: #e9e9e6; color: #333; border-radius: 3px; padding: 1px 5px; text-transform: uppercase; }
.nc-trim.amg { background: #111; color: #fff; }
.nc-title a { text-decoration: none; color: inherit; }
.nc-title a:hover { text-decoration: underline; }
.nc-engines { display: flex; flex-wrap: wrap; gap: 4px; margin: 5px 0 3px; }
.nc-engines button { font: inherit; font-size: 11.5px; padding: 1px 6px; border: 1px solid var(--border); border-radius: 4px;
  background: transparent; color: var(--text-secondary); cursor: pointer; }
.nc-engines button.on { background: var(--chip); color: var(--text-primary); font-weight: 650; border-color: var(--text-muted); }
.hero .origin { color: #e6e8ec; border-color: rgba(255,255,255,.45); }

/* piaci helyzet */
.market .tiles { margin-bottom: 14px; }
.small-charts { margin-top: 18px; }
.mini-box { height: 200px; }
#salesTable td, #salesTable th { padding: 4px 8px; }

/* frissítés gombok a kártyák fejlécében */
.head-actions { display: flex; align-items: center; gap: 10px; }
.btn.ghost.small-btn { margin: 0; padding: 5px 10px; font-size: 13px; }

/* húzómodellek */
.lineup { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.lu { border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; }
.lu-img { background: #fff; border-radius: 6px; aspect-ratio: 2.2 / 1; display: grid; place-items: center; overflow: hidden; margin-bottom: 8px; }
.lu-img img { width: 92%; height: 92%; object-fit: contain; }
.lu-head { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin-bottom: 6px; }
.lu-head b { font-size: 16px; margin-right: 2px; }
.lu-row { display: flex; justify-content: space-between; gap: 8px; font-size: 13.5px; padding: 2px 0; font-variant-numeric: tabular-nums; }
.lu-row span:first-child { color: var(--text-secondary); }
.bar { height: 8px; border-radius: 4px; background: var(--chip); overflow: hidden; margin: 3px 0 4px; }
.bar i { display: block; height: 100%; background: var(--series-1); border-radius: 4px; }
.badge.up-badge { background: var(--good); color: #fff; }
.spark-svg { width: 100%; height: 30px; margin-top: 6px; display: block; }
#lineupTable td.eq a { color: var(--accent); text-decoration: none; }

/* archívum */
.archive-search { display: flex; gap: 8px; margin-bottom: 8px; }
.archive-search input { flex: 1; font: inherit; padding: 8px 12px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface-1); color: var(--text-primary); }

/* családfa */
.tree-legend { margin: -6px 0 10px; align-items: center; }
.lg-line { display: inline-block; width: 26px; border-top: 3px solid var(--series-1); vertical-align: middle; margin: 0 4px 0 8px; }
.lg-line.dead { border-top: 3px dashed var(--cost); }
.lg-edge { display: inline-block; width: 26px; border-top: 2px dashed var(--series-2); vertical-align: middle; margin: 0 4px 0 8px; }
.badge.new-badge { background: var(--series-2); color: #fff; }
/* a családfa saját, képernyőnyi magas dobozban görög mindkét irányba, így az évszámsor függőleges görgetéskor is látszik */
.tree-wrap { overflow: auto; max-height: max(420px, calc(100vh - 190px)); overscroll-behavior: contain;
  border: 1px solid var(--border); border-radius: 10px; background: var(--surface-1); }
.tree { position: relative; }
.tree-axis { position: sticky; top: 0; height: 32px; z-index: 7; background: var(--surface-1); border-bottom: 1px solid var(--border); }
.tree-axis span { position: absolute; top: 8px; transform: translateX(-50%); font-size: 12px; color: var(--text-muted);
  font-variant-numeric: tabular-nums; }
.tree-grid { position: absolute; width: 0; border-left: 1px solid var(--grid); }
.tree-edges { position: absolute; left: 0; top: 0; pointer-events: none; }
.tree-edges path { fill: none; stroke: var(--series-2); stroke-width: 2; stroke-dasharray: 6 4; marker-end: url(#arr); }
.tree-edges marker path { fill: var(--series-2); stroke: none; }
.lane-labels { position: absolute; left: 0; top: 0; width: 190px; z-index: 6; pointer-events: none; }
.lane-label { position: absolute; left: 0; width: 190px; display: flex; flex-direction: column; justify-content: center;
  padding: 0 10px; background: var(--surface-1); border-right: 1px solid var(--border); border-bottom: 1px solid var(--grid);
  font-size: 13px; font-weight: 650; }
.tree-event { position: absolute; z-index: 1; border-left: 2px solid var(--series-2); opacity: .9; }
.tree-event.band { border-left: 0; background: repeating-linear-gradient(135deg, transparent 0 6px, var(--grid) 6px 8px); }
.tree-event span { position: absolute; top: 4px; left: 4px; font-size: 11px; font-weight: 650; color: var(--text-secondary);
  background: var(--surface-1); padding: 0 4px; border-radius: 3px; white-space: nowrap; }
.lane-label small { font-weight: 400; color: var(--text-muted); }
.lane-line { position: absolute; height: 0; border-top: 3px solid var(--series-1); opacity: .55; }
.lane-line.dead { border-top: 3px dashed var(--cost); opacity: .8; }
.lane-end { position: absolute; font-size: 18px; color: var(--cost); font-weight: 700; }
.lane-end.live { color: var(--series-1); font-size: 14px; opacity: .7; }
.tnode { position: absolute; z-index: 2; display: flex; flex-direction: column; gap: 2px; padding: 4px; border: 1px solid var(--border);
  border-radius: 8px; background: var(--surface-1); cursor: pointer; text-align: left; font: inherit; color: inherit; }
.tnode:hover, .tnode:focus-visible { border-color: var(--accent); box-shadow: 0 2px 10px rgba(0,0,0,.12); z-index: 5; outline: none; }
.tnode.auto { border-color: var(--series-2); }
.tn-img { display: grid; place-items: center; height: 66px; background: #fff; border-radius: 5px; overflow: hidden; }
.tn-img img { width: 100%; height: 100%; object-fit: cover; }
.tn-img svg { width: 40px; opacity: .5; }
.tn-name { font-size: 12px; font-weight: 650; line-height: 1.2; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tn-years { font-size: 11px; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.tnode .new-badge { position: absolute; top: 6px; right: 6px; font-size: 10px; }
.tree-tip { position: fixed; z-index: 50; width: 300px; background: var(--surface-1); border: 1px solid var(--border); border-radius: 10px;
  padding: 10px 12px; box-shadow: 0 8px 28px rgba(0,0,0,.22); font-size: 13.5px; }
.tree-tip img { width: 100%; border-radius: 6px; margin-bottom: 6px; display: block; }
.tree-tip p { margin: 6px 0; color: var(--text-secondary); }
.tree-tip .tt-row { display: flex; justify-content: space-between; gap: 8px; margin-top: 6px; }
.tree-tip a { color: var(--accent); }
.tree-find { display: flex; align-items: center; gap: 10px; margin: -4px 0 8px; }
.tree-find input { flex: 0 1 560px; font: inherit; padding: 7px 12px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface-1); color: var(--text-primary); }
.tree.searching .tnode { opacity: .35; }
.tree.searching .tnode.hit { opacity: 1; border-color: var(--series-2); }
.tree.searching .tnode.current { box-shadow: 0 0 0 3px var(--series-2); z-index: 6; }
.seg a { display: inline-block; padding: 6px 12px; color: var(--text-secondary); text-decoration: none; font-size: 13px; }
.seg a.on { background: var(--chip); color: var(--text-primary); font-weight: 600; }
.tree-intro { margin: -8px 0 10px; }

/* gyártóüzemek térképe */
.plants-card { margin-top: 20px; }
.map-box { background: var(--bg); border-radius: 8px; overflow: hidden; }
#worldMap { width: 100%; height: auto; display: block; aspect-ratio: 866 / 422; }
#worldMap .land { fill: var(--chip); stroke: var(--surface-1); }
#worldMap .plant { cursor: pointer; }
#worldMap .plant:hover, #worldMap .plant:focus { outline: none; filter: brightness(1.15); }
.plant-legend { margin-bottom: 8px; flex-wrap: wrap; }
.dot { display: inline-block; width: 11px; height: 11px; border-radius: 50%; border: 2px solid; margin-left: 8px; vertical-align: -1px; }
/* villanyautók */
.ev-card select { font: inherit; padding: 4px 8px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-1); color: var(--text-primary); }
.ev-legend { margin: 4px 0 8px; flex-wrap: wrap; }
.top-charts { grid-template-columns: 1.4fr 1fr; }
@media (max-width: 900px) { .top-charts { grid-template-columns: 1fr; } }
.top-box { height: 340px; }
.body-box { height: 150px; }
#segNote { margin-top: 10px; font-size: 13px; color: var(--text-secondary); }
figcaption.second { margin-top: 14px; }
.hu-fig { margin-top: 18px; }
.hu-box { height: 200px; }
.top-box { height: 360px; }
#huNote, #segNote { display: block; }

/* osztalék, naptár, összevetés */
.div-box { height: 240px; }
.cmp-box { height: 340px; margin-bottom: 12px; }
.cmp-legend { margin-bottom: 8px; flex-wrap: wrap; }
.cal-list { list-style: none; margin: 0; padding: 0; }
.cal-item { display: grid; grid-template-columns: 130px 110px 1fr auto; gap: 12px; align-items: center; padding: 9px 0;
  border-bottom: 1px solid var(--border); font-size: 14px; }
.cal-item.est { color: var(--text-secondary); }
.cal-item small { color: var(--text-muted); }
.cal-date { font-variant-numeric: tabular-nums; font-weight: 600; }
.cal-days { color: var(--text-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.badge.cal-results { background: var(--series-1); color: #fff; }
.badge.cal-agm { background: var(--good); color: #fff; }
.badge.cal-sales { background: var(--chip); }
.next-ev { margin-top: 8px; font-size: 13px; color: var(--text-secondary); }
#cmpTable td:nth-child(2), #cmpTable th:nth-child(2) { text-align: left; }

/* riasztások */
.alert-quick { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; }
.alert-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; margin-bottom: 12px; }
.alert-form label { display: grid; gap: 3px; font-size: 13px; color: var(--text-secondary); }
.alert-form input, .alert-form select { font: inherit; padding: 6px 8px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--bg); color: var(--text-primary); }
.alert-form input[name=price] { width: 120px; } .alert-form input[name=note] { width: 240px; }
#alertTable tr.done td { color: var(--text-secondary); }
#alertTable td:nth-child(4), #alertTable th:nth-child(4) { text-align: left; }
.badge.alert-hit { background: var(--series-2); color: #fff; }
.link-btn.neutral { color: var(--accent); margin-right: 8px; }
.alert-bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: center; margin-top: 8px;
  padding: 10px 14px; border-radius: 8px; background: color-mix(in srgb, var(--series-2) 14%, var(--surface-1));
  border: 1px solid var(--series-2); font-size: 14px; }
.alert-bar-actions { display: flex; gap: 12px; align-items: center; }
.alert-bar-actions a { color: var(--accent); }
.btn.small-btn { padding: 5px 12px; font-size: 13px; }
.nav-sep { width: 1px; align-self: center; height: 18px; background: #3a4150; margin: 0 6px; }
.more-src { font-size: 11px; font-weight: 650; color: var(--accent); border: 1px solid var(--border); border-radius: 10px; padding: 0 6px; cursor: help; }
.hero .more-src { color: #fff; border-color: rgba(255,255,255,.45); }

/* frissítés folyamatjelző a fejléc alján */
.progress { background: var(--mast); padding-bottom: 6px; }
.progress-text { display: flex; justify-content: space-between; gap: 12px; font-size: 12.5px; color: #c9ced8; padding-top: 2px; padding-bottom: 4px;
  font-variant-numeric: tabular-nums; }
.progress-text span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.progress-track { height: 4px; background: #262c38; }
.progress-fill { height: 100%; width: 0; background: var(--series-1); transition: width .5s ease; }

/* szűrősáv */
.filters { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: -6px 0 14px; padding: 10px 12px;
  background: var(--surface-1); border: 1px solid var(--border); border-radius: 10px; }
.filters select, .filters input[type=search] { font: inherit; font-size: 14px; padding: 6px 10px; border: 1px solid var(--border);
  border-radius: 6px; background: var(--bg); color: var(--text-primary); }
.filters input[type=search] { flex: 1 1 260px; min-width: 200px; }
.filters .seg .n { opacity: .6; font-size: 12px; margin-left: 3px; }
.f-all { display: inline-flex; gap: 6px; align-items: center; font-size: 13.5px; color: var(--text-secondary); white-space: nowrap; }
.badge.tag-suv { background: var(--series-5); color: #fff; }
.badge.tag-electric { background: var(--series-3); color: #fff; }
.btn.ghost-dark { background: transparent; border: 1px solid #333a46; color: #c9ced8; }
#logoutForm { margin: 0; }

/* ---------- garázs ---------- */
.garage-tabs { flex-wrap: wrap; align-items: center; }
.garage-tabs .small-btn { margin-left: 6px; }
.garage-vform { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin-bottom: 16px; }
.garage-vform label, .doc-form label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--text-secondary); }
.garage-vform input, .doc-form input, .doc-form select { font: inherit; padding: 7px 10px; border: 1px solid var(--border);
  border-radius: 6px; background: var(--surface-1); color: var(--text-primary); min-width: 220px; }
.garage-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.garage-head h2 { margin: 0 0 4px; }
.garage-actions { display: flex; gap: 14px; }
.upload-btn { cursor: pointer; }
.drop-zone { border: 2px dashed var(--border); border-radius: 10px; padding: 14px; text-align: center; color: var(--text-muted);
  font-size: 13px; margin-bottom: 8px; }
.drop-zone.over { border-color: var(--accent); color: var(--text-primary); background: var(--surface-2, transparent); }
.upload-status { min-height: 18px; margin-bottom: 8px; }
.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.g-item { padding: 0; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; background: var(--surface-1);
  cursor: pointer; text-align: left; font: inherit; color: inherit; }
.g-item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.g-item:hover, .g-item:focus-visible { border-color: var(--accent); }
.g-cap { display: block; padding: 6px 8px; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.g-cap small { display: block; color: var(--text-muted); font-size: 12px; }
.doc-form { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin-bottom: 8px; }
.doc-form input[type=file] { padding: 5px; }
dialog.lightbox { width: min(1400px, 96vw); }
.lb-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.lb-actions .btn.ghost { margin: 0; color: #fff; border-color: #444; }
.lb-count { margin-left: 8px; font-weight: 400; color: #aaa; }
.lb-box { position: relative; display: flex; justify-content: center; background: #000; }
.lb-box img { max-width: 100%; max-height: 82vh; display: block; }
.lb-box .nc-arrow { top: 50%; }

.garage-vform[hidden] { display: none; }
.doc-table th, .doc-table td { text-align: left; vertical-align: middle; }
.doc-table td:last-child { text-align: right; white-space: nowrap; }
.doc-table .meta { margin-top: 2px; }

/* lábléc, impresszum */
.site-foot { margin-top: 40px; border-top: 1px solid var(--border); background: var(--surface-1); }
.foot-inner { display: flex; justify-content: space-between; gap: 6px 20px; flex-wrap: wrap; padding-top: 14px; padding-bottom: 18px;
  font-size: 12.5px; color: var(--text-muted); }
.foot-inner a { color: var(--accent); }
.legal { max-width: 900px; }
.legal h2 { font-size: 16px; margin: 18px 0 6px; }
.legal h2:first-child { margin-top: 0; }
.legal p { margin: 0 0 8px; color: var(--text-secondary); line-height: 1.55; }

/* fotózott Mercedesek */
.spot-tab { white-space: nowrap; }
.spot-upload { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.spot-upload input[type=text], .spot-filter input { font: inherit; padding: 7px 10px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface-1); color: var(--text-primary); min-width: 280px; }
.spot-filter { margin: 4px 0 10px; }
.gallery-switch { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-secondary); cursor: pointer; }
.gallery-switch a { color: var(--accent); margin-left: 4px; }
.gal-intro { margin: -8px 0 12px; }
.gal-eras { margin-bottom: 14px; flex-wrap: nowrap; }
.gal-eras button { white-space: nowrap; }
.gal-eras .n { opacity: .6; font-size: 12px; margin-left: 3px; }
.gal-era { margin-bottom: 16px; }
.gal-era h2 { font-size: 17px; margin: 0 0 10px; }
.g-item { position: relative; }
.spot-pub { position: absolute; top: 6px; right: 6px; background: var(--accent); color: #fff; }
dialog.spot-dialog { width: min(1500px, 97vw); }
.spot-body { display: grid; grid-template-columns: minmax(0, 1fr) 340px; background: var(--surface-1); color: var(--text-primary); }
.spot-form { display: flex; flex-direction: column; gap: 10px; padding: 14px; }
.spot-form label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--text-secondary); }
.spot-form label.check { flex-direction: row; align-items: flex-start; gap: 8px; }
.spot-form input:not([type=checkbox]) { font: inherit; padding: 7px 10px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface-1); color: var(--text-primary); }
.spot-form a { color: var(--accent); }
.spot-btns { display: flex; gap: 14px; align-items: center; }
.web-add { padding: 0 0 14px; max-width: 760px; }
.web-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 640px) { .web-row { grid-template-columns: 1fr; } }
.web-dead { display: none; background: #b26a00; }
.g-item.dead .web-dead { display: inline-block; }
.tn-photo { position: absolute; top: 4px; left: 4px; font-size: 11px; background: rgba(0,0,0,.65); color: #fff; border-radius: 4px; padding: 1px 5px; }
.tt-photos { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.tt-photos .meta { flex: 1 1 100%; }
.tt-photos img { width: 84px; height: 60px; object-fit: cover; border-radius: 4px; margin: 0; }
@media (max-width: 900px) { .spot-body { grid-template-columns: 1fr; } }

/* áthúzásos sorrend */
.gallery .g-item { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.gallery .g-item img { -webkit-user-drag: none; pointer-events: none; }
.gallery.sorting .g-item { cursor: grabbing; transition: transform .12s; }
.gallery .g-item.dragging { opacity: .55; outline: 2px dashed var(--accent); outline-offset: 2px; z-index: 3; }
.sort-hint { margin: -4px 0 8px; }

/* hírforrások */
.src-intro p { margin: 0 0 10px; color: var(--text-secondary); line-height: 1.5; }
.src-tools { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.src-tools input { font: inherit; padding: 7px 10px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface-1); color: var(--text-primary); min-width: 280px; }
.src-group { margin-top: 14px; }
.src-group summary { cursor: pointer; display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.src-title { font-weight: 650; font-size: 16px; }
.src-desc { margin: 6px 0 4px; }
.src-bulk { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin: 4px 0 8px; }
.src-table th, .src-table td { text-align: left; vertical-align: middle; }
.src-table td:nth-child(2), .src-table th:nth-child(2) { text-align: right; }
.src-table .src-name { white-space: normal; min-width: 220px; }
.src-table tr.off td { color: var(--text-muted); }
.src-table tr.off .src-name { text-decoration: line-through; text-decoration-color: var(--text-muted); }
.src-table select { font: inherit; font-size: 13px; padding: 3px 6px; border: 1px solid var(--border); border-radius: 5px;
  background: var(--surface-1); color: var(--text-primary); max-width: 230px; }

/* ---------- mobil (telefon) ---------- */
@media (max-width: 700px) {
  .wrap { padding: 0 12px; }
  /* a fejléc görgetéskor nem foglal helyet; a menü egy sorban, oldalra húzható */
  .masthead { position: static; }
  .mast-inner { gap: 8px; padding-top: 10px; padding-bottom: 8px; }
  .brand { font-size: 19px; }
  .mast-right { flex: 1 1 100%; min-width: 0; }
  .masthead input[type=search] { flex: 1 1 auto; min-width: 0; width: auto; }
  .mast-right .btn, .mast-right .ghost-dark { flex: none; padding: 7px 10px; }
  .nav { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
    mask-image: linear-gradient(90deg, #000 88%, transparent); }
  .nav::-webkit-scrollbar { display: none; }
  .nav a { padding: 8px 8px 10px; }
  .nav-sep { flex: none; }
  .statusbar { font-size: 11.5px; }
  #mycar { display: none; }
  .page-title { font-size: 20px; }
  .card { padding: 14px 12px; }
  .hero { min-height: 280px; }
  .hero .over { padding: 40px 14px 14px; }
  /* hosszú cím mobilon se töltse ki a képernyőt: legfeljebb 4 sor, a kivonat 2 */
  .hero a.t { font-size: 19px; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
  .hero p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 0; }
  .lead-side a.t { font-size: 15.5px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .grid3 { gap: 12px; }
  .grid3 a.t { font-size: 14.5px; }
  .tiles { grid-template-columns: 1fr 1fr; gap: 8px; }
  .tile { padding: 8px 10px; }
  .tile .value { font-size: 18px; }
  .tile .sub { font-size: 11.5px; }
  .tree-wrap { max-height: calc(100vh - 60px); }
  .seg { max-width: 100%; overflow-x: auto; }
  .garage-head { flex-direction: column; align-items: flex-start; }
  .garage-vform input, .doc-form input, .doc-form select { min-width: 0; width: 100%; }
  .garage-vform label, .doc-form label { flex: 1 1 100%; }
  .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lb-actions .btn { padding: 4px 8px; }
  .spot-upload input[type=text], .spot-filter input { min-width: 0; width: 100%; }
  .spot-upload { width: 100%; }
  .src-tools input { min-width: 0; width: 100%; }
}
