:root {
  --bg:#faf9f6; --paper:#fff; --ink:#202622; --muted:#60675f;
  --green:#175d42; --line:#dedfd8; --border:#989e96; --error:#a82a20;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-synthesis:none; color:var(--ink); background:var(--bg);
}
*{box-sizing:border-box}
body{margin:0;font-size:16px;line-height:1.5}
button,input,select,textarea{font:inherit;color:inherit}
button,a,summary{touch-action:manipulation}
button{cursor:pointer} button:disabled{opacity:.45;cursor:not-allowed}
a{color:var(--green);text-underline-offset:4px}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #318060;outline-offset:3px}
button:hover:not(:disabled){filter:brightness(.94)}
[hidden]{display:none!important}
.wrap{width:min(1120px,calc(100% - 48px));margin:auto}
.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{color:var(--ink);font-size:25px;font-weight:750;letter-spacing:-1.2px;display:flex;align-items:center;text-decoration:none}
.brand-dot{color:var(--green)}
.site-header nav a{color:var(--ink);font-size:14px;text-decoration:none}
.intro{padding:36px 0 32px}
h1{font-size:38px;font-weight:650;line-height:1.15;letter-spacing:-1.4px;margin:0 0 12px}
.lede{font-size:18px;margin:0;color:var(--ink)}
.tagline{font-size:14px;margin:7px 0 0;color:var(--muted)}
.calculator-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:64px;align-items:start}
.form-card{padding:0 0 24px;min-width:0}
fieldset{border:0;border-bottom:1px solid var(--line);padding:0 0 26px;margin:0 0 26px;min-width:0}
fieldset:last-of-type{border-bottom:0;padding-bottom:0;margin-bottom:20px}
legend{font-size:19px;letter-spacing:-.3px;font-weight:650;width:100%;padding:0;margin-bottom:17px}
.segmented{display:flex;gap:0;border:1px solid var(--border);border-radius:6px;overflow:hidden;margin-bottom:14px;background:white}
.segmented button{flex:1;background:transparent;border:0;min-height:45px;padding:10px 6px;font-size:14px;font-weight:550;color:var(--muted);border-radius:0}
.segmented button+button{border-left:1px solid var(--border)}
.segmented button[aria-pressed=true]{background:#e8eee8;color:#18442f}
.segmented button:focus-visible{outline-offset:-4px}
.unit-preset-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.unit-preset-row label{font-size:13px;color:var(--muted);margin:0}.unit-preset-row select{width:auto;max-width:100%;min-width:0;font-size:13px;min-height:44px;border:1px solid var(--border);border-radius:6px;background-color:white;padding:8px 36px 8px 12px}.unit-preset-row+.hint{margin:6px 0 16px}
.label-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.two-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.field{min-width:0}
label{display:block;font-size:14px;font-weight:600;margin-bottom:7px}
label span{font-weight:400;color:var(--muted);margin-left:3px}
input{min-width:0;font-variant-numeric:tabular-nums}
.field>input,.lookup-stage>select,.picker-trigger{width:100%;min-height:48px;padding:11px 12px;border:1px solid var(--border);border-radius:6px;background:white;box-shadow:none}
input::placeholder{color:#777d75;font-weight:400}
input[aria-invalid=true]{border-color:var(--error);box-shadow:0 0 0 1px var(--error)}
.unit{border:0;background:transparent;color:var(--green);font-size:14px;font-weight:550;min-height:44px;padding:5px 3px;max-width:150px}
.currency{width:72px;text-align:right;border-radius:3px}
.hint{font-size:14px;color:var(--muted);line-height:1.5;margin:8px 0 0}
.hint:empty,.result-status:empty{display:none}
.strong{font-weight:550}.small{font-size:14px}
.error{font-size:14px;line-height:1.45;color:var(--error);margin:7px 0 0}
.label-row>.hint{margin:0 0 6px}
.input-with-unit{display:flex;align-items:center;border:1px solid var(--border);border-radius:6px;background:white;min-height:48px}
.input-with-unit input{border:0;border-radius:6px;background:transparent;padding:11px 12px;min-height:46px;width:100%;flex:1}
.input-with-unit select{border:0;border-left:1px solid var(--line);background:transparent;height:32px;padding:0 10px;max-width:110px;font-size:14px;color:var(--muted)}
.input-with-unit input:focus-visible{outline-offset:-3px}
.primary,.secondary{border:1px solid var(--border);border-radius:6px;min-height:48px;padding:12px 18px;font-size:15px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:12px;text-decoration:none;background:white;color:var(--green)}
.primary{color:white;border-color:var(--green);background:var(--green)}
.text-button,.inline-link{border:0;background:transparent;color:var(--green);font-size:14px;font-weight:550;min-height:44px;padding:8px 0;text-underline-offset:3px}
.text-button:hover{text-decoration:underline}
.inline-link{min-height:0;padding:0;text-decoration:underline}
.car-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:18px}
.price-field{margin-top:20px}
.people-row{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:18px}
.people-row label{margin-bottom:1px}.people-row .hint{margin-top:0}
.stepper{display:flex;flex-shrink:0;border:1px solid var(--border);border-radius:6px;overflow:hidden;background:white}
.stepper button{border:0;background:transparent;min-height:46px;min-width:44px;font-size:20px}
.stepper input{width:44px;text-align:center;border:0;border-inline:1px solid var(--line);height:46px;font-size:17px;background:white;padding:0}
.stepper button:focus-visible,.stepper input:focus-visible{outline-offset:-4px}
.extras{border-top:1px solid var(--line);margin-bottom:22px}
.extras summary{color:var(--green);font-size:14px;font-weight:550;padding:15px 0;min-height:48px;cursor:pointer}
.extras .hint{margin:0 0 16px}.extras .two-fields{margin-bottom:6px}
.submit-row{display:flex;align-items:center;gap:20px}.submit-row .primary{flex:1}
.footer-note{margin-top:11px;font-size:14px}
.result-column{position:sticky;top:24px;min-width:0}
.result-card{background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--green);padding:24px 28px 25px;border-radius:2px}
.result-top{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:18px;border-bottom:1px solid var(--line);color:var(--muted);font-size:13px}
.receipt-brand{font-size:19px;font-weight:700;letter-spacing:-.8px;color:var(--ink)}
.empty-result{padding:24px 0 2px}.empty-result h2{font-size:23px;letter-spacing:-.5px;font-weight:550;margin:0 0 12px;line-height:1.3}
.empty-result p{font-size:15px;color:var(--muted);margin:0 0 20px;max-width:320px}
.empty-result .empty-foot{font-size:13px;padding-top:16px;border-top:1px dashed var(--line);margin:22px 0 0}
.result-status{font-size:14px;color:var(--muted);margin:16px 0}
#result-title{font-size:16px;font-weight:500;margin:24px 0 12px;line-height:1.4}
#result-title:focus{outline:none}
.main-amount{font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;font-size:48px;font-weight:600;letter-spacing:-2px;line-height:1.2;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.main-amount .amount-code{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:18px;font-weight:500;letter-spacing:0;margin-right:10px;color:var(--muted)}
.main-amount.grouped{font-size:25px;letter-spacing:-.9px}
.amount-group{margin:9px 0}.amount-group span{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;font-weight:400;letter-spacing:0}
.totals,.cost-items{font-size:14px;margin:22px 0 0;padding-top:14px;border-top:1px solid var(--line)}
.totals div,.cost-items div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:7px 0}
.totals dt,.cost-items dt{color:var(--muted)}
.totals dd,.cost-items dd{margin:0;font-variant-numeric:tabular-nums;text-align:right;overflow-wrap:anywhere}
.totals dd{font-weight:600}.totals div:first-child dt{color:var(--ink)}
.cost-items{padding-top:16px;border-top:1px dashed var(--line)}
.cost-items+.totals{margin-top:10px;padding-top:10px}
.bill-actions{display:flex;gap:10px;margin:24px 0 12px}.bill-actions .primary{flex:1}.bill-actions .secondary{background:white}
#breakdown{border-top:1px dashed var(--line);margin-top:20px}
summary{cursor:pointer;min-height:48px;font-size:14px;font-weight:550;padding:16px 0}
#breakdown summary{color:var(--green)}
.breakdown-values{font-size:14px;margin:0 0 16px}.breakdown-values div{padding:7px 0}.breakdown-values dt{color:var(--muted);font-size:13px}.breakdown-values dd{margin:2px 0 0;overflow-wrap:anywhere}
#shares{font-size:14px;padding-left:25px;max-height:230px;overflow:auto}
.result-caption{text-align:center;font-size:13px;color:var(--muted);margin-top:15px}
.notice{background:#fff2d6;border-left:3px solid #b88123;padding:12px 14px;font-size:14px}
.stale #result-values{opacity:.42}
.vehicle-summary{border-left:3px solid var(--green);padding:1px 0 1px 13px;margin:4px 0 20px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.vehicle-summary strong{font-size:17px;font-weight:650;line-height:1.4;letter-spacing:-.2px}.vehicle-summary .hint{font-size:14px;margin-top:5px}
.small-actions{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:2px}
#vehicle-details{border-top:1px solid var(--line);margin-top:16px}#vehicle-details a{font-size:14px}
.lookup{border-left:2px solid var(--green);padding:0 0 0 18px;margin:12px 0 22px}
.lookup>.label-row>strong{font-size:16px;font-weight:600}
.lookup>.hint{font-size:13px}.lookup-stage{margin-top:16px}
.picker-trigger{display:flex;align-items:center;justify-content:space-between;font-size:16px;text-align:left}
.chosen{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding:7px 0;align-items:center}
.chosen span{min-width:0}.chosen small{display:block;color:var(--muted);font-size:12px}.chosen strong{display:block;font-size:15px;font-weight:550;overflow-wrap:anywhere}.chosen .text-button{flex-shrink:0}
#lookup-options{font-size:14px;max-width:100%}
#apply-vehicle{margin-top:12px}
.picker-dialog{width:min(500px,calc(100% - 32px));max-height:min(650px,85dvh);padding:0;border:1px solid var(--border);border-radius:10px;background:white;color:var(--ink);box-shadow:0 16px 70px #18231e26;overflow:hidden}
.picker-dialog::backdrop{background:#18231e65}
.picker-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 20px;border-bottom:1px solid var(--line)}
.picker-header h2{font-size:19px;font-weight:600;letter-spacing:-.3px;margin:0}
.picker-dialog>input{display:block;width:calc(100% - 40px);margin:15px 20px 12px;border:1px solid var(--border);border-radius:6px;min-height:46px;padding:10px 12px;background:white}
.picker-list{overflow-y:auto;overscroll-behavior:contain;max-height:min(420px,52dvh);padding:0 8px}
.picker-option{display:block;text-align:left;width:100%;border:0;border-radius:5px;background:white;min-height:47px;padding:11px 13px;font-size:16px;overflow-wrap:anywhere}
.picker-option[aria-selected=true],.picker-option:hover{background:#e8eee8}
.picker-option:focus-visible{outline-offset:-3px}
.picker-status{font-size:12px;color:var(--muted);margin:0;padding:11px 20px;border-top:1px solid var(--line)}
#manual-copy{margin-top:18px}textarea{width:100%;border:1px solid var(--border);border-radius:6px;background:white;padding:12px;font-size:14px}
.explain{border-top:1px solid var(--line);padding:34px 0;margin-top:38px}
.explain h2,.faq h2{font-size:24px;font-weight:600;letter-spacing:-.5px;line-height:1.3;margin:0 0 18px}
.how-steps{padding-left:20px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px;margin:24px 0 0}
.how-steps li{padding-left:4px;color:var(--muted);font-size:14px}.how-steps h3{font-size:16px;font-weight:600;color:var(--ink);margin:0 0 8px}.how-steps p{font-size:14px;margin:0}
.faq{border-top:1px solid var(--line);padding:34px 0;display:grid;grid-template-columns:1fr 1.5fr;gap:48px}
.faq a{font-size:14px}.faq details{border-top:1px solid var(--line)}.faq details:first-child{border-top:0}.faq summary{font-size:15px}.faq details p{font-size:14px;color:var(--muted);margin:0 0 18px}
.site-footer{border-top:1px solid var(--line);display:flex;align-items:center;gap:24px;padding:24px 0 30px}.site-footer .brand{font-size:21px}.site-footer p{flex:1;font-size:13px;color:var(--muted)}
.site-footer nav{display:flex;align-items:center;gap:22px;font-size:13px}.site-footer nav a{text-decoration:none;color:var(--muted)}.site-footer .text-button{font-size:13px;color:var(--muted)}
.prose{max-width:720px;margin:44px auto 70px}.prose h1{font-size:35px}.prose h2{font-size:23px;margin-top:32px}.prose p,.prose li{color:var(--muted)}.prose code{white-space:normal;overflow-wrap:anywhere;background:#e8eee8;padding:3px 6px}
.prose .eyebrow{font-size:13px;color:var(--muted)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;top:-100px;left:16px;z-index:5;background:white;padding:10px}.skip:focus{top:10px}
@media(max-width:1023px){
 .calculator-layout{grid-template-columns:1fr;max-width:620px;margin:auto;gap:28px}.intro{max-width:620px;margin:auto}.result-column{position:static}.result-card{padding:22px 26px}.empty-result{padding:22px 0 0}.empty-result p{max-width:none}.site-footer{flex-wrap:wrap}.site-footer nav{margin-left:auto}
}
@media(max-width:600px){
 .wrap{width:calc(100% - 32px)}.site-header{height:66px}.brand{font-size:24px}.intro{padding:28px 0 28px}h1{font-size:30px;letter-spacing:-1.2px}.lede{font-size:16px;max-width:310px}.tagline{font-size:13px;margin-top:8px}.form-card{padding-bottom:0}
 legend{font-size:18px;margin-bottom:15px}fieldset{padding-bottom:23px;margin-bottom:23px}.two-fields{gap:12px}.label-row{gap:6px}.car-actions{gap:12px}.car-actions .text-button{font-size:13px}.secondary{padding:11px 13px}.people-row{gap:8px}.stepper input{width:38px}.stepper button{min-width:42px}.submit-row{gap:18px}.primary{padding:12px 14px}
 .result-card{padding:20px}.main-amount{font-size:43px}.main-amount.grouped{font-size:23px}.explain{padding:28px 0;margin-top:34px}.how-steps{grid-template-columns:1fr;gap:20px}.faq{grid-template-columns:1fr;gap:5px;padding:28px 0}.faq h2{margin-bottom:9px}.site-footer{gap:4px 14px;padding:22px 0}.site-footer p{flex-basis:55%}.site-footer nav{margin-left:0;flex-basis:100%;gap:23px}.prose h1{font-size:29px}
 .picker-dialog{margin:auto 0 0;width:100%;max-width:100%;max-height:88dvh;border-radius:14px 14px 0 0;border-bottom:0}.picker-list{max-height:53dvh}.lookup{padding-left:12px}.lookup-stage{margin-top:13px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* The existing header rule doubles as a road; no extra layout space. */
.bill-road{position:absolute;left:0;right:0;bottom:0;height:29px;overflow:hidden;pointer-events:none}
.bill-car{position:absolute;left:0;bottom:0;width:34px;height:21px;color:var(--green);opacity:0}
.bill-arriving .car-wheel{animation:car-wheel-turn 240ms linear infinite;transform-box:fill-box;transform-origin:center}
@keyframes car-wheel-turn{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.bill-car{display:none}.bill-arriving .car-wheel{animation:none}}

.reference-prices{margin-top:10px;border-top:1px solid var(--line)}
.reference-prices summary{color:var(--green);padding:12px 0;font-size:14px}
.reference-prices select{width:100%;min-height:48px;padding:11px 12px;border:1px solid var(--border);border-radius:6px;background:white;margin-top:8px}.reference-prices .hint{margin:10px 0}
.reference-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.price-source{border-left:2px solid var(--green);padding-left:10px}

.product-referral{text-align:center;margin:24px 0 0;font-size:13px;color:var(--muted)}
.product-referral p{margin:4px 0}.product-referral .referral-prompt{margin:0 0 10px;font-size:14px}
.referral-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;max-width:100%;padding:10px 16px;border:1px solid #cddfd2;border-radius:6px;background:#eaf3ec;color:var(--green);font-size:14px;font-weight:600;line-height:1.4;cursor:pointer}
.referral-button svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.referral-button:hover{background:#dfede2;border-color:#aac9b5}.referral-button:active{background:#d4e6d9}
.product-referral #product-share-status:not(:empty){margin-top:10px}.product-referral textarea{width:100%}
.image-preview{width:min(540px,calc(100% - 28px));max-height:90dvh;overflow:auto;padding:20px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink)}
.image-preview::backdrop{background:rgba(20,30,24,.5)}.image-preview-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.image-preview h2{font-size:20px;margin:0}.image-preview img{display:block;width:100%;height:auto;margin:18px 0;border:1px solid var(--line)}.image-preview>.primary{width:100%}


/* Short, readable explanations below the calculator. */
.trip-example{max-width:760px;margin:44px auto;padding:24px 0;border-top:1px solid var(--line)}.trip-example h2{font-size:25px}.trip-example p{color:var(--muted);line-height:1.7}.trip-example strong{color:var(--ink)}.guide-table-wrap{overflow-x:auto}.guide-table{width:100%;border-collapse:collapse;font-size:15px}.guide-table th,.guide-table td{text-align:left;border-bottom:1px solid var(--line);padding:12px 10px;vertical-align:top}.guide-table caption{text-align:left;margin:12px 0;font-weight:600}.editor-note{border-top:1px solid var(--line);margin-top:32px;padding-top:16px;font-size:14px}.site-footer nav{flex-wrap:wrap}.site-header nav{display:flex;gap:16px}.answer-box{border-left:3px solid var(--green);padding-left:18px}.guide-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,720px) minmax(0,1fr);gap:24px;align-items:start;margin-top:44px;margin-bottom:70px}
.guide-layout .prose{grid-column:2;min-width:0;width:100%;margin:0}
.guide-sidebar{position:sticky;top:28px;align-self:start;max-height:calc(100dvh - 56px);overflow:auto}
.guide-directory>summary{display:none}
.guide-directory>.guide-directory-panel{display:block}
.guide-directory-heading{font-size:13px;font-weight:650;color:var(--muted);margin-bottom:12px}
.guide-directory-close{display:none}
.guide-toc{display:flex;flex-direction:column;gap:4px;margin:0;border-left:1px solid var(--line);padding-left:12px}
.guide-toc a{display:block;padding:10px 12px;min-height:44px;text-decoration:none;font-size:14px;line-height:1.5;border-radius:6px}
.guide-toc a:hover,.guide-toc a[aria-current="location"]{background:#e8eee8;color:var(--green)}
.guide-toc a[aria-current="location"]{font-weight:650}
.guide-layout h2[id]{scroll-margin-top:28px}
@media(max-width:1199px){
 .guide-layout{display:block;max-width:720px}
 .guide-sidebar{position:fixed;left:0;top:var(--guide-directory-top,40dvh);z-index:20;max-height:none;overflow:visible}
 .guide-directory>summary{display:flex;align-items:center;gap:6px;min-height:44px;padding:10px 12px;background:var(--paper);color:var(--green);border:1px solid var(--line);border-left:0;border-radius:0 8px 8px 0;box-shadow:0 2px 8px #20262214;font-size:13px;font-weight:600;cursor:pointer;list-style:none}
 .guide-directory>summary::-webkit-details-marker{display:none}
 .guide-directory:not([open])>.guide-directory-panel{display:none}
 .guide-directory-panel{position:absolute;left:0;top:52px;width:min(284px,calc(100vw - 32px));max-height:calc(100dvh - var(--guide-directory-top,40dvh) - 76px);overflow:auto;overscroll-behavior:contain;padding:18px;background:var(--paper);border:1px solid var(--line);border-radius:0 10px 10px 0;box-shadow:0 10px 32px #20262226}
 .guide-directory-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
 .guide-directory-close{display:grid;place-items:center;width:44px;height:44px;margin:-10px -8px -4px 0;background:none;border:0;border-radius:6px;color:var(--muted);font-size:24px}
 .guide-toc{padding-left:0;border:0}
 .guide-toc a{padding:10px 8px}
}
@media(max-width:600px){.guide-layout{margin-top:32px}.guide-directory>summary{writing-mode:vertical-rl;padding:12px 8px;gap:8px}.guide-directory-panel{top:0;left:40px;width:min(264px,calc(100vw - 56px));border-radius:8px;max-height:calc(100dvh - var(--guide-directory-top,40dvh) - 24px)}}.car-actions{align-items:center;flex-wrap:wrap}

.split-method>p{max-width:760px;color:var(--muted);line-height:1.7}.trip-example .guide-table{min-width:560px}.trip-example .guide-table th{color:var(--ink)}.trip-example .guide-table-wrap:focus-visible{outline:2px solid var(--green);outline-offset:4px}

/* Keep helper actions attached to their own fuel field. */
.car-fuel .economy-label{min-height:44px;margin-bottom:4px;align-items:center}
.car-fuel .economy-label>label{margin:0}
.car-fuel .car-actions{margin:0;gap:12px;justify-content:flex-end}
.car-fuel .car-actions .text-button{white-space:nowrap}
.car-fuel .input-with-unit select{min-height:44px;height:44px;flex-shrink:0;padding:0 8px;max-width:116px}
.car-fuel .price-input #currency{border-left:0;border-right:1px solid var(--line);width:78px;color:var(--green);font-weight:550}
.car-fuel .input-with-unit input{width:0;min-width:0}
.car-fuel .car-save-row{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 12px;margin-top:2px}
.car-fuel .car-save-row .hint{margin:0;font-size:12px}
.car-fuel .car-save-row .text-button{flex-shrink:0}
.car-fuel .car-secondary-actions{display:flex;align-items:center;flex-wrap:wrap;gap:0 16px}
.car-fuel .car-secondary-actions:not(:has(button:not([hidden]))){display:none}
.car-fuel #economy-source{font-size:12px;margin-top:5px}
.car-fuel .price-field{margin-top:16px}
.car-fuel #storage-status{font-size:12px;margin-top:5px}
.car-fuel .reference-prices{margin-top:10px}
.input-with-unit:has(input[aria-invalid=true]){border-color:var(--error);box-shadow:0 0 0 1px var(--error)}
@media(max-width:420px){.car-fuel .car-save-row{column-gap:10px}.car-fuel .input-with-unit select{font-size:13px}.car-fuel .price-input #currency{width:72px}}

/* One chevron and a reserved text gutter for all closed dropdown controls. */
#trip-form select,.picker-trigger{
 appearance:none;-webkit-appearance:none;
 background-image:url('/chevron-down.svg');background-repeat:no-repeat;
 background-position:right 12px center;background-size:14px 14px;
 padding-right:38px;padding-left:12px;
}
#trip-form select.unit{min-width:72px;max-width:none}
#trip-form .input-with-unit select{max-width:none}
#trip-form #currency{width:84px}
#trip-form #economy-unit{width:124px}
#trip-form #price-unit{width:112px}
.picker-trigger>span[aria-hidden=true]{display:none}
@media(max-width:420px){
 #trip-form select,.picker-trigger{background-position:right 10px center;padding-right:32px;padding-left:10px}
 #trip-form #currency{width:78px}
 #trip-form #economy-unit{width:118px}
 #trip-form #price-unit{width:104px}
}
@media(forced-colors:active){
 #trip-form select{appearance:auto;-webkit-appearance:auto;background-image:none;padding-right:8px}
 .picker-trigger{background-image:none;padding-right:12px}
 .picker-trigger>span[aria-hidden=true]{display:inline}
}

.distance-input-row{margin-top:7px}
.distance-unit-control{display:flex;align-items:center;flex-shrink:0}
#trip-form #distance-unit{width:88px;min-height:44px;color:var(--green)}
.return-trip-option{display:flex;align-items:center;gap:10px;min-height:44px;margin:8px 0 0;cursor:pointer;font-weight:500}
#trip-type{appearance:auto;-webkit-appearance:auto;accent-color:var(--green);width:18px;height:18px;min-width:18px;min-height:18px;margin:0;padding:0;flex-shrink:0}
.return-trip-option>span{margin:0;color:var(--ink);font-weight:500}
.return-trip-option .return-trip-note{margin:0;color:var(--muted);font-weight:400}
#distance-help{margin-top:2px;font-size:12px}
.odometer-unit-row{grid-column:1/-1;display:flex;justify-content:flex-end}
@media(max-width:420px){#trip-form #distance-unit{width:78px}.return-trip-option{font-size:13px}}
/* Standalone odometer units need their own field boundary. */
#odometer-unit-slot #distance-unit{border:1px solid var(--border);border-radius:6px;background-color:white;box-shadow:none}

/* Language navigation: explicit page links; never redirects by location. */
.site-header{height:auto;min-height:82px;padding-block:14px;gap:20px}
.site-header>nav{margin-left:auto;align-items:center;flex-wrap:wrap;min-width:0}
.language-menu{position:relative;flex-shrink:0;z-index:30}
.language-menu>summary{display:flex;align-items:center;gap:8px;list-style:none;min-height:44px;padding:8px 10px;border:1px solid var(--border);border-radius:6px;font-size:14px;color:var(--green);background:var(--paper);white-space:nowrap}
.language-menu>summary::-webkit-details-marker{display:none}
.language-menu:not([open])>.language-options{display:none}
.site-header .language-options{position:absolute;right:0;top:calc(100% + 8px);display:flex;flex-direction:column;gap:2px;width:236px;max-width:calc(100vw - 32px);margin:0;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--paper);box-shadow:0 8px 28px #20262220}
.language-options a{display:block;min-height:44px;padding:10px;border-radius:5px}
.language-options a:hover,.language-options a[aria-current=page]{background:#e8eee8}
.language-options a[aria-current=page]{font-weight:650}
.language-options p{font-size:12px;line-height:1.5;color:var(--muted);margin:6px 10px;white-space:normal}
/* Translate at normal reading sizes. Let words and rows grow instead of clipping. */
:lang(de) h1,:lang(de) h2,:lang(de) h3,:lang(de) .prose,:lang(de) .hint,:lang(de) dt{hyphens:auto;overflow-wrap:break-word}
:lang(es) h1,:lang(es) h2,:lang(es) .prose{overflow-wrap:break-word}
.form-card label,.result-column dt,.result-column p{min-width:0;overflow-wrap:break-word}
.segmented button,.primary,.secondary{min-width:0;white-space:normal;overflow-wrap:break-word;text-align:center}
.bill-actions{flex-wrap:wrap}.bill-actions button{flex:1 1 140px;white-space:normal}
.car-fuel .economy-label{flex-wrap:wrap;column-gap:12px}
.car-fuel .car-actions .text-button{white-space:normal;text-align:right}
.totals dt,.cost-items dt{min-width:0}.totals dd,.cost-items dd{flex-shrink:0;max-width:60%}
.result-top{flex-wrap:wrap}.receipt-brand{flex-shrink:0}
.guide-toc a{overflow-wrap:break-word;hyphens:auto}
@media(max-width:600px){
 .site-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding-block:10px;min-height:66px}
 .site-header>.brand{grid-column:1;grid-row:1}
 .site-header>.language-menu{grid-column:2;grid-row:1}
 .site-header>nav{grid-column:1/-1;grid-row:2;margin:0;gap:8px 20px}
 .site-header>nav>a{display:inline-flex;align-items:center;min-height:36px}
 .language-menu>summary{font-size:13px;padding-inline:8px}
 .submit-row{flex-wrap:wrap;gap:8px 16px}.submit-row>.primary{flex-basis:160px}
}
@media(max-width:420px){
 .people-row{flex-wrap:wrap;gap:10px}.people-row>.stepper{margin-left:auto}
 .unit-preset-row select{width:100%;font-size:12px}
 .image-preview-header{align-items:flex-start}.image-preview-header h2{min-width:0;overflow-wrap:break-word}
}