@import url(https://fonts.googleapis.com/css2?family=Varela+Round&display=swap);*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*
! tailwindcss v3.4.14 | MIT License | https://tailwindcss.com
*/*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;tab-size:4}body{line-height:inherit}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.bottom-1{bottom:.25rem}.left-2{left:.5rem}.right-12{right:3rem}.right-2{right:.5rem}.right-\[110px\]{right:110px}.top-2\/4{top:50%}.top-24{top:6rem}.z-10{z-index:10}.z-50{z-index:50}.m-auto{margin:auto}.mx-0{margin-left:0;margin-right:0}.my-3{margin-bottom:.75rem;margin-top:.75rem}.my-4{margin-top:1rem}.mb-4,.my-4{margin-bottom:1rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.block{display:block}.flex{display:flex}.hidden{display:none}.aspect-video{aspect-ratio:16/9}.h-12{height:3rem}.h-24{height:6rem}.h-4{height:1rem}.h-64{height:16rem}.h-auto{height:auto}.h-full{height:100%}.min-h-\[500px\]{min-height:500px}.w-12{width:3rem}.w-24{width:6rem}.w-36{width:9rem}.w-4{width:1rem}.w-8{width:2rem}.w-\[700px\]{width:700px}.w-full{width:100%}.min-w-full{min-width:100%}.max-w-\[700px\]{max-width:700px}.max-w-full{max-width:100%}.-translate-y-2\/4{--tw-translate-y:-50%}.-translate-y-2\/4,.scale-125{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-125{--tw-scale-x:1.25;--tw-scale-y:1.25}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.resize{resize:both}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.overflow-hidden{overflow:hidden}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-\[100px\]{border-radius:100px}.rounded-\[15px\]{border-radius:15px}.rounded-\[50\%\]{border-radius:50%}.rounded-\[50px\]{border-radius:50px}.rounded-\[76px\]{border-radius:76px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-4{border-width:4px}.border-\[50px\]{border-width:50px}.border-solid{border-style:solid}.border-none{border-style:none}.border-\[\#ff8ae2\]{--tw-border-opacity:1;border-color:rgb(255 138 226/var(--tw-border-opacity))}.border-slate-300{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity))}.bg-\[\#6e44ff\]{--tw-bg-opacity:1;background-color:rgb(110 68 255/var(--tw-bg-opacity))}.bg-\[\#FFEBCD\]{--tw-bg-opacity:1;background-color:rgb(255 235 205/var(--tw-bg-opacity))}.bg-\[\#a847e4\]{--tw-bg-opacity:1;background-color:rgb(168 71 228/var(--tw-bg-opacity))}.bg-\[\#b642f5\]{--tw-bg-opacity:1;background-color:rgb(182 66 245/var(--tw-bg-opacity))}.bg-\[\#ff8ae2\]{--tw-bg-opacity:1;background-color:rgb(255 138 226/var(--tw-bg-opacity))}.bg-\[rgba\(0\2c 0\2c 0\2c 0\.5\)\]{background-color:#00000080}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity))}.bg-slate-400{--tw-bg-opacity:1;background-color:rgb(148 163 184/var(--tw-bg-opacity))}.bg-contain{background-size:contain}.bg-center{background-position:50%}.bg-no-repeat{background-repeat:no-repeat}.p-2\.5{padding:.625rem}.p-5{padding:1.25rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.text-center{text-align:center}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-5xl{font-size:3rem;line-height:1}.font-black{font-weight:900}.font-bold{font-weight:700}.text-\[\#a847e4\]{--tw-text-opacity:1;color:rgb(168 71 228/var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.shadow-md{--tw-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);box-shadow:0 0 #0000,0 0 #0000,var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-black{--tw-shadow-color:#000;--tw-shadow:var(--tw-shadow-colored)}.blur{--tw-blur:blur(8px)}.blur,.drop-shadow-2xl{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow-2xl{--tw-drop-shadow:drop-shadow(0 25px 25px #00000026)}.drop-shadow-md{--tw-drop-shadow:drop-shadow(0 4px 3px #00000012) drop-shadow(0 2px 2px #0000000f);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-\[background-color\]{transition-duration:.15s;transition-property:background-color;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-transform{transition-duration:.15s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}.duration-\[0\.3s\]{transition-duration:.3s}.duration-\[0\.5s\]{transition-duration:.5s}.ease-\[ease-in-out\]{transition-timing-function:ease-in-out}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.backdrop\:bg-black\/55::backdrop{background-color:#0000008c}.hover\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1}.hover\:scale-110:hover,.hover\:scale-125:hover{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:scale-125:hover{--tw-scale-x:1.25;--tw-scale-y:1.25}.hover\:bg-\[\#6e44ff\]:hover{--tw-bg-opacity:1;background-color:rgb(110 68 255/var(--tw-bg-opacity))}.hover\:bg-blue-600:hover{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity))}.hover\:shadow-2xl:hover{--tw-shadow:0 25px 50px -12px #00000040;--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);box-shadow:0 0 #0000,0 0 #0000,var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.home-container{align-items:center;background:linear-gradient(135deg,#4f9fd9,#9cd8fa);display:flex;justify-content:center;min-height:100vh;padding:20px}.main-content{background-color:#fffffffa;border-radius:30px;box-shadow:0 20px 40px #0000001a;display:flex;flex-direction:column;max-width:1200px;min-height:calc(100vh - 40px);overflow:hidden;padding:25px;position:relative;width:100%}.content-wrapper{display:flex;flex:1 1;flex-direction:column;padding-bottom:100px}.welcome-title{-webkit-text-fill-color:#0000;background:linear-gradient(45deg,#4f9fd9,#b642f5);-webkit-background-clip:text;font-size:2rem;font-weight:800;margin-bottom:15px;text-align:center}.text-image-container{grid-gap:20px;display:grid;flex:1 1;gap:20px;grid-template-columns:1fr .8fr;margin-bottom:px;min-height:0}.text-section{display:flex;flex-direction:column;gap:15px;min-height:0}.info-section{flex-shrink:0}.section-title,.text-section h2.section-title{color:#2c3e50;font-size:1.2rem;font-weight:700;margin-bottom:10px}.text-section h2.section-title{text-align:left;width:100%}.custom-numbered-list{list-style:none;margin:0;padding:0}.custom-numbered-list li{margin-bottom:8px}.list-highlight{color:#4f9fd9;font-size:1rem;font-weight:600;margin-bottom:2px}.list-detail{color:#666;font-size:.9rem;margin:0}.steps-container{grid-gap:10px;display:grid;gap:10px;grid-template-columns:repeat(3,1fr)}.step-item{background:#4f9fd91a;border-radius:15px;padding:10px;text-align:center}.step-number{align-items:center;background:#4f9fd9;border-radius:50%;color:#fff;display:flex;font-weight:700;height:30px;justify-content:center;margin:0 auto 8px;width:30px}.image-section{max-height:400px}.image-section,.songly-container{align-items:center;display:flex;height:100%;justify-content:center;position:relative;width:100%}.songly-container{overflow:hidden}.songly-image{animation:float 6s ease-in-out infinite;max-height:100%;max-width:100%;object-fit:contain;transition:transform .3s ease-in-out}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-15px)}to{transform:translateY(0)}}.start-link-container{bottom:20px;left:50%;margin:0;max-width:500px;padding:0;position:fixed;text-align:center;transform:translateX(-50%);width:calc(100% - 40px);z-index:1000}.start-link{align-items:center;animation:pulse 3s infinite;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:linear-gradient(45deg,#4f9fd9,#b642f5);border:none;border-radius:50px;box-shadow:0 4px 15px #0000001a;color:#fff;cursor:pointer;display:inline-flex;font-size:1.2rem;font-weight:600;gap:10px;justify-content:center;overflow:hidden;padding:12px 30px;position:relative;transform:translateY(0);transition:all .3s ease;transition:all .3s cubic-bezier(.175,.885,.32,1.275);width:100%}.start-link:hover{background:linear-gradient(45deg,#5aafee,#c94dff);box-shadow:0 8px 25px #0003;transform:translateY(-2px)}.start-link:active{box-shadow:0 4px 10px #0000001a;transform:translateY(1px)}.start-link:after{background-image:radial-gradient(circle,#fff 10%,#0000 10.01%);background-position:50%;background-repeat:no-repeat;content:"";height:100%;left:0;opacity:0;pointer-events:none;position:absolute;top:0;transform:scale(10);transition:transform .5s,opacity 1s;width:100%}.start-link:active:after{opacity:.3;transform:scale(0);transition:0s}@keyframes pulse{0%{box-shadow:0 4px 15px #0000001a}50%{box-shadow:0 4px 25px #4f9fd94d}to{box-shadow:0 4px 15px #0000001a}}.arrow{display:inline-block;transition:transform .3s ease}.start-link:hover .arrow{transform:translateX(5px)}@media (hover:none){.start-link:hover{background:linear-gradient(45deg,#4f9fd9,#b642f5);box-shadow:0 4px 15px #0000001a;transform:none}.start-link:hover .arrow{transform:none}}@media (max-width:768px){.home-container{padding:10px}.main-content{min-height:calc(100vh - 20px);padding:20px}.content-wrapper{display:flex;flex-direction:column;height:100%;padding-bottom:80px}.text-image-container{flex:1 1;gap:10px;grid-template-columns:1fr}.image-section{height:auto;margin-bottom:20px;margin-top:20px;max-height:none;position:relative}.songly-container{padding-bottom:20px;position:relative;width:100%}.songly-image{display:block;height:auto;margin:0 auto;max-width:80%}.welcome-title{font-size:1.5rem;margin-bottom:10px}.section-title{font-size:1.1rem}.steps-container{grid-template-columns:repeat(3,1fr)}.start-link-container{bottom:20px;left:50%;margin:0 auto;padding:0 20px;position:fixed;transform:translateX(-50%);width:calc(100% - 40px);z-index:1000}.content-wrapper{padding-bottom:100px}.vibe-title{font-size:1.8rem;gap:10px;margin:5px 0 20px}.vibe-hover{font-size:2rem;letter-spacing:1px}}@media (min-width:480px) and (max-width:768px){.songly-image{max-width:60%}}@media (min-width:769px){.start-link-container{bottom:30px;max-width:400px}.start-link{padding:15px 40px}.text-image-container{margin-bottom:0}}@media (min-width:769px) and (max-width:1024px){.text-image-container{grid-template-columns:1fr 1fr}.image-section{max-height:350px}}@media (min-width:1440px){.main-content{max-width:1400px}.image-section{max-height:500px}.start-link-container{bottom:40px}.vibe-title{font-size:2.4rem}.vibe-hover{font-size:2.6rem}}.vibe-title{display:flex;flex-wrap:wrap;font-family:Poppins,sans-serif;font-size:2.2rem;font-style:italic;font-weight:600;gap:15px;justify-content:center;line-height:1.4;margin:10px 0 30px;padding:10px;text-align:center}.vibe-word{background:linear-gradient(45deg,#2193b0,#6dd5ed);-webkit-background-clip:text;background-clip:text;padding:0 2px;transform:translateY(20px)}.vibe-hover,.vibe-word{-webkit-text-fill-color:#0000;animation:fadeInUp .5s ease forwards;opacity:0}.vibe-hover{animation-delay:.8s;cursor:pointer;font-family:Righteous,cursive;font-size:2.4rem;font-style:normal;letter-spacing:2px;margin:0 2px;padding:0 4px;position:relative;text-shadow:0 0 7px #ff3cac4d,0 0 10px #784ba04d,0 0 21px #2b86c54d;transform-origin:center}.vibe-hover,.vibe-hover:hover{background:linear-gradient(45deg,#ff3cac,#784ba0,#2b86c5);-webkit-background-clip:text;background-clip:text}.vibe-hover:hover{-webkit-text-fill-color:#0000;text-shadow:0 0 14px #ff3cac80,0 0 20px #784ba080,0 0 42px #2b86c580;transform:scale(1.15) rotate(-2deg);transition:all .3s ease}.vibe-hover:before{background:linear-gradient(90deg,#ff3cac,#784ba0,#2b86c5);border-radius:2px;bottom:-4px;content:"";height:4px;left:0;position:absolute;transform:scaleX(0);transform-origin:right;transition:transform .4s cubic-bezier(.65,0,.35,1);width:100%}.vibe-hover:hover:before{transform:scaleX(1);transform-origin:left}.vibe-word:first-child{animation-delay:.2s}.vibe-word:nth-child(2){animation-delay:.4s}.vibe-word:nth-child(3){animation-delay:.6s}.curriculums-screen{background:linear-gradient(135deg,#4f9fd9,#9cd8fa);min-height:100vh;padding:40px 20px}.curriculums-content{margin:0 auto;max-width:1400px}.main-title{color:#fff;font-family:Varela Round,sans-serif;font-size:3.5rem;margin-bottom:20px;text-align:center;text-shadow:0 2px 4px #0000001a}.program-section{background:#fffffffa;border-radius:30px;box-shadow:0 20px 40px #0000001a;margin-bottom:40px;padding:40px}.gradient-text{-webkit-text-fill-color:#0000;background:linear-gradient(45deg,#4f9fd9,#b642f5);-webkit-background-clip:text;background-clip:text;display:block;font-size:2.8rem;font-weight:800;margin-bottom:10px}.section-subtitle{color:#666;font-size:1.2rem;font-weight:400}.curriculums-grid{grid-gap:30px;display:grid;gap:30px;grid-template-columns:repeat(auto-fit,minmax(350px,1fr))}.curriculum-card{background-color:#fff;border:1px solid #0000000d;border-radius:20px;box-shadow:0 15px 30px #00000014;cursor:pointer;overflow:hidden;transition:all .3s ease}.curriculum-card:hover{box-shadow:0 20px 40px #00000026;transform:translateY(-5px) scale(1.02)}.curriculum-image{background:linear-gradient(45deg,#4f9fd90d,#b642f50d);height:250px;overflow:hidden;position:relative;width:100%}.curriculum-image img{height:100%;object-fit:contain;transition:transform .5s ease;width:100%}.curriculum-card:hover .curriculum-image img{transform:scale(1.05)}.curriculum-details{padding:25px}.curriculum-details h3{color:#2c3e50;font-size:1.5rem;font-weight:700;margin-bottom:12px}.curriculum-details p{color:#666;font-size:1rem;line-height:1.5;margin-bottom:20px;min-height:3em}.lesson-count{background:linear-gradient(45deg,#4f9fd91a,#b642f51a);border-radius:20px;color:#4f9fd9;display:inline-block;font-size:.9rem;font-weight:600;padding:8px 16px}@media (max-width:768px){.curriculums-screen{padding:20px 10px}.main-title{font-size:2.5rem}.program-section{margin-bottom:20px;padding:20px}.gradient-text{font-size:2rem}.section-subtitle{font-size:1rem}.curriculums-grid{gap:20px;grid-template-columns:1fr}.curriculum-card{max-width:100%}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.curriculum-card{animation:fadeInUp .5s ease forwards;opacity:0}.curriculum-card:first-child{animation-delay:.1s}.curriculum-card:nth-child(2){animation-delay:.2s}.curriculum-card:nth-child(3){animation-delay:.3s}.lessons-screen{align-items:center;display:flex;justify-content:center;min-height:100vh;padding:16px}.lessons-card{background-color:#fff;border-radius:24px;box-shadow:0 10px 25px #0003;max-width:1200px;padding:24px;position:relative;width:100%}.curriculum-image-wrapper{animation:floatImage 6s ease-in-out infinite;height:160px;position:absolute;right:24px;top:0;width:160px;z-index:1}.curriculum-mascot{filter:drop-shadow(0 4px 8px rgba(0,0,0,.1));height:100%;object-fit:contain;width:100%}.lessons-header{margin-bottom:24px;padding:0;position:relative;text-align:center;width:100%}.lessons-title{color:#4f9fd9;font-size:2.5rem;margin:0 auto;max-width:80%}.lessons-subtitle{color:#000;font-size:1.25rem;margin:10px auto 0}.tutorial-container{margin-bottom:24px;text-align:center}.tutorial-button{background-image:linear-gradient(90deg,#fbbf24,#f59e0b);border:none;border-radius:9999px;color:#fff;cursor:pointer;font-size:1.25rem;font-weight:700;max-width:400px;padding:12px 24px;text-decoration:none;transition:background-color .3s ease,transform .3s ease;width:100%}.tutorial-button:hover{transform:scale(1.05)}.lessons-list{display:flex;flex-direction:column;gap:24px;margin:0 auto 10px}.lesson-item{align-items:center;background-color:#fff;border-radius:16px;box-shadow:0 5px 15px #0000001a;display:flex;justify-content:space-between;margin:0 auto;max-width:800px;padding:16px 24px;transition:transform .3s ease;width:100%}.lesson-item:hover{transform:scale(1.05)}.lesson-info{flex-grow:1}.lesson-icon,.lesson-info{align-items:center;display:flex}.lesson-icon{background-color:#edf2f7;border-radius:50%;height:50px;justify-content:center;margin-right:16px;width:50px}.lesson-title{color:#4f9fd9;flex-grow:1;font-size:1.25rem}.lesson-button{background-image:linear-gradient(90deg,#4f9fd9,#9cd8fa);border:none;border-radius:9999px;color:#fff;cursor:pointer;font-size:1.25rem;outline:none;padding:12px 24px;transition:background-color .3s ease,transform .3s ease}.lesson-button:hover{transform:scale(1.05)}.lesson-item:first-child .lesson-title,.lesson-popup .lesson-title{color:#fbbf24}.lesson-item:first-child .lesson-button,.lesson-popup .lesson-button{background-image:linear-gradient(90deg,#fbbf24,#f59e0b)}.lesson-item:first-child .icon,.lesson-popup .icon{stroke:#fbbf24;color:#fbbf24}.lesson-rhythm .icon,.lesson-rhythm .lesson-title{stroke:#f97316;color:#f97316}.lesson-rhythm .lesson-button{background-image:linear-gradient(90deg,#f97316,#ea580c)}.lesson-harmony .icon,.lesson-harmony .lesson-title{stroke:#3b82f6;color:#3b82f6}.lesson-harmony .lesson-button{background-image:linear-gradient(90deg,#3b82f6,#2563eb)}.lesson-instrument .icon,.lesson-instrument .lesson-title{stroke:#7c3aed;color:#7c3aed}.lesson-instrument .lesson-button{background-image:linear-gradient(90deg,#7c3aed,#6d28d9)}.lesson-melody .icon,.lesson-melody .lesson-title{stroke:#ef4444;color:#ef4444}.lesson-melody .lesson-button{background-image:linear-gradient(90deg,#ef4444,#dc2626)}.lesson-form .icon,.lesson-form .lesson-title{stroke:#10b981;color:#10b981}.lesson-form .lesson-button{background-image:linear-gradient(90deg,#10b981,#059669)}.lesson-dynamics .icon,.lesson-dynamics .lesson-title,.lesson-showcase .icon,.lesson-showcase .lesson-title{stroke:#fbbf24;color:#fbbf24}.lesson-dynamics .lesson-button,.lesson-showcase .lesson-button{background-image:linear-gradient(90deg,#fbbf24,#f59e0b)}.lesson-popup .icon,.lesson-popup .lesson-title{stroke:#fbbf24;color:#fbbf24}.lesson-popup .lesson-button{background-image:linear-gradient(90deg,#fbbf24,#f59e0b)}@keyframes floatImage{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.lessons-screen{padding:8px}.lessons-card{padding:16px}.lessons-title{font-size:2rem;max-width:100%}.lesson-item{align-items:flex-start;flex-direction:column;gap:12px;padding:12px 16px}.lesson-button{padding:8px 16px;width:100%}.lesson-info{width:100%}.curriculum-image-wrapper{height:120px;margin:0 auto 20px;position:relative;right:0;top:0;width:120px}.lessons-header{padding:0;text-align:center}}@media (min-width:769px) and (max-width:1024px){.curriculum-image-wrapper{height:140px;width:140px}.lessons-header{padding-right:160px}}@media (max-width:600px){.lessons-card{align-items:center;display:flex;flex-direction:column}.curriculum-image-wrapper{margin-bottom:16px;order:-1}.lessons-title{font-size:1.8rem}}.curriculum-image-wrapper,.lessons-title{transition:all .3s ease-in-out}.lesson-plan{background-color:#fff;border-radius:20px;box-shadow:0 4px 10px #0000001a;margin:20px auto;max-width:80%;padding:40px}.lesson-content{display:flex;flex-wrap:wrap;gap:40px;justify-content:space-between}.lesson-plan section{background-color:#fff;border-radius:15px;box-shadow:0 2px 8px #0003;box-sizing:border-box;flex-basis:calc(50% - 20px);flex-grow:1;flex-shrink:1;margin-top:20px;min-width:300px;padding:20px;transition:transform .3s ease}.lesson-plan section:hover{transform:scale(1.05)}p{color:#2e2e2e;font-size:1.2rem}.lesson-plan h1{font-size:2.5rem;margin-bottom:20px;text-align:center;width:100%}.lesson-plan h1,.lesson-plan h2{color:#4f9fd9;font-family:Varela Round,sans-serif}.lesson-plan h2{font-size:2rem;margin-bottom:10px}.lesson-plan h3{color:#4f9fd9;font-size:1.5rem;margin-bottom:20px}.lesson-plan ul{color:#000;list-style-type:none;padding-left:0}.lesson-plan li{color:#000;font-size:1rem;margin-bottom:10px}.present-button-container{display:flex;justify-content:center;margin-top:40px}.present-button-lessonplan{background-color:#4f9fd9;border:none;border-radius:9999px;color:#fff;cursor:pointer;font-size:1.25rem;font-weight:700;padding:16px 40px;text-align:center;transition:background-color .3s ease,transform .3s ease;width:300px}.present-button-lessonplan:hover{background-color:#00b2b2;transform:scale(1.05)}@media (max-width:768px){.lesson-plan{max-width:95%;padding:20px}.lesson-content{gap:20px}.lesson-plan section{min-width:100%}.lesson-plan h1{font-size:2rem}.lesson-plan h2{font-size:1.5rem}.present-button-lessonplan{max-width:none;width:100%}}.pdf-container{margin-top:20px}.MuiAccordion-root{border:1px solid #4f9fd933!important}.MuiAccordionSummary-root{background-color:#4f9fd90d!important}.MuiAccordionSummary-root.Mui-expanded{background-color:#4f9fd91a!important}*{box-sizing:border-box;color:#2e2e2e;font-family:Varela Round,sans-serif}.present-screen{background-color:#fff;border-radius:20px;box-shadow:0 4px 10px #0000001a;margin:20px auto;max-width:90%;padding:40px}.present-content{align-items:flex-start;display:flex;flex-direction:row;gap:40px;justify-content:space-between;width:100%}.content-container{align-items:center;background-color:#4f9fd90d;box-shadow:0 4px 10px #4f9fd933;display:flex;flex:1 1;justify-content:center;max-width:60%;min-height:300px;padding:0}.content-container,.media-container{border-radius:15px;position:relative}.media-container{aspect-ratio:16/9;overflow:hidden;width:100%}.media-container iframe,.media-container img{border:none;border-radius:15px;display:block;height:100%;width:100%}.unity-game-container{aspect-ratio:16/9;border-radius:15px;overflow:hidden;position:relative;width:100%}.unity-game-container canvas{border-radius:15px;height:100%!important;width:100%!important}.unity-game-container{background-color:initial}.instructions-container{background-color:#f9f9f9;border-radius:15px;box-shadow:0 4px 10px #0000001a;flex:1 1;max-width:35%;padding:20px;text-align:left}.instructions-container h3{text-align:center}.activities-list,.activity-item,.instruction-section,.section-header{text-align:left}.present-screen h1{color:#4f9fd9;font-size:2.5rem;margin-bottom:20px;text-align:center}.present-screen h2{color:#4f9fd9;font-size:2rem;margin-bottom:10px;text-align:center}.present-screen h3{color:#4f9fd9;font-size:1.5rem;margin-bottom:20px}.present-controls{display:flex;justify-content:space-between;margin-top:20px;max-width:1240px;width:100%}.present-button{background-color:#a847e4;border:none;border-radius:9999px;color:#fff;cursor:pointer;font-size:1.25rem;font-weight:700;padding:12px 24px;transition:background-color .3s ease,transform .3s ease}.present-button:hover{background-color:#cd84f2;transform:scale(1.05)}@media (max-width:1024px){.present-content{flex-direction:column}.content-container,.instructions-container{max-width:100%;width:100%}.present-controls{flex-direction:column;gap:16px}.present-button{width:100%}.present-screen h1{font-size:2rem}.present-screen h2{font-size:1.5rem}}.game-screen{align-items:center;background-color:#2e2e2e;display:flex;flex-direction:column;justify-content:flex-start;min-height:calc(100vh + 220px);overflow-x:hidden;padding:20px 20px calc(220px + 2rem)}.game-title{color:#fff;font-size:2.5rem;margin-bottom:20px;text-align:center}.game-container{background-color:#000;height:800px;margin:0 auto;position:relative;width:1067px}.game-container #unity-container{height:100%;left:0;position:absolute;top:0;width:100%}.game-container #unity-canvas{height:800px!important;width:1067px!important}@media (max-width:1100px){.game-container{aspect-ratio:4/3;height:auto;width:100%}.game-container #unity-canvas{height:100%!important;width:100%!important}.game-title{font-size:2rem}}@media only screen and (min-device-width:768px) and (max-device-width:1024px){.game-container{aspect-ratio:4/3;height:auto;max-width:1067px;width:100%}}.games-display-screen{background:linear-gradient(135deg,#4f9fd9,#9cd8fa);min-height:100vh;padding:40px 20px}.section-title{gap:20px;justify-content:center;margin-bottom:40px;margin-left:auto;margin-right:auto}.section-subtitle,.section-title{align-items:center;display:flex;max-width:1200px}.section-subtitle{color:#4f9fd9;font-family:Varela Round,sans-serif;font-size:2.5rem;margin:20px auto 30px;position:relative;text-shadow:none}.section-subtitle:after{background:#4f9fd94d;content:"";flex-grow:1;height:2px;margin-left:20px}.games-grid,.new-releases-grid{grid-gap:30px;display:grid;gap:30px;margin:0 auto;max-width:1200px}.new-releases-grid{grid-template-columns:repeat(3,1fr);margin-bottom:60px}.games-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.game-card{background-color:#fff;border-radius:20px;box-shadow:0 15px 30px #0000001a;height:100%;overflow:hidden;transition:all .3s ease}.game-card:hover{box-shadow:0 20px 40px #0003;transform:translateY(-5px)}.new-release-card{position:relative}.new-release-badge{background:#ff4d4d;border-radius:20px;box-shadow:0 4px 8px #0000001a;color:#fff;font-size:.9rem;font-weight:600;padding:8px 16px;position:absolute;right:20px;top:20px;z-index:1}.game-link{color:inherit;display:flex;flex-direction:column;height:100%;text-decoration:none}.game-image-container{height:200px;overflow:hidden;position:relative;width:100%}.game-image{height:100%;object-fit:cover;transition:transform .3s ease;width:100%}.game-card:hover .game-image{transform:scale(1.05)}.game-details{display:flex;flex-direction:column;flex-grow:1;padding:25px}.game-details h2{color:#4f9fd9;font-family:Varela Round,sans-serif;font-size:1.8rem;margin-bottom:12px}.game-details p{color:#2e2e2e;font-size:1.1rem;line-height:1.5}@media (max-width:1024px){.new-releases-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.games-display-screen{padding:16px}.section-title{flex-direction:column;font-size:2.5rem}.section-subtitle{font-size:2rem;margin:40px 0 20px}.new-releases-grid{grid-template-columns:1fr}.game-details h2{font-size:1.5rem}.game-details p{font-size:1rem}.songly-flag-container{height:100px;width:100px}}.header-container{align-items:center;background-color:#fff;border-radius:20px;display:flex;justify-content:center;margin:0 auto 2rem;max-width:1200px;padding:20px;position:relative}.songly-flag-container:hover .songly-flag{animation:wavingFlagHover 1s ease-in-out infinite;filter:drop-shadow(0 6px 12px rgba(0,0,0,.2))}@keyframes wavingFlagHover{0%,to{transform:rotate(0deg) scale(1.05)}25%{transform:rotate(-8deg) scale(1.05)}75%{transform:rotate(8deg) scale(1.05)}}@media (max-width:1024px){.songly-flag-container{height:140px;width:140px}.section-title{font-size:3rem}}@media (max-width:768px){.games-display-screen{padding-top:60px}.header-container{flex-direction:column;gap:20px}.songly-flag-container{height:120px;margin:0 auto;position:relative;right:auto;top:auto;transform:none;width:120px}.section-title{font-size:2.5rem}}.songly-flag{animation:fadeInRight .6s ease-out forwards}@keyframes fadeInRight{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.title-container{margin-bottom:20px;position:relative}.games-content{background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #0000001a;margin:0 auto;max-width:1200px;padding:25px;position:relative;width:100%}.songly-flag-container{top:0}@media (max-width:768px){.songly-flag-container{height:120px;width:120px}}@media (max-width:1240px){.songly-flag-container{right:20px}}.title-section{align-items:center;display:flex;justify-content:center;margin:0 auto 40px;max-width:1200px;position:relative}.section-title{color:#fff;font-family:Varela Round,sans-serif;font-size:3.5rem;text-align:center}.songly-flag-container{height:160px;position:absolute;right:0;width:160px}.songly-flag{height:100%;object-fit:contain;transition:transform .3s ease;width:100%}.songly-flag:hover{transform:rotate(-5deg)}@media (max-width:768px){.title-section{flex-direction:column;gap:20px}.songly-flag-container{height:120px;position:relative;width:120px}.section-title{font-size:2.5rem}}.canva-screen{background-color:#f8f9fa;font-family:Varela Round,sans-serif;min-height:100vh;padding:30px;text-align:center}.embed-iframe{border:none;border-radius:8px;box-shadow:0 2px 8px #3f455129;display:block;height:600px;margin:0 auto 20px;max-width:800px;width:100%}.message{color:#333;font-size:1.2rem;margin-bottom:20px}.button-container{display:flex;gap:24px;justify-content:center}.shared-button{align-items:center;background-color:#fff;border:2px solid #4f9fd9;border-radius:9999px;color:#4f9fd9;cursor:pointer;display:inline-flex;font-size:1.25rem;font-weight:700;gap:8px;justify-content:center;padding:12px 28px;transition:transform .3s ease,background-color .3s ease,color .3s ease}.shared-button:hover{background-color:#00b2b2;border-color:#00b2b2;color:#fff;transform:scale(1.05)}.shared-button:focus{box-shadow:0 0 0 2px #4f9fd966;outline:none}@media (max-width:768px){.canva-screen{padding:16px}.embed-iframe{height:400px}.button-container{flex-direction:column;gap:16px}.shared-button{font-size:1rem;padding:10px 20px;width:100%}}body{font-family:Varela Round,sans-serif}.App{background:linear-gradient(135deg,#4f9fd9,#9cd8fa);min-height:100vh;text-align:center}.App-header{align-items:center;background:#0000;display:flex;justify-content:center;padding:20px 0}.App-link{color:#2e2e2e;font-size:1.2rem;margin:0 15px;text-decoration:none}.App-link:hover{color:#00b2b2;text-decoration:underline}.button{background-color:#4f9fd9;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:1.2rem;margin-top:20px;padding:15px 30px;transition:background-color .3s ease}.button:hover{background-color:#00b2b2}h1,h2{color:#2e2e2e;font-family:Varela Round,sans-serif;font-weight:700;margin:10px}.navbar{background-color:#0000001a;overflow:hidden;padding:10px 20px}.navbar,.navbar-content{align-items:center;box-sizing:border-box;display:flex;width:100%}.navbar-content{justify-content:space-between;margin:0 auto;padding:0 20px}.navbar-logo{height:50px;margin-right:auto}.navbar-links{display:flex;gap:30px;list-style-type:none;margin:0;padding:0}.navbar-links li{font-size:1.2rem;margin:0}.navbar-links a{color:#fff;margin-right:40px;text-decoration:none;transition:color .3s ease}.navbar-links a:hover{color:#00b2b2}.navbar-text{color:#fff;font-size:1.2rem}@media (max-width:768px){.navbar{padding:8px}.navbar-content,.navbar-links{flex-direction:column;gap:12px}.navbar-links{text-align:center;width:100%}.navbar-links a{margin-right:0}.navbar-logo{height:40px}}.draggable-keyboard{background:#fff;border-radius:8px;box-shadow:0 4px 15px #0003;position:fixed;touch-action:none;z-index:1000}.keyboard-controls{align-items:center;background:#4f9fd9;border-radius:8px 8px 0 0;color:#fff;display:flex;justify-content:space-between;padding:8px}.octave-button{background:#ffffff1a;border:2px solid #fffc;border-radius:8px;box-shadow:0 2px 4px #0000001a;color:#fff;cursor:pointer;font-size:18px;margin:0 5px;min-height:44px;min-width:50px;padding:12px 20px;text-shadow:0 1px 2px #0003;transition:all .15s ease-in-out}.octave-button:active{background:#fff3;box-shadow:0 1px 2px #0000001a;transform:scale(.95)}.octave-display{border:2px solid #ffffff4d;border-radius:12px;box-shadow:inset 0 1px 3px #0000001a;font-size:18px;font-weight:600;letter-spacing:.5px;padding:8px 20px}.close-button,.octave-display{background:#ffffff1a;text-shadow:0 1px 2px #0003}.close-button{border:2px solid #fffc;border-radius:8px;box-shadow:0 2px 4px #0000001a;color:#fff;cursor:pointer;font-size:20px;min-height:44px;min-width:44px;padding:8px 16px;transition:all .15s ease-in-out}.close-button:active{background:#fff3;box-shadow:0 1px 2px #0000001a;transform:scale(.95)}.piano-keyboard{display:flex;height:calc(100% - 40px);padding:5px;position:relative}.octave-container{display:flex;flex:12 1;height:100%;position:relative}.key{align-items:flex-end;border:1px solid #ccc;cursor:pointer;display:flex;justify-content:center;padding-bottom:5px;touch-action:none;-webkit-user-select:none;user-select:none}.key.white{flex:1 1;height:100%}.piano-keyboard>.key.white{flex:1 1;max-width:4%}.key.black{height:60%;margin:0 -15px;width:30px}.key.white.active,.key.white:active{background:#e0e0e0}.key.black.active,.key.black:active{background:#333}.note-label{color:#666;font-size:10px}.key.black .note-label{color:#fff}@media (max-width:768px){.draggable-keyboard{border-radius:8px;bottom:20px!important;box-shadow:0 2px 10px #0003;height:200px!important;left:20px!important;position:fixed!important;touch-action:none;transform:none!important;width:calc(100% - 40px)!important}.draggable-keyboard.mobile{cursor:move;-webkit-user-select:none;user-select:none}.keyboard-controls{cursor:move;padding:12px;touch-action:none}.octave-button{font-size:20px;margin:0 8px;padding:15px 25px}.octave-display{font-size:20px;padding:12px 25px}.close-button{font-size:24px;padding:12px 20px}.close-button:active,.octave-button:active{transform:scale(.92);transition:transform .1s ease-in-out}.piano-keyboard{height:calc(100% - 68px)}.key.white{min-width:40px}.key.black{min-width:25px}.note-label{font-size:12px}}.start-note-button{background:#ffffff1a;border:2px solid #fffc;border-radius:8px;box-shadow:0 2px 4px #0000001a;color:#fff;cursor:pointer;font-size:18px;margin:0 5px;min-height:44px;min-width:100px;padding:12px 20px;text-shadow:0 1px 2px #0003;transition:all .15s ease-in-out}.start-note-button:active{background:#fff3;box-shadow:0 1px 2px #0000001a;transform:scale(.95)}@media (max-width:768px){.start-note-button{font-size:20px;margin:0 8px;padding:15px 25px}.start-note-button:active{transform:scale(.92);transition:transform .1s ease-in-out}}.combat-label-container{align-items:center;display:flex;height:100%;justify-content:center;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:10}.combat-label{background-color:#fffc;border-radius:2px;box-shadow:0 1px 3px #0003;padding:2px 4px;transform-origin:center center}.key{overflow:visible!important;position:relative}.key.white{background:#fff;z-index:1}.key.black{background:#000;z-index:2}.key.black .combat-label,.key.white .combat-label{background-color:#ffffffe6}.keyboard-toggle{background:#4f9fd9;border:none;border-radius:25px;bottom:20px;box-shadow:0 2px 10px #0003;color:#fff;cursor:pointer;font-size:24px;height:50px;position:fixed;right:20px;transition:transform .2s;width:50px;z-index:999}.keyboard-toggle:hover{transform:scale(1.1)}@media (max-width:768px){.keyboard-toggle{bottom:10px;right:10px}}
/*# sourceMappingURL=main.3f49e6ed.css.map*/