@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}html{overflow-x:hidden}body{margin:0;padding:0;font-family:Comic Sans MS,Comic Neue,Bradley Hand ITC,Bradley Hand,Patrick Hand,cursive;font-style:italic;background-color:#a8d4ff;min-height:100vh;color:#111}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:200vh;z-index:0;pointer-events:none;background:url(../images/nubes07.webp) repeat-y center / 100% 50%;will-change:transform;animation:scroll-clouds 35s linear infinite}@keyframes scroll-clouds{0%{transform:translateY(0)}to{transform:translateY(-50%)}}h1,h2,h3,.brand-title{font-family:Bradley Hand ITC,Bradley Hand,Patrick Hand,cursive;font-style:italic}.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;z-index:1;width:min(980px,92vw);height:min(680px,88vh)}.brand-title{position:absolute;top:-86px;left:50%;transform:translate(-50%);margin:0;font-size:clamp(52px,8vw,110px);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:fixed;top:30vh;bottom:0;left:50%;transform:translate(-50%);width:min(940px,88vw);padding:28px 20px 22px;display:grid;gap:46px;justify-items:center;overflow:visible;z-index:1;--mx: 50%;--my: 50%}.panel:before{content:"";position:absolute;top:-14px;right:-14px;bottom:-14px;left:-14px;background:url(../images/box03.png) center / cover;z-index:-1;opacity:.55;pointer-events:none;will-change:filter;filter:url(#flag-wave)}.panel:after{content:"";position:absolute;top:-14px;right:-14px;bottom:-14px;left:-14px;background:url(../images/box03.png) center / cover;z-index:-1;opacity:0;pointer-events:none;will-change:filter;filter:url(#flag-wave-mouse);-webkit-mask-image:radial-gradient(circle 150px at calc(var(--mx) + 14px) calc(var(--my) + 14px),rgba(0,0,0,.8) 0%,rgba(0,0,0,.4) 40%,transparent 100%);mask-image:radial-gradient(circle 150px at calc(var(--mx) + 14px) calc(var(--my) + 14px),rgba(0,0,0,.8) 0%,rgba(0,0,0,.4) 40%,transparent 100%);transition:opacity .1s ease-out}.panel:hover:after{opacity:.95}.wood-btn{display:inline-flex;align-items:center;justify-content:center;width:min(260px,86%);height:98px;text-decoration:none;font-family:Comic Sans MS,Comic Neue,Bradley Hand ITC,Bradley Hand,Patrick Hand,cursive;font-size:clamp(88px,4.5vw,48px);font-style:italic;color:#000;text-shadow:0 2px 4px rgba(0,0,0,.35);background:url(../images/btn01.png) center / cover;box-shadow:0 6px #4a4a2e,0 12px 20px #00000059,inset 0 0 0 1px #ffffff1a;transition:transform .2s ease,box-shadow .2s ease,filter .2s ease}.wood-btn:hover{transform:scale(1.12);filter:invert(1) brightness(1.1) drop-shadow(0 0 15px rgba(255,255,255,.5)) drop-shadow(0 0 35px rgba(255,200,100,.25))}.wood-btn:active{transform:translateY(4px);box-shadow:0 2px #4a4a2e,0 6px 12px #00000059,inset 0 0 0 1px #ffffff1a}.merch-widget{position:fixed;top:16px;right:16px;z-index:10;display:flex;align-items:center;justify-content:center;text-decoration:none}.merch-gif{width:clamp(90px,14vw,160px);height:auto;transition:transform .4s cubic-bezier(.25,.46,.45,.94);filter:drop-shadow(0 6px 16px rgba(0,0,0,.25))}.merch-widget:hover .merch-gif{transform:scale(1.35)}.mute-badge{position:absolute;left:24px;bottom:-54px;width:clamp(72px,10vw,130px);aspect-ratio:1/1;opacity:.9;-webkit-user-select:none;user-select:none}.watermark{position:absolute;right:-24px;bottom:-58px;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:-58px;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:url(../images/btn01.png) center / cover;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;text-shadow:0 2px 4px rgba(0,0,0,.35);box-shadow:0 4px #4a4a2e,0 8px 16px #0000004d,inset 0 0 0 1px #ffffff1a;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,.nav-btn.game,.nav-btn.gallery{background:url(../images/btn01.png) center / cover}.main-content{padding:12px 20px 40px;text-align:center;position:relative;z-index:1}.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-top:0;margin-bottom:16px}.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}.player-container{position:relative;z-index:1;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:12px;padding:22px 16px 18px}.wood-btn{height:56px}.merch-widget{top:12px;right:12px}.merch-gif{width:clamp(60px,12vw,90px)}.nav-btn,.action-btn{width:80%;max-width:300px}.content-section{margin:20px 10px;padding:20px}}.widget-container{display:flex;justify-content:center;margin:2rem auto}.hearts-widget{width:200px;height:auto;cursor:pointer;transition:transform .1s ease}@keyframes nudge-right{0%{transform:translate(0)}40%{transform:translate(30px)}to{transform:translate(0)}}.hearts-widget.nudge{animation:nudge-right .4s ease-in-out}