@font-face{font-family:Outfit;src:url('vendor/outfit.woff2') format('woff2');font-weight:100 900;font-display:swap}:root{--ink:#203b48;--muted:#577480;--paper:#fffaf0;--accent:#ffb66f;--mint:#3fbda5}*{box-sizing:border-box}body,html{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:Outfit,Arial,sans-serif;color:var(--ink);background:#b8e8ee}button,input,select{font:inherit}button{cursor:pointer;border:0}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #427cba;outline-offset:4px}button:disabled{cursor:not-allowed}a{color:inherit}#game{position:absolute;inset:0}#game canvas{display:block;width:100%;height:100%}[hidden]{display:none!important}header{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:26px 4%;z-index:5;pointer-events:none}header>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;font-size:24px;line-height:1;font-weight:900;letter-spacing:-.8px}.brand small{display:block;font-size:8px;letter-spacing:4.2px;margin-top:7px}.brand-mark{background:var(--ink);color:var(--paper);width:45px;height:45px;border-radius:12px;display:grid;place-content:center;font-size:35px;font-weight:900;position:relative}.brand-mark span{font-size:23px;color:var(--accent);position:absolute;right:1px;top:-5px}.brand>span:last-child{white-space:nowrap}header nav{display:flex;gap:8px;border:1px solid #fff7;background:#ffffff40;border-radius:13px;padding:5px}.nav-item{background:transparent;color:#56717c;font-size:10px;font-weight:800;letter-spacing:1px;padding:11px 15px;border-radius:9px}.nav-item.active{background:var(--paper);color:var(--ink);box-shadow:0 2px 4px #234b5910}.nav-item span{font-size:8px;background:#2f566716;padding:3px 5px;border-radius:4px;margin-left:4px}.header-right{display:flex;gap:10px;align-items:center}.wallet{padding:10px 14px;background:#ffffff73;border-radius:10px;font-size:13px}.coin-symbol{color:#dd952b;margin-right:6px}.icon-button{height:37px;width:37px;border:1px solid #fff9;border-radius:10px;background:#ffffff80;color:var(--ink);font-size:20px;font-weight:700}.icon-button:hover{background:var(--paper)}#lobby{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#b8e8ee9e 0%,#b8e8ee40 35%,transparent 65%)}.hero{position:absolute;left:7%;top:18%;width:315px;pointer-events:auto}.eyebrow{font-size:9px;font-weight:750;letter-spacing:1.7px;display:flex;align-items:center;gap:8px}.eyebrow i,.online-button i{width:6px;height:6px;background:var(--mint);border-radius:50%;display:inline-block}h1{font-size:clamp(58px,5.4vw,82px);font-weight:850;letter-spacing:-4px;line-height:1.01;margin:19px 0 17px}h1 em{font-style:normal;color:#f57f58}p{line-height:1.6}.hero-copy{font-size:13px;color:var(--muted);margin:0 0 23px}.selected-course{background:#fffcf0af;border:1px solid #fff;border-radius:14px;padding:14px 17px;margin-bottom:12px;backdrop-filter:blur(12px)}.course-kicker{display:flex;justify-content:space-between;font-size:8px;font-weight:850;letter-spacing:1.5px}.course-kicker>span:last-child{font-size:9px;letter-spacing:2px;color:#e69755}.selected-course h2{font-size:20px;letter-spacing:-.5px;margin:8px 0 10px}.selected-course h2>span:first-child{color:#a5b7b9;font-size:16px;margin-right:9px}.course-facts{display:flex;gap:15px;font-size:9px;color:#69818a}.course-facts b{font-weight:650;color:#3f5b65}.primary-button{background:var(--ink);border-radius:11px;color:var(--paper);padding:16px 20px;display:flex;justify-content:space-between;align-items:center;gap:25px;font-size:12px;font-weight:750;letter-spacing:.8px;width:100%;box-shadow:0 5px 0 #15303c30;transition:transform .15s,background .15s}.primary-button>span{font-size:21px;line-height:1}.primary-button:hover{background:#305a69;transform:translateY(-2px)}.primary-button:active{transform:translateY(2px)}.online-button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:#ffffff65;border:1px solid #fff;border-radius:10px;padding:12px;color:var(--ink);margin-top:11px;font-size:10px;font-weight:800;letter-spacing:1px}.online-button>span{margin-left:auto}.online-button i{margin-right:auto}.play-caption{font-size:9px;text-align:center;color:#60838d;margin-top:11px}.play-caption>span{margin:0 8px}.runner-caption{position:absolute;right:7%;top:36%;text-align:right;pointer-events:auto}.mini-label{font-size:8px;font-weight:750;letter-spacing:1.7px;display:block}.runner-caption h3{font-size:42px;letter-spacing:-1.6px;margin:8px 0 1px;font-weight:900}.runner-caption p{font-size:11px;color:#58757f;margin:0 0 16px}.runner-caption button{background:var(--paper);border:1px solid #fff;padding:10px 13px;border-radius:8px;color:var(--ink);font-size:8px;font-weight:800;letter-spacing:.5px}.runner-caption button span{margin-left:13px}.tour-strip{position:absolute;bottom:119px;left:38%;right:6%;display:flex;align-items:center;background:#fffbf2c9;border:1px solid #fff;backdrop-filter:blur(15px);border-radius:16px;padding:17px 20px;gap:22px;pointer-events:auto;box-shadow:0 6px 25px #224d5c09}.tour-summary{min-width:90px}.tour-summary strong{display:block;font-size:26px;margin:4px 0}.tour-summary small{font-size:13px;color:#89a0a5;font-weight:500}.tour-summary .mini-label{font-size:7px;letter-spacing:1px}.tour-progress{height:3px;width:90px;background:#dbe5e5;border-radius:3px}.tour-progress>div{height:100%;background:#e99b62;width:0}.world-chapters{display:flex;justify-content:space-between;flex:1;gap:7px}.world-chapter{background:transparent;color:#779297;padding:0;width:50px;text-align:center}.world-chapter .world-dot{height:30px;width:30px;display:grid;place-items:center;border:1px solid #b4c9c9;border-radius:10px;font-size:10px;margin:auto auto 7px}.world-chapter.active .world-dot{background:var(--ink);border-color:var(--ink);color:white}.world-chapter small{font-size:7px;white-space:nowrap}.map-button{border-left:1px solid #d2dfdc;background:transparent;color:#3c5760;font-size:8px;line-height:1.6;letter-spacing:.5px;padding:8px 0 8px 17px;white-space:nowrap;text-align:left}.map-button span{font-size:17px;margin-left:10px}.guest-strip{position:absolute;left:7%;bottom:118px;display:flex;align-items:center;gap:11px;pointer-events:auto}.guest-avatar{font-size:25px;background:#fff9;border-radius:11px;border:1px solid white;padding:5px 9px}.guest-strip .mini-label{font-size:7px;letter-spacing:1.3px;color:#65828b}.guest-strip button{font-size:12px;font-weight:650;padding:4px 0;background:transparent;color:var(--ink)}.guest-strip button>span+span{font-size:12px;color:#8aa3ab;margin-left:10px}.xp-label{position:absolute;top:52px;left:54px;font-size:8px;color:#65828b;white-space:nowrap}.xp-label>span{margin:0 7px}footer{position:absolute;bottom:0;left:0;right:0;padding:24px 4%;display:flex;justify-content:space-between;align-items:center;z-index:3;background:linear-gradient(transparent,#b7d9dd40);pointer-events:none}.controls{display:flex;gap:18px;font-size:7px;letter-spacing:.8px;font-weight:700}.controls>span{display:flex;align-items:center;gap:7px}kbd{font:inherit;background:#ffffff80;border:1px solid #ffffffa0;border-bottom:2px solid #fff;padding:6px 7px;border-radius:5px;letter-spacing:.8px;font-size:8px}footer button{background:transparent;color:#627d89;font-size:8px;letter-spacing:1px;pointer-events:auto}.build-label{font-size:7px;letter-spacing:1.4px;color:#6e8c96}.racing header nav,.racing .wallet,.racing .brand small{display:none}.racing header{padding-top:22px}.racing .brand{font-size:19px}.racing .brand-mark{width:34px;height:34px;font-size:26px}.racing footer{padding:17px 4%}.racing footer #about,.racing footer .build-label{display:none}#hud{position:absolute;inset:0;pointer-events:none}.hud-left{position:absolute;left:4%;top:105px}.hud-eyebrow{display:flex;gap:10px;align-items:center;font-size:9px;font-weight:850;letter-spacing:1px}.hud-eyebrow>span:first-child{background:var(--ink);color:white;padding:6px 8px;border-radius:5px}.hud-left h2{font-size:29px;margin:11px 0 6px;letter-spacing:-.7px}#checkpoint{font-size:10px;color:#4c6c78}.hud-right{position:absolute;right:4%;top:104px;display:flex;align-items:start;gap:12px}.hud-right button{pointer-events:auto}.race-clock{background:#fffcf0df;border:1px solid #fff;border-radius:13px;padding:14px 20px;min-width:145px}.race-clock b{display:block;font-size:31px;font-variant-numeric:tabular-nums;letter-spacing:-1px;margin-top:3px}.race-clock small{display:block;margin-top:5px;font-size:8px;font-weight:750;color:#bc864b;letter-spacing:1px}#online-status{position:absolute;top:31px;left:50%;transform:translateX(-50%);font-size:8px;background:#fff9;border-radius:20px;padding:8px 13px;font-weight:750;color:#287c70;letter-spacing:.5px}#race-message{position:absolute;top:30%;left:20%;right:20%;font-size:20px;text-align:center;font-weight:800;color:#fffaf0;text-shadow:0 2px 8px #234652;transition:opacity .2s}.hud-bottom{position:absolute;bottom:90px;left:25%;right:25%;display:flex;align-items:center;gap:25px;background:#fffaf0e8;border:1px solid white;padding:14px 20px;border-radius:15px;backdrop-filter:blur(10px)}.position strong,.speed strong{display:block;margin-top:4px;font-size:26px;font-variant-numeric:tabular-nums;white-space:nowrap}.position small,.speed small{font-size:11px;color:#96a8ac;font-weight:500}.distance-progress{flex:1}.progress-labels{display:flex;justify-content:space-between;font-size:9px;margin-bottom:9px;color:#789297}.progress-labels>span:last-child{color:#d0953d;font-weight:750}.track{height:5px;border-radius:4px;background:#d6e2de;position:relative}.track>div{background:#4aab98;height:100%;border-radius:4px;width:0}.track>span{position:absolute;right:-5px;top:-7px;font-size:18px}#countdown{position:absolute;inset:0;display:grid;place-items:center;font-size:155px;color:#fffaf0;text-shadow:0 6px #263e50;font-weight:900;pointer-events:none}#level-intro{position:absolute;top:30%;width:100%;text-align:center;font-size:20px;font-weight:850;letter-spacing:2px;color:white;text-shadow:0 2px 8px #234652;pointer-events:none}dialog{border:1px solid #fff;border-radius:22px;background:#fffaf2;color:var(--ink);padding:35px;max-width:460px;width:calc(100% - 30px);max-height:86vh;overflow:auto;box-shadow:0 25px 90px #102b4e30;text-align:center}dialog::backdrop{background:#19374568;backdrop-filter:blur(9px)}dialog.wide{max-width:850px;text-align:left}dialog h2{font-size:34px;letter-spacing:-1px;margin:12px 0}dialog p{font-size:13px;color:#6f858c;margin:12px 0}dialog .mini-label{color:#789094}dialog .primary-button{margin-top:20px}dialog .primary-button>span{font-size:20px}.close-modal{position:absolute;right:15px;top:10px;font-size:25px;color:#87999e;background:transparent;padding:5px}.secondary-button{padding:12px 15px;background:transparent;color:#6c848b;font-size:11px;margin:9px auto 0;display:block}.pill{display:inline-block;font-size:9px;letter-spacing:1px;background:#e3eeea;padding:7px 10px;border-radius:5px;color:#438070;font-weight:800}.result-medal{width:80px;height:80px;background:linear-gradient(145deg,#ffe4a5,#e4a547);border:5px solid #fff0c7;box-shadow:0 5px 0 #cd934e40;display:grid;place-items:center;border-radius:50%;font-size:30px;margin:8px auto 25px;color:white}.result-medal.silver{background:linear-gradient(145deg,#dce6ed,#94a5b8);border-color:#e9eef4}.result-medal.bronze{background:linear-gradient(145deg,#e4b596,#bb8767);border-color:#f0d4bd}.result-medal.failed{background:#dfdce6;border-color:#f0edf4}.result-time{font-size:51px;font-weight:800;letter-spacing:-2px;font-variant-numeric:tabular-nums}.result-best{font-size:9px;color:#35a48b;font-weight:800;letter-spacing:1px;margin-bottom:18px}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #e4e7de;border-bottom:1px solid #e4e7de;margin:18px 0;padding:17px 0}.result-stats strong{font-size:24px;display:block}.result-stats span{font-size:8px;color:#8a9a9f;letter-spacing:1px}.reward-line{font-size:11px;display:flex;justify-content:center;gap:20px;color:#a27a42}.next-preview{text-align:left;background:#e9eee9;border-radius:11px;padding:13px 16px;margin-top:20px}.next-preview small{display:block;color:#6e8b82;font-size:8px;letter-spacing:1px;margin-bottom:5px}.next-preview b{font-size:14px}.map-tabs{display:flex;gap:7px;margin:20px 0;overflow-x:auto;padding:2px}.map-tab{background:#e8eeea;border-radius:7px;padding:9px 12px;white-space:nowrap;font-size:10px;color:#71858c}.map-tab.active{background:var(--ink);color:white}.map-world-header{display:flex;justify-content:space-between;align-items:end;margin:8px 0 17px}.map-world-header h3{font-size:24px;margin:0}.map-world-header span{font-size:11px;color:#89999d}.level-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.level-card{background:#edf0e9;border:1px solid #dde5dc;border-radius:12px;padding:15px 12px;min-height:125px;text-align:left;color:var(--ink);position:relative}.level-card.active{border:2px solid #4aaa95;background:#e5f0e6}.level-card:disabled{opacity:.58}.level-card .level-num{font-size:25px;font-weight:800;letter-spacing:-1px}.level-card b{display:block;font-size:10px;margin:10px 0 5px}.level-card small{font-size:8px;color:#83958c}.level-card .stars{position:absolute;right:9px;top:13px;font-size:9px;letter-spacing:1px;color:#d0a05b}.map-footer{font-size:10px;color:#8c999e;margin-top:20px}.crew-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}.crew-card{border:2px solid #e1e8df;border-radius:14px;background:#f0f2ea;padding:23px 18px;text-align:left;color:var(--ink)}.crew-card.selected{border-color:#3eaa91}.crew-card:disabled{opacity:.55}.crew-card .crew-symbol{width:48px;height:48px;background:var(--crew-color);border-radius:13px;font-size:25px;display:grid;place-items:center;color:white;margin-bottom:14px}.crew-card b{display:block;font-size:21px}.crew-card small{display:block;margin-top:5px;font-size:10px;color:#7e9295}.form-row{text-align:left;margin:18px 0}.form-row label{display:block;font-size:10px;font-weight:700;letter-spacing:.5px;margin-bottom:7px}.form-row input,.form-row select{width:100%;border:1px solid #d4e0d9;border-radius:9px;background:#fff;padding:11px 12px;color:var(--ink);font-size:13px}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.help-grid>div{background:#eaf0e9;padding:15px;border-radius:10px;font-size:11px}.help-grid kbd{display:block;background:white;margin-bottom:8px}.room-code{font-size:38px;letter-spacing:7px;font-weight:850}.queue-dots{display:flex;gap:5px;justify-content:center;margin:20px}.queue-dots i{width:11px;height:11px;border-radius:4px;background:#dce5de}.queue-dots i.connected{background:#46af96}#touch{position:absolute;bottom:23px;left:20px;right:20px;justify-content:space-between;align-items:end;z-index:5;pointer-events:none}.dpad{display:grid;grid-template-columns:repeat(3,46px);grid-template-rows:repeat(2,46px);gap:5px}.dpad button{grid-row:2}.dpad button:first-child{grid-row:1;grid-column:2}#touch button{pointer-events:auto;touch-action:none;background:#fff9;border:1px solid #fff;color:var(--ink);border-radius:12px;font-weight:800;user-select:none}.touch-actions{display:flex;gap:10px;align-items:end}.touch-actions button{height:57px;width:57px;font-size:10px}.touch-actions button:last-child{height:74px;width:74px;background:var(--ink)!important;color:white!important}#loading{position:absolute;inset:0;background:#f1f1df;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:50}#loading .brand-mark{width:65px;height:65px;font-size:39px}#loading h2{font-size:22px;margin-top:30px;letter-spacing:-.5px}#loading p{font-size:11px;color:#7c9198}.loading-track{width:220px;height:4px;background:#d4ded5;border-radius:4px;margin:10px}.loading-track i{display:block;width:35%;height:100%;background:#4baf99;animation:load 1s ease-in-out infinite alternate}@keyframes load{to{transform:translateX(180%)}}.tutorial-steps{text-align:left;counter-reset:steps}.tutorial-steps p{padding-left:34px;position:relative}.tutorial-steps p:before{counter-increment:steps;content:counter(steps);position:absolute;left:0;top:2px;border-radius:50%;width:22px;height:22px;background:#e6eee4;display:grid;place-items:center;font-size:10px;font-weight:800}.tutorial-steps b{color:var(--ink)}@media(min-width:1600px){.hero{left:9%;top:20%;width:350px}.runner-caption{right:9%}.guest-strip{left:9%}.tour-strip{right:9%}}@media(max-height:800px) and (min-width:701px){.hero{top:17%;width:290px}h1{font-size:60px;margin:14px 0}.hero-copy{font-size:11px;margin-bottom:16px}.selected-course{padding:11px 15px}.primary-button{padding:13px 17px}.online-button{padding:10px}.tour-strip{bottom:100px;padding:13px 16px}.guest-strip{bottom:103px}.runner-caption{top:32%}.hero .eyebrow{font-size:8px}}@media(max-width:1100px){header nav{gap:0}.nav-item{font-size:8px;padding:10px}.hero{left:5%;width:285px}.runner-caption{right:4%;top:29%}.runner-caption h3{font-size:34px}.runner-caption p{max-width:120px;margin-left:auto}.tour-strip{left:38%;right:4%;gap:14px;padding:16px}.world-chapter small{font-size:6px}.map-button{display:none}.guest-strip{left:5%}.hud-bottom{left:20%;right:20%}}@media(max-width:700px){header{padding:18px 6%}.brand{font-size:19px;gap:8px}.brand small{font-size:6px;letter-spacing:3px}.brand-mark{width:35px;height:35px;font-size:27px}header nav{display:none}.wallet{font-size:11px;padding:8px 10px}.header-right{gap:6px}.icon-button{height:33px;width:33px;font-size:18px}.hero{top:15%;left:7%;width:225px}.eyebrow{font-size:7px;letter-spacing:1px}h1{font-size:49px;letter-spacing:-2.6px;margin:15px 0 12px}.hero-copy{font-size:10px;margin-bottom:17px}.selected-course{padding:12px}.selected-course h2{font-size:16px}.course-facts{gap:11px;font-size:7px}.course-kicker{font-size:7px}.primary-button{font-size:10px;padding:14px 15px;letter-spacing:.3px}.online-button{font-size:9px;padding:11px}.play-caption{font-size:8px}.runner-caption{right:6%;top:38%;max-width:100px}.runner-caption .mini-label{font-size:6px;letter-spacing:.7px}.runner-caption h3{font-size:25px;margin-top:5px}.runner-caption p{display:none}.runner-caption button{font-size:6px;padding:8px;line-height:1.5;margin-top:10px}.runner-caption button span{display:none}.tour-strip{left:7%;right:7%;bottom:66px;padding:13px;gap:13px;border-radius:13px}.tour-summary{min-width:60px}.tour-summary .mini-label{font-size:5px;letter-spacing:.5px}.tour-summary strong{font-size:21px}.tour-progress{width:55px}.world-chapters{gap:4px}.world-chapter{width:36px}.world-chapter .world-dot{width:26px;height:26px;border-radius:7px;font-size:8px}.world-chapter small{font-size:5px}.guest-strip{left:7%;bottom:172px}.guest-avatar{font-size:20px;padding:4px 7px}.guest-strip button{font-size:10px}.xp-label{top:42px;left:46px;font-size:7px}.controls{display:none}footer{padding:18px 6%}footer button,.build-label{font-size:6px}.hud-left{top:92px;left:6%}.hud-left h2{font-size:22px}.hud-eyebrow{font-size:7px;gap:6px}.hud-right{right:6%;top:177px;gap:6px}.race-clock{padding:10px 14px;min-width:120px}.race-clock b{font-size:27px}.race-clock small{font-size:7px}.hud-bottom{bottom:158px;left:6%;right:6%;gap:15px;padding:12px 15px}.speed{display:none}.position strong{font-size:22px}.hud-bottom .mini-label{font-size:6px}.progress-labels{font-size:8px}.racing header{padding:17px 6%}.racing footer{display:none}#online-status{top:70px;left:auto;right:6%;transform:none;font-size:7px;padding:5px 8px}#race-message{top:37%;left:8%;right:8%;font-size:17px}#countdown{font-size:115px}#level-intro{top:36%;font-size:13px}.level-grid{grid-template-columns:repeat(2,1fr)}dialog{padding:28px 22px}dialog.wide{max-height:88vh}dialog h2{font-size:28px}.level-card{min-height:105px}.map-world-header h3{font-size:22px}.map-tabs{gap:5px}.map-tab{font-size:9px;padding:8px}.crew-grid{gap:9px}.crew-card{padding:17px 12px}.crew-card b{font-size:19px}#lobby{background:linear-gradient(90deg,#b8e8eec7 0%,#b8e8ee45 65%,transparent)}}@media(max-height:730px) and (max-width:700px){.hero{top:13%;width:210px}h1{font-size:40px;margin:12px 0}.hero-copy{display:none}.selected-course{margin-top:13px}.play-caption{display:none}.guest-strip{bottom:155px}.tour-strip{bottom:55px}.online-button{margin-top:9px}.runner-caption{top:29%}}@media(pointer:coarse){#touch:not([hidden]){display:flex}.racing footer{display:none}.hud-bottom{bottom:158px}}
@media(min-width:1101px){.hero{width:420px}h1{font-size:70px;letter-spacing:-3.5px}.hero .selected-course,.hero .primary-button,.hero .online-button,.hero .play-caption{width:315px}}
@media(max-width:1100px) and (min-width:701px){h1{font-size:52px;letter-spacing:-2.8px}.hero{width:300px}.hero .selected-course,.hero .primary-button,.hero .online-button{width:285px}}
@media(max-width:700px){h1{font-size:42px;letter-spacing:-2px}}
.brand-mark>span{position:absolute;right:2px;top:2px}

.mechanic-preview{text-align:left;background:#e6eee7;border-left:4px solid #3aa58b;padding:14px 17px;border-radius:10px;margin:18px 0}.mechanic-preview small{display:block;font-size:9px;font-weight:800;letter-spacing:1px;color:#337c6b}.mechanic-preview b{display:block;margin-top:8px}.mechanic-preview p{font-size:12px;margin:5px 0}.save-note{font-size:11px}#graphics-notice{position:absolute;right:7%;top:35%;width:35%;padding:20px;border:1px solid #fff;background:#fffaf0;border-radius:14px;pointer-events:auto;font-size:14px}.no-webgl .runner-caption{display:none}.no-webgl .primary-button:disabled,.no-webgl .online-button:disabled{opacity:.6}.no-webgl #lobby{background:#b8e8ee}@media(max-width:700px){#graphics-notice{right:7%;top:auto;bottom:220px;width:86%;font-size:11px;padding:12px}}

.mode-switch{display:flex;background:#fff6;border-radius:8px;padding:3px;gap:3px;width:315px;max-width:100%}.mode-switch button{flex:1;background:none;color:var(--ink);padding:8px 5px;font-size:9px;font-weight:800;border-radius:6px}.mode-switch button.active{background:var(--ink);color:white}#mode-hint{font-size:9px;color:var(--muted);margin:6px 0 9px}.hero-copy{margin-bottom:12px}.customizer{margin:5vh 4% 5vh auto;width:520px;max-width:94vw;max-height:90vh;text-align:left}.customizer::backdrop{backdrop-filter:none;background:#173b4a33}.customizer h2{margin-bottom:8px}.customizer>p,.customizer p{font-size:12px}.custom-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.custom-grid .form-row{margin:8px 0}.custom-grid label{font-size:9px}.custom-grid select{font-size:12px;padding:10px}.custom-colors{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}.custom-colors fieldset{border:0;padding:0;margin:0}.custom-colors legend{font-size:9px;font-weight:800;margin-bottom:7px}.swatch{width:22px;height:22px;border-radius:50%;border:2px solid #fff;margin:2px;box-shadow:0 0 0 1px #bccac7}.swatch.selected{box-shadow:0 0 0 2px #233e4b;transform:scale(1.1)}.preset-row{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.preset-row button{font-size:10px;padding:8px;background:#e4ece6;border-radius:6px}.preset-row button:disabled{opacity:.5}.customizer summary{font-size:11px;margin:10px 0}.customizer .primary-button{margin-top:18px}@media(max-width:700px){.customizer{margin:auto 3% 2vh;width:94%;max-height:57vh;padding:20px}.customizer h2{font-size:25px}.customizer .custom-grid{gap:0 10px}.customizer .form-row{margin:5px 0}.hero{top:13%}.hero-copy{display:none}.mode-switch{width:225px}#mode-hint{max-width:225px;font-size:8px}.selected-course{margin-top:7px}.play-caption{margin-top:6px}.customizer::backdrop{background:#173b4a18}}

.customizer-open #lobby>*{visibility:hidden}.customizer-open #lobby{background:none}.customizer-open header,.customizer-open footer{visibility:hidden}.customizer::backdrop{background:#b8e8ee11}
/* Keep race information legible against water, mountains and every world. */
.hud-left{background:#fffaf0e8;border:1px solid #fff;border-radius:14px;padding:14px 18px;backdrop-filter:blur(8px)}
#join-code{text-transform:uppercase;letter-spacing:.25em;font-weight:750}
#join-room-form{margin-top:24px}
.primary-button:disabled{opacity:.45;transform:none}
@media(max-width:650px){.hud-left{padding:10px 12px;max-width:54%}}
/* A short desktop window used to pin the guest profile into the action area.
   Keep it below the lobby controls, with its XP line in normal flow. */
@media (min-width:701px) and (max-height:800px){
  .hero{top:10%}
  .hero-copy{display:none}
  .guest-strip{bottom:26px;align-items:flex-start}
  .guest-strip .xp-label{position:static;margin:5px 0 0 11px;align-self:flex-end}
  footer .controls{display:none}
}
@media (min-width:701px) and (max-height:520px){
  .hero{top:7%}
  .hero .eyebrow,.mode-switch,#mode-hint{display:none}
  h1{font-size:42px;margin:7px 0}
  .selected-course{padding:8px 12px;margin-bottom:7px}
  .selected-course h2{font-size:16px;margin:4px 0 6px}
  .primary-button{padding:11px 15px}
  .online-button{margin-top:7px;padding:8px 12px}
  .play-caption{display:none}
}
