:root{--blue:#085ca8;--pale:#eaf4fc;--ink:#233747;--line:#e8eaee}*{box-sizing:border-box}body{margin:0;background:#fff;color:var(--ink);font:16px/1.55 "Roboto",sans-serif}header{height:72px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 max(24px,calc((100vw - 1380px)/2));gap:16px}header span{color:#687786;font-size:14px}.brand{font-size:30px;font-weight:800;text-decoration:none;color:var(--blue)}main{max-width:1432px;margin:36px auto;padding:0 26px 150px}.heading{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-bottom:28px}h1{font-size:28px;color:var(--blue);margin:0}h2{font-size:23px;margin:20px 0 16px}h3{font-size:18px;color:var(--blue)}.progress{display:flex;list-style:none;padding:0;margin:0;min-width:360px;counter-reset:step}.progress li{flex:1;position:relative;text-align:center;color:#758491;font-size:12px}.progress li:before{content:'';height:2px;background:#d6e8f7;position:absolute;top:16px;left:-50%;width:100%;z-index:-1}.progress li:first-child:before{display:none}.progress b{display:grid;place-items:center;border:4px solid #d6e8f7;background:white;border-radius:50%;width:34px;height:34px;margin:0 auto 5px;color:var(--blue)}.progress li.active b,.progress li.done b{background:var(--blue);border-color:var(--blue);color:white}.progress li.active,.progress li.done{color:var(--blue)}.progress li.done:before,.progress li.active:before{background:var(--blue)}.intro{padding:28px 36px;border-radius:16px;background:var(--pale);margin-bottom:26px}.intro h2{font-size:34px;margin:10px 0}.intro p{margin:0}.eyebrow{color:var(--blue);font-size:13px;font-weight:bold;letter-spacing:2px}.columns{display:grid;grid-template-columns:1fr 1fr;gap:24px}.panel{border:1px solid var(--line);border-radius:15px;padding:24px;margin-bottom:24px;min-width:0}.panel>h2:first-child{margin-top:0}.benefits strong{color:var(--blue);font-size:20px}.fields{display:grid;gap:20px;margin:12px 0 24px}.two{grid-template-columns:repeat(2,minmax(0,1fr))}.four{grid-template-columns:repeat(4,minmax(0,1fr))}label{display:block;font-size:15px}input,select{display:block;width:100%;height:50px;border:1px solid var(--line);border-radius:13px;padding:10px 16px;margin-top:7px;background:white;color:var(--ink);font:inherit;min-width:0}input:focus,select:focus,button:focus-visible{outline:3px solid #add4f4;outline-offset:2px}input[readonly]{background:#f3f4f6}input::placeholder{color:#9ca6b0}sup{color:var(--blue)}.span2{grid-column:span 2}.wide{grid-column:1/-1}.check{display:flex;align-items:flex-start;gap:12px}.check input,input[type=radio]{width:23px;height:23px;flex-shrink:0;accent-color:var(--blue);margin:1px 0}.invoice-tabs{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin:22px 0}.invoice-tabs label{display:flex;gap:10px;align-items:center;border:1px solid var(--line);padding:12px;border-radius:10px}.muted{color:#74808b;font-size:14px}.confirmation{display:grid;grid-template-columns:1.5fr 1fr;gap:24px;align-items:start}.panel-heading{display:flex;justify-content:space-between;gap:16px;align-items:center;border-bottom:1px solid var(--line);margin-bottom:16px;padding-bottom:16px}.panel-heading h2{margin:0}.text-button{background:none;color:var(--ink);padding:4px;white-space:nowrap}.badge{background:#f2f3f6;border-radius:50%;display:inline-grid;place-items:center;width:32px;height:32px;font-size:18px}dl{display:grid;grid-template-columns:1fr 1.6fr;gap:12px 24px;margin:0}dt{color:#5b6772}dd{margin:0;overflow-wrap:anywhere}.vehicle-summary,.agreement{background:#f4f5f7;border-radius:14px;padding:20px}.price-box{background:var(--blue);color:white;border-radius:15px 15px 0 0;padding:24px}.price-box>div{display:flex;justify-content:space-between;gap:20px;margin-bottom:18px}.price-box b{white-space:nowrap}.price-box .grand-total{border-top:1px dashed #ffffff80;padding-top:16px;margin:0}.agreement{border-radius:0 0 15px 15px}.agreement details{padding-left:35px}details{margin-top:18px}summary{cursor:pointer;color:var(--blue)}button{border:0;border-radius:12px;background:var(--blue);color:white;font:600 16px "Roboto",sans-serif;padding:16px 32px;cursor:pointer}button:disabled{background:#b8bec5;cursor:not-allowed}.secondary{background:var(--pale);color:var(--blue)}.dock{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--line);padding:14px 24px;z-index:10}.dock>div{max-width:1380px;margin:auto;display:flex;gap:20px;align-items:center}.dock-total{margin-left:auto}.dock-total strong{color:var(--blue)}#apiStatus{color:var(--blue)}[hidden]{display:none!important}@media(max-width:900px){.four{grid-template-columns:repeat(2,minmax(0,1fr))}.confirmation,.columns{grid-template-columns:1fr}.heading{align-items:flex-start;flex-direction:column}.progress{width:100%;min-width:0}.panel{padding:20px}main{margin-top:24px}h1{font-size:25px}}@media(max-width:520px){main{padding:0 16px 160px}header{padding:0 16px}header span{font-size:11px}.fields{grid-template-columns:1fr;gap:16px}.span2{grid-column:auto}.intro{padding:24px}.intro h2{font-size:27px}h2{font-size:21px}.dock{padding:12px}.dock>div{gap:8px;flex-wrap:wrap}.dock-total{font-size:14px;order:-1;width:100%;text-align:right}button{padding:14px 22px}#next{margin-left:auto}dl{grid-template-columns:1fr 1.25fr;gap:10px;font-size:14px}.price-box{padding:18px;font-size:14px}}
.upload-strip{display:flex;align-items:center;gap:16px;background:#f4f5f7;padding:10px 14px;border-radius:14px;width:fit-content;max-width:100%;margin-bottom:20px}.upload-strip button{padding:12px 20px;white-space:nowrap}#ocrResults{background:var(--pale);padding:12px;border-radius:12px}@media(max-width:520px){.upload-strip{font-size:13px}}
.brand img{display:block;width:150px;max-height:55px;object-fit:contain}.dock-total small{font-size:12px;color:#74808b}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.choice-grid{display:grid;gap:16px}.vehicle-choices{grid-template-columns:repeat(4,minmax(0,1fr))}.term-choices{grid-template-columns:repeat(3,minmax(0,1fr))}.choice-card{position:relative;cursor:pointer;min-width:0}.choice-card input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.choice-content{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:13px;min-height:155px;border:1px solid transparent;border-radius:18px;background:#f4f5f7;padding:18px 9px;text-align:center;font-size:18px;line-height:1.5}.choice-content svg{height:56px;width:56px;color:#5b697b;flex-shrink:0}.choice-card input:checked+.choice-content{border-color:var(--blue);background:#fff;color:var(--blue);font-weight:600}.choice-card input:checked+.choice-content svg{color:var(--blue)}.choice-card input:focus-visible+.choice-content{outline:3px solid #add4f4;outline-offset:3px}.upload-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:16px 0}.upload{border:1px solid #c7e4ff;border-radius:12px;background:#fff}.upload button{display:flex;align-items:center;gap:12px;width:100%;height:100%;padding:18px;color:var(--blue);background:none;text-align:left}.upload button small{display:block;color:#74808b;font-weight:400;margin-top:6px}.upload-icon{font-size:28px;background:var(--pale);padding:8px 16px;border-radius:8px}.notice{background:var(--pale);padding:16px;border-radius:12px;font-size:14px}.dragging{outline:3px dashed var(--blue)}.preview-row{display:flex;align-items:center;gap:20px;margin:20px 0}.preview-row img{width:180px;max-height:160px;object-fit:contain}.preview-row>div{min-width:0;flex:1}.preview-row strong{overflow-wrap:anywhere}#ocrPanel{border:1px solid var(--line);border-radius:14px;padding:20px;margin:20px 0}progress{width:100%;accent-color:var(--blue)}.ocr-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ocr-result{display:flex;flex-direction:column;padding:14px;background:var(--pale);border-radius:12px;overflow-wrap:anywhere}.ocr-result small{color:#667788}.ocr-result .text-button{align-self:flex-start}pre{white-space:pre-wrap;overflow:auto;max-height:220px;font-size:12px}.columns{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}@media(max-width:1000px){.columns{grid-template-columns:1fr}.choice-content{min-height:160px;font-size:20px}}@media(max-width:520px){.vehicle-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.choice-grid{gap:12px}.choice-content{font-size:16px;min-height:140px}.term-choices .choice-content{min-height:130px;font-size:16px;padding:12px 4px}.choice-content svg{height:48px;width:48px}.upload-row{grid-template-columns:1fr}.preview-row{align-items:flex-start;flex-direction:column}.ocr-results{grid-template-columns:1fr}.brand img{width:125px}}
/* Payment and result use the same page panels, typography and VNPT colours. */
main{padding-bottom:calc(var(--dock-height,90px) + 32px)}.qr-payment{text-align:center}.qr-payment>h2{margin-top:0}#inlineQrPanel{display:flex;align-items:center;flex-direction:column;gap:16px;margin:24px auto}#inlineQrImage{display:block;width:min(240px,70vw);height:auto;aspect-ratio:1;border:1px solid var(--line);border-radius:12px;padding:12px;background:white}.payment-timer{font-weight:600;color:var(--blue);font-variant-numeric:tabular-nums}.payment-instructions{margin-top:24px}.payment-instructions h3{margin-top:0}.payment-instructions p{margin-bottom:0}.result-message{display:flex;align-items:center;gap:20px}.result-message h2{margin:0 0 8px;color:var(--blue)}.result-message p{margin:0 0 8px}.result-symbol{display:grid;place-items:center;flex-shrink:0;width:56px;height:56px;border-radius:50%;background:var(--pale);color:var(--blue);font-size:30px}.is-pending{animation:payment-pulse 1.5s ease-in-out infinite}.certificate-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.action-link{display:inline-flex;justify-content:center;align-items:center;text-align:center;border:0;border-radius:12px;background:var(--blue);color:white;font:600 16px "Roboto",sans-serif;padding:16px 24px;text-decoration:none}.action-link.secondary{background:var(--pale);color:var(--blue)}.certificate-frame{width:100%;height:min(75vh,780px);border:1px solid var(--line);border-radius:12px;margin-top:20px}#inlineDownloadQr{color:var(--blue);text-decoration:none}#inlineResultStatus{color:var(--blue)}a:focus-visible{outline:3px solid #add4f4;outline-offset:3px}.dock{padding-bottom:max(14px,env(safe-area-inset-bottom))}.dock>div>button,.dock>div>.action-link{flex-shrink:0}.dock-total{min-width:0}@keyframes payment-pulse{50%{opacity:.45}}@media(prefers-reduced-motion:reduce){.is-pending{animation:none}}
@media(max-width:760px){body{font-size:14px;line-height:1.5}header{height:60px;padding:0 16px}header span{font-size:11px}.brand img{width:120px;max-height:45px}main{margin:20px auto;padding-left:14px;padding-right:14px}.heading{gap:18px;margin-bottom:20px}h1{font-size:22px;line-height:1.35}h2{font-size:18px;margin:18px 0 12px}h3{font-size:16px}.panel{padding:18px;margin-bottom:18px;border-radius:13px}.columns,.confirmation{gap:0;grid-template-columns:1fr}.intro{padding:20px 22px;margin-bottom:18px}.intro h2{font-size:25px}.eyebrow{font-size:11px}.fields{gap:14px;margin:10px 0 20px}.muted{font-size:12px}.benefits strong{font-size:17px}.choice-content{font-size:15px;min-height:132px}.choice-content svg{width:44px;height:44px}.check{gap:9px;font-size:13px}.check input,input[type=radio]{width:20px;height:20px}.invoice-tabs{gap:10px;margin:16px 0}.invoice-tabs label{padding:10px;font-size:13px}.panel-heading{padding-bottom:12px;margin-bottom:14px;gap:10px}.panel-heading h2{font-size:18px}.badge{width:26px;height:26px;font-size:14px}.vehicle-summary,.agreement{padding:16px}.agreement details{padding-left:29px}dl{font-size:13px;gap:10px 16px}.price-box{padding:18px;font-size:14px}.price-box>div{gap:14px;margin-bottom:14px}.notice{font-size:12px}.upload button{font-size:14px;padding:14px}.upload button small{font-size:12px}.upload-icon{font-size:24px;padding:6px 12px}button,.action-link{font-size:14px;padding:13px 20px;border-radius:10px;min-height:44px}.text-button{padding:6px;min-height:36px}.dock{padding:10px 14px max(10px,env(safe-area-inset-bottom))}.dock>div{gap:10px}.dock-total{font-size:13px}.dock-total small{font-size:11px}.payment-instructions{margin-top:18px}.result-symbol{width:44px;height:44px;font-size:25px}.result-message{gap:14px}.result-message h2{font-size:19px}.certificate-actions{gap:10px}.certificate-frame{height:65vh}.preview-row img{width:150px}#ocrPanel{padding:16px}}
@media(max-width:520px){header{height:56px;padding:0 12px}header span{font-size:10px;max-width:150px;text-align:right}.brand img{width:108px}main{margin-top:16px;padding-left:12px;padding-right:12px}.heading{gap:14px;margin-bottom:18px}h1{font-size:20px}h2,.panel-heading h2{font-size:17px}h3{font-size:15px}.progress li{font-size:10px}.progress b{width:29px;height:29px;border-width:3px;font-size:12px}.progress li:before{top:14px}.intro{padding:18px}.intro h2{font-size:22px}.intro p{font-size:13px}.panel{padding:16px;margin-bottom:16px}.fields{gap:13px}.fields label{font-size:13px}input,select{height:44px;font-size:16px;border-radius:9px;padding:9px 12px;margin-top:5px}.choice-grid{gap:10px}.choice-content{gap:10px;min-height:112px;padding:14px 8px;border-radius:13px;font-size:14px}.choice-content svg{width:40px;height:40px}.term-choices .choice-content{min-height:106px;font-size:14px;padding:12px 4px}.term-choices .choice-content svg{width:38px;height:38px}.vehicle-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.term-choices{grid-template-columns:repeat(3,minmax(0,1fr))}.vehicle-summary,.agreement{padding:14px}dl{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:9px 12px;font-size:13px}.price-box{padding:16px;font-size:13px}.price-box b{white-space:normal;text-align:right;flex-shrink:0}.badge{width:24px;height:24px;font-size:13px}.dock>div{flex-wrap:wrap;gap:8px}.dock-total{order:-1;width:100%;text-align:right}.dock-total small{display:inline}.dock>div>button:last-of-type,.dock>div>.action-link{margin-left:auto}.upload-row{gap:12px}.upload button{padding:12px}.preview-row{gap:12px}.preview-row img{width:100%;max-height:160px}.certificate-actions>*{flex:1 1 auto}.certificate-actions .text-button{width:100%;font-size:13px;white-space:normal}.result-message{align-items:flex-start;gap:12px}.result-message h2{font-size:18px}.payment-instructions p{font-size:13px}#inlineQrPanel{margin:18px auto}#inlineQrImage{width:min(220px,65vw)}#inlinePaymentSummary{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}}
@media(max-width:360px){h1{font-size:19px}.panel{padding:13px}.intro{padding:16px}.choice-content{font-size:13px;min-height:105px}.choice-content svg{width:36px;height:36px}.dock-total{font-size:12px}.dock-total small{font-size:10px}.result-message h2{font-size:17px}}
/* Typography measured from MIC's public component CSS: text-2xl 24/32,
   text-xl 20/28, text-base 16/24 and text-sm 14/20. */
:root{--font-family:"Roboto",sans-serif;--font-title:24px;--font-section:20px;--font-body:16px;--font-label:14px}
body{font-family:var(--font-family);font-size:var(--font-body);font-weight:400;line-height:24px}
button,input,select,textarea,.action-link{font-family:var(--font-family)}
h1{font-size:var(--font-title);font-weight:500;line-height:32px}
h2,.panel-heading h2,.result-message h2{font-size:var(--font-section);font-weight:500;line-height:28px}
h3{font-size:var(--font-body);font-weight:500;line-height:24px}
.intro h2{font-size:var(--font-title);font-weight:500;line-height:32px}
.intro p,.benefits p,.agreement,.check,.payment-instructions p,dl,.price-box,.dock-total{font-size:var(--font-body);line-height:24px}
label,.fields label{font-size:var(--font-label);font-weight:400;line-height:20px}
input,select{font-size:var(--font-body);font-weight:400;line-height:24px}
button,.action-link,.text-button,.upload button{font-size:var(--font-body);font-weight:500;line-height:24px}
.choice-content{font-size:16px;font-weight:400;line-height:28px}
.choice-card input:checked+.choice-content{font-weight:500}
.term-choices .choice-content{font-size:var(--font-body);line-height:24px}
#vehicleChoiceTitle,#termChoiceTitle{font-size:var(--font-body);font-weight:500;line-height:24px}
.benefits strong{font-size:var(--font-body);font-weight:500;line-height:24px}
strong,b{font-weight:500}
.muted,.notice,.upload button small,.invoice-tabs label{font-size:var(--font-label);line-height:20px}
.dock-total small{font-size:12px;line-height:16px}
@media(max-width:767px){.choice-content{font-size:var(--font-body);line-height:24px}}

/* Use the supplied SVG artwork as masks to retain VNPT selection colours. */
.vehicle-icon{display:block;width:56px;height:56px;flex-shrink:0;background-color:#5b697b;mask-repeat:no-repeat;mask-position:center;mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain}
.vehicle-icon.motorcycle{mask-image:url("vector/bike2.svg");-webkit-mask-image:url("vector/bike2.svg")}
.vehicle-icon.electric{mask-image:url("vector/ic_xe_may_dien.svg");-webkit-mask-image:url("vector/ic_xe_may_dien.svg")}
.vehicle-icon.scooter{mask-image:url("vector/ic_xe_may_small.svg");-webkit-mask-image:url("vector/ic_xe_may_small.svg")}
.choice-card input:checked+.choice-content .vehicle-icon{background-color:var(--blue)}
@media(max-width:760px){.vehicle-icon{width:44px;height:44px}}
@media(max-width:520px){.vehicle-icon{width:40px;height:40px}}
@media(max-width:360px){.vehicle-icon{width:36px;height:36px}}
header .secure{display:flex;align-items:center;gap:9px;flex-shrink:0;color:var(--blue);background:#edf8ff;border-radius:13px;padding:8px 14px;font-size:11px;font-weight:700;line-height:1.35;text-align:left;max-width:none}
.voucher-box{border:1px solid #dbe8f4;border-radius:14px;padding:18px;background:#f8fbff}
.voucher-box label{display:block;margin-bottom:8px;font-weight:500}
.voucher-box input{width:100%;box-sizing:border-box;background:#fff}
.voucher-box input[aria-invalid="true"]{border-color:#c33d4d}
.voucher-box button{width:100%;margin-top:4px}
.voucher-status{display:flex;align-items:flex-start;gap:10px;margin:14px 0 0;padding:12px 14px;border:1px solid transparent;border-radius:10px;font-size:14px;line-height:21px;overflow-wrap:anywhere}
.voucher-status[hidden]{display:none}
.voucher-status::before{flex:none;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;font-weight:700}
.voucher-status.is-success{color:#166443;background:#eaf7ef;border-color:#bde3cc}
.voucher-status.is-success::before{content:'✓';background:#166443;color:#fff}
.voucher-status.is-error{color:#a32c3c;background:#fff1f2;border-color:#f1c5cc}
.voucher-status.is-error::before{content:'!';background:#a32c3c;color:#fff}
.voucher-status.is-loading{color:#145e95;background:#eaf4ff;border-color:#c7dff5}
.voucher-status.is-loading::before{content:'…';background:#d2e8fc}
header .secure svg{width:26px;height:26px;flex-shrink:0}
header .secure span{color:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;text-align:left;max-width:none}
@media(max-width:760px){header .secure{gap:6px;padding:7px 9px;font-size:9px}header .secure svg{width:23px;height:23px}}
/* AAA banner: one row on desktop, two stacked rows on mobile. */
.intro{display:flex;align-items:center;gap:clamp(24px,3vw,44px)}
.intro-logo{display:block;width:130px;max-width:100%;height:auto;flex-shrink:0;object-fit:contain}
.intro-content{min-width:0}
.intro .intro-content h2{margin:0 0 8px}
@media(max-width:760px){
    .intro{flex-direction:column;align-items:flex-start;gap:12px}
    .intro-logo{width:100px}
}
.issuance-badge{color:var(--blue);font-size:13px;font-weight:600;overflow-wrap:anywhere}
.issuance-progress{background:var(--pale)}
.issuance-progress ol{display:flex;flex-wrap:wrap;gap:12px 28px;list-style:none;padding:0;margin:0;color:var(--blue);font-weight:600}
.issuance-progress p{margin-bottom:0}
@media(max-width:760px){.issuance-progress ol{flex-direction:column;gap:10px}}
.intro .intro-content h2{font-size:16px;line-height:24px}
.intro .intro-content p{font-size:14px;line-height:21px}
#step0 .columns>.panel:first-child>h2{margin-bottom:8px}
#step0 .columns>.panel:first-child>.fields{margin-top:0}
#vehicleChoiceTitle{margin-top:0}
@media(max-width:760px){
    .intro .intro-content h2{font-size:13px;line-height:19px;margin-bottom:5px}
    .intro .intro-content p{font-size:11px;line-height:17px}
}

.result-symbol.is-pending{position:relative;animation:none}.result-symbol.is-pending:after{content:'';width:30px;height:30px;border:3px solid #c8def2;border-top-color:var(--blue);border-radius:50%;animation:issuance-spin .9s linear infinite}@keyframes issuance-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.result-symbol.is-pending:after{animation:none}}

.issuance-copy{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;box-sizing:border-box;width:18px;height:18px;padding:0;margin:0 4px;border:1px solid #c8def2;border-radius:6px;background:#fff;color:#085ca8;cursor:pointer;min-width:18px;min-height:18px}.issuance-copy svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}.issuance-copy:focus-visible{outline:3px solid #add4f4;outline-offset:2px}.issuance-copy-feedback{font-size:13px;color:#085ca8}.issuance-copy-source{position:fixed;left:-9999px;top:0}

.result-message{display:block}.result-message-heading{display:flex;align-items:center;gap:12px}.result-message-heading .result-symbol{width:36px;height:36px;font-size:22px}.result-message-heading #inlineResultTitle{flex:1;min-width:0;margin:0;font-size:16px;line-height:1.5}.result-message #inlineResultMessage{margin:14px 0 10px;font-size:14px;line-height:1.7;text-align:justify;text-align-last:left;overflow-wrap:anywhere}.result-message #inlineResultBadge,.result-message #inlinePolicy{font-size:14px;line-height:1.6}.result-message-heading .result-symbol.is-pending:after{width:20px;height:20px}

/* Contain mobile edge dragging across every purchase/payment/result step. */
.agreement.personal-agreement{border:1px solid var(--line);border-radius:14px;margin-bottom:24px}
html{overscroll-behavior:none;overflow-x:hidden;overflow-x:clip}
body{width:100%;min-width:0;overflow-x:hidden;overflow-x:clip}
main,header,.dock{min-width:0}
main{width:100%;max-width:1432px}
header,.dock{max-width:100%}
.columns>*,.confirmation>*,.fields>*,.heading>*,.panel-heading>*,.upload-row>*,.upload button>*,dl>*{min-width:0}
.panel,.notice,.dock-total,.upload button{overflow-wrap:anywhere}
img,video,iframe{max-width:100%}
.brand{min-width:0}
.brand img{max-width:100%;height:auto}
.dock>div{flex-wrap:wrap}
@media(max-width:760px){
 .panel-heading{flex-wrap:wrap}
 .upload-strip{flex-wrap:wrap}
 .upload button{flex-wrap:wrap}
 .upload button>span:last-child{flex:1;min-width:120px}
 .dock-total{overflow-wrap:anywhere}
}
.agreement:focus-within{outline:3px solid #add4f4;outline-offset:3px}

/* Keep long payment copy and consent aligned with their controls. */
#inlineVoucherProgram{margin:0 0 16px;text-align:justify}
#inlineVoucherHint{margin:10px 0 14px}
.payment-instructions h3{margin:0 0 12px}
.payment-instructions p{margin:0;text-align:left}
.agreement .check{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;text-align:left}
.agreement .check input{width:20px;height:20px;margin:2px 0 0;padding:0}
.agreement .check span{min-width:0;text-align:justify}
.agreement details{padding-left:30px;margin-top:12px}
.agreement details p{margin:10px 0 0;text-align:left}
@media(max-width:760px){
    :root{--font-title:20px;--font-section:18px;--font-body:14px}
    h1{line-height:28px}
    h2,.panel-heading h2,.result-message h2{line-height:26px}
    .agreement,.agreement .check,.payment-instructions p,dl,.price-box,.dock-total{font-size:14px;line-height:22px}
    .voucher-box,.payment-instructions,.agreement{padding:14px}
    #inlineVoucherProgram,#inlineVoucherHint{font-size:13px;line-height:20px}
    #inlineVoucherProgram{margin-bottom:14px}
    .voucher-box label{margin-bottom:6px;font-size:14px;line-height:20px}
    .voucher-box input{margin-top:0;font-size:16px}
    .voucher-box button{margin-top:0;font-size:14px;line-height:22px}
    .payment-instructions{margin-top:16px}
    .payment-instructions h3{font-size:15px;line-height:22px;margin-bottom:10px}
    .agreement .check input{margin-top:1px}
}
@media(max-width:360px){
    :root{--font-title:18px;--font-section:16px}
    h1{line-height:26px}
}
#vehicleChoiceTitle { scroll-margin-top: 5rem; }
.vehicle-required { color: #a32121; }
.vehicle-choice-error:not([hidden]) {
  display: flex; align-items: flex-start; gap: .65rem;
  margin: .5rem 0 .75rem; padding: .75rem;
  border: 1px solid #e6aaaa; border-left: 4px solid #a32121; border-radius: .65rem;
  background: #fff2f1; color: #781c1c; font-size: .9375rem; line-height: 1.45;
}
.vehicle-choice-error strong { display: block; font-weight: 700; }
.vehicle-choice-error p { margin: .2rem 0 0; }
.vehicle-choice-alert-icon {
  display: grid; place-items: center; flex: 0 0 1.25rem;
  height: 1.25rem; border-radius: 50%; background: #a32121; color: #fff; font-weight: 700;
}
.vehicle-choices[aria-invalid=true] .choice-content { border-color: #d59393; }
@media (max-width: 767px) {
  .fields label { min-width: 0; }
  input:not([type=radio]):not([type=checkbox]), select { box-sizing: border-box; max-width: 100%; font-size: 16px; }
  input:focus, select:focus, .choice-card input:focus-visible + .choice-content { outline: 2px solid #2878bd; outline-offset: -2px; }
}
