:root{--bg:#2f3136;--laneGap:10px;--highway-tilt:24deg;--perspective:600px;--perspective-origin-y:90%;--stage-scale:1;--highway-height:260%;--noteW:92%;--padW:92%;--padAreaH:180px;--c0:#43a047;--c1:#e53935;--c2:#f6b300;--c3:#1e88e5}*{box-sizing:border-box}body.page-game{margin:0;background:var(--bg);overflow:hidden;user-select:none;-webkit-tap-highlight-color:transparent;color:#fff}body.page-game main{height:calc(100dvh - 85px - env(safe-area-inset-top));height:calc(100vh - 85px - env(safe-area-inset-top));bottom:0px}body.page-game div.cmpwrapper:empty,body.page-game div.cmpwrapper,body.page-game div#cmpwrapper.cmpwrapper,body.page-game div#cmpwrapper.cmpwrapper:empty{display:none !important}body.page-game .disco-ball{animation:none !important}body.page-game #countdown{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;pointer-events:none}body.page-game #cd-svg{will-change:transform, opacity}body.page-game .track-progress-bar{height:4px;background:rgba(255,255,255,0.2);border-radius:2px;overflow:hidden}body.page-game .track-progress-fill{height:100%;width:0%;background:rgba(255,255,255,0.9);border-radius:2px;transition:width .15s ease-out}body.page-game .feedback{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,0.55);padding:6px 16px;border-radius:999px;opacity:0;transition:.15s;pointer-events:none;z-index:999}body.page-game .feedback.show{opacity:1}body.page-game .debugHud{position:fixed;left:12px;bottom:12px;z-index:999;background:rgba(0,0,0,0.45);border:1px solid rgba(255,255,255,0.12);color:#fff;padding:8px 10px;border-radius:12px;font:12px/1.35 system-ui;white-space:pre;display:none}body.page-game .game{position:absolute;inset:0;display:flex;justify-content:center;padding-top:60px;overflow:hidden}body.page-game .game::after{content:'';height:100%;width:100%;position:absolute;top:0px;left:0px;height:200px;background:#000000;background:linear-gradient(0deg, rgba(46,18,86,0) 0%, #2e1256 80%)}body.page-game .stage{width:min(640px, 100%);height:100%;position:relative;overflow:visible;perspective:var(--perspective);perspective-origin:50% var(--perspective-origin-y);transform:scale(var(--stage-scale));transform-origin:50% 100%}body.page-game .highway{position:absolute;left:0;right:0;bottom:0;height:var(--highway-height);transform-style:preserve-3d;transform-origin:bottom center;transform:rotateX(var(--highway-tilt));background:linear-gradient(260deg, rgba(0,212,204,0.4) 10%, rgba(90,34,169,0.4) 90%, rgba(241,13,89,0.3) 100%);background-color:#000;overflow:hidden}body.page-game .lanes{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--laneGap);padding:0 10px;z-index:60;pointer-events:none;transform-style:preserve-3d}body.page-game .lane{position:relative;overflow:hidden;pointer-events:none;transform-style:preserve-3d}body.page-game .lane-lines{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--laneGap);padding:0 10px;z-index:40;pointer-events:none}body.page-game .lane-line{position:relative}body.page-game .lane-line::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:5px;background:rgba(255,255,255,0.8);transform:translateX(-50%)}body.page-game .note{position:absolute;left:50%;width:var(--noteW);aspect-ratio:1 / 1;border-radius:999px;transform:translateX(-50%) scaleY(1.4) scaleX(1.4);opacity:0;pointer-events:none}body.page-game .note .obj{position:absolute;bottom:22px;left:50%;transform:translateX(-50%)}body.page-game .lane[data-lane="0"] .note{background:url("../img/game/place/1/a/place_1_a.png") center bottom no-repeat}body.page-game .lane[data-lane="0"] .note.collect{background:url("../img/game/place/1/b/place_1_b.png") center bottom no-repeat}body.page-game .lane[data-lane="1"] .note{background:url("../img/game/place/2/a/place_2_a.png") center bottom no-repeat}body.page-game .lane[data-lane="1"] .note.collect{background:url("../img/game/place/2/b/place_2_b.png") center bottom no-repeat}body.page-game .lane[data-lane="2"] .note{background:url("../img/game/place/3/a/place_3_a.png") center bottom no-repeat}body.page-game .lane[data-lane="2"] .note.collect{background:url("../img/game/place/3/b/place_3_b.png") center bottom no-repeat}body.page-game .lane[data-lane="3"] .note{background:url("../img/game/place/4/a/place_4_a.png") center bottom no-repeat}body.page-game .lane[data-lane="3"] .note.collect{background:url("../img/game/place/4/b/place_4_b.png") center bottom no-repeat}body.page-game .padArea{position:absolute;left:0;right:0;bottom:0;height:var(--padAreaH);display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--laneGap);padding:0 10px 12px;z-index:50}body.page-game .padArea::before{content:'';height:100%;width:100%;position:absolute;bottom:0px;left:0px;height:200px;background:#000000;background:linear-gradient(0deg, #2a2a2a 0%, rgba(42,42,42,0) 80%)}body.page-game .padCell{position:relative;height:100%;display:flex;align-items:flex-end;justify-content:center}body.page-game .pad{width:var(--padW);aspect-ratio:1 / 1;pointer-events:auto;touch-action:manipulation;cursor:pointer;position:relative;transform:scale(1)}body.page-game .padLabel{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);font-weight:900;letter-spacing:.5px;opacity:.85;text-shadow:0 2px 10px rgba(0,0,0,0.6);pointer-events:none}body.page-game .debugOverlay{position:absolute;inset:0;pointer-events:none;z-index:999;display:none}body.page-game .debugLine{position:absolute;left:0;right:0;height:2px;opacity:.95}body.page-game .debugLabel{position:absolute;right:10px;transform:translateY(-50%);font:12px/1.2 system-ui;background:rgba(0,0,0,0.55);color:#fff;padding:3px 6px;border-radius:8px;opacity:.9}body.page-game .modal-backdrop.show{opacity:.8;background-color:black}body.page-game #modal-game-orientation .modal-header{border:none}body.page-game #modal-game-orientation .modal-header h2{font-family:"gilroy-bold";font-size:1.2rem}body.page-game #modal-game-orientation .modal-content{background-color:#fff;border-radius:20px;border-color:transparent;max-width:800px;width:80%;margin:0 auto}body.page-game #modal-game-orientation .modal-content .btn{width:100%;justify-content:center}body.page-game #modal-game-orientation .modal-body{margin-bottom:30px}body.page-game #modal-game-orientation .modal-footer{border:none;margin-bottom:50px}body.page-game .rotation-image{width:100px}body.page-game .modal-dialog{max-width:500px}.gold{--btn-color:#EFBF04;--btn-color-dark:#a88400}.green{--btn-color:#007A3E;--btn-color-dark:#00552b}.red{--btn-color:#CD0405;--btn-color-dark:#8f0001}.purple{--btn-color:#5A22A9;--btn-color-dark:#3b1275}button.pad{appearance:none;border:0;padding:0;cursor:pointer;position:relative;display:block;width:100%;aspect-ratio:1 / 1;border-radius:50%;background:linear-gradient(180deg, #fff 0%, #706e6e 100%);box-shadow:1px 12px 0 0 #000;-webkit-box-shadow:1px 12px 0 0 #000;-moz-box-shadow:1px 12px 0 0 #000;transition:transform .18s ease,box-shadow .18s ease}button.pad::before{content:"";position:absolute;inset:11%;border-radius:50%;background:transparent;box-shadow:inset 0 0 0 .2em var(--btn-color),inset 0 5px 0 #b5b5b5,inset 0 -5px 0 rgba(255,255,255,0)}button.pad::after{content:"";position:absolute;left:0px;top:0px;width:100%;height:100%;border-radius:100%;box-shadow:0 20px 20px 0 #000;-webkit-box-shadow:0 20px 20px 0 #000;-moz-box-shadow:0 20px 20px 0 #000}button.pad.active{transform:translateY(.18em);box-shadow:1px 7px 0 0 #000;-webkit-box-shadow:1px 7px 0 0 #000;-moz-box-shadow:1px 7px 0 0 #000}button.pad.active::before{inset:12.5%;background:radial-gradient(circle at 35% 30%, #d0d0d3 0%, #c2c2c6 40%, #a7a7ac 72%, #8a8a90 100%) !important}button.pad.collect{background:linear-gradient(180deg, var(--btn-color) 0%, var(--btn-color-dark) 100%)}button.pad.collect::before{background:radial-gradient(circle, #fff 0%, rgba(255,255,255,0) 100%);box-shadow:none}button.pad.collect::after{content:'';background:linear-gradient(180deg, var(--btn-color) 0%, var(--btn-color-dark) 100%);position:absolute;width:70%;height:70%;left:15%;top:15%;border-radius:100%;box-shadow:none}.score-pop{position:absolute;pointer-events:none;z-index:20;font-size:62px;transform:translateX(-50%);animation:sPop 1.5s ease-out forwards;color:#fff !important;font-family:var(--font-bold);font-weight:700}@keyframes sPop{0%{opacity:1;top:var(--y)}100%{opacity:0;top:calc(var(--y) - 220px)}}.particle{position:absolute;width:20px;height:20px;border-radius:50%;pointer-events:none;z-index:20;animation:pFly .9s ease-out forwards;color:#fff;background-color:#fff}@keyframes pFly{0%{opacity:1;transform:translate(0, 0) scale(2)}100%{opacity:0;transform:translate(var(--dx), var(--dy)) scale(0)}}@media (max-width:520px){:root{--padAreaH:210px;--noteW:96%;--padW:96%}}@media (max-width:480px){body.page-game button.pad{width:100%;background-size:contain}}