@tailwind base;@tailwind components;@tailwind utilities;:root{--color-background:#1b1a1f;--color-text:#fff;--color-text-secondary:hsla(0,0%,100%,.5);--color-input-background:hsla(0,0%,100%,.03);--color-converting:hsla(0,0%,100%,.1);--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--player-height:96px}body{background-color:var(--color-background);color:var(--color-text);font-family:var(--font-mono);margin:0;padding:0;line-height:1.2;font-size:13px;overflow:hidden;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.outer-container,body{height:100vh;height:100dvh}.outer-container{padding:24px 48px;padding-bottom:calc(48px + var(--player-height) + 200px);display:flex;flex-direction:column}.app-container{display:grid;grid-template-columns:1fr 200px;grid-gap:48px;gap:48px;flex:1 1;min-height:0}.main-content{display:flex;flex-direction:column;gap:16px;min-height:0;width:100%;min-width:0;box-sizing:border-box}.site-header{display:flex;justify-content:space-between;align-items:center;padding:16px 0;background-color:var(--color-background);border-bottom:1px solid hsla(0,0%,100%,.1);position:relative}.site-header h1{color:var(--color-text);margin:0;font-size:24px;font-weight:700}.page-title{margin-bottom:12px;font-size:16px;font-weight:700}.page-title-spacer{height:0;margin-bottom:0}.now-playing{position:absolute;left:50%;transform:translateX(-50%);color:var(--color-text-secondary);font-size:14px;font-style:italic;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:300px}.input-container{border:1px solid var(--color-text);display:flex;align-items:center;margin-top:16px;position:relative;width:100%;min-width:0;box-sizing:border-box}.youtube-input{font-family:inherit;background-color:transparent;border:none;color:var(--color-text);padding:8px 12px;width:100%;outline:none;font-size:max(16px,1em);-webkit-appearance:none;border-radius:0}.youtube-input::placeholder{color:var(--color-text-secondary);font-size:14px}.arrow-button{background:none;border:none;color:var(--color-text);padding:8px 12px;cursor:pointer;font-family:inherit;font-size:inherit;transition:opacity .2s}.arrow-button:disabled{opacity:.5;cursor:not-allowed}.input-container span{position:absolute;right:12px;color:var(--color-text)}.songs-container{flex:1 1;overflow-y:auto;min-height:0;max-height:40vh;display:flex;flex-direction:column;transition:max-height .3s ease;padding-right:8px}.songs-container.expanded{max-height:60vh}.song-list{display:flex;flex-direction:column;gap:1px}.empty-state{justify-content:center;padding:32px 16px;text-align:center;min-height:120px}.empty-state,.song-row{display:flex;align-items:center}.song-row{padding:2px 8px 2px 0;cursor:pointer;position:relative}.song-row.active{color:var(--color-text);background-color:hsla(0,0%,100%,.1)}.song-row.active,.song-row:hover{border-radius:4px;margin-right:4px}.song-row:hover{background-color:hsla(0,0%,100%,.05)}.song-row:hover .song-actions{opacity:1;pointer-events:auto}.song-actions{position:absolute;right:8px;display:flex;gap:4px;opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:10}.song-delete-btn,.song-queue-btn{background:none;color:var(--color-text-secondary);font-size:14px;border:none;cursor:pointer;font-size:16px;padding:2px;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:2px}.song-delete-btn:hover,.song-queue-btn:hover{color:var(--color-text);background-color:hsla(0,0%,100%,.1)}.song-title{flex:1 1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-title:hover{text-decoration:underline}.duration{color:var(--color-text-secondary);font-size:14px;margin-left:16px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.playlists{padding-bottom:calc(var(--player-height) + 16px)}.playlists,.playlists-scroll-container{display:flex;flex-direction:column;gap:6px;overflow-y:auto}.playlists-scroll-container{max-height:30vh;padding-right:4px;padding-bottom:12px}.playlist-title{font-size:inherit;font-weight:400;margin-bottom:12px;position:-webkit-sticky;position:sticky;top:0;background-color:var(--color-background);padding:12px 0 0}.playlist-link,.playlist-title{color:var(--color-text-secondary);font-size:14px}.playlist-link{text-decoration:none;background:none;border:none;padding:0;font:inherit;cursor:pointer;text-align:left;margin-bottom:6px;position:relative;display:block;width:100%}.playlist-link:hover{color:var(--color-text)}.playlist-link:hover .playlist-delete-btn,.playlist-link:hover .playlist-share-btn{opacity:1;pointer-events:auto}.playlist-share-btn{position:absolute;right:24px;top:50%;transform:translateY(-50%);background:none;color:var(--color-text-secondary);font-size:12px;border:none;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:10;padding:2px}.playlist-share-btn:hover{color:var(--color-text)}.playlist-delete-btn{position:absolute;right:4px;top:50%;transform:translateY(-50%);background:none;color:var(--color-text-secondary);border:none;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:10;font-size:14px;padding:2px}.create-playlist,.playlist-delete-btn:hover{color:var(--color-text)}.create-playlist{background:none;border:none;padding:0;font:inherit;cursor:pointer;text-align:left;margin-bottom:6px}.create-playlist:hover{text-decoration:underline}.queue-button{background:none;border:none;color:#fff;font-family:var(--font-mono);font-size:14px;font-weight:500;text-align:left;cursor:pointer;padding:8px 0;width:100%;margin-top:32px;transition:color .2s ease}.queue-button:hover{color:#ccc}.player{position:fixed;bottom:0;left:0;right:0;height:var(--player-height);padding:12px 48px;flex-direction:column;gap:8px;font-size:12px;z-index:100}.player,.player-controls{display:flex;align-items:center}.player-controls{gap:30px;margin-bottom:4px}.player-progress{display:flex;align-items:center;gap:16px;width:100%;max-width:720px}.time{font-size:14px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;min-width:40px;text-align:center}.icon-button,.time{color:var(--color-text-secondary)}.icon-button{background:none;border:none;padding:8px;font-size:14px;cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s}.icon-button:hover{background-color:hsla(0,0%,100%,.1)}.icon-button.active,.icon-button.large,.icon-button:hover{color:var(--color-text)}.icon-button.large{padding:12px}.icon-button.large svg{width:32px;height:32px}.slider-container{position:relative;flex:1 1;height:12px;display:flex;align-items:center;cursor:pointer}.slider-track{right:0;height:4px;background-color:hsla(0,0%,100%,.1);overflow:hidden}.slider-fill,.slider-track{position:absolute;left:0;border-radius:2px}.slider-fill{top:0;bottom:0;background-color:var(--color-text)}.slider-input{position:absolute;left:0;right:0;width:100%;height:100%;opacity:0;cursor:pointer;margin:0}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:hsla(0,0%,100%,.1);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:hsla(0,0%,100%,.2)}.mobile-menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:4px;z-index:1001}.hamburger{width:24px;height:18px;position:relative;display:flex;flex-direction:column;justify-content:space-between}.hamburger span{display:block;height:2px;width:100%;background:var(--color-text);transition:all .3s ease;transform-origin:center}.hamburger.open span:first-child{transform:rotate(45deg) translate(6px,6px)}.hamburger.open span:nth-child(2){opacity:0}.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}.mobile-menu-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);z-index:2000;display:flex}.mobile-menu-content{background:var(--color-background);width:280px;height:100%;display:flex;flex-direction:column;border-right:1px solid hsla(0,0%,100%,.1)}.mobile-menu-header{display:flex;justify-content:flex-end;padding:16px;border-bottom:1px solid hsla(0,0%,100%,.1)}.mobile-menu-close{background:none;border:none;color:var(--color-text-secondary);font-size:14px;font-size:24px;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.mobile-menu-close:hover{color:var(--color-text)}.mobile-menu-body{flex:1 1;padding:16px;overflow-y:auto;display:flex;flex-direction:column}@media (max-width:768px){.outer-container,body{overflow:hidden;height:100dvh}.outer-container{padding:16px;padding-bottom:calc(16px + var(--player-height) + 150px)}.mobile-menu-toggle{display:block}.app-container{grid-template-columns:1fr;gap:16px;flex:1 1;min-height:0}.playlists{display:none}.now-playing{max-width:200px;font-size:12px}.site-header{padding:12px 16px}.site-header h1{font-size:20px}.main-content{min-height:0;flex:1 1}.songs-container{max-height:50vh;overflow-y:auto}.input-container{width:100%}.youtube-input,input[type=email],input[type=password],input[type=text],textarea{font-size:16px!important;-webkit-appearance:none;-moz-appearance:none;appearance:none}.main-content{display:flex;flex-direction:column}.media-input-container{order:2;margin-top:12px;margin-bottom:16px}.songs-container{order:1}.converting-section{order:3}.mobile-menu-body .playlist-title{color:var(--color-text-secondary);font-size:14px;font-weight:400;margin:16px 0 8px;text-transform:uppercase;letter-spacing:.5px}.mobile-menu-body .playlist-title:first-child{margin-top:0}.mobile-menu-body .create-playlist,.mobile-menu-body .mobile-menu-body .queue-button{background:none;border:none;color:var(--color-text);cursor:pointer;font-size:14px;font-family:inherit;text-align:left;padding:8px 0;width:100%;display:flex;align-items:center;justify-content:space-between;transition:color .2s ease}.mobile-menu-body .create-playlist:hover,.mobile-menu-body .playlist-link:hover,.mobile-menu-body .queue-button:hover{color:var(--color-text);opacity:.8}.mobile-menu-body .playlist-delete-btn{background:none;border:none;color:var(--color-text-secondary);cursor:pointer;font-size:16px;padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;opacity:0;transition:all .2s ease}.mobile-menu-body .playlist-link:hover .playlist-delete-btn{opacity:1}.mobile-menu-body .playlist-delete-btn:hover{color:var(--color-text)}.mobile-menu-body .no-playlists{padding:8px 0}.mobile-menu-body .no-playlists-text{color:var(--color-text-secondary);font-size:14px;font-style:italic}}.text-primary{color:var(--color-text-primary)}.text-disabled{color:var(--color-text-disabled)}.surface{background-color:var(--color-surface);border-radius:var(--border-radius)}.surface-hover:hover{background-color:var(--color-surface-hover)}.flex-center{display:flex;align-items:center;justify-content:center}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@font-face{font-family:JetBrains Mono;src:url(/fonts/JetBrainsMono-Regular.woff2) format("woff2")}.terminal-window{background-color:#0c0c0c;border:1px solid #333;border-radius:6px;box-shadow:0 0 30px rgba(0,255,0,.1)}.terminal-header{border-bottom:1px solid #333;padding:8px;display:flex;align-items:center;gap:6px}.terminal-button{width:12px;height:12px;border-radius:50%}.terminal-button-red{background-color:#ff5f56}.terminal-button-yellow{background-color:#ffbd2e}.terminal-button-green{background-color:#27c93f}.terminal-content{padding:16px}.cli-input{background:transparent;border:none;color:#0f0;font-family:JetBrains Mono,monospace}.cli-input:focus{outline:none;box-shadow:none}.cli-prompt:before{content:"$ ";color:#0f0}.audio-player{background:#1a1a1a;border-top:1px solid #333}.progress-bar{height:4px;background:#333}.progress-bar-fill{height:100%;background:#0f0;width:30%}.ascii-art{color:#0f0;white-space:pre;font-family:monospace}.user-profile{position:relative}.user-profile.loading{display:flex;align-items:center;padding:8px}.loading-spinner{width:20px;height:20px;border:2px solid hsla(0,0%,100%,.3);border-top:2px solid var(--color-text)}.sign-in-btn{background:none;border:1px solid var(--color-text-secondary);color:var(--color-text);padding:8px 16px;border-radius:6px;cursor:pointer;font-size:14px;font-family:var(--font-mono);transition:border-color .2s ease}.sign-in-btn:hover{border-color:var(--color-text)}.user-avatar-container{position:relative}.user-avatar{width:32px;height:32px;border-radius:50%;border:none;background:var(--color-text-secondary);color:var(--color-background);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:500;transition:background-color .2s ease}.user-avatar:hover{background:var(--color-text)}.user-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}.user-initial{font-size:14px;font-weight:500}.user-dropdown{position:absolute;top:100%;right:0;margin-top:8px;background:var(--color-background);border:1px solid var(--color-text-secondary);border-radius:8px;padding:12px;min-width:200px;box-shadow:0 4px 12px rgba(0,0,0,.3);z-index:1000}.user-info{margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--color-text-secondary)}.user-email{font-size:14px;color:var(--color-text);margin-bottom:4px}.user-tier{font-size:12px;text-transform:uppercase;letter-spacing:.5px}.sign-out-btn,.user-tier{color:var(--color-text-secondary);font-size:14px}.sign-out-btn{background:none;border:none;cursor:pointer;width:100%;text-align:left;padding:4px 0}.sign-out-btn:hover{color:var(--color-text)}.no-playlists{padding:12px 0}.no-playlists-text{color:var(--color-text-secondary);font-size:14px;font-style:italic}.auth-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;z-index:2000}.auth-modal{background:var(--color-background);border:1px solid var(--color-text-secondary);border-radius:12px;padding:24px;width:100%;max-width:400px;margin:20px;box-shadow:0 8px 24px rgba(0,0,0,.4)}.auth-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.auth-header h3{margin:0;color:var(--color-text);font-size:18px;font-weight:500;font-family:var(--font-mono)}.auth-close{background:none;border:none;color:var(--color-text-secondary);font-size:14px;font-size:24px;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.auth-close:hover{color:var(--color-text)}.auth-form{gap:16px}.auth-field,.auth-form{display:flex;flex-direction:column}.auth-field{gap:6px}.auth-field label{font-size:14px;color:var(--color-text);font-weight:500}.auth-field input{padding:12px;border:1px solid var(--color-text-secondary);border-radius:6px;background:var(--color-background);color:var(--color-text);font-size:max(16px,14px);transition:border-color .2s ease;-webkit-appearance:none}.auth-field input:focus{outline:none;border-color:var(--color-text)}.auth-field input::placeholder{color:var(--color-text-secondary);font-size:14px}.auth-submit{background:var(--color-text);color:var(--color-background);border:none;padding:12px;border-radius:6px;font-size:14px;font-weight:500;font-family:var(--font-mono);cursor:pointer;transition:opacity .2s ease}.auth-submit.sign-up{font-weight:700}.auth-submit:hover:not(:disabled){opacity:.9}.auth-submit:disabled{opacity:.6;cursor:not-allowed}.auth-toggle{background:none;border:none;color:var(--color-text-secondary);font-size:14px;font-family:var(--font-mono);cursor:pointer;padding:8px 0;text-align:center}.auth-toggle:hover{color:var(--color-text);text-decoration:underline}.auth-message{padding:12px;border-radius:6px;font-size:14px;text-align:center;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.auth-message.error{background:rgba(255,67,67,.1);color:#ff4343;border:1px solid rgba(255,67,67,.3)}.auth-message.success{background:rgba(103,132,178,.1);color:rgba(148,162,185,.8);border:1px solid rgba(148,162,185,.8)}.add-songs-button{border:1px solid var(--color-text);background-color:transparent;color:var(--color-text);padding:8px 12px;cursor:pointer;font-size:inherit;font-family:inherit;margin-top:8px;width:100%;display:flex;align-items:center;justify-content:flex-start;transition:opacity .2s;text-align:left;min-width:0;box-sizing:border-box}.add-songs-button:hover{opacity:.8}.media-input-inline{margin-top:8px;padding-top:8px}.footer-menu{margin-top:auto;margin-bottom:var(--player-height);padding:16px 0;border-top:1px solid hsla(0,0%,100%,.1)}.footer-links{display:flex;flex-direction:column;gap:12px}.footer-link{color:var(--color-text-secondary);font-size:14px;text-decoration:none;font-size:13px;padding:4px 0;border:none;background:none;text-align:left;cursor:pointer;transition:color .2s ease}.footer-link:hover{color:var(--color-text)}@media (min-width:769px){.footer-menu{padding:20px 0}.footer-links{gap:14px}.footer-link{font-size:14px;padding:6px 0}}.conversion-status{margin-top:12px;padding:12px;background-color:hsla(0,0%,100%,.05);border-radius:4px;border-left:3px solid var(--color-text)}.status-text{color:var(--color-text-secondary);font-size:14px;font-size:12px;margin-bottom:8px}.progress-indicator{display:flex;gap:4px;align-items:center}.progress-dot{width:4px;height:4px;background-color:var(--color-text-secondary);font-size:14px;border-radius:50%;animation:pulse 1.5s ease-in-out infinite}.progress-dot:first-child{animation-delay:0s}.progress-dot:nth-child(2){animation-delay:.3s}.progress-dot:nth-child(3){animation-delay:.6s}@keyframes pulse{0%,20%,to{opacity:.3;transform:scale(1)}50%{opacity:1;transform:scale(1.2)}}.conversion-result{margin-top:12px;padding:12px;background-color:hsla(0,0%,100%,.05);border-radius:4px;color:var(--color-text-secondary);font-size:14px;font-size:12px;line-height:1.4}.conversion-result.success{border-left:3px solid #27c93f;color:rgba(39,201,63,.8)}.conversion-result.error{border-left:3px solid #ff5f56;color:rgba(255,95,86,.8)}.subscription-modal{max-width:500px;width:90%}.subscription-details{padding:20px 0}.current-plan h3{color:#fff;margin-bottom:20px;font-size:18px}.plan-limits{background:hsla(0,0%,100%,.05);border-radius:8px;padding:16px;margin-bottom:20px}.limit-item{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.limit-item:last-child{margin-bottom:0}.limit-label{color:#ccc;font-size:14px}.limit-value{color:#fff;font-weight:500}.renewal-info{margin-top:16px;padding-top:16px;border-top:1px solid hsla(0,0%,100%,.1)}.renewal-info p{color:#999;font-size:13px;margin:0}.manage-section,.upgrade-section{background:hsla(0,0%,100%,.05);border-radius:8px;padding:20px}.manage-section h4,.upgrade-section h4{color:#fff;margin-bottom:16px;font-size:16px}.pro-benefits ul{list-style:none;padding:0;margin:0 0 20px}.pro-benefits li{color:#ccc;position:relative;padding:8px 0 8px 20px}.pro-benefits li:before{content:"✓";color:#4caf50;font-weight:700;position:absolute;left:0}.upgrade-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:12px 24px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;width:100%;margin-bottom:12px}.upgrade-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px rgba(102,126,234,.4)}.upgrade-btn:disabled{opacity:.6;cursor:not-allowed}.cancel-note,.upgrade-note{color:#999;font-size:12px;text-align:center;margin:0}.cancel-link{background:none;border:none;color:#f44336;text-decoration:underline;cursor:pointer;font-size:14px;padding:8px 0;margin-bottom:12px}.cancel-link:disabled{color:#666;cursor:not-allowed;text-decoration:none}.subscription-btn{background:none;border:none;color:#ccc;padding:8px 16px;cursor:pointer;font-size:14px;text-align:left;width:100%;border-radius:4px;transition:all .2s ease}.subscription-btn:hover{background:hsla(0,0%,100%,.1);color:#fff}.plan-comparison{display:grid;grid-template-columns:1fr 1fr;grid-gap:20px;gap:20px;margin:24px 0}.plan-column{border:2px solid hsla(0,0%,100%,.1);border-radius:12px;padding:24px;background:hsla(0,0%,100%,.02);transition:all .3s ease;position:relative}.plan-column.free-plan:hover{border-color:hsla(0,0%,100%,.2);background:hsla(0,0%,100%,.05)}.plan-column.pro-plan{border-color:#667eea;background:linear-gradient(135deg,rgba(102,126,234,.1),rgba(118,75,162,.1));transform:scale(1.02)}.plan-column.pro-plan:hover{border-color:#7c8ef7;background:linear-gradient(135deg,rgba(102,126,234,.15),rgba(118,75,162,.15));transform:scale(1.03)}.plan-header{text-align:center;margin-bottom:20px;position:relative}.plan-header h5{margin:0 0 8px;font-size:18px;font-weight:600}.plan-header h5,.plan-price{color:var(--color-text-primary)}.plan-price{font-size:24px;font-weight:700;margin-bottom:8px}.plan-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600;white-space:nowrap}.plan-features{margin-bottom:24px}.feature-item{display:flex;align-items:center;gap:12px;margin-bottom:12px;font-size:14px;color:var(--color-text-primary)}.feature-item:last-child{margin-bottom:0}.feature-icon{color:#4caf50;font-weight:700;font-size:16px;min-width:16px}.plan-note{text-align:center;font-size:12px;color:var(--color-text-secondary);font-size:14px;font-style:italic;margin-top:16px}.stylized-upgrade-btn{width:100%;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;padding:16px 24px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden;margin-bottom:16px}.stylized-upgrade-btn:hover:not(:disabled){background:linear-gradient(135deg,#7c8ef7,#8b5fbf);transform:translateY(-2px);box-shadow:0 8px 25px rgba(102,126,234,.4)}.stylized-upgrade-btn:active:not(:disabled){transform:translateY(0);box-shadow:0 4px 15px rgba(102,126,234,.3)}.stylized-upgrade-btn:disabled{opacity:.7;cursor:not-allowed;transform:none;box-shadow:none}.btn-content{display:flex;align-items:center;justify-content:center;gap:8px}.btn-text{flex:1 1}.btn-arrow{font-size:18px;transition:transform .3s ease}.stylized-upgrade-btn:hover:not(:disabled) .btn-arrow{transform:translateX(4px)}.btn-loading{display:flex;align-items:center;justify-content:center;gap:8px}.spinner{width:16px;height:16px;border:2px solid hsla(0,0%,100%,.3);border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media (max-width:768px){.plan-comparison{grid-template-columns:1fr;gap:16px}.plan-column.pro-plan,.plan-column.pro-plan:hover{transform:none}}.loading-spinner{width:40px;height:40px;border:4px solid #333;border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite}.main-content-wrapper{flex:1 1;display:flex;flex-direction:column;min-height:0;min-width:0;max-height:calc(95vh - 250px);width:100%}.songs-container-full{flex:1 1;overflow-y:auto;min-height:0;padding-right:8px;margin-bottom:0}.action-area{flex-shrink:0;width:100%;min-width:0;box-sizing:border-box;padding:16px 0 32px}.action-search{margin-bottom:0}.action-add-songs{margin-bottom:25px}@media (min-width:769px){.volume-control{display:flex;align-items:center;gap:12px;background-color:transparent;padding:12px 20px 12px 14px;border-radius:8px;border:1px solid hsla(0,0%,100%,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:140px;width:100%;box-sizing:border-box}.volume-icon-button{background:none;border:none;color:var(--color-text-secondary);cursor:pointer;padding:4px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s ease;flex-shrink:0}.volume-icon-button:hover{color:var(--color-text);background-color:hsla(0,0%,100%,.1)}.volume-slider-container{position:relative;flex:1 1;height:20px;display:flex;align-items:center;cursor:pointer}.volume-slider{position:absolute;left:0;right:0;width:100%;height:100%;opacity:0;cursor:pointer;margin:0;z-index:2}.volume-slider-container:before{content:"";right:0;background-color:hsla(0,0%,100%,.1)}.volume-slider-container:before,.volume-slider-fill{position:absolute;left:0;top:50%;transform:translateY(-50%);height:3px;border-radius:2px}.volume-slider-fill{background-color:var(--color-text);transition:width .1s ease;z-index:1}.volume-slider-container:hover:before{background-color:hsla(0,0%,100%,.2)}.volume-slider-container:hover .volume-slider-fill{background-color:var(--color-text)}.volume-slider-container:hover .volume-slider-fill:after{content:"";position:absolute;right:-6px;top:50%;transform:translateY(-50%);width:12px;height:12px;background-color:var(--color-text);border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.3)}}@media (max-width:768px){.volume-control{display:none}}.copied-popup{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background-color:rgba(124,116,164,.187);color:var(--color-text);padding:12px 24px;border-radius:6px;font-size:14px;font-weight:medium;z-index:10000;border:0;animation:fadeInOut 2s ease-in-out}@keyframes fadeInOut{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)}20%{opacity:1;transform:translate(-50%,-50%) scale(1)}80%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.9)}}.share-button{background:none;border:0;color:var(--color-text);border-radius:6px;cursor:pointer;font-family:inherit;transition:all .2s;display:inline-flex;align-items:center;justify-content:center}.share-button-large{width:32px;height:32px}.share-button-small{width:24px;height:24px}.share-button:hover{background-color:hsla(0,0%,100%,.1);border-color:hsla(0,0%,100%,.5)}.save-button{background:none;border:0;color:var(--color-text);border-radius:6px;cursor:pointer;font-family:inherit;transition:all .2s;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px}.save-button:hover{background-color:hsla(0,0%,100%,.1);border-color:hsla(0,0%,100%,.5)}.playlist-save-btn{background:none;border:0;color:var(--color-text);border-radius:6px;cursor:pointer;font-family:inherit;transition:all .2s;display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px}.playlist-save-btn:hover{background-color:hsla(0,0%,100%,.1);border-color:hsla(0,0%,100%,.5)}.shared-playlist-info{padding:12px 0}.shared-playlist-info p{margin:0;font-size:13px}.bottom-links{display:flex;flex-direction:column;gap:8px;align-items:flex-end;text-align:right;padding-top:16px;position:relative;z-index:101}.bottom-links .playlist-link{width:auto;text-align:right;justify-content:flex-end;padding:6px 0}@supports (-webkit-touch-callout:none){input,select,textarea{font-size:max(16px,1em)!important;-webkit-appearance:none!important}input:focus,textarea:focus{transform:translateZ(0)}}@media (max-width:768px){.mobile-menu-toggle{display:block!important;color:var(--color-text)!important}.now-playing{display:none!important}.site-header{padding:16px!important}.site-header h1{font-size:18px!important}.mobile-current-song{display:block!important;padding:8px 16px;background:hsla(0,0%,100%,.05);border-bottom:1px solid hsla(0,0%,100%,.1);font-size:12px;color:var(--color-text-secondary);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.input-container{cursor:text!important;font-size:inherit!important;font-family:inherit!important;box-sizing:border-box!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;transition:opacity .2s!important;text-align:left!important;margin:16px 0!important}.input-container,.input-container.no-converting{border:1px solid var(--color-text)!important;background-color:transparent!important;color:var(--color-text)!important;padding:0!important;width:100%!important;max-width:100%!important;position:relative!important;z-index:101!important}.input-container.no-converting{bottom:auto!important;left:auto!important;right:auto!important;border-radius:0!important;margin-left:0!important;margin-right:0!important;margin-bottom:16px!important}.input-container:not(.no-converting){margin-bottom:16px}.filter-input{margin-top:0!important;margin-bottom:0!important}.song-title{font-size:14px!important}.songs-container{max-width:calc(100vw)!important;box-sizing:border-box}.songs-container,.songs-container.has-converting{padding-bottom:0!important}.player{display:flex!important;position:fixed;bottom:0;left:0;right:0;z-index:100;padding:16px}.main-content{padding-bottom:100px!important;width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}.add-songs-button{position:relative!important;width:100%!important;margin:16px 0!important;z-index:1!important}.mobile-menu-overlay{opacity:0;animation:fadeIn .2s ease-out forwards}.mobile-menu-content{transform:translateX(-100%);animation:slideInFromLeft .3s ease-out forwards}.mobile-menu-title{color:#fff!important;font-size:18px!important;font-weight:400!important;margin:0!important;padding-top:18px;font-family:var(--font-mono),monospace!important}.mobile-menu-header{display:flex!important;justify-content:space-between!important;align-items:center!important;padding:16px!important;border-bottom:1px solid hsla(0,0%,100%,.1)!important}.modal-overlay{padding:60px 16px 80px!important}.modal-content{max-height:calc(100vh - 140px)!important}.youtube-input{width:100%!important;max-width:100%!important}.song-row,.youtube-input{box-sizing:border-box!important}.song-row{max-width:calc(100vw)!important}.song-title{max-width:calc(100vw - 60px)!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.main-content-wrapper{flex:1 1!important;display:flex!important;flex-direction:column!important;min-height:0!important;width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;max-height:calc(90vh - 290px)}.songs-container-full{flex:1 1!important;overflow-y:auto!important;min-height:0!important;padding-right:8px!important;margin-bottom:0!important}.action-area{flex-shrink:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important;min-width:0!important;padding:12px 0 32px!important}.action-add-songs,.action-search{margin-bottom:0!important}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInFromLeft{0%{transform:translateX(-100%)}to{transform:translateX(0)}}@media (min-width:769px){.mobile-current-song{display:none!important}}