/* Racing details shared by the garage, navigation and shop. */
:root{--race-stripe:#bf2335;--race-tint:#f6e7e9;--race-lines:rgba(120,35,45,.12);--race-check:rgba(30,30,30,.16)}
:root[data-theme=dark]{--race-tint:#332024;--race-lines:rgba(255,255,255,.09);--race-check:rgba(255,255,255,.2)}
.brand-icon{position:relative;overflow:hidden;font-style:italic}
.brand-icon::after{content:'';position:absolute;bottom:0;left:0;right:0;height:4px;background:repeating-linear-gradient(90deg,#fff 0 4px,transparent 4px 8px);opacity:.8}
.sidebar .navitem{position:relative;transition:background-color .15s,color .15s}
.sidebar .navitem.active::before{content:'';position:absolute;left:0;top:9px;bottom:9px;width:3px;background:var(--race-stripe)}
.mobile-nav .navitem.active{box-shadow:inset 0 -2px var(--race-stripe)}
main>header{position:relative;padding-bottom:16px;border-bottom:1px solid var(--line)}
main>header::after{content:'';position:absolute;right:0;bottom:-1px;width:52px;height:3px;background:repeating-linear-gradient(90deg,var(--race-stripe) 0 10px,transparent 10px 14px)}
.section-head h2{display:flex;align-items:center;gap:8px}
.section-head h2::before{content:'';flex:none;width:4px;height:18px;background:var(--race-stripe);transform:skewX(-15deg)}
.button:not(:disabled){transition:filter .15s,transform .15s}
.button:not(:disabled):hover{filter:brightness(1.08)}
.button:not(:disabled):active{transform:translateY(1px)}

.race-hero{min-height:240px;align-items:stretch;padding:0;isolation:isolate}
.race-hero::after{display:block;width:auto;height:5px;inset:auto 0 0;border:0;border-radius:0;background:repeating-linear-gradient(90deg,var(--race-stripe) 0 38px,transparent 38px 44px);opacity:.9}
.race-hero-content{position:relative;z-index:1;flex:1;min-width:0;padding:28px 32px 32px}
.race-hero-label{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}
.race-hero-label::before{content:'';width:20px;height:3px;background:var(--race-stripe);transform:skewX(-25deg)}
.race-hero h2{font-size:clamp(24px,3vw,34px);margin:8px 0 16px;overflow-wrap:anywhere}
.race-hero-stats{display:flex;gap:30px;margin-bottom:22px}
.race-hero-stats>div{display:flex;align-items:baseline;gap:5px}
.race-hero-stats strong{font-size:24px;line-height:1;font-variant-numeric:tabular-nums}
.race-hero-stats strong small{font-size:15px}
.race-hero-stats span{color:var(--muted);font-size:13px}
.race-start{display:inline-flex;align-items:center;gap:24px}
.race-start>span{font-size:20px;line-height:1}
.race-hero-art{position:relative;flex:0 0 38%;min-width:190px;overflow:hidden;display:grid;place-items:center;background:linear-gradient(115deg,transparent,var(--race-tint))}
.race-hero-art::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(120deg,transparent 0 26px,var(--race-lines) 27px 28px,transparent 29px 52px)}
.race-hero-orbit{position:absolute;width:180px;height:180px;border:1px solid var(--race-lines);border-radius:50%;box-shadow:0 0 0 22px var(--race-lines),0 0 0 45px var(--race-lines)}
.race-hero-car{position:relative;font-size:92px;line-height:1;transform:rotate(-7deg);filter:drop-shadow(0 12px 10px #0002)}
.race-hero-stripes{position:absolute;right:16px;bottom:17px;width:74px;height:16px;background:repeating-conic-gradient(var(--race-check) 0 25%,transparent 0 50%) 0 0/16px 16px;transform:skewX(-15deg)}
.stats .stat:first-child{box-shadow:inset 0 2px var(--race-stripe)}
.stats .stat{min-width:0}

.stars-heading{position:relative;overflow:hidden;padding-bottom:14px;border-bottom:1px solid var(--line)}
.finish-mark{flex:none;width:80px;height:16px;background:repeating-conic-gradient(var(--race-check) 0 25%,transparent 0 50%) 0 0/16px 16px;transform:skewX(-15deg)}
.stars-grid{margin-top:20px;align-items:stretch}
.stars-card{display:flex;flex-direction:column;position:relative;overflow:hidden;min-height:230px}
.stars-card::before{content:'';position:absolute;top:0;left:0;width:58px;height:3px;background:var(--race-stripe);transform:skewX(-25deg);transform-origin:left}
.stars-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:16px}
.stars-product-icon{min-width:52px;height:52px;padding:0 5px;display:flex;align-items:center;justify-content:center;background:var(--race-tint);font-size:26px;line-height:1;white-space:nowrap}
.stars-product-category{color:var(--muted);font-size:12px}
.stars-card h3{font-size:17px}
.stars-description{flex:1;margin:3px 0 18px}
.stars-buy{margin-top:auto}

@media(max-width:650px){
 .race-hero{min-height:200px;padding:0}
 .race-hero-content{padding:22px 20px 27px}
 .race-hero h2{font-size:25px;margin:7px 0 15px}
 .race-hero-stats{gap:18px;margin-bottom:20px}
 .race-hero-stats strong{font-size:21px}
 .race-hero-stats span{font-size:12px}
 .race-hero-art{flex-basis:27%;min-width:80px}
 .race-hero-orbit{width:110px;height:110px}
 .race-hero-car{font-size:56px}
 .race-hero-stripes{right:7px;bottom:14px;width:46px;height:12px;background-size:12px 12px}
 .race-start{gap:12px}
 .stars-card{min-height:0}
 .stars-card-top{margin-bottom:12px}
 .stars-description{margin-bottom:16px}
}
@media(max-width:360px){.race-hero-art{flex-basis:20%;min-width:55px}.race-hero-car{font-size:44px}.race-hero-stats{gap:12px}.race-hero-stats>div{gap:3px}}
@media(prefers-reduced-motion:reduce){.button,.sidebar .navitem{transition:none}}
