:root{--ink:#3c4b43;--muted:#839084;--green:#547c66;--mint:#8ccbb3;--cream:#fbf8ee;--line:#e6e7db;--pink:#d791a3;--purple:#a798c9;--shadow:0 8px 32px #52643e08;font-family:ui-rounded,'Trebuchet MS',Arial,sans-serif;color:var(--ink);background:#f7f7ef}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overscroll-behavior:none}body{overflow:hidden;background:radial-gradient(ellipse at 0 0,#e7f1df 0,transparent 50%),radial-gradient(ellipse at 100% 90%,#f7eadb,transparent 50%),#f8f8f0}button,input,select{font:inherit}button{cursor:pointer;color:inherit;border:0;background:none;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #86b99b;outline-offset:3px}a{color:inherit;text-decoration:none}button,input,select{touch-action:manipulation}button{transition:transform .15s,background .15s,box-shadow .15s}button:not(:disabled):active{transform:translateY(2px)}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1,h2{font-family:Georgia,'Times New Roman',serif;font-weight:500;letter-spacing:-1px}h1{font-size:clamp(34px,4vw,58px);line-height:1.09}h2{font-size:28px}p{font-size:14px;line-height:1.65;color:#7a877b}.app{height:100dvh;max-width:1800px;margin:auto;padding:0 42px;display:flex;flex-direction:column;min-height:0}.topbar{height:92px;flex:0 0 92px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.brand{display:flex;align-items:center;gap:12px;font:700 22px/.94 Georgia,serif;letter-spacing:-.6px}.brand-bottom{display:block}.brand-star{color:#d79c5c;font-size:17px;margin-left:10px}.brand-mark{width:46px;height:46px;display:grid;grid-template:repeat(2,1fr)/repeat(2,1fr);gap:3px;transform:rotate(-6deg)}.brand-mark i{background:#8ccbb3;border:1px solid #649c83;border-radius:5px;box-shadow:inset 0 3px #ffffff5c,0 3px #6f998632}.brand-mark i:nth-child(2){background:#edcd7c;border-color:#c4a55c}.brand-mark i:nth-child(3){background:transparent;border:0;box-shadow:none}.brand-mark i:nth-child(4){background:#afa0d2;border-color:#9182b1}nav{display:flex;gap:28px;height:100%;align-items:center}nav button{height:100%;font-size:14px;color:#8b958a;position:relative}nav button.nav-active{color:var(--ink);font-weight:bold}nav button.nav-active:after{content:'';position:absolute;bottom:21px;height:2px;width:20px;background:var(--pink);left:calc(50% - 10px)}.top-actions{display:flex;align-items:center;gap:9px}.icon-button{border:1px solid #e1e5d7;border-radius:13px;width:39px;height:39px;font-size:20px;background:#fdfcf65e}.profile-button{height:43px;width:43px;padding:0}.profile-button svg,.avatar svg,.avatar-choice svg{width:100%;height:100%;display:block}#menuScreen{flex:1;overflow:auto;min-height:0;scrollbar-width:thin}.page{max-width:1440px;margin:0 auto;padding:40px 0 24px}.eyebrow{font-size:10px;font-weight:bold;letter-spacing:2.2px;color:#91a18d;display:block;margin-bottom:13px}.intro{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:30px;min-height:300px;margin-bottom:30px}.intro h1{margin-bottom:17px}.intro p{font-size:15px}.dot{color:#d49e68}.hero-road{position:relative;height:290px;max-width:620px}.hero-road canvas{width:100%;height:100%}.hero-sticker{position:absolute;right:17px;top:25px;transform:rotate(8deg);background:#f7df9a;border:3px solid #fff7d8;box-shadow:0 4px 0 #dfc58358;border-radius:22px;padding:14px 19px;font:15px/1.4 Georgia,serif;color:#8e7546}.hero-sticker b{font:700 13px Arial}.lobby-columns{display:grid;grid-template-columns:.8fr 1.35fr;gap:25px}.quick-card,.rooms-card{background:#fffdf6aa;border:1px solid var(--line);border-radius:24px;padding:27px 30px;box-shadow:var(--shadow)}.quick-card{background:linear-gradient(135deg,#eef3e4,#fbf6e7);position:relative;overflow:hidden}.quick-card p{margin:10px 0 20px}.quick-card>small{display:block;margin-top:14px;color:#92a087;font-size:10px}.primary,.soft{display:inline-flex;align-items:center;justify-content:center;gap:18px;border-radius:12px;padding:13px 21px;font-weight:bold;font-size:13px;white-space:nowrap}.primary{color:#fffaf0;background:#5f896d;border:1px solid #547b62;box-shadow:0 4px 0 #3d63483b}.primary:hover{background:#527f61}.primary span{margin-left:auto}.quick-card .primary{width:100%;margin-top:17px}.soft{background:#fffdf5;border:1px solid #e2e3d7;color:#6a7b6b;box-shadow:0 2px 0 #e9e7d84a;padding:10px 15px}.soft:hover{background:#f0f4e8}.track-options{display:flex;gap:7px}.track-option{flex:1;padding:10px 5px;border-radius:10px;border:1px solid #dce3d3;background:#ffffff4f;font-size:10px;min-width:0}.track-option b{display:block;margin-bottom:5px;font-size:17px}.track-option[aria-pressed=true]{background:#fffdf4;border-color:#a7bd98;box-shadow:0 0 0 2px #93b1841f}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px}.section-heading .eyebrow{margin-bottom:8px}.join-form{display:flex;gap:10px;border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:16px}input,select{border:1px solid #dfe3d6;border-radius:10px;padding:12px 14px;background:#fffef8;color:#5d705e;min-width:0}input::placeholder{color:#a5b09f}.join-form input{flex:1;font-size:12px}.room-list{max-height:240px;overflow:auto;min-height:148px}.empty{display:grid;justify-items:center;text-align:center;padding:25px 10px;color:#99a08f;font-size:13px;gap:7px}.empty b{font-size:25px;color:#bdc9ae}.empty small{font-size:11px}.room-row{display:flex;align-items:center;padding:12px 0;border-bottom:1px solid #eeeee3;gap:13px}.track-mini{width:49px;height:45px;border-radius:12px;display:grid;place-items:center;font-size:24px;background:#eaf0e0}.room-row .room-info{flex:1}.room-row b{font-size:14px}.room-row small{display:block;font-size:10px;color:#95a18e;margin-top:5px}.room-row>span{font-size:11px;color:#8d9988}.lobby-bottom{display:flex;justify-content:space-between;gap:15px;color:#98a18e;font-size:10px;margin-top:27px;padding:4px}.garage-showcase{display:flex;gap:50px;align-items:center;background:linear-gradient(130deg,#e6eedc,#f9efd9);border:1px solid #dee4d0;border-radius:28px;padding:30px;margin-bottom:35px}.garage-showcase>canvas{width:43%;height:240px}.garage-showcase h2{font-size:36px;margin-bottom:10px}.profile-stats{display:flex;gap:25px;margin-top:20px}.profile-stats b{font-size:23px;display:block;color:#637b5f}.profile-stats small{font-size:10px;color:#8d9a82}.achievement-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:20px}.achievement{background:#fffdf6;border:1px solid var(--line);border-radius:20px;padding:22px;opacity:.65}.achievement.unlocked{opacity:1;border-color:#cfdbb8;background:linear-gradient(125deg,#fff9e6,#f2f5e9)}.achievement>span{font-size:35px;display:block;margin-bottom:12px}.achievement b{font:20px Georgia}.achievement p{font-size:12px;margin-top:8px}.achievement small{font-size:10px;color:#8b9f83;display:block;margin-top:10px}.ranking-table{margin:25px 0 35px;border-radius:22px;border:1px solid var(--line);overflow:hidden;background:#fffdf6}.rank-row{display:grid;grid-template-columns:45px 47px 1fr 90px 70px;align-items:center;gap:15px;padding:15px 25px;border-bottom:1px solid #eceee2;font-size:13px}.rank-row.self{background:#edf3e4}.rank-row .avatar{width:40px;height:40px}.rank-row>strong{font-size:18px;color:#678765}.rank-row small{font-size:10px;color:#98a38e}.history-list{display:flex;flex-direction:column;gap:9px;margin-top:20px}.history-row{display:flex;gap:20px;padding:15px;background:#fffdf6;border:1px solid var(--line);border-radius:12px;font-size:12px}.history-row b{margin-right:auto}.history-row .positive{color:#5a9b75}.history-row .negative{color:#c17e7f}
#raceScreen{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}.race-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 0 16px;flex-shrink:0}.race-heading h1{font-size:26px}.race-heading .eyebrow{font-size:8px;margin-bottom:5px}.race-actions{display:flex;gap:8px}.race-actions .soft{font-size:11px;padding:9px 12px}.race-stage{display:grid;grid-template-columns:minmax(240px,.85fr) minmax(300px,1.1fr) minmax(210px,.7fr);gap:18px;flex:1;min-height:0;padding-bottom:18px}.board-panel{background:#fffdf7;border:1px solid #e2e6d8;border-radius:21px;padding:13px;min-height:0;display:flex;flex-direction:column;box-shadow:0 4px 0 #e3e7d659}.board-panel.own{border-color:#afc6a3;background:linear-gradient(150deg,#fffff8,#f0f5e6);box-shadow:0 4px 0 #bbcbb16b}.player-heading{display:flex;align-items:center;gap:8px;min-height:41px;margin-bottom:10px;flex-shrink:0}.avatar{height:37px;width:37px;flex-shrink:0}.avatar.frame-laurel{border:2px solid #d9bf7d;border-radius:50%}.avatar.frame-aurora{border-radius:50%;box-shadow:0 0 0 2px #b1c6d3,0 0 12px #bbcfcb}.player-info{min-width:0;flex:1}.player-info b{font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-info small{display:block;font-size:9px;color:#9aa88f;margin-top:4px}.player-heading>strong{font-size:24px;color:#74966c;letter-spacing:-1px}.player-heading>strong span{font-size:10px;letter-spacing:0;color:#a4af99;margin-left:3px}.board-layout{display:flex;gap:11px;flex:1;min-height:0;justify-content:center}.board-wrap{position:relative;height:100%;aspect-ratio:1/2;max-width:calc(100% - 67px);overflow:hidden;border-radius:12px;background:#e9eddf;border:1px solid #d5ddc8;touch-action:none;user-select:none}.board-wrap canvas{width:100%;height:100%;display:block}.piece-sidebar{width:53px;flex:0 0 53px;text-align:center;padding-top:9px}.piece-sidebar>span{font-size:7px;letter-spacing:1.3px;font-weight:bold;color:#96a18c;display:block;margin-bottom:5px}.piece-sidebar canvas{width:53px;display:block}.piece-sidebar #nextCanvas{height:164px;margin-bottom:18px}#holdCanvas{height:50px}.hold-button{margin-top:5px;border:1px solid #dfe6d4;border-radius:7px;padding:5px 10px;font-size:10px}.piece-sidebar>small{font-size:8px;line-height:1.5;display:block;color:#8d9a81;margin-top:16px}.controls{display:flex;gap:6px;flex-shrink:0;margin-top:12px;justify-content:center}.controls button{height:41px;flex:1;max-width:62px;font-size:22px;background:#fffdf5;border:1px solid #d7dfcd;border-radius:10px;box-shadow:0 3px 0 #d2dac85a;touch-action:none}.controls .drop-button{background:#8ba77a;color:#fffdf0;border-color:#749863;max-width:85px;display:flex;align-items:center;gap:5px;justify-content:center}.drop-button small{font:700 7px Arial}.keyboard-hint{font-size:7px;text-align:center;margin-top:10px;white-space:nowrap;color:#a2ac97}.board-overlay{position:absolute;inset:0;background:#f9f8eccc;backdrop-filter:blur(3px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:9px;color:#648263;z-index:2;padding:8px}.board-overlay>span{font-size:35px}.board-overlay b{font:19px Georgia}.board-overlay small{font-size:10px;letter-spacing:1px}.board-overlay#countdown b{font:75px Georgia;color:#5f855e}.track-panel{position:relative;display:flex;flex-direction:column;min-height:0;background:linear-gradient(145deg,#f1f5e8,#e6efdd);border:1px solid #dfe7d2;border-radius:24px;overflow:hidden;padding:20px 15px 10px}.track-heading{text-align:center;position:relative;flex-shrink:0}.track-heading h2{font-size:24px}.track-heading .eyebrow{font-size:7px;margin-bottom:6px}.track-heading #raceClock{font-size:10px;color:#8ea081;margin-top:8px}.track-canvas-wrap{flex:1;min-height:0;position:relative}.track-canvas-wrap canvas{width:100%;height:100%;display:block}.race-legend{display:grid;grid-template-columns:1fr 1fr;gap:7px;position:relative;z-index:1}.legend-driver{display:flex;align-items:center;gap:6px;font-size:8px;min-width:0;background:#fffdf2b3;border-radius:9px;padding:7px 9px}.legend-driver i{width:9px;height:9px;border-radius:3px;flex-shrink:0}.legend-driver span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.legend-driver b{margin-left:auto;font-size:10px}.track-note{text-align:center;font-size:8px;color:#93a187;line-height:1.6;padding:10px 0 0}.opponent-area{min-height:0;display:flex;flex-direction:column}.opponent-heading{display:flex;align-items:center;justify-content:space-between;height:22px;flex-shrink:0}.opponent-heading .eyebrow{font-size:7px;margin:0}.text-button{font-size:10px;color:#82947a;display:none}.opponent-boards{min-height:0;flex:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:10px}.opponent-boards>.board-panel:first-child{grid-column:1/-1}.opponent-boards .board-panel{padding:9px;border-radius:16px}.opponent-boards .player-heading{gap:5px;min-height:27px;margin-bottom:7px}.opponent-boards .avatar{width:24px;height:24px}.opponent-boards .player-info b{font-size:9px}.opponent-boards .player-info small{font-size:7px;margin-top:2px}.opponent-boards .player-heading>strong{font-size:16px}.opponent-boards .player-heading>strong span{font-size:7px}.opponent-boards .board-wrap{max-width:100%;align-self:center;height:100%;min-height:0}.opponent-boards .board-layout{min-height:0}.opponent-boards .board-panel.left{opacity:.45}.waiting-panel{text-align:center;margin:auto;padding:30px;width:min(600px,100%);background:#fffdf5;border:1px solid var(--line);border-radius:28px}.waiting-art{font-size:62px;margin:10px 0 20px}.waiting-panel h2{font-size:38px}.waiting-panel p{margin:15px 0}.waiting-players{display:flex;gap:10px;justify-content:center}.waiting-player{display:flex;align-items:center;gap:8px;padding:12px 15px;background:#eff3e6;border-radius:12px;font-size:12px;margin:10px 0}.waiting-player svg{width:35px}.waiting-panel .primary{margin-top:15px}.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:#45674e;color:#fff9e8;border-radius:13px;box-shadow:0 7px 35px #34493625;padding:12px 20px;font-size:12px;max-width:calc(100vw - 24px);z-index:30}.connection{position:fixed;bottom:8px;left:50%;transform:translateX(-50%);padding:10px 16px;background:#fff2cf;color:#9b7749;border:1px solid #e5d5a7;border-radius:12px;font-size:11px;z-index:25}
dialog{width:min(570px,calc(100vw - 24px));max-height:calc(100dvh - 30px);padding:34px;border:1px solid #e0e3d4;border-radius:25px;background:#fffdf5;color:var(--ink);box-shadow:0 25px 100px #33492725;overflow:auto}dialog::backdrop{background:#36463854;backdrop-filter:blur(5px)}dialog h2{font-size:34px;margin:4px 0 18px}dialog p{font-size:13px;margin:12px 0}dialog>small{display:block;font-size:10px;color:#97a08e;margin-top:18px;line-height:1.6}.close{position:absolute;right:15px;top:12px;width:32px;height:32px;font-size:24px;color:#96a18c}form label{display:block;font-size:11px;font-weight:bold;margin:18px 0}form label input,form label select{display:block;width:100%;margin-top:9px;font-size:14px}form>.primary,dialog>.primary{width:100%;margin-top:17px}.field-label{display:block;color:#94a18a;font-size:10px;margin:20px 0 10px}.avatar-options{display:flex;gap:6px}.avatar-choice{padding:3px;border:2px solid transparent;border-radius:50%;min-width:0;width:12.5%;aspect-ratio:1}.avatar-choice[aria-pressed=true]{border-color:#85a979;background:#eef3df}.hue-options{display:flex;gap:12px}.hue-options button{width:30px;height:30px;border-radius:50%;border:3px solid #fffdf5;box-shadow:0 0 0 1px #dce2d2}.hue-options button[aria-pressed=true]{box-shadow:0 0 0 2px #6e9461}.help-steps>div{display:flex;gap:17px;border-top:1px solid #e8eadd;padding:13px 0;align-items:center}.help-steps b{color:#c2d0b1;font:30px Georgia}.help-steps p{margin:0}.result-flag{display:block;text-align:center;font-size:55px;margin:5px 0 18px}#resultDialog{text-align:center}#podium{margin:20px 0;display:flex;flex-direction:column;gap:8px}.podium-row{display:flex;align-items:center;gap:12px;background:#f0f4e7;border-radius:12px;padding:11px;font-size:13px;text-align:left}.podium-row .avatar{width:32px;height:32px}.podium-row b{margin-left:auto}.podium-row small{font-size:9px;color:#96a28e}#resultReward{padding:15px;border-radius:14px;background:#f5edcf;color:#998142;font-size:16px}.dialog-actions{display:flex;gap:12px;margin-top:20px}.dialog-actions button{flex:1}.shop-dialog{width:min(1050px,calc(100vw - 24px))}.shop-wallet{display:inline-block;border-radius:10px;padding:9px 12px;background:#f4ebcf;color:#947d47;font-size:12px;font-weight:bold}.shop-tabs{display:flex;gap:8px;margin:20px 0}.shop-tabs button{padding:9px 15px;border-radius:10px;border:1px solid var(--line);font-size:12px}.shop-tabs button.active{background:#eaf0df;color:#6b875e;border-color:#bccaac}.shop-layout{display:grid;grid-template-columns:260px 1fr;gap:24px}.shop-preview{background:#eff3e4;padding:15px;border-radius:20px;text-align:center}.shop-preview canvas{width:100%;height:190px}.shop-preview h3{font:23px Georgia;margin-top:4px}.shop-preview p{font-size:11px}.shop-preview button{font-size:10px;padding:10px;margin-top:12px}.shop-products{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.shop-product{border:1px solid var(--line);border-radius:16px;padding:12px;display:flex;flex-direction:column}.shop-product.selected{border-color:#9fb68f;box-shadow:0 0 0 2px #b4c3a42f}.product-art{height:100px;background:#f2f3e8;border-radius:11px;padding:0}.product-art canvas{width:100%;height:100%}.shop-product h3{font:18px Georgia;margin:12px 0 7px}.shop-product p{font-size:10px;line-height:1.5;flex:1}.shop-product small{display:block;font-size:8px;color:#93a18a;margin:10px 0}.shop-product .soft{font-size:10px;width:100%;padding:9px 7px}#shopMessage{font-size:11px;color:#689160;min-height:18px}.error{color:#b76e6b!important}
@media(min-width:1600px){.race-stage{grid-template-columns:minmax(340px,.9fr) minmax(400px,1.1fr) minmax(330px,.85fr)}.player-info b{font-size:14px}.opponent-boards .player-info b{font-size:11px}.opponent-boards .player-info small{font-size:9px}.opponent-boards .avatar{width:29px;height:29px}}
@media(max-width:1050px){.app{padding:0 20px}.topbar{height:76px;flex-basis:76px}.race-stage{grid-template-columns:minmax(210px,1fr) minmax(240px,1fr);gap:12px}.opponent-area{position:fixed;right:15px;top:145px;width:220px;bottom:70px;background:#fffdf6;border:1px solid #d5dfcb;padding:10px;border-radius:18px;box-shadow:0 20px 80px #39502c38;z-index:9;display:none}.opponent-area.open{display:flex}.text-button{display:block}.race-heading .eyebrow{margin-bottom:3px}.track-panel .opponent-trigger{display:block}.lobby-columns{grid-template-columns:1fr 1.3fr}.quick-card,.rooms-card{padding:24px}.intro{min-height:270px;gap:15px}.hero-road{height:240px}.lobby-bottom{font-size:8px}.shop-products{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.app{padding:0 13px}.topbar{height:68px;flex-basis:68px;gap:10px}.brand{font-size:17px;gap:8px}.brand-mark{width:32px;height:32px;gap:2px}.brand-star{font-size:12px;margin-left:5px}nav{gap:14px;position:fixed;bottom:0;left:0;right:0;height:59px;z-index:5;background:#fbfcf2ed;backdrop-filter:blur(10px);border-top:1px solid #e4e8d9;justify-content:space-around;padding-bottom:env(safe-area-inset-bottom)}nav button{font-size:12px;flex:1}nav button.nav-active:after{bottom:9px}.top-actions{gap:5px}.icon-button{width:31px;height:31px;border-radius:9px;font-size:17px}.profile-button{width:35px;height:35px}.page{padding:25px 0 80px}.intro{display:block;position:relative;margin-bottom:20px;min-height:0}.intro h1{font-size:39px;max-width:340px}.intro p{font-size:12px;max-width:330px}.intro .eyebrow{font-size:8px;letter-spacing:1.6px}.desktop-br{display:none}.hero-road{height:160px;margin-top:10px}.hero-sticker{font-size:11px;top:10px;right:20px;padding:9px 11px;border-radius:16px}.hero-sticker b{font-size:10px}.lobby-columns{display:flex;flex-direction:column;gap:18px}.quick-card,.rooms-card{padding:23px 21px;border-radius:20px}.quick-card h2,.rooms-card h2{font-size:25px}.quick-card p{font-size:12px;margin-bottom:14px}.quick-card .eyebrow,.rooms-card .eyebrow{font-size:8px;letter-spacing:1.4px}.quick-card .track-options{margin-top:5px}.room-list{min-height:110px;max-height:260px}.lobby-bottom{flex-wrap:wrap;gap:14px;margin:20px 7px}.lobby-bottom span{width:45%;font-size:8px}.section-heading{gap:10px}.section-heading .soft{font-size:10px;padding:9px}.join-form{gap:5px}.join-form .soft{font-size:10px;padding:9px}.race-heading{padding:10px 0;gap:5px;min-height:60px}.race-heading h1{font-size:19px}.race-heading .eyebrow{font-size:6px;letter-spacing:1.4px}.race-actions{gap:5px}.race-actions .soft{padding:7px;font-size:8px;border-radius:8px}#roomCode{display:none}.race-stage{display:flex;flex-direction:column;gap:8px;padding-bottom:8px}.track-panel{order:-1;flex:0 0 clamp(108px,18dvh,156px);border-radius:15px;padding:4px 9px}.track-heading h2{font:13px Georgia}.track-heading .eyebrow,.track-note{display:none}.track-heading #raceClock{position:absolute;right:3px;top:0;font-size:8px;margin:0}.track-canvas-wrap{min-height:0}.race-legend{display:flex;gap:4px}.legend-driver{padding:4px;flex:1;font-size:6px;gap:3px;border-radius:5px}.legend-driver i{width:6px;height:6px}.legend-driver b{font-size:8px}.own{flex:1;padding:9px 11px 8px!important;min-height:0;max-height:100%;border-radius:15px}.player-heading{min-height:30px;margin-bottom:7px}.avatar{width:29px;height:29px}.player-info b{font-size:10px}.player-info small{font-size:7px}.player-heading>strong{font-size:20px}.player-heading>strong span{font-size:8px}.board-layout{gap:10px;justify-content:center}.board-wrap{border-radius:8px;max-width:calc(100% - 60px)}.piece-sidebar{width:45px;flex-basis:45px}.piece-sidebar canvas{width:45px}.piece-sidebar #nextCanvas{height:126px;margin-bottom:10px}.piece-sidebar>span{font-size:6px}.piece-sidebar>small{font-size:7px;margin-top:10px}.controls{margin-top:8px;gap:7px}.controls button{height:39px;max-width:64px;border-radius:9px;font-size:21px}.controls .drop-button{max-width:84px}.keyboard-hint{display:none}.race-mode nav{display:none}.race-mode .topbar{height:55px;flex-basis:55px}.race-mode #menu{display:none}.race-mode .brand{font-size:15px}.race-mode .brand-mark{width:28px;height:28px}.race-mode .icon-button{width:28px;height:28px}.race-mode .profile-button{width:29px;height:29px}.opponent-area{top:122px;right:10px;bottom:80px;width:210px}.waiting-panel{padding:24px 18px}.waiting-panel h2{font-size:30px}.waiting-panel p{font-size:12px}.waiting-art{font-size:45px;margin-top:0}.waiting-player{font-size:10px;padding:8px;gap:5px}.waiting-player svg{width:28px}.garage-showcase{padding:18px;gap:10px;flex-direction:column;margin-bottom:25px}.garage-showcase>canvas{width:100%;height:150px}.garage-showcase>div{width:100%;text-align:center}.garage-showcase h2{font-size:28px}.profile-stats{justify-content:center;gap:25px}.achievement-grid{grid-template-columns:1fr 1fr;gap:10px}.achievement{padding:16px}.achievement b{font-size:17px}.achievement p{font-size:10px}.achievement small{font-size:8px}.rank-row{padding:12px 10px;grid-template-columns:23px 32px 1fr 50px 35px;gap:7px;font-size:11px}.rank-row .avatar{width:29px;height:29px}.rank-row>strong{font-size:15px}.rank-row small{font-size:8px}.history-row{font-size:10px;gap:9px;padding:12px}.page>.section-heading{align-items:flex-start}.page>.section-heading h1{font-size:32px}.page>.section-heading .primary{font-size:10px;padding:11px;white-space:normal}dialog{padding:28px 21px;border-radius:20px}dialog h2{font-size:29px}dialog .eyebrow{font-size:8px}.shop-layout{grid-template-columns:1fr}.shop-preview{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:11px}.shop-preview canvas{width:100px;height:85px}.shop-preview h3{flex:1;font-size:20px;margin:0}.shop-preview p{display:none}.shop-preview button{margin:0;font-size:8px;padding:8px}.shop-tabs{gap:5px;margin:15px 0}.shop-tabs button{padding:9px 10px;font-size:10px;flex:1}.shop-products{gap:8px;grid-template-columns:1fr 1fr}.shop-product{padding:10px}.shop-product h3{font-size:16px}.product-art{height:85px}.shop-wallet{font-size:10px}.toast{font-size:10px;bottom:15px;padding:10px 14px}.connection{font-size:9px;bottom:5px;width:90%;text-align:center}}
@media(max-height:650px) and (min-width:641px){.topbar{height:55px;flex-basis:55px}.brand{font-size:17px}.brand-mark{width:32px;height:32px}.race-heading{padding:8px 0}.race-heading h1{font-size:20px}.race-stage{padding-bottom:8px}.board-panel{padding:8px;border-radius:14px}.player-heading{min-height:27px;margin-bottom:5px}.avatar{width:25px;height:25px}.controls button{height:29px;font-size:17px}.controls{margin-top:6px}.keyboard-hint{display:none}.piece-sidebar #nextCanvas{height:100px;margin-bottom:5px}.piece-sidebar>small{margin-top:5px}.piece-sidebar>span{font-size:6px}.track-panel{padding:10px}.track-heading h2{font-size:20px}.track-heading .eyebrow{margin-bottom:2px}.track-note{display:none}.opponent-area{top:104px;bottom:15px}.legend-driver{padding:5px}.board-overlay#countdown b{font-size:45px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.opponents-button{display:none;position:absolute;left:0;top:0;font-size:8px;color:#778f70;padding:3px}.opponent-boards[data-count="2"]{grid-template-columns:1fr}.opponent-boards[data-count="2"]>.board-panel:first-child{grid-column:auto}.board-layout{align-items:center}.board-wrap{flex-shrink:0}.waiting-player .avatar{display:block}.race-mode #profileDialog{display:none}.shop-preview canvas{touch-action:none}
@media(max-width:1050px){.opponents-button{display:block}}
@media(max-width:360px){.drop-button small{display:none}.controls button{min-width:0}.race-mode .topbar{height:48px;flex-basis:48px}.race-heading{min-height:53px}.track-panel{flex-basis:100px}}

.platform-entry{position:fixed;z-index:40;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:28px;background:#f8f6ec}.platform-entry>span{font-size:54px;margin-bottom:24px}.platform-entry h2{font-size:34px}.platform-entry p{max-width:470px;margin:18px 0 25px}.platform-entry button{max-width:300px}

.language-switch{display:flex;align-items:center;flex-shrink:0;gap:2px;padding:3px;border-radius:10px;background:#e8eddf}.language-switch a{font:700 11px Arial,sans-serif;text-decoration:none;padding:6px 7px;color:#5e7059;border-radius:7px}.language-switch a[aria-current="page"]{background:#fffdf4;color:#314c33;box-shadow:0 1px 3px #65795622}.language-switch a:focus-visible{outline:2px solid #4f8155;outline-offset:1px}.race-mode .language-switch{display:none}@media(max-width:640px){.top-actions{gap:5px}.language-switch a{font-size:10px;padding:5px}.language-switch{padding:2px}}

/* Toy circuit · one visual system for the game, garage and every dialog. */
:root{--ink:#24394d;--muted:#5b7182;--green:#326cb5;--mint:#58c9ce;--cream:#fffdf5;--line:#d6e1e5;--pink:#f17e69;--purple:#8e7bd8;--shadow:0 5px 0 #cedce080;font:16px/1.5 system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink)}
html,body{width:100%;height:100%;overflow:hidden}body{background:radial-gradient(ellipse at 80% 0,#def0ed,transparent 55%),#f2f5ee}button,input,select{font:inherit}button{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #2c83c4;outline-offset:3px}button{display:inline-flex;align-items:center;justify-content:center;gap:8px}button:disabled{opacity:.53;cursor:default}.rally-icon{display:inline-block;width:23px;height:23px;min-width:20px;flex-shrink:0;vertical-align:middle;overflow:visible}.rally-icon path{vector-effect:non-scaling-stroke}.app{max-width:1640px;padding:0 28px}.topbar{height:86px;flex-basis:86px;gap:22px;border-bottom:1px solid #d3dfe2}.brand{font:800 23px/1 system-ui,sans-serif;color:#263d54;letter-spacing:-.6px;gap:12px}.brand-bottom{color:#367e8a;margin-top:3px}.brand-star{color:#d28132;margin-left:7px}.brand-star .rally-icon{width:17px;height:17px;min-width:0}.brand-mark{width:43px;height:43px;gap:3px;transform:rotate(-7deg)}.brand-mark i{border-radius:5px;border:1px solid #27465d30;box-shadow:inset 0 3px #ffffff5c,0 3px #294b6426}.brand-mark i:nth-child(1){background:#53bfc4}.brand-mark i:nth-child(2){background:#efba46}.brand-mark i:nth-child(3){background:#8e7ad2}nav{gap:8px}nav button{font-size:16px;font-weight:700;padding:12px 19px;color:#5b7180;border-radius:12px;min-height:46px}nav button.nav-active{background:#e0edee;color:#2c6172}nav button.nav-active:after{display:none}.top-actions{gap:9px}.icon-button,.profile-button{width:44px;height:44px;border-radius:13px;border:1px solid #cbdadf;background:#fffdf6;color:#385d76}.icon-button:hover{background:#e6eff3}.profile-button{padding:3px;border-radius:50%}.eyebrow{font:750 12px/1.5 system-ui,sans-serif;letter-spacing:1.4px;color:#527b8c;margin-bottom:10px}.page{padding:32px 0 40px}h1,h2,h3,.intro h1,.section-heading h1,.section-heading h2,.track-heading h2,.race-heading h1,.garage-showcase h2{font-family:system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;font-weight:800;letter-spacing:-.6px}.intro{min-height:285px;margin-bottom:25px;gap:35px}.intro h1{font-size:clamp(38px,3.8vw,57px);line-height:1.13;margin:12px 0 20px}.intro p{font-size:17px;line-height:1.7;color:#546d80}.intro .dot{color:#e58c44}.hero-road{height:275px;border:1px solid #b7d2d7;border-radius:28px;box-shadow:0 5px 0 #c7ded5;overflow:hidden}.hero-sticker{background:#fff4cb;color:#8e612b;border:2px solid #e5bf71;padding:14px 20px;font-size:19px;border-radius:17px;box-shadow:0 4px 0 #b7954730;transform:rotate(5deg);top:14px;right:16px}.hero-sticker b{font-size:13px;color:#846329}.lobby-columns{grid-template-columns:minmax(320px,.9fr) minmax(0,1.3fr);gap:24px}.quick-card,.rooms-card{padding:30px;border:1px solid #cfdee0;background:#fffdf6;border-radius:25px;box-shadow:var(--shadow)}.quick-card h2,.rooms-card h2{font-size:29px;line-height:1.2;margin:5px 0 15px}.quick-card p,.rooms-card p{font-size:16px;color:#5c7280;line-height:1.65}.primary,.soft{min-height:46px;font-size:16px;font-weight:750;border-radius:12px;padding:12px 18px;line-height:1.4}.primary{background:linear-gradient(180deg,#ed9656,#d8793d);color:#fffef5;border:1px solid #bf6a33;box-shadow:0 4px 0 #9a522e}.primary:hover{background:#de8346;transform:translateY(-1px)}.primary:active{transform:translateY(2px);box-shadow:0 1px 0 #9a522e}.soft{background:#eef3f3;border:1px solid #cedcdf;color:#365d77;box-shadow:0 2px 0 #d9e3e2}.soft:hover{background:#e2edef}#quickPlay{width:100%;justify-content:space-between;font-size:18px;padding:15px 20px;margin-top:18px}.quick-card>small{font-size:13px;line-height:1.6;color:#607683;display:block;margin-top:14px}.track-options{gap:8px;margin-top:16px}.track-option{font-size:14px;padding:11px 10px;gap:7px;min-height:46px;color:#4b687c;background:#f4f6ee;border-color:#d2dfd8;line-height:1.4;flex:1}.track-option b{display:flex;color:#39818d}.track-option[aria-pressed=true]{border-color:#3a94a1;background:#e2f1ec;box-shadow:inset 0 -3px #9ccfc0}.track-option .rally-icon{width:22px;height:22px}.section-heading{gap:15px;align-items:center}.section-heading .soft{font-size:15px}.join-form{gap:9px;margin:20px 0}.join-form input,input,select{font-size:16px;min-height:46px;border-radius:10px;background:#fffefa;border:1px solid #bdcfd6;color:#274456;padding:10px 13px}.join-form input{min-width:0}.join-form .soft{font-size:15px}.room-list{min-height:170px;max-height:310px}.room-row{border-color:#d5e2e0;padding:15px 0;gap:14px;font-size:15px}.room-info{min-width:0}.room-info b{font-size:17px;overflow-wrap:anywhere}.room-info small{font-size:13px;color:#617a87}.track-mini{width:38px;height:38px;background:#e3f0eb;border:1px solid #bbd3cd;border-radius:11px;color:#38818a;display:grid;place-items:center}.room-row .soft{min-height:44px;font-size:14px;padding:10px 13px}.empty{padding:25px 12px;color:#526c7b}.empty>b{display:grid;place-items:center;margin-bottom:14px}.empty>b .rally-icon{width:44px;height:44px;color:#8daab4}.empty>span{font-size:18px;font-weight:700}.empty small{font-size:14px;line-height:1.7}.lobby-bottom{gap:20px;margin:27px 4px;font-size:14px;color:#4e6b7a}.lobby-bottom span{display:flex;align-items:center;gap:8px}.lobby-bottom i{font-style:normal;color:#508594}.lobby-bottom .rally-icon{width:20px;height:20px}
/* Large, high-contrast playfield first; the circuit is progress, never an overlay. */
.race-heading{min-height:77px;padding:13px 0;gap:15px}.race-heading h1{font-size:26px;line-height:1.2;margin:3px 0}.race-heading .eyebrow{font-size:11px;letter-spacing:1.1px;margin:0}.race-actions{gap:9px}.race-actions .soft{min-height:43px;font-size:14px;padding:10px 13px}.race-stage{grid-template-columns:minmax(330px,.95fr) minmax(350px,1.15fr) minmax(275px,.85fr);gap:18px;padding-bottom:18px}.board-panel{border:1px solid #bbcfd7;border-radius:22px;padding:17px;background:#fffdf6;box-shadow:0 4px 0 #cadbdf}.own{border:2px solid #5896ac;background:#fcfdf5}.player-heading{gap:10px;min-height:43px;margin-bottom:12px}.avatar{width:40px;height:40px;flex-shrink:0}.player-info{min-width:0}.player-info b{font-size:15px;line-height:1.35;color:#28455a;overflow-wrap:anywhere}.player-info small{font-size:12px;color:#5a7381;margin-top:3px}.player-heading>strong{font-size:28px;color:#347f8d;white-space:nowrap}.player-heading>strong span{font-size:13px;color:#67818c;margin-left:2px}.board-layout{gap:14px;min-height:0}.board-wrap{border:2px solid #31556b;background:#182e43;border-radius:10px;overflow:hidden;box-shadow:inset 0 0 0 1px #99b9c6}.piece-sidebar{width:57px;flex-basis:57px;color:#44677d}.piece-sidebar>span{font-size:11px;font-weight:750;letter-spacing:.8px;color:#536f80}.piece-sidebar canvas{width:55px}.piece-sidebar #nextCanvas{height:150px;margin:6px 0 16px}.piece-sidebar>small{font-size:12px;color:#456b7f;line-height:1.4;margin-top:14px}.hold-button{min-height:42px;width:48px;margin-top:8px;border:1px solid #c5d9db;border-radius:10px;background:#eaf2f0;color:#457183}.controls{gap:8px;margin-top:13px}.controls button{min-width:0;min-height:44px;height:46px;max-width:67px;border:1px solid #bccfd5;background:#f5f6ed;color:#315670;border-radius:11px;box-shadow:0 3px 0 #c8d8dc;padding:8px;flex:1}.controls button:active{transform:translateY(2px);box-shadow:0 1px 0 #c8d8dc;background:#dfeef0}.controls .drop-button{max-width:95px;background:#347b9a;border-color:#2a617c;color:#fff;gap:4px}.drop-button small{font-size:10px;letter-spacing:.4px}.keyboard-hint{font-size:12px;line-height:1.6;color:#526f80;margin-top:12px}.track-panel{border:1px solid #b7d1d2;background:#e1ede4;border-radius:23px;box-shadow:0 4px 0 #c6dad2;padding:18px}.track-heading{position:relative;text-align:center;flex-shrink:0}.track-heading h2{font-size:25px;line-height:1.25;color:#2d5366;margin:4px 0 7px}.track-heading .eyebrow{font-size:11px;letter-spacing:1px;margin-bottom:6px}#raceClock{font-size:14px;color:#4e7180;font-weight:750}.track-canvas-wrap{border-radius:16px;overflow:hidden;border:1px solid #b4cbc4}.race-legend{gap:6px;margin-top:10px}.legend-driver{font-size:12px;gap:6px;border:1px solid #c8d8d1;background:#fffdf2;padding:7px 8px;border-radius:8px;color:#38586a;min-width:0}.legend-driver>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.legend-driver i{width:9px;height:9px;flex-shrink:0}.legend-driver b{font-size:14px;color:#32566b}.track-note{font-size:13px;color:#536f7a;line-height:1.5;margin-top:10px}.opponent-heading .eyebrow{font-size:11px;color:#5d7b89}.opponent-boards{gap:12px}.opponent-boards .board-panel{padding:12px;border-radius:18px;min-height:0}.opponent-boards .player-heading{gap:6px;min-height:34px;margin-bottom:8px}.opponent-boards .avatar{width:31px;height:31px}.opponent-boards .player-info b{font-size:12px;line-height:1.4}.opponent-boards .player-info small{font-size:11px}.opponent-boards .player-heading>strong{font-size:21px}.opponent-boards .player-heading>strong span{font-size:11px}.opponent-boards .board-wrap{border-width:1px;border-radius:7px}.opponents-button,.text-button{font:700 13px/1.4 system-ui,sans-serif;min-height:40px;color:#36697e;padding:6px}.board-overlay{background:#1e3b51e8;color:#fff6d4;padding:16px;text-align:center}.board-overlay>span .rally-icon{width:39px;height:39px}.board-overlay b{font:800 23px/1.3 system-ui,sans-serif}.board-overlay small{font-size:14px;color:#d2e7eb}.board-overlay#countdown b{font:800 65px/1 system-ui,sans-serif}.board-overlay#countdown small{font-size:12px;letter-spacing:1px}.waiting-panel{border:1px solid #c8d9db;border-radius:26px;background:#fffdf6;padding:30px;overflow:auto}.waiting-art{margin:0 0 18px;color:#528c9b}.waiting-art .rally-icon{width:66px;height:66px}.waiting-panel h2{font-size:34px}.waiting-panel p{font-size:16px;color:#5c7584}.waiting-player{font-size:16px;padding:14px;border:1px solid #d3e1df;background:#f0f5ed;border-radius:12px}.waiting-player small{font-size:13px;color:#617f8b}.waiting-player .avatar{width:38px;height:38px}
/* Garage, rankings and shop share the same readable card language. */
.page>.section-heading h1,#rankingView>h1{font-size:37px;line-height:1.2}.page>.section-heading p,#rankingView>p{font-size:16px;color:#587281}.garage-showcase{padding:28px;background:#e8f1eb;border:1px solid #c4d9d3;border-radius:25px;gap:30px;box-shadow:var(--shadow)}.garage-showcase h2{font-size:35px}.garage-showcase p{font-size:16px;line-height:1.65;color:#587180}.profile-stats{gap:26px}.profile-stats b{font-size:27px;color:#2e687c}.profile-stats small{font-size:13px;color:#5b7684}.achievement-grid{gap:16px}.achievement{border:1px solid #cbdce0;background:#fffdf6;border-radius:20px;padding:23px;opacity:1}.achievement>span{color:#7196a6;background:#e9f1ed;border-radius:14px;display:grid;place-items:center;width:52px;height:52px;margin-bottom:16px}.achievement>span .rally-icon{width:31px;height:31px}.achievement.unlocked{border-color:#6ca69a;background:#f4f8ed}.achievement.unlocked>span{background:#d9eedd;color:#4f8b72}.achievement b{font:750 21px/1.3 system-ui,sans-serif}.achievement p{font-size:15px;line-height:1.65;color:#5b7482}.achievement small{font-size:13px;color:#5e7c85}.ranking-table{border-color:#ccdbdf;background:#fffdf5;border-radius:20px;overflow:hidden}.rank-row{font-size:16px;padding:17px 20px;gap:15px;grid-template-columns:35px 42px minmax(0,1fr) 75px 60px}.rank-row.self{background:#e7f2ed}.rank-row>strong{font-size:23px;color:#32647c}.rank-row small{font-size:13px;color:#607986}.rank-row .avatar{width:40px;height:40px}.rank-row>div{min-width:0;overflow-wrap:anywhere}.rank-row .rally-icon{width:20px;height:20px}.history-row{font-size:15px;padding:17px 12px;gap:15px;color:#4c6b7c;flex-wrap:wrap}.history-row b{color:#315267}.positive{color:#267260}.negative{color:#a6544c}
/* Native dialog element, original game UI: focus/Escape and visible errors. */
dialog{padding:30px;border:1px solid #bfcfd6;border-radius:24px;background:#fffdf6;color:#29475b;max-height:calc(100dvh - 24px);overscroll-behavior:contain;scrollbar-width:thin}dialog::backdrop{background:#19334a80;backdrop-filter:blur(4px)}dialog h2{font:800 31px/1.2 system-ui,sans-serif;letter-spacing:-.5px;margin:6px 35px 22px 0}dialog p{font-size:16px;line-height:1.7;color:#546e7e;margin:15px 0}dialog>small{font-size:13px;line-height:1.7;color:#607c89}.close{width:44px;height:44px;border:1px solid #cfdee0;background:#edf3ef;color:#486f83;right:13px;top:13px;border-radius:50%;padding:10px}form label{font-size:15px;font-weight:700;margin:20px 0}form label input,form label select{font-size:16px;margin-top:9px}.field-label{font-size:14px;font-weight:700;color:#5e7b8a;margin:23px 0 13px}.avatar-options{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.avatar-choice{width:auto;max-width:62px;aspect-ratio:1;border-radius:50%;padding:5px}.hue-options{gap:13px;flex-wrap:wrap}.hue-options button{width:44px;height:44px;border-width:5px}.help-steps>div{padding:17px 0;gap:18px;border-color:#d2e0df}.help-steps b{font:800 28px/1 system-ui,sans-serif;color:#47849a}.help-steps p{font-size:16px;line-height:1.65}.result-flag{color:#be8535;width:78px;height:78px;border:1px solid #e0c78e;background:#fff2c9;border-radius:23px;display:grid;place-items:center;margin:2px auto 22px}.result-flag .rally-icon{width:45px;height:45px}#resultDialog h2{margin-right:0;font-size:34px}.podium-row{font-size:16px;border:1px solid #cedddf;border-radius:13px;padding:13px;gap:10px}.podium-row small{font-size:13px;color:#637f8c}.podium-row .avatar{width:36px;height:36px}#resultReward{font-size:17px;color:#806235;background:#fbefce;border:1px solid #e5cd93}.dialog-actions{gap:12px}.dialog-actions button{min-height:48px;font-size:16px}.dialog-feedback{background:#e5f1ec;border:1px solid #b6d3c5;color:#345f6d;border-radius:12px;padding:13px 15px;font-size:15px;line-height:1.6}.dialog-feedback.error,.toast.error{background:#fff0df;color:#8d3e36!important;border:1px solid #dfa99c}.toast{font-size:15px;padding:14px 20px;background:#2a516a;border:1px solid #4b7d95;box-shadow:0 5px 20px #1e3a4d30;max-width:calc(100vw - 26px)}.connection{font-size:15px;background:#fff1cd;color:#74572f;border:1px solid #debd7c;padding:12px 18px;max-width:calc(100vw - 24px)}.platform-entry{background:#f1f5ed;color:#29485d}.platform-entry>span .rally-icon{width:65px;height:65px}.platform-entry h2{font:800 33px/1.2 system-ui,sans-serif}.platform-entry p{font-size:17px;line-height:1.7}.shop-dialog{width:min(1100px,calc(100vw - 24px))}.shop-wallet{font-size:16px;background:#fff0c8;border:1px solid #dfc68a;color:#88632a;padding:10px 14px}.shop-tabs{gap:8px;flex-wrap:wrap;margin:23px 0}.shop-tabs button{font-size:15px;font-weight:700;min-height:44px;padding:10px 17px;border:1px solid #c7dadd;background:#eff4f0;border-radius:11px;color:#496d7e}.shop-tabs button.active{background:#dbeee9;border-color:#78afa6;color:#2d686d}.shop-layout{grid-template-columns:260px minmax(0,1fr);gap:24px}.shop-preview{padding:20px;background:#e7f1eb;border:1px solid #c4d8d3;border-radius:20px}.shop-preview h3{font:800 25px/1.3 system-ui,sans-serif}.shop-preview p{font-size:15px}.shop-preview button{font-size:14px;min-height:44px;padding:10px 12px}.shop-products{grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.shop-product{padding:16px;border-color:#cbdcde;border-radius:18px;background:#fffdf7}.shop-product.selected{border-color:#59a4ad;box-shadow:0 0 0 2px #9bc9c740}.product-art{height:130px;border:1px solid #c9ded5;background:#e2eddd;border-radius:12px}.shop-product h3{font:750 21px/1.3 system-ui,sans-serif;margin:14px 0 9px;overflow-wrap:anywhere}.shop-product p{font-size:15px;line-height:1.65}.shop-product small{font-size:12px;color:#5f7a86;line-height:1.5}.shop-product .soft{font-size:15px;padding:11px 8px;min-height:44px}#shopMessage{font-size:15px;line-height:1.6;color:#4f797f}.shop-preview canvas{width:100%;height:190px}
@media(min-width:1700px){.race-stage{grid-template-columns:minmax(370px,1fr) minmax(450px,1.15fr) minmax(300px,.85fr)}.player-info b{font-size:17px}.player-info small{font-size:13px}.opponent-boards .player-info b{font-size:14px}.opponent-boards .player-info small{font-size:12px}}
@media(max-width:1150px){.topbar{gap:13px}.brand{font-size:21px}nav button{padding:11px 13px}.app{padding-inline:20px}.race-stage{grid-template-columns:minmax(290px,1fr) minmax(310px,1fr);gap:16px}.opponent-area{width:300px;right:14px;top:155px;bottom:25px;padding:16px;border-color:#b7d0d6;border-radius:20px;background:#fffdf6;overflow:auto;box-shadow:0 12px 40px #193e5d30;display:none}.opponent-area.open{display:flex}.opponent-area .opponent-boards{min-height:420px}.opponents-button{display:flex}.opponents-button,.text-button{font-size:14px}.lobby-columns{grid-template-columns:minmax(300px,.95fr) minmax(0,1.15fr)}.quick-card,.rooms-card{padding:24px}.track-option{flex-direction:column;font-size:14px}.shop-products{grid-template-columns:repeat(2,minmax(0,1fr))}.track-heading h2{font-size:22px}}
@media(max-width:720px){.app{padding-inline:12px}.topbar{height:72px;flex-basis:72px;gap:9px}.brand{font-size:18px;gap:8px}.brand-mark{width:35px;height:35px}.brand-star{display:none}.top-actions{gap:5px}.icon-button,.profile-button{width:41px;height:41px;min-width:41px}.topbar nav{position:fixed;left:0;right:0;bottom:0;height:60px;z-index:5;border-top:1px solid #cbdde0;background:#fffdf5f5;backdrop-filter:blur(7px);display:flex;justify-content:space-around;padding:4px 8px max(4px,env(safe-area-inset-bottom));gap:8px}nav button{font-size:15px;flex:1;min-height:44px;padding:9px 10px}.page{padding:26px 0 85px}.intro{display:block;min-height:0;margin-bottom:25px}.intro h1{font-size:39px;max-width:none}.intro p{font-size:16px;line-height:1.7;max-width:none}.intro .eyebrow{font-size:11px;letter-spacing:1px}.hero-road{height:200px;margin-top:22px;border-radius:22px}.hero-sticker{font-size:17px;padding:11px 14px;top:13px;right:15px}.hero-sticker b{font-size:12px}.lobby-columns{display:flex;flex-direction:column;gap:22px}.quick-card,.rooms-card{padding:23px;border-radius:21px}.quick-card h2,.rooms-card h2{font-size:27px}.quick-card p{font-size:16px}.quick-card .eyebrow,.rooms-card .eyebrow{font-size:11px;letter-spacing:1px}.track-options{gap:6px}.track-option{font-size:13px;padding:10px 7px}.track-option .rally-icon{width:22px;height:22px}.quick-card>small{font-size:13px}.section-heading{gap:9px;align-items:flex-start}.section-heading .soft{min-height:44px;font-size:14px;padding:10px 12px}.join-form{gap:7px}.join-form .soft{font-size:15px;padding:10px 13px}.room-row{gap:8px;font-size:13px}.room-info b{font-size:16px}.room-info small{font-size:12px}.track-mini{width:32px;height:35px;min-width:32px}.room-row .soft{font-size:13px;min-height:44px;padding:9px}.lobby-bottom{display:grid;grid-template-columns:1fr;gap:15px;margin:25px 10px}.lobby-bottom span{width:100%;font-size:14px}.race-mode .topbar{height:56px;flex-basis:56px}.race-mode .brand{font-size:16px}.race-mode .brand-mark{width:30px;height:30px}.race-mode .icon-button,.race-mode .profile-button{width:40px;height:40px;min-width:40px}.race-mode nav{display:none}.race-heading{min-height:62px;padding:9px 0;gap:7px}.race-heading h1{font-size:20px;margin:3px 0 0}.race-heading .eyebrow{font-size:10px;letter-spacing:.4px}.race-actions{gap:6px}.race-actions .soft{min-height:40px;font-size:12px;padding:8px 10px;gap:4px;border-radius:9px}#roomCode{display:none}.race-stage{display:flex;flex-direction:column;gap:9px;padding-bottom:10px}.track-panel{order:-1;flex:0 0 clamp(104px,17dvh,150px);padding:5px 9px 7px;border-radius:16px}.track-heading h2{font-size:15px;margin:0 0 3px;line-height:1.3}.track-heading .eyebrow,.track-note{display:none}.track-heading #raceClock{position:absolute;top:1px;right:0;font-size:11px;margin:0}.track-canvas-wrap{border-radius:8px}.race-legend{display:flex;gap:4px;margin-top:5px}.legend-driver{font-size:10px;gap:4px;padding:4px 5px;border-radius:6px;flex:1;border-color:#c0d5cc}.legend-driver i{width:7px;height:7px}.legend-driver b{font-size:11px}.own{flex:1;min-height:0;max-height:100%;padding:10px 12px 8px!important;border-radius:17px}.own .player-heading{min-height:34px;gap:8px;margin-bottom:7px}.own .avatar{width:32px;height:32px}.own .player-info b{font-size:14px;line-height:1.2}.own .player-info small{font-size:11px;margin-top:2px}.own .player-heading>strong{font-size:24px}.own .player-heading>strong span{font-size:12px}.own .board-layout{gap:10px;justify-content:center}.own .board-wrap{max-width:calc(100% - 62px)}.piece-sidebar{width:48px;flex-basis:48px}.piece-sidebar canvas{width:48px}.piece-sidebar #nextCanvas{height:126px;margin:4px 0 10px}.piece-sidebar>span{font-size:10px;letter-spacing:.4px}.piece-sidebar>small{font-size:11px;margin-top:9px}.hold-button{width:44px;min-height:38px;margin-top:4px}.controls{gap:7px;margin-top:9px}.controls button{height:44px;min-height:44px;padding:8px;max-width:64px}.controls .drop-button{max-width:83px}.drop-button small{font-size:9px}.keyboard-hint{display:none}.opponents-button{font-size:12px;min-height:28px;padding:2px 0;top:-3px}.opponent-area{top:118px;right:10px;bottom:20px;width:min(300px,calc(100vw - 20px));padding:15px}.opponent-area .opponent-boards{min-height:500px}.text-button{font-size:14px}.waiting-panel{padding:25px 20px}.waiting-panel h2{font-size:29px}.waiting-panel p{font-size:16px}.waiting-player{font-size:15px;padding:12px;gap:8px;flex-wrap:wrap}.waiting-player small{font-size:12px}.garage-showcase{padding:20px;gap:20px;flex-direction:column}.garage-showcase>canvas{width:100%;height:170px}.garage-showcase>div{width:100%;text-align:center}.garage-showcase h2{font-size:29px}.garage-showcase p{font-size:15px}.profile-stats{gap:22px;justify-content:center}.profile-stats b{font-size:25px}.profile-stats small{font-size:12px}.achievement-grid{grid-template-columns:1fr 1fr;gap:12px}.achievement{padding:18px}.achievement b{font-size:19px}.achievement p{font-size:14px}.achievement small{font-size:12px}.page>.section-heading h1,#rankingView>h1{font-size:31px}.page>.section-heading p,#rankingView>p{font-size:16px}.page>.section-heading .primary{font-size:14px;min-height:46px;padding:11px;white-space:normal}.rank-row{padding:14px 10px;grid-template-columns:22px 34px minmax(0,1fr) 52px;gap:8px;font-size:14px}.rank-row>small:last-child{display:none}.rank-row small{font-size:12px}.rank-row>strong{font-size:18px}.rank-row .avatar{width:32px;height:32px}.history-row{font-size:14px;gap:9px;padding:14px 9px}.history-row b{flex-basis:100%}dialog{padding:25px 20px;width:calc(100vw - 20px);max-height:calc(100dvh - 20px);border-radius:22px}dialog h2{font-size:28px;margin-top:8px}dialog p{font-size:16px;line-height:1.65}dialog .eyebrow{font-size:11px;letter-spacing:.8px;display:block;max-width:calc(100% - 40px)}dialog>small{font-size:13px}.dialog-actions{flex-direction:column}.dialog-actions button{min-height:48px}.shop-layout{display:flex;flex-direction:column;gap:20px}.shop-preview{display:grid;grid-template-columns:92px minmax(0,1fr);gap:10px 14px;padding:14px;align-items:center}.shop-preview canvas{width:92px;height:92px;grid-row:1/3}.shop-preview h3{font-size:21px;margin:0}.shop-preview p{display:none}.shop-preview button{font-size:13px;padding:8px;min-height:44px;margin:0}.shop-tabs{gap:6px;margin:18px 0}.shop-tabs button{padding:9px 10px;font-size:14px;min-height:44px;flex:1}.shop-products{gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}.shop-product{padding:13px}.shop-product h3{font-size:19px}.shop-product p{font-size:14px}.shop-product small{font-size:12px}.product-art{height:112px}.shop-product .soft{font-size:14px;min-height:44px}.shop-wallet{font-size:15px}.toast{font-size:14px;bottom:12px;padding:12px 16px}.connection{font-size:14px;bottom:9px}.topbar .game-language-menu summary{font-size:13px;padding:9px;min-height:41px}.topbar .game-language-menu{margin-right:2px}.board-overlay b{font-size:20px}.board-overlay small{font-size:13px}}
@media(max-width:370px){.brand{font-size:16px}.brand-mark{width:30px;height:30px}.topbar{gap:6px}.top-actions{gap:4px}.icon-button,.profile-button{width:37px;height:40px;min-width:37px}.topbar .game-language-menu summary{font-size:12px;padding:8px}.quick-card,.rooms-card{padding:20px}.quick-card h2,.rooms-card h2{font-size:25px}.track-option{font-size:12px}.intro h1{font-size:35px}.intro p{font-size:16px}.intro .eyebrow{font-size:10px}.race-mode .topbar{height:48px;flex-basis:48px}.race-heading{min-height:54px}.race-heading h1{font-size:18px}.race-heading .eyebrow{font-size:9px}.race-actions .soft{font-size:11px;padding:8px}.race-actions .soft .rally-icon{width:18px;height:18px;min-width:18px}.track-panel{flex-basis:104px}.track-heading h2{font-size:13px}.track-heading #raceClock{font-size:10px}.legend-driver{font-size:9px;padding:3px}.legend-driver b{font-size:10px}.own .player-info b{font-size:13px}.own .player-info small{font-size:10px}.own .avatar{width:29px;height:29px}.own .player-heading>strong{font-size:21px}.own .player-heading>strong span{font-size:11px}.own .player-heading{margin-bottom:5px;min-height:30px}.controls{margin-top:7px;gap:6px}.controls button{padding:7px}.drop-button small{display:none}.achievement-grid{grid-template-columns:1fr}.achievement{padding:21px}.shop-products{grid-template-columns:1fr}.product-art{height:150px}.shop-product h3{font-size:22px}.shop-product p{font-size:16px}.shop-product .soft{font-size:16px}.shop-preview{grid-template-columns:78px minmax(0,1fr)}.shop-preview canvas{width:78px;height:85px}}
@media(max-height:650px) and (min-width:721px){.topbar{height:57px;flex-basis:57px}.brand{font-size:18px}.brand-mark{width:33px;height:33px}.icon-button,.profile-button{width:40px;height:40px}nav button{min-height:40px;font-size:14px;padding:8px 12px}.race-heading{min-height:63px;padding:9px 0}.race-heading h1{font-size:22px}.race-stage{gap:12px;padding-bottom:10px}.board-panel{padding:10px;border-radius:16px}.player-heading{min-height:31px;margin-bottom:7px;gap:7px}.avatar{width:30px;height:30px}.player-info b{font-size:14px}.player-info small{font-size:11px}.player-heading>strong{font-size:23px}.controls{gap:6px;margin-top:8px}.controls button{min-height:40px;height:40px;padding:7px}.keyboard-hint{display:none}.piece-sidebar #nextCanvas{height:100px;margin-bottom:7px}.piece-sidebar>span{font-size:10px}.piece-sidebar>small{font-size:11px;margin-top:8px}.hold-button{min-height:36px}.track-panel{padding:12px}.track-heading h2{font-size:20px}.track-heading .eyebrow{display:none}.track-note{display:none}.track-heading #raceClock{font-size:12px}.legend-driver{font-size:11px;padding:5px}.opponent-area{top:121px;bottom:12px}.shop-preview canvas{height:160px}.shop-products{grid-template-columns:1fr 1fr}.race-actions .soft{min-height:40px;font-size:13px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Sidebar previews shrink with the board instead of overflowing its header. */
.piece-sidebar{align-self:stretch;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.piece-sidebar>span{flex:0 0 auto;line-height:1.3}.piece-sidebar #nextCanvas{flex:1 1 0;min-height:0;height:auto;max-height:190px;width:100%;margin:4px 0 10px}.piece-sidebar #holdCanvas{flex:0 0 44px;height:44px;min-height:0;width:100%}.piece-sidebar .hold-button{flex-shrink:0}.piece-sidebar>small{flex-shrink:0;margin-top:8px}.toast{width:max-content;max-width:calc(100vw - 24px);pointer-events:none}.help-attention{border-color:#c78637;background:#fff0ca;color:#996527}
@media(max-width:720px){.piece-sidebar #nextCanvas{max-height:145px;margin:2px 0 6px}.piece-sidebar #holdCanvas{height:36px;flex-basis:36px}.piece-sidebar .hold-button{min-height:36px;height:36px;padding:6px}.piece-sidebar>small{font-size:10px;margin-top:5px}.topbar{overflow:hidden}.race-heading{min-height:57px}.race-heading .eyebrow{max-width:170px}.race-heading h1{font-size:18px}.race-actions .soft{font-size:12px}.toast{font-size:14px;text-align:center;bottom:12px}}
@media(max-width:370px){.race-heading{gap:6px;min-height:61px}.race-heading .eyebrow{font-size:8px;max-width:120px}.race-heading h1{font-size:16px}.race-actions .soft{font-size:11px;padding:8px}.track-panel{flex-basis:97px}.track-heading h2{font-size:12px;margin-left:32px;margin-right:20px}.opponents-button{font-size:10px}.own .player-info b{font-size:12px}.own .player-info small{font-size:10px}.own .player-heading{gap:5px}.piece-sidebar>span{font-size:9px}}
@media(max-height:450px) and (min-width:721px){.race-mode .topbar{height:46px;flex-basis:46px}.race-mode .topbar .brand{font-size:16px}.race-mode .topbar .brand-mark{width:28px;height:28px}.race-mode .topbar nav{display:none}.race-mode .topbar .icon-button,.race-mode .topbar .profile-button{width:36px;height:36px}.race-mode .race-heading{min-height:50px;padding:5px 0}.race-heading h1{font-size:19px}.race-heading .eyebrow{font-size:9px}.race-actions .soft{min-height:36px;font-size:12px;padding:7px 10px}.race-stage{padding-bottom:8px;gap:12px}.own{padding:8px 10px!important}.own .player-heading{min-height:28px;margin-bottom:5px}.own .player-info b{font-size:12px}.own .player-info small{font-size:10px}.own .avatar{width:28px;height:28px}.own .player-heading>strong{font-size:21px}.own .controls{margin-top:6px}.controls button{height:40px;min-height:40px}.piece-sidebar #nextCanvas{max-height:110px;margin:0 0 3px}.piece-sidebar #holdCanvas{height:28px;flex-basis:28px}.piece-sidebar>small{display:none}.piece-sidebar>span{font-size:9px}.hold-button{height:34px;min-height:34px;margin-top:3px;padding:4px}.track-panel{padding:9px}.track-heading h2{font-size:16px;margin:0 0 4px}.track-heading #raceClock{font-size:11px}.track-heading .opponents-button{font-size:11px;padding:0;min-height:24px;top:-2px}.legend-driver{font-size:10px;padding:4px}.track-heading{padding-top:20px}.opponent-area{top:98px}}
.board-wrap{border-width:1px}.race-mode .game-language-menu{display:none}
@media(max-width:370px){html:not(.race-mode) .topbar{height:auto;flex-basis:auto;min-height:106px;flex-wrap:wrap;row-gap:8px;padding:10px 0}html:not(.race-mode) .topbar .top-actions{width:100%;justify-content:space-between}html:not(.race-mode) .topbar .icon-button,html:not(.race-mode) .topbar .profile-button{width:44px;height:44px;min-width:44px}html:not(.race-mode) .topbar .game-language-menu{margin-right:auto}.race-mode .topbar{overflow:visible}.race-mode .top-actions{margin-left:auto}}
@media(max-height:450px) and (min-width:721px){.own .player-info small{display:none}.own .player-heading{min-height:28px}.own .board-wrap{border-width:1px}}
.board-wrap{container-type:inline-size}#countdown{padding:8px;gap:12px}#countdown b{color:#fff0bc;font:800 clamp(22px,40cqw,72px)/1.1 system-ui,sans-serif;max-width:100%;letter-spacing:-.4px}#countdown[data-paused="true"] b{font-size:clamp(15px,16cqw,50px)}#countdown small{font:700 12px/1.5 system-ui,sans-serif;color:#deedf2;max-width:100%;overflow-wrap:anywhere}
.board-overlay#countdown b{color:#fff0bc}
@media(max-width:720px){#roomsView #quickPlay{position:fixed;z-index:8;left:12px;right:12px;bottom:calc(72px + env(safe-area-inset-bottom));width:calc(100vw - 24px);min-height:52px;margin:0;padding:13px 18px;font-size:17px;box-shadow:0 4px 0 #9a522e,0 7px 20px #28465426}#roomsView.page{padding-bottom:155px}.intro .hero-road{height:165px}}
/* Keep legacy section selectors from reintroducing decorative typefaces. */
.app,.app *,dialog,dialog *{font-family:system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif!important}