#menu:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#fff9e830,transparent 58%)}#menu .menu-copy{position:relative;z-index:1}#menu .course-card,#menu .menu-footer{z-index:1}#menu .menu-water{z-index:0}
@media(max-width:800px){#menu:after{background:linear-gradient(90deg,#fff9e8ef,#fff9e887 38%,transparent 78%)}}@media(max-width:560px){#menu:after{background:linear-gradient(90deg,#fff9e8ef,#fff9e8b9 60%,#fff9e824)}}
:root{--ink:#112f38;--paper:#fff9e8;--muted:#56747b;--orange:#f45a38;--blue:#20b5d4;--gold:#e5b54a;--line:2px solid var(--ink);font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;color:var(--ink)}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#88dce2}button,select,input{font:inherit}button{cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.55}button:focus-visible,select:focus-visible{outline:3px solid #25c5e6;outline-offset:5px}button{touch-action:manipulation}button,select{border:var(--line)}button{transition:transform .15s,background .15s}button:hover:not(:disabled){transform:translateY(-2px)}button:active:not(:disabled){transform:translateY(1px)}[hidden]{display:none!important}#world{position:fixed;inset:0;width:100%;height:100%;display:block;outline:none}.paper{background:var(--paper);border:var(--line);box-shadow:4px 4px 0 var(--ink);border-radius:5px}.eyebrow{font-size:11px;letter-spacing:3px;text-transform:uppercase;font-weight:800}.primary{background:var(--orange);color:var(--paper);padding:15px 28px;border-radius:4px;font-weight:900;box-shadow:4px 4px 0 var(--ink);display:inline-flex;align-items:center;justify-content:center;gap:24px}.primary .arrow{font-size:24px;line-height:1}.secondary{background:var(--paper);border-radius:4px;padding:12px 21px;font-weight:700}.ghost{background:transparent;border:0;padding:10px;font-weight:700}.key{display:inline-flex;min-width:24px;height:25px;align-items:center;justify-content:center;border:1px solid #809599;border-bottom-width:3px;border-radius:4px;font:700 11px system-ui;padding:0 5px;background:#fffaf0}.sep{width:1px;height:21px;background:currentColor;opacity:.2}.badge{display:inline-flex;align-items:center;gap:7px;font-size:11px;letter-spacing:1px;font-weight:700}.dot{width:7px;height:7px;border-radius:100%;background:#2d9f7a}.icon{width:20px;height:20px;display:inline-block;vertical-align:middle}svg{overflow:visible}.grain{pointer-events:none;position:fixed;inset:0;z-index:7;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.5' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:multiply}
.topbar{position:fixed;left:32px;right:32px;top:26px;display:flex;align-items:center;justify-content:space-between;z-index:9;pointer-events:none}.topbar>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:15px;letter-spacing:1px}.brand-mark{width:34px;height:34px;background:var(--ink);color:var(--paper);border-radius:50%;display:grid;place-items:center}.toolbar{display:flex;gap:8px}.tool{width:38px;height:38px;background:var(--paper);border-radius:4px;display:grid;place-items:center;box-shadow:2px 2px 0 var(--ink)}.tool.active{background:var(--blue)}
#menu{position:fixed;inset:0;z-index:8;background:linear-gradient(90deg,rgba(255,249,232,.99),rgba(255,249,232,.93) 22%,rgba(255,249,232,.1) 61%,transparent 82%);display:flex;align-items:center}.menu-copy{width:520px;max-width:53vw;margin-left:7vw;padding-top:15px}.edition{display:flex;align-items:center;gap:14px;margin-bottom:22px}.edition:before{content:"";width:32px;height:3px;background:var(--orange)}h1{font-size:clamp(58px,7.5vw,112px);line-height:.9;letter-spacing:-7px;margin:0 0 22px;font-weight:1000;font-family:"Arial Black",Impact,system-ui,sans-serif;font-style:italic;text-transform:uppercase}h1 span{display:block;color:var(--orange);text-shadow:3px 3px 0 var(--ink);-webkit-text-stroke:1px var(--ink)}.zh-title{font-size:24px;font-weight:900;letter-spacing:12px;margin-bottom:19px}.intro{font-size:14px;line-height:1.9;color:var(--muted);max-width:330px;margin:0 0 30px}.menu-buttons{display:flex;gap:13px;align-items:center;flex-wrap:wrap}.menu-buttons .primary{min-width:210px;font-size:16px}.menu-links{display:flex;gap:17px;margin-top:25px;font-size:12px}.menu-links button{padding:0;border:0;background:none;color:var(--muted)}.course-card{position:absolute;top:112px;right:36px;width:222px;padding:19px 21px;transform:rotate(2deg)}.course-card .eyebrow{font-size:9px;color:var(--muted)}.course-card h3{font-size:22px;margin:10px 0 7px}.course-card p{font-size:11px;color:var(--muted);margin:0;line-height:1.8}.course-card .route-icon{position:absolute;right:14px;top:18px;color:var(--orange)}.menu-footer{position:absolute;bottom:26px;left:7vw;right:36px;display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid #112f3833;padding-top:15px;font-size:10px;color:var(--muted)}.menu-footer .controls{display:flex;align-items:center;gap:9px}.menu-footer .key{height:21px;min-width:20px;font-size:10px}.progress-note{margin-top:20px;font-size:11px;color:var(--muted)}
#loading{position:fixed;inset:0;z-index:100;background:var(--paper);display:grid;place-items:center;text-align:center}.loader-mark{font-family:Impact,sans-serif;font-size:64px;font-style:italic;color:var(--orange);text-shadow:3px 3px 0 var(--ink)}#load-text{font-size:13px;color:var(--muted);max-width:420px;line-height:1.8}.load-track{width:210px;height:5px;background:#dde5dc;margin:24px auto;overflow:hidden}.load-track span{display:block;height:100%;width:45%;background:var(--orange);animation:loading 1s infinite alternate ease-in-out}@keyframes loading{to{transform:translateX(125%)}}
#hud{position:fixed;inset:0;z-index:8;pointer-events:none}.race-meta{position:absolute;top:27px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:22px;padding:10px 22px;background:#fff9e8e8;border:var(--line);border-radius:4px}.race-meta label{font-size:10px;color:var(--muted);display:block;letter-spacing:1px}.race-meta strong{font:800 23px system-ui}.race-meta .time{font-variant-numeric:tabular-nums;font-size:18px}.ranking{position:absolute;left:30px;top:97px;width:180px;padding:15px 16px;background:#fff9e8ea}.ranking .eyebrow{font-size:9px;letter-spacing:2px;margin-bottom:13px;color:var(--muted)}.rank-row{display:flex;align-items:center;gap:9px;font-size:12px;margin:11px 0}.rank-row:last-child{margin-bottom:0}.rank-row.you{font-weight:900}.rank-row b{font:800 12px system-ui;width:14px}.rank-row i{width:6px;height:16px;border-radius:2px}.rank-gap{margin-left:auto;font-size:10px;color:var(--muted)}.map-wrap{position:absolute;top:85px;right:30px;width:174px;padding:9px;background:#fff9e8ed}.map-wrap canvas{width:150px;height:145px;display:block;margin:auto}.weather-line{display:flex;align-items:center;justify-content:space-between;font-size:10px;border-top:1px solid #112f3826;padding:9px 3px 0}.weather-line span{display:flex;align-items:center;gap:5px}.speed-panel{position:absolute;left:30px;bottom:32px;min-width:171px;padding:13px 20px;transform:skew(-5deg)}.speed-panel>*{transform:skew(5deg)}.speed-top{font-size:10px;font-weight:800;letter-spacing:2px;color:var(--muted)}.speed-number{font:900 66px/.95 system-ui;letter-spacing:-4px;margin:8px 0 12px;display:flex;align-items:baseline;gap:9px;font-variant-numeric:tabular-nums}.speed-number small{font-size:12px;letter-spacing:0}.boost-label{display:flex;justify-content:space-between;align-items:center;font-size:9px;font-weight:800;margin-bottom:5px}.meter{height:9px;background:#112f381a;overflow:hidden;border:1px solid var(--ink);border-radius:2px}.meter>span{display:block;height:100%;background:var(--blue);transform-origin:left;transition:background .2s;width:100%}.boat-bars{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);width:300px;padding:11px 15px;background:#fff9e8e8}.bar-caption{font-size:10px;font-weight:800;display:flex;justify-content:space-between;margin-bottom:5px}.bar-caption+.meter{margin-bottom:9px}.bar-caption .hint{font-weight:400;color:var(--muted)}.skill-meter{height:8px}.ready .skill-meter>span{animation:ready 1s infinite}.ready .bar-caption:last-of-type{color:#0787a2}@keyframes ready{50%{filter:brightness(1.5)}}.race-help{position:absolute;bottom:33px;right:30px;display:flex;flex-direction:column;gap:6px;font-size:10px;text-align:right;color:var(--paper);text-shadow:1px 1px 2px var(--ink)}.race-help .key{background:#fff9e8dd;color:var(--ink);text-shadow:none;height:20px;min-width:21px;font-size:9px}.effect-tags{position:absolute;left:50%;bottom:132px;transform:translateX(-50%);display:flex;gap:8px}.effect-tag{padding:5px 10px;border:var(--line);border-radius:4px;background:var(--paper);font-size:11px;font-weight:800}.nav-hint{position:absolute;left:50%;top:110px;transform:translateX(-50%);padding:7px 15px;background:#112f38dd;color:var(--paper);border-radius:4px;font-size:12px;max-width:70%;text-align:center}.countdown{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%) rotate(-5deg);font:1000 clamp(90px,14vw,160px)/1 system-ui;font-style:italic;color:var(--paper);-webkit-text-stroke:3px var(--ink);text-shadow:7px 7px 0 var(--orange);text-align:center}.countdown small{display:block;font-size:13px;letter-spacing:5px;font-style:normal;-webkit-text-stroke:0;text-shadow:1px 1px 0 var(--ink);margin-top:13px}.damage-vignette{position:fixed;inset:0;z-index:6;pointer-events:none;box-shadow:inset 0 0 100px 20px #c8303566;opacity:0;transition:opacity .3s}.speed-vignette{position:fixed;inset:0;z-index:6;pointer-events:none;background:radial-gradient(ellipse,transparent 45%,#5de6ff25);opacity:0;transition:opacity .2s}.speed-vignette:before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(from 20deg at 50% 45%,transparent 0deg 12deg,#fff4 12.1deg 12.25deg,transparent 12.5deg 20deg);mask-image:radial-gradient(ellipse,transparent 45%,#000 100%)}
.overlay{position:fixed;inset:0;z-index:20;background:#102c36b8;backdrop-filter:blur(7px);display:flex;align-items:center;justify-content:center;padding:35px}.dialog{background:var(--paper);border:var(--line);box-shadow:7px 7px 0 #102c36;border-radius:6px;position:relative;max-height:90vh;overflow:auto;padding:32px;width:430px}.dialog h2{font-size:29px;margin:5px 0 13px;letter-spacing:-1px}.dialog p{font-size:13px;line-height:1.85;color:var(--muted)}.close{position:absolute;right:18px;top:16px;width:31px;height:31px;background:transparent;border:var(--line);border-radius:100%;font:600 20px system-ui;display:grid;place-items:center}.dialog-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}.dialog-actions .primary{flex:1;padding:12px 20px}.pause-actions{display:grid;gap:12px;margin-top:25px}.pause-actions .primary{width:100%}.pause-links{display:flex;justify-content:center;gap:20px;margin-top:15px;font-size:12px}.pause-links button{border:0;background:none}.panel{width:min(1190px,96vw);height:min(790px,91vh);padding:28px;background:var(--paper);overflow:hidden;display:flex;flex-direction:column}.panel-head{display:flex;justify-content:space-between;align-items:center;padding-right:42px;gap:18px;border-bottom:1px solid #112f3829;padding-bottom:17px;margin-bottom:22px}.panel-head h2{margin:5px 0 0;font-size:27px}.panel-count{font-size:13px;font-weight:800;color:var(--muted)}.panel-body{overflow:auto;flex:1;padding:3px 3px 12px}.panel-foot{font-size:10px;color:var(--muted);margin:12px 0 0}.achievement-row{display:grid;grid-template-columns:115px repeat(6,minmax(108px,1fr));gap:9px;align-items:center;margin-bottom:13px;min-width:870px}.achievement-dimension{font-weight:800;font-size:12px}.achievement-dimension small{display:block;font-size:9px;color:var(--muted);font-weight:400;margin-top:5px}.achievement-card{padding:12px 8px;border:1px solid #b4c2be;border-radius:5px;text-align:center;background:#eaece1;color:#7e8f90;min-height:90px}.achievement-card b{display:block;font-size:12px;letter-spacing:1px;margin:3px 0 10px}.achievement-card small{font-size:9px;display:block;line-height:1.5}.achievement-card.unlocked{background:var(--ink);border:2px solid var(--tier);box-shadow:0 0 9px color-mix(in srgb,var(--tier) 35%,transparent);color:var(--tier)}.achievement-card.unlocked:last-child{animation:goldglow 2s infinite}@keyframes goldglow{50%{box-shadow:0 0 16px #efc95e99}}.talent-canvas{position:relative;min-width:1000px;height:645px}.talent-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.talent-node{position:absolute;width:103px;text-align:center;transform:translate(-50%,-50%);padding:0;border:0;background:none;color:var(--muted);font-size:10px}.talent-node:hover:not(:disabled){transform:translate(-50%,-53%)}.talent-node .orb{width:61px;height:61px;margin:0 auto 6px;border:3px solid #546569;border-radius:100%;background:#30454a;color:#8a9b9b;display:grid;place-items:center;font-size:20px;font-weight:900;box-shadow:3px 3px 0 #16313b44}.talent-node.unlocked .orb{background:linear-gradient(145deg,#ffe6a1,#dfac3c);border-color:var(--ink);color:var(--ink);box-shadow:0 0 12px #d6a8316b}.talent-node.unlocked{color:var(--ink);font-weight:800}.talent-node.available .orb{border-color:var(--blue);box-shadow:0 0 12px #26bce36b;animation:ready 2s infinite}.branch-label{position:absolute;left:166px;font-size:10px;letter-spacing:2px;font-weight:800;color:var(--muted)}#tooltip{position:fixed;z-index:40;pointer-events:none;max-width:265px;padding:15px 17px;font-size:11px;line-height:1.8;background:var(--paper)}#tooltip b{font-size:14px;display:block;margin-bottom:4px}#tooltip span{color:var(--muted)}.settings-row{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:23px 0;font-size:13px}.settings-row select{padding:7px;background:#fffdf6;border-radius:4px}.settings-row input[type=range]{width:140px;accent-color:var(--orange)}.switch{width:42px;height:24px;border-radius:30px;background:#ccd6d1;position:relative;box-shadow:none}.switch:after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;background:white;border-radius:100%}.switch[aria-checked=true]{background:var(--blue)}.switch[aria-checked=true]:after{left:21px}.controls-grid{display:grid;grid-template-columns:80px 1fr;gap:13px;font-size:12px;margin-top:22px;align-items:center}.controls-grid .key{width:max-content}.result-number{font:900 72px/1 system-ui;letter-spacing:-4px;color:var(--orange);margin:16px 0}.result-number small{font-size:21px;color:var(--ink);letter-spacing:0}.result-stats{display:grid;grid-template-columns:1fr 1fr;gap:17px;border-top:1px solid #112f3833;border-bottom:1px solid #112f3833;padding:19px 0}.result-stats label{display:block;font-size:10px;color:var(--muted);margin-bottom:5px}.result-stats b{font:800 21px system-ui}.result-points{background:#f4e3ab;border:1px solid var(--ink);border-radius:3px;padding:10px 13px;margin-top:18px;font-size:12px;font-weight:800}.result-table{font-size:11px;margin:16px 0 0}.result-table .rank-row{margin:9px 0}.result-table .rank-gap{font-variant-numeric:tabular-nums}
#skins{background:linear-gradient(90deg,#102c36d9,#102c369e)}.skin-dialog{width:min(960px,96vw);height:min(620px,89vh);overflow:hidden;display:flex;flex-direction:column;text-align:center;padding:27px}.skin-head{display:flex;align-items:center;justify-content:space-between;padding-right:42px;text-align:left}.skin-head h2{font-size:25px;margin:4px 0 0}.preview-area{height:280px;min-height:150px;flex:1;position:relative;margin:8px 0}#skin-preview{height:100%;width:100%;display:block}.skin-switch{position:absolute;top:45%;border:var(--line);background:var(--paper);border-radius:100%;width:39px;height:39px;font:700 22px system-ui}.skin-switch.prev{left:8%}.skin-switch.next{right:8%}.skin-name{font-size:26px;font-weight:900;letter-spacing:3px;margin:0 0 6px}.skin-info{display:flex;justify-content:center;gap:10px;font-size:11px;color:var(--muted);min-height:19px}.skin-cards{display:flex;justify-content:center;gap:9px;margin:22px 0 20px;flex-wrap:wrap}.skin-card{border:var(--line);padding:8px 11px 6px;border-radius:4px;background:#ebece0;font-size:9px;color:var(--muted);min-width:72px}.skin-card.selected{background:var(--paper);box-shadow:3px 3px 0 var(--ink);color:var(--ink)}.skin-card.locked{opacity:.56}.skin-swatch{display:block;margin:0 auto 5px;width:24px;height:9px;background:var(--skin);border:1px solid var(--ink);border-radius:10px 3px}.skin-bottom{display:flex;justify-content:center;gap:20px;align-items:center}.skin-bottom p{font-size:10px;margin:0}.skin-bottom .primary{padding:11px 26px;font-size:13px}#skin-lock{font-size:11px;color:#9c5c39;margin:7px 0 0;min-height:17px}
#toasts{position:fixed;z-index:45;top:90px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}.toast{background:var(--paper);border:var(--line);box-shadow:3px 3px 0 var(--ink);border-radius:4px;padding:11px 18px;font-size:12px;display:flex;gap:10px;align-items:center;animation:toastin .2s ease-out;max-width:90vw}.toast .toast-icon{color:#b78b23;font-size:19px}.toast small{font-size:10px;color:var(--muted);display:block;margin-top:2px}@keyframes toastin{from{opacity:0;transform:translateY(-12px)}}.unlock-spark{position:fixed;z-index:44;pointer-events:none;width:7px;height:7px;background:var(--gold);border:1px solid var(--ink);border-radius:2px;animation:spark .65s forwards ease-out}@keyframes spark{to{transform:translate(var(--sx),var(--sy)) rotate(180deg);opacity:0}}#touch-controls{position:absolute;left:0;right:0;bottom:14px;display:flex;justify-content:space-between;padding:0 18px;pointer-events:auto}.touch-group{display:flex;gap:10px}.touch-btn{width:53px;height:53px;background:#fff9e8d9;border-radius:50%;font-weight:900;user-select:none;touch-action:none}.touch-btn.wide{width:64px;border-radius:10px;font-size:11px}.touch-btn[data-key=ShiftLeft]{background:#61d8e3dd}body.touch .speed-panel{bottom:96px}body.touch .boat-bars{bottom:99px}body.touch .race-help{display:none}body.touch .effect-tags{bottom:194px}
@media(max-width:800px){.topbar{left:18px;right:18px;top:16px}.brand{font-size:12px}.toolbar{gap:6px}.tool{width:32px;height:32px}.brand-mark{width:29px;height:29px}.menu-copy{margin-left:6vw;max-width:61vw;width:430px}h1{font-size:clamp(58px,10vw,83px);letter-spacing:-5px}.zh-title{font-size:19px;letter-spacing:7px}.intro{font-size:12px;width:260px}.menu-buttons .primary{min-width:177px;padding:12px 20px;font-size:14px}.menu-buttons .secondary{padding:11px 16px;font-size:12px}.course-card{right:19px;top:79px;width:164px;padding:15px}.course-card h3{font-size:17px}.course-card .route-icon{display:none}.menu-footer{left:6vw;bottom:19px;right:18px}.menu-footer .controls{gap:5px;font-size:9px}.menu-footer .build{display:none}.ranking{left:18px;top:74px;width:152px;padding:11px}.rank-row{font-size:10px;gap:6px;margin:9px 0}.race-meta{top:17px;gap:12px;padding:7px 12px}.race-meta strong{font-size:19px}.race-meta .time{font-size:14px}.race-meta label{font-size:8px}.map-wrap{right:18px;top:67px;width:129px;padding:5px}.map-wrap canvas{width:114px;height:104px}.speed-panel{left:18px;bottom:24px;min-width:132px;padding:10px 13px}.speed-number{font-size:49px}.boat-bars{width:237px;bottom:24px;padding:9px 11px}.race-help{right:18px;bottom:24px;font-size:9px}.nav-hint{top:80px;font-size:10px}.overlay{padding:18px}.panel{padding:20px}.skin-dialog{height:min(590px,92vh)}.skin-card{min-width:58px;padding:7px}.skin-cards{gap:6px}.skin-bottom p{display:none}}
@media(max-width:560px){#menu{background:linear-gradient(90deg,#fff9e8f5,#fff9e8c9 60%,#fff9e844)}.menu-copy{max-width:88vw;width:400px;padding-top:25px}.edition{font-size:9px;margin-bottom:20px}h1{font-size:76px}.course-card{display:none}.intro{max-width:280px}.menu-footer .controls{display:none}.menu-links{font-size:11px}.race-meta{left:18px;transform:none;top:65px}.ranking{top:127px;width:133px;padding:9px}.ranking .eyebrow{margin-bottom:8px}.rank-gap{font-size:8px}.map-wrap{top:64px;right:14px;width:113px}.map-wrap canvas{width:99px;height:96px}.weather-line{font-size:8px}.speed-panel{min-width:99px;left:14px;padding:9px}.speed-number{font-size:39px}.speed-number small{font-size:8px}.speed-top{font-size:8px}.boat-bars{left:auto;right:14px;transform:none;width:211px}.race-help{display:none}.effect-tags{bottom:136px}.nav-hint{top:235px;max-width:80%;font-size:10px}.dialog{padding:26px;width:100%}.dialog h2{font-size:25px}.skin-head h2{font-size:20px}.skin-head .panel-count{font-size:10px}.skin-cards{gap:6px;margin:12px 0}.skin-card{min-width:57px}.skin-name{font-size:21px}.skin-dialog{height:90vh;padding:20px}.skin-info{font-size:10px}.skin-switch.prev{left:0}.skin-switch.next{right:0}.preview-area{min-height:130px}.panel-head h2{font-size:22px}.panel-count{font-size:11px}.touch-btn{width:45px;height:45px}.touch-group{gap:5px}.touch-btn.wide{width:52px}.touch .boat-bars{bottom:81px}.touch .speed-panel{bottom:81px}body.touch .effect-tags{bottom:171px}}
@media(max-height:590px) and (min-width:560px){.menu-copy{padding-top:28px}.edition{margin-bottom:12px}h1{font-size:68px;margin-bottom:12px}.zh-title{font-size:19px;margin-bottom:10px}.intro{margin-bottom:16px}.menu-links{margin-top:15px}.progress-note{display:none}.skin-dialog{height:93vh}.preview-area{min-height:80px}.skin-cards{margin:10px 0}.skin-name{font-size:20px}.race-help{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

#menu{isolation:isolate;background:linear-gradient(90deg,rgba(255,249,232,.35),rgba(255,249,232,.05) 53%,transparent 75%)}
#menu:before{content:"";position:absolute;inset:-2%;z-index:-2;background-image:url("./images/menu-island.png");background-size:cover;background-position:center;will-change:transform;animation:coast-drift 24s steps(360,end) infinite alternate}

.menu-water{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}

.menu-surf{position:absolute;right:-12%;bottom:-18%;width:81%;height:43%;overflow:visible;mask-image:linear-gradient(90deg,transparent,#000 26%);animation:surf-surge 4.8s steps(144,end) infinite;transform-origin:75% 100%}
.menu-surf.back{bottom:13%;height:25%;opacity:.24;animation-duration:7.6s;animation-delay:-3.2s}
.menu-surf .foam-crest{fill:none;stroke:#fff9e8;stroke-width:3;stroke-linecap:round;opacity:.86}
.menu-surf .wave-body{fill:#32b6bd;opacity:.15}.menu-surf .foam-dashes{fill:none;stroke:#fff9e8;stroke-width:2;stroke-dasharray:14 32 4 24;stroke-linecap:round;opacity:.56}
.menu-spark{position:absolute;width:5px;height:12px;border-radius:70% 70% 45% 45%;background:#fff9e8;opacity:0;animation:splash-rise 3.2s steps(96,end) infinite;transform-origin:center bottom}
.sea-status{display:inline-flex;align-items:center;gap:8px;font-size:10px;letter-spacing:2px;color:#267d82;margin:0 0 20px;font-weight:800}.sea-status .sea-bars{display:flex;align-items:center;gap:3px;height:12px}.sea-bars i{width:3px;height:12px;background:#31a8ac;border-radius:2px;animation:sea-meter 1.6s steps(48,end) infinite}.sea-bars i:nth-child(2){animation-delay:-.4s}.sea-bars i:nth-child(3){animation-delay:-.8s}
#menu .menu-copy{animation:menu-arrive .85s cubic-bezier(.16,1,.3,1) both}#menu .course-card{animation:card-bob 5s steps(150,end) infinite}#menu .menu-buttons .arrow{animation:arrow-ride 2.8s steps(84,end) infinite}
@keyframes coast-drift{0%{transform:scale(1.02) translate(-.4%,.4%) rotate(-.12deg)}50%{transform:scale(1.035) translate(.25%,-.45%) rotate(.1deg)}100%{transform:scale(1.02) translate(-.4%,.4%) rotate(-.12deg)}}
@keyframes surf-surge{0%,100%{transform:translate(22px,22px) rotate(-3deg) scale(1,.94);opacity:.25}45%{transform:translate(-30px,-22px) rotate(-1deg) scale(1.055,1.05);opacity:.8}75%{transform:translate(-52px,-4px) rotate(-2deg) scale(1.08,1);opacity:.42}}
@keyframes splash-rise{0%{opacity:0;transform:translate(16px,23px) rotate(-25deg) scale(.35)}20%{opacity:.85}65%{opacity:.45}100%{opacity:0;transform:translate(-38px,-43px) rotate(-40deg) scale(.65)}}
@keyframes sea-meter{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
@keyframes card-bob{0%,100%{transform:translateY(0) rotate(2deg)}50%{transform:translateY(-8px) rotate(.3deg)}}
@keyframes arrow-ride{0%,65%,100%{transform:translate(0,0)}35%{transform:translate(4px,-4px)}}
@keyframes menu-arrive{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
#menu:before{animation-duration:9s;animation-timing-function:steps(270,end);animation-direction:normal}
body.menu-dialog #menu *,body.menu-dialog #menu:before,body.still-menu #menu *,body.still-menu #menu:before,body.page-hidden #menu *,body.page-hidden #menu:before{animation-play-state:paused!important}
body.capture #menu *,body.capture #menu:before{animation-play-state:paused!important;animation-delay:var(--menu-seek,0s)!important}body.capture #menu .menu-copy,body.still-menu #menu .menu-copy{animation:none!important}
#world{visibility:hidden}body.playing #world{visibility:visible}
@media(max-width:800px){.menu-surf{width:100%;right:-32%}.sea-status{margin-bottom:15px;font-size:9px}}
@media(max-width:560px){.menu-surf{width:125%;right:-42%;bottom:-3%;height:42%}.menu-surf.back{bottom:25%;height:25%}}
@media(max-width:800px){#menu:before{background-position:65% center}#menu{background:linear-gradient(90deg,#fff9e8eb,rgba(255,249,232,.66) 38%,rgba(255,249,232,.05) 75%)}}@media(max-width:560px){#menu:before{background-position:63% center}#menu{background:linear-gradient(90deg,#fff9e8ed,#fff9e8ba 60%,#fff9e833)}}
.skin-decor{font-size:11px;color:var(--muted);line-height:1.5;margin:7px 0 0;min-height:17px}.skin-swatch.ride-emblem{width:40px;height:37px;border:0;border-radius:0;margin:0 auto 5px;background-color:transparent;background-image:var(--ride-decal);background-size:400% 200%;background-position:calc(var(--ride-column)*100%/3) calc(var(--ride-row)*100%);box-shadow:none}.skin-card.locked .ride-emblem{opacity:.35}.skin-card{min-width:69px}.skin-cards{margin:13px 0}.skin-dialog #skin-lock{margin:7px 0}.skin-dialog .skin-name{margin:6px 0 7px}@media(max-width:560px){.skin-decor{font-size:10px}.skin-card{min-width:61px}.skin-swatch.ride-emblem{width:34px;height:33px}.skin-dialog .preview-area{min-height:150px}}
.preview-hint{position:absolute;bottom:0;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:1px;color:var(--muted);pointer-events:none}#skin-preview{cursor:grab}#skin-preview:active{cursor:grabbing}@media(max-width:800px){.skin-dialog{height:min(680px,94vh)}.skin-swatch.ride-emblem{height:30px;width:34px}.skin-cards{margin:9px 0}.skin-decor{font-size:10px}.preview-hint{bottom:3px}}@media(max-width:700px){.course-card{display:none}}@media(max-width:560px){.skin-dialog{height:94vh}}@media(max-height:590px){.skin-dialog{overflow:auto}.skin-head,.skin-name,.skin-info,.skin-decor,#skin-lock,.skin-cards,.skin-bottom{flex-shrink:0}} #touch-coach{position:fixed;right:36px;top:90px;z-index:19;padding:13px 30px 13px 14px;max-width:214px;color:var(--ink);font-size:11px;box-shadow:3px 3px 0 var(--ink)}#touch-coach-open{background:none;border:0;padding:0;color:var(--ink);font-weight:800;text-align:left}#touch-coach-dismiss{position:absolute;right:6px;top:8px;background:none;border:0;font-size:19px;padding:0;line-height:1}.coach-arrow{position:absolute;right:7px;top:-41px;width:43px;height:43px;color:var(--orange)}.touch-choice-dialog{width:min(440px,92vw)}.touch-choice-dialog .dialog-actions{flex-wrap:nowrap}.touch-choice-dialog .dialog-actions button{font-size:13px;white-space:nowrap}.touch-choice-dialog .touch-choice-note{font-size:10px;margin-bottom:0}@media(max-width:800px){#touch-coach{right:18px;top:78px}.coach-arrow{top:-39px;width:40px}.touch-choice-dialog{padding:25px}.touch-choice-dialog h2{font-size:23px}} .talent-node .orb{width:65px;height:65px;background:#e6e9df;border-color:#8d9d98;box-shadow:2px 3px 0 #16313b22}.talent-art{display:block;width:54px;height:54px;background-image:url("./images/talent-icons.png");background-size:700% 400%;background-position:calc(var(--talent-column)*100%/6) calc(var(--talent-row)*100%/3);background-repeat:no-repeat;opacity:.5}.talent-node.available .orb{background:#edf9ef;border-color:#2eaaa9;box-shadow:2px 3px 0 #2eaaa944}.talent-node.available .talent-art{opacity:.88}.talent-node.unlocked .orb{background:#fff2ce;border-color:#b18528;box-shadow:2px 3px 0 #b1852844}.talent-node.unlocked .talent-art{opacity:1}.talent-root-icon{width:33px;height:33px;color:#b18528}.talent-node{line-height:1.5}.branch-label{font-size:11px;letter-spacing:2px;color:#2d797d}.talent-lines{opacity:.85} 
.tool{display:flex;align-items:center;justify-content:center;padding:0;line-height:1;font-size:0;flex:0 0 auto}.tool .icon{display:block;width:20px;height:20px;flex:0 0 20px;margin:0;vertical-align:initial}
#orientation-gate{position:fixed;inset:0;z-index:150;display:grid;place-items:center;background:#fff9e8;color:var(--ink);padding:28px;text-align:center}.orientation-card{max-width:330px;outline:none}.rotate-device{width:145px;height:130px}.orientation-card h2{font-size:28px;letter-spacing:3px;margin:16px 0}.orientation-card>p:not(.eyebrow){font-size:14px;line-height:1.9;color:var(--muted)}.orientation-card small{font-size:10px;color:var(--muted);line-height:1.8;display:block;margin-top:28px}body.portrait-device #menu *,body.portrait-device #menu:before{animation-play-state:paused!important}
#touch-controls{bottom:max(14px,env(safe-area-inset-bottom));padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right));pointer-events:none;align-items:flex-end}.touch-group{gap:9px;align-items:flex-end;pointer-events:auto}.touch-btn{--control:#32c6d4;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;width:58px;height:58px;border:1px solid #fff9e8b8;background:linear-gradient(145deg,#fff9e85e,#fff9e819);box-shadow:inset 0 1px 0 #fff9e8c2,0 2px 0 #112f3870,0 3px 8px #102c362c;border-radius:18px;padding:5px;color:#102c36;line-height:1;transition:transform .12s,background .12s;touch-action:none}.touch-btn span{font-size:10px;font-weight:900;letter-spacing:1px;text-shadow:0 0 3px #fff9e8,0 1px 0 #fff9e8}.touch-btn .touch-icon{width:26px;height:26px;display:block;pointer-events:none;color:#102c36;filter:drop-shadow(0 1px 1px #fff9e8)}.touch-btn .icon-halo{stroke:#fff9e8;stroke-width:5;opacity:.85}.touch-btn.wide{width:64px;border-radius:18px}.touch-btn.accelerate{width:64px;height:66px;border-radius:22px;border-color:#83ecf0;background:linear-gradient(145deg,#b9fff16e,#8df4ed1c)}.touch-btn.ultimate{--control:#e8bd51;border-color:#fbe49abc;background:linear-gradient(145deg,#fff4bf5e,#fff0ad14)}.touch-btn.turbo{border-color:#9cecf2ab}.touch-btn[data-key=ShiftLeft]{background:linear-gradient(145deg,#fff4bf5e,#fff0ad14)}.touch-btn.held,.touch-btn:active{transform:translateY(2px) scale(.95);background:color-mix(in srgb,var(--control) 60%,#fff9e8 20%);box-shadow:inset 0 0 0 1px #fff9e8,0 0 0 2px var(--control)}.touch-btn.ultimate.charged{border:2px solid #fff0a3;background:linear-gradient(145deg,#f9dc6e8c,#f9dc6e22)}
body.mobile-device .topbar{left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top))}body.mobile-device .tool{width:38px;height:38px}body.mobile-device .toolbar{gap:7px}body.mobile-device #touch-coach{right:max(18px,env(safe-area-inset-right));top:81px}
@media(orientation:landscape) and (max-height:500px){
 body.mobile-device .menu-copy{margin-left:6vw;width:430px;max-width:53vw;padding-top:36px}body.mobile-device .edition{margin-bottom:12px;font-size:8px}body.mobile-device h1{font-size:60px;letter-spacing:-4px;margin-bottom:12px}body.mobile-device .zh-title{font-size:16px;margin-bottom:10px;letter-spacing:6px}body.mobile-device .sea-status{margin-bottom:10px;font-size:8px}body.mobile-device .intro{font-size:10px;line-height:1.6;margin-bottom:15px}body.mobile-device .menu-buttons{gap:9px}body.mobile-device .menu-buttons .primary{padding:9px 18px;min-width:160px;font-size:12px}body.mobile-device .menu-buttons .secondary{padding:9px 12px;font-size:10px}body.mobile-device .menu-links{margin-top:12px;font-size:10px;gap:12px}body.mobile-device .progress-note,body.mobile-device .menu-footer,body.mobile-device .course-card{display:none}
 body.mobile-device .ranking{left:16px;top:63px;width:134px;padding:9px}body.mobile-device .rank-row{font-size:9px;margin:6px 0}body.mobile-device .ranking .eyebrow{font-size:8px}body.mobile-device .race-meta{top:12px;padding:7px 10px;gap:12px}body.mobile-device .race-meta strong{font-size:18px}body.mobile-device .race-meta label{font-size:8px}body.mobile-device .race-meta .time{font-size:13px}body.mobile-device .map-wrap{right:16px;top:62px;width:111px;padding:5px}body.mobile-device .map-wrap canvas{width:96px;height:84px}body.mobile-device .weather-line{font-size:8px}body.mobile-device .speed-panel{left:16px;bottom:87px;padding:8px 11px;min-width:118px}body.mobile-device .speed-number{font-size:40px}body.mobile-device .boat-bars{left:50%;right:auto;transform:translateX(-50%);bottom:16px;width:min(275px,36vw);padding:8px 11px}body.mobile-device .boat-bars .bar-row{font-size:9px}body.mobile-device .effect-tags{bottom:103px}body.mobile-device .nav-hint{top:67px;max-width:46%;font-size:9px}body.mobile-device .race-help{display:none}
 body.mobile-device .skin-dialog{display:grid;grid-template-columns:47% 1fr;grid-template-rows:auto auto auto auto auto 1fr auto;gap:4px 17px;width:min(960px,96vw);height:94vh;padding:15px 20px;overflow:hidden}body.mobile-device .skin-head{grid-column:1/-1;padding-right:38px}body.mobile-device .skin-head h2{font-size:20px}body.mobile-device .skin-head .eyebrow{font-size:8px!important}body.mobile-device .preview-area{grid-column:1;grid-row:2/8;min-height:0;height:100%;margin:0}body.mobile-device .skin-name,body.mobile-device .skin-info,body.mobile-device .skin-decor,body.mobile-device #skin-lock,body.mobile-device .skin-cards,body.mobile-device .skin-bottom{grid-column:2;min-height:0;margin:0}body.mobile-device .skin-name{font-size:20px}body.mobile-device .skin-info{font-size:9px}body.mobile-device .skin-decor,body.mobile-device #skin-lock{font-size:9px;line-height:1.4}body.mobile-device .skin-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;align-content:center}body.mobile-device .skin-card{padding:5px 2px;min-width:0;font-size:8px}body.mobile-device .skin-swatch.ride-emblem{width:26px;height:24px;margin-bottom:2px}body.mobile-device .skin-bottom .primary{padding:8px 13px;font-size:11px}body.mobile-device .skin-bottom p{display:none}body.mobile-device .skin-switch.prev{left:0}body.mobile-device .skin-switch.next{right:0}body.mobile-device .preview-hint{bottom:0;font-size:8px}body.mobile-device .skin-dialog .close{right:12px;top:12px}
 body.mobile-device .overlay{padding:10px}body.mobile-device .panel{padding:17px;height:93vh}body.mobile-device .panel-head{margin-bottom:10px;padding-bottom:10px}body.mobile-device .panel-head h2{font-size:21px}body.mobile-device .panel-count{font-size:10px}
}
@media(orientation:landscape) and (max-width:700px){body.mobile-device .touch-group{gap:6px}body.mobile-device .touch-btn{width:46px;height:50px;border-radius:15px}body.mobile-device .touch-btn.wide{width:51px;border-radius:15px}body.mobile-device .touch-btn.accelerate{width:51px;height:56px}body.mobile-device .touch-icon{width:23px;height:23px}body.mobile-device .touch-btn span{font-size:9px}body.mobile-device .boat-bars{width:218px;bottom:75px}body.mobile-device .speed-panel{bottom:73px;min-width:100px}body.mobile-device .speed-number{font-size:35px}body.mobile-device .effect-tags{bottom:163px}body.mobile-device .brand{font-size:10px;gap:6px}body.mobile-device .brand-mark{width:27px;height:27px}body.mobile-device .tool{width:32px;height:32px}body.mobile-device .race-meta{left:151px;transform:none;gap:8px}body.mobile-device .race-meta strong{font-size:16px}body.mobile-device .race-meta .time{font-size:11px}body.mobile-device .race-meta label{font-size:7px}body.mobile-device .menu-copy{padding-top:42px;max-width:58vw}body.mobile-device h1{font-size:49px}body.mobile-device .zh-title{font-size:13px;margin-bottom:8px}body.mobile-device .intro{margin-bottom:10px}body.mobile-device .sea-status{display:none}body.mobile-device .edition{margin-bottom:8px}body.mobile-device .menu-buttons .primary{min-width:130px;padding:7px 11px;font-size:10px}body.mobile-device .menu-buttons .secondary{padding:8px;font-size:9px}body.mobile-device .menu-links{margin-top:9px;font-size:8px}body.mobile-device .menu-links .key{height:18px;min-width:18px;font-size:8px}}
.pickup-note{font-size:9px;font-weight:800;color:#267d82;margin-top:5px;line-height:1.45;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}body.mobile-device .effect-tags{gap:4px;max-width:58vw;flex-wrap:wrap;justify-content:center}body.mobile-device .effect-tag{font-size:9px;padding:3px 6px;border-width:1px}body.mobile-device .boat-bars{background:#fff9e8c4}@media(orientation:landscape) and (max-height:500px){body.mobile-device .bar-caption{font-size:9px}body.mobile-device .boat-bars .meter{height:6px}body.mobile-device .bar-caption+.meter{margin-bottom:5px}body.mobile-device .boat-bars{bottom:12px}body.mobile-device .effect-tags{bottom:98px}body.mobile-device .pickup-note{font-size:8px;margin-top:4px}}@media(orientation:landscape) and (max-width:700px){body.mobile-device .boat-bars{bottom:75px}body.mobile-device .effect-tags{bottom:158px}} 
.skin-swatch.ride-emblem{background-image:url("./images/ride-decals.png")}

.touch-btn .touch-art{display:block;width:31px;height:31px;background-image:url("./images/touch-controls.png");background-size:300% 200%;background-position:calc(var(--touch-column)*50%) calc(var(--touch-row)*100%);background-repeat:no-repeat;pointer-events:none}.touch-btn span{font-size:10px;letter-spacing:.5px}.touch-btn .touch-icon{filter:none}@media(orientation:landscape) and (max-width:700px){body.mobile-device .touch-art{width:27px;height:27px}}

#pickup-toast{position:fixed;top:102px;left:50%;transform:translateX(-50%);z-index:18;background:#fff9e8dc;border:1px solid #112f38;border-radius:5px;padding:6px 12px;font-size:11px;font-weight:800;color:#112f38;pointer-events:none;white-space:nowrap;max-width:80vw;overflow:hidden;text-overflow:ellipsis;box-shadow:2px 2px 0 #112f3840}body.mobile-device #pickup-toast{font-size:10px;padding:4px 10px;border-radius:4px;max-width:55vw}@media(orientation:landscape) and (max-height:500px){body.mobile-device #pickup-toast{top:62px}}
