:root{--font-sans: "Inter", system-ui, -apple-system, sans-serif;--font-title: "Outfit", "Space Grotesk", sans-serif;--transition-speed: .35s;--transition-bounce: cubic-bezier(.34, 1.56, .64, 1)}[data-theme=slate-cyber]{--bg-primary: #070a13;--bg-secondary: #0c1122;--bg-card: rgba(13, 20, 38, .7);--border-color: rgba(59, 130, 246, .15);--border-hover: rgba(59, 130, 246, .35);--text-primary: #f8fafc;--text-secondary: #94a3b8;--accent-primary: #3b82f6;--accent-secondary: #6366f1;--accent-gradient: linear-gradient(135deg, #3b82f6 0%, #6366f1 100%);--glow-color: rgba(59, 130, 246, .25);--shadow-color: rgba(0, 0, 0, .6);--scroll-thumb: #1e293b}[data-theme=cyberpunk]{--bg-primary: #0a0118;--bg-secondary: #14032d;--bg-card: rgba(26, 4, 58, .65);--border-color: rgba(255, 0, 127, .22);--border-hover: rgba(0, 240, 255, .5);--text-primary: #ffffff;--text-secondary: #bba2e0;--accent-primary: #ff007f;--accent-secondary: #00f0ff;--accent-gradient: linear-gradient(135deg, #ff007f 0%, #00f0ff 100%);--glow-color: rgba(255, 0, 127, .35);--shadow-color: rgba(0, 0, 0, .8);--scroll-thumb: #2d0b64}[data-theme=emerald]{--bg-primary: #060b08;--bg-secondary: #0c1611;--bg-card: rgba(14, 26, 20, .7);--border-color: rgba(16, 185, 129, .18);--border-hover: rgba(52, 211, 153, .4);--text-primary: #f0fdf4;--text-secondary: #a7f3d0;--accent-primary: #10b981;--accent-secondary: #34d399;--accent-gradient: linear-gradient(135deg, #10b981 0%, #34d399 100%);--glow-color: rgba(16, 185, 129, .22);--shadow-color: rgba(0, 0, 0, .7);--scroll-thumb: #142e20}[data-theme=light-minimalist]{--bg-primary: #f6f8fa;--bg-secondary: #ffffff;--bg-card: rgba(255, 255, 255, .85);--border-color: rgba(0, 0, 0, .08);--border-hover: rgba(79, 70, 229, .3);--text-primary: #0f172a;--text-secondary: #475569;--accent-primary: #4f46e5;--accent-secondary: #06b6d4;--accent-gradient: linear-gradient(135deg, #4f46e5 0%, #06b6d4 100%);--glow-color: rgba(79, 70, 229, .08);--shadow-color: rgba(0, 0, 0, .05);--scroll-thumb: #e2e8f0}*{box-sizing:border-box}button,input,select,textarea{font-family:inherit}html,body{margin:0;padding:0;width:100%;min-height:100vh;background-color:var(--bg-primary);color:var(--text-primary);font-family:var(--font-sans);overflow-x:hidden;transition:background-color var(--transition-speed) ease,color var(--transition-speed) ease}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--accent-primary)}#root{min-height:100vh;width:100%;display:flex;justify-content:center;align-items:center;padding:3rem 1.5rem;box-sizing:border-box}.portfolio-wrapper{max-width:1200px;width:100%;margin:0 auto;opacity:0;animation:fadeIn .8s cubic-bezier(.16,1,.3,1) forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.bento-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(180px,auto);gap:1.5rem;margin-top:1.5rem}.bento-card{background:var(--bg-card);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid var(--border-color);border-radius:20px;padding:1.75rem;box-shadow:0 10px 30px 0 var(--shadow-color);transition:transform .4s var(--transition-bounce),border-color .35s ease,box-shadow .35s ease;overflow:hidden;position:relative;display:flex;flex-direction:column;justify-content:space-between}.bento-card:hover{transform:translateY(-5px);border-color:var(--border-hover);box-shadow:0 15px 35px 0 var(--shadow-color),0 0 20px var(--glow-color)}.col-span-2{grid-column:span 2}.col-span-3{grid-column:span 3}.row-span-2{grid-row:span 2}.hero-card{background:radial-gradient(circle at top right,var(--bg-secondary) 0%,var(--bg-card) 100%);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:1rem}.hero-status{display:inline-flex;align-items:center;gap:.5rem;background:#ffffff0d;border:1px solid var(--border-color);padding:.4rem .8rem;border-radius:99px;font-size:.8rem;font-weight:500}.status-dot{width:8px;height:8px;background-color:var(--accent-primary);border-radius:50%;box-shadow:0 0 8px var(--accent-primary);animation:pulse 1.8s infinite}@keyframes pulse{0%{transform:scale(.9);opacity:.6}50%{transform:scale(1.2);opacity:1;box-shadow:0 0 12px var(--accent-primary)}to{transform:scale(.9);opacity:.6}}.hero-title{font-family:var(--font-title);font-size:3.5rem;font-weight:800;line-height:1.1;margin:0;letter-spacing:-.03em;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font-family:var(--font-title);font-size:1.5rem;font-weight:500;margin:.25rem 0 0;color:var(--text-primary)}.hero-desc{font-size:1.05rem;line-height:1.6;color:var(--text-secondary);margin:.5rem 0 0;max-width:600px}.theme-card{justify-content:flex-start;gap:1.25rem}.card-title{font-family:var(--font-title);font-size:1.25rem;font-weight:700;margin:0;display:flex;align-items:center;gap:.5rem;color:var(--text-primary)}.theme-options{display:flex;flex-direction:column;gap:.6rem;width:100%;margin-top:.5rem}.theme-btn{display:flex;align-items:center;justify-content:space-between;background:#ffffff08;border:1px solid var(--border-color);padding:.65rem .85rem;border-radius:12px;color:var(--text-secondary);font-size:.85rem;font-weight:500;transition:all .25s ease;cursor:pointer;width:100%;text-align:left}.theme-btn:hover,.theme-btn.active{background:var(--bg-secondary);color:var(--text-primary);border-color:var(--accent-primary)}.theme-btn.active{box-shadow:0 0 10px #3b82f61a}.theme-color-preview{width:12px;height:12px;border-radius:50%;border:1px solid rgba(255,255,255,.2)}.time-card{align-items:center;justify-content:center;gap:.5rem;text-align:center}.time-clock{font-family:var(--font-title);font-size:2.25rem;font-weight:700;letter-spacing:.05em;margin:.5rem 0;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.time-timezone{font-size:.85rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.time-status{font-size:.85rem;color:var(--accent-primary);font-weight:500}.spotify-card{--spotify-gap: 1.1rem;--spotify-padding: 1.5rem;--spotify-body-gap: 1.25rem;--spotify-vinyl-size: 106px;display:flex;flex-direction:column;gap:var(--spotify-gap);background:linear-gradient(135deg,var(--bg-card) 0%,rgba(13,20,38,.4) 100%);border:1px solid var(--border-color);border-radius:24px;padding:var(--spotify-padding);justify-content:space-between;position:relative;overflow:hidden;transition:all .3s ease}[data-theme=light-minimalist] .spotify-card{background:linear-gradient(135deg,var(--bg-card) 0%,rgba(255,255,255,.4) 100%)}.spotify-header{display:flex;justify-content:space-between;align-items:center;width:100%}.live-badge-wrapper{display:flex;align-items:center;gap:.45rem;font-size:.7rem;font-weight:800;letter-spacing:.12em;color:var(--text-secondary)}.live-dot{width:6px;height:6px;background-color:#ef4444;border-radius:50%;box-shadow:0 0 8px #ef4444;animation:pulse-red 1.8s infinite}@keyframes pulse-red{0%{transform:scale(.95);box-shadow:0 0 #ef4444b3}70%{transform:scale(1.15);box-shadow:0 0 0 5px #ef444400}to{transform:scale(.95);box-shadow:0 0 #ef444400}}.station-frequency{font-size:.7rem;font-weight:700;color:var(--accent-primary);background:var(--glow-color);padding:.2rem .6rem;border-radius:8px;letter-spacing:.08em;border:1px solid var(--border-color)}.player-body{display:flex;align-items:center;gap:var(--spotify-body-gap);width:100%}.vinyl-container{position:relative;width:var(--spotify-vinyl-size);height:var(--spotify-vinyl-size);cursor:pointer;flex-shrink:0}.vinyl-disc{width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,transparent 18%,#161616 18%,#161616 23%,#222222 23%,#222222 28%,#161616 28%,#161616 33%,#222222 33%,#222222 38%,#161616 38%,#161616 43%,#222222 43%,#222222 48%,#161616 48%,#161616 53%,#333333 53%,#333333 56%,#161616 56%,#161616 100%),radial-gradient(circle,var(--accent-primary) 18%,transparent 18%);position:relative;box-shadow:0 4px 15px #0006,inset 0 0 8px #000000e6;transition:transform .3s ease,border-color var(--transition-speed) ease;border:1px solid rgba(255,255,255,.05)}.vinyl-disc:before{content:"";position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,#ffffff1f,#fff0 45%,#00000059,#fff0 55%,#ffffff1f);z-index:2;pointer-events:none}.vinyl-disc:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px;background:var(--bg-card);border-radius:50%;z-index:3;border:1px solid rgba(0,0,0,.6);transition:background-color var(--transition-speed) ease}.vinyl-container.playing .vinyl-disc{animation:spin-slow 8s linear infinite}@keyframes spin-slow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.vinyl-overlay{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;background:#00000080;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .25s ease,background-color .25s ease;z-index:5;color:#fff}.vinyl-container:hover .vinyl-overlay{opacity:1}.vinyl-overlay svg{width:22px;height:22px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.4))}.player-details{display:flex;flex-direction:column;flex-grow:1;overflow:hidden;justify-content:center}.player-track-name{font-family:var(--font-title);font-size:1.15rem;font-weight:700;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:.15rem;letter-spacing:-.01em}.player-artist{font-size:.8rem;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:.4rem}.spotify-visualizer{display:flex;align-items:flex-end;gap:3px;height:16px}.visualizer-bar{width:3px;background-color:var(--accent-primary);border-radius:3px 3px 0 0;animation:equalize 1.2s ease-in-out infinite alternate;animation-play-state:paused}.spotify-visualizer.playing .visualizer-bar{animation-play-state:running}.visualizer-bar:nth-child(2){height:10px;animation-delay:.15s}.visualizer-bar:nth-child(3){height:16px;animation-delay:.3s}.visualizer-bar:nth-child(4){height:7px;animation-delay:.45s}.visualizer-bar:nth-child(5){height:12px;animation-delay:.05s}@keyframes equalize{0%{transform:scaleY(.3)}to{transform:scaleY(1)}}.skills-card{justify-content:flex-start;gap:1.25rem}.skills-filter{display:flex;gap:.5rem;flex-wrap:wrap;width:100%}.filter-btn{background:#ffffff08;border:1px solid var(--border-color);color:var(--text-secondary);padding:.4rem .8rem;border-radius:99px;font-size:.8rem;font-weight:500;transition:all .25s ease;cursor:pointer}.filter-btn:hover,.filter-btn.active{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary)}.skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:.75rem;width:100%;margin-top:.5rem}.skill-tag{background:#ffffff05;border:1px solid var(--border-color);padding:.6rem;border-radius:12px;display:flex;align-items:center;gap:.5rem;font-size:.85rem;font-weight:500;transition:all .3s ease;-webkit-user-select:none;user-select:none}.skill-tag:hover{background:var(--bg-secondary);border-color:var(--accent-primary);color:var(--text-primary);box-shadow:0 0 10px var(--glow-color)}.skill-icon{display:flex;align-items:center;justify-content:center;color:var(--accent-primary)}.projects-card{justify-content:flex-start;gap:1.5rem}.projects-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem;width:100%;margin-top:.5rem}.project-item{background:#ffffff05;border:1px solid var(--border-color);border-radius:16px;padding:1.25rem;display:flex;flex-direction:column;justify-content:space-between;gap:.75rem;transition:all .3s ease}.project-item:hover{background:#ffffff0a;border-color:var(--accent-primary);transform:translateY(-2px)}.project-header{display:flex;justify-content:space-between;align-items:flex-start}.project-name{font-family:var(--font-title);font-size:1.15rem;font-weight:700;margin:0;color:var(--text-primary)}.project-internal-link{color:inherit;text-decoration:none;transition:color .2s}.project-internal-link:hover{color:var(--accent-primary)}.project-links{display:flex;gap:.5rem}.project-link{color:var(--text-secondary);transition:color .2s;display:flex;align-items:center}.project-link:hover{color:var(--accent-primary)}.project-desc{font-size:.85rem;line-height:1.5;color:var(--text-secondary);margin:0}.project-tags{display:flex;gap:.35rem;flex-wrap:wrap}.project-tag{font-size:.7rem;font-weight:600;color:var(--accent-primary);background:var(--glow-color);padding:.15rem .5rem;border-radius:6px;text-transform:uppercase;letter-spacing:.02em}.timeline-card{justify-content:flex-start;gap:1.25rem}.timeline-nav{display:flex;border-bottom:1px solid var(--border-color);width:100%}.timeline-tab{background:none;border:none;color:var(--text-secondary);padding:.75rem 1.25rem;font-family:var(--font-title);font-size:1rem;font-weight:600;cursor:pointer;position:relative;transition:color .25s ease}.timeline-tab:hover{color:var(--text-primary)}.timeline-tab.active{color:var(--accent-primary)}.timeline-tab.active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--accent-gradient)}.timeline-items{display:flex;flex-direction:column;gap:1rem;width:100%;margin-top:.5rem}.timeline-block{border-left:2px solid var(--border-color);padding-left:1.25rem;position:relative;padding-bottom:.5rem;transition:border-color .3s}.timeline-block:hover{border-color:var(--accent-primary)}.timeline-marker{width:10px;height:10px;border-radius:50%;background:var(--bg-primary);border:2px solid var(--border-color);position:absolute;left:-6px;top:6px;transition:all .3s}.timeline-block:hover .timeline-marker{border-color:var(--accent-primary);background:var(--accent-primary);box-shadow:0 0 8px var(--accent-primary)}.timeline-block-header{display:flex;justify-content:space-between;align-items:flex-start;cursor:pointer}.timeline-role{font-family:var(--font-title);font-size:1.1rem;font-weight:700;margin:0;color:var(--text-primary)}.timeline-comp{font-size:.9rem;color:var(--accent-primary);margin:.15rem 0 .4rem;font-weight:500}.timeline-time{font-size:.8rem;color:var(--text-secondary);font-weight:500}.timeline-details{margin-top:.5rem;font-size:.85rem;line-height:1.5;color:var(--text-secondary);overflow:hidden;max-height:0;opacity:0;transition:max-height .4s ease,opacity .3s ease}.timeline-details.expanded{max-height:250px;opacity:1}.timeline-points{margin:.25rem 0 0;padding-left:1.1rem}.timeline-points li{margin-bottom:.35rem}.timeline-toggle-icon{color:var(--text-secondary);transition:transform .3s;display:flex;align-items:center}.timeline-toggle-icon.expanded{transform:rotate(180deg)}.timeline-block:hover .timeline-toggle-icon{color:var(--accent-primary)}.contact-card{justify-content:flex-start;gap:1.25rem}.contact-options{display:flex;flex-direction:column;gap:.75rem;width:100%}.contact-link-block{display:flex;align-items:center;gap:1rem;background:#ffffff05;border:1px solid var(--border-color);padding:.85rem 1.25rem;border-radius:14px;color:var(--text-primary);text-decoration:none;font-weight:500;transition:all .3s ease;position:relative;cursor:pointer}.contact-link-block:hover{background:var(--bg-secondary);border-color:var(--accent-primary);transform:translate(3px);box-shadow:0 0 10px var(--glow-color)}.contact-icon{color:var(--accent-primary);display:flex;align-items:center}.contact-info{display:flex;flex-direction:column}.contact-type{font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.02em}.contact-val{font-size:.95rem}.copy-badge{margin-left:auto;font-size:.7rem;background:var(--glow-color);color:var(--accent-primary);padding:.15rem .5rem;border-radius:6px;font-weight:600;text-transform:uppercase;transition:all .2s ease}.bento-navbar{position:fixed;top:1.5rem;left:50%;transform:translate(-50%);z-index:1000;display:flex;align-items:center;justify-content:space-between;gap:.5rem;background:var(--bg-card);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--border-color);border-radius:99px;padding:.5rem 1.25rem;box-shadow:0 10px 30px var(--shadow-color);width:90%;max-width:600px;transition:border-color .3s ease,box-shadow .3s ease}.bento-navbar:hover{border-color:var(--border-hover);box-shadow:0 10px 30px var(--shadow-color),0 0 15px var(--glow-color)}.nav-logo{font-family:var(--font-title);font-weight:800;font-size:1.25rem;color:var(--text-primary);cursor:pointer;letter-spacing:.05em;display:flex;align-items:center}.logo-accent{background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav-links{display:flex;gap:.25rem;align-items:center}.nav-item{background:none;border:none;padding:.5rem .85rem;border-radius:99px;display:flex;align-items:center;gap:.4rem;color:var(--text-secondary);font-size:.85rem;font-weight:500;cursor:pointer;transition:all .25s ease}.nav-item:hover{color:var(--text-primary);background:#ffffff0a}.nav-item.active{color:#fff;background:var(--accent-primary);box-shadow:0 0 10px var(--glow-color)}.nav-icon-wrapper{display:flex;align-items:center}.portfolio-wrapper{max-width:1200px;width:100%;margin:4.5rem auto 0;opacity:0;animation:fadeIn .8s cubic-bezier(.16,1,.3,1) forwards}.bento-footer{text-align:center;margin-top:3rem;font-size:.85rem;color:var(--text-secondary);letter-spacing:.02em;display:flex;flex-direction:column;gap:.4rem}.bento-footer a{color:var(--accent-primary);text-decoration:none}.bento-footer a:hover{text-decoration:underline}.contact-grid-layout{display:grid;grid-template-columns:1fr 1.5fr;gap:2.5rem;width:100%}.contact-channels{display:flex;flex-direction:column;justify-content:flex-start}.guestbook-section{display:flex;flex-direction:column}.guestbook-form{display:flex;flex-direction:column;gap:.85rem;background:#ffffff03;border:1px solid var(--border-color);padding:1.25rem;border-radius:16px;width:100%}.form-group-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.form-group{display:flex;flex-direction:column;gap:.4rem}.form-group label{font-size:.75rem;font-weight:600;text-transform:uppercase;color:var(--text-secondary);letter-spacing:.05em}.form-group input,.form-group textarea{background:#0003;border:1px solid var(--border-color);border-radius:8px;padding:.6rem .85rem;color:var(--text-primary);font-family:var(--font-sans);font-size:.85rem;outline:none;transition:border-color .25s,box-shadow .25s}[data-theme=light-minimalist] .form-group input,[data-theme=light-minimalist] .form-group textarea{background:#fffc}.form-group input:focus,.form-group textarea:focus{border-color:var(--accent-primary);box-shadow:0 0 8px var(--glow-color)}.guestbook-submit-btn{background:var(--accent-gradient);border:none;color:#fff;padding:.75rem;border-radius:10px;font-family:var(--font-title);font-weight:700;font-size:.9rem;cursor:pointer;transition:all .35s ease;display:flex;align-items:center;justify-content:center;gap:.5rem}.guestbook-submit-btn:hover{transform:translateY(-1px);box-shadow:0 5px 15px var(--glow-color)}.guestbook-submit-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.guestbook-submit-btn.success{background:#10b981;box-shadow:0 0 15px #10b9814d}.guestbook-submit-btn.error{background:#ef4444;box-shadow:0 0 15px #ef444459}.btn-spinner-wrapper{display:flex;align-items:center;gap:.5rem}.btn-spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.guestbook-logs{margin-top:1.25rem;border-top:1px solid var(--border-color);padding-top:1rem}.logs-header{font-size:.8rem;font-weight:700;text-transform:uppercase;color:var(--text-secondary);letter-spacing:.05em;margin-bottom:.75rem}.logs-list{display:flex;flex-direction:column;gap:.75rem;max-height:200px;overflow-y:auto;padding-right:.5rem}.log-item{background:#ffffff05;border:1px solid var(--border-color);padding:.75rem 1rem;border-radius:10px;animation:slideInUp .4s var(--transition-bounce) forwards}@keyframes slideInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.log-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:.25rem}.log-name{font-weight:600;font-size:.85rem;color:var(--text-primary)}.log-date{font-size:.75rem;color:var(--text-secondary)}.log-text{font-size:.85rem;line-height:1.4;margin:0;color:var(--text-secondary)}@media(max-width:1024px){.bento-grid{grid-template-columns:repeat(2,1fr)}.col-span-3{grid-column:span 2}.spotify-card{--spotify-gap: .95rem;--spotify-padding: 1.35rem;--spotify-body-gap: 1.1rem}}@media(max-width:768px){#root{padding:1.5rem 1rem}.bento-navbar{max-width:440px;padding:.4rem .75rem}.nav-text{display:none}.nav-item{padding:.5rem}.bento-grid{grid-template-columns:1fr;grid-auto-rows:auto;gap:1rem}.col-span-2,.col-span-3{grid-column:span 1}.hero-title{font-size:2.5rem}.projects-grid{grid-template-columns:1fr}.spotify-card{--spotify-gap: .8rem;--spotify-padding: 1.2rem;--spotify-body-gap: .9rem;--spotify-vinyl-size: 90px}}.projects-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;width:100%;margin-top:.5rem}.hero-links-row{display:flex;margin-top:2rem;flex-direction:row;flex-wrap:wrap;gap:1rem}.hero-links-row .contact-link-block{flex:1 1 200px}@media(max-width:1024px){.projects-grid-3{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.projects-grid-3{grid-template-columns:1fr}.hero-links-row{flex-direction:column}.hero-links-row .contact-link-block{flex:1 1 auto}}@media(max-width:480px){.spotify-card{--spotify-gap: .7rem;--spotify-padding: 1rem;--spotify-body-gap: .75rem;--spotify-vinyl-size: 80px}.player-track-name{font-size:1.05rem}.player-artist{font-size:.75rem}}.player-progress-container{display:flex;align-items:center;gap:.5rem;width:100%;margin-top:.25rem}.time-display{font-size:.75rem;color:var(--text-secondary);font-variant-numeric:tabular-nums;min-width:28px}.progress-bar-wrapper{position:relative;flex-grow:1;display:flex;align-items:center}.player-progress-bar{width:100%;height:4px;border-radius:2px;background:#ffffff14;outline:none;cursor:pointer;-webkit-appearance:none;margin:0;transition:background .25s ease}[data-theme=light-minimalist] .player-progress-bar{background:#0000000f}.player-progress-bar::-webkit-slider-runnable-track{height:4px}.player-progress-bar::-webkit-slider-thumb{-webkit-appearance:none;width:8px;height:8px;border-radius:50%;background:var(--accent-primary);margin-top:-2px;transition:transform .15s ease,background-color .15s ease;box-shadow:0 0 6px var(--glow-color)}.player-progress-bar:hover::-webkit-slider-thumb{transform:scale(1.4);background:var(--text-primary)}.player-controls{display:flex;align-items:center;justify-content:center;width:100%;margin-top:.25rem;gap:1.5rem}.control-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:.45rem;border-radius:50%;transition:all .25s ease}.control-btn:hover{color:var(--text-primary);background:#ffffff0d}[data-theme=light-minimalist] .control-btn:hover{background:#0000000a}.player-actions-row{display:flex;align-items:center;width:100%;gap:.75rem;margin-top:.25rem}.playlist-toggle-btn-pill{display:flex;align-items:center;gap:.35rem;background:#ffffff08;border:1px solid var(--border-color);padding:.35rem .8rem;border-radius:99px;color:var(--text-secondary);font-size:.75rem;font-weight:600;cursor:pointer;margin-left:auto;transition:all .25s ease}.playlist-toggle-btn-pill:hover{background:var(--glow-color);color:var(--accent-primary);border-color:var(--accent-primary)}[data-theme=light-minimalist] .playlist-toggle-btn-pill{background:#00000005}.playlist-toggle-btn-pill svg{stroke-width:2.5}.player-footer{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:.85rem;font-size:.75rem;color:var(--text-secondary);border-top:1px solid var(--border-color);padding-top:.6rem}.player-playlist{display:flex;flex-direction:column;gap:.25rem;width:100%;margin-top:.75rem;max-height:120px;overflow-y:auto;padding-right:.25rem;border-top:1px dashed var(--border-color);padding-top:.5rem}.playlist-item{display:grid;grid-template-columns:20px 1fr 1.2fr;align-items:center;font-size:.75rem;padding:.35rem .5rem;border-radius:8px;cursor:pointer;transition:all .2s ease;color:var(--text-secondary)}.playlist-item:hover{background:#ffffff08;color:var(--text-primary)}[data-theme=light-minimalist] .playlist-item:hover{background:#00000005}.playlist-item.active{background:var(--glow-color);color:var(--accent-primary);font-weight:600}.playlist-item-num{font-size:.7rem}.playlist-item-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:.5rem}.playlist-item-artist{font-size:.7rem;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
