:root{--bg:#f4f7fb;--card:#fff;--text:#172033;--muted:#64748b;--header:#123a62;--accent:#168a50;--border:#dce3eb;--soft:#eef3f8}body.dark{--bg:#0f172a;--card:#1e293b;--text:#f8fafc;--muted:#a8b3c4;--header:#172554;--accent:#22a861;--border:#334155;--soft:#273449}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,sans-serif;line-height:1.45}header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 24px;background:var(--header);color:#fff}.brand{display:flex;align-items:center;gap:10px;font-weight:700;color:#fff;text-decoration:none}.logo{display:grid;place-items:center;background:#fff;color:#123a62;width:46px;height:42px;border-radius:10px}nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap}a,button{display:inline-block;background:var(--accent);color:#fff;padding:10px 14px;border-radius:8px;border:0;text-decoration:none;font:inherit;cursor:pointer}button.secondary{background:var(--soft);color:var(--text);border:1px solid var(--border)}main{max-width:1160px;margin:auto;padding:30px 22px}.hero{margin-bottom:24px}.hero h1{font-size:clamp(2rem,5vw,3.4rem);margin:.2em 0}.muted,.card p{color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}.card,.panel{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:22px}.card{display:flex;flex-direction:column;align-items:flex-start}.card p{flex:1}.card-icon{font-size:2rem}.coming{background:var(--soft);color:var(--muted);padding:9px 12px;border-radius:8px}.grid{display:grid;grid-template-columns:minmax(280px,1fr) minmax(280px,1fr);gap:22px;align-items:start}label{display:block;font-weight:600;margin-bottom:13px}input{display:block;width:100%;margin-top:6px;padding:11px 12px;font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:8px}.check{display:flex;gap:10px;align-items:center;font-weight:500}.check input{width:auto;margin:0}.actions{display:flex;gap:10px;flex-wrap:wrap}.validation{color:#b42318;margin-top:12px}.big-payment{font-size:2rem;font-weight:700;margin:12px 0 20px}.big-payment small{font-size:1rem;color:var(--muted)}dl{margin:0}dl div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--border)}dd{font-weight:700;margin:0}.schedule{margin-top:22px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:620px}th,td{text-align:right;padding:9px;border-bottom:1px solid var(--border)}th:first-child,td:first-child{text-align:left}.hidden{display:none}@media(max-width:720px){header{align-items:flex-start;padding:14px}.brand span:last-child{display:none}.grid{grid-template-columns:1fr}main{padding:22px 14px}.cards{grid-template-columns:1fr}}
.result-label{margin:4px 0;color:var(--muted);font-weight:600}

.seller-switch{display:flex;gap:12px;margin:20px 0 24px;flex-wrap:wrap}
.seller-btn{background:var(--soft);color:var(--text);border:1px solid var(--border);font-weight:700}
.seller-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.mode-heading{padding-bottom:8px;margin-bottom:14px;border-bottom:1px solid var(--border)}
.mode-heading h2{margin:0 0 4px}.mode-heading p{margin:0}

.field-label{display:flex;align-items:center;gap:7px}
.field-help{display:inline-grid;place-items:center;width:22px;height:22px;min-width:22px;padding:0;border-radius:50%;background:var(--soft);color:var(--text);border:1px solid var(--border);font-size:13px;font-weight:800;line-height:1}
.field-help:hover,.field-help:focus-visible{background:var(--accent);color:#fff;border-color:var(--accent)}
.field-help-panel{margin:7px 0 9px;padding:10px 12px;border-left:3px solid var(--accent);border-radius:6px;background:var(--soft);color:var(--text);font-size:.92rem;font-weight:400}
.check-help-row{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.check-help-row .check{margin-bottom:0;flex:0 1 auto}
.save-garage{margin-top:18px;width:100%}.save-status{min-height:1.2em;margin:8px 0 0;color:var(--accent);font-weight:700}
.garage-title{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:22px}.garage-title h1{margin-bottom:6px}
.garage-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}.garage-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px;box-shadow:var(--shadow)}
.garage-card-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.garage-card-head h2{margin:5px 0 0}.scenario-type{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--accent)}
.garage-primary{margin:18px 0}.garage-primary strong{display:block;font-size:1.65rem}.garage-primary span,.saved-date{font-size:.85rem;color:var(--muted)}.garage-details{margin:0}.garage-details div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--border)}.garage-details dt{color:var(--muted)}.garage-details dd{margin:0;font-weight:700}.saved-date{margin:15px 0 0}.garage-empty{text-align:center;padding:34px}.button-link{display:inline-block;margin-top:10px;padding:10px 16px;border-radius:8px;background:var(--accent);color:#fff;text-decoration:none;font-weight:700}@media(max-width:640px){.garage-title{display:block}.garage-title>button{margin-top:10px}.garage-card-head{align-items:flex-start}}

.go-garage-link{display:inline-block;margin-left:10px;padding:8px 12px;border-radius:8px;background:var(--accent);color:#fff;text-decoration:none;font-weight:800}
.go-garage-link:hover,.go-garage-link:focus-visible{text-decoration:underline}

.garage-card-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.scenario-dialog{width:min(680px,calc(100% - 30px));max-height:85vh;border:1px solid var(--border);border-radius:14px;background:var(--card);color:var(--text);padding:22px}
.scenario-dialog::backdrop{background:rgba(0,0,0,.45)}
.scenario-dialog-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.scenario-dialog-head h2{margin-top:0}
.scenario-dialog-actions{display:flex;justify-content:flex-end;margin-top:20px}
.detail-list div{display:flex;justify-content:space-between;gap:18px;padding:8px 0;border-bottom:1px solid var(--border)}
.detail-list dt{color:var(--muted)}.detail-list dd{margin:0;font-weight:700;text-align:right}
.loaded-scenario-note{margin:14px 0 20px;padding:12px 14px;border-left:4px solid var(--accent);border-radius:7px;background:var(--soft)}
@media(max-width:640px){.detail-list div{display:block}.detail-list dd{text-align:left;margin-top:3px}.garage-card-actions button{flex:1 1 100%}}

.clear-fields-btn{font-weight:800}

.tax-rule-status{margin:-4px 0 14px;padding:9px 11px;border-left:3px solid var(--accent)}
.tax-breakdown{margin-top:22px;padding-top:6px;border-top:1px solid var(--border)}
.tax-note{margin-top:12px;line-height:1.5}
select{width:100%;box-sizing:border-box}

.check-help-row[hidden]{display:none!important}

/* Publishing-readiness additions */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #f59e0b;outline-offset:3px}.site-footer{margin-top:32px;border-top:1px solid var(--border);background:var(--card);color:var(--muted)}.site-footer-inner{max-width:1160px;margin:auto;padding:22px;display:flex;gap:16px 24px;align-items:center;flex-wrap:wrap}.site-footer a{background:transparent;color:var(--text);padding:8px;text-decoration:underline}.footer-links{display:flex;gap:4px;flex-wrap:wrap}.footer-disclaimer{flex:1 1 100%;margin:0;font-size:.9rem}.legal-page{max-width:900px}.legal-content h2{margin-top:1.5rem}.legal-content h2:first-child{margin-top:0}.legal-content p{color:var(--text)}@media(max-width:640px){.site-footer-inner{padding:18px 14px;align-items:flex-start;flex-direction:column}.footer-links{margin-left:-8px}}

/* v0.55.7: make keyboard/programmatic focus on dropdowns unmistakable. */
select:focus{
  outline:3px solid #f59e0b;
  outline-offset:3px;
  border-color:#f59e0b;
  box-shadow:0 0 0 2px var(--card),0 0 0 5px #f59e0b;
}

/* Approved PNJ/AFT assets are used without modifications. */
header .brand{padding:0;background:transparent;min-width:0;flex-shrink:1}
.brand-lockup{display:block;width:300px;max-width:100%;height:auto;object-fit:contain;border-radius:6px}
.brand-light{background:#fff}.brand-dark{display:none}
body.dark .brand-light{display:none}body.dark .brand-dark{display:block}
@media(max-width:720px){header{flex-wrap:wrap}header .brand{max-width:100%;width:260px}header nav{display:flex;flex-wrap:wrap;gap:8px}.brand-lockup{width:260px}}

/* Final-five transaction records share the existing calculator column and theme. */
#batch12Fields{border-top:1px solid var(--border);margin-top:18px;padding-top:12px}#batch12Fields[hidden],#batch12Fields [hidden]{display:none!important}#b12VerifiedField{display:flex;align-items:flex-start;gap:10px;font-weight:500}#b12Verified{width:auto;margin:4px 0 0;flex:none}#batch12Fields select{max-width:100%}#batch12Fields p{overflow-wrap:anywhere}

/* Vehicle-entry controls use the existing theme and seller-button contract. */
#vehicleEntryConditionField{margin-bottom:13px}.vehicle-condition-buttons{display:flex;gap:8px;margin:6px 0}.vehicle-condition-buttons button{min-width:76px}.vehicle-condition-buttons button:focus-visible{outline:3px solid var(--text);outline-offset:2px}.vehicle-condition-buttons button:disabled{opacity:.5;cursor:default}.vehicle-year-quick{display:block}.vehicle-year-quick[hidden]{display:none}.vehicle-today{font-size:.9rem;margin-top:-5px}

/* Reserve a narrow viewport rail so quick navigation never covers the form. */
body.calculator-navigation-enabled{padding-right:calc(112px + env(safe-area-inset-right,0px))}
.calculator-navigation-enabled .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.calculator-navigation-enabled .grid>*{min-width:0}
.calculator-navigation{position:fixed;z-index:20;right:calc(12px + env(safe-area-inset-right,0px));bottom:max(var(--calculator-navigation-bottom,12px),env(safe-area-inset-bottom,0px));width:96px;display:flex;flex-direction:column;gap:6px}
.calculator-navigation[hidden]{display:none}
.calculator-navigation button{width:100%;min-height:44px;padding:8px 5px;font-size:12px;font-weight:600;box-shadow:0 2px 6px #0002}
.calculator-navigation button:hover{background:var(--card);border-color:var(--muted)}
.calculator-navigation button:focus-visible{outline:3px solid var(--text);outline-offset:2px}
@media(max-width:720px){.calculator-navigation-enabled .grid{grid-template-columns:minmax(0,1fr)}}
/* At 640px and below the 112px rail consumes too much of the single column. */
@media(max-width:640px){
  body.calculator-navigation-enabled{padding-right:0;padding-bottom:var(--calculator-navigation-space,0px)}
  html{scroll-padding-bottom:var(--calculator-navigation-space,0px)}
  .calculator-navigation{left:calc(12px + env(safe-area-inset-left,0px));right:calc(12px + env(safe-area-inset-right,0px));bottom:calc(var(--calculator-navigation-bottom,12px) + env(safe-area-inset-bottom,0px));width:auto;flex-direction:row;flex-wrap:nowrap;gap:8px}
  .calculator-navigation button{flex:1;min-width:0;font-size:14px}
}

/* Calculator headers share Home branding width; the rail still protects forms. */
body.calculator-navigation-enabled>header{margin-right:calc(-112px - env(safe-area-inset-right,0px))}
@media(max-width:640px){body.calculator-navigation-enabled>header{margin-right:0}}