*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#ffd819;color:#17120d;font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif}body{overscroll-behavior:none}button,a{font:inherit}button{border:0;cursor:pointer}button:disabled{opacity:.38;cursor:not-allowed}#app{width:100%;height:100%}.screen-shell,.mobile-shell,.admin-shell{position:relative;width:100%;height:100%;overflow:hidden;background:#ffd819}.screen-stage{position:absolute;left:50%;top:50%;width:3200px;height:1792px;transform:translate(-50%,-50%) scale(min(calc(100vw / 3200),calc(100vh / 1792)));transform-origin:center;overflow:hidden}.screen-art,.mobile-art{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none;user-select:none}.phase-change .screen-stage,.phase-change .mobile-stage{animation:page-in .55s cubic-bezier(.2,.8,.2,1)}
.screen-utilities{position:fixed;right:14px;bottom:14px;display:flex;gap:8px;z-index:20;opacity:.18;transition:opacity .2s}.screen-utilities:hover,.screen-utilities:focus-within{opacity:1}.utility-button{padding:9px 13px;border:1px solid rgba(20,15,8,.22);border-radius:4px;background:rgba(255,255,255,.78);color:#17120d;font-size:13px;font-weight:800;backdrop-filter:blur(8px)}
/* WAITING: dynamic regions mapped to H5扫码.psd coordinates. */.qr-dynamic{position:absolute;left:1943px;top:416px;width:813px;height:813px;padding:42px;background:#fff;overflow:hidden;box-shadow:0 0 0 8px rgba(49,197,143,.08),0 0 70px rgba(49,197,143,.36);animation:qr-breathe 2.4s ease-in-out infinite}.qr-dynamic img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:crisp-edges}.qr-dynamic i{position:absolute;left:42px;right:42px;top:42px;height:12px;background:#31c58f;box-shadow:0 0 25px #31c58f;animation:qr-scan 2.5s ease-in-out infinite}.waiting-count{position:absolute;left:2445px;top:1352px;width:307px;height:78px;display:flex;align-items:center;justify-content:flex-end;color:#fff;font-style:italic;font-weight:900;letter-spacing:-3px}.waiting-count b{font-size:72px}.waiting-count em{font-size:48px;color:#fa5128;font-style:normal}.waiting-progress{position:absolute;left:1945px;top:1440px;width:811px;height:25px;background:#fff;overflow:hidden}.waiting-progress i{display:block;height:100%;background:#fa5128;transition:width .45s ease}.design-sticker{position:absolute;background-position:center;background-repeat:no-repeat;background-size:contain;will-change:transform}.sticker-car{left:453px;top:81px;width:244px;height:244px;background-image:url(/assets/sticker-badge.webp);animation:sticker-float 2.7s ease-in-out infinite}.sticker-cheer{left:235px;top:1442px;width:256px;height:265px;background-image:url(/assets/sticker-gogogo.webp);animation:cheer-pop 1.9s ease-in-out infinite}.sticker-gun{left:2928px;top:325px;width:199px;height:199px;background-image:url(/assets/sticker-gun.webp);animation:gun-kick 1.45s ease-in-out infinite}
/* RUNNING: dynamic elements replace every variable PSD text and character area. */.race-count{position:absolute;left:2861px;top:144px;width:176px;height:74px;display:flex;align-items:center;justify-content:center;color:#ff9600;font-size:76px;font-style:italic;font-weight:900}.race-timer{position:absolute;left:1368px;top:62px;width:460px;height:175px;display:flex;align-items:center;justify-content:center;padding-right:55px;color:#fff;font-size:112px;font-style:italic;font-weight:900;line-height:1;z-index:3}.race-timer small{position:absolute;right:78px;bottom:28px;font-size:30px;font-style:italic}.race-timer.danger-time{color:#fff;filter:drop-shadow(0 0 18px #f0442f);animation:danger-pulse .65s ease-in-out infinite}.race-list{position:absolute;left:115px;top:286px;width:2973px;height:1412px}.race-row{position:absolute;left:0;top:calc(var(--row) * 177px);width:2973px;height:175px;opacity:.88;transition:transform .35s ease,filter .35s ease}.race-row.leader{filter:drop-shadow(0 0 18px rgba(255,128,0,.55));opacity:1}.race-rank{position:absolute;left:86px;top:43px;width:108px;color:#ffc147;font-size:58px;font-style:italic;font-weight:900}.race-avatar{position:absolute;left:233px;top:36px;width:104px;height:104px;border:8px solid #ffba00;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:var(--avatar-color,#222);color:#fff;font-size:40px;font-weight:900}.race-avatar img,.winner-avatar img,.mobile-avatar img{width:100%;height:100%;object-fit:cover}.race-name{position:absolute;left:370px;top:37px;width:500px;color:#000;font-size:48px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.race-name small{display:block;margin-top:4px;font-size:22px;font-weight:700;color:#6e6e6e}.race-score{position:absolute;right:49px;top:47px;width:205px;text-align:right;color:#ff9600;font-size:58px;font-style:italic}.race-score small{font-size:26px}.race-track{position:absolute;left:2070px;top:4px;width:740px;height:167px}.runner{position:absolute;left:var(--progress);top:2px;width:auto;height:160px;transform:translateX(-50%);filter:drop-shadow(0 12px 8px rgba(116,70,0,.25));transition:left .5s cubic-bezier(.16,.8,.2,1);animation:runner-hop .6s ease-in-out infinite}.race-row:nth-child(even) .runner{animation-delay:-.3s}.dust{position:absolute;left:calc(var(--progress) - 45px);top:152px;width:90px;height:22px;background:radial-gradient(ellipse at center,rgba(255,145,0,.55),rgba(255,145,0,0) 70%);opacity:.8;transition:left .5s}.vacant .runner,.vacant .dust{display:none}.countdown-overlay{position:absolute;inset:0;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(255,216,25,.5);backdrop-filter:blur(8px);color:#17120d}.countdown-overlay small{font-size:62px;font-weight:900}.countdown-overlay b{font-size:380px;font-style:italic;line-height:1;color:#f0442f;text-shadow:16px 16px 0 #fff;animation:countdown-pop .88s cubic-bezier(.17,.89,.32,1.49) infinite}.countdown-overlay span{font-size:44px;font-weight:900;letter-spacing:8px}
/* FINISHED: winner data maps exactly onto the PSD result card. */.winner-avatar-wrap{position:absolute;left:1231px;top:997px;width:103px;height:104px}.winner-avatar{width:104px;height:104px;border:7px solid #ffba00;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:var(--avatar-color,#222);color:#fff;font-size:38px;font-weight:900}.winner-name{position:absolute;left:1367px;top:1027px;width:470px;height:78px;color:#000;font-size:48px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.winner-score{position:absolute;left:1810px;top:1015px;width:200px;text-align:right;color:#000;font-size:58px;font-weight:900}.winner-score small{font-size:28px}.winner-spark{position:absolute;width:22px;height:180px;background:#fff;filter:drop-shadow(0 0 18px #fff);opacity:.7}.spark-a{left:1130px;top:855px;transform:rotate(55deg);animation:spark .9s ease-out infinite}.spark-b{left:2070px;top:850px;transform:rotate(-55deg);animation:spark .9s ease-out infinite .35s}
/* Mobile and admin share the exact 750×1334 visual coordinate system. */.mobile-stage,.admin-stage{position:absolute;left:50%;top:50%;width:750px;height:1334px;transform:translate(-50%,-50%) scale(min(calc(100vw / 750),calc(100vh / 1334)));transform-origin:center;overflow:hidden;background:#ffd819}.mobile-glow{position:absolute;inset:0;background:radial-gradient(circle at 50% 35%,rgba(255,255,255,.22),transparent 40%);pointer-events:none}.mobile-panel{position:absolute;left:70px;right:70px;top:232px;min-height:770px;padding:54px 48px 42px;border:2px solid rgba(255,255,255,.78);border-radius:24px;background:rgba(255,186,16,.86);box-shadow:0 30px 80px rgba(125,77,0,.2);text-align:center;backdrop-filter:blur(8px)}.mobile-panel:before,.admin-panel:before{content:"";position:absolute;left:18px;right:18px;top:18px;height:7px;background:#f0442f}.status-chip{display:inline-flex;padding:10px 24px;border-radius:2px;background:#f0442f;color:#fff;font-size:24px;font-weight:900;letter-spacing:2px}.mobile-panel h1{margin:42px 0 22px;color:#17120d;font-size:66px;line-height:1.08;font-weight:900}.mobile-panel p{margin:18px auto 36px;max-width:520px;font-size:29px;line-height:1.65;font-weight:700}.mobile-panel>small{display:block;margin-top:24px;font-size:22px;font-weight:700}.primary-action,.danger-action{width:100%;min-height:92px;padding:20px;border-radius:8px;font-size:34px;font-weight:900}.primary-action{background:#17120d;color:#fff;box-shadow:10px 10px 0 #f0442f}.danger-action{background:#f0442f;color:#fff;box-shadow:10px 10px 0 #17120d}.mobile-avatar{display:grid;width:136px;height:136px;margin:38px auto 10px;border:10px solid #ffba00;border-radius:50%;place-items:center;overflow:hidden;background:var(--avatar-color,#222);color:#fff;font-size:48px;font-weight:900}.waiting-panel h1{margin:18px 0 2px}.mobile-metrics{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:42px}.mobile-metrics span,.result-numbers span{padding:25px 14px;border:2px solid rgba(255,255,255,.85);background:rgba(255,255,255,.3)}.mobile-metrics small,.result-numbers small{display:block;font-size:20px;font-weight:700}.mobile-metrics b,.result-numbers b{display:block;margin-top:8px;font-size:34px;font-weight:900}.mobile-countdown{margin:78px auto 30px;font-size:230px;line-height:1;color:#f0442f;font-style:italic;font-weight:900;text-shadow:10px 10px 0 #fff;animation:countdown-pop .88s cubic-bezier(.17,.89,.32,1.49) infinite}.mobile-time{display:flex;align-items:flex-end;justify-content:center;margin:24px auto 12px;color:#f0442f}.mobile-time b{font-size:104px;line-height:1;font-style:italic}.mobile-time small{margin:0 0 12px 10px;font-size:24px;font-weight:900}.shake-core{position:relative;width:270px;height:270px;border:12px solid rgba(255,255,255,.8);border-radius:50%;background:#17120d;color:#fff;box-shadow:0 0 0 15px rgba(240,68,47,.85),0 18px 40px rgba(72,38,0,.3);overflow:hidden;animation:shake-pulse 1.2s ease-in-out infinite}.shake-core i{position:absolute;inset:35px;border:6px solid #ffd819;border-radius:50%;opacity:.5}.shake-core b{position:relative;display:block;font-size:48px}.shake-core span{position:relative;display:block;margin-top:12px;font-size:18px}.score-metrics{grid-template-columns:repeat(3,1fr);margin-top:34px}.score-metrics b{font-size:30px}.score-metrics em,.result-numbers em{font-size:18px;font-style:normal}.fallback-action{margin-top:22px;padding:12px 20px;background:transparent;color:#6e4d00;text-decoration:underline;font-size:20px}.result-panel h1{margin:34px 0 4px;font-size:38px;letter-spacing:9px;color:#fff}.result-panel p{margin:5px auto 20px;font-size:34px}.result-numbers{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px}.result-numbers b{font-size:48px}.connection-pill{position:absolute;left:50%;bottom:66px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:10px 20px;border-radius:99px;background:rgba(23,18,13,.78);color:#fff;font-size:18px;font-weight:800}.connection-pill i{width:12px;height:12px;border-radius:50%;background:#ffba00}.connection-pill.online i{background:#31c58f}.connection-pill.offline i{background:#f0442f}
/* Admin controls follow the same mobile visual tokens and backdrop. */.admin-panel{position:absolute;left:48px;right:48px;top:52px;bottom:52px;padding:44px 38px 28px;border:2px solid rgba(255,255,255,.82);border-radius:18px;background:rgba(255,186,16,.92);box-shadow:0 30px 90px rgba(99,61,0,.28);overflow:auto;backdrop-filter:blur(8px)}.admin-panel header{display:flex;justify-content:space-between;align-items:flex-end;padding:20px 0 24px;border-bottom:3px solid #17120d}.admin-panel header span{font-size:42px;font-weight:900}.admin-panel header strong{padding:8px 14px;background:#f0442f;color:#fff;font-size:20px}.admin-status-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:22px 0}.admin-status-grid span{padding:15px;background:rgba(255,255,255,.34);border-left:7px solid #f0442f}.admin-status-grid small{display:block;font-size:16px}.admin-status-grid b{display:block;margin-top:5px;font-size:23px}.admin-actions button{min-height:68px;font-size:27px}.admin-actions p{margin:9px 5px 20px;font-size:17px;line-height:1.5;font-weight:700}.test-tools{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;padding:17px 0;border-top:2px dashed rgba(23,18,13,.35);border-bottom:2px dashed rgba(23,18,13,.35)}.test-tools span{grid-column:1/-1;font-weight:900}.test-tools button{padding:13px 7px;background:#7757e6;color:#fff;font-weight:900}.admin-links{display:flex;gap:9px;margin-top:18px}.admin-links a,.admin-links button{flex:1;padding:13px 8px;background:#17120d;color:#fff;text-align:center;text-decoration:none;font-size:16px;font-weight:900}.admin-history{margin-top:20px}.admin-history h3{margin:0 0 10px}.admin-history>div{display:grid;grid-template-columns:1fr 1.4fr 1.5fr;gap:8px;padding:7px 0;border-top:1px solid rgba(23,18,13,.2);font-size:14px}.history-empty{display:block!important;text-align:center;padding:18px!important}
.toast{position:fixed;left:50%;bottom:8vh;z-index:9999;transform:translateX(-50%);max-width:min(86vw,620px);padding:15px 22px;border-radius:8px;background:rgba(23,18,13,.94);color:#fff;text-align:center;font-size:17px;font-weight:800;box-shadow:0 12px 35px rgba(0,0,0,.3)}
@keyframes page-in{from{opacity:0;filter:blur(10px);transform:translate(-50%,-50%) scale(calc(min(calc(100vw / 3200),calc(100vh / 1792)) * .97))}to{opacity:1;filter:blur(0)}}@keyframes qr-scan{0%,100%{transform:translateY(0)}50%{transform:translateY(717px)}}@keyframes qr-breathe{0%,100%{box-shadow:0 0 0 8px rgba(49,197,143,.08),0 0 38px rgba(49,197,143,.22)}50%{box-shadow:0 0 0 13px rgba(49,197,143,.18),0 0 82px rgba(49,197,143,.55)}}@keyframes sticker-float{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-22px) rotate(5deg)}}@keyframes cheer-pop{0%,100%{transform:scale(.94) rotate(-4deg)}50%{transform:scale(1.08) rotate(3deg)}}@keyframes gun-kick{0%,100%{transform:translate(0,0) rotate(-4deg)}50%{transform:translate(-16px,8px) rotate(-11deg)}}@keyframes runner-hop{0%,100%{transform:translate(-50%,0) rotate(-2deg)}50%{transform:translate(-50%,-16px) rotate(3deg)}}@keyframes countdown-pop{0%{transform:scale(.25) rotate(-10deg);filter:blur(24px);opacity:0}55%{transform:scale(1.12) rotate(2deg);filter:blur(0);opacity:1}100%{transform:scale(1);opacity:1}}@keyframes danger-pulse{50%{transform:scale(1.08);background:#f0442f}}@keyframes spark{0%{opacity:0;transform:scale(.3) rotate(55deg)}45%{opacity:.8}100%{opacity:0;transform:scale(1.4) rotate(55deg)}}@keyframes shake-pulse{50%{transform:rotate(-3deg) scale(1.04);box-shadow:0 0 0 22px rgba(240,68,47,.28),0 18px 40px rgba(72,38,0,.3)}}
@media(max-aspect-ratio:750/1334){.mobile-stage,.admin-stage{transform:translate(-50%,-50%) scale(calc(100vw / 750))}}@media(min-aspect-ratio:751/1334){.mobile-stage,.admin-stage{transform:translate(-50%,-50%) scale(calc(100vh / 1334))}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
