:root{--bg:#181735;--panel:#211f4a;--purple:#6e3ed1;--track-edge:#9b83e8;--text:#fff;--muted:#b8b3d5;--gold:#ffbd27;--shadow:0 18px 48px rgba(5,4,22,.45)}
*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;background:radial-gradient(circle at 50% 18%,#302b67 0,#17162f 42%,#101024 100%);color:var(--text);font-family:Arial Rounded MT Bold,Arial,sans-serif}.page-shell{width:min(820px,100%);margin:auto;padding:18px}.game-phone{position:relative;min-height:min(940px,calc(100vh - 36px));background:radial-gradient(circle at 50% 34%,#342d7a,#1b193f 58%,#151431);border:1px solid rgba(255,255,255,.08);border-radius:36px;box-shadow:0 35px 90px rgba(0,0,0,.38),inset 0 0 90px rgba(112,61,225,.08);overflow:hidden}.hud{height:104px;padding:24px 26px;display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative;z-index:20}.hud-pill{min-width:108px;height:48px;border:3px solid #854af1;border-radius:16px;background:#24214d;box-shadow:0 0 0 2px #382a74,0 0 14px rgba(135,73,255,.35),inset 0 3px rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;gap:8px;text-shadow:0 2px 2px #090818}.hud-pill span{font-size:.65rem;color:#bcb4e3;letter-spacing:.08em}.hud-pill strong{font-size:1.1rem}.progress-pill{min-width:124px}.progress-pill .cube-icon{font-size:1.7rem;color:#fff}.hud-actions{display:flex;gap:8px}.round-button{width:48px;height:48px;border-radius:15px;border:3px solid #b49cff;background:linear-gradient(#8b50ff,#5424b8);color:#fff;font:900 1.45rem Arial;box-shadow:inset 0 3px rgba(255,255,255,.3),0 4px 0 #342069;cursor:pointer}.round-button:hover,.difficulty-button:hover,.play-button:hover,.power-button:hover{filter:brightness(1.12)}.round-button:active,.play-button:active,.power-button:active{transform:translateY(2px)}button:focus-visible{outline:3px solid #fff;outline-offset:3px}.arena{height:660px;position:relative;margin:0 12px}.yard-glow{position:absolute;inset:55px 75px 125px;border-radius:45%;background:radial-gradient(circle,rgba(114,73,227,.22),transparent 70%);filter:blur(8px)}.belt{position:absolute;background:linear-gradient(90deg,#342964,#493b86 50%,#342964);border:4px solid var(--track-edge);box-shadow:inset 0 0 0 5px #4d3b8c,0 0 0 3px #241b4d,0 8px 18px rgba(0,0,0,.35),0 0 24px rgba(135,94,245,.18)}.u-left,.u-right{top:28px;bottom:76px;width:58px}.u-left{left:0;border-radius:22px 4px 4px 36px}.u-right{right:0;border-radius:4px 22px 36px 4px}.u-bottom{left:25px;right:25px;bottom:40px;height:72px;border-radius:0 0 42px 42px;border-top:0}.belt:after{content:"";position:absolute;inset:8px;border:2px dashed rgba(197,186,255,.13);border-radius:inherit}.belt-lights{position:absolute;top:55px;bottom:125px;width:12px;background:repeating-linear-gradient(180deg,transparent 0 32px,rgba(197,186,255,.2) 32px 41px);z-index:2}.left-lights{left:23px}.right-lights{right:23px}.truck-yard{position:absolute;left:82px;right:82px;top:42px;bottom:125px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 16px;align-content:center;z-index:5}.truck{min-width:0;height:76px;position:relative;filter:drop-shadow(0 7px 4px rgba(4,3,20,.35))}.truck-body{height:64px;background:linear-gradient(#8069c2,#503989);border:3px solid #3e2c76;border-radius:17px 13px 12px 16px;padding:7px 8px 7px 10px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;overflow:hidden;position:relative;box-shadow:inset 0 4px rgba(255,255,255,.17),inset 0 -6px rgba(31,18,71,.28)}.truck:after,.truck:before{content:"";position:absolute;bottom:0;width:22px;height:10px;border-radius:50%;background:#302852;border:4px solid #615982;z-index:8}.truck:before{left:22px}.truck:after{right:22px}.cargo-slot{border-radius:5px;background:#30285d;border:2px solid rgba(255,255,255,.1);min-width:0;position:relative}.cargo-block{border:0;width:100%;height:100%;border-radius:5px;box-shadow:inset 0 -6px rgba(0,0,0,.16),inset 0 3px rgba(255,255,255,.35);cursor:pointer;position:relative}.cargo-block.exposed{animation:ready 1.35s ease-in-out infinite}.cargo-block:after{content:"";position:absolute;inset:6px;border:1px solid rgba(255,255,255,.28);border-radius:3px}.mystery{display:grid;place-items:center;background:linear-gradient(145deg,#5c75a8,#3f507b);color:rgba(255,255,255,.22);font-size:1.25rem;font-weight:900;box-shadow:inset 0 3px rgba(255,255,255,.1)}.empty{background:rgba(23,19,58,.42);border:2px dashed rgba(255,255,255,.1)}.truck-tag{position:absolute;left:8px;top:-9px;background:#312762;border:2px solid #684fb5;border-radius:8px;padding:2px 7px;font-size:.58rem;color:#c9c3e9;z-index:8}.truck.bonus .truck-tag{border-color:#ffca49;color:#ffe59a}.truck-cover{position:absolute;inset:-5px -5px 4px -5px;border-radius:19px;z-index:9;display:grid;place-items:center;animation:coverIn .45s cubic-bezier(.2,.85,.25,1.2) both;box-shadow:inset 0 -10px rgba(0,0,0,.13),inset 0 5px rgba(255,255,255,.28),0 5px 0 rgba(0,0,0,.2),0 0 20px rgba(255,255,255,.08)}.truck-cover span{font-size:2rem;border:3px solid rgba(255,255,255,.28);border-radius:10px;padding:0 8px;color:rgba(255,255,255,.55)}.belt-block{position:absolute;width:38px;height:38px;border-radius:8px;z-index:12;box-shadow:inset 0 -6px rgba(0,0,0,.17),inset 0 3px rgba(255,255,255,.35),0 5px 8px rgba(0,0,0,.35),0 0 13px var(--block-glow);transform:translate(-50%,-50%);transition:left .06s linear,top .06s linear}.fragment{position:absolute;z-index:40;width:10px;height:10px;border-radius:2px;pointer-events:none;box-shadow:inset 0 2px rgba(255,255,255,.35),0 2px 4px rgba(0,0,0,.3)}.fragment.out{animation:fragmentOut .46s ease-out forwards}.fragment.in{animation:fragmentIn .55s cubic-bezier(.2,.7,.2,1) forwards}.start-panel{position:absolute;z-index:30;inset:30px 67px 92px;background:linear-gradient(180deg,rgba(41,36,91,.98),rgba(27,24,65,.98));border:3px solid #6c48c5;border-radius:28px;box-shadow:var(--shadow),inset 0 2px rgba(255,255,255,.12);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;transition:.25s}.start-panel.hidden{opacity:0;pointer-events:none;transform:scale(.96)}.start-cube,.win-cube{width:70px;height:70px;border-radius:20px;background:linear-gradient(#8f55ff,#5824bf);border:4px solid #bca4ff;display:grid;place-items:center;font-size:3rem;margin-bottom:14px;box-shadow:0 8px 0 #38206f}.start-panel h1{font-size:clamp(1.7rem,6vw,2.5rem);margin:8px 0}.start-panel p{margin:0 0 22px;color:var(--muted);font-size:1rem}.difficulty{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;width:100%;margin-bottom:18px}.difficulty-button{border:2px solid #584395;background:#2b265d;color:#d5cff1;border-radius:12px;padding:10px 4px;font:800 .78rem Arial;cursor:pointer}.difficulty-button small{display:block;font-size:.62rem;margin-top:4px;color:#9e96c3}.difficulty-button.active{border-color:var(--gold);background:#5630ac;color:#fff;box-shadow:0 0 14px rgba(255,189,39,.18)}.difficulty-button.active small{color:#ffda7b}.play-button{border:3px solid #ffd057;background:linear-gradient(#8e4fff,#5523be);box-shadow:inset 0 3px rgba(255,255,255,.25),0 5px 0 #32186f;color:#fff;border-radius:15px;padding:12px 30px;font:900 1rem Arial;cursor:pointer;min-width:150px}.power-bar{height:76px;display:flex;justify-content:center;gap:18px;align-items:center;padding:5px 16px}.power-button{position:relative;min-width:138px;height:58px;border:3px solid #ffca49;border-radius:18px;background:linear-gradient(#864bf7,#5322b9);box-shadow:inset 0 3px rgba(255,255,255,.3),0 5px 0 #32186f;color:#fff;display:grid;grid-template-columns:48px 1fr;align-items:center;padding:2px 28px 2px 7px;cursor:pointer}.power-button:disabled{filter:grayscale(.65);opacity:.48;cursor:not-allowed}.power-icon{font-size:2rem;line-height:1}.truck-plus{position:relative}.truck-plus i{font-style:normal;font-size:1rem;position:absolute;right:0;bottom:-3px;color:#ffdb67}.power-name{text-align:left;font-size:.72rem}.power-button b{position:absolute;right:-7px;bottom:-6px;min-width:25px;height:25px;border-radius:50%;background:#2daf63;border:3px solid #d9ffe7;display:grid;place-items:center;font-size:.7rem}.game-footer{height:74px;margin:0 20px 14px;background:#211e49;border:2px solid #4c3b88;border-radius:19px;display:grid;grid-template-columns:100px 1fr 100px;align-items:center;text-align:center;box-shadow:inset 0 2px rgba(255,255,255,.07)}.footer-stat span{display:block;font-size:.56rem;letter-spacing:.12em;color:#9189b9}.footer-stat strong{font-size:1rem}.status{color:#c9c3e1;font-size:.8rem;padding:0 8px}.leaderboard-card{margin:14px auto 0;width:min(720px,100%);background:#201e45;border:1px solid #4a3b82;border-radius:18px;padding:16px 20px;display:flex;justify-content:space-between;gap:18px;align-items:center}.leaderboard-card span{font-size:.65rem;letter-spacing:.1em;color:#ad9bdc;font-weight:900}.leaderboard-card p{font-size:.78rem;color:#8f89ad;margin:4px 0 0}#mis-leaderboard{min-width:50%}dialog{width:min(480px,calc(100% - 28px));border:3px solid #7653cd;border-radius:24px;background:linear-gradient(#2b275e,#1d1a43);color:#fff;padding:28px;box-shadow:0 30px 80px rgba(0,0,0,.55)}dialog::backdrop{background:rgba(8,7,24,.75);backdrop-filter:blur(5px)}.dialog-x{position:absolute;right:14px;top:12px;border:0;background:transparent;color:#bfb7dd;font-size:1.7rem;cursor:pointer}.dialog-kicker{color:#a98cf3;font-size:.67rem;letter-spacing:.15em;font-weight:900}dialog h2{font-size:1.7rem;margin:6px 0 16px}dialog ol{padding-left:20px;color:#c7c1df;line-height:1.5}dialog li+li{margin-top:8px}.result-dialog{text-align:center}.win-cube{margin:0 auto 18px}.result-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 22px}.result-stats div{background:#171532;border:1px solid #483878;border-radius:12px;padding:12px}.result-stats span{display:block;color:#8f87b3;font-size:.6rem}.result-stats strong{font-size:1.05rem}@keyframes ready{50%{transform:translateY(-3px);filter:brightness(1.15)}}@keyframes coverIn{from{opacity:0;transform:translateY(-28px) scale(.92)}to{opacity:1;transform:none}}@keyframes fragmentOut{from{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) rotate(var(--rot)) scale(.2);opacity:0}}@keyframes fragmentIn{from{transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) rotate(var(--rot)) scale(.15);opacity:0}45%{opacity:1}to{transform:translate(-50%,-50%) rotate(0) scale(1);opacity:0}}
@media(max-width:600px){.page-shell{padding:0}.game-phone{border-radius:0;border:0;min-height:100vh}.hud{height:90px;padding:18px 14px}.hud-pill{min-width:82px;height:44px}.progress-pill{min-width:102px}.round-button{width:44px;height:44px}.arena{height:calc(100vh - 250px);min-height:460px;margin:0 5px}.truck-yard{left:58px;right:58px;top:32px;bottom:105px;gap:8px}.truck{height:62px}.truck-body{height:54px;padding:6px;gap:2px}.u-left,.u-right{width:46px;bottom:65px}.u-bottom{left:19px;right:19px;bottom:30px;height:62px}.left-lights{left:18px}.right-lights{right:18px}.start-panel{inset:28px 47px 80px;padding:18px}.difficulty{grid-template-columns:1fr}.difficulty-button small{display:none}.power-bar{height:72px}.power-button{min-width:126px;height:54px}.game-footer{height:68px;margin:0 10px 10px;grid-template-columns:82px 1fr 82px}.leaderboard-card{border-radius:0;margin:0;flex-direction:column;align-items:flex-start}#mis-leaderboard{width:100%}}
.belt-particle{position:absolute;left:0;top:0;z-index:12;border-radius:40% 55% 45% 52%;box-shadow:inset 0 2px rgba(255,255,255,.42),0 0 8px var(--particle-glow),0 3px 4px rgba(0,0,0,.3);pointer-events:none;will-change:transform;contain:layout paint}.lock-cover,.completed-cover{position:absolute;inset:-5px -5px 4px;border-radius:19px;z-index:10;display:grid;place-items:center}.lock-cover{background:linear-gradient(180deg,color-mix(in srgb,var(--cover),white 10%),var(--cover));box-shadow:inset 0 5px rgba(255,255,255,.3),inset 0 -12px var(--cover-dark),0 7px 0 rgba(0,0,0,.18),0 0 18px color-mix(in srgb,var(--cover),transparent 50%)}.lock-cover span{width:48px;height:44px;display:grid;place-items:center;border-radius:11px;background:color-mix(in srgb,var(--cover-dark),transparent 20%);border:3px solid color-mix(in srgb,var(--cover),white 18%);font-size:2rem;color:rgba(255,255,255,.4);text-shadow:0 2px rgba(0,0,0,.2)}.lock-cover.opening{animation:unlockCover .65s cubic-bezier(.4,0,.2,1) forwards}.completed-cover{background:linear-gradient(#785fba,#49357f);border:3px solid #8d74cf;box-shadow:inset 0 5px rgba(255,255,255,.16),inset 0 -10px rgba(31,19,69,.32),0 6px 0 #30225a}.completed-cover span{width:48px;height:40px;display:grid;place-items:center;border-radius:10px;background:#453477;border:3px solid #927bd0;color:#cfc6ec;font-size:1.55rem;text-shadow:0 2px #251a4e}.truck.complete{filter:drop-shadow(0 7px 4px rgba(4,3,20,.35)) saturate(.8)}@keyframes unlockCover{0%{transform:none;opacity:1}45%{transform:translateY(-12px) scale(1.04);opacity:1}100%{transform:translateY(-70px) scale(.82);opacity:0}}
@media(max-width:380px){.hud-actions{gap:4px}.round-button{width:40px}.truck-yard{left:51px;right:51px}.truck-tag{display:none}.start-panel{inset:18px 38px 70px}.start-cube{width:56px;height:56px;font-size:2.4rem}.start-panel p{font-size:.88rem}}
.truck-nose{position:absolute;top:12px;width:20px;height:39px;background:linear-gradient(#765eb6,#4b377f);border:3px solid #3d2b70;z-index:4;box-shadow:inset 0 3px rgba(255,255,255,.14)}.truck-nose i{position:absolute;top:7px;width:8px;height:20px;border-radius:3px;background:#99a3cc;box-shadow:inset 0 2px rgba(255,255,255,.45)}.left-facing .truck-nose{left:-8px;border-radius:12px 3px 3px 12px}.left-facing .truck-nose i{left:2px}.right-facing .truck-nose{right:-8px;border-radius:3px 12px 12px 3px}.right-facing .truck-nose i{right:2px}.left-facing .truck-body{direction:rtl;margin-left:5px;border-radius:11px 17px 16px 12px}.left-facing .cargo-slot{direction:ltr}.right-facing .truck-body{margin-right:5px;border-radius:17px 11px 12px 16px}.home-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;margin:2px 0 12px}.home-stats>div{background:linear-gradient(#1c1942,#161431);border:2px solid #4d3b88;border-radius:14px;padding:12px}.home-stats>div>span{display:block;font-size:.6rem;letter-spacing:.12em;color:#968dbd;margin-bottom:5px}.home-stats strong{font-size:1.25rem;display:flex;align-items:center;justify-content:center;gap:6px}.coin-dot{display:inline-block;width:17px;height:17px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#fff2a6 0 10%,#ffd348 18% 48%,#e89513 52%);border:2px solid #ffdf6a;box-shadow:0 0 9px rgba(255,202,54,.45)}.mode-badge{width:100%;padding:9px;border-radius:10px;background:rgba(124,78,231,.18);border:1px solid #6247a6;color:#c6b9ea;font-size:.65rem;letter-spacing:.07em;margin-bottom:17px}.result-actions{display:flex;justify-content:center;gap:10px}.secondary-button{border:2px solid #68549b;background:#211d48;color:#d2cbe8;border-radius:15px;padding:12px 22px;font:800 .9rem Arial;cursor:pointer}.coin-total{margin:-8px 0 18px;color:#aaa2c7;font-size:.85rem}.coin-total span{color:#ffd45c;font-weight:900}
@media(max-width:600px){.hud{padding:18px 10px}.hud-pill{min-width:72px}.progress-pill{min-width:92px}.hud-actions{gap:4px}.round-button{width:38px;height:42px;font-size:1.2rem}.left-facing .truck-nose{left:-6px}.right-facing .truck-nose{right:-6px}}
@media(max-width:380px){.hud-pill{min-width:66px}.progress-pill{min-width:84px}.hud-pill strong{font-size:.95rem}.round-button{width:35px}.result-actions{flex-direction:column}.result-actions button{width:100%}}
.transfer-stream{position:absolute;z-index:35;width:18px;height:18px;border-radius:45%;transform:translate(-50%,-50%);box-shadow:0 0 13px var(--stream-glow),0 0 4px 5px rgba(255,255,255,.18);pointer-events:none;animation:transferIntoTruck .32s cubic-bezier(.2,.7,.25,1) forwards}.transfer-stream:before,.transfer-stream:after{content:"";position:absolute;width:9px;height:9px;border-radius:45%;background:inherit;box-shadow:0 0 8px var(--stream-glow)}.transfer-stream:before{left:-12px;top:3px}.transfer-stream:after{left:-5px;top:-10px}@keyframes transferIntoTruck{0%{transform:translate(-50%,-50%) scale(1);opacity:1}75%{opacity:1}100%{transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(.3);opacity:0}}