@import"https://fonts.googleapis.com/css2?family=Benguiat+ITC&family=Roboto:wght@400;700&display=swap";:root{--bg-normal: #f5e6d3;--text-normal: #222;--accent-normal: #c41e3a;--bg-upside-down: #0a1a2a;--text-upside-down: #aaccff;--accent-upside-down: #446688}body{margin:0;font-family:Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;background-color:var(--bg-normal)}*,*:before,*:after{box-sizing:border-box}#root{width:100%;max-width:100vw;min-height:100vh;display:flex;justify-content:center;align-items:center;overflow-x:hidden}.app-container{width:100%;min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;transition:transform 1.3s ease-out,filter 1.3s ease-out;position:relative;padding:3rem 0 1rem;box-sizing:border-box}.normal-world{background-color:var(--bg-normal);color:var(--text-normal)}.upside-down-world{background-color:var(--bg-upside-down);color:var(--text-upside-down);transform:rotate(180deg);filter:hue-rotate(180deg) brightness(.6) contrast(1.2)}h1{font-family:ITC Benguiat,serif;font-size:6.2rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:2rem;text-shadow:0 0 10px rgba(0,0,0,.5);transition:color 1.3s ease,text-shadow 1.3s ease}.normal-world h1{color:var(--accent-normal);text-shadow:2px 2px 0px #000}.upside-down-world h1{color:#fff;text-shadow:0 0 20px #00f,0 0 40px #00f}.title-container{display:flex;flex-direction:column;align-items:center;margin:4rem 0 3rem}.subtitle{font-family:ITC Benguiat,serif;font-size:1.8rem;text-transform:uppercase;letter-spacing:.2em;margin-top:-1.5rem;opacity:.8;transition:color 1.3s ease}.normal-world .subtitle{color:var(--accent-normal)}.upside-down-world .subtitle{color:#acf;text-shadow:0 0 10px #00f}button{padding:.85rem 1.7rem;font-size:.85rem;font-weight:700;cursor:pointer;border:2px solid currentColor;background:transparent;color:inherit;transition:all .3s ease;z-index:10}button:hover{background-color:#0000001a;transform:scale(1.05)}.toggle-button{letter-spacing:2px}.upside-down-world button:hover{background-color:#ffffff1a}.gesture-controller button:hover{transform:none;background-color:inherit}.gesture-hint-container{display:flex;flex-direction:column;align-items:center;margin-top:5.5rem}.gesture-hint{margin-top:.2rem;font-size:.9rem;line-height:1.5rem;font-weight:700;opacity:.8;font-style:italic;text-align:center}.spotify-container{margin-top:5rem;width:100%;max-width:450px;padding:0 1rem;z-index:10}.instructions-container{margin-top:2rem;padding:1.5rem;background:#0000000d;border-radius:12px;max-width:540px;width:90%;text-align:left;z-index:10}.upside-down-world .instructions-container{background:#ffffff0d}.instructions-container h3{margin-top:0;font-size:1rem;margin-bottom:1rem}.instructions-container ul{margin:0;padding-left:1.2rem;font-size:.9rem;line-height:1.6}.extension-promo{margin-top:1.5rem;margin-bottom:4rem;padding:1.5rem 1.5rem 1rem;border:2px dashed currentColor;border-radius:12px;max-width:540px;width:90%;text-align:center;opacity:.9;z-index:10;transition:all .3s ease}.extension-promo:hover{opacity:1;background:#00000005}.upside-down-world .extension-promo:hover{background:#ffffff0d}.extension-promo h3{margin-top:0;font-size:.9rem;text-transform:uppercase;letter-spacing:1px}.extension-link{display:inline-flex;align-items:center;gap:.5rem;margin:1rem 0;padding:.85rem 1.7rem;color:#c41e3a;text-decoration:none;border:#c41e3a 2px solid;border-radius:4px;font-weight:700;font-size:.85rem;letter-spacing:2.5px;text-transform:uppercase;box-shadow:0 4px 10px #c41e3a66;transition:all .3s ease}.extension-link:hover{transform:scale(1.05);box-shadow:0 6px 30px #c41e3a99}.extension-link img{width:20px;height:20px}.upside-down-world .extension-link{background:linear-gradient(135deg,#468,#2a4060);box-shadow:0 4px 20px #4686}.upside-down-world .extension-link:hover{box-shadow:0 6px 30px #4689}.promo-hint{font-size:.75rem;opacity:.7;font-style:italic;margin-top:1rem;line-height:1.5rem}.footer-disclaimer{position:relative;margin-top:auto;width:100%;text-align:center;padding:2rem;z-index:10}.footer-disclaimer p{font-size:.75rem;line-height:1.4;opacity:.6;max-width:650px;margin:0 auto}.collaboration-cta{margin-top:1.5rem!important;padding:1rem .5rem;border:1px dashed currentColor;border-radius:8px;opacity:.8!important}.collaboration-cta a{color:var(--accent-normal);text-decoration:none;font-weight:700}.upside-down-world .collaboration-cta a{color:var(--text-upside-down)}.privacy-link{display:inline-block;margin-top:1rem;font-size:.7rem;color:inherit;text-decoration:none;opacity:.5;transition:opacity .2s ease}.privacy-link:hover{opacity:.7}.made-by{position:relative;width:100%;text-align:center;padding:.5rem;font-size:.8rem;opacity:.7;transform:rotate(180deg);z-index:10}.made-by a{color:var(--accent-normal);text-decoration:none;font-weight:700}.upside-down-world .made-by a{color:var(--text-upside-down)}@media(max-width:1280px){h1{font-size:2.5rem;margin-bottom:1rem}.subtitle{font-size:1rem;letter-spacing:.1em;margin-top:-.8rem}.title-container{margin-bottom:1.5rem}.spotify-container{max-width:90%;margin-top:6rem}.instructions-container{max-width:90%;padding:1rem}.instructions-container h3{font-size:1rem}.instructions-container ul{font-size:.8rem}.extension-promo{max-width:90%;padding:1rem}.extension-promo h3{font-size:.8rem}.extension-link{padding:.7rem 1.2rem;font-size:.75rem}.footer-disclaimer{padding:1rem}.footer-disclaimer p,.collaboration-cta{font-size:.65rem}}@media(max-width:480px){.app-container{padding:2rem .5rem .5rem}h1{font-size:1.8rem;letter-spacing:.05em;margin-bottom:.5rem}.subtitle{font-size:.7rem;letter-spacing:.08em;margin-top:-.5rem}.title-container{margin-bottom:1.5rem}button{padding:.6rem 1rem;font-size:.7rem}.toggle-button{letter-spacing:1px}.spotify-container{margin-top:6rem}.instructions-container{padding:.8rem;margin-top:1.5rem}.instructions-container h3{font-size:.85rem;margin-bottom:1rem}.instructions-container ul{font-size:.75rem;padding-left:1rem}.extension-promo{margin-top:1rem;margin-bottom:2rem;padding:.8rem}.extension-promo h3{font-size:.75rem}.extension-link{padding:.6rem 1rem;font-size:.7rem;letter-spacing:1.5px;gap:.3rem}.extension-link img{width:16px;height:16px}.promo-hint{font-size:.65rem;line-height:1.3rem}.footer-disclaimer{padding:.8rem}.footer-disclaimer p{font-size:.6rem;max-width:100%}.collaboration-cta{padding:.5rem;font-size:.6rem}.made-by{font-size:.7rem;padding:.5rem}}.privacy-container{max-width:800px;margin:0 auto;padding:3rem 2rem;background-color:var(--bg-normal);color:var(--text-normal);min-height:100vh}.privacy-container h1{font-family:ITC Benguiat,serif;font-size:2.5rem;color:var(--accent-normal);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.5rem;text-shadow:2px 2px 0px #000}.privacy-container .last-updated{font-size:.85rem;opacity:.6;margin-bottom:2rem}.privacy-container h2{font-size:1.3rem;color:var(--accent-normal);margin-top:2rem;margin-bottom:.75rem;border-bottom:2px solid var(--accent-normal);padding-bottom:.5rem}.privacy-container p{line-height:1.7;margin-bottom:1rem}.privacy-container ul{line-height:1.8;padding-left:1.5rem;margin-bottom:1rem}.privacy-container li{margin-bottom:.5rem}.privacy-container code{background:#0000001a;padding:.2rem .4rem;border-radius:4px;font-size:.9rem}.privacy-container a{color:var(--accent-normal);text-decoration:none;font-weight:700}.privacy-container a:hover{text-decoration:underline}.privacy-footer{margin-top:3rem;padding-top:2rem;border-top:1px solid rgba(0,0,0,.1);text-align:center}.privacy-footer p{font-size:.85rem;opacity:.7}@media(max-width:480px){.privacy-container{padding:2rem 1rem}.privacy-container h1{font-size:1.8rem}.privacy-container h2{font-size:1.1rem}}