/* Reproduction of the supplied reference, with real live controls over its painted HUD. */
body{background:#0d352a}.header{height:98px;background:#0c352a;padding:0 34px;border-bottom:2px solid #c6b568;gap:24px}.brand strong{font-size:30px}.brand small{letter-spacing:5px}.brand-mark{width:62px;height:62px}.brand-mark svg{width:40px;height:40px}.rank-nav{gap:10px}.rank-nav button{font-size:15px!important;min-height:50px;padding:12px 16px!important;border-radius:15px!important;background:#123d30!important}.rank-nav .game-icon{width:23px;height:23px}.main-wallet{min-width:160px}.header-right{gap:14px}
main{padding:0;max-width:1920px}.world{height:calc(100dvh - 370px);min-height:310px;max-height:none;border:0;border-radius:0;box-shadow:none}.world-top{top:20px;left:20px;right:20px}.scene-caption{display:none}.world-top #pause{margin-left:auto;width:36px;min-height:34px;padding:5px}.world-bottom{bottom:14px}.world-bottom>.own-label{display:none}.journey-bar{position:absolute;z-index:3;bottom:285px;left:18px;width:min(670px,70%);height:32px;padding:3px 12px;gap:12px;background:#15382cdd;border:1px solid #b4b78566;border-radius:9px;color:#f6e9c3}.journey-bar .place{min-width:145px}.journey-bar .place strong{font-size:11px}.journey-bar .location-icon{display:none}.journey-bar .route{width:210px}.journey-bar .traffic-label{display:none}.journey-bar #map-open{font-size:10px}.world-bottom .scene-actions{margin-left:auto}.world-bottom #pickup{font-size:10px;padding:6px 10px}
.dashboard{position:relative;display:block;isolation:isolate;height:250px;min-height:250px;padding:0;margin:0;background:url('./assets/reference-deck-v56.png') center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none}
.dashboard .metrics,.dashboard .service-buttons,.dashboard .deck-navigation{display:contents}
.dashboard .metric,.dashboard .inventory,.dashboard .service-buttons button,.dashboard .deck-navigation button{position:absolute;box-sizing:border-box;background:transparent;border:0;border-radius:0;box-shadow:none;margin:0;min-width:0;max-width:none}
.dashboard .metric.speed{left:3%;top:6%;width:18.1%;height:53%;padding:8px 2px!important;text-align:left;display:block}.speed label{color:#2c3729;font-size:14px;font-weight:800;letter-spacing:0;margin:0 8px 12px}.speed strong{border:0;background:transparent;box-shadow:none;height:76px;padding:4px 8px;color:#f5d773}.speed strong small{font-size:17px;color:#ffebaf;font-weight:750}.speed #speed-value{color:#f3d47d}.speed .metric-foot{display:none}
.dashboard .metric:nth-child(2){left:24.4%;top:12%;width:12%;height:45%;padding:0!important;display:block}.dashboard .metric:nth-child(3){left:39.3%;top:12%;width:10%;height:45%;padding:0!important;display:block}
.dashboard .metric:not(.speed) label{font-size:14px;font-weight:700;margin:0 0 4px 55px;color:#f6f0d8;white-space:nowrap}.dashboard .metric:not(.speed) label:before{content:none}.dashboard .metric:not(.speed) strong{display:block;margin-left:55px;font-size:36px;line-height:1.05;font-weight:850;color:#fffef3}.dashboard .metric:not(.speed) strong small{font-size:18px;margin-left:2px}.dashboard .metric-icon{display:block;position:absolute;left:0;top:1px;width:45px;height:51px;background:url('./assets/hud-fuel-v56.png') center/contain no-repeat}.dashboard .metric-icon svg{display:none}.dashboard .metric:nth-child(3) .metric-icon{background-image:url('./assets/hud-wrench-v56.png')}.dashboard .speed .metric-icon{display:none}.dashboard .metric-foot{display:none}.dashboard .meter{margin-top:11px;height:15px;border:2px solid #78964d;box-shadow:inset 0 2px 3px #031d12;border-radius:9px;background:#092e24;width:100%;max-width:none}.dashboard .meter i{background:linear-gradient(0deg,#5bbc49,#c1ed75);box-shadow:inset 0 2px #d8f9b2;border-radius:7px}.dashboard .range-value{font-size:14px;font-weight:700;color:#f4dc85;white-space:nowrap;margin-top:6px}
.dashboard .inventory{left:53.6%;top:9%;width:43%;height:49%;padding:6px 6px 0;overflow:visible}.dashboard .inventory-title{font-size:17px;margin-bottom:12px;font-weight:800;color:#ffe292}.dashboard .inventory-title b{font-size:16px;color:#ffe292}.dashboard .slots{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;align-items:start}.dashboard .slot{aspect-ratio:1;width:100%;max-width:64px;height:auto;min-height:0;border-radius:11px;background:#f5edd5;border:2px solid #fff7df;box-shadow:0 3px 2px #021e16aa;justify-self:center}.dashboard .slot .loot-icon{max-width:none;max-height:none;width:100%!important;height:100%!important;aspect-ratio:1;object-fit:contain;padding:5px;image-rendering:auto}.dashboard .slot.empty{background:#d8cead;border:1px solid #eae2bd;box-shadow:inset 0 1px #fff9e2}.dashboard .slot .slot-no{display:none}.dashboard .slot .qty{font-size:13px;color:#1b3327;background:#fff9e0}.dashboard .slot:hover{border-color:#ffd978;transform:translateY(-2px)}
.dashboard .service-buttons button,.dashboard .deck-navigation button{top:65%;height:29%;min-height:0;padding:8px 20px;font-size:24px;font-weight:850;color:#fff5d5;background:none;box-shadow:none;border:0;border-radius:22px;gap:12px}.dashboard .service-buttons #refuel{left:2.8%;width:23.3%;background:none}.dashboard .service-buttons #repair{left:27.9%;width:23.4%;background:none}.dashboard .deck-navigation #bag-open{left:54.6%;width:21%;color:#282c19}.dashboard .deck-navigation #change-ride{left:77.8%;width:20.3%;color:#282c19}.dashboard .service-buttons button:before,.dashboard .deck-navigation button:before{width:32px;height:34px;margin:0}.dashboard .deck-navigation button:after{content:'';width:16px;height:22px;background:currentColor;mask:url('./assets/icons/chevron-right.svg') center/contain no-repeat;margin-left:auto}.dashboard button:hover:enabled{background:#fff5c017}.dashboard button:disabled{opacity:.5;filter:none}.dashboard .service-buttons button:focus-visible,.dashboard .deck-navigation button:focus-visible{outline:3px solid #fff1a9;outline-offset:-7px}.footnote{height:22px;box-sizing:border-box;font-size:9px;padding:3px 14px;color:#98ae93}
#road-status{top:132px;font-size:12px}.event-card{top:70px}
@media(max-width:1200px){.header{padding:0 20px;gap:12px}.brand strong{font-size:24px}.brand small{letter-spacing:3px}.brand-mark{width:48px;height:48px}.rank-nav{gap:5px}.rank-nav button{font-size:12px!important;padding:10px!important}.rank-nav .game-icon{width:18px;height:18px}.main-wallet{min-width:125px}.header-right{gap:8px}.dashboard .service-buttons button,.dashboard .deck-navigation button{font-size:19px;padding:8px 14px}.dashboard .metric:not(.speed) label{font-size:12px;margin-left:38px}.dashboard .metric:not(.speed) strong{font-size:30px;margin-left:38px}.dashboard .metric-icon{width:32px;height:45px}.dashboard .range-value{font-size:11px}.dashboard .slots{gap:6px}}
@media(min-width:821px) and (max-height:800px){.header{height:76px}.world{height:calc(100dvh - 318px)}.dashboard{height:220px;min-height:220px}.journey-bar{bottom:255px}.dashboard .inventory-title{margin-bottom:9px}.dashboard .speed label{margin-bottom:6px}.dashboard .speed strong{height:64px}.dashboard .metric:not(.speed) strong{font-size:30px}.dashboard .service-buttons button,.dashboard .deck-navigation button{font-size:19px}}
@media(max-width:820px){.header{height:auto;min-height:110px}.world{height:52vh;min-height:330px}.journey-bar{display:none}.dashboard{height:auto;min-height:0;background:#eadbb4;padding:14px;display:grid;grid-template-columns:1fr;grid-template-rows:142px 58px 120px 58px;gap:12px}.dashboard .metrics{display:grid;grid-template-columns:1.1fr 1fr 1fr;background:#0b3628;border-radius:12px}.dashboard .metric,.dashboard .metric.speed,.dashboard .metric:nth-child(2),.dashboard .metric:nth-child(3),.dashboard .inventory,.dashboard .service-buttons button,.dashboard .deck-navigation button{position:relative;left:auto;top:auto;width:auto;height:auto}.dashboard .metric.speed{background:#f2e4bb;padding:10px!important}.dashboard .metric:nth-child(2),.dashboard .metric:nth-child(3){padding:12px 8px!important}.dashboard .metric:not(.speed) label,.dashboard .metric:not(.speed) strong{margin-left:0}.dashboard .metric-icon{display:none}.dashboard .range-value{font-size:9px;white-space:normal}.dashboard .inventory{grid-row:3;background:#0b3628;padding:10px;border-radius:12px}.dashboard .service-buttons{display:grid;grid-row:2;grid-template-columns:1fr 1fr}.dashboard .deck-navigation{display:grid;grid-row:4;grid-template-columns:1fr 1fr}.dashboard .service-buttons button,.dashboard .deck-navigation button{font-size:16px;padding:8px;gap:6px}.dashboard .service-buttons #refuel{left:auto;width:auto;background:#ae321d}.dashboard .service-buttons #repair{left:auto;width:auto;background:#18452e}.dashboard .deck-navigation #bag-open,.dashboard .deck-navigation #change-ride{left:auto;width:auto;background:#edce87}.dashboard .slot{border-radius:6px}.dashboard .slots{gap:4px}.dashboard .slot .loot-icon{padding:3px}.dashboard .speed strong small{font-size:11px}.dashboard .speed strong{height:65px}.dashboard .service-buttons button:before,.dashboard .deck-navigation button:before{width:23px;height:24px}.header .brand strong{font-size:19px}.header .brand small{font-size:6px}}

.dashboard #tank-label{display:none}.dashboard .metric:nth-child(2),.dashboard .metric:nth-child(3){top:10%}.dashboard .meter{margin-top:7px}.dashboard .range-value{line-height:1.2;margin-top:4px;font-size:13px}.dashboard .speed strong{justify-content:flex-end}.dashboard .slot .loot-icon{display:block}@media(max-height:800px) and (min-width:821px){.dashboard .metric:not(.speed) label{font-size:12px}.dashboard .range-value{font-size:12px}.dashboard .meter{height:13px}.dashboard .inventory-title{font-size:16px}}
/* HUD alignment pass: the artwork defines the frame, content defines the reading rhythm. */
.dashboard .speed strong{padding:4px 16px 4px 10px;gap:10px;justify-content:flex-end}
.dashboard .speed label{text-align:right;margin-right:16px}
.dashboard .speed strong small{margin:0;flex-shrink:0}
.dashboard .metric:not(.speed) label,.dashboard .metric:not(.speed) strong{text-align:right;margin-left:48px}
.dashboard .metric:not(.speed) label{font-size:15px}
.dashboard .metric:not(.speed) strong{font-size:36px}
.dashboard .inventory{left:53.6%;width:43.5%;padding:6px 8px 0}
.dashboard .slots{grid-template-columns:repeat(8,minmax(0,1fr)) 34px;gap:7px}
.dashboard .slot{max-width:none;padding:0;overflow:hidden}
.dashboard .slot canvas{position:absolute;inset:0;display:block;width:100%!important;height:100%!important;max-width:none;max-height:none;object-fit:contain;aspect-ratio:1;padding:4px;box-sizing:border-box;margin:0}
.dashboard .slots .slot-next{align-self:stretch;min-width:0;padding:0;border:1px solid #f6dda0;border-radius:9px;background:linear-gradient(#f8e6b6,#d8b976);color:#725e32;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 1px #fff9dd,0 2px 2px #001e17}
.dashboard .slot-next:before{content:'';width:15px;height:24px;background:currentColor;mask:url('./assets/icons/chevron-right.svg') center/contain no-repeat}
.dashboard .service-buttons button.secondary-button,.dashboard .deck-navigation button{display:flex;align-items:center;justify-content:center;font-size:clamp(22px,1.85vw,29px);line-height:1.15;gap:12px;padding:8px 30px;text-align:center;white-space:nowrap}
.dashboard .service-buttons button.secondary-button:before,.dashboard .deck-navigation button:before{margin:0;width:30px;height:32px;flex-shrink:0}
.dashboard .deck-navigation button:after{position:absolute;right:22px;top:50%;transform:translateY(-50%);margin:0;width:13px;height:20px}
@media(max-width:1100px){.dashboard .service-buttons button.secondary-button,.dashboard .deck-navigation button{font-size:19px;padding:8px 18px;gap:8px}.dashboard .deck-navigation button:after{right:12px}.dashboard .slots{gap:4px;grid-template-columns:repeat(8,minmax(0,1fr)) 25px}.dashboard .metric:not(.speed) label{font-size:12px}.dashboard .metric:not(.speed) strong{font-size:28px}}
@media(max-width:820px){.dashboard .inventory{left:auto;width:auto}.dashboard .service-buttons button.secondary-button,.dashboard .deck-navigation button{font-size:17px}.dashboard .metric:not(.speed) label,.dashboard .metric:not(.speed) strong{margin-left:0}.dashboard .metric:nth-child(2),.dashboard .metric:nth-child(3){top:auto}.dashboard .deck-navigation button:after{display:none}}

@media(min-width:821px){
.dashboard{background-size:100% calc(100% - 16px);background-position:center top}
.dashboard .inventory{top:5%;height:51%;left:53.6%;width:43.5%;padding:10px 16px 12px;display:flex;flex-direction:column;justify-content:center}
.dashboard .inventory-title{margin:0 0 9px;line-height:22px}
.dashboard .slots{grid-template-columns:repeat(8,minmax(0,64px)) 32px;gap:7px;justify-content:center;align-items:center}
.dashboard .slot{max-width:64px;max-height:64px;aspect-ratio:1}
.dashboard .slots .slot-next{height:100%;max-height:64px;align-self:stretch}
.dashboard .service-buttons button.secondary-button,.dashboard .deck-navigation button{top:59%;height:26%;padding:0 28px 6px;transform:translateX(-3px)}
.dashboard .metric.speed{top:4%}
.dashboard .metric:nth-child(2),.dashboard .metric:nth-child(3){top:8%}
}
@media(min-width:821px) and (max-height:800px){.dashboard .slots{grid-template-columns:repeat(8,minmax(0,54px)) 28px}.dashboard .slot{max-width:54px;max-height:54px}.dashboard .inventory{padding-top:6px}.dashboard .inventory-title{margin-bottom:7px}}
/* Equipment fitting uses the same painted showcase and cream information panel as the bag. */
#upgrade-dialog.dialog{width:min(820px,94vw);max-width:820px;padding:0;border:2px solid #d5bc77;outline:3px solid #123c30;border-radius:22px;overflow:hidden;background:#f6efd6;box-shadow:0 22px 90px #031c19aa;color:#173d30}
#upgrade-dialog[open]{display:grid;grid-template-columns:43% 57%;grid-template-rows:auto auto auto auto;gap:0;align-content:center;min-height:430px}
#upgrade-dialog .engine-illustration{grid-column:1;grid-row:1/5;align-self:stretch;min-height:430px;width:auto;height:auto;margin:0;display:flex;align-items:center;justify-content:center;padding:28px;background:#103b30 url('./assets/showcase-v50.png') center/cover no-repeat;border:0;border-radius:0}
#upgrade-dialog #part-preview{width:100%;height:auto;max-height:330px;object-fit:contain;filter:drop-shadow(0 12px 8px #051d1a66)}
#upgrade-dialog h2{grid-column:2;margin:42px 30px 10px;font-size:29px;line-height:1.3;text-align:left;color:#173e30}
#upgrade-dialog>p{grid-column:2;margin:0 30px 22px;font-size:14px;line-height:1.7;color:#6a745b;text-align:left}
#upgrade-dialog .upgrade-compare{grid-column:2;display:grid;grid-template-columns:1fr 22px 1fr;gap:10px;align-items:center;margin:0 30px 24px;padding:18px 14px;border:1px solid #d4c79d;border-radius:14px;background:#ece4c9;box-shadow:inset 0 2px 0 #fff8e8}
#upgrade-dialog .upgrade-compare span{min-width:0;display:flex;flex-direction:column;gap:8px;text-align:left}
#upgrade-dialog .upgrade-compare small{font-size:12px;color:#73816a}
#upgrade-dialog .upgrade-compare strong{font-size:clamp(16px,2vw,24px);line-height:1.3;white-space:normal;overflow-wrap:anywhere;font-variant-numeric:tabular-nums;color:#264d3b}
#upgrade-dialog .upgrade-compare .gold{color:#a27221}
#upgrade-dialog .upgrade-compare>b{font-size:22px;color:#ac9452}
#upgrade-dialog #install{grid-column:2;align-self:start;min-height:56px;margin:0 30px 32px;width:calc(100% - 60px);border:2px solid #dfbd65;border-radius:13px;background:linear-gradient(#fff0b9,#edc568);box-shadow:inset 0 2px #fff9d9,0 3px 0 #ac873a;color:#2f3823;font-size:20px;font-weight:800}
#upgrade-dialog #install:before{content:'';display:inline-block;width:24px;height:24px;margin-right:10px;vertical-align:middle;background:currentColor;mask:url('./assets/icons/wrench-adjustable.svg') center/contain no-repeat}
#upgrade-dialog .dialog-close{z-index:2;top:12px;right:12px;width:32px;height:32px;border:1px solid #b8ad80;border-radius:50%;color:#48614a;background:#fff8e6;font-size:22px}
.footnote{visibility:hidden}.demo-tools{display:none}
@media(max-width:600px){#upgrade-dialog[open]{grid-template-columns:1fr;min-height:0}#upgrade-dialog .engine-illustration{grid-column:1;grid-row:1;min-height:180px;height:200px;padding:20px}#upgrade-dialog #part-preview{height:170px;width:auto}#upgrade-dialog h2,#upgrade-dialog>p,#upgrade-dialog .upgrade-compare,#upgrade-dialog #install{grid-column:1}#upgrade-dialog h2{margin-top:22px;font-size:25px}}/* Fuel and condition share an inset header, bar and explanatory baseline. */
@media(min-width:821px){
.dashboard .metric:nth-child(2){left:25%;top:12%;width:11.8%;height:38%}
.dashboard .metric:nth-child(3){left:39.3%;top:12%;width:10.1%;height:38%}
.dashboard .metric:not(.speed) label{font-size:13px;line-height:18px;margin:0 0 3px 43px}
.dashboard .metric:not(.speed) strong{font-size:30px;line-height:33px;margin-left:43px}
.dashboard .metric:not(.speed) strong small{font-size:15px}
.dashboard .metric-icon{left:0;top:5px;width:36px;height:43px}
.dashboard .meter{height:12px;margin-top:7px}
.dashboard .range-value,.dashboard #condition-note{display:block;margin:6px 0 0;font-size:11px;font-weight:600;line-height:15px;color:#edda96;letter-spacing:0;text-align:left;white-space:nowrap}
}
@media(min-width:821px) and (max-width:1150px){.dashboard .metric-icon{width:28px;height:37px}.dashboard .metric:not(.speed) label,.dashboard .metric:not(.speed) strong{margin-left:32px}.dashboard .metric:not(.speed) label{font-size:11px}.dashboard .metric:not(.speed) strong{font-size:25px}.dashboard .range-value,.dashboard #condition-note{font-size:9px}}
@media(max-width:820px){.dashboard #condition-note{display:block;font-size:10px;line-height:1.4;margin-top:5px;color:#edda96}}@media(min-width:821px){
.dashboard .metric:not(.speed) strong{height:28px;min-height:0;line-height:28px;font-size:28px}
.dashboard .metric:not(.speed) .meter{height:10px;margin-top:5px}
.dashboard .range-value,.dashboard #condition-note{margin-top:4px;line-height:14px}
}/* Supporting screens share the garage's painted stage, enamel header and warm paper. */
.account-screen.release-screen{width:min(1040px,94vw)!important;height:auto;max-height:92dvh;min-height:0;border:2px solid #c4ac68;border-radius:22px;overflow:auto;background:#f5efd8;box-shadow:0 24px 100px #031c19bb;color:#1b4032}
.account-screen .release-head{padding:18px 26px;min-height:68px;background:#103c30;border-bottom:1px solid #c4aa65}
.account-screen .release-head strong{font-size:18px;letter-spacing:.02em}
.account-screen .release-head button{font-size:13px;padding:9px 15px}
.account-layout{display:grid;grid-template-columns:46% 54%;min-height:530px}
.account-showcase{display:flex;flex-direction:column;align-items:center;text-align:center;padding:34px 30px 28px;background:#113d30 url('./assets/showcase-v50.png') center/cover no-repeat;color:#fff4d6;overflow:hidden}
.account-eyebrow{font-size:10px;font-weight:700;letter-spacing:.22em;color:#d8c27d}
.account-showcase h2{max-width:320px;font-size:29px;line-height:1.5;margin:18px 0 0;font-weight:800}
.account-showcase .ride-art{width:100%;height:230px;flex:1;min-height:180px;display:flex;align-items:center;justify-content:center;margin:8px 0 0}
.account-showcase .ride-art img{width:88%;height:100%;object-fit:contain;filter:drop-shadow(0 15px 10px #001c18aa)}
.account-ride-name{font-size:21px;letter-spacing:.04em;margin-top:8px}
.account-showcase>p{color:#d6d3b3;font-size:13px;line-height:1.6;margin:9px 0 0}
.account-form{padding:42px 40px 30px;display:flex;flex-direction:column;align-items:stretch;justify-content:center}
.account-status{align-self:flex-start;padding:6px 11px;border:1px solid #ceb575;border-radius:20px;background:#eee3bd;color:#846b2d;font-size:11px;font-weight:700}
.account-form h1{font-size:29px;line-height:1.35;margin:19px 0 12px;color:#173e30}
.account-lead{font-size:14px;line-height:1.75;color:#727a60;margin:0 0 25px}
.account-email{display:flex;flex-direction:column;gap:9px;font-size:13px;font-weight:700;color:#35513f}
.account-form input{height:52px;min-width:0;width:100%;padding:0 17px;border:1px solid #cfc299;border-radius:11px;background:#fffbef;color:#68745e;font-size:15px;box-shadow:inset 0 2px 3px #8374480b;opacity:1}
.account-form>.primary-button{height:52px;margin-top:14px;border:1px solid #cfaf58;border-radius:11px;background:linear-gradient(#fae6a6,#e6c46d);color:#6c613b;box-shadow:inset 0 1px #fff6d4,0 2px 0 #b29a58;font-weight:750;font-size:15px;opacity:.7}
.account-local-note{padding:16px 17px;margin-top:23px;background:#eae6cf;border:1px solid #d8d0ad;border-radius:12px}
.account-local-note strong{font-size:13px;color:#446049}
.account-local-note strong:before{content:'';display:inline-block;width:15px;height:16px;vertical-align:-3px;margin-right:8px;background:currentColor;mask:url('./assets/icons/lock-fill.svg') center/contain no-repeat}
.account-local-note p{font-size:12px;line-height:1.7;color:#76816a;margin:8px 0 0}
.account-return{align-self:center;background:none;color:#48674d;border:0;border-bottom:1px solid #9ba885;padding:5px 0;margin-top:20px;font-size:13px}
.coin-expansion-dialog.release-screen,.destroy-dialog.release-screen{width:min(640px,94vw)!important;height:auto;min-height:0;max-height:92dvh;border:2px solid #c5ac68;border-radius:20px;background:#f6efd7;overflow:auto;box-shadow:0 20px 90px #041d18aa}
.coin-expansion-dialog .release-head,.destroy-dialog .release-head{background:#103c30;padding:17px 24px;border-bottom:1px solid #c5ac68}
.coin-expansion-dialog .release-head strong,.destroy-dialog .release-head strong{font-size:18px;letter-spacing:.02em}
.coin-expansion-body,.destroy-body{padding:28px 32px 32px}
.coin-expansion-body>h2,.destroy-body>h2{color:#1d4333;font-size:26px;line-height:1.4}
.coin-expansion-body>p,.destroy-body>p{font-size:14px;line-height:1.75;color:#6b785f}
.coin-expansion-body>strong{display:block;text-align:center;padding:27px 12px;border:1px solid #d5c28a;border-radius:14px;background:#eee4c1;color:#977026;font-size:34px;font-variant-numeric:tabular-nums;margin:22px 0}
.destroy-body>.ride-art{height:155px;border-radius:13px;background:#113d30 url('./assets/showcase-v50.png') center 70%/cover no-repeat;padding:20px}
.destroy-body>.ride-art img{object-fit:contain;width:100%;height:100%}
.destroy-body label{font-size:13px;font-weight:700;color:#3c573e;display:block;margin:20px 0}
.destroy-body label input{display:block;width:100%;height:48px;margin-top:9px;background:#fffaf0;border:1px solid #cbbd92;border-radius:10px;padding:10px 14px}
.destroy-body .danger-button{border:1px solid #b96e58;border-radius:11px;padding:14px 20px;background:#a33f30;color:#fff1d9;font-weight:700}
@media(max-width:700px){.account-layout{grid-template-columns:1fr;min-height:0}.account-showcase{padding:22px;min-height:240px}.account-showcase h2{font-size:23px;margin-top:12px}.account-showcase .ride-art{height:100px;min-height:100px;flex:none}.account-showcase>p{display:none}.account-form{padding:28px 25px}.account-form h1{font-size:26px}.account-screen .release-head{padding:13px 18px}.account-screen .release-head strong{font-size:15px}.coin-expansion-body,.destroy-body{padding:22px}}.account-screen.release-screen{padding:0}
.account-showcase h2{text-wrap:balance}
.account-form h1{text-wrap:balance}/* Painted account plate: live controls sit on the authored enamel artwork. */
@media(min-width:701px){
.account-screen.release-screen{width:min(1040px,94vw,138dvh)!important;aspect-ratio:3/2;height:auto;max-height:none;position:fixed;overflow:hidden;padding:0;border:0;outline:0;border-radius:23px;background:transparent url('./assets/account-painted-v67.png') center/100% 100% no-repeat;box-shadow:0 26px 90px #041b17a6}
.account-screen .release-head{position:absolute;left:3.5%;top:3%;width:93%;height:8.5%;min-height:0;padding:0 14px;background:none;border:0;box-shadow:none;z-index:2}
.account-screen .release-head strong{font-size:17px;color:#fff0bd}
.account-screen .release-head button{border:0;background:none;color:#f4d58c;font-weight:700}
.account-layout{position:absolute;inset:0;min-height:0;height:100%;display:block}
.account-showcase{position:absolute;left:2.6%;top:14.5%;width:43.8%;height:80%;padding:26px 24px;background:none;border:0;border-radius:0}
.account-eyebrow{font-size:9px;color:#cbb976}
.account-showcase h2{font-size:clamp(20px,2.4vw,30px);max-width:340px;line-height:1.45;margin:19px 0 0;color:#fff0c7;text-shadow:0 2px 0 #0c2d20}
.account-showcase .ride-art{position:absolute;left:9%;top:49%;width:82%;height:32%;min-height:0;margin:0;flex:none}
.account-showcase .ride-art img{width:100%;height:100%;filter:drop-shadow(0 15px 8px #002b2080)}
.account-ride-name{position:absolute;left:5%;right:5%;top:80%;margin:0;color:#ffebac;font-size:20px}
.account-showcase>p{position:absolute;left:8%;right:8%;top:86%;font-size:12px;color:#d2d5b2}
.account-form{position:absolute;left:50.8%;top:16%;width:45.5%;height:78%;padding:0;display:block}
.account-status{position:absolute;left:2%;top:0;padding:0;background:none;border:0;border-radius:0;font-size:11px;color:#896d30}
.account-form h1{position:absolute;left:2%;right:2%;top:7%;margin:0;font-size:clamp(22px,2.6vw,30px);line-height:1.35;color:#244c36}
.account-lead{position:absolute;left:2%;right:2%;top:20%;margin:0;font-size:12px;line-height:1.6;color:#7c754b}
.account-email{position:absolute;left:0;right:0;top:26%;height:19%;display:block;font-size:12px;color:#6e633e;padding:0 18px}
.account-email input{position:absolute;left:0;top:28px;width:100%;height:calc(100% - 28px);margin:0;padding:0 22px;border:0;border-radius:0;background:none;box-shadow:none;outline:none;color:#d6dfbc;font-weight:500;font-size:16px}
.account-email input::placeholder{color:#c2cfa7;opacity:.8}
.account-form>.primary-button{position:absolute;left:0;right:0;top:47%;height:13.4%;min-height:0;width:100%;padding:0 18px;margin:0;border:0;border-radius:0;background:none;box-shadow:none;opacity:1;color:#78643a;font-weight:800;font-size:16px}
.account-local-note{position:absolute;left:0;right:0;top:65%;height:25%;margin:0;padding:19px 21px;background:none;border:0;border-radius:0}
.account-local-note strong{font-size:12px;color:#606c43}
.account-local-note p{font-size:11px;line-height:1.65;color:#837b52;margin-top:10px}
.account-return{position:absolute;top:94%;left:20%;right:20%;margin:0;padding:0 0 3px;border:0;background:none;color:#81713e;font-size:12px}
}.account-email{text-align:center}
.account-email input{text-align:center}
@media(min-width:701px){.account-email input{top:18px}}/* Two clear reading sizes across the account page, shared by both languages. */
.account-screen .account-eyebrow,.account-screen .account-status{display:none}
.account-screen .account-form h1,.account-screen .account-showcase h2{font-size:28px;line-height:1.4}
.account-screen .release-head strong,.account-screen .release-head button,.account-screen .account-lead,.account-screen .account-email,.account-screen .account-email input,.account-screen .account-form>.primary-button,.account-screen .account-local-note strong,.account-screen .account-local-note p,.account-screen .account-return,.account-screen .account-ride-name,.account-screen .account-showcase>p{font-size:16px;line-height:1.5;letter-spacing:0}
.account-screen .account-local-note{padding:15px 20px}
.account-screen .account-local-note p{margin-top:7px}
.dashboard #vehicle-open:hover{box-shadow:none;outline:none;background-color:transparent;filter:none}/* Equipment archive: authored enamel plate, live vehicle art and part cards. */
@media(min-width:701px){
#vehicle-dialog.vehicle-dialog{position:fixed;width:min(1100px,95vw,140dvh);aspect-ratio:3/2;height:auto;max-height:none;padding:0;border:0;outline:0;border-radius:22px;overflow:hidden;background:transparent url('./assets/equipment-painted-v69.png') center/100% 100% no-repeat;box-shadow:0 24px 90px #05261daa;color:#1f4330}
#vehicle-dialog>.dialog-kicker{display:none}
#vehicle-dialog>.dialog-close{right:3.8%;top:5.3%;background:none;border:0;color:#f4d897;font-size:27px;z-index:3}
#vehicle-title{position:absolute;top:5.3%;left:5%;margin:0!important;color:#fff0c4;font-size:27px}
#vehicle-subtitle{position:absolute;top:10.5%;left:5%;margin:0;color:#c9d3aa;font-size:14px;line-height:1.4}
#vehicle-dialog .vehicle-layout{display:contents}
#vehicle-dialog .vehicle-portrait{position:absolute;left:3.5%;top:19.5%;width:43.5%;height:53%;border:0;background:none;border-radius:0;display:block}
#vehicle-dialog .vehicle-portrait canvas{position:absolute;left:0;top:6%;width:100%;height:73%;object-fit:contain}
#vehicle-name{position:absolute;bottom:6%;left:5%;right:5%;text-align:center;color:#ffedb1;font-size:21px}
#vehicle-caption{display:none}
#vehicle-parts{position:absolute;left:50.5%;top:19.5%;width:46%;height:54.2%;display:grid;grid-template-rows:repeat(3,1fr);gap:5.8%}
#vehicle-dialog .equipped-part{display:flex;align-items:center;gap:16px;min-width:0;padding:10px 22px;margin:0;border:0;border-radius:0;background:none;box-shadow:none}
#vehicle-dialog .equipped-part canvas{width:80px;height:80px;object-fit:contain;flex-shrink:0}
#vehicle-dialog .equipped-part small{font-size:13px;line-height:1.4;letter-spacing:0;color:#81713f}
#vehicle-dialog .equipped-part strong{font-size:19px;line-height:1.3;margin:6px 0;color:#24472f}
#vehicle-dialog .equipped-part span{font-size:14px;line-height:1.4;color:#746945}
#vehicle-stats.vehicle-stats{position:absolute;left:4.5%;top:79%;width:43%;height:9%;padding:0;gap:16px;background:none;border:0;border-radius:0;color:#ffebac}
#vehicle-stats small{font-size:13px;color:#c8d2ac}
#vehicle-stats strong{font-size:27px;line-height:1.2;margin-top:6px;white-space:nowrap}
#vehicle-stats em{font-size:12px}
#vehicle-progress,#vehicle-formula{display:none}
#vehicle-dialog #vehicle-bag{position:absolute;left:4%;bottom:4.3%;width:25%;height:5.7%;padding:0 10px;border:0;box-shadow:none;background:url('./assets/gold-button-v69.png') center/100% 100% no-repeat;color:#344427;font-size:15px;font-weight:750;border-radius:0}
#vehicle-dialog .retire-link{position:absolute;left:31%;bottom:4.3%;width:16%;height:5.7%;margin:0;padding:0;background:none;color:#d4b58c;font-size:14px;text-align:center}
#vehicle-level-panel{position:absolute;left:51%;top:78%;width:44%;height:17%;color:#f8e6b4}
#vehicle-level-panel h3{font-size:18px;line-height:1.4;margin:0 0 5px}
#vehicle-level-panel p{font-size:13px;line-height:1.5;margin:0;color:#c5d2ab}
#vehicle-level-panel small{display:none}
#vehicle-level-panel .primary-button{position:absolute;bottom:0;width:100%;height:32px;min-height:0;padding:0 10px;border:0;border-radius:0;background:url('./assets/gold-button-v69.png') center/100% 100% no-repeat;color:#344427;font-size:14px;box-shadow:none}
}
@media(min-width:701px) and(max-width:1000px){#vehicle-title{font-size:23px}#vehicle-dialog .equipped-part{padding:6px 16px;gap:10px}#vehicle-dialog .equipped-part canvas{width:58px;height:58px}#vehicle-dialog .equipped-part strong{font-size:16px}#vehicle-dialog .equipped-part span{font-size:12px}#vehicle-stats strong{font-size:22px}}@media(min-width:701px){#vehicle-dialog .vehicle-portrait canvas{top:28%}#vehicle-dialog #vehicle-bag,#vehicle-level-panel .primary-button{border-radius:10px;overflow:hidden}}/* Six-slot equipment screen: painted panels, live localized content. */
.dashboard #vehicle-open{cursor:pointer}
.dashboard #vehicle-open .ride-entry{display:block!important;position:absolute;left:12%;top:9%;font-size:clamp(10px,1vw,15px);font-weight:800;color:#385744;line-height:1.2}
.dashboard #vehicle-open:hover,.dashboard #vehicle-open:focus:not(:focus-visible){outline:0!important;box-shadow:none!important}
.dashboard #vehicle-open:focus-visible{outline:2px solid #f0d99a;outline-offset:-8px;border-radius:18px}
#vehicle-dialog #vehicle-subtitle,#vehicle-dialog #vehicle-bag,#vehicle-dialog #vehicle-level-panel,#vehicle-dialog #vehicle-caption,#vehicle-dialog #vehicle-progress,#vehicle-dialog #vehicle-formula{display:none!important}
#vehicle-dialog .dialog-close,#slot-picker .slot-close{background:#124738;border:2px solid #d9b56b;border-radius:50%;color:#ffe6a8;width:38px;height:38px;line-height:30px;font-size:27px;box-shadow:inset 0 2px 2px #fff3,0 2px 4px #0005;padding:0;z-index:4}
#vehicle-dialog .dialog-close:hover,#vehicle-dialog .dialog-close:focus:not(:focus-visible){outline:none!important;filter:brightness(1.15)}
#vehicle-dialog .dialog-close:focus-visible{outline:2px solid #fff2c0;outline-offset:3px}
#vehicle-dialog .equipped-part{cursor:pointer;text-align:center;transition:filter .15s}
#vehicle-dialog .equipped-part:hover{filter:brightness(1.12);outline:0}
#vehicle-dialog .equipped-part small,#vehicle-dialog .equipped-part span{font-size:16px;line-height:1.35}
#vehicle-dialog .equipped-part strong{font-size:18px;line-height:1.35}
#vehicle-dialog .equipped-part [data-quality="3"]{color:#a36b17}
#slot-picker{width:min(780px,92vw);max-height:85vh;padding:30px;background:#f5edcf;border:5px solid #caa45e;border-radius:20px;color:#163f34}
#slot-picker .slot-close{position:absolute;right:15px;top:15px}
#slot-picker .slot-options{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0}
#slot-picker .slot-option{display:flex;flex-direction:column;align-items:center;gap:10px;padding:15px;background:#fff8e5;border:1px solid #c8ac68;border-radius:12px;color:#214b3b;font-size:16px}
#slot-picker .slot-option canvas{width:90px;height:90px;object-fit:contain}
#slot-picker .slot-option:disabled{opacity:.5}
.quality-label{font-weight:700;color:#98712c}
@media(min-width:701px){
 #vehicle-dialog.vehicle-dialog{width:min(1250px,96vw,145dvh);background-image:url('./assets/equipment-painted-v70.png')}
 #vehicle-dialog #vehicle-title{left:10%;top:7%;width:80%;text-align:center;font-size:28px}
 #vehicle-dialog .dialog-close{top:7%;right:5%}
 #vehicle-dialog .vehicle-portrait{left:3%;top:19%;width:37%;height:55%}
 #vehicle-dialog .vehicle-portrait canvas{top:20%;height:70%}
 #vehicle-dialog #vehicle-name{bottom:7%;font-size:21px}
 #vehicle-dialog #vehicle-parts{left:42.2%;top:19.2%;width:54.5%;height:54.5%;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,1fr);column-gap:5%;row-gap:5%}
 #vehicle-dialog .equipped-part{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:9px;padding:12px;border:0;background:none;min-width:0;box-shadow:none}
 #vehicle-dialog .equipped-part canvas{width:65px;height:65px;flex:0 0 65px}
 #vehicle-dialog .equipped-part div{min-width:0;display:flex;flex-direction:column;gap:5px;text-align:left}
 #vehicle-dialog .equipped-part small,#vehicle-dialog .equipped-part span,#vehicle-dialog .equipped-part strong{font-size:clamp(12px,1.35vw,18px)}
 #vehicle-dialog #vehicle-stats{left:6%;top:82%;width:65%;height:11%;align-items:center}
 #vehicle-dialog #vehicle-stats small{font-size:16px}
 #vehicle-dialog .retire-link{left:auto;right:6%;bottom:7%;width:20%;height:7%;background:url('./assets/gold-button-v69.png') center/100% 100%;color:#754332;border:0;font-size:18px;font-weight:800;border-radius:10px}
}
@media(min-width:701px){
 #vehicle-dialog.vehicle-dialog .dialog-close{top:7%!important;right:5%!important}
 #vehicle-dialog .vehicle-portrait canvas{top:28%}
 #vehicle-dialog #vehicle-parts{top:19.3%;height:54%;grid-template-rows:repeat(3,minmax(0,1fr));row-gap:5.4%}
 #vehicle-dialog .equipped-part div{gap:3px}
 #vehicle-dialog .equipped-part span{max-height:3em;overflow:hidden}
}
/* v71: align live content to the painted panel's actual inner bounds. */
@media(min-width:701px){
 #vehicle-dialog.vehicle-dialog{container-type:inline-size}
 #vehicle-dialog #vehicle-title{top:7%;font-size:2.65cqw;line-height:1.2}
 #vehicle-dialog.vehicle-dialog .dialog-close{top:6.8%!important;right:5%!important;width:3.6cqw;height:3.6cqw;min-width:28px;min-height:28px;display:grid;place-items:center;font-size:0;line-height:0;box-sizing:border-box}
 #vehicle-dialog .dialog-close::before,#vehicle-dialog .dialog-close::after{content:'';position:absolute;left:50%;top:50%;width:38%;height:2px;border-radius:2px;background:#ffe6a8;transform:translate(-50%,-50%) rotate(45deg)}
 #vehicle-dialog .dialog-close::after{transform:translate(-50%,-50%) rotate(-45deg)}
 #vehicle-dialog .vehicle-portrait{left:3.7%;top:19.5%;width:36.2%;height:53.6%;padding:0}
 #vehicle-dialog #vehicle-name{top:9%;bottom:auto;left:7%;right:7%;margin:0;font-size:2.05cqw;line-height:1.35;text-align:center;color:#fff0bd;overflow-wrap:anywhere}
 #vehicle-dialog .vehicle-portrait canvas{left:0;top:32%;width:100%;height:69%;object-fit:contain;filter:drop-shadow(0 1px 1px #e9e7ba66)}
 #vehicle-dialog #vehicle-parts{left:42.4%;top:19.6%;width:54%;height:53.7%;column-gap:5.5%;row-gap:5.8%}
 #vehicle-dialog .equipped-part{display:grid;grid-template-columns:24% minmax(0,1fr);justify-content:initial;align-items:center;gap:5%;padding:5% 7%;text-align:left;overflow:hidden}
 #vehicle-dialog .equipped-part canvas{width:100%;height:auto;aspect-ratio:1;min-width:0;object-fit:contain;margin:0}
 #vehicle-dialog .equipped-part div{width:100%;min-width:0;gap:.45cqw;text-align:left}
 #vehicle-dialog .equipped-part small,#vehicle-dialog .equipped-part span,#vehicle-dialog .equipped-part strong{display:block;margin:0;font-size:1.42cqw;line-height:1.25;letter-spacing:0}
 #vehicle-dialog .equipped-part strong{font-size:1.62cqw;font-weight:800;color:#173e2c}
 #vehicle-dialog .equipped-part small{color:#77633b}
 #vehicle-dialog .equipped-part span{max-height:2.5em;color:#685b39}
 #vehicle-dialog .equipped-part:has(>div:only-child){grid-template-columns:1fr;text-align:center}
 #vehicle-dialog .equipped-part:has(>div:only-child) div{text-align:center}
 #vehicle-dialog #vehicle-stats{left:5%;top:80%;width:66%;height:13%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;align-items:center;text-align:center;margin:0}
 #vehicle-dialog #vehicle-stats>div{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.65cqw;min-width:0;height:65%;border-right:1px solid #d9be7540}
 #vehicle-dialog #vehicle-stats>div:last-child{border:0}
 #vehicle-dialog #vehicle-stats small{font-size:1.45cqw;line-height:1.25;color:#d5ddbb}
 #vehicle-dialog #vehicle-stats strong{display:flex;align-items:baseline;justify-content:center;gap:.4cqw;font-size:2.65cqw;line-height:1;margin:0;color:#fff0b8;font-variant-numeric:tabular-nums}
 #vehicle-dialog #vehicle-stats em{font-size:1.1cqw;font-style:normal}
 #vehicle-dialog .retire-link{left:75%;right:auto;top:83%;bottom:auto;width:19%;height:7%;display:flex;align-items:center;justify-content:center;margin:0;padding:0 1cqw;font-size:1.65cqw;line-height:1;border-radius:8px;color:#754332}
}
/* Equipment picker: shared painted materials, generous centered empty state. */
#slot-picker{width:min(760px,90vw);max-height:85dvh;padding:28px 32px 24px;border:0;border-radius:20px;background:#073e30 url('./assets/garage-stage-v54.png') center/cover;color:#fff0bd;box-shadow:inset 0 0 0 2px #f6d78c,inset 0 0 0 6px #96713d,inset 0 0 0 8px #e9c77f,0 18px 70px #0009}
#slot-picker::backdrop{background:#031c1880;backdrop-filter:blur(3px)}
#slot-picker h2{text-align:center;margin:4px 46px 24px;font-size:26px;line-height:1.4;color:#fff0bd}
#slot-picker .slot-close{top:22px;right:24px;width:34px;height:34px;padding:0;border:1px solid #e5c477;border-radius:50%;background:#124e3e;color:#ffe6a8;font-size:0;position:absolute}
#slot-picker .slot-close::before,#slot-picker .slot-close::after{content:'';position:absolute;left:50%;top:50%;width:13px;height:2px;background:#ffe6a8;transform:translate(-50%,-50%) rotate(45deg)}
#slot-picker .slot-close::after{transform:translate(-50%,-50%) rotate(-45deg)}
#slot-picker .slot-options{margin:0 0 24px;gap:14px;max-height:48dvh;overflow:auto;padding:4px;grid-template-columns:repeat(3,minmax(0,1fr))}
#slot-picker .slot-option{background:linear-gradient(145deg,#fff5d9,#eee0b7);border:1px solid #d5b66e;border-radius:12px;padding:20px 12px;color:#163e30;gap:10px;min-height:190px;box-shadow:inset 0 0 0 3px #fff6dc66,0 3px 7px #001d1944}
#slot-picker .slot-option strong{font-size:17px;line-height:1.4}
#slot-picker .slot-option span{font-size:14px;line-height:1.4}
#slot-picker .slot-option canvas{width:88px;height:88px;object-fit:contain}
#slot-picker .slot-install-summary{display:flex;align-items:center;gap:22px;padding:0 18px 22px;margin-bottom:20px;border-bottom:1px solid #d8c28055}
#slot-picker .slot-install-summary canvas{width:110px;height:110px;flex-shrink:0;object-fit:contain}
#slot-picker .slot-install-summary strong{font-size:22px;color:#fff0bd}
#slot-picker .slot-install-summary p{font-size:16px;line-height:1.6;margin:8px 0 0;color:#d7dfc9}
#slot-picker .slot-targets{max-height:42dvh;margin-bottom:12px}
#slot-picker .slot-targets .slot-option{min-height:220px;text-align:center;justify-content:space-between}
#slot-picker .slot-targets .slot-number{color:#786037;font-size:15px}
#slot-picker .slot-targets .slot-target-action{color:#234e3d;font-weight:700;padding:9px 6px;border-top:1px solid #b89a5d55;width:100%}
#slot-picker .slot-targets button:disabled{opacity:.55;cursor:not-allowed}
#slot-picker .slot-install-note{text-align:center;font-size:15px;line-height:1.5;color:#d7dfc9;margin:14px 0 0}
#slot-picker .slot-empty{grid-column:1/-1;min-height:230px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;padding:24px}
#slot-picker .slot-empty-symbol{display:grid;place-items:center;width:68px;height:68px;background:url('./assets/gold-button-v69.png') center/100% 100%;font-size:36px;color:#71532a}
#slot-picker .slot-empty strong{font-size:22px;color:#fff0bd}
#slot-picker .slot-empty p{font-size:16px;color:#d9dfbd;margin:0;line-height:1.6}
#slot-picker .slot-back,#slot-picker>.primary-button{display:block;margin:12px auto 0;width:230px;min-height:48px;border:0;background:url('./assets/gold-button-v69.png') center/100% 100%;color:#244333;font-size:18px;font-weight:700;padding:10px 20px}
#slot-picker button:hover{filter:brightness(1.08);outline:none}
#slot-picker button:focus-visible{outline:2px solid #ffe6a8;outline-offset:3px}
@media(max-width:600px){#slot-picker{padding:24px 18px}#slot-picker .slot-options{grid-template-columns:repeat(2,minmax(0,1fr))}#slot-picker h2{font-size:22px}}
#slot-picker .slot-empty-symbol{border-radius:16px;overflow:hidden}
#slot-picker .slot-back,#slot-picker>.primary-button{border-radius:14px;overflow:hidden}
/* Clip the rectangular source-image surround outside the painted button rim. */
#vehicle-dialog .retire-link{background-color:transparent;box-shadow:none;border:0;clip-path:inset(6% 1% 8% 1% round 12px);outline:none}
#vehicle-dialog .retire-link:focus-visible{filter:brightness(1.18)}
/* Clear pointer feedback on top of the painted HUD, without shifting its text. */
.dashboard .service-buttons button,.dashboard .deck-navigation button,.rank-nav button,#vehicle-dialog .dialog-close,#slot-picker .slot-close{cursor:pointer;transition:background-color .14s,box-shadow .14s,filter .14s}
.dashboard .service-buttons button:hover:enabled,.dashboard .deck-navigation button:hover:enabled{background-color:transparent!important;box-shadow:none!important;filter:none;}
.dashboard .service-buttons button:active:enabled,.dashboard .deck-navigation button:active:enabled{background-color:transparent!important;box-shadow:none!important}
.rank-nav button:hover:enabled{background:#28604a!important;box-shadow:0 0 12px #f3d88755,inset 0 0 0 1px #f3d887!important;color:#fff5cd!important}
.rank-nav button:active:enabled{background:#102e25!important;filter:brightness(.9)}
#vehicle-dialog .dialog-close:hover,#slot-picker .slot-close:hover{background-color:#b58a3d!important;box-shadow:0 0 13px #ffdf8277!important;filter:brightness(1.2)!important}
#vehicle-dialog .dialog-close:active,#slot-picker .slot-close:active{filter:brightness(.85)!important}

/* Keep inventory feedback on the light tile, not the dark HUD panel. */
.dashboard .slot:hover{background:#ffe6a4!important;border-color:#fff3cc;box-shadow:0 3px 5px #071f1866,inset 0 0 0 1px #e7bc62;transform:translateY(-2px)}
@media(min-width:821px){
.dashboard .metric-icon{left:14px;top:3px;width:46px;height:43px;background-size:contain}
.dashboard .metric:not(.speed) label,.dashboard .metric:not(.speed) strong{margin-left:64px}
}
@media(min-width:821px) and (max-width:1150px){
.dashboard .metric-icon{left:10px;top:4px;width:34px;height:35px}
.dashboard .metric:not(.speed) label,.dashboard .metric:not(.speed) strong{margin-left:47px}
}
/* Painted backpack expansion confirmation; scoped so other dialogs retain their layout. */
.coin-expansion-dialog.release-screen{width:min(520px,92vw,75dvh)!important;height:auto!important;aspect-ratio:5/6;max-height:none;min-height:0;padding:0;border:0;border-radius:24px;overflow:hidden;container-type:inline-size;background:transparent url('./assets/coin-expansion-v99.png') center/100% 100% no-repeat;color:#fff1c8;box-shadow:0 22px 80px #001b19a6}
.coin-expansion-dialog.release-screen .release-head{position:absolute;inset:4% 6% auto;height:13%;padding:0;border:0;background:none;justify-content:center}
.coin-expansion-dialog .release-head strong{display:flex;align-items:center;justify-content:center;gap:12px;color:#ffe8a7;font-size:5cqw;letter-spacing:0;line-height:1.25}
.coin-expansion-dialog .bag-icon{display:inline-block;flex:none;width:27px;height:29px;background:currentColor;mask-position:center;mask-size:contain;mask-repeat:no-repeat}
.coin-expansion-dialog .coin-expansion-close{position:absolute;right:0;top:50%;transform:translateY(-50%);width:34px;height:34px;min-height:0;padding:0;border:1px solid #d9bc6c;border-radius:50%;background:#134b3a;color:#ffe8a7;box-shadow:inset 0 1px 3px #f1dc9140;cursor:pointer}
.coin-expansion-close:before,.coin-expansion-close:after{content:'';position:absolute;left:50%;top:50%;width:13px;height:2px;border-radius:2px;background:currentColor;transform:translate(-50%,-50%) rotate(45deg)}
.coin-expansion-close:after{transform:translate(-50%,-50%) rotate(-45deg)}
.coin-expansion-dialog .coin-expansion-body{position:absolute;inset:21% 10% 7%;padding:0;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;gap:8px;text-align:center}
.coin-expansion-dialog .coin-expansion-body>h2{margin:0;font-size:4.3cqw;line-height:1.35;color:#fff1c8;font-weight:750}
.coin-expansion-dialog .coin-capacity-growth{display:grid;grid-template-columns:1fr 40px 1fr;align-items:center;gap:8px;padding:10px 12px}
.coin-capacity-growth>div{display:grid;grid-template-columns:auto auto;justify-content:center;align-items:baseline;column-gap:7px;row-gap:4px}
.coin-capacity-growth>div>span{grid-column:1/-1;color:#d3d9b5;font-size:3cqw}
.coin-capacity-growth strong{font-size:9cqw;line-height:1.05;color:#fff3d0;font-variant-numeric:tabular-nums}
.coin-capacity-growth>div:last-child strong{color:#ffdf80}.coin-capacity-growth small{font-size:3cqw;color:#dddfbf}
.coin-expansion-dialog .capacity-arrow{width:28px;height:28px;color:#e3c77c;justify-self:center}
.coin-expansion-dialog .coin-expansion-body>p{margin:0;color:#c9d5b6;font-size:3cqw;line-height:1.4}
.coin-expansion-dialog .coin-expansion-price{display:flex;justify-content:center;align-items:center;gap:10px;color:#ffdf84;padding:13px 4px;border-top:1px solid #dfc77a45;border-bottom:1px solid #dfc77a45}
.coin-expansion-price strong{font-size:6.6cqw;font-weight:850;line-height:1.2;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.coin-expansion-price>span:last-child{font-size:3.2cqw}
.coin-expansion-dialog .coin-expansion-balance.insufficient{color:#ffbd91}
.coin-expansion-actions{display:grid;gap:8px;margin-top:4px}
.coin-expansion-dialog .coin-expansion-actions .primary-button{width:100%;min-height:0;height:11cqw;padding:0 12px;border:0;border-radius:0;background:transparent url('./assets/gold-button-v69.png') center/100% 100% no-repeat;box-shadow:none;color:#344429;font-size:3.8cqw;font-weight:800}
.coin-expansion-dialog .coin-expansion-actions .secondary-button{border:0;background:none;box-shadow:none;border-radius:0;min-height:30px;padding:3px 8px;color:#f0dfad;font-size:3.2cqw}
.coin-expansion-dialog button:hover:enabled{filter:brightness(1.1)}.coin-expansion-dialog button:active:enabled{filter:brightness(.94)}
.coin-expansion-dialog button:focus-visible{outline:2px solid #fff0b7;outline-offset:3px}.coin-expansion-dialog .coin-expansion-actions .primary-button:disabled{opacity:.5;filter:saturate(.5)}

.coin-expansion-dialog .bag-icon{-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain;pointer-events:none}
.coin-expansion-dialog .release-head{z-index:2;pointer-events:none}.coin-expansion-dialog .coin-expansion-close{z-index:3;pointer-events:auto}.coin-expansion-dialog .coin-expansion-close:hover,.coin-expansion-dialog .coin-expansion-close:active{transform:translateY(-50%)}

.coin-expansion-dialog .coin-expansion-actions .primary-button{border-radius:18px;background-size:calc(100% + 12px) calc(100% + 10px)}

/* Road backpack: navigate occupied pages in both directions, keeping eight item cells. */
.dashboard .slots{grid-template-columns:28px repeat(8,minmax(0,64px)) 28px}
.dashboard .slots .slot-prev{height:100%;max-height:64px;align-self:stretch;min-width:0;padding:0;border:1px solid #f6dda0;border-radius:9px;background:linear-gradient(#f8e6b6,#d8b976);color:#725e32;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 1px #fff9dd,0 2px 2px #001e17}
.dashboard .slot-prev:before{content:'';width:15px;height:24px;background:currentColor;-webkit-mask:url('./assets/icons/chevron-left.svg') center/contain no-repeat;mask:url('./assets/icons/chevron-left.svg') center/contain no-repeat}
.dashboard .slots .slot-prev:disabled,.dashboard .slots .slot-next:disabled{opacity:.35;cursor:default;transform:none}.dashboard .slots .slot.unavailable{visibility:hidden}
@media(max-width:1100px){.dashboard .slots{grid-template-columns:22px repeat(8,minmax(0,54px)) 22px;gap:4px}}

.dashboard .slot-next:before{-webkit-mask:url('./assets/icons/chevron-right.svg') center/contain no-repeat;mask:url('./assets/icons/chevron-right.svg') center/contain no-repeat}

main .journey-bar{display:flex;width:max-content;max-width:calc(100% - 36px);gap:14px}
main .journey-bar .place{min-width:0;flex:none}
main .journey-bar .route{width:auto;min-width:110px;flex:none}
main .journey-bar .route>div:first-child{gap:10px}
main .route-track span::after{content:none}
main .route-track[hidden]{display:none}
@media(max-width:820px){main .journey-bar{position:relative;bottom:auto;left:auto;max-width:100%;margin:0;height:32px}}

/* Keep the close control outside the touch-scrolling content. */
html:has(dialog[open]),body:has(dialog[open]){overflow:hidden;overscroll-behavior:none}
.world #road-status{top:10px;right:14px}
.dashboard #vehicle-open:focus-visible{outline:0;box-shadow:none}
.dashboard #vehicle-open:focus-visible .ride-entry{text-decoration:underline}
.dashboard #vehicle-open{-webkit-tap-highlight-color:transparent}
#ride-dialog.dialog[open],#upgrade-dialog.dialog[open]{box-sizing:border-box;display:flex;flex-direction:column;align-items:stretch;min-height:0;max-height:calc(100dvh - 24px);overflow:hidden;padding:0}
#ride-dialog>.dialog-kicker{margin:0;padding:16px 55px 8px 20px;flex:none}
#ride-dialog>.dialog-close,#upgrade-dialog>.dialog-close{position:absolute;inset:3px 6px auto auto;width:44px;height:44px;display:grid;place-items:center;z-index:2}
.ride-detail-body,.upgrade-body{min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-y}
.ride-detail-body{padding:4px 20px 14px}
#ride-dialog .ride-preview{height:clamp(64px,13dvh,115px);margin-bottom:8px}
#ride-dialog .ride-preview canvas{height:100%;max-height:clamp(64px,13dvh,115px)}
.ride-overview{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px}
#ride-description{overflow-wrap:anywhere;margin:6px 0}
#ride-dialog .ride-stats{margin:0;padding:0;border:0;gap:18px}
#ride-dialog .creator h2{margin:2px 0}
#ride-dialog #inspected-equipment{margin:8px 0;padding-top:8px}
#ride-dialog .inspect-part{padding:8px}
#ride-dialog .inspect-part canvas{height:54px;margin:4px 0}
#ride-dialog .inspect-part strong{min-height:0}
#ride-dialog .inspect-summary,#ride-dialog .inspect-attribute{margin:4px 0}
#ride-dialog .dialog-actions{margin:8px 0}
#upgrade-dialog .upgrade-body{display:grid;grid-template-columns:40% minmax(0,1fr)}
#upgrade-dialog .engine-illustration{grid-area:auto;min-height:0;align-self:stretch;padding:16px}
#upgrade-dialog .upgrade-copy{padding:48px 20px 20px;min-width:0}
#upgrade-dialog h2{margin:0 0 8px}
#upgrade-dialog .upgrade-copy p{margin:0 0 16px}
#upgrade-dialog .upgrade-compare{margin:0 0 16px}
#upgrade-dialog #install{width:100%;margin:0;min-height:44px}
@media(max-width:550px){.ride-overview{grid-template-columns:1fr;gap:6px}#upgrade-dialog .upgrade-body{display:block}#upgrade-dialog .engine-illustration{height:120px}#upgrade-dialog #part-preview{max-height:100%}#upgrade-dialog .upgrade-copy{padding:16px}}

/* Road card, using the painted garage stage and brass controls. */
#ride-dialog.dialog{background:#f3ecd6;border:2px solid #baa166;border-radius:16px;color:#214639}
#ride-dialog.dialog>.dialog-kicker{background:#163e33;color:#f7dfa1;font-size:15px;font-weight:750;letter-spacing:.12em;padding:12px 54px 12px 22px;border-bottom:2px solid #b39659}
#ride-dialog>.dialog-kicker::before{content:'✦';margin-right:9px;color:#e6b753}
#ride-dialog.dialog>.dialog-close{top:0;right:3px;border:0;outline:0;box-shadow:none;background:transparent;color:#f4dfa5;font:28px/1 system-ui;-webkit-tap-highlight-color:transparent}
#ride-dialog.dialog>.dialog-close:focus-visible{color:white;text-shadow:0 0 5px #e8bd66}
#ride-dialog .ride-detail-body{padding:15px 18px 10px}
.ride-feature{display:grid;grid-template-columns:30% minmax(0,1fr);background:#194336;color:#ffedc8;border-radius:10px;overflow:hidden}
#ride-dialog .ride-preview{margin:0;height:100%;min-height:142px;border:0;border-radius:0;background:#1b3022 url('./assets/garage-stage-v54.png') center 48%/cover}
#ride-dialog .ride-preview canvas{width:100%;height:134px;max-height:none;object-fit:contain}
#ride-dialog .ride-overview{padding:14px;gap:12px;grid-template-columns:minmax(0,1fr) minmax(115px,35%)}
#ride-dialog .creator{gap:7px}
#ride-dialog .creator>div{min-width:0}
#ride-dialog .creator h2{font-size:20px;color:#fff2d0;overflow-wrap:anywhere}
#ride-dialog #ride-level{color:#ead397;background:transparent;padding:0}
#ride-dialog #creator-name,#ride-dialog #ride-description{color:#dfddbd;line-height:1.45}
#ride-dialog #ride-description{margin:8px 0 0}
#ride-dialog .ride-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-left:12px;border-left:1px solid #bdab775c}
#ride-dialog .ride-stats span:first-child{grid-column:span 2}
#ride-dialog .ride-stats small{font-size:10px;color:#d5d2b2;margin-bottom:2px}
#ride-dialog .ride-stats strong{color:#ffe3a2;font-size:17px;font-weight:700}
#ride-dialog #ride-speed{font-size:21px}
#ride-dialog #inspected-equipment{border:0;margin:12px 0 9px;padding:0}
#ride-dialog .inspect-part{background:linear-gradient(#fff9e7,#efe4c8);border:1px solid #c7b78c;border-radius:8px}
#ride-dialog .inspect-part>strong{color:#234c3b}
@media(max-width:620px){.ride-feature{grid-template-columns:1fr}#ride-dialog .ride-preview{min-height:75px}#ride-dialog .ride-preview canvas{height:82px}#ride-dialog .ride-overview{padding:10px}}

#ride-dialog .dialog-actions{margin:10px 0 3px}
#ride-dialog .dialog-actions .ride-reaction{
 flex:1;min-height:44px;padding:8px 12px;appearance:none;
 border:1px solid #ac8647;border-radius:10px;color:#493519;
 background:#e7c47c url('./assets/gold-button-v69.png') center / 130% 190% no-repeat;
 box-shadow:0 2px 0 #947243;font:inherit;font-weight:700;cursor:pointer
}
#ride-dialog .ride-reaction[aria-pressed=true]{filter:brightness(.89)}
#ride-dialog .ride-reaction:active{transform:translateY(1px)}