@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#111;color:#fff;font-family:Poppins,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;overflow-x:hidden}*,body{box-sizing:border-box;margin:0;padding:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}@media (max-width:768px){.record-player{height:250px!important;width:250px!important}.vinyl-record{height:100px!important;width:100px!important}.vinyl-label span{font-size:10px!important}.content-box{max-width:90%!important;padding:15px!important}}@media (max-width:480px){.record-player{height:200px!important;margin:1rem!important;width:200px!important}.vinyl-menu{flex-direction:row!important;flex-wrap:wrap!important;gap:10px!important}.buttons button{font-size:.9rem!important;padding:8px 16px!important}}html{scroll-behavior:smooth}.record-player-container{align-items:center;border-radius:20px;color:#fff;display:flex;flex-direction:column;justify-content:center;max-width:100%;min-height:400px;padding:20px;position:relative;text-align:center;transition:all .3s ease;width:100%}.record-player-container.drop-active{background:#00b8811a;box-shadow:0 0 30px #00b88133}.record-player{align-items:center;background:linear-gradient(145deg,#2d2d2d,#1a1a1a);border:8px solid #333;border-radius:50%;box-shadow:0 10px 30px #000000b3,inset 0 2px 8px #ffffff1a;display:flex;height:300px;justify-content:center;margin:2rem;overflow:hidden;position:relative;transition:transform .3s ease,box-shadow .3s ease;width:300px}.record-player:hover{box-shadow:0 15px 40px #000c,inset 0 2px 10px #ffffff26;transform:translateY(-5px)}.drop-indicator{align-items:center;animation:pulse 1.5s infinite;background:#000000b3;border-radius:50%;display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:10}.drop-indicator span{color:#fff;font-size:1.2rem;font-weight:600;text-shadow:0 0 10px #00b881cc}.vinyl{align-items:center;background:radial-gradient(circle,#111 10%,#000 20%,#222 40%,#000 60%,#222 80%);border-radius:50%;box-shadow:0 0 15px #000000b3;display:flex;height:180px;justify-content:center;position:absolute;transition:transform .3s ease-in-out;width:180px}.vinyl:after{background:#e0e0e0;border:2px solid #ccc;border-radius:50%;content:"";height:20px;position:absolute;width:20px}.spinning{animation:spin 4s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.controls{animation:fadeIn .5s ease-out;margin-top:20px;max-width:300px;width:100%}.buttons{display:flex;gap:10px;justify-content:center}.buttons button{background:linear-gradient(180deg,#444,#333);border:none;border-radius:30px;box-shadow:0 3px 5px #0003;color:#fff;cursor:pointer;font-weight:600;margin:10px 5px;min-width:80px;overflow:hidden;padding:12px 24px;position:relative;transition:all .2s ease}.buttons button:hover{background:linear-gradient(180deg,#555,#444);box-shadow:0 5px 8px #0000004d;transform:translateY(-2px)}.buttons button:active{box-shadow:0 2px 3px #0003;transform:translateY(1px)}.buttons button.active{background:linear-gradient(180deg,#00b881,#009e6e);box-shadow:0 0 10px #00b88180}.buttons button.active:hover{background:linear-gradient(180deg,#00d4a4,#00b881)}.now-playing{background:#14141480;border-radius:10px;box-shadow:inset 0 0 5px #00000080;margin-top:20px;padding:15px}.now-playing p{color:#00b881;font-weight:500;margin:0 0 10px}.progress-bar{background:#222;border-radius:5px;box-shadow:inset 0 0 5px #000c;height:10px;margin:10px auto;overflow:hidden;position:relative;width:100%}.progress{background:linear-gradient(90deg,#00b881,#00d4a4);box-shadow:0 0 10px #00b881b3;height:100%;left:0;position:absolute;top:0;transform:scaleX(0);transform-origin:left;transition:transform .1s linear;width:100%}.time-display{display:flex;font-size:.8rem;justify-content:space-between;margin-top:5px;opacity:.7}.empty-message{animation:pulse 2s infinite;background:#1414144d;border-radius:10px;margin-top:20px;padding:15px}.empty-message p{font-size:.9rem;margin:0;opacity:.8}@media (max-width:768px){.record-player{height:250px!important;margin:1rem!important;width:250px!important}.vinyl{height:150px!important;width:150px!important}.buttons{flex-wrap:wrap;gap:8px;justify-content:center}.buttons button{font-size:.9rem!important;min-width:70px!important;padding:8px 16px!important}.now-playing{padding:10px}.now-playing p{font-size:.9rem}.time-display{font-size:.7rem}}@media (max-width:480px){.record-player{height:200px!important;margin:.5rem!important;width:200px!important}.vinyl{height:120px!important;width:120px!important}.buttons button{font-size:.8rem!important;min-width:60px!important;padding:6px 12px!important}.now-playing{padding:8px}.now-playing p{font-size:.8rem}.time-display{font-size:.6rem}}.content-box{animation:fadeIn .5s ease-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#141414cc;border:1px solid #ffffff0d;border-radius:15px;box-shadow:0 10px 30px #0000004d,inset 0 2px 10px #ffffff0d;color:#fff;margin:30px auto;max-width:600px;padding:25px;text-align:center;transition:all .3s ease;width:90%}.content-box h2{background:linear-gradient(90deg,#00b881,#0088b8);-webkit-background-clip:text;background-clip:text;color:#0000;display:inline-block;font-size:1.8rem;margin-bottom:15px}.content-box p{font-size:1rem;line-height:1.6;margin-bottom:15px}.content-box a{color:#00b881;position:relative;text-decoration:none;transition:all .2s ease}.content-box a:hover{color:#00d4a4;text-shadow:0 0 5px #00d4a480}.content-box a:after{background:linear-gradient(90deg,#00b881,#0088b8);bottom:-2px;content:"";height:2px;left:0;position:absolute;transition:width .3s ease;width:0}.content-box a:hover:after{width:100%}.contact-container{align-items:center;display:flex;flex-direction:column;gap:15px;text-align:center}.contact-item{align-items:center;display:flex;gap:12px;transition:transform .2s ease}.contact-item:hover{transform:translateY(-2px)}.contact-item a{align-items:center;background:#ffffff1a;border-radius:50%;display:flex;padding:5px;transition:all .3s ease}.contact-item a:hover{background:#00b88133;transform:scale(1.1)}.contact-item span{font-size:16px}@media (max-width:768px){.content-box{margin:20px auto;padding:20px;width:95%}.content-box h2{font-size:1.5rem;margin-bottom:12px}.content-box p{font-size:.9rem;line-height:1.5;margin-bottom:12px}.contact-item span{font-size:14px}}@media (max-width:480px){.content-box{margin:15px auto;padding:15px;width:100%}.content-box h2{font-size:1.3rem;margin-bottom:10px}.content-box p{font-size:.85rem;line-height:1.4;margin-bottom:10px}.contact-item span{font-size:13px}}.project-screenshot{border:1px solid #333;border-radius:8px;margin-bottom:.75rem;margin-top:.75rem;max-width:600px;transition:transform .3s ease-in-out;width:100%}.project-screenshot:hover{cursor:pointer;position:relative;transform:scale(2);z-index:10}.vinyl-record{-webkit-tap-highlight-color:transparent;align-items:center;border:1px solid #ffffff1a;border-radius:50%;box-shadow:0 5px 15px #00000080,inset 0 0 10px #000c;color:#fff;cursor:grab;display:flex;height:120px;justify-content:center;margin:15px;overflow:hidden;position:relative;touch-action:none;transition:all .3s ease;width:120px}.vinyl-record:hover{box-shadow:0 10px 20px #000000b3;transform:translateY(-5px) scale(1.05)}.vinyl-record.pressed,.vinyl-record:active{box-shadow:0 2px 5px #0000004d;transform:scale(.95)}.vinyl-record.dragging{cursor:grabbing;opacity:.6;transform:scale(1.1)}.vinyl-grooves{background:repeating-radial-gradient(circle at center,#0000 0,#0000 4px,#0000004d 5px,#0000 6px);border-radius:50%;height:100%;position:absolute;width:100%;z-index:0}.vinyl-label{align-items:center;background:#fff;border-radius:50%;box-shadow:0 0 5px #00000080;display:flex;height:40%;justify-content:center;position:relative;width:40%;z-index:1}.vinyl-label span{color:#222;font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase}@keyframes pulse{0%{box-shadow:0 0 0 0 #fff6}70%{box-shadow:0 0 0 10px #fff0}to{box-shadow:0 0 0 0 #fff0}}@media (max-width:768px){.vinyl-record{cursor:pointer}.vinyl-record.pressed,.vinyl-record:active{box-shadow:0 2px 5px #0000004d;transform:scale(.95)}.vinyl-record.dragging{cursor:grabbing;transform:scale(1.1)}}.modal-overlay{align-items:center;animation:fadeIn .3s ease-out forwards;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#000000b3;bottom:0;display:flex;justify-content:center;left:0;opacity:0;position:fixed;right:0;top:0;transition:opacity .3s ease-out;z-index:1000}.modal-overlay.closing{animation:fadeOut .3s ease-out forwards}.modal-content{animation:fadeIn .3s ease-out forwards;background:#141414f2;border:1px solid #ffffff1a;border-radius:20px;box-shadow:0 10px 30px #0000004d;max-height:80vh;max-width:500px;opacity:0;overflow-y:auto;padding:30px;position:relative;transition:opacity .3s ease-out;width:90%}.modal-content.closing{animation:fadeOut .3s ease-out forwards}.modal-close{background:none;border:none;border-radius:50%;color:#fff;cursor:pointer;font-size:24px;padding:5px 10px;position:absolute;right:15px;top:15px;transition:all .3s ease}.modal-close:hover{background:#ffffff1a;transform:rotate(90deg)}.modal-content h2{background:linear-gradient(90deg,#fff,#ccc);-webkit-background-clip:text;background-clip:text;color:#0000;font-size:1.8rem;margin:0 0 20px}.modal-body{color:#fff;line-height:1.6}.modal-body p{margin-bottom:15px;opacity:.9}.modal-body p:last-child{margin-bottom:0}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@media (max-width:768px){.modal-content{padding:25px;width:95%}.modal-content h2{font-size:1.5rem;margin-bottom:15px}.modal-body{font-size:.95rem}}body,html{background-color:#111;color:#fff;font-family:Poppins,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;height:100%;margin:0;overflow-x:hidden}.app-container{align-items:center;display:flex;flex-direction:column;justify-content:flex-start;min-height:100vh;padding:40px 20px;position:relative;text-align:center;transition:all .3s ease;width:100%;z-index:1}.app-container.dragging-active{background-color:#0000004d}header{margin-bottom:40px}.main-title{background:linear-gradient(90deg,#fff,#ccc);-webkit-background-clip:text;background-clip:text;color:#0000;font-size:3rem;font-weight:700;margin:0 0 10px;text-shadow:0 5px 15px #0000001a}.subtitle{font-size:1.2rem;font-weight:300;margin:0;opacity:.8}.vinyl-menu{display:flex;flex-wrap:wrap;gap:30px;justify-content:center;margin:20px 0 40px}.vinyl-wrapper{align-items:center;display:flex;flex-direction:column;transition:all .3s ease}.vinyl-hint{font-size:.9rem;margin-top:10px;opacity:.7;transition:opacity .3s ease}.vinyl-wrapper:hover .vinyl-hint{opacity:1}.animated-background{animation:gradientAnimation 15s ease infinite;background:linear-gradient(120deg,#111,#1b2735,#192230);background-size:400% 400%;height:100%;left:0;position:fixed;top:0;width:100%;z-index:-1}@keyframes gradientAnimation{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}.view-toggle{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#ffffff1a;border:1px solid #fff3;border-radius:25px;color:#fff;cursor:pointer;font-family:inherit;font-size:.9rem;padding:10px 20px;position:fixed;right:20px;top:20px;transition:all .3s ease;z-index:100}.view-toggle:hover{background:#fff3;transform:translateY(-2px)}.mobile-view{min-height:100vh;overflow-y:auto;padding:80px 20px 40px;position:relative;width:100%;z-index:1}.mobile-content{margin:0 auto;max-width:600px}.mobile-content header{margin-bottom:40px;text-align:center}.mobile-content .main-title{font-size:2.5rem;margin-bottom:10px}.mobile-content .subtitle{font-size:1.1rem;opacity:.8}.mobile-view .vinyl-menu{display:flex;flex-wrap:wrap;gap:30px;justify-content:center;margin:20px 0 40px}.mobile-view .vinyl-wrapper{cursor:pointer;transition:transform .3s ease}.mobile-view .vinyl-wrapper:active{transform:scale(.95)}.mobile-view .vinyl-hint{font-size:1rem;margin-top:10px;opacity:.7;transition:opacity .3s ease}.mobile-view .vinyl-wrapper:hover .vinyl-hint{opacity:1}.contact-content{align-items:center;display:flex;flex-direction:column;gap:20px}.contact-content .contact-item{align-items:center;background:#ffffff0d;border-radius:10px;display:flex;gap:12px;max-width:300px;padding:10px;transition:all .3s ease;width:100%}.contact-content .contact-item:hover{background:#ffffff1a;transform:translateX(5px)}.contact-content .contact-item a{align-items:center;background:#ffffff1a;border-radius:50%;display:flex;padding:8px;transition:all .3s ease}.contact-content .contact-item a:hover{background:#00b88133;transform:scale(1.1)}.contact-content .contact-item span{font-size:1rem;opacity:.9}@media (max-width:768px){.main-title{font-size:2rem}.subtitle{font-size:1rem}.vinyl-menu{align-items:center;flex-direction:column}.mobile-content .main-title{font-size:2rem}.mobile-content .subtitle{font-size:1rem}.mobile-view .vinyl-menu{gap:20px}.mobile-view .vinyl-hint{font-size:.9rem}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.app-container{animation:fadeIn 1s ease-out}
/*# sourceMappingURL=main.ef8bd4d0.css.map*/