*{box-sizing:border-box} :root{--paper:#fbf8ee;--blue:#2858f5;--blue2:#0d3268;--ink:#102f60;--pale:#dfeafe;--orange:#ff7b31;--teal:#098e83;--line:#b9d8ff;--white:#fffdf8;--shadow:0 14px 38px rgba(20,60,120,.09)}
html,body{margin:0;min-height:100%;background:var(--paper);color:var(--ink);font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif}body{overflow-x:hidden}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,canvas:focus-visible{outline:3px solid #ff9d5b;outline-offset:3px}.page{min-height:100vh;padding:0 2.1vw}.scribble{font-family:"Microsoft YaHei",sans-serif;letter-spacing:.05em}.topbar{height:90px;border-bottom:2px solid var(--blue);display:flex;align-items:center;justify-content:space-between;padding:0 14px;max-width:1472px;margin:auto}.brand{display:flex;align-items:center;gap:14px;font-weight:900;white-space:nowrap}.brand img{width:82px;height:58px;object-fit:contain}.brand-cn{font-size:38px;letter-spacing:.04em}.brand-en{font-size:14px;color:var(--blue);font-weight:900;line-height:1.05}.top-actions{display:flex;align-items:center;gap:26px}.link-btn,.icon-btn{border:0;background:transparent;cursor:pointer;font-weight:800;min-height:44px}.link-btn{font-size:18px}.icon-btn{font-size:28px;min-width:44px;color:var(--blue);display:grid;place-items:center}.sound-svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.btn{border-radius:18px;min-height:64px;padding:0 34px;border:2px solid var(--blue);font-size:25px;font-weight:900;cursor:pointer;transition:transform .13s,filter .13s;background:white}.btn:hover{transform:translateY(-2px);filter:saturate(1.1)}.btn-primary{background:linear-gradient(135deg,#1c50ff,#2867f5);color:white;box-shadow:inset 0 -5px 0 rgba(0,35,150,.15)}.btn-wide{width:100%}.orange-stroke{height:5px;background:var(--orange);border-radius:99px;display:block;transform:rotate(-3deg)}
/* home */
.home{height:100vh;min-height:760px;position:relative;overflow:hidden}.home-inner{max-width:1450px;margin:auto;height:calc(100vh - 90px);min-height:670px;position:relative}.home-copy{position:absolute;left:28px;top:50px;width:620px;z-index:3}.eyebrow{font-size:26px;font-weight:800;transform:rotate(-3deg);display:inline-block;margin-bottom:13px}.eyebrow .orange-stroke{width:285px;margin-top:4px}.home h1{font-size:clamp(82px,7vw,108px);line-height:1.12;letter-spacing:.015em;margin:0;font-weight:950;color:#082e66;text-shadow:3px 3px 0 rgba(30,85,210,.06)}.home-sub{font-size:25px;font-weight:800;margin:5px 0}.hero-doodle{position:absolute;right:270px;top:12px;width:570px;height:470px;z-index:2}.hero-doodle svg{width:100%;height:100%;overflow:visible}.flag-note{position:absolute;right:12px;top:65px;width:245px;z-index:2;transform:rotate(5deg)}.flag-note .pole{height:185px;border-left:8px solid var(--ink);position:absolute;left:7px;top:4px;transform:rotate(12deg);border-radius:5px}.flag-note b{display:block;background:var(--orange);clip-path:polygon(0 0,90% 14%,72% 50%,100% 100%,0 78%);padding:25px 38px 38px 32px;color:white;font-size:27px;line-height:1.35;margin-left:22px}.cloud{position:absolute;border:5px solid #8dbbff;border-radius:50%;width:130px;height:55px;opacity:.75}.cloud:before,.cloud:after{content:"";position:absolute;background:var(--paper);border:5px solid #8dbbff;border-bottom:0;border-radius:50% 50% 0 0}.cloud:before{width:65px;height:40px;left:20px;top:-30px}.cloud:after{width:50px;height:28px;right:-16px;top:-15px}.cloud.c1{left:690px;top:65px;transform:rotate(-13deg)}.cloud.c2{right:-5px;top:280px;transform:scale(.8) rotate(-8deg)}.home-track{position:absolute;left:50%;transform:translateX(-50%);top:250px;width:100vw;height:420px;background:url('assets/home-track-desktop.svg') center/100% 100% no-repeat;z-index:1}.track-horse{position:absolute;z-index:2;width:220px;height:110px}.track-horse svg{width:100%;height:100%}.track-horse polyline{vector-effect:non-scaling-stroke;stroke-width:3px}.th1{left:22%;top:525px}.th2{left:43%;top:548px;width:280px;height:120px}.th3{right:12%;top:512px}.stadium-edge{position:absolute;z-index:2;color:#4f82c5;border:2px solid #9bc1f0;background:rgba(251,248,238,.9);font-weight:900;transform:rotate(-4deg)}.stadium-left{left:-45px;top:368px;width:320px;height:105px;padding:28px 55px;text-align:center}.stadium-left:after{content:'● ◌ ● ◌ ● ◌ ●';position:absolute;left:8px;right:8px;top:-22px;letter-spacing:9px;color:#81aee5}.stadium-right{right:-45px;top:355px;width:330px;height:105px;padding:28px 48px;transform:rotate(-8deg)}.mobile-rival{display:none}.home-finish{position:absolute;right:12px;top:500px;width:78px;height:125px;z-index:4}.finish-distance{position:absolute;right:20px;top:622px;z-index:4;color:var(--blue);font-size:20px;font-style:italic}.home-actions{position:absolute;left:12px;bottom:140px;display:flex;gap:14px;z-index:5}.home-actions .btn{min-height:88px}.home-actions .btn-primary{min-width:307px;font-size:32px}.home-actions .btn:not(.btn-primary){min-width:190px}.home-hint{position:absolute;left:16px;bottom:100px;font-size:16px;font-weight:700}.steps{position:absolute;left:590px;right:auto;bottom:105px;display:flex;z-index:5}.step{width:205px;padding:0 28px;border-left:1px solid #86aee0}.step:first-child{border:0}.step .num{font-size:28px;font-weight:950;font-style:italic}.step b{display:block;font-size:23px;margin:4px 0}.step small{color:#77a0d2}.home-footer{position:absolute;left:10px;right:10px;bottom:11px;border-top:2px solid #9bbce5;text-align:right;padding-top:6px;color:#749ac8;font-size:12px;letter-spacing:.1em}.storage-notice{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:40;background:#fff3d7;border:1px solid var(--orange);border-radius:10px;padding:8px 14px;font-size:13px;font-weight:700;box-shadow:var(--shadow);white-space:nowrap}
/* studio */
.studio{height:100vh;min-height:720px}.studio .topbar{height:82px}.studio-body{max-width:1470px;margin:0 auto;height:calc(100vh - 82px);position:relative;padding:60px 475px 42px 4px}.studio-nav{position:absolute;top:17px;left:4px}.studio-tabs{position:absolute;top:17px;left:43%;font-size:18px;font-weight:900;color:#8093b4}.studio-tabs span:first-child{color:var(--blue);border-bottom:2px solid var(--blue);padding-bottom:8px}.studio-title{height:150px}.studio-title h1{font-size:58px;line-height:1.15;margin:0;font-weight:950;letter-spacing:.01em}.studio-title p{font-size:25px;color:#6d84a7;margin:7px 0;font-weight:700}.sticker{position:absolute;right:492px;top:88px;background:var(--orange);padding:15px 22px;border-radius:14px;color:#092f67;font-size:22px;font-weight:900;transform:rotate(-8deg);box-shadow:0 8px 0 #ffbc89}.canvas-card{height:calc(100% - 150px);min-height:430px;border:1.5px solid var(--line);border-radius:20px;background:white;overflow:hidden;box-shadow:0 3px 0 rgba(75,130,220,.04);display:flex;flex-direction:column}.draw-wrap{position:relative;min-height:0;flex:1;background-color:#fff;background-image:radial-gradient(#d5e7ff 1.5px,transparent 1.6px);background-size:27px 27px}.draw-wrap canvas{width:100%;height:100%;touch-action:none;display:block;cursor:crosshair}.toolbar{height:95px;flex:0 0 95px;border-top:1.5px solid var(--line);display:flex;align-items:center;gap:18px;padding:10px 30px}.tool{height:60px;min-width:60px;border:0;background:transparent;border-radius:12px;font-size:18px;font-weight:800;cursor:pointer}.tool.active{background:#dce9ff;color:var(--blue)}.tool-svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}.tool-sep{height:45px;border-left:1px solid var(--line)}.width-dot{border:0;border-radius:12px;background:transparent;width:70px;height:60px;cursor:pointer}.width-dot i{display:block;border-radius:50%;background:#12376a;margin:auto}.width-dot[data-size="4"] i{width:10px;height:10px}.width-dot[data-size="8"] i{width:24px;height:24px;background:var(--blue)}.width-dot[data-size="13"] i{width:38px;height:38px}.width-dot.active{background:#edf4ff}.mouse-tip{margin-left:auto;color:#6c82a7;font-weight:700}.entry-panel{position:absolute;right:0;top:70px;bottom:42px;width:440px;border-radius:22px;background:linear-gradient(135deg,#e8f2ff,#d9e9fd);padding:28px;display:flex;flex-direction:column;gap:15px}.entry-panel h2{font-size:34px;margin:0}.field-label{font-size:18px;font-weight:800;display:flex;justify-content:space-between;align-items:center}.mini-link{border:0;background:transparent;color:var(--blue);font-weight:800;cursor:pointer;min-height:44px}.name-wrap{position:relative}.name-wrap input{width:100%;height:66px;border:1.5px solid #7cabff;border-radius:12px;padding:0 55px 0 18px;color:var(--ink);font-size:24px;font-weight:800;background:white}.clear-name{position:absolute;right:7px;top:8px;border:0;background:transparent;height:50px;width:45px;font-size:28px;color:#8093b4;cursor:pointer}.count-tip{font-size:14px;color:#6f84aa}.preview-title{border-top:1px solid #9cc0ed;padding-top:20px;font-size:25px;font-weight:900}.preview-box{height:164px;background:repeating-linear-gradient(0deg,#fff,#fff 39px,#c9dfff 40px);border:7px solid white;border-radius:13px;position:relative;overflow:hidden}.preview-box:after{content:"";position:absolute;right:0;top:0;bottom:0;width:27px;background:repeating-conic-gradient(#c4dbff 0 25%,#fff 0 50%) 0/27px 27px}.preview-box canvas{width:calc(100% - 27px);height:100%}.preview-caption{text-align:center;font-size:13px;color:#6f84aa;margin-top:-10px}.entry-spacer{flex:1}.entry-panel .btn{min-height:70px}.save-status{font-size:14px;color:#637faa;text-align:right}.save-status:before{content:'✓';display:inline-grid;place-items:center;width:20px;height:20px;border:2px solid #6c95ca;border-radius:50%;margin-right:7px}
/* race */
.race{height:100vh;min-height:700px;padding:0 1.8vw;overflow:hidden}.race .topbar{height:105px}.race-note{font-size:18px;transform:rotate(-6deg);border-bottom:3px solid var(--orange);padding-bottom:4px}.race-body{max-width:1470px;margin:auto;height:calc(100vh - 105px);position:relative}.race-hud{height:100px;display:flex;align-items:center;gap:34px;border-bottom:1px solid transparent}.race-title{font-size:42px;font-weight:950;white-space:nowrap}.round-badge{font-size:21px;border:1px solid #aacbff;background:#e9f2ff;border-radius:7px;padding:8px 18px;white-space:nowrap}.hud-stat{display:flex;align-items:baseline;gap:8px;font-size:22px;font-weight:900;white-space:nowrap}.hud-stat.big{font-size:44px;margin-left:auto}.hud-div{height:48px;border-left:1px solid #9db3d0}.rank-wrap{margin-left:auto;font-weight:800;white-space:nowrap}.rank-wrap strong{color:var(--blue);font-size:50px;margin:0 8px}.streak{font-size:21px;font-weight:800}.streak strong{font-size:40px;color:var(--orange)}.stands{height:78px;background:linear-gradient(to bottom,transparent 75%,#aacbff 76%,transparent 79%),repeating-linear-gradient(100deg,transparent 0 55px,rgba(94,146,220,.17) 56px 57px);display:flex;justify-content:space-around;align-items:end;padding-bottom:13px;color:#5986c4;font-weight:800}.banner{border:2px solid #8eb7ed;background:var(--paper);padding:6px 25px;transform:rotate(-3deg)}.arena-wrap{height:345px;position:relative;padding-top:28px}.ticks{position:absolute;left:240px;right:0;top:0;height:28px;font-weight:700;color:#174079}.tick{position:absolute;transform:translateX(-50%)}.tick:after{content:"";position:absolute;top:22px;left:50%;height:10px;border-left:2px solid var(--blue)}.tick:nth-child(1){left:0}.tick:nth-child(2){left:20%}.tick:nth-child(3){left:40%}.tick:nth-child(4){left:60%}.tick:nth-child(5){left:80%}.tick:nth-child(6){left:auto;right:2px;transform:none;font-size:26px;font-weight:950;white-space:nowrap}.arena{height:100%;border:2px solid var(--blue);border-radius:4px;position:relative;overflow:hidden;background:rgba(255,255,255,.32)}.lane{height:25%;border-bottom:1.5px solid #6ea3f8;position:relative}.lane:last-child{border:0}.lane.player{background:linear-gradient(90deg,#edf5ff,#cee2ff)}.lane-label{position:absolute;left:0;top:0;bottom:0;width:240px;border-right:1.5px solid #6ea3f8;display:flex;align-items:center;padding:0 13px;gap:14px;background:rgba(251,248,238,.72);z-index:4}.lane-no{font-size:27px;font-weight:950}.lane-name{font-size:18px;font-weight:900;max-width:160px;overflow:hidden;text-overflow:ellipsis}.you{background:var(--blue);color:white;padding:3px 9px;border-radius:3px;font-size:14px}.track-zone{position:absolute;left:240px;right:0;top:0;bottom:0;background:repeating-linear-gradient(90deg,transparent 0 calc(20% - 1px),#b7d6ff calc(20% - 1px) 20%)}.finish-strip{position:absolute;right:0;top:0;bottom:0;width:47px;background:repeating-conic-gradient(#11315e 0 25%,white 0 50%) 0/32px 32px;border-left:2px solid #12376a;z-index:2}.runner{position:absolute;left:0;top:5%;height:90%;width:210px;transform-origin:50% 85%;will-change:transform;z-index:3}.runner svg{width:100%;height:100%;overflow:visible}.runner .horse-art,.runner .horse-stroke{transform-box:fill-box;will-change:transform}.runner polyline{vector-effect:non-scaling-stroke;stroke-width:4px}.race-paused .runner,.race-paused .runner *{animation-play-state:paused!important}.runner.ghost{opacity:.42;filter:saturate(.5)}.runner.hit-perfect{animation:perfectPop .35s ease-out}.runner.hit-good{animation:goodHop .35s ease}.runner.hit-miss{animation:stumble .5s ease}.runner.combo svg{filter:none}.speed-lines{position:absolute;left:-25px;top:40%;color:var(--orange);font-size:25px;opacity:0}.runner.combo .speed-lines{opacity:1}.judgement{height:74px;text-align:center;display:flex;justify-content:center;align-items:center;gap:22px;font-size:24px;font-weight:900}.judge-word{font-size:35px;color:var(--orange);min-width:170px;font-family:cursive;transform:rotate(-4deg)}.race-controls{display:grid;grid-template-columns:minmax(500px,1fr) 365px;gap:24px;align-items:center}.rhythm-caption{text-align:center;font-size:21px;font-weight:900;margin-bottom:10px}.rhythm-bar{height:78px;border:2px solid var(--blue);border-radius:40px;position:relative;overflow:hidden;background:linear-gradient(90deg,#dbeaff 0 38%,#8dbaff 38% 45%,#ffad74 45% 55%,#8dbaff 55% 62%,#dbeaff 62%)}.rhythm-pointer{position:absolute;left:0;top:-6px;width:16px;height:90px;border:3px solid #12376a;background:white;border-radius:9px;transform:translateX(-50%)}.rhythm-labels{display:flex;justify-content:space-between;color:#5084c9;font-size:14px;padding:6px 8px}.rhythm-labels span:nth-child(3){color:#f05c1e}.race-btn{height:150px;border-radius:38px;font-size:42px;line-height:1.15}.race-btn small{display:block;font-size:18px;margin-top:10px}.race-bottom{position:absolute;left:8px;right:8px;bottom:7px;border-top:1px solid #bfd4eb;padding-top:12px;display:flex;justify-content:space-between}.text-action{border:0;background:transparent;color:#345c8c;cursor:pointer;font-weight:800;font-size:16px;min-height:42px}
@keyframes perfectPop{0%{scale:1}35%{scale:.82 1.18;rotate:-3deg}75%{scale:1.2 .85;translate:0 -8px}100%{scale:1}}@keyframes goodHop{50%{translate:0 -6px;rotate:2deg}}@keyframes stumble{30%{rotate:9deg;translate:-7px 5px}65%{rotate:-6deg}}@keyframes pulse{50%{transform:scale(1.08)}}
/* overlays */
.countdown{position:fixed;inset:0;background:rgba(251,248,238,.75);display:grid;place-items:center;z-index:20;backdrop-filter:blur(2px)}.countdown b{font-size:150px;color:var(--blue);text-shadow:8px 8px 0 #c7dcff;animation:pulse .8s}.modal-backdrop{position:fixed;inset:0;background:rgba(8,35,75,.34);z-index:50;display:flex;align-items:center;justify-content:center;padding:20px}.modal{width:min(650px,96vw);max-height:92vh;overflow:auto;background:var(--paper);border:2px solid var(--blue);border-radius:24px;box-shadow:0 24px 80px rgba(0,25,70,.25);padding:30px;position:relative}.modal h2{font-size:36px;margin:0 0 13px}.modal-close{position:absolute;right:16px;top:13px;border:0;background:transparent;font-size:30px;cursor:pointer}.modal-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}.modal-actions .btn{font-size:20px;min-height:55px;flex:1}.help-list{line-height:1.9;padding-left:23px}.result-modal{width:min(850px,96vw)}.result-head{text-align:center}.result-rank{font-size:25px;font-weight:900}.result-rank strong{font-size:74px;color:var(--blue)}.result-time{font-size:44px;font-weight:950;font-variant-numeric:tabular-nums}.result-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;margin-top:18px}.result-horse{height:210px;border:1.5px solid var(--line);border-radius:16px;background:white}.result-horse canvas{width:100%;height:100%}.score-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}.score-item{background:#e7f1ff;border-radius:12px;padding:14px;text-align:center}.score-item b{display:block;font-size:28px}.diff{text-align:center;color:#ec6b2b;font-weight:900;margin:14px}.share-error{display:none;margin:12px 0 0;padding:10px 12px;border:1px solid var(--orange);border-radius:9px;background:#fff1e7;color:#9a3c0e;font-weight:800}.share-panel{display:none;margin-top:18px;border-top:1px solid #a8c8ee;padding-top:18px}.share-panel.open{display:grid;grid-template-columns:180px 1fr;gap:18px}.share-panel img{width:180px;border:1px solid #9abbea}.share-text{background:white;padding:12px;border:1px dashed #7aa7e5;border-radius:8px;user-select:all}.toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,130px);opacity:0;background:#12376a;color:white;border-radius:99px;padding:13px 24px;z-index:100;transition:.25s;font-weight:700}.toast.show{transform:translate(-50%,0);opacity:1}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* mobile */
@media(max-width:700px){.page{padding:0 16px}.topbar{height:63px;padding:0;border-bottom-width:2px}.brand{gap:7px}.brand img{width:55px;height:42px}.brand-cn{font-size:20px}.brand-en{font-size:8px}.top-actions{gap:4px}.top-actions .link-btn{font-size:14px}.icon-btn{font-size:23px}.btn{min-height:58px;border-radius:15px;font-size:23px}.home{height:auto;min-height:100vh;overflow:visible;padding-bottom:26px}.home-inner{height:auto;min-height:770px}.home-copy{position:relative;left:auto;top:auto;width:auto;padding-top:10px}.eyebrow{font-size:16px;margin-bottom:10px}.eyebrow .orange-stroke{width:170px;height:4px}.home h1{font-size:52px;line-height:1.14}.home-sub{font-size:20px;line-height:1.42}.hero-doodle{right:100px;top:175px;width:290px;height:280px}.flag-note{right:-34px;top:245px;width:132px}.flag-note .pole{height:110px;border-left-width:4px}.flag-note b{font-size:16px;padding:14px 15px 24px 19px;margin-left:12px}.cloud.c1{left:auto;right:0;top:127px;scale:.55}.cloud.c2{display:none}.home-track{top:260px;height:220px;background-color:var(--pale);background-image:url('assets/home-track-mobile.svg');clip-path:polygon(0 38%,100% 0,100% 100%,0 100%)}.track-horse{display:none}.stadium-edge{display:none}.mobile-rival{display:block;position:absolute;left:18px;top:374px;width:128px;height:75px;z-index:3}.mobile-rival svg{width:100%;height:100%}.mobile-rival polyline{vector-effect:non-scaling-stroke;stroke-width:2.6px}.home-finish{right:9px;top:340px;width:55px;height:90px}.finish-distance{right:13px;top:426px;font-size:16px}.home-actions{position:absolute;left:0;right:0;bottom:auto;top:476px;display:flex;flex-direction:column;gap:8px}.home-actions .btn{min-height:58px}.home-actions .btn-primary,.home-actions .btn:not(.btn-primary){width:100%;min-width:0}.home-hint{left:0;right:0;top:608px;bottom:auto;text-align:center;font-size:14px}.steps{position:absolute;left:0;right:0;top:650px;bottom:auto}.step{padding:0 10px;width:33.33%;text-align:center}.step .num{font-size:21px}.step b{font-size:15px}.step small{font-size:10px;line-height:1.3;display:block}.home-footer{display:none}
.studio{height:auto;min-height:100vh;padding-bottom:24px}.studio .topbar{height:55px}.studio .topbar .brand{margin-left:60px}.studio .brand img{width:43px}.studio .brand-cn{font-size:18px}.studio-body{height:auto;padding:15px 0 0}.studio-nav{top:-49px;left:0}.studio-tabs{display:none}.studio-title{height:70px}.studio-title h1{font-size:28px}.studio-title p{font-size:15px}.sticker{right:3px;top:18px;font-size:13px;padding:8px 10px;box-shadow:0 4px 0 #ffbc89}.canvas-card{height:310px;min-height:0;border-radius:12px}.draw-wrap{height:250px;flex:none;background-size:20px 20px}.toolbar{height:60px;flex-basis:60px;padding:4px 8px;gap:2px}.tool{min-width:45px;height:50px;font-size:0}.tool .tool-icon{font-size:25px}.tool-svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}.width-dot{width:45px;height:50px}.width-dot[data-size="13"] i{width:30px;height:30px}.tool-sep{height:32px}.mouse-tip{display:none}.entry-panel{position:relative;right:auto;top:auto;bottom:auto;width:auto;background:transparent;padding:12px 4px 0;display:flex;gap:4px}.entry-panel h2{display:none}.field-label{font-size:17px}.name-wrap input{height:54px;font-size:20px}.count-tip{position:static;text-align:right;line-height:18px}.preview-title{border:0;padding-top:7px;font-size:18px}.preview-row{background:linear-gradient(135deg,#eaf3ff,#d9eaff);border-radius:15px;padding:8px;display:grid;grid-template-columns:1fr 130px;gap:8px;align-items:center;margin-bottom:2px}.preview-box{height:76px}.preview-caption{display:none}.preview-row .btn{min-height:58px;padding:0 8px;font-size:17px}.entry-panel>.btn:not(.inside-preview){margin-top:4px;order:10}.entry-spacer{display:none}.save-status{text-align:left;margin:4px 0;order:9}.studio .entry-panel .btn-primary{height:62px}.studio .btn-wide{width:100%}
.race{height:100svh;min-height:700px;padding:0 10px}.race .topbar{height:63px}.race .brand-en{display:block}.race-note{display:none}.race-body{height:calc(100svh - 63px)}.race-hud{height:122px;display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:4px;padding:9px 6px}.race-title{grid-column:1/3;font-size:24px}.round-badge{font-size:13px;padding:5px 6px;grid-column:3}.hud-stat{font-size:15px;display:block}.hud-stat.big{font-size:clamp(24px,7vw,29px);margin:0;min-width:0;letter-spacing:-.02em}.hud-stat.big small{font-size:12px;display:block;letter-spacing:0}.hud-div{display:none}.rank-wrap{font-size:11px;margin:0;min-width:0}.rank-wrap strong{font-size:30px;margin:0;display:block;letter-spacing:-.04em}.streak{display:none}.stands{display:flex;height:22px;min-height:22px;padding:0 4px;align-items:center;justify-content:space-around;overflow:hidden;font-size:8px;background:radial-gradient(circle at 8px 18px,#8eb6e8 0 2px,transparent 2.5px) 0 0/18px 22px,linear-gradient(transparent 80%,#9fc2ec 81%)}.stands>span:first-child,.stands>span:last-child{display:none}.stands .banner{padding:1px 8px;border-width:1px;white-space:nowrap;transform:rotate(-2deg)}.arena-wrap{height:282px;padding-top:27px}.ticks{left:84px;font-size:10px}.tick:nth-child(2),.tick:nth-child(3),.tick:nth-child(4),.tick:nth-child(5){display:block}.tick:nth-child(6){font-size:15px;right:1px}.lane-label{width:84px;padding:0 6px;gap:5px}.lane-no{font-size:21px}.lane-name{font-size:13px;line-height:1.25;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.you{font-size:10px;padding:2px 5px;display:block}.track-zone{left:84px;background:linear-gradient(90deg,transparent 49.7%,#b7d6ff 50%,transparent 50.3%)}.finish-strip{width:23px;background-size:22px 22px}.runner{width:116px;top:5%;height:90%}.runner polyline{stroke-width:2.8px}.judgement{height:65px;font-size:20px;gap:5px}.judge-word{font-size:30px;min-width:105px}#judge-combo{font-size:17px;white-space:nowrap}.race-controls{display:flex;flex-direction:column;gap:11px}.rhythm-wrap{width:100%}.rhythm-caption{font-size:15px;margin-bottom:7px}.rhythm-bar{height:42px}.rhythm-pointer{width:11px;height:52px}.rhythm-labels{font-size:10px;padding:3px 3px}.race-btn{width:100%;height:93px;min-height:93px;border-radius:28px;font-size:37px}.race-btn small{font-size:0;margin-top:3px}.race-btn small:after{content:'轻点按钮，跟着节奏';font-size:15px}.race-bottom{bottom:0;justify-content:center;padding-top:3px}.race-bottom span{display:none}.text-action{min-height:35px;font-size:14px}.countdown b{font-size:110px}.modal{padding:23px 18px}.modal h2{font-size:28px}.result-modal{max-height:96svh}.result-grid{grid-template-columns:1fr;gap:10px}.result-horse{height:135px}.score-list{grid-template-columns:repeat(4,1fr);gap:4px}.score-item{padding:8px 2px;font-size:11px}.score-item b{font-size:20px}.result-rank strong{font-size:55px}.result-time{font-size:35px}.share-panel.open{grid-template-columns:100px 1fr}.share-panel img{width:100px}.modal-actions{gap:8px}.modal-actions .btn{flex-basis:100%;min-height:50px}.toast{font-size:13px;white-space:normal;bottom:15px;max-width:calc(100vw - 24px);text-align:center}.storage-notice{left:12px;right:12px;bottom:8px;transform:none;white-space:normal;text-align:center;font-size:11px}
}
@media(max-width:700px) and (max-height:820px){.home-copy{padding-top:8px}.home h1{font-size:48px}.home-sub{font-size:18px}.hero-doodle{top:165px;height:250px}.home-track{top:250px;height:205px}.home-actions{top:455px}.home-hint{top:585px}.steps{top:626px}.canvas-card{height:300px}.draw-wrap{height:240px}.studio-title{height:65px}.studio-body{padding-top:12px}.entry-panel{padding-top:8px}.race-hud{height:110px}.arena-wrap{height:252px}.judgement{height:55px}.race-btn{height:81px;min-height:81px}.rhythm-caption{margin:0}.race-controls{gap:6px}}

/* Codex: keep restart below controls, including short mobile viewports. */
.race{height:auto;min-height:100svh;overflow:visible;padding-bottom:max(12px,env(safe-area-inset-bottom,0px))}
.race-body{height:auto;min-height:calc(100svh - 117px);display:flex;flex-direction:column}
.race-body>*{flex-shrink:0}
.race-bottom{position:static;margin-top:16px}
@media(max-width:700px){.race-body{min-height:calc(100svh - 75px)}}
.race-controls{grid-template-columns:minmax(0,1fr) minmax(0,365px)}
@media(min-width:701px) and (max-width:1100px){.race-hud{gap:12px}.race-title{font-size:28px}.hud-stat.big{font-size:28px}.rank-wrap strong{font-size:32px}.race-hud .streak{display:none}.round-badge{font-size:16px;padding:8px}.hud-stat{font-size:16px}}