/* ===== merged from v44-fixes.css ===== */
#helpPanel.hidden,
#historyModal.hidden,
#midCalcModal.hidden,
#aiModal.hidden{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

#helpPanel:not(.hidden),
#historyModal:not(.hidden),
#midCalcModal:not(.hidden),
#aiModal:not(.hidden){
  pointer-events:auto !important;
}

.layoutFlow,
.grid,
.panelInputs,
.panelResult,
.cardBody,
.formGrid,
.formGrid > div,
.resultBox{
  position:relative;
}

.panelInputs{ z-index: 3; }
.panelResult{ z-index: 1; }

button,
input,
select,
textarea{
  pointer-events:auto;
  touch-action:manipulation;
}

label[data-tooltip]::after,
.heroBanner::before,
.marketWrap::before{
  pointer-events:none !important;
}

#inputsCardBody[hidden]{
  display:none !important;
}


/* ===== merged from v45-user-friendly.css ===== */

:root{
  --bg0:#eef3f9;
  --bg1:#f7f9fc;
  --card:#ffffff;
  --card2:#ffffff;
  --line:#d9e3f0;
  --text:#17324d;
  --muted:#617a94;
  --accent:#1d74f5;
  --accent2:#0f9f7a;
  --danger:#d97706;
  --shadow:0 10px 28px rgba(27,56,93,.08);
  --radius:18px;
}

body{
  background:
    radial-gradient(900px 480px at 0% 0%, rgba(29,116,245,.08), transparent 55%),
    radial-gradient(760px 420px at 100% 0%, rgba(15,159,122,.07), transparent 60%),
    linear-gradient(180deg, #f7faff 0%, #eef3f9 100%) !important;
  color: var(--text) !important;
}

.wrap{
  max-width: 1280px !important;
  padding: 24px 16px 40px !important;
}

.heroBanner{
  min-height: 120px;
  border: 1px solid #dbe6f3 !important;
  border-radius: 24px !important;
  background:
    linear-gradient(135deg, rgba(20,84,180,.95), rgba(29,116,245,.92) 48%, rgba(15,159,122,.90)) !important;
  box-shadow: 0 18px 38px rgba(31,79,145,.16) !important;
}
.heroBanner::before{
  background: linear-gradient(90deg, rgba(255,255,255,.08), rgba(255,255,255,0)) !important;
}
.heroTitle{
  color: #fff !important;
  background: none !important;
  filter:none !important;
  text-shadow:none !important;
}
.heroSubtitle{
  color: rgba(255,255,255,.88) !important;
}

.topControls,
.vinToggleBar,
.vinWrap,
.startup-hint,
.uxOverview{
  max-width: 1280px !important;
}

.modeBar,
.cardLike,
.uxSummaryCard,
.uxMissingCard,
.vinField,
.card,
.startup-hint,
.marketWrap .row,
#marketBox,
.helpModal,
.midCard,
.aiCard{
  background: #fff !important;
  border: 1px solid #dbe6f3 !important;
  color: var(--text) !important;
  box-shadow: var(--shadow) !important;
}

.modeBar{
  padding: 16px 18px !important;
  border-radius: 22px !important;
}
.modeBarLabel,.uxCardHead,.formSectionEyebrow{
  color: #2b6fd6 !important;
}
.modeBarSub,.uxMissingLead,.muted,.sub,#vinInfo,.vinAutoHint,.helpModalSub,.helpTip,.historyTools,.historyList,.aiNote,.vshAsOf{
  color: var(--muted) !important;
}

.topActionRow{
  gap: 10px !important;
}
.btn{
  border: 1px solid #cddbef !important;
  background: #fff !important;
  color: #16324d !important;
  box-shadow: 0 2px 0 rgba(255,255,255,.9), 0 8px 18px rgba(23,50,77,.06) !important;
}
.btn:hover{ filter: brightness(0.98); }
.btn.accent,.btn.primary,.btn.good{
  background: linear-gradient(180deg, #2b7bff, #1763d8) !important;
  color: #fff !important;
  border-color:#1763d8 !important;
}
.btn.danger{
  background: linear-gradient(180deg, #f59e0b, #d97706) !important;
  color: #fff !important;
  border-color:#d97706 !important;
}
.btn.secondary,.btn.link{
  background:#f6f9fe !important;
}

.modeBtn{
  background:#f5f8fd !important;
  color:#33516d !important;
  border:1px solid #d5e0ee !important;
}
.modeBtn.active{
  background:linear-gradient(180deg, #2b7bff, #1763d8) !important;
  color:#fff !important;
  border-color:#1763d8 !important;
}

label{
  color:#4c6883 !important;
  font-weight:700 !important;
}
select,input,textarea{
  background:#fff !important;
  color:#17324d !important;
  border:1px solid #cbd9e8 !important;
  box-shadow: inset 0 1px 2px rgba(17,24,39,.03) !important;
}
select:focus,input:focus,textarea:focus{
  border-color:#2b7bff !important;
  box-shadow:0 0 0 4px rgba(43,123,255,.12) !important;
}
select{
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(76,104,131,.95) 50%),
    linear-gradient(135deg, rgba(76,104,131,.95) 50%, transparent 50%) !important;
}

.startup-hint{
  display:flex;
  align-items:flex-start;
  gap:12px;
  border-radius:18px !important;
}
.startup-hint .hintIcon{
  background:#eef5ff !important;
  color:#1763d8 !important;
}

.uxSummaryGrid{
  grid-template-columns: repeat(5, minmax(120px, 1fr)) !important;
}
.uxMetric{
  background:#f8fbff !important;
  border:1px solid #dce8f4 !important;
}
.uxStatePill{
  border-color:#c6dbff !important;
  background:#edf5ff !important;
  color:#1f4b7b !important;
}
.uxStatePill.is-ready{
  background:#ecfbf6 !important;
  border-color:#bfe9d8 !important;
  color:#0f7f64 !important;
}
.uxStatePill.is-warning{
  background:#fff7e9 !important;
  border-color:#f6d9a2 !important;
  color:#9a5e07 !important;
}
.uxStatePill.is-danger{
  background:#fff0f0 !important;
  border-color:#f3c1c1 !important;
  color:#b64646 !important;
}
.uxMissingChip{
  background:#f4f8fd !important;
  border-color:#d9e4f1 !important;
  color:#264561 !important;
}

.layoutFlow{
  margin-top: 16px !important;
}
.grid{
  display:grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, .9fr) !important;
  gap: 20px !important;
  align-items: start !important;
}
.panelInputs,.panelResult{
  position:relative !important;
  z-index:auto !important;
}
.panelResult{
  position: sticky !important;
  top: 16px !important;
}

.cardHeader{
  background:#f8fbff !important;
  border-bottom:1px solid #dde7f2 !important;
  padding:16px 18px !important;
}
.cardHeader h2, .midTitle, .helpModalTitle, .valueCommentTitle, .ageChartTitle{
  color:#17324d !important;
}

.cardBody{
  padding:18px !important;
}
.formGrid{
  gap:14px !important;
}
.formSectionBlock{
  background:#f7fafe;
  border:1px dashed #d6e2ef;
  border-radius:16px;
  padding:14px 15px;
}
.formSectionTitle{
  color:#17324d !important;
  font-weight:800 !important;
}
.formSectionText{
  color:var(--muted) !important;
}

.resultBox{
  background:linear-gradient(180deg, #ffffff, #fbfdff) !important;
  border-radius:20px !important;
}
.resultHeroPanel{
  background:linear-gradient(180deg, #eef6ff, #f8fbff) !important;
  border:1px solid #d5e6fb !important;
  box-shadow:none !important;
}
.price.heroPrice, .price, #vshOut{
  color:#1763d8 !important;
  text-shadow:none !important;
}
.warn,.smartWarn{
  background:#fff8ea !important;
  border:1px solid #f0d8a7 !important;
  color:#8a5b07 !important;
}
.vehicleState{
  background:#fff !important;
}
.valueComment,.marketComment,.marketPositionBox,.ageChartBox{
  background:#f8fbff !important;
  border:1px solid #d9e7f3 !important;
  color:#17324d !important;
}

.helpOverlay,
.midModal,
.aiModal{
  background: rgba(19, 38, 61, .26) !important;
  backdrop-filter: blur(8px) !important;
}

.demoBadge{
  background:#1763d8 !important;
  color:#fff !important;
  border:none !important;
}

@media (max-width: 1080px){
  .grid{
    grid-template-columns: 1fr !important;
  }
  .panelResult{
    position:relative !important;
    top:auto !important;
  }
}

@media (max-width: 760px){
  .wrap{
    padding:16px 12px 28px !important;
  }
  .uxOverview{
    grid-template-columns: 1fr !important;
    padding: 0 !important;
  }
  .uxSummaryGrid{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
  .topControls{
    padding:0 !important;
  }
  .topActionRow .btn.good{
    margin-left: 0 !important;
  }
  .vinInputRow{
    flex-direction:column !important;
  }
}


/* ===== merged from v47-contrast-fix.css ===== */

:root{
  --bg0:#dfe7f1;
  --bg1:#e8eef6;
  --text:#14263d;
  --muted:#465b73;
  --line:#c8d5e4;
}
body{
  background: linear-gradient(180deg, #eef3f8 0%, #dde6f0 100%) !important;
  color: var(--text) !important;
}
.wrap{ max-width: 1280px !important; }
.heroBanner{ box-shadow: 0 18px 40px rgba(16,40,72,.18) !important; }
.modeBar,
.cardLike,
.uxSummaryCard,
.uxMissingCard,
.vinField,
.card,
.startup-hint,
.marketWrap .row,
#marketBox,
.helpModal,
.midCard,
.aiCard{
  background:#f7fafd !important;
  border:1px solid #cad7e6 !important;
  box-shadow:0 8px 26px rgba(18,38,61,.07) !important;
}
.muted,.sub,#vinInfo,.vinAutoHint,.uxMissingLead,.modeBarSub,.aiNote,.vshAsOf,.helpModalSub,.helpTip{ color:#52667f !important; }
.cardHeader{ background:#eef4fb !important; }
.cardHeader h2,.midTitle,.helpModalTitle,.valueCommentTitle,.ageChartTitle,#calcStatus,.resultBox .price,.resultBox .price.heroPrice,#vshOut{ color:#16324d !important; }
#vshOut{ font-weight:900 !important; }
#calcStatus{ color:#36516d !important; font-weight:700 !important; }
.uxStatePill,.uxMissingChip,.vinTag,.marketStatusTag,.availabilityBadge{ color:#24425f !important; }
.uxMissingChip{ background:#edf3fa !important; border-color:#cfdae7 !important; }
.uxMetric{ background:#f2f7fc !important; border-color:#d4deea !important; }
label{ color:#3e556d !important; }
select,input,textarea{
  -webkit-appearance:auto !important;
  appearance:auto !important;
  background:#ffffff !important;
  color:#13263b !important;
  border:1px solid #b8c8da !important;
  background-image:none !important;
  box-shadow:none !important;
}
select option{ color:#13263b !important; background:#fff !important; }
select::placeholder,input::placeholder,textarea::placeholder{ color:#74879b !important; }
select:focus,input:focus,textarea:focus{ border-color:#256be6 !important; box-shadow:0 0 0 4px rgba(37,107,230,.12) !important; }
.formSectionBlock{ background:#f1f6fb !important; border:1px solid #d5e0eb !important; }
.resultBox,.resultHeroPanel,.valueComment,.marketComment,.marketPositionBox,.ageChartBox{ background:#f8fbfe !important; border-color:#d4dfeb !important; color:#17324d !important; }
.warn,.smartWarn{ background:#fff1d8 !important; border-color:#efc77d !important; color:#7a4f00 !important; }
.btn{ color:#18314c !important; border-color:#bccddd !important; }
.btn.secondary,.btn.link{ background:#eef4fb !important; }
.topControls .btn:not(.accent):not(.primary):not(.good):not(.danger){ background:#f6f9fc !important; }
.vinSummaryWrap,.vinSummaryBlock{ color:#18314c !important; }
.vinSummaryWrap{ background:#e6ebf2 !important; border:1px solid #c8d2dd !important; }
.vinSummaryTitle,.vinSummaryBlock h4,.formSectionTitle{ color:#1b3450 !important; }
.vinSummaryNote{ color:#6a4d00 !important; }
.demoBadge{ background:#103b73 !important; }


/* ===== merged from v48-contrast-tune.css ===== */

:root{
  --text:#102235;
  --muted:#43566a;
  --line:#bccadc;
  --panel:#ffffff;
  --panel-soft:#f3f7fc;
  --bg:#dbe5f0;
  --bg2:#eaf0f7;
  --accent:#255fda;
  --accent-2:#0f7f7a;
}
body{
  background:
    radial-gradient(900px 420px at 0% 0%, rgba(37,95,218,.10), transparent 58%),
    radial-gradient(760px 380px at 100% 0%, rgba(15,127,122,.08), transparent 60%),
    linear-gradient(180deg, #edf3f9 0%, #dbe5f0 100%) !important;
  color:var(--text) !important;
}
.wrap{ max-width:1320px !important; }
.heroBanner{
  background: linear-gradient(135deg, #2a56d4 0%, #4e7ef2 48%, #4f9f96 100%) !important;
  border:1px solid rgba(255,255,255,.18) !important;
}
.modeBar,.cardLike,.uxSummaryCard,.uxMissingCard,.vinField,.card,.startup-hint,.marketWrap .row,#marketBox,.helpModal,.midCard,.aiCard{
  background:var(--panel) !important;
  border:1px solid #c4d2e1 !important;
  box-shadow:0 10px 28px rgba(16,34,53,.09) !important;
}
.cardHeader{
  background:linear-gradient(180deg, #f8fbff 0%, #eff5fb 100%) !important;
  border-bottom:1px solid #d3deea !important;
}
.cardHeader h2,.midTitle,.helpModalTitle,.valueCommentTitle,.ageChartTitle,#calcStatus,#vshOut,.resultBox .price,.resultBox .price.heroPrice{
  color:var(--text) !important;
}
.muted,.sub,#vinInfo,.vinAutoHint,.uxMissingLead,.modeBarSub,.aiNote,.vshAsOf,.helpModalSub,.helpTip{
  color:var(--muted) !important;
}
label,.vinSummaryTitle,.vinSummaryBlock h4,.formSectionTitle,.uxCardHead,.modeBarLabel{
  color:#213c58 !important;
}
input,select,textarea{
  background:#fff !important;
  color:var(--text) !important;
  border:1px solid #b0c2d6 !important;
}
input:focus,select:focus,textarea:focus{
  border-color:#255fda !important;
  box-shadow:0 0 0 4px rgba(37,95,218,.14) !important;
}
.uxMetric{
  background:#f4f8fd !important;
  border-color:#d6e1ec !important;
}
.uxStatePill{
  font-weight:800 !important;
}
.uxStatePill.is-ready{
  background:#e6f5ef !important;
  border-color:#b9decf !important;
  color:#0f6a56 !important;
}
.uxStatePill.is-warning{
  background:#fff4de !important;
  border-color:#ebca86 !important;
  color:#8c5600 !important;
}
.uxStatePill.is-danger{
  background:#fff0ef !important;
  border-color:#efc1be !important;
  color:#9f3e36 !important;
}
.uxStatePill.is-muted{
  background:#edf4ff !important;
  border-color:#c8daf6 !important;
  color:#25486f !important;
}
.uxMissingChip{
  background:#edf3fa !important;
  border-color:#cad7e5 !important;
  color:#203a56 !important;
}
.resultHeroPanel{
  background:linear-gradient(180deg, #ffffff 0%, #f2f7fd 100%) !important;
  border:1px solid #d0dceb !important;
}
#vshOut{
  color:#102235 !important;
  font-size:clamp(34px, 4vw, 54px) !important;
  letter-spacing:-0.02em !important;
  font-weight:900 !important;
}
#calcStatus{
  color:#334f69 !important;
  font-weight:800 !important;
}
.warn,.smartWarn{
  background:#fff0d7 !important;
  border:1px solid #efc577 !important;
  color:#744a00 !important;
}
.btn{
  color:#18304a !important;
  border-color:#b9cbde !important;
  background:#ffffff !important;
}
.btn.accent,.btn.primary,.btn.good{
  background:linear-gradient(180deg, #3d73f0 0%, #255fda 100%) !important;
  border-color:#255fda !important;
  color:#fff !important;
}
.btn.danger{
  background:linear-gradient(180deg, #eba43a 0%, #d98a19 100%) !important;
  border-color:#d98a19 !important;
  color:#fff !important;
}
.topControls .btn:not(.accent):not(.primary):not(.good):not(.danger){
  background:#f8fbff !important;
}
.formSectionBlock{
  background:#f7fbff !important;
  border:1px solid #d7e2ee !important;
}
.valueComment,.marketComment,.marketPositionBox,.ageChartBox{
  background:#f7fbff !important;
  border:1px solid #d6e2ee !important;
}
.marketWrap .stat,.statCard{
  background:#f7fbff !important;
  border-color:#d7e1ec !important;
}
.demoBadge{
  background:#183f85 !important;
}


/* ===== merged from v49-contrast.css ===== */

:root{
  --text:#1f3047 !important;
  --muted:#566b86 !important;
  --line:#b8c9df !important;
}
body{
  background:
    radial-gradient(900px 520px at 0% 0%, rgba(66,108,192,.12), transparent 55%),
    radial-gradient(760px 460px at 100% 0%, rgba(31,130,104,.10), transparent 60%),
    linear-gradient(180deg, #e8eef6 0%, #d7e0ec 100%) !important;
  color:#1f3047 !important;
}
.heroBanner{
  background: linear-gradient(135deg, #325fd6, #3e79f1 48%, #4ea39a) !important;
}
.heroTitle, .heroSubtitle{
  text-shadow: 0 1px 0 rgba(0,0,0,.10) !important;
}
.card, .cardLike, .modeBar, .vinField, .uxSummaryCard, .uxMissingCard, .startup-hint, .resultBox, .marketWrap .row, .marketPositionBox, .valueComment, .ageChartBox{
  background:#f9fbfe !important;
  border-color:#c0cfdf !important;
  box-shadow:0 10px 24px rgba(40,65,95,.08) !important;
}
.cardHeader, .resultHeroPanel, .formSectionBlock{
  background:#f0f5fb !important;
  border-color:#cad6e3 !important;
}
body, p, div, span, label, input, select, textarea, button, h1, h2, h3, h4{
  color:#1f3047;
}
.muted, .sub, #vinInfo, .vinAutoHint, .uxMissingLead, .modeBarSub, .formSectionText, .vshAsOf{
  color:#5b6e88 !important;
}
label, .formSectionTitle, .midTitle, .helpModalTitle{
  color:#213652 !important;
}
input, select, textarea{
  background:#ffffff !important;
  color:#213652 !important;
  border:2px solid #adc0d7 !important;
}
input:focus, select:focus, textarea:focus{
  border-color:#2767df !important;
  box-shadow:0 0 0 4px rgba(39,103,223,.14) !important;
}
.btn{
  border-color:#b2c5df !important;
  color:#213652 !important;
}
.btn.primary, .btn.accent, .btn.good, .modeBtn.active{
  background:linear-gradient(180deg, #2f6ff1, #245ed0) !important;
  color:#fff !important;
  border-color:#245ed0 !important;
}
.btn.danger{
  background:linear-gradient(180deg, #eba231, #d88711) !important;
  color:#fff !important;
  border-color:#d88711 !important;
}
.warn{
  background:#fff5df !important;
  border:2px solid #e6c26a !important;
  color:#7f5714 !important;
}
.price.heroPrice, #vshOut{
  color:#1d4fb8 !important;
}
.demoBadge{
  background:#214ea6 !important;
  color:#fff !important;
}


/* ===== merged from v50-contrast.css ===== */
:root{
  --okc-bg:#dfe7f2;
  --okc-surface:#ffffff;
  --okc-surface-2:#f6f9fd;
  --okc-line:#c0cfdf;
  --okc-line-strong:#9eb2c9;
  --okc-text:#172b45;
  --okc-muted:#4f6580;
  --okc-blue:#1f61d8;
  --okc-blue-2:#174fb4;
  --okc-blue-soft:#eaf2ff;
  --okc-amber:#c88a1c;
  --okc-amber-bg:#fff4de;
  --okc-ok:#187f53;
  --okc-ok-bg:#eaf8f0;
  --okc-shadow:0 10px 26px rgba(18,43,72,.08);
}
body{
  background:linear-gradient(180deg,#eef3f8 0%, #dfe7f2 100%) !important;
  color:var(--okc-text) !important;
}
.heroTitle,.heroSubtitle,.modeBarLabel,.cardHeader h2,.uxCardHead,.formSectionTitle,.resultHead h2,.midTitle,.helpModalTitle{
  color:var(--okc-text) !important;
}
.muted,.sub,.modeBarSub,.uxMissingLead,.formSectionText,.helpModalSub,.vshAsOf,.historyTools,.historyList,.aiNote,#vinInfo,.vinAutoHint{
  color:var(--okc-muted) !important;
}
.card,.cardLike,.modeBar,.vinField,.uxSummaryCard,.uxMissingCard,.startup-hint,.midCard,.helpModal,.aiCard,#marketBox,.marketWrap .row{
  background:var(--okc-surface) !important;
  border:1px solid var(--okc-line) !important;
  box-shadow:var(--okc-shadow) !important;
}
.cardHeader{
  background:var(--okc-surface-2) !important;
  border-bottom:1px solid var(--okc-line) !important;
}
.uxMetric{
  background:#f7fbff !important;
  border:1px solid var(--okc-line) !important;
}
.btn{
  color:var(--okc-text) !important;
  border:1px solid var(--okc-line-strong) !important;
  background:#fff !important;
}
.btn.primary,.btn.accent,.btn.good,.modeBtn.active{
  background:linear-gradient(180deg,var(--okc-blue),var(--okc-blue-2)) !important;
  border-color:var(--okc-blue-2) !important;
  color:#fff !important;
}
.btn.danger{
  background:linear-gradient(180deg,#df9a24,#c78312) !important;
  border-color:#c78312 !important;
  color:#fff !important;
}
.modeBtn{
  background:#f5f8fc !important;
  border:1px solid var(--okc-line) !important;
  color:#2b4360 !important;
}
select,input,textarea{
  color:var(--okc-text) !important;
  background:#fff !important;
  border:2px solid #a8bbd0 !important;
}
select:focus,input:focus,textarea:focus{
  border-color:var(--okc-blue) !important;
  box-shadow:0 0 0 4px rgba(31,97,216,.14) !important;
}
.price,.heroPrice,#vshOut{
  color:var(--okc-blue-2) !important;
}
.warn,.smartWarn{
  color:#7a4d09 !important;
  background:var(--okc-amber-bg) !important;
  border:2px solid #dfbc73 !important;
}
.fieldStatus.valid,.fieldOk,.okPill{
  color:var(--okc-ok) !important;
}
.uxStatePill,.statusPill{
  color:#1e3f66 !important;
  background:var(--okc-blue-soft) !important;
  border:1px solid #b8cff3 !important;
}
.uxStatePill.is-ready{ background:var(--okc-ok-bg) !important; color:var(--okc-ok) !important; border-color:#aad9bf !important; }
.uxStatePill.is-warning{ background:var(--okc-amber-bg) !important; color:#7a4d09 !important; border-color:#dfbc73 !important; }
.uxStatePill.is-danger{ background:#fff0ef !important; color:#a23a32 !important; border-color:#edb1aa !important; }
.demoBadge{
  background:#204d9f !important;
  color:#fff !important;
  border:none !important;
  box-shadow:0 8px 20px rgba(16,36,68,.18) !important;
}


/* ===== merged from v51-visual-polish.css ===== */

:root{
  --v51-bg:#d9e3ef;
  --v51-surface:#ffffff;
  --v51-surface-soft:#f4f8fd;
  --v51-line:#b8c7d8;
  --v51-line-strong:#96acc3;
  --v51-text:#1a2f49;
  --v51-text-2:#2e4867;
  --v51-muted:#516882;
  --v51-blue:#1f63dd;
  --v51-blue-2:#174fb8;
  --v51-blue-soft:#e9f2ff;
  --v51-amber:#a86b08;
  --v51-amber-bg:#fff3dc;
  --v51-green:#167a53;
  --v51-green-bg:#edf9f2;
  --v51-shadow:0 14px 34px rgba(18,43,72,.08);
}

body{
  background:
    radial-gradient(900px 420px at 0% 0%, rgba(31,99,221,.08), transparent 54%),
    linear-gradient(180deg, #edf3f9 0%, var(--v51-bg) 100%) !important;
  color:var(--v51-text) !important;
}

.wrap{ max-width:1280px !important; }
.heroBanner{
  box-shadow:0 18px 40px rgba(24,64,122,.18) !important;
}
.heroTitle, .heroSubtitle{ text-shadow:none !important; }

.topControls, .startup-hint, .uxOverview, .vinWrap, .vinToggleBar{
  max-width:1280px !important;
}

.card,
.cardLike,
.modeBar,
.vinField,
.uxSummaryCard,
.uxMissingCard,
.startup-hint,
.resultBox,
.midCard,
.helpModal,
.aiCard,
#marketBox,
.marketWrap .row,
.ageChartBox,
.valueComment,
.marketComment,
.marketPositionBox{
  background:var(--v51-surface) !important;
  border:1px solid var(--v51-line) !important;
  box-shadow:var(--v51-shadow) !important;
  color:var(--v51-text) !important;
}

.cardHeader,
.resultHead,
.midHeader,
.aiHead{
  background:linear-gradient(180deg, #f8fbff, #f1f6fc) !important;
  border-bottom:1px solid var(--v51-line) !important;
}

.cardHeader h2,
.resultHead h2,
.midTitle,
.helpModalTitle,
.aiTitle,
.valueCommentTitle,
.ageChartTitle,
.uxCardHead,
.modeBarLabel,
.formSectionTitle{
  color:var(--v51-text) !important;
}

.muted,
.sub,
.modeBarSub,
.uxMissingLead,
.formSectionText,
.helpModalSub,
.vshAsOf,
.historyTools,
.historyList,
.aiNote,
#vinInfo,
.vinAutoHint,
.marketMeta .muted,
.k,
.stat .k{
  color:var(--v51-muted) !important;
}

label,
.formSectionEyebrow{
  color:var(--v51-text-2) !important;
}

.btn{
  border:1px solid var(--v51-line-strong) !important;
  background:#fff !important;
  color:var(--v51-text) !important;
  box-shadow:0 2px 0 rgba(255,255,255,.75), 0 8px 18px rgba(17,34,58,.05) !important;
}
.btn:hover{ filter:brightness(.985); }
.btn.primary,
.btn.accent,
.btn.good,
.modeBtn.active{
  background:linear-gradient(180deg, var(--v51-blue), var(--v51-blue-2)) !important;
  border-color:var(--v51-blue-2) !important;
  color:#fff !important;
}
.btn.danger{
  background:linear-gradient(180deg, #e7a226, #ca8210) !important;
  border-color:#c27b0d !important;
  color:#fff !important;
}
.modeBtn{
  background:#f8fbff !important;
  border:1px solid #c2cfdd !important;
  color:var(--v51-text-2) !important;
}
.modeBtn.active{
  box-shadow:inset 0 -2px 0 rgba(255,255,255,.14), 0 10px 22px rgba(31,99,221,.20) !important;
}

.topActionRow #clearFormBtn{
  display:none !important;
}
.topActionRow{
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
}

select,
input,
textarea{
  background:#fff !important;
  color:var(--v51-text) !important;
  border:2px solid #aabdd2 !important;
}
select::placeholder,
input::placeholder,
textarea::placeholder{
  color:#7388a1 !important;
  opacity:1 !important;
}
select option{
  color:var(--v51-text) !important;
  background:#fff !important;
}
select:focus,
input:focus,
textarea:focus{
  border-color:var(--v51-blue) !important;
  box-shadow:0 0 0 4px rgba(31,99,221,.12) !important;
}

.resultHeroPanel{
  background:linear-gradient(180deg, #ffffff 0%, #f3f8fe 100%) !important;
  border:1px solid #cad8e6 !important;
  box-shadow:none !important;
}
.vshMetaLine{
  color:#607892 !important;
}
.vshMetaItem,
.vshMetaItem b,
#calcIdUi,
#calcDateUi{
  color:#334b66 !important;
}
.vshMetaItem b{
  font-weight:800 !important;
}
.price,
.heroPrice,
#vshOut{
  color:#174fb8 !important;
  text-shadow:none !important;
}
#calcStatus{
  color:#35516f !important;
  font-weight:700 !important;
}
#inputWarn,
#smartWarn,
.warn,
.smartWarn{
  background:var(--v51-amber-bg) !important;
  color:var(--v51-amber) !important;
  border:2px solid #e1bf78 !important;
}
.vehicleState{
  background:#fff !important;
  color:#294664 !important;
  border:1px solid #c5d2e0 !important;
}
.vehicleState.excellent,
.vehicleState.high{
  background:var(--v51-green-bg) !important;
  color:var(--v51-green) !important;
  border-color:#a9d7be !important;
}
.vehicleState.good,
.vehicleState.mid{
  background:#edf5ff !important;
  color:#22548c !important;
  border-color:#b8cff3 !important;
}
.vehicleState.soft,
.vehicleState.low,
.vehicleState.attn{
  background:#fff3dc !important;
  color:#975f06 !important;
  border-color:#e1bf78 !important;
}

.valueComment{
  background:#f7fbff !important;
  border-color:#d4e2ef !important;
}
.valueCommentTitle{
  color:#1d4e89 !important;
}
.valueCommentBody{
  color:#304a67 !important;
}
.marketComment{
  background:#f4fbf6 !important;
  border-color:#bfdac6 !important;
  color:#28583f !important;
}
.marketPositionBox{
  background:#f8fbff !important;
  border-color:#d4e2ef !important;
  color:#304a67 !important;
}
.ageChartBox{
  background:#ffffff !important;
  border-color:#d4e2ef !important;
}
.ageChartPill{
  background:#fff !important;
  border-color:#c7d6e6 !important;
  color:#35516f !important;
}
.ageChartVshHover{ cursor: help; }

.valueRange,
#valueRange{
  background:#eef7ff !important;
  border-color:#c4def6 !important;
  padding:10px 12px !important;
  border-radius:14px !important;
}
.valueRangeLabel{
  color:#4670a5 !important;
  font-size:11px !important;
  margin-bottom:4px !important;
}
.valueRangeValue{
  color:#1956a8 !important;
  font-size:14px !important;
  font-weight:900 !important;
}
.pRangeInline,
.pRangeInline b{
  color:#3a5675 !important;
}

.marketWrap::before{
  display:none !important;
}
.marketWrap{
  padding-top:16px !important;
  border-top:1px solid #d4e2ef !important;
}
#marketBox{
  background:linear-gradient(180deg, #ffffff, #f7fbff) !important;
}

#newCalcBtn,
#proposalNewCalcBtn,
#proposalHeaderNewCalcBtn{
  display: none !important;
}

body.mode-expert #marketBox,
body.mode-basic #marketBox{
  display: none !important;
}

body.mode-expert #heroBuySellWrap.hidden,
body.mode-basic #heroBuySellWrap.hidden{
  display: flex !important;
}
body.mode-expert #valueRangeBox.hidden,
body.mode-basic #valueRangeBox.hidden{
  display: block !important;
}

/* „Ďalší krok“ — dve vetvy v HTML, prepínač podľa režimu (rovnaká logika ako app-ui.css) */
.marketNextCtaLead--manual,
.marketNextCtaBtn--manual,
.marketNextStepText--manual,
.autoToExpertLabel--manual{ display: none !important; }
body.mode-expert .marketNextCtaLead--auto,
body.mode-basic .marketNextCtaLead--auto,
body.mode-expert .marketNextCtaBtn--auto,
body.mode-basic .marketNextCtaBtn--auto,
body.workspace-expert .marketNextCtaLead--auto,
body.workspace-basic .marketNextCtaLead--auto,
body.workspace-expert .marketNextCtaBtn--auto,
body.workspace-basic .marketNextCtaBtn--auto{ display: none !important; }
body.mode-expert .marketNextCtaLead--manual,
body.mode-basic .marketNextCtaLead--manual,
body.mode-expert .marketNextCtaBtn--manual,
body.mode-basic .marketNextCtaBtn--manual,
body.workspace-expert .marketNextCtaLead--manual,
body.workspace-basic .marketNextCtaLead--manual,
body.workspace-expert .marketNextCtaBtn--manual,
body.workspace-basic .marketNextCtaBtn--manual{ display: block !important; }
body.mode-expert .marketNextCtaBtn--manual,
body.mode-basic .marketNextCtaBtn--manual,
body.workspace-expert .marketNextCtaBtn--manual,
body.workspace-basic .marketNextCtaBtn--manual{ display: inline !important; }
body.mode-expert .marketNextStepText--auto,
body.mode-basic .marketNextStepText--auto,
body.workspace-expert .marketNextStepText--auto,
body.workspace-basic .marketNextStepText--auto{ display: none !important; }
body.mode-expert .marketNextStepText--manual,
body.mode-basic .marketNextStepText--manual,
body.workspace-expert .marketNextStepText--manual,
body.workspace-basic .marketNextStepText--manual{ display: block !important; }
body.mode-expert .autoToExpertLabel--auto,
body.mode-basic .autoToExpertLabel--auto,
body.workspace-expert .autoToExpertLabel--auto,
body.workspace-basic .autoToExpertLabel--auto{ display: none !important; }
body.mode-expert .autoToExpertLabel--manual,
body.mode-basic .autoToExpertLabel--manual,
body.workspace-expert .autoToExpertLabel--manual,
body.workspace-basic .autoToExpertLabel--manual{ display: inline !important; }
body.mode-auto.okc-expert-switch-on .marketNextCtaLead--auto,
body.mode-auto.okc-expert-switch-on .marketNextCtaBtn--auto{ display: none !important; }
body.mode-auto.okc-expert-switch-on .marketNextCtaLead--manual,
body.mode-auto.okc-expert-switch-on .marketNextCtaBtn--manual{ display: block !important; }
body.mode-auto.okc-expert-switch-on .marketNextCtaBtn--manual{ display: inline !important; }

button#openManualFromMarketBtn.btn.primary,
button#openManualFromMarketBtn.btn.primary .marketNextCtaBtn{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

.marketActionsGrid .btn.ai{
  color:#8a640d !important;
  background:#fff8e6 !important;
  border-color:#e6cf8e !important;
}
.stat{
  background:#ffffff !important;
  border:1px solid #d3e0eb !important;
}
.stat .v,
#mCount,#mAvg,#mMed,#mRange{
  color:#1a2f49 !important;
}
#marketStatus{
  color:#36516f !important;
  font-weight:700 !important;
}

.startup-hint{
  background:#ffffff !important;
  border:1px solid #c6d4e2 !important;
}
.startup-hint .hintIcon{
  color:var(--v51-blue) !important;
  background:#eaf2ff !important;
}
.startup-hint.ready{
  background:#f0faf4 !important;
  border-color:#b5d8c2 !important;
}
.startup-hint.ready .hintText{
  color:#216344 !important;
}
.startup-hint.busy{
  background:#eef5ff !important;
  border-color:#bdd1ef !important;
}
.startup-hint .hintText{
  color:#35516f !important;
}

.midModal,
.helpOverlay,
.aiModal{
  background:rgba(17,31,51,.26) !important;
  backdrop-filter:blur(8px) !important;
}
.midCard{
  background:#ffffff !important;
  border:1px solid #c8d6e4 !important;
}
.midHeader{
  background:linear-gradient(180deg, #f8fbff, #edf4fb) !important;
}
.midTitle,
.midHeader .btn,
.midClose{
  color:var(--v51-text) !important;
}
.historySearch,
.historySort{
  background:#ffffff !important;
  color:var(--v51-text) !important;
  border:2px solid #aec1d5 !important;
}
.histItem{
  background:#f3f7fc !important;
  border:1px solid #d2deea !important;
  box-shadow:none !important;
}
.histItem:hover{
  background:#eef5ff !important;
  border-color:#b9cff3 !important;
}
.histTitle,
.histTop .t{
  color:var(--v51-text) !important;
}
.histMeta{
  color:#607892 !important;
}
.histPrice,
.histTop .p{
  color:#1760d1 !important;
  background:none !important;
  -webkit-text-fill-color:#1760d1 !important;
  filter:none !important;
}
.historyStarOnly{
  color:#8b6b12 !important;
  background:#fff9ea !important;
  border-color:#ecd38c !important;
}

#helpPanel .helpModalBody,
.helpModalBody,
.aiBody{
  color:var(--v51-text) !important;
}

.demoBadge{
  background:#204ea4 !important;
  color:#fff !important;
  box-shadow:0 10px 24px rgba(16,36,68,.18) !important;
}

.infoBubble{
  color:#203752 !important;
  background:#ffffff !important;
  border-color:#cad8e6 !important;
  box-shadow:0 12px 28px rgba(17,34,58,.12) !important;
}

@media (max-width: 900px){
  .topActionRow{
    grid-template-columns:1fr !important;
  }
  .demoBadge{
    top:22px !important;
    right:18px !important;
  }
}

@media (max-width: 700px){
  .resultHeroPanel{
    padding:14px 12px 12px !important;
  }
  .vshMetaLine{
    gap:4px !important;
  }
  .midCard{
    border-radius:24px !important;
  }
}


/* ===== merged from v52-visual-refresh.css ===== */

:root{
  --v52-bg:#dbe5f0;
  --v52-line:#bccddd;
  --v52-text:#162d46;
  --v52-text-2:#294766;
  --v52-muted:#58718d;
  --v52-shadow:0 14px 34px rgba(18,43,72,.07);
}
body{
  background:
    radial-gradient(860px 380px at 0% 0%, rgba(29,99,221,.07), transparent 52%),
    radial-gradient(720px 320px at 100% 0%, rgba(21,128,93,.06), transparent 54%),
    linear-gradient(180deg, #edf3f8 0%, var(--v52-bg) 100%) !important;
  color:var(--v52-text) !important;
}
.card,.cardLike,.modeBar,.vinField,.uxSummaryCard,.uxMissingCard,.startup-hint,.resultBox,.midCard,.helpModal,.aiCard,#marketBox,.marketWrap .row,.ageChartBox,.valueComment,.marketComment,.marketPositionBox{border-color:var(--v52-line) !important;box-shadow:var(--v52-shadow) !important;color:var(--v52-text) !important;}
.cardHeader,.resultHead,.midHeader,.aiHead{background:linear-gradient(180deg, #fbfdff, #f1f6fb) !important;border-bottom:1px solid var(--v52-line) !important;}
.cardHeader h2,.resultHead h2,.midTitle,.helpModalTitle,.aiTitle,.valueCommentTitle,.ageChartTitle,.uxCardHead,.modeBarLabel,.formSectionTitle{color:var(--v52-text) !important;}
label,.formSectionEyebrow,.field label,.valueRangeLabel,.marketPosTitle,.marketDeviationTitle{color:var(--v52-text-2) !important;}
.muted,.sub,.modeBarSub,.uxMissingLead,.formSectionText,.helpModalSub,.vshAsOf,.historyTools,.historyList,.aiNote,#vinInfo,.vinAutoHint,.marketMeta .muted,.k,.stat .k{color:var(--v52-muted) !important;}
.valueComment{background:#ffffff !important;border-color:#cfe0ed !important;}
.valueCommentTitle{color:#1c4f89 !important;}
.valueCommentBody{color:#304b67 !important;font-weight:500 !important;}
.marketComment{background:#f2fbf5 !important;border:2px solid #b9ddc3 !important;color:#28533e !important;font-weight:600 !important;line-height:1.6 !important;}
.marketPositionBox{background:linear-gradient(180deg, #ffffff 0%, #f6fbff 100%) !important;border:2px solid #cfe0ed !important;padding:16px 16px 14px !important;}
.marketPosTitle{font-size:14px !important;font-weight:800 !important;margin-bottom:10px !important;}
.marketPosScale{gap:12px !important;align-items:center !important;}
.marketPosMin,.marketPosMax{color:var(--v52-muted) !important;font-size:14px !important;font-weight:700 !important;white-space:nowrap !important;}
.marketPosTrack{position:relative !important;height:14px !important;background:linear-gradient(90deg, #eef3f9, #ffffff 48%, #eef3f9) !important;border:2px solid #bfd0df !important;border-radius:999px !important;overflow:visible !important;}
.marketPosTrackFill{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:linear-gradient(90deg, rgba(96,165,250,.38), rgba(56,189,248,.38), rgba(34,197,94,.32));}
.marketPosTrack::after{content:"";position:absolute;left:50%;top:-4px;bottom:-4px;width:2px;background:#c4d3e3;transform:translateX(-50%);border-radius:999px;}
.marketPosDot{width:18px !important;height:18px !important;background:#0f9f7a !important;border:3px solid #ffffff !important;box-shadow:0 0 0 5px rgba(15,159,122,.18) !important;}
.marketPosValue{margin-top:10px !important;font-size:18px !important;font-weight:900 !important;color:var(--v52-text) !important;}
.marketDeviation{margin-top:14px;padding:14px;border-radius:16px;border:2px solid #d8e6f2;background:#ffffff;}
.marketDeviationHead{display:flex;gap:10px;align-items:flex-start;justify-content:space-between;margin-bottom:10px;flex-wrap:wrap;}
.marketDeviationTitle{font-size:14px;font-weight:800;margin:0;}
.marketDeviationBadge{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:8px 12px;border-radius:999px;font-size:13px;font-weight:900;letter-spacing:.01em;border:2px solid transparent;}
.marketDeviation--below{background:linear-gradient(180deg, #f5fbff, #ffffff);border-color:#c9ddf0;}
.marketDeviation--below .marketDeviationBadge{background:#eaf4ff;border-color:#c5dcf4;color:#1d5d9f;}
.marketDeviation--above{background:linear-gradient(180deg, #fffaf1, #ffffff);border-color:#efd7a0;}
.marketDeviation--above .marketDeviationBadge{background:#fff1cf;border-color:#ecd090;color:#965f07;}
.marketDeviation--near{background:linear-gradient(180deg, #f2fbf5, #ffffff);border-color:#c5e3d0;}
.marketDeviation--near .marketDeviationBadge{background:#edf9f2;border-color:#bfe0cc;color:#1a7b57;}
.marketDeviationBar{position:relative;height:14px;border-radius:999px;border:2px solid #bfd0df;background:linear-gradient(90deg, rgba(96,165,250,.22) 0%, rgba(235,241,248,.95) 50%, rgba(251,191,36,.24) 100%);overflow:visible;}
.marketDeviationCenter{position:absolute;left:50%;top:-5px;bottom:-5px;width:2px;background:#8ea4bb;transform:translateX(-50%);border-radius:999px;}
.marketDeviationFill{position:absolute;top:0;bottom:0;border-radius:999px;background:linear-gradient(90deg, rgba(34,197,94,.38), rgba(56,189,248,.48), rgba(29,99,221,.45));}
.marketDeviation--above .marketDeviationFill{background:linear-gradient(90deg, rgba(245,158,11,.45), rgba(234,179,8,.5));}
.marketDeviationMarker{position:absolute;top:50%;transform:translate(-50%,-50%);width:22px;height:22px;border-radius:50%;border:3px solid #ffffff;background:#1f63dd;box-shadow:0 0 0 5px rgba(31,99,221,.14);}
.marketDeviation--above .marketDeviationMarker{background:#d68a0c;box-shadow:0 0 0 5px rgba(214,138,12,.16);}
.marketDeviation--near .marketDeviationMarker{background:#18a06c;box-shadow:0 0 0 5px rgba(24,160,108,.15);}
.marketDeviationScale{margin-top:8px;display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;font-size:12px;font-weight:700;color:var(--v52-muted);}
.marketDeviationScale span:nth-child(2){justify-self:center;color:var(--v52-text-2);}
.marketDeviationScale span:last-child{justify-self:end;}
.marketDeviationNote{margin-top:10px;padding:10px 12px;border-radius:12px;background:#f6f9fc;color:var(--v52-text-2);font-size:13px;line-height:1.5;border:1px solid #d7e3ef;}
.weightBox{background:#ffffff !important;border:2px solid #d2e1ed !important;}
.weightTop b,.wPct{color:var(--v52-text) !important;}.weightHint,.wName{color:var(--v52-muted) !important;}
.wBar{height:12px !important;border:2px solid #bfd0df !important;background:#f3f7fb !important;}
.wFill{background:linear-gradient(90deg, #75c2f4, #55a9ea) !important;}
.wFill.calc{background:linear-gradient(90deg, #79d3a2, #41b878) !important;}
.midCard{background:#ffffff !important;border:2px solid #cad9e6 !important;box-shadow:0 24px 60px rgba(16,36,68,.18) !important;}
.midHeader{position:sticky !important;top:0 !important;z-index:2 !important;background:linear-gradient(180deg, #f8fbff, #eef4fb) !important;border-bottom:1px solid #d4e1ee !important;backdrop-filter:none !important;}
.midTitle{color:var(--v52-text) !important;}
.midHeader .btn{box-shadow:none !important;}
.historySearch,.historySort{border:2px solid #aec1d5 !important;background:#ffffff !important;color:var(--v52-text) !important;}
.historySearch::placeholder{color:#7388a1 !important;}
.histItem{background:linear-gradient(180deg, #ffffff, #f6faff) !important;border:2px solid #d4e1ed !important;box-shadow:0 8px 20px rgba(18,43,72,.06) !important;}
.histItem:hover{background:#eef5ff !important;border-color:#bcd1ea !important;}
.histTitle,.histTop .t{color:var(--v52-text) !important;}.histMeta{color:#627b96 !important;}
.histPrice,.histTop .p{background:none !important;color:#1760d1 !important;-webkit-text-fill-color:#1760d1 !important;filter:none !important;text-shadow:none !important;}
.histActions .btn{background:#ffffff !important;}
.historyStarOnly{background:#fff8e8 !important;border-color:#e6cf8e !important;color:#8c6508 !important;}
.stat{background:#ffffff !important;border:2px solid #d4e1ed !important;}
.stat .v,#mCount,#mAvg,#mMed,#mRange{color:var(--v52-text) !important;}
#marketStatus{color:#35516f !important;font-weight:800 !important;}
.infoBubble{color:var(--v52-text) !important;background:#ffffff !important;border:2px solid #cad8e6 !important;}
.demoBadge{background:rgba(26,79,169,.96) !important;color:#ffffff !important;box-shadow:0 10px 24px rgba(16,36,68,.16) !important;}
@media (max-width: 800px){.marketPosScale{grid-template-columns:1fr !important;gap:8px !important;}.marketPosMin,.marketPosMax{display:flex !important;justify-content:space-between !important;}.marketPosMax::before{content:"Horná hranica";font-weight:700;color:var(--v52-muted);}.marketPosMin::before{content:"Dolná hranica";font-weight:700;color:var(--v52-muted);}.marketDeviation{padding:12px;}.marketDeviationHead{flex-direction:column;align-items:stretch;}.marketDeviationBadge{justify-content:center;}.demoBadge{top:18px !important;right:16px !important;font-size:13px !important;padding:10px 14px !important;}}
@media (max-width: 480px){.marketDeviationScale{font-size:11px;}.marketDeviationNote{font-size:12px;}.valueCommentBody,.marketComment{font-size:14px !important;}}


/* ===== v53 – detail výpočtu: oprava viditeľnosti hodnôt ===== */
.midBody,
#midCalcList,
#midCalcList p,
#midCalcList .muted{
  color: #48637e !important;
}
.midTable{
  border: 2px solid #cad9e6 !important;
  background: #ffffff !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}
.midTable thead th{
  background: linear-gradient(180deg, #cfd8e2, #bcc8d5) !important;
  color: #17324d !important;
  border-bottom: 1px solid #b7c6d4 !important;
  text-shadow: none !important;
}
.midTable tbody td{
  background: #ffffff !important;
  border-bottom: 1px solid #e1eaf2 !important;
}
.midTable tbody tr:nth-child(even) td{
  background: #f7fbff !important;
}
.midTable td.k{
  color: #4c6783 !important;
  font-weight: 700 !important;
}
.midTable td.v{
  color: #10263f !important;
  -webkit-text-fill-color: #10263f !important;
  font-weight: 900 !important;
  letter-spacing: .01em !important;
}
.midTable tr:hover td{
  background: #eef5fc !important;
}
@media (max-width: 560px){
  .midTable th, .midTable td{
    padding: 10px 10px !important;
    font-size: 14px !important;
  }
  .midTable td.k{ width: 58% !important; }
}



/* ===== stable release polish ===== */
:root{
  --okc-surface:#f7fbff;
  --okc-surface-2:#eef4fb;
  --okc-line-strong:#b5c6dc;
  --okc-text-strong:#18324f;
  --okc-text:#274664;
  --okc-text-soft:#5a7391;
  --okc-primary:#245ed6;
  --okc-primary-soft:#eaf2ff;
  --okc-success:#1f9d63;
  --okc-success-soft:#edf9f2;
  --okc-warn:#b26a00;
  --okc-warn-soft:#fff5e5;
  --okc-danger:#b84e4e;
  --okc-danger-soft:#fff0f0;
  --okc-shadow:0 12px 30px rgba(31,57,92,.10);
}

body{ color:var(--okc-text) !important; }
.muted, .sub, .vinAutoHint, #vinInfo, .helpModalSub, .helpTip, .historyTools, .historyList, .aiNote, .vshAsOf, .valueComment p, .marketComment p{
  color:var(--okc-text-soft) !important;
}

/* demo artifacts in stable release */
.demoBadge{
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 9999;
  padding: 12px 18px;
  border-radius: 14px;
  background: #2f59b7;
  color: #fff;
  font-weight: 800;
  font-size: 15px;
  box-shadow: 0 8px 20px rgba(25,45,95,.22);
}

/* methodology panel */
.methodPanel{
  margin-top:14px;
margin-bottom: 18px;
  padding:18px 18px 16px;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,251,255,.96));
  border:1px solid #d7e3f0;
  box-shadow:var(--okc-shadow);
}
.methodPanelHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}
.methodPanelTitle{
  font-size:1.05rem;
  line-height:1.2;
  font-weight:800;
  color:var(--okc-text-strong);
}
.methodPanelSub{
  margin-top:4px;
  font-size:.95rem;
  color:var(--okc-text-soft);
}
.methodPanelGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.methodItem{
  min-height:100%;
  padding:14px 14px 12px;
  border-radius:18px;
  background:var(--okc-surface);
  border:1px solid #d8e5f2;
}
.methodItemTitle{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:8px;
  font-weight:800;
  color:var(--okc-text-strong);
}
.methodDot{
  width:12px;height:12px;border-radius:999px;display:inline-block;flex:0 0 12px;
}
.methodDot.is-calc{ background:linear-gradient(135deg, #45c7f1, #2ed16d 60%, #d8b12a); }
.methodDot.is-market{ background:linear-gradient(135deg, #63b6ff, #22c55e); }
.methodDot.is-note{ background:#8aa5c2; }
.methodItem p{
  margin:0;
  font-size:.94rem;
  line-height:1.5;
  color:var(--okc-text);
}
.methodPanelActions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.methodLinkBtn{
  white-space:nowrap;
}

/* toasts */
.toastStack{
  position:fixed;
  right:16px;
  bottom:18px;
  z-index:1200;
  display:flex;
  flex-direction:column;
  gap:10px;
  pointer-events:none;
}
.toast{
  min-width:280px;
  max-width:min(92vw, 420px);
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid #d3e0ee;
  background:rgba(255,255,255,.96);
  color:var(--okc-text-strong);
  box-shadow:0 14px 28px rgba(20,40,68,.16);
  transform:translateY(10px);
  opacity:0;
  transition:opacity .18s ease, transform .18s ease;
  backdrop-filter:blur(10px);
}
.toast.is-show{ opacity:1; transform:translateY(0); }
.toastIcon{
  width:26px;height:26px;border-radius:999px;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:14px;flex:0 0 26px;
}
.toastBody{ display:flex; flex-direction:column; gap:2px; }
.toastTitle{ font-weight:800; line-height:1.2; }
.toastText{ font-size:.93rem; line-height:1.35; color:var(--okc-text); }
.toast.is-success .toastIcon{ background:var(--okc-success-soft); color:var(--okc-success); }
.toast.is-success{ border-color:#bfe7d1; }
.toast.is-info .toastIcon{ background:var(--okc-primary-soft); color:var(--okc-primary); }
.toast.is-info{ border-color:#cfe0ff; }
.toast.is-warn .toastIcon{ background:var(--okc-warn-soft); color:var(--okc-warn); }
.toast.is-warn{ border-color:#f0d8a2; }

/* softer startup hint after successful calc */
.startup-hint.is-soft-ready{
  background:#f5fbf7 !important;
  border-color:#cde8d8 !important;
}
.startup-hint.is-soft-ready .hintText{
  color:#255a42 !important;
}
.startup-hint.is-soft-ready .hintIcon{
  background:#e7f7ee !important;
  color:#228b5b !important;
}

/* top controls after removing duplicate clear button */
.topActionRow{ grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); }

@media (max-width: 860px){
  .methodPanelGrid{ grid-template-columns:1fr; }
}
@media (max-width: 640px){
  .methodPanel{ padding:16px 14px 14px; }
  .methodPanelHead{ flex-direction:column; }
  .toastStack{ left:12px; right:12px; bottom:12px; }
  .toast{ min-width:0; max-width:none; }
}


/* v2.1 manual mode layout fixes */
.formSectionBlock{padding:16px 18px !important;}
.formSectionEyebrow,.formSectionTitle,.formSectionText{padding-left:4px;padding-right:4px;}
.formSectionText{line-height:1.55 !important;}
.uxOverview{align-items:stretch !important;}
.uxSummaryCard,.uxMissingCard{overflow:hidden !important;}
.uxSummaryGrid{display:flex !important;flex-wrap:wrap !important;gap:10px !important;box-sizing:border-box !important;}
.uxMetric{flex:1 1 108px !important;min-width:108px !important;max-width:none !important;box-sizing:border-box !important;}
.uxStatePill{display:inline-flex !important;max-width:100% !important;white-space:normal !important;word-break:break-word !important;}
@media (max-width:900px){.uxSummaryGrid{gap:8px !important;}.uxMetric{flex:1 1 calc(50% - 8px) !important;min-width:0 !important;}}
@media (max-width:620px){.uxMetric{flex:1 1 100% !important;}}


/* v8.2 pricing hero polish */
.heroPriceRow{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;width:100%;}
.heroBuySellWrap{display:flex;flex-direction:column;gap:6px;margin-top:10px;width:100%;}
.heroBuySellInner{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.heroBuySellNote{margin:0;font-size:11px;line-height:1.45;color:var(--muted);max-width:100%;}
.heroBuySellLabel{font-size:12px;font-weight:800;letter-spacing:.03em;color:var(--muted);white-space:nowrap;}
.heroBuySellSelect{padding:9px 12px;border-radius:12px;border:1px solid rgba(59,130,246,.22);background:rgba(255,255,255,.98);color:#17324d;font-weight:800;min-width:0;max-width:100%;}
.heroPricingIntentHost{display:flex;align-items:center;justify-content:flex-end;flex:0 0 auto;min-width:260px;}.heroPricingIntentHost.is-hidden{display:none !important;}
.heroPricingIntentShell{display:flex;flex-direction:column;gap:6px;min-width:260px;max-width:320px;padding:0;border:0;background:transparent;}
.heroPricingIntentRow{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;}
.heroPricingIntentLabel{font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);white-space:nowrap;}
.heroPricingIntentSelect{padding:10px 14px;border-radius:14px;border:1px solid rgba(59,130,246,.24);background:rgba(255,255,255,.98);color:#17324d;font-weight:800;min-width:170px;box-shadow:0 8px 22px rgba(15,23,42,.06);}
.heroPricingIntentHint{font-size:11px;line-height:1.35;color:var(--muted);text-align:right;max-width:320px;}
.price--market-below{color:#1d5d9f !important;filter:drop-shadow(0 6px 14px rgba(29,93,159,.12));}
.price--market-near{color:#17835f !important;filter:drop-shadow(0 6px 14px rgba(23,131,95,.12));}
.price--market-above{color:#b86a00 !important;filter:drop-shadow(0 6px 14px rgba(184,106,0,.14));}
.heroMarketSummary{margin-top:14px;width:100%;}
.heroMarketCard{padding:16px 18px;border-radius:20px;border:1px solid rgba(148,163,184,.18);background:rgba(255,255,255,.05);box-shadow:0 14px 38px rgba(15,23,42,.04);}
.heroMarketCard--below{background:linear-gradient(180deg, rgba(239,246,255,.96), rgba(255,255,255,.99));border-color:#cbdff4;}
.heroMarketCard--above{background:linear-gradient(180deg, rgba(255,247,237,.98), rgba(255,255,255,.99));border-color:#efd6b0;}
.heroMarketCard--near{background:linear-gradient(180deg, rgba(240,253,244,.97), rgba(255,255,255,.99));border-color:#cae7d4;}
.heroMarketTop{display:flex;align-items:flex-start;justify-content:flex-start;gap:10px;flex-wrap:wrap;margin-bottom:12px;}
.heroMarketEyebrow{font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);}
.heroMarketBadge{display:inline-flex;align-items:center;min-height:36px;padding:8px 13px;border-radius:999px;font-size:13px;font-weight:900;border:1px solid transparent;box-shadow:inset 0 1px 0 rgba(255,255,255,.55);}
.heroMarketCard--below .heroMarketBadge{background:#eaf4ff;color:#1d5d9f;border-color:#c5dcf4;}
.heroMarketCard--above .heroMarketBadge{background:#fff1cf;color:#965f07;border-color:#ecd090;}
.heroMarketCard--near .heroMarketBadge{background:#edf9f2;color:#1a7b57;border-color:#bfe0cc;}
.heroMarketRangeLine{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;}
.heroMarketMin,.heroMarketMax{font-size:12px;font-weight:800;color:#64748b;}
.heroMarketTrack{position:relative;height:16px;border-radius:999px;border:1px solid rgba(148,163,184,.24);overflow:visible;background:#edf2f7;box-shadow:inset 0 1px 3px rgba(15,23,42,.08);padding-top:20px;}
.heroMarketZone{position:absolute;top:0;bottom:0;}
.heroMarketZone--low{left:0;width:33.333%;background:linear-gradient(90deg,#dbeafe,#bfdbfe);border-radius:999px 0 0 999px;}
.heroMarketZone--mid{left:33.333%;width:33.334%;background:linear-gradient(90deg,#d1fae5,#fde68a);}
.heroMarketZone--high{left:66.667%;width:33.333%;background:linear-gradient(90deg,#fed7aa,#fdba74);border-radius:0 999px 999px 0;}
.heroMarketAvgMarker{position:absolute;top:-5px;bottom:-5px;width:2px;background:rgba(71,85,105,.6);transform:translateX(-50%);z-index:2;}
.heroMarketTrackFill{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:linear-gradient(90deg, rgba(56,189,248,.16), rgba(14,165,233,.22));z-index:1;opacity:.85;}
.heroMarketDot{display:none !important;}
.heroMarketCar{position:absolute;left:50%;top:-17px;transform:translateX(-50%);width:42px;height:26px;z-index:4;pointer-events:none;filter:drop-shadow(0 8px 10px rgba(15,23,42,.14));animation:heroCarFloat .55s ease;}
.heroMarketCarSvg{display:block;width:100%;height:100%;overflow:visible;}
.heroMarketCard--above .heroMarketDot{display:none !important;}
.heroMarketCard--above .heroMarketCar{filter:drop-shadow(0 8px 10px rgba(180,102,6,.18));}
.heroMarketCard--near .heroMarketDot{display:none !important;}
.heroMarketCard--near .heroMarketCar{filter:drop-shadow(0 8px 10px rgba(21,128,61,.16));}
.heroMarketLegend{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin-top:10px;color:#64748b;font-size:11px;font-weight:700;}
.heroMarketLegendItem--avg{text-align:center;color:#334155;font-weight:800;}
.heroMarketLegendItem:last-child{text-align:right;}
.heroMarketMeta{display:flex;align-items:flex-end;justify-content:flex-end;gap:12px;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px solid rgba(148,163,184,.18);}
.heroMarketValue{display:none !important;}
.heroMarketCount{font-size:12px;color:#64748b;font-weight:700;}
@keyframes heroCarFloat{
  0%{opacity:0;transform:translateX(-50%) translateY(-6px) scale(.96);}
  100%{opacity:1;transform:translateX(-50%) translateY(0) scale(1);}
}

@media (max-width: 860px){
  .heroPriceRow{flex-direction:column;align-items:flex-start;}
  .heroPricingIntentHost{width:100%;justify-content:flex-start;min-width:0;}
  .heroPricingIntentShell{width:100%;max-width:none;}
  .heroPricingIntentRow{justify-content:flex-start;}
  .heroPricingIntentHint{text-align:left;max-width:none;}
  .heroMarketRangeLine{grid-template-columns:1fr;gap:8px;}
  .heroMarketMin,.heroMarketMax{display:flex;justify-content:space-between;}
  .heroMarketMin::before{content:"Dolná hranica";font-weight:700;color:var(--muted);}
  .heroMarketMax::before{content:"Horná hranica";font-weight:700;color:var(--muted);}
  .heroMarketLegend{grid-template-columns:1fr;gap:6px;}
  .heroMarketLegendItem,.heroMarketLegendItem--avg,.heroMarketLegendItem:last-child{text-align:left;}
  .heroMarketLegendItem:first-child,.heroMarketLegendItem:last-child{display:none;}
  .heroMarketLegendItem--avg{text-align:left;font-size:12px;}
}


/* v8.6 FINAL CLEAN */
#heroPricingIntentHost,
#heroPricingIntentHost *,
.heroPricingIntentHost,
.heroPricingIntentHost *{display:none !important;}
#marketPositionBox{display:none !important;}
.marketDeviation,.marketDeviationBadge,.marketDeviationHead,.marketDeviationTitle,.marketDeviationBar,.marketDeviationScale,.marketDeviationNote{display:none !important;}
.heroMarketBadge{display:none !important;}
.resultHeroPanel .valueRange{order:2;margin:10px 0 8px;}
.resultHeroPanel .heroMarketSummary{order:3;}
.resultHeroPanel .vshAsOf{order:4;}
.resultHeroPanel #vehicleStateBadge{order:5;}
.resultHeroPanel{display:flex;flex-direction:column;}
.heroPriceRow{order:1;}
.heroMarketTrackFill{display:none !important;}
.heroMarketCard .heroMarketMeta{margin-top:10px;padding-top:10px;border-top:1px solid rgba(148,163,184,.18);}
@media (max-width:700px){
  .heroMarketLegend{grid-template-columns:1fr !important;gap:6px !important;}
  .heroMarketLegendItem:first-child,.heroMarketLegendItem:last-child{display:none !important;}
  .heroMarketLegendItem--avg{text-align:left !important;font-size:12px !important;}
}

.heroMarketNote{flex:1 1 100%;font-size:12px;line-height:1.45;color:rgba(71,85,105,.9);text-align:left;}
@media (max-width:700px){.heroMarketNote{font-size:11.5px;}}


.heroMarketCard{padding:16px 18px 14px;border-radius:20px;border:1px solid rgba(148,163,184,.18);background:rgba(255,255,255,.05);box-shadow:0 14px 38px rgba(15,23,42,.04);}
.heroMarketCard--below{background:linear-gradient(180deg, rgba(239,246,255,.96), rgba(255,255,255,.99));border-color:#cbdff4;}
.heroMarketCard--above{background:linear-gradient(180deg, rgba(255,247,237,.98), rgba(255,255,255,.99));border-color:#efd6b0;}
.heroMarketCard--near{background:linear-gradient(180deg, rgba(240,253,244,.97), rgba(255,255,255,.99));border-color:#cae7d4;}
.heroMarketTop{display:flex;align-items:flex-start;justify-content:flex-start;gap:10px;flex-wrap:wrap;margin-bottom:12px;}
.heroMarketEyebrow{font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);}
.heroMarketRangeLine,.heroMarketTrack,.heroMarketZone,.heroMarketAvgMarker,.heroMarketTrackFill,.heroMarketCar,.heroMarketLegend{display:none !important;}
.heroMarketHistogramShell{position:relative;border:1px solid rgba(148,163,184,.2);border-radius:18px;background:linear-gradient(180deg, rgba(247,250,255,.95), rgba(255,255,255,.98));padding:10px 12px 8px;}
.heroMarketHistogramSvg{display:block;width:100%;height:auto;overflow:visible;}
.heroMarketHistYAxisTitle,
.heroMarketHistAxisText,
.heroMarketHistAvgLabel,
.heroMarketHistVhvLabel,
.heroMarketHistYAxisText,
.heroMarketHistEdgeLabel,
.heroMarketHistEdgeLabel--low,
.heroMarketHistEdgeLabel--high{
  font-size:11px;
  fill:#64748b;
  font-weight:800;
  letter-spacing:0.02em;
}
.heroMarketMeta--hist{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px solid rgba(148,163,184,.18);}
.heroMarketMeta--single{justify-content:flex-start;}
.heroMarketCount{font-size:12px;color:#64748b;font-weight:700;}
.heroMarketNote{font-size:12px;color:#64748b;max-width:620px;line-height:1.45;}
@media (max-width: 860px){
  .heroMarketHistogramShell{padding:8px 8px 6px;}
  .heroMarketMeta--hist{flex-direction:column;align-items:flex-start;}
}

.heroMarketHistogramShell{padding:12px 14px 10px;}
.heroMarketHistogramSvg{overflow:visible;}
.heroMarketCount{font-size:12px;color:#64748b;font-weight:800;}
.heroMarketCard .heroMarketMeta{margin-top:8px;padding-top:8px;border-top:1px solid rgba(148,163,184,.14);}
@media (max-width:860px){.heroMarketHistogramShell{padding:10px 10px 8px;}}

.vshAsOf{ color:#5b6f8d !important; opacity:1 !important; }
.vshAsOf b{ color:#2b4367 !important; }
.heroMarketCount{ display:none !important; }
.heroMarketMeta--hist{ display:none !important; }
.heroMarketHistogramShell{ padding-bottom:6px; }

.marketNextActionRow{margin-top:8px;}
.marketNextInlineTitle{font-size:14px;font-weight:800;color:#213a63;margin-bottom:2px;}
.heroMarketHistogramSvg .heroMarketHistYAxisTitle,
.heroMarketHistogramSvg .heroMarketHistYAxisText,
.heroMarketHistogramSvg .heroMarketHistAxisText,
.heroMarketHistogramSvg .heroMarketHistAxisText--low,
.heroMarketHistogramSvg .heroMarketHistAxisText--high,
.heroMarketHistogramSvg .heroMarketHistAvgLabel,
.heroMarketHistogramSvg .heroMarketHistAvgLabel--vertical,
.heroMarketHistogramSvg .heroMarketHistVhvLabel,
.heroMarketHistogramSvg .heroMarketHistEdgeLabel,
.heroMarketHistogramSvg .heroMarketHistEdgeLabel--low,
.heroMarketHistogramSvg .heroMarketHistEdgeLabel--high{
  fill: #64748b;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.02em;
}
@media (max-width: 860px){
  .heroMarketHistogramSvg .heroMarketHistYAxisTitle,
  .heroMarketHistogramSvg .heroMarketHistYAxisText,
  .heroMarketHistogramSvg .heroMarketHistAxisText,
  .heroMarketHistogramSvg .heroMarketHistAxisText--low,
  .heroMarketHistogramSvg .heroMarketHistAxisText--high,
  .heroMarketHistogramSvg .heroMarketHistAvgLabel,
  .heroMarketHistogramSvg .heroMarketHistAvgLabel--vertical,
  .heroMarketHistogramSvg .heroMarketHistVhvLabel,
  .heroMarketHistogramSvg .heroMarketHistEdgeLabel,
  .heroMarketHistogramSvg .heroMarketHistEdgeLabel--low,
  .heroMarketHistogramSvg .heroMarketHistEdgeLabel--high{
    font-size: 10px;
  }
}

.heroMarketHistogramSvg .heroMarketHistVhvLabel{ fill:#15803d; }
.heroMarketHistogramSvg .heroMarketVshHover{ cursor:help; }