.styles_container__QPY5X{min-height:100vh;margin:0;padding:2rem;background:#e8e2d8;background-image:radial-gradient(ellipse at 50% 0,hsla(0,0%,100%,.4) 0,transparent 50%),linear-gradient(180deg,#ebe6dc,#e0d9cc);position:relative;color:#3d3529}.styles_backgroundImage__h_pUd{position:fixed;inset:0;z-index:0;background-size:cover;background-position:50%;background-repeat:no-repeat;box-shadow:inset 0 0 0 100vmax hsla(38,26%,88%,.08)}.styles_backgroundImageTransition__Smst3{transition:opacity .4s ease}.styles_header__JS7mW{position:absolute;top:2rem;left:2rem;z-index:10}.styles_backButton__PLOKE{display:inline-block;color:#1a1a1a;text-decoration:none;font-size:.875rem;font-weight:400;padding:.5rem 1rem;border-radius:4px;transition:color .2s ease,background-color .2s ease}.styles_backButton__PLOKE:hover{color:#000;background-color:rgba(0,0,0,.05)}.styles_headerDarkBg__cw03U .styles_backButton__PLOKE{color:#fff}.styles_headerDarkBg__cw03U .styles_backButton__PLOKE:hover{color:#f0f0f0;background-color:hsla(0,0%,100%,.15)}.styles_main__s4K9e{position:relative;z-index:1;min-height:calc(100vh - 8rem)}.styles_main__s4K9e,.styles_pianoContainer__odsDi{display:flex;justify-content:center;align-items:center}.styles_pianoContainer__odsDi{flex-direction:column;gap:1.5rem}.styles_visualizerWrapper__zs6PC{display:inline-flex;flex-direction:column;align-items:stretch;gap:1.5rem}.styles_autoplaySection__YjKoT{display:flex;justify-content:center;align-items:center;gap:.75rem}.styles_autoplayButton__gfxKB{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:linear-gradient(180deg,#4a3328,#3d2b22);border:1px solid rgba(45,33,24,.35);border-radius:8px;color:#f5f0e8;font-size:.875rem;font-weight:500;letter-spacing:.02em;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease;box-shadow:0 1px 2px rgba(45,33,24,.08),0 2px 8px rgba(45,33,24,.1)}.styles_autoplayIcon__y9YHu{opacity:.92;font-size:.75em;line-height:1}.styles_autoplayButton__gfxKB:hover{transform:translateY(-2px);border-color:rgba(45,33,24,.5);background:linear-gradient(180deg,#524030,#453028);box-shadow:0 4px 8px rgba(45,33,24,.15),0 10px 24px rgba(45,33,24,.2)}.styles_autoplayButton__gfxKB:active{transform:translateY(0);box-shadow:0 1px 2px rgba(45,33,24,.08),0 2px 6px rgba(45,33,24,.1)}.styles_musicScroll__QGj77{width:100%;background-color:#e8dcc8;border-radius:6px;padding:2.25rem 1.5rem;box-shadow:0 4px 20px rgba(61,43,34,.25),inset 0 1px 0 hsla(0,0%,100%,.4),inset 0 -1px 0 rgba(0,0,0,.05);border:1px solid #c4b89a;position:relative;overflow:hidden}.styles_musicScroll__QGj77:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.08' fill='%23888'/%3E%3C/svg%3E"),repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(100,85,70,.035) 0,rgba(100,85,70,.035) 3px),repeating-linear-gradient(94deg,transparent,transparent 2px,rgba(100,85,70,.025) 0,rgba(100,85,70,.025) 3px);background-size:200px 200px,4px 4px,4px 4px;pointer-events:none;border-radius:inherit}.styles_musicScrollInner__6_VER{position:relative;z-index:1}.styles_staff__DNho_{position:relative;height:72px;width:100%;overflow:visible}.styles_trebleClef__0efe_{position:absolute;left:0;top:0;height:100%;display:flex;align-items:center;transform:translateY(-4px);font-size:4.5rem;color:#3d2b22;line-height:1;opacity:.85}.styles_staffLines__JFW15{position:absolute;top:0;left:2.5rem;right:0;bottom:0;display:flex;flex-direction:column;justify-content:space-evenly}.styles_staffLine__MwSAV{height:1px;background:#5a4a3a;opacity:.6}.styles_scrollNotes__lcsLW{position:absolute;top:-1.5rem;left:3rem;right:0;bottom:-1.5rem;overflow:hidden;pointer-events:none}.styles_scrollNotesStrip__LSzFx{position:absolute;top:1.5rem;right:0;height:72px;min-width:100%;pointer-events:none}.styles_scrollNote__9uC54{position:absolute;left:0;transform:translate(100%,-50%);animation:styles_scrollNote__9uC54 var(--scroll-duration,6s) linear forwards;display:flex;align-items:center;justify-content:center}.styles_scrollNoteSharp__7C9ky .styles_noteHead__v2huC{color:#2d2018}.styles_scrollNoteCurrent__9Mgq1 .styles_noteHead__v2huC{color:#1a120c;filter:drop-shadow(0 0 4px rgba(139,90,43,.6)) drop-shadow(0 1px 1px rgba(255,255,255,.3));transform:scale(1.15)}@keyframes styles_scrollNote__9uC54{0%{transform:translate(100%,-50%)}to{transform:translate(-150%,-50%)}}.styles_noteHead__v2huC{font-size:2.5rem;color:#3d2b22;line-height:1;filter:drop-shadow(0 1px 1px rgba(255,255,255,.3))}.styles_piano__fulMh{position:relative;display:inline-block;padding:2rem;border-radius:12px;overflow:hidden;background:repeating-linear-gradient(92deg,transparent,transparent 3px,rgba(0,0,0,.02) 4px,rgba(0,0,0,.02) 5px,transparent 6px),repeating-linear-gradient(88deg,transparent,hsla(0,0%,100%,.015) 1px,transparent 2px),linear-gradient(180deg,#6b4e3d,#5c4033 20%,#4a3328 50%,#3d2b22 80%,#2d2018);background-size:200px 100%,100% 100%,100% 100%;box-shadow:0 12px 40px rgba(0,0,0,.4),0 4px 12px rgba(0,0,0,.2),inset 0 -2px 6px rgba(0,0,0,.3),inset 0 1px 0 hsla(0,0%,100%,.06);border:1px solid rgba(0,0,0,.3)}.styles_keybed__BElvL{position:relative;padding-top:.5rem}.styles_brassStrip__7oltW{position:absolute;top:0;left:0;right:0;height:8px;background:linear-gradient(180deg,#d4a84b,#c4993a 30%,#a67c28 70%,#8b691f);box-shadow:inset 0 1px 0 hsla(0,0%,100%,.4),inset 0 -1px 0 rgba(0,0,0,.2),0 2px 4px rgba(0,0,0,.2);border-radius:2px;z-index:3}.styles_whiteKeys__9aoIf{display:flex;position:relative;z-index:1}.styles_blackKeys__oJtNx{position:absolute;top:8px;left:0;right:0;z-index:2;pointer-events:none}.styles_key__pgCWT{position:relative;border:none;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:1rem;transition:all .1s ease;pointer-events:auto}.styles_whiteKey__vqCuy{width:50px;height:260px;margin-left:-1px}.styles_whiteKey__vqCuy:first-child{margin-left:0}.styles_whiteKey__vqCuy{background:linear-gradient(180deg,#f8f4ec 0,#f0e9dc 30%,#ebe2d2 70%,#e5dcc8);border-radius:0 0 6px 6px;box-shadow:0 2px 4px rgba(61,53,41,.15),inset 0 -1px 2px rgba(0,0,0,.04),inset 0 1px 0 hsla(0,0%,100%,.6);border:1px solid #d4c8b8}.styles_whiteKey__vqCuy:hover{background:linear-gradient(180deg,#f8f2e8 0,#f0e8dc 50%,#ebe2d4);box-shadow:0 2px 6px rgba(61,53,41,.18),inset 0 -1px 2px rgba(0,0,0,.03),inset 0 1px 0 hsla(0,0%,100%,.7)}.styles_whiteKey__vqCuy.styles_active__b7NnB{background:linear-gradient(180deg,#dfd4c6 0,#d2c6b6 50%,#c4b8a8);box-shadow:0 1px 2px rgba(61,53,41,.25),inset 0 3px 10px rgba(0,0,0,.12);border-color:#b8ac9c}.styles_whiteKey__vqCuy.styles_active__b7NnB .styles_keyLabel__hqcwU,.styles_whiteKey__vqCuy.styles_active__b7NnB .styles_keyboardLabel__Xst3h{color:#4a4035}.styles_blackKey__kxrBt{position:absolute;width:32px;height:170px;background:linear-gradient(180deg,#2a2a2a 0,#1a1a1a 50%,#0f0f0f);border-radius:0 0 5px 5px;box-shadow:0 4px 8px rgba(0,0,0,.5),inset 0 -1px 2px rgba(0,0,0,.5),inset 0 1px 0 hsla(0,0%,100%,.03);border:1px solid #0a0a0a;z-index:2}.styles_blackKey__kxrBt:hover{background:linear-gradient(180deg,#3a3a3a 0,#2d2d2d 50%,#222);box-shadow:0 4px 10px rgba(0,0,0,.5),inset 0 1px 0 hsla(0,0%,100%,.06)}.styles_blackKey__kxrBt.styles_active__b7NnB{background:linear-gradient(180deg,#4a4a4a 0,#363636 50%,#282828);box-shadow:0 2px 4px rgba(0,0,0,.5),inset 0 3px 10px hsla(0,0%,100%,.08)}.styles_blackKey__kxrBt.styles_active__b7NnB .styles_keyLabel__hqcwU,.styles_blackKey__kxrBt.styles_active__b7NnB .styles_keyboardLabel__Xst3h{color:hsla(40,46%,95%,.95)}.styles_keyLabel__hqcwU{font-size:.9rem;font-weight:600;color:#4a4035;margin-bottom:.25rem}.styles_blackKey__kxrBt .styles_keyLabel__hqcwU{color:hsla(40,46%,95%,.9);text-shadow:0 1px 1px rgba(0,0,0,.5)}.styles_keyboardLabel__Xst3h{font-size:.7rem;color:#6b5f52;background:rgba(61,53,41,.06);padding:2px 6px;border-radius:3px;font-weight:500}.styles_blackKey__kxrBt .styles_keyboardLabel__Xst3h{color:hsla(40,46%,95%,.6);background:rgba(0,0,0,.25)}@media (max-width:1024px){.styles_musicScroll__QGj77{padding:1.75rem 1.25rem}.styles_scrollNotesStrip__LSzFx,.styles_staff__DNho_{height:60px}.styles_trebleClef__0efe_{font-size:3.75rem}.styles_noteHead__v2huC{font-size:2rem}.styles_whiteKey__vqCuy{width:40px;height:220px}.styles_blackKey__kxrBt{width:26px;height:145px}}@media (max-width:768px){.styles_container__QPY5X{padding:1rem;overflow-x:hidden}.styles_musicScroll__QGj77{padding:1.5rem 1rem}.styles_scrollNotesStrip__LSzFx,.styles_staff__DNho_{height:52px}.styles_trebleClef__0efe_{font-size:3.25rem}.styles_noteHead__v2huC{font-size:1.35rem}.styles_piano__fulMh{padding:1rem}.styles_whiteKey__vqCuy{width:30px;height:180px}.styles_blackKey__kxrBt{width:20px;height:120px}.styles_keyLabel__hqcwU{font-size:.7rem}.styles_keyboardLabel__Xst3h{font-size:.6rem}.styles_pianoContainer__odsDi{padding:2rem 1rem;width:100%;max-width:100%;box-sizing:border-box}.styles_visualizerWrapper__zs6PC{width:100%;max-width:100%}.styles_autoplaySection__YjKoT{flex-direction:column;width:100%;max-width:100%}.styles_autoplayButton__gfxKB{width:100%;max-width:280px;justify-content:center}}@media (max-width:480px){.styles_whiteKey__vqCuy{width:22px;height:140px}.styles_blackKey__kxrBt{width:15px;height:95px}.styles_keyLabel__hqcwU{font-size:.5rem}.styles_keyboardLabel__Xst3h{display:none}.styles_autoplayButton__gfxKB{max-width:none}}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:400;font-display:swap;src:url(/_next/static/media/58f386aa6b1a2a92-s.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:400;font-display:swap;src:url(/_next/static/media/011e180705008d6f-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:400;font-display:swap;src:url(/_next/static/media/7ba5fb2a8c88521c-s.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:400;font-display:swap;src:url(/_next/static/media/92eeb95d069020cc-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:400;font-display:swap;src:url(/_next/static/media/d3ebbfd689654d3a-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:500;font-display:swap;src:url(/_next/static/media/ef4d5661765d0e49-s.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:500;font-display:swap;src:url(/_next/static/media/d29838c109ef09b4-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:500;font-display:swap;src:url(/_next/static/media/e40af3453d7c920a-s.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:500;font-display:swap;src:url(/_next/static/media/99dcf268bda04fe5-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:500;font-display:swap;src:url(/_next/static/media/98e207f02528a563-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:600;font-display:swap;src:url(/_next/static/media/73cb51aac9c97f90-s.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:600;font-display:swap;src:url(/_next/static/media/d26bbd13d6b70f89-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:600;font-display:swap;src:url(/_next/static/media/20535187d867b7b9-s.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:600;font-display:swap;src:url(/_next/static/media/5356a6a4f2c8c8d8-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:600;font-display:swap;src:url(/_next/static/media/db96af6b531dc71f-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:IBM Plex Mono Fallback;src:local("Arial");ascent-override:76.16%;descent-override:20.43%;line-gap-override:0.00%;size-adjust:134.59%}.__className_595324{font-family:IBM Plex Mono,IBM Plex Mono Fallback;font-style:normal}