body{margin:0;padding:0;background-color:#111;color:#fff;font-family:"Press Start 2P",monospace;text-align:center}.game-container{display:inline-block;margin-top:30px;padding:10px;background:#000;border:8px solid #3FBEA7;box-shadow:0 0 20px #3fbea7}canvas{display:block}.fretboard{margin-top:15px;padding:5px;display:inline-block;background:#111;border:4px solid #3FBEA7;box-shadow:0 0 10px #3fbea7}.fretboard-row{display:flex}.fretboard-cell{width:50px;height:30px;border:1px solid #555;font-size:10px;display:flex;align-items:center;justify-content:center}.fretboard-cell.active{background:#444;color:#ff0;font-weight:700}button,select{background-color:#3fbea7;color:#000;font-family:"Press Start 2P",monospace;padding:5px 10px;border:none;cursor:pointer;margin:5px;-moz-appearance:none;appearance:none;-webkit-appearance:none}button:hover,select:hover{background-color:#5fd8c0}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:200px;height:6px;background:#333;outline:none;border-radius:5px;margin-left:10px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;background:#3FBEA7;cursor:pointer;border-radius:50%;border:2px solid #0d4740}input[type=range]::-moz-range-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;background:#3FBEA7;cursor:pointer;border:2px solid #0d4740;border-radius:50%}input[type=range]::-ms-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;background:#3FBEA7;cursor:pointer;border:2px solid #0d4740;border-radius:50%}@font-face{font-family:Pixel;src:url(/fonts/PressStart2P.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Pixel;src:url(/fonts/PressStart2P.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}html,body{margin:0;padding:0;background:#090A12!important;color:#e9fff9;font-family:Pixel,monospace;font-synthesis:none;-webkit-font-smoothing:none}body.real4k-display{overflow:hidden;width:100vw;height:100vh}#root,.appRoot,.menuRoot{font-family:Pixel,monospace;letter-spacing:.5px}h1,h2,h3,h4,b,strong{font-weight:700;letter-spacing:1px}button,input,select,textarea{font-family:inherit}@media screen and (min-width: 3840px) and (min-height: 2160px){.appRoot.real4k-mode{transform:scale(1.5);transform-origin:top left;width:66.67%;height:66.67%}body{overflow:hidden}}body.mic-suspended *{backface-visibility:hidden;transform:translateZ(0);will-change:transform,opacity}body.mic-suspended .pixel-transition{animation-timing-function:steps(1,end)!important;transform:translateZ(0)}body.mic-suspended .moving-element{image-rendering:pixelated;image-rendering:crisp-edges}body.mic-suspended .countdown-overlay{will-change:transform,opacity;transform:translateZ(0)}.shake{animation:shake .4s cubic-bezier(.36,.07,.19,.97) both}@keyframes shake{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(4px)}30%,50%,70%{transform:translate(-8px)}40%,60%{transform:translate(8px)}}.modal-start{display:flex;flex-direction:column;align-items:center;padding:0;background:transparent;color:#fff;border-radius:0;max-width:100%;width:100%;margin:0;font-family:Pixel,monospace;box-sizing:border-box}.modal-title{font-size:clamp(1.8rem,3vw,3rem);margin-bottom:1rem;text-align:center}.modal-label{font-size:1.2rem;margin-bottom:.3rem}.modal-input{width:80%;padding:.5rem;margin-bottom:1.5rem;border-radius:6px;border:2px solid #3fbea7;font-size:1rem;font-family:"Press Start 2P",Pixel,monospace;letter-spacing:.5px}.pixel-font{font-family:"Press Start 2P",Pixel,monospace!important;letter-spacing:.5px}select{font-family:"Press Start 2P",Pixel,monospace;font-size:1.05rem;text-align:center;letter-spacing:.5px;border:none;padding-top:2px}.modal-subtitle{font-size:1.4rem;margin-bottom:.8rem}.levels-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.9rem 1rem;justify-items:center;width:100%;max-width:560px}.level-btn{padding:.75rem .9rem;width:100%;font-size:clamp(.95rem,1.4vw,1.15rem);border-radius:10px;border:none;cursor:pointer;transition:transform .18s ease,background .28s ease,box-shadow .28s;box-shadow:0 2px 4px #0006}.level-btn:disabled{cursor:not-allowed}.level-unlocked{background-color:#2ecc71;color:#fff}.level-locked{background-color:#e74c3c;color:#fff}.level-btn:hover:not(:disabled){transform:scale(1.05)}.donate-btn{grid-column:1 / -1;padding:.85rem 1.1rem;font-size:clamp(.95rem,1.5vw,1.15rem);font-weight:600;background:#ff6aa2;color:#fff;border:none;border-radius:10px;cursor:pointer;width:100%;box-shadow:0 3px 10px #00000073,0 0 0 2px #ffffff14;display:flex;align-items:center;justify-content:center;gap:8px;letter-spacing:.5px;text-decoration:none;transition:transform .25s ease,filter .25s ease}.donate-btn:hover{transform:translateY(-2px) scale(1.035);filter:brightness(1.08)}.donate-btn:active{transform:translateY(1px) scale(.98)}.donate-icon{width:22px;height:22px;image-rendering:pixelated;filter:drop-shadow(0 0 4px rgba(255,120,150,.7))}@media (min-width: 520px){.donate-btn{width:calc(100% - 3rem);justify-self:center}}.donate-note{margin-top:.9rem;font-size:.75rem;opacity:.6;text-align:center;max-width:480px}@media (min-width: 1200px) and (max-width: 1919px){.modal-start{padding:4vh 6vw;max-width:1200px;margin:0 auto}}@media (max-width: 1199px){.modal-start{padding:3vh 4vw;max-width:95%}}@media (max-width: 900px){.modal-start{padding:2vh 3vw;width:100%;height:100%}.modal-title{font-size:clamp(1.8rem,5vw,2.8rem);margin-bottom:1rem}.modal-subtitle{font-size:1.2rem;margin-top:.6rem}.modal-input{width:100%;margin-bottom:1.2rem}.levels-container{gap:.7rem .8rem;max-width:100%}.level-btn{padding:.7rem .8rem;font-size:.85rem;border-radius:8px}.donate-btn{padding:.8rem 1rem;font-size:.85rem}.donate-note{font-size:.65rem}}@media (max-width: 600px){.modal-start{padding:1.5vh 2vw}.modal-title{font-size:clamp(1.5rem,6vw,2.2rem)}}.leaderboard{background:linear-gradient(145deg,rgba(0,0,0,.85),rgba(15,35,40,.88));padding:.75rem .75rem .9rem;border-radius:14px;width:260px;font-family:"Press Start 2P",monospace;color:#fff;box-shadow:0 2px 6px #0009,0 0 0 1px #ffffff0f;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.leaderboard-wide{width:min(1280px,100%)!important;min-width:auto;max-width:none;height:320px;padding:1.5rem;box-sizing:border-box;border:4px solid #3FBEA7!important;box-shadow:0 0 10px #3fbea7,0 2px 6px #0009,0 0 0 1px #ffffff0f;border-radius:10px!important}.leaderboard-wide .leaderboard-list-container{max-height:240px}.leaderboard-header-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:.4rem}.leaderboard-title{font-size:.95rem;margin:0;color:#3fbea7;text-shadow:0 0 4px #1d6b5c}.lb-reset,.lb-refresh{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#eee;font-family:inherit;font-size:.7rem;padding:.15rem .45rem;border-radius:6px;cursor:pointer;transition:background .15s,color .15s,transform .15s}.lb-refresh{color:#3fbea7;border-color:#3fbea74d}.lb-reset:hover,.lb-refresh:hover{background:rgba(255,255,255,.18);color:#fff}.lb-refresh:hover{border-color:#3fbea780}.lb-reset:active,.lb-refresh:active{transform:translateY(1px)}.lb-refresh:disabled{opacity:.5;cursor:not-allowed;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.leaderboard-columns{display:grid;grid-template-columns:2.2rem 1.8fr 1.2fr 1.2fr;font-size:.6rem;letter-spacing:.5px;opacity:.75;padding:0 .2rem .4rem;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:.5rem;column-gap:.6rem}.leaderboard-columns span{display:block}.leaderboard-columns span:first-child{text-align:center}.leaderboard-columns span:not(:first-child){text-align:left}.leaderboard-list-container{max-height:400px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#3fbea7 rgba(255,255,255,.1)}.leaderboard-list-container::-webkit-scrollbar{width:6px}.leaderboard-list-container::-webkit-scrollbar-track{background:rgba(255,255,255,.05);border-radius:3px}.leaderboard-list-container::-webkit-scrollbar-thumb{background:#3fbea7;border-radius:3px}.leaderboard-list-container::-webkit-scrollbar-thumb:hover{background:#4dceb7}.leaderboard-list{list-style:none;padding:0;margin:0}.load-more-btn{width:100%;margin-top:.5rem;padding:.4rem;background:rgba(63,190,167,.1);border:1px solid rgba(63,190,167,.3);color:#3fbea7;font-family:inherit;font-size:.6rem;border-radius:6px;cursor:pointer;transition:all .2s}.load-more-btn:hover{background:rgba(63,190,167,.2);border-color:#3fbea780}.leaderboard-item.row{display:grid;grid-template-columns:2.2rem 1.8fr 1.2fr 1.2fr;align-items:center;column-gap:.6rem;margin-bottom:.18rem;padding-top:.13rem;padding-bottom:.13rem}.leaderboard-item{padding:.18rem .2rem;font-size:.64rem;line-height:1.1}.leaderboard-item.row:nth-child(odd){background:rgba(255,255,255,.03)}.leaderboard-item.row:hover{background:rgba(255,255,255,.08)}.leaderboard-item.empty{text-align:center;color:#aaa}.rank{color:#f1c40f;font-weight:600;text-align:center}.name{flex:1;text-align:left}.score{text-align:left;font-variant-numeric:tabular-nums;padding-left:.1rem}.accuracy{text-align:left;font-variant-numeric:tabular-nums;color:#3fbea7;padding-left:.1rem}@media (min-aspect-ratio: 16/9){.leaderboard{width:300px}}@media (max-width: 1660px){.leaderboard{width:100%;box-sizing:border-box}.leaderboard-columns,.leaderboard-item.row{grid-template-columns:1.4rem 1fr 3rem 3rem}}@media (max-width: 900px){.leaderboard{font-size:90%}.leaderboard-item{font-size:.58rem}}.fret-cell.obstacle{background:#3FBEA7!important;color:#fff!important;border:2px solid #3FBEA7!important;font-weight:700;box-shadow:0 0 8px #3fbea799}.fretboard-wrap{width:min(1280px,100%);margin:12px auto 0;padding:10px;background:#0b0b0b;border:4px solid #3FBEA7;border-radius:10px;box-shadow:0 0 10px #3fbea7;color:#e7fdf8;font-family:"Press Start 2P",monospace,system-ui,-apple-system,Segoe UI,Roboto,Arial}@media (max-width: 1500px){.fretboard-cols,.fret-row{grid-template-columns:46px repeat(13,minmax(36px,1fr))}.fret-cell{padding:4px 2px;font-size:10px}.fret-row-label{font-size:10px}}@media (max-width: 1200px){.fretboard-wrap{padding:8px}.fretboard-cols,.fret-row{grid-template-columns:40px repeat(13,minmax(32px,1fr));gap:3px}.fret-cell,.fret-row-label{font-size:9px;border-radius:4px}.fretboard-legend{flex-wrap:wrap;gap:10px;font-size:10px}}@media (max-width: 900px){.fretboard-cols,.fret-row{grid-template-columns:34px repeat(13,minmax(28px,1fr))}.fret-cell{font-size:8px;padding:3px 2px}}@media (max-width: 700px){.fretboard-wrap{width:100%}.fretboard-cols,.fret-row{grid-template-columns:30px repeat(13,minmax(24px,1fr))}.fret-cell{font-size:7px}}.fretboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:12px}.fretboard-cols{display:grid;grid-template-columns:56px repeat(13,minmax(44px,1fr));gap:4px;margin-bottom:4px;color:#8fd2c6;font-size:11px}.fretboard-colstub{text-align:left;opacity:.8}.fretboard-col{text-align:center;opacity:.8}.fretboard-grid{display:grid;grid-template-rows:repeat(6,auto);gap:4px}.fret-row{display:grid;grid-template-columns:56px repeat(13,minmax(44px,1fr));gap:4px;background:transparent;padding:2px 0}.active-row{background:rgba(63,190,167,.12)}.fret-row-label{display:flex;align-items:center;justify-content:center;border:1px dashed #3FBEA7;color:#c8fff2;font-size:12px;border-radius:6px}.fret-cell{text-align:center;border:1px solid #444;border-radius:6px;padding:6px 4px;color:#ddd;font-size:12px;background:#121212;transition:background .12s ease,color .12s ease,transform 80ms ease;-webkit-user-select:none;user-select:none}.fret-cell.target{background:#1c5e57;color:#eafffa;font-weight:700}.fret-cell.detected{color:#ffd34d;font-weight:700;transform:scale(1.04);box-shadow:0 0 0 1px #ffd34d inset}.fretboard-legend{display:flex;gap:16px;align-items:center;margin-top:10px;font-size:11px;color:#cdeee8}.legend-item{display:inline-flex;align-items:center;gap:6px}.legend-box{width:14px;height:14px;border-radius:3px;display:inline-block;border:1px solid #333}.legend-active{background:rgba(63,190,167,.3)}.legend-target{background:#1c5e57}.legend-detected{background:#ffd34d}.legend-box.legend-obstacle{background:#3FBEA7;border:2px solid #3FBEA7}@media (min-width: 1200px){.fretboard-cell,.fretboard-header{font-size:13px}}.bossPixelTrans{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;z-index:15;display:block;background:#000}.bossPixelTrans__snap{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;filter:none}@keyframes snapDim{0%{filter:none;opacity:1}to{filter:brightness(.5);opacity:1}}.bossPixelTrans__pixels{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.bossPixelTrans__cell{position:absolute;transform:scale(0);animation:bossPixelGrow var(--ad, .4s) cubic-bezier(.55,.16,.26,.99) forwards;animation-delay:var(--d, 0ms);border-radius:2px}@keyframes bossPixelGrow{0%{transform:scale(0);opacity:0}55%{opacity:1}to{transform:scale(1);opacity:1}}.bossPixelTrans.finished .bossPixelTrans__snap{animation:snapFadeOut .48s ease forwards}@keyframes snapFadeOut{0%{opacity:1}to{opacity:0}}.pixelTransitionFrame{display:none}