@import "https://fonts.cdnfonts.com/css/thegoodmonolith";
@import "https://fonts.cdnfonts.com/css/pp-neue-montreal";
:root{--font-primary:"PP Neue Montreal",sans-serif;--text-color:#f5f5f5e6;--neon-green:#00ff41}.text-mega{mix-blend-mode:difference;white-space:nowrap;line-height:.8;color:#fff!important;text-shadow:none!important;font-size:6.8vw!important}*{box-sizing:border-box;margin:0;padding:0}html{background-color:#fff;width:100%;font-size:16px;overflow-x:hidden}html.lenis{height:auto}.lenis.lenis-smooth{scroll-behavior:auto}.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}.lenis.lenis-stopped{overflow:hidden}.lenis.lenis-scrolling iframe{pointer-events:none}body{font-family:var(--font-primary);color:#000;letter-spacing:-.02em;text-transform:uppercase;background-color:#fff;width:100%;font-weight:500;position:relative;overflow-x:hidden}.scroll-container{background-color:#fff;position:relative}.end-section{background-color:#fff;justify-content:center;align-items:center;height:100vh;font-size:2rem;display:flex;position:relative}.github-link{color:#000;justify-content:center;align-items:center;transition:transform .3s,color .3s;display:flex;position:sticky;top:50vh}.github-link:hover{color:#555;cursor:pointer;transform:scale(1.2)}.fixed-section{background-color:#fff;height:1100vh;position:relative}.fixed-container{will-change:transform,height;transform-origin:top;background-color:#fff;width:100%;height:100vh;position:sticky;top:0;left:0;overflow:hidden}.grid-container{z-index:2;pointer-events:none;grid-template-columns:repeat(12,1fr);gap:1rem;width:100%;max-width:100%;height:100%;padding:0 2rem;display:grid;position:relative}.background-container{z-index:1;background-color:#000;width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.background-image{object-fit:cover;opacity:0;filter:brightness(.8);will-change:transform;transform-origin:50%;width:100%;height:120%;position:absolute;top:-10%;left:0}.background-image.active{opacity:1;z-index:2}.background-image.previous{opacity:1;z-index:1}.section-header{text-align:center;text-align:center;color:#fff;mix-blend-mode:difference;grid-column:1/13;align-self:start;padding-top:5vh;font-size:10vw;line-height:.8}.header-row{display:block}.scroll-footer{text-align:center;text-align:center;color:#fff;mix-blend-mode:difference;grid-column:1/13;align-self:end;padding-bottom:5vh;font-size:10vw;line-height:.8;transition:filter .5s,opacity .5s}.progress-indicator{background-color:#f5f5f54d;width:160px;height:1px;margin:2vh auto 0;position:relative}.progress-fill{background-color:var(--text-color);width:0%;height:100%;transition:width .3s cubic-bezier(.65,0,.35,1);position:absolute;top:0;left:0}.progress-numbers{color:var(--text-color);font-size:.7rem;font-family:var(--font-primary);letter-spacing:-.02em;justify-content:space-between;margin:0 -25px;display:flex;position:absolute;top:0;left:0;right:0;transform:translateY(-50%)}.scroll-footer.blur,.left-column.blur,.right-column.blur{filter:blur(8px);opacity:.3;transition:filter .8s,opacity .8s}.scroll-hint{letter-spacing:.2em;flex-direction:column;align-items:center;gap:.5rem;padding-bottom:2rem;font-size:.8rem;display:flex}.scroll-arrow{font-size:1.5rem;animation:2s infinite bounce}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-5px)}60%{transform:translateY(-3px)}}.content{will-change:transform;grid-column:1/13;justify-content:space-between;align-items:center;width:100%;padding:0 2rem;display:flex;position:absolute;top:50%;left:0;transform:translateY(-50%)}.left-column{text-align:left;will-change:filter,opacity;flex-direction:column;gap:.25rem;width:30%;transition:filter .5s,opacity .5s;display:flex}.right-column{text-align:right;will-change:filter,opacity;flex-direction:column;gap:.25rem;width:30%;transition:filter .5s,opacity .5s;display:flex}.featured{text-align:center;will-change:filter,opacity;justify-content:center;align-items:center;width:40%;height:10vh;font-size:1.5vw;transition:filter .5s,opacity .5s;display:flex;position:relative;overflow:hidden}.featured.blur{filter:blur(8px);opacity:.3;transition:filter .8s,opacity .8s}.featured-content{opacity:0;visibility:hidden;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.featured-content.active{opacity:1;visibility:visible}.featured-content h3{width:100%;color:var(--text-color);flex-direction:column;align-items:center;gap:.2rem;margin:0;font-weight:500;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.center-line{white-space:nowrap;display:block}.word-mask{vertical-align:middle;display:inline-block;overflow:hidden}.split-word{vertical-align:middle;display:inline-block}.artist{opacity:0;color:var(--text-color);cursor:pointer;pointer-events:auto;padding-left:0;transition:all .5s cubic-bezier(.16,1,.3,1);position:relative;transform:translateY(20px)}.category{opacity:0;color:var(--text-color);cursor:pointer;pointer-events:auto;padding-right:0;transition:all .5s cubic-bezier(.16,1,.3,1);position:relative;transform:translateY(20px)}.artist:hover,.category:hover{opacity:1!important}.artist.loaded,.category.loaded{opacity:.3;transform:translateY(0)}.artist.active{opacity:1;padding-left:15px;transition:all .5s cubic-bezier(.16,1,.3,1);transform:translate(10px)}.artist.active:before{content:"";background-color:var(--text-color);border-radius:50%;width:4px;height:4px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.category.active{opacity:1;padding-right:15px;transition:all .5s cubic-bezier(.16,1,.3,1);transform:translate(-10px)}.category.active:after{content:"";background-color:var(--text-color);border-radius:50%;width:4px;height:4px;position:absolute;top:50%;right:0;transform:translateY(-50%)}.loading-overlay{z-index:9999;color:#000;width:100%;height:100%;font-size:1.5rem;font-family:var(--font-primary);text-transform:uppercase;letter-spacing:-.02em;background-color:#fff;justify-content:center;align-items:center;display:flex;position:fixed;top:0;left:0}.loading-counter{margin-left:.5rem}.debug-info{color:#000;z-index:9000;background:#ffffffb3;padding:10px;font-family:monospace;font-size:12px;display:none;position:fixed;bottom:10px;right:10px}.sound-toggle{cursor:pointer;z-index:1000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;transition:all .3s;display:flex;position:fixed;top:20px;right:20px}.sound-toggle:hover{background:#ffffff26;border-color:#ffffff4d;transform:scale(1.05)}.sound-toggle.disabled{background:#ffffff0d;border-color:#ffffff1a}.enter-button{color:#fff;cursor:pointer;z-index:9999;text-transform:uppercase;letter-spacing:.1em;mix-blend-mode:difference;opacity:1;background:0 0;border:1px solid #fff6;padding:.8rem 2.5rem;font-family:The Good Monolith,monospace;font-size:1.2rem;text-decoration:none;transition:all .8s cubic-bezier(.16,1,.3,1);position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.enter-button.hidden{opacity:0;pointer-events:none;transform:translate(-50%,-40%)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.enter-button:hover{color:#000;background:#fff;border-color:#fff}.enter-button.top-right{border-color:#fff3;padding:.5rem 1rem;font-size:.8rem;top:2rem;left:auto;right:2rem;transform:translate(0)}.sound-toggle.disabled .sound-dot.animated{opacity:.3;width:4px;height:4px;animation:none}@media (max-width:768px){.content{flex-direction:column;gap:5vh}.left-column,.right-column,.featured{text-align:center;width:100%}.featured{order:-1;margin-bottom:2vh;font-size:3vw}.header,.scroll-footer{font-size:15vw}.progress-indicator{width:120px}}.react-grid-placeholder{opacity:1!important;background:#fff3!important;border:2px dashed #00ff4199!important;border-radius:20px!important}.react-resizable-handle{opacity:.5;z-index:100;cursor:se-resize;width:30px;height:30px;transition:opacity .2s;position:absolute}.react-grid-item:hover .react-resizable-handle{opacity:1}.react-resizable-handle-s{cursor:s-resize;bottom:4px;left:50%;transform:translate(-50%)}.react-resizable-handle-se{cursor:se-resize;bottom:8px;right:8px}.react-resizable-handle-sw{cursor:sw-resize;bottom:8px;left:8px}.react-resizable-handle:after{display:none}[data-nextjs-toast],[data-nextjs-dialog-overlay],[data-nextjs-portal]{visibility:hidden!important;opacity:0!important;pointer-events:none!important;display:none!important}