.image-page{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#000;padding:0;overflow:hidden}.back-button{position:absolute;top:2rem;left:2rem;width:48px;height:48px;padding:0;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid rgba(255,255,255,.5);border-radius:50%;color:#fff;cursor:pointer;transition:all .3s ease;z-index:10}.back-button:hover{border-color:#fffc;background:#ffffff1a;transform:translate(-3px)}.back-button svg{width:20px;height:20px;transform:translate(-2px)}.instruction{position:absolute;bottom:30px;left:50%;transform:translate(-50%);font-size:1.2rem;font-weight:600;opacity:.9;z-index:10;pointer-events:none;color:#fff;text-align:center;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;transition:opacity .3s ease-out}.instruction.hiding{opacity:0}.image-container{width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.vinyl-disc-container{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;pointer-events:none;display:flex;align-items:center;justify-content:center;transition:transform .6s cubic-bezier(.4,0,.2,1),width .6s cubic-bezier(.4,0,.2,1),height .6s cubic-bezier(.4,0,.2,1),left .6s cubic-bezier(.4,0,.2,1);will-change:transform;transform:translate(-50%,-50%) translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden}.vinyl-disc-container.expanded{transform:translate(-50%,-50%) scale(2)}.vinyl-disc-container.rotating{animation:discRotate 5s linear infinite}.vinyl-disc-container.paused{animation-play-state:paused}.vinyl-disc{max-width:min(95vw,550px);max-height:95vh;object-fit:contain;width:100%;height:100%;position:relative;z-index:1;will-change:transform;transform:translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden}.white-circle{position:absolute;width:45%;height:45%;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;pointer-events:none}.donut-video{object-fit:cover;clip-path:circle(45%);-webkit-mask-image:radial-gradient(circle,rgba(0,0,0,1) 45%,rgba(0,0,0,0) 45%);mask-image:radial-gradient(circle,#000 45%,#0000 45%)}.donut-video.video-no-rotate{width:55%!important;height:55%!important;animation:none!important;cursor:pointer;pointer-events:auto!important}.video-hidden{opacity:0;visibility:visible;pointer-events:none;transition:opacity .1s ease-in-out}.video-visible{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .1s ease-in-out;z-index:3}.image-hidden{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .1s ease-in-out,visibility .1s ease-in-out}.image-visible{opacity:1;visibility:visible;pointer-events:none;transition:opacity .1s ease-in-out,visibility .1s ease-in-out}.video-progress-circle{position:absolute;width:55%;height:55%;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;pointer-events:auto}.video-progress-circle circle{pointer-events:stroke;cursor:pointer;transition:stroke-width .2s ease}.video-progress-circle:hover circle{stroke-width:4px}@keyframes discRotate{0%{transform:translate(-50%,-50%) scale(2) rotate(0)}to{transform:translate(-50%,-50%) scale(2) rotate(360deg)}}.vinyl-hand-wrapper{position:absolute;left:calc(50% + min(65vw,500px));top:40%;transform:translateY(-50%) translateZ(0);transform-origin:center top;z-index:5;pointer-events:auto;opacity:0;cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Ccircle cx='40' cy='40' r='35' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E") 40 40,auto!important;display:inline-block;transition:transform .1s ease-out;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}.vinyl-hand-wrapper.dragging{transition:none;cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Ccircle cx='40' cy='40' r='35' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E") 40 40,auto!important}.vinyl-hand-wrapper.entering{animation:handEnter .4s cubic-bezier(.4,0,.2,1) forwards;cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Ccircle cx='40' cy='40' r='35' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E") 40 40,auto!important}.vinyl-hand-wrapper:hover,.vinyl-hand-wrapper:active,.vinyl-hand-wrapper:focus,.vinyl-hand-wrapper.rotated{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Ccircle cx='40' cy='40' r='35' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E") 40 40,auto!important}.vinyl-hand{width:auto!important;height:95vh!important;display:block;pointer-events:none;max-width:none!important;min-width:unset;will-change:transform;transform:translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden}@keyframes handEnter{0%{left:calc(50% + min(65vw,500px) + 200px);opacity:0}50%{opacity:1}to{left:calc(50% + min(65vw,500px));opacity:1}}.album-cover{max-width:100%;max-height:90vh;object-fit:contain;border-radius:12px;box-shadow:0 20px 60px #0000004d;z-index:2;position:relative;max-width:min(90vw,500px);pointer-events:none}.album-cover.animating{animation:albumMoveLeft .6s cubic-bezier(.4,0,.2,1) forwards}.album-cover:not(.animating){transform:translate(calc(-50vw - 50%))}@keyframes albumMoveLeft{0%{transform:translate(0)}to{transform:translate(calc(-50vw - 50%))}}@media (max-width: 768px){.instruction{width:calc(100% - 48px);max-width:none;padding:0 24px;text-align:center;font-size:1rem;left:0;transform:translate(0)}.vinyl-disc{max-width:min(90vw,300px)}.vinyl-hand{width:auto!important;height:60vh!important;max-height:60vh!important;max-width:none!important;min-width:unset}.vinyl-hand-wrapper.entering{animation:handEnterMobile .4s cubic-bezier(.4,0,.2,1) forwards}.vinyl-hand-wrapper{left:calc(50% + min(15vw,50px))}@keyframes handEnterMobile{0%{left:calc(50% + min(15vw,50px) + 150px);opacity:0}50%{opacity:1}to{left:calc(50% + min(15vw,50px));opacity:1}}.vinyl-disc-container.expanded{transform:translate(-90%,-50%) scale(1.5)!important}.vinyl-disc-container.rotating{animation:discRotateMobile 5s linear infinite}@keyframes discRotateMobile{0%{transform:translate(-90%,-50%) scale(1.5) rotate(0)}to{transform:translate(-90%,-50%) scale(1.5) rotate(360deg)}}.white-circle{width:40%!important;height:40%!important}.donut-video.video-no-rotate,.video-progress-circle{width:55%!important;height:55%!important}.album-cover{max-width:min(90vw,300px)}@keyframes albumMoveLeft{0%{transform:translate(0)}to{transform:translate(calc(-50vw - 50%))}}}.app{width:100%;min-height:100vh;display:flex;flex-direction:column;background:#141414;color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;position:relative}.page-header{width:100%;padding:24px;position:fixed;top:0;left:0;z-index:100;background:transparent}.back-link{display:inline-flex;align-items:center;gap:8px;color:#fff;text-decoration:none;font-family:Manrope,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:20px;font-weight:500;transition:opacity .2s ease}.back-link:hover{opacity:.8}.back-link svg{width:24px;height:24px;flex-shrink:0}.text-container{width:100%;padding:160px 40px 0;max-width:700px;margin:0 auto;z-index:10;position:relative}.profile-image{width:100vw;height:60vh;object-fit:cover;display:block;margin:0;margin-left:calc(-50vw + 50%);border-radius:0 0 60px 60px}.text-content{font-family:Manrope,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:20px;line-height:28px;color:#8a8a8a}.text-content p{margin-bottom:1.5rem}.text-content p:last-child{margin-bottom:0}.text-content a.tread-link{color:#fff;text-decoration:none;font-weight:600;transition:opacity .2s ease}.text-content a.tread-link:hover{opacity:.8}.music-section{width:100%;background:#0006;position:relative;scroll-margin-top:-40px}.mood-heading{font-family:Manrope,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:80px;font-weight:500;color:#fff;text-align:center;margin:0;padding-top:120px;padding-bottom:0}.email-footer{width:100%;padding:60px 40px;text-align:center}.email-link{font-family:Manrope,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:18px;font-weight:500;color:#8a8a8a;text-decoration:none;transition:opacity .2s ease}.email-link:hover{opacity:.8}.cube-container{width:100%;height:90vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:0;position:relative}.app h1{margin-bottom:10px;font-size:2.5rem;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.instruction{position:absolute;bottom:30px;left:50%;transform:translate(-50%);font-size:1.2rem;font-weight:600;opacity:.9;z-index:100;pointer-events:none;text-align:center;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.8)}.canvas-container{width:100%;height:100vh;position:absolute;top:0;left:0;background:transparent;pointer-events:auto}.canvas-container canvas{width:100%!important;height:100%!important;display:block;background:transparent!important;opacity:1;touch-action:pan-y pinch-zoom}@media (max-width: 768px){.page-header{padding:24px}.back-link{font-size:20px}.text-container{padding:160px 24px 0}.profile-image{margin-bottom:32px;margin-left:calc(-50vw + 50%)}.text-content{font-size:18px;line-height:26px}.mood-heading{font-size:40px;padding-top:80px}.email-footer{padding:40px 24px}.email-link{font-size:18px}.instruction{width:calc(100% - 48px);max-width:none;padding:0 24px;text-align:center;font-size:1rem;bottom:24px;left:50%;transform:translate(-50%);z-index:100;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.8);opacity:1}}*{margin:0;padding:0;box-sizing:border-box}html,body{margin:0;padding:0;width:100%;min-height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#141414}#root{width:100%;min-height:100vh;background:#141414}