@import"https://fonts.googleapis.com/css2?family=Caveat+Brush&family=Patrick+Hand:wght@400&display=swap";@import"https://fonts.googleapis.com/css2?family=Comic+Neue:wght@400;700&family=Fredoka+One&family=Orbitron:wght@400;700;900&display=swap";*{box-sizing:border-box}body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";background:radial-gradient(ellipse at 20% 20%,#ffffffe6 0,#ffffffe6 22%,#fff0 60%),radial-gradient(ellipse at 80% 25%,#ffffffe6 0,#ffffffe6 18%,#fff0 58%),radial-gradient(ellipse at 30% 70%,#ffffffe6 0,#ffffffe6 20%,#fff0 60%),radial-gradient(ellipse at 75% 80%,#ffffffe6 0,#ffffffe6 15%,#fff0 55%),linear-gradient(#bcd9ff,#9ec4ff 40%,#cfe6ff);background-size:900px 500px,900px 500px,900px 500px,900px 500px,100% 100%;min-height:100vh;overflow-x:hidden;color:#111}h1,h2,h3,.brand-title{font-family:Caveat Brush,Patrick Hand,cursive}.game-menu-body{overflow:hidden;height:100vh;background:transparent}body{cursor:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><circle cx="10" cy="10" r="8" fill="%23ff69b4" stroke="%23fff" stroke-width="2"/></svg>'),auto}.nav-btn:hover,.action-btn:hover,.menu-button:hover{cursor:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><polygon points="10,2 12,8 18,8 13,12 15,18 10,14 5,18 7,12 2,8 8,8" fill="%23ffd700" stroke="%23fff" stroke-width="1"/></svg>'),pointer}body.splash{display:grid;place-items:center}.stage{position:relative;width:min(980px,92vw);height:min(680px,88vh)}.brand-title{position:absolute;top:10px;left:50%;transform:translate(-50%);margin:0;font-size:clamp(64px,10vw,140px);color:#b53434;letter-spacing:2px;text-shadow:0 2px 0 rgba(0,0,0,.05),0 12px 25px rgba(181,52,52,.35);-webkit-user-select:none;user-select:none;pointer-events:none}.panel{position:absolute;top:160px;left:50%;transform:translate(-50%);width:min(740px,92vw);padding:36px 24px 28px;border-radius:6px;background:linear-gradient(180deg,#846aaad9,#6b5398d9),radial-gradient(120% 80% at 50% 30%,#ffffff40,#fff0 70%);box-shadow:0 18px 40px #341a6059,inset 0 0 0 1px #ffffff1f;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:grid;gap:26px;justify-items:center}.wood-btn{display:inline-flex;align-items:center;justify-content:center;width:min(560px,86%);height:110px;border-radius:6px;text-decoration:none;font-family:Caveat Brush,Patrick Hand,cursive;font-size:clamp(36px,6vw,72px);color:#0b0b0b;background:repeating-linear-gradient(90deg,#91ad56f2 0,#91ad56f2 22px,#809c47f2 22px,#809c47f2 44px),linear-gradient(180deg,#ffffff40,#0000000d);box-shadow:0 10px #6a7537,0 16px 24px #00000059,inset 0 0 0 1px #ffffff1f;transition:transform .12s ease,box-shadow .12s ease,filter .2s ease}.wood-btn:hover{transform:translateY(-2px);filter:brightness(1.04)}.wood-btn:active{transform:translateY(6px);box-shadow:0 4px #6a7537,0 8px 16px #00000059,inset 0 0 0 1px #ffffff1f}.mute-badge{position:absolute;left:24px;bottom:24px;width:clamp(72px,10vw,130px);aspect-ratio:1/1;opacity:.9;-webkit-user-select:none;user-select:none}.watermark{position:absolute;right:24px;bottom:18px;font-family:Caveat Brush,Patrick Hand,cursive;font-size:clamp(20px,3.2vw,34px);color:#cf3a3a;text-shadow:0 2px 10px rgba(0,0,0,.15);-webkit-user-select:none;user-select:none}.visitors{position:absolute;left:50%;bottom:18px;transform:translate(-50%);display:inline-flex;gap:10px;align-items:baseline;padding:6px 12px;border-radius:6px;background:#fff9;box-shadow:0 6px 20px #00000026;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:clamp(14px,2vw,16px);color:#333}.visitors .counter-label{font-weight:600;letter-spacing:.4px}.visitors .counter-number{font-weight:700;letter-spacing:2px}.menu-sparkle{display:none!important}.nav-banner{background:transparent;padding:15px 0;text-align:center;border-bottom:none;box-shadow:none;position:sticky;top:0;z-index:1000;overflow:visible;transition:transform .18s ease,opacity .18s ease;will-change:transform,opacity}.nav-banner.nav-auto-hidden{transform:translateY(calc(-100% + 6px));opacity:.05}.nav-banner:hover{transform:translateY(0);opacity:1}.nav-banner:before{content:"";display:none}@keyframes sparkle{0%,to{opacity:.7}50%{opacity:1}}.nav-buttons{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin-top:10px}.nav-btn{background:linear-gradient(45deg,#ff69b4,#00bfff);color:#fff;padding:12px 25px;text-decoration:none;border:3px solid #fff;border-radius:25px;font-family:Fredoka One,cursive;font-size:16px;font-weight:700;text-transform:uppercase;box-shadow:0 4px 8px #0000004d;transition:all .3s ease;position:relative;overflow:hidden}.nav-btn:hover{transform:scale(1.1) rotate(-2deg);box-shadow:0 6px 12px #ff69b499;animation:bounce .6s infinite}@keyframes bounce{0%,to{transform:scale(1.1) rotate(-2deg) translateY(0)}50%{transform:scale(1.1) rotate(-2deg) translateY(-5px)}}.nav-btn.home{background:linear-gradient(45deg,#ff1493,gold)}.nav-btn.game{background:linear-gradient(45deg,#0f0,#ff4500)}.nav-btn.gallery{background:linear-gradient(45deg,#9370db,#ff69b4)}.main-content{padding:40px 20px;text-align:center;position:relative}.main-title{font-size:clamp(2rem,8vw,4rem);color:#cf3a3a;text-shadow:0 2px 0 rgba(0,0,0,.05),0 12px 25px rgba(181,52,52,.25);margin-bottom:30px}.subtitle{font-size:clamp(1rem,4vw,1.5rem);color:#9370db;background:#fffc;padding:10px 20px;border-radius:20px;border:3px dashed #ff69b4;display:inline-block;margin-bottom:40px}.content-section{background:#ffffffe6;border:4px solid #ff69b4;border-radius:20px;padding:30px;margin:30px auto;max-width:800px;box-shadow:0 8px 16px #ff69b44d;position:relative;overflow:hidden}.content-section:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:repeating-linear-gradient(45deg,transparent,transparent 10px,rgba(255,105,180,.1) 10px,rgba(255,105,180,.1) 20px);animation:diagonal-move 10s linear infinite;pointer-events:none}@keyframes diagonal-move{0%{transform:translate(-100px) translateY(-100px)}to{transform:translate(100px) translateY(100px)}}.content-section h2{color:#cf3a3a;font-size:2rem;margin-bottom:20px;text-shadow:0 2px 0 rgba(0,0,0,.05),0 12px 20px rgba(181,52,52,.2)}.content-section p{font-size:1.05rem;color:#333;line-height:1.6;position:relative;z-index:1}.action-buttons{display:flex;justify-content:center;gap:30px;flex-wrap:wrap;margin:40px 0}.action-btn{background:linear-gradient(45deg,#ff4500,gold);color:#fff;padding:20px 40px;text-decoration:none;border:4px solid #fff;border-radius:30px;font-family:Fredoka One,cursive;font-size:1.3rem;font-weight:700;text-transform:uppercase;box-shadow:0 6px 12px #0000004d;transition:all .3s ease;position:relative;overflow:hidden}.action-btn:hover{transform:scale(1.05) rotate(5deg);box-shadow:0 8px 16px #ff450099}.action-btn.play{background:linear-gradient(45deg,#0f0,#32cd32)}.action-btn.explore{background:linear-gradient(45deg,#9370db,#ba55d3)}.action-btn.player{background:linear-gradient(45deg,#ff8c00,#ff1493)}.warning{background:linear-gradient(45deg,#ff6b6b,orange);border:4px dashed #ff0000;border-radius:15px;padding:20px;margin:30px auto;max-width:600px;color:#fff;font-weight:700}.warning h3{font-size:1.5rem;margin-bottom:10px}.floating-element{position:absolute;font-size:2rem;opacity:.6;animation:float-around 15s infinite linear;pointer-events:none;z-index:-1}@keyframes float-around{0%{transform:translateY(100vh) rotate(0)}to{transform:translate(100px,-100px) rotate(360deg)}}.floating-element:nth-child(1){left:10%;animation-delay:0s;color:#ff69b4}.floating-element:nth-child(2){left:20%;animation-delay:2s;color:#00bfff}.floating-element:nth-child(3){left:30%;animation-delay:4s;color:#ff0}.floating-element:nth-child(4){left:40%;animation-delay:6s;color:#ff1493}.floating-element:nth-child(5){left:50%;animation-delay:8s;color:#9370db}.floating-element:nth-child(6){left:60%;animation-delay:10s;color:#0f0}.floating-element:nth-child(7){left:70%;animation-delay:12s;color:#ff4500}.floating-element:nth-child(8){left:80%;animation-delay:14s;color:gold}.player-body{display:flex;justify-content:center;align-items:center;height:100vh;padding:20px;background:url(./bounce_01-DQtroIYY.png) center center / cover no-repeat}.player-container{width:90vw;height:85vh;display:flex;flex-direction:column;gap:10px}.player-top-panel,.player-bottom-panel{background-color:#ff69b4;border:3px solid #00ff00;flex-shrink:0;display:flex;justify-content:center;align-items:center}.player-top-panel{height:15%;position:relative}.player-bottom-panel{height:15%}.player-middle-panel{display:flex;gap:10px;flex-grow:1;height:70%}.player-side-panel{background-color:#ff69b4;border:3px solid #00ff00;width:20%;display:flex;flex-direction:column;padding:10px;gap:10px}.player-side-panel.right{display:flex;flex-direction:column;gap:0;padding:0}.lyrics-container{height:50%;background-color:#1a1a1a;border-bottom:2px solid #00ff00;overflow-y:auto;padding:15px;display:flex;align-items:center;justify-content:center}.lyrics-display{color:#fff;font-family:Courier New,monospace;font-size:16px;line-height:1.6;text-align:center;word-wrap:break-word;max-width:100%;text-shadow:0 0 5px rgba(255,255,255,.3)}.lyrics-display.no-lyrics{color:#666;font-style:italic;font-size:14px}.oscilloscope-container{height:50%;position:relative;background-color:#1a1a1a}.audio-controls{display:flex;justify-content:space-around;flex-shrink:0;padding-top:10px;border-top:3px solid #00ff00}.audio-btn{width:60px;height:40px;background-color:#00c2e0;border:2px solid #a6f3ff;color:#fff;font-size:18px;border-radius:8px;cursor:pointer;transition:all .2s ease}.audio-btn:hover{background-color:#00a0b8;transform:scale(1.05)}.player-screen{flex-grow:1;background-color:#000;border:3px solid #00ff00;display:flex}.player-controls{display:flex;gap:15px}.player-btn{width:100px;height:50px;background-color:#add8e6;border:3px solid #fff;border-radius:15px;cursor:pointer;box-shadow:0 4px 8px #0006;transition:all .2s ease}.player-btn:hover{transform:scale(1.05);box-shadow:0 6px 12px #00000080;border-color:#ff0}#three-container{width:100%;height:100%;flex-grow:1}#soundwave-canvas{width:100%;height:100%;display:block}.playlist-container{display:flex;flex-grow:1;min-height:0;gap:10px}.playlist-controls{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}.playlist-btn{width:40px;height:40px;background-color:#d90000;color:#fff;border:2px solid #ff8080;border-radius:8px;font-size:20px;cursor:pointer;transition:background-color .2s}.playlist-btn:hover{background-color:red}.playlist-btn.select{height:30px;background-color:#ff4d4d}.playlist-screen{flex-grow:1;background-color:#a6f3ff;border:3px solid #00c2e0;border-radius:10px;padding:10px;overflow-y:hidden;font-family:Courier New,Courier,monospace}.playlist-list{list-style:none;margin:0;padding:0;color:#002d36}.playlist-item{padding:5px 10px;border-bottom:2px solid #6cd9e8;font-weight:700;cursor:default;transition:background-color .2s,color .2s}.playlist-item:last-child{border-bottom:none}.playlist-item.selected{background-color:#008a9e;color:#fff}.visualizer-controls{display:flex;justify-content:space-around;flex-shrink:0;padding-top:10px;border-top:3px solid #00ff00}.vis-btn{width:50px;height:30px;background-color:#00c2e0;border:2px solid #a6f3ff;color:#fff;font-family:Courier New,Courier,monospace;font-weight:700;border-radius:5px;cursor:pointer;transition:all .2s ease}.vis-btn:hover{background-color:#00a0b8}.vis-btn.active{background-color:red;border-color:#ff8080;transform:scale(1.1)}@media (max-width: 768px){.stage{height:min(620px,86vh)}.panel{gap:18px;padding:28px 18px 22px}.wood-btn{height:92px}.nav-btn,.action-btn{width:80%;max-width:300px}.content-section{margin:20px 10px;padding:20px}}