/* V5.55: typography stays GPU-light. Font box gets true spare paint area for italic stroke + glow. */
.h54GearNumber,.h54SpeedNumber{box-sizing:content-box!important;padding:7px 10px 9px 4px!important;overflow:visible!important;max-width:none!important;line-height:1.12!important;}
.h54GearBox,.h54SpeedBox{overflow:visible!important;}
.h54GearBox{gap:0!important;}
.h54SpeedNumber{grid-row:2!important;grid-column:1!important;align-self:center!important;margin:0!important;transform:translateY(-1px);}
.h54SpeedBox{align-items:center!important;grid-template-columns:minmax(0,1fr) 27px!important;grid-template-rows:12px auto!important;}
.h54SpeedUnit{align-self:end!important;padding-bottom:7px!important;}
/* Desktop-only +20% dimensions and typography; portrait/touch and tiny HUD sizes unchanged. */
.h54HUD.h55Desktop .h54GearBox{width:110px!important;height:90px!important;border-radius:14px!important;}
.h54HUD.h55Desktop .h54GearNumber{font-size:60px!important;}
.h54HUD.h55Desktop .h54GearLabel{font-size:10px!important;}
.h54HUD.h55Desktop .h54SpeedBox{width:154px!important;height:88px!important;border-radius:14px!important;grid-template-columns:minmax(0,1fr) 28px!important;grid-template-rows:14px 57px!important;padding:4px 7px!important;}
.h54HUD.h55Desktop .h54SpeedNumber{font-size:50px!important;}
.h54HUD.h55Desktop .h54SpeedLabel{font-size:10px!important;}
.h54HUD.h55Desktop .h54SpeedUnit{font-size:10px!important;}
/* 80km/h gold; 120km/h red. Static color until threshold changes. */
.h54SpeedBox.h54Fast{border-color:rgba(255,201,50,.82)!important;box-shadow:inset 0 0 0 1px #fff2b119,0 0 15px #ffad0044,0 7px 22px #0007!important;}
.h54SpeedBox.h54Redline{border-color:#ff485d!important;box-shadow:0 0 16px #fc234a77,inset 0 0 17px #fc234a33!important;}
/* Gear flares out briefly, returns to normal size; one animation only at a real gear change. */
.h54GearBox.h54Shift .h54GearNumber{animation:h55GearPop .49s cubic-bezier(.15,1.2,.25,1) both!important;}
@keyframes h55GearPop{0%{transform:scale(1);opacity:1}20%{transform:scale(1.52);opacity:1}58%{transform:scale(.96)}100%{transform:scale(1)}}
.h55RevRing{position:fixed;z-index:19;pointer-events:none;display:none;box-sizing:border-box;border-radius:50%;border:4px solid rgba(255,43,66,.9);box-shadow:inset 0 0 26px rgba(255,5,40,.65),0 0 12px 3px #ff1f43,0 0 34px 8px rgba(255,21,53,.65);background:radial-gradient(circle,transparent 53%,rgba(255,12,41,.13) 75%,rgba(255,20,41,.37) 100%);}
.h55RevRing.active{display:block;}
.h55RevRing.revHit{animation:h55RevBurst .39s ease-out both;}
@keyframes h55RevBurst{0%{opacity:.4;filter:brightness(1.9);transform:scale(.86)}55%{opacity:1;filter:brightness(2.2);transform:scale(1.04)}100%{opacity:1;filter:brightness(1);transform:scale(1)}}
/* Two-car camera enters on READY only. Same bright CSS treatment as the WIN/GO effects. */
.h55Duel{position:fixed;inset:0;z-index:27;pointer-events:none;display:none;align-items:center;justify-content:flex-start;flex-direction:column;padding-top:10vh;box-sizing:border-box;overflow:hidden;text-align:center;}
.h55Duel.show{display:flex;}
.h55DuelTop{font:1000 clamp(18px,2.3vw,32px)/1 Impact,'Arial Black',sans-serif;letter-spacing:.28em;color:#fef4d1;text-shadow:0 0 8px #ffab00,0 0 20px #fa4000;animation:h55TitleIn .38s both;}
.h55Names{display:flex;align-items:center;justify-content:center;gap:clamp(10px,3vw,45px);margin-top:10px;max-width:95vw;}
.h55Names span{font:900 clamp(22px,3.5vw,54px)/1.15 Impact,'Arial Black',sans-serif;letter-spacing:.04em;white-space:nowrap;max-width:35vw;overflow:hidden;text-overflow:ellipsis;background:linear-gradient(#fff,#64dfff 45%,#087dff 70%,#061b66);background-clip:text;-webkit-background-clip:text;color:transparent;filter:drop-shadow(2px 3px 0 #00112c) drop-shadow(0 0 8px #00c2ff);padding:8px;}
.h55Names b{font:1000 italic clamp(44px,6.5vw,95px)/1 Impact,'Arial Black',sans-serif;color:#ffe64f;text-shadow:0 0 9px #ffb000,0 0 22px #f73600,4px 6px 0 #3c1600;animation:h55Vs .85s cubic-bezier(.15,1.12,.2,1) both;}
.h55DuelSweep{height:3px;width:min(80%,800px);background:linear-gradient(90deg,transparent,#ffffa8 50%,transparent);box-shadow:0 0 16px #ffce29;animation:h55Sweep .9s both;}
@keyframes h55TitleIn{0%{opacity:0;transform:translateY(-24px)}100%{opacity:1;transform:none}}
@keyframes h55Vs{0%{opacity:0;transform:scale(2.6) rotate(-12deg)}54%{opacity:1;transform:scale(.91) rotate(4deg)}100%{transform:scale(1) rotate(0deg)}}
@keyframes h55Sweep{0%{opacity:0;transform:scaleX(.1)}55%{opacity:1;transform:scaleX(1)}100%{opacity:0}}
@media(orientation:portrait){.h55Duel{padding-top:11vh}.h55Names{gap:6px}.h55Names span{max-width:33vw;}}
@media(prefers-reduced-motion:reduce){.h54GearBox.h54Shift .h54GearNumber,.h55RevRing.revHit,.h55DuelTop,.h55Names b,.h55DuelSweep{animation:none!important}}

/* V5.55 ALL MODE / front-of-car intro in the same cinematic UI layer. */
.h55Duel.solo .h55Names b,.h55Duel.solo .h55Names span:last-child{display:none!important}
.h55Duel.solo .h55Names span:first-child{max-width:min(80vw,850px);font-size:clamp(25px,4.2vw,62px)}
.h55Duel.show{padding-top:clamp(42px,9vh,100px)}

/* V5.81: remove old rev-warning ring and its pulse; static redline markers and RPM needle remain. */
.h55RevRing,.h55RevRing.active,.h55RevRing.revHit{display:none!important;animation:none!important;box-shadow:none!important;}
