:root {
  --orange:#167f98;
  --orange-light:#e9f3f5;
  --ink:#193747;
  --muted:#7e929c;
  --paper:#f4f6f5;
  --card:#fdfefd;
  --line:#dbe4e4;
  --teal:#71c8d3;
}
.sidebar{background:#102e41;color:#b9ced6}
.sidebar-divider{background:#2b495b}
.brand-mark{background:#279bb6;clip-path:none;border-radius:50%;height:41px;width:41px}
.brand-mark .icon{fill:none;width:26px;height:26px;stroke-width:1.7}
.brand-word{font-style:normal;font-size:43px;letter-spacing:1.5px}
.brand-word>span{font-size:8px;letter-spacing:4px;margin-top:10px;color:#a8cbd6}
.side-label{color:#7996a7}
.nav-item{color:#b5cbd5}
.nav-item .icon{color:#85a6b8}
.nav-item:hover{background:#1d3e53}
.nav-item.active{background:#247f9a}
.nav-item small{border-color:#3f6072;color:#acc9d7}
.league-card{background:#173b4e;border-color:#315366}
.league-emblem{background:#294859;border-color:#526770;color:#d8ba7d}
.league-card .eyebrow,.league-level{color:#89a7b5}
.league-card strong{color:#e4eff2}
.league-progress{background:#315466}
.league-next{color:#a3bbc4}
.side-status{color:#7798a8}
.side-status>span:last-child{color:#70909f}
.live-dot{background:#6cb5a7;box-shadow:0 0 0 3px #6cb5a712}
.topbar{background:#fbfcf9}
.breadcrumb{color:#8da0a7}
.breadcrumb strong{color:#345263}
.credit-balance>.icon{color:#b79450}
.icon-button{color:#78939e}
.driver-avatar{background:#e0ebed;color:#557889}
.driver-avatar span{background:#80bba6}
.page-heading p{color:#83979e}
.season-badge{color:#66828e;background:#edf3f0}
.hero-card{background:#144b64;min-height:393px}
.hero-art{background-image:url('/public/assets/island-hero.png');background-position:center right}
.hero-art:after{background:linear-gradient(90deg,#0c3048f0 0%,#123e54bd 34%,#11334915 79%),linear-gradient(0deg,#113c54bf,transparent 39%)}
.hero-topline{color:#e2eff0}
.hero-topline .icon{color:#e4c98b;fill:none}
.hero-mode{color:#eef8f3;border-color:#c6e4e756}
.hero-content h2{font-size:69px;transform:none;line-height:.94;letter-spacing:.1px}
.hero-content h2 em{color:#99dfdd}
.hero-content p{color:#c5dfe4;line-height:1.85}
.hero-cta{background:#f8f3e5;color:#17465e;min-width:163px}
.hero-cta:hover{background:#fff9ea;box-shadow:0 4px 20px #0b355429}
.primary-button:hover{background:#126c86;box-shadow:0 5px 15px #126c861c}
.hero-cta.primary-button:hover{background:#fff9ea;color:#17465e}
.hero-bottom{border-top-color:#d8f4f424;background:#0b3c551f}
.hero-track .icon{color:#d8c799}
.hero-track small{color:#bad6df}
.pickup-token{color:#f6d99e;background:#37606f44;border-color:#bdd8e267}
.pickup-token:nth-child(2){color:#bde4e6}
.pickup-token:nth-child(3){color:#eed697}
.hero-pickups>span:last-child{color:#c7e0e7}
.pod-title>span{color:#8ba4ad;font-size:7px;letter-spacing:1.1px}
.pod-title>span i{font-style:normal;margin:0 4px;color:#b3c9cd}
.ready-status{color:#699d94}
.ready-status>span{background:#71ac9e}
.featured-pod{background:linear-gradient(150deg,#fff,#f6fafb);padding-bottom:17px}
.featured-pod-art{min-height:154px;margin-top:7px;isolation:isolate}
.boat-sprite{background-image:url('/public/assets/boats-atlas.png');filter:drop-shadow(0 9px 7px #284a6026);animation:boatRock 4.5s ease-in-out infinite;rotate:34deg}
.featured-pod-art>.boat-sprite{width:220px;height:220px;max-width:none}
.garage-art>.boat-sprite{width:190px;height:190px;max-width:none}
.shop-pod-art>.boat-sprite{width:220px;height:220px;max-width:none}
.pod-orbit{border-color:#d5e4ea;transform:translate(-50%,-20%) rotate(-14deg);height:72px}
.orbit-two{height:45px}
.pod-floor-glow{background:#c6e3e68a;bottom:26%;height:23px;filter:blur(13px)}
.pod-serial{color:#a1b6bf}
.stat-row>span{color:#8b9fa7;letter-spacing:.55px}
.stat-meter{background:repeating-linear-gradient(90deg,#e1eaec 0,#e1eaec 8px,transparent 8px,transparent 10px)}
.stat-meter>i{background:repeating-linear-gradient(90deg,#6794a1 0,#6794a1 8px,transparent 8px,transparent 10px)}
.stat-row small{color:#93a9b1}
.featured-boat-trait{display:flex;gap:7px;align-items:flex-start;font-size:8px;line-height:1.55;color:#8da2ab;margin-top:15px;min-height:27px}
.featured-boat-trait .icon{width:13px;height:13px;color:#5f92a6;margin-top:1px}
.featured-pod>.outline-button{margin-top:13px;border-color:#d3e3e7;color:#557d90}
.outline-button{border-color:#d3e2e8;color:#557d90}
.outline-button:hover{background:#eef5f6}
.text-link{color:#4a839a}
.text-link:hover{color:#155570}
.count-tag{border-color:#d3e4e6;background:#eaf1f2;color:#81a0a9}
.track-card{border-color:#dce6e7;background:#fff}
.track-card.selected{border-color:#72b8c7;box-shadow:0 0 0 1px #72b8c717}
.track-card:hover{border-color:#80b5c5;box-shadow:0 5px 20px #345c6d13}
.track-art{height:155px;background-image:none;background-color:var(--island-sea);background:radial-gradient(ellipse at 65% 30%,#65b9c51f,transparent 50%),var(--island-sea);isolation:isolate}
.track-art:before{content:'';position:absolute;inset:-30%;background:repeating-radial-gradient(ellipse at 0 0,transparent 0 33px,#b6edee11 34px 35px,transparent 36px 58px);transform:rotate(-12deg);animation:seaShimmer 18s linear infinite;z-index:-1}
.island-card-sprite{position:absolute;left:50%;top:50%;translate:-50% -50%;width:100%;height:173%;object-fit:contain;filter:drop-shadow(0 7px 5px #00233715);transition:scale .4s ease}
.track-card:hover .island-card-sprite{scale:1.06}
.track-number{background:#123e5766;border-radius:2px;padding:3px 5px;top:10px;left:10px;font-size:6px}
.difficulty{background:#fffffff0;color:#488571}
.difficulty.pro{color:#457690}
.difficulty.elite{color:#a57b43}
.track-image-overlay{background:linear-gradient(0deg,#0b3c5542,transparent 44%);pointer-events:none}
.track-card.selected .track-open{color:#23839a;border-color:#bddde4;background:#edf7f7}
.track-body h3{font-size:23px}
.track-body p{color:#89a0a9;font-size:8px;letter-spacing:.1px}
.track-meta{border-color:#e4edef;color:#88a0aa}
.track-meta>span:last-child{color:#b59150}
.pit-strip{background:#eaf0ee;border-color:#d8e3df}
.pit-icon{color:#66959c;background:#dce9e5;border-color:#ceddd7}
.pit-strip h3{color:#355e6c}
.pit-strip p{color:#8fa6a9}
.dark-button{background:#234d64}
.dark-button:hover{background:#32677c}
.equipped-button{background:#edf5f5;border-color:#dceaea;color:#6e9aa6}
.mini-tag{background:#edf3f5;color:#91a8b1}
.mini-tag.orange-tag{background:#e9f6f7;color:#2a8ca6}
.garage-card.selected{border-color:#7fbcca}
.garage-art{height:175px;background:radial-gradient(ellipse at 50% 58%,#d8e9ed80,transparent 67%)}
.garage-card>p{color:#8b9fa8}
.garage-card>button{margin-top:16px}
.fleet-filters{display:flex;align-items:center;gap:15px}
.fleet-filters>button{background:transparent;border:0;border-bottom:2px solid transparent;padding:8px 0;color:#9cabb0;font-size:8px;font-weight:700;letter-spacing:.9px}
.fleet-filters>button.active{color:#2a8197;border-bottom-color:#2a8197}
.garage-toolbar>span:last-child{color:#98abb2;font-size:8px;letter-spacing:.6px}
.boat-characteristics{margin-top:15px;min-height:54px;border-top:1px solid #e4edf0;padding-top:12px}
.boat-characteristics>span{font-size:6px;font-weight:700;letter-spacing:1px;color:#5d8c9f}
.boat-characteristics>p{font-size:9px;color:#8199a4;line-height:1.65;margin-top:4px}
.shop-side-card{background:#eaf2f2;border-color:#d9e5e6}
.shop-side-card>p{color:#89a0a9}
.shop-item-title>span{color:#82a1ad}
.shop-card-details p{color:#8a9fa7}
.shop-buy{background:#edf7f8;border-color:#cce4e9;color:#278299}
.shop-buy:hover{background:#dceff2}
.upgrade-levels>i{background:#e0ebee}
.shop-pod-tag{border-color:#d6e5e9;color:#7796a4}
.dirty-illustration{color:#7295a1}
.loadout-list{border-color:#d6e4e6}
.loadout-list>div{color:#7898a4}
.stage-art{background-image:none;background-color:var(--island-sea)}
.stage-art>img{position:absolute;right:0;top:50%;translate:0 -50%;height:360%;width:75%;object-fit:contain;opacity:.9}
.stage-banner-overlay{background:linear-gradient(90deg,#123c58e8,#14455ba8 50%,#133b5520)}
.stage-banner-copy{z-index:1}
.stage-banner-copy>.eyebrow{color:#c0d9e4}
.stage-banner-copy>span:last-child{color:#c7e1e9;font-size:8px}
.stage-banner-copy i{color:#80b6c8}
.stage-prize{color:#f3dbab}
.stage-prize small{color:#dbeaf0}
.modal-backdrop{background:#0c263bba}
.stage-conditions{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #dbe6e8;padding-bottom:13px;margin-bottom:15px;color:#7e9eac;font-size:7px;font-weight:600;letter-spacing:.4px}
.stage-conditions>span{display:flex;align-items:center;gap:5px}
.stage-conditions .icon{width:13px;height:13px;color:#5296aa}
.stage-tabs{border-color:#d4e4e8}
.stage-tabs button>span{background:#e3eef1;color:#87a9b7}
.stage-footer{border-color:#dbe6e8}
.stage-current-pod>.icon{color:#5492a9}
.stage-current-pod>span{color:#9ab0ba}
.stage-current-pod strong{color:#345e74}
.stage-control-hint{color:#9bb1ba}
kbd{color:#7999a8;border-color:#c8dce4;background:#e7f0f3}
.help-modal>p{color:#829da9}
.help-modal>.modal-close{background:#e6f1f3;color:#567e91;border-color:#cde1e6}
.control-grid{background:#e6eff2}
.control-grid span{color:#7895a4}
.control-grid kbd{background:#fbfdfd}
.help-pickups{color:#7494a6}
.result-position>span{color:#8ba4af}
.result-stats>span{color:#8aa4b2}
.result-stats strong{color:#426b81}
#toast{background:#214b62;border-color:#709ead;box-shadow:0 8px 30px #17394f22}
#toast .icon{color:#b8dfda}
.racing,.race-screen{background:#176787}
.race-top-hud{color:#f7fcfd;filter:drop-shadow(0 2px 7px #06314660)}
.race-brand>.icon{fill:none;color:#a5e5e2}
.race-track-name>span{color:#b7dce8}
.race-progress{background:#133c52dd;border-color:#a0d0df4a}
.race-progress>span{color:#a8cbd8}
.race-progress>span:first-child strong{color:#e5d4a8}
.race-progress strong>small{color:#a0c2cf}
.race-icon-button{background:#133c52df;border-color:#aed8e252;color:#def0f3}
.race-wind{display:flex;align-items:center;gap:7px;color:#c5e9ed;font-size:8px;font-weight:700;background:#16445cb8;padding:10px 11px;border-radius:4px;white-space:nowrap}
.race-wind>.icon{width:16px;height:16px}
.race-wind>i{display:grid;place-items:center;width:21px;height:21px;transition:rotate .5s;border:1px solid #c7e3ec55;border-radius:50%;margin-left:4px}
.race-wind>i .icon{width:13px;height:13px}
.race-speed{background:#133c52df;border-color:#aed8e24a}
.race-speed>span{color:#bfd6df}
.race-meter{background:#103a52af;box-shadow:0 0 0 1px #a0d1e23b}
.race-meter>i{background:#f0cf8e}
.race-meter.health>i{background:#91d4c8}
.race-meter-group b{font-weight:700}
.race-meter-group small{color:#c2e0e7}
.race-gear{border-left-color:#cae7f249}
.race-gear>span{color:#badde8}
.race-gear kbd{background:#204f66;border-color:#75a2b8;color:#e1f1f4}
.race-gear>small{color:#c8e5e8}
.race-gear>#hud-sail{color:#f4dda9;margin-top:4px;font-size:7px}
.race-key-hint kbd{color:#c7e3ed;background:#103b51c9;border-color:#679bad}
.race-key-hint small{color:#c6dfe6}
footer,footer button{color:#9db0b7}
@keyframes boatRock{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-5px) rotate(2deg)}}
@keyframes seaShimmer{0%{translate:0 0}100%{translate:30px 18px}}
@media(min-width:1600px){.hero-content h2{font-size:80px}.hero-card{min-height:430px}.featured-pod-art{min-height:184px}.track-art{height:180px}.featured-pod-art>.boat-sprite{width:265px;height:265px}}
@media(max-width:1250px){.hero-content h2{font-size:63px}.hero-card{min-height:408px}.featured-pod-art{min-height:141px}.featured-pod-art>.boat-sprite{width:200px;height:200px}.track-art{height:142px}.hero-content{padding-top:13px}}
@media(max-width:1050px){.hero-content h2{font-size:56px}.hero-card{min-height:406px}.featured-pod-art>.boat-sprite{width:184px;height:184px}.track-art{height:130px}.featured-boat-trait{font-size:7px}.fleet-filters{gap:13px}.fleet-filters>button{font-size:7px}}
@media(max-width:800px){.hero-content h2{font-size:48px}.hero-card{min-height:386px}.track-art{height:121px}.featured-pod-art{min-height:138px}.featured-pod-art>.boat-sprite{width:175px;height:175px}.all-tracks .track-art{height:155px}.race-wind{position:absolute;top:88px;right:0;padding:7px 9px;gap:5px}.garage-toolbar>span:last-child{display:none}}
@media(max-width:650px){
  .race-wind{top:123px}
  .hero-card{min-height:383px}.hero-content{padding:16px 25px 0}.hero-content h2{font-size:58px;line-height:.94}.hero-art:after{background:linear-gradient(90deg,#113e54d9,rgba(12,48,68,.3)),linear-gradient(0deg,#10344a95,transparent 45%)}.hero-content p{font-size:11px;margin-top:19px}.hero-cta{margin-top:23px}.hero-bottom{padding:20px 23px}.hero-track small{font-size:6px;margin-left:22px}.hero-topline{font-size:7px}.featured-pod{gap:0 15px}.featured-pod>.featured-pod-art{grid-column:2;grid-row:2 / 6;min-height:185px}.featured-pod>.featured-boat-trait{grid-column:1;font-size:7px;line-height:1.5;max-width:164px;margin-top:12px}.featured-pod>.outline-button{grid-column:1;margin-top:13px}.featured-pod-art>.boat-sprite{width:202px;height:202px}.featured-pod .pod-title>span{font-size:6px;line-height:1.7;letter-spacing:.5px}.featured-pod .pod-title h2{font-size:28px}.track-art,.all-tracks .track-art{height:181px}.track-body p{font-size:10px}.island-card-sprite{height:165%;width:100%}.track-number{font-size:7px;top:12px;left:12px}.garage-art{height:120px}.garage-art>.boat-sprite{width:137px;height:137px}.garage-card h2{font-size:22px}.garage-card .card-topline .eyebrow{font-size:6px}.boat-characteristics{min-height:68px;margin-top:12px;padding-top:10px}.boat-characteristics>p{font-size:8px;line-height:1.55}.boat-characteristics>span{font-size:5px;letter-spacing:.6px}.fleet-filters{gap:13px;justify-content:space-between;width:100%}.fleet-filters>button{font-size:7px;letter-spacing:.5px}.stage-conditions{font-size:6px;gap:6px;margin-bottom:16px;padding-bottom:12px}.stage-conditions .icon{width:12px;height:12px}.stage-banner-copy>span:last-child{font-size:7px}.stage-art>img{width:100%;height:260%;right:-25%}.stage-prize{right:17px;bottom:19px}.stage-footer>.primary-button{font-size:7px;gap:9px}.race-gear{background:#16465dca;border-color:#cae7f240}.touch-controls button{background:#174f68d9;border-color:#d2e9f078;color:#e3f4f7}.touch-controls button:active{background:#38809bef}
}
@media(min-width:651px) and (max-height:800px){.stage-conditions{margin-bottom:11px;padding-bottom:10px;font-size:6px}.stage-control-hint{display:none}.stage-banner{height:110px}.stage-intro h3{font-size:24px}.stage-items{gap:8px}.small-shop-card{padding:8px 13px}.small-shop-card .shop-card-details p{font-size:8px}.stage-footer{margin-top:12px;padding-top:12px}}
