:root{--bg-color:#0d1117;--bg-panel:#161b22f2;--bg-card:#ffffff08;--text-main:#f0f6fc;--text-dim:#8b949e;--text-inverse:#0d1117;--glass-border:#ffffff1a;--glass-bg:#ffffff08;--shadow:0 8px 32px 0 #0000005e;--panel-bg:var(--bg-panel);--glass:var(--glass-bg);--primary-color:#38bdf8;--secondary-color:#238636;--accent-gold:#e3b341;--transition:all .3s cubic-bezier(.4, 0, .2, 1);--color-intro:#a855f7;--color-verse:#38bdf8;--color-prechorus:#fbbf24;--color-chorus:#f87171;--color-bridge:#4ade80;--color-instrumental:#f472b6;--color-ending:#94a3b8;--color-other:#64748b;--sidebar-width:280px;--content-padding:2rem 3rem;--main-margin:var(--sidebar-width)}.light-mode{--bg-color:#f8f9fa;--bg-panel:#fff;--bg-card:#fff;--text-main:#1f2328;--text-dim:#656d76;--text-inverse:#fff;--glass-border:#1f23281a;--glass-bg:#1f232805;--shadow:0 4px 20px #00000014}*{box-sizing:border-box;margin:0;padding:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}body{background-color:var(--bg-color);color:var(--text-main);background-image:radial-gradient(circle at 20% 20%,#58a6ff0d 0%,#0000 40%),radial-gradient(circle at 80% 80%,#e3b3410d 0%,#0000 40%);min-height:100vh;overflow-x:hidden}.app-container{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);background:var(--bg-panel);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-right:1px solid var(--glass-border);z-index:1000;flex-direction:column;height:100vh;padding:2rem 1rem;transition:transform .3s cubic-bezier(.4,0,.2,1);display:flex;position:fixed}.mobile-header{background:var(--bg-panel);border-bottom:1px solid var(--glass-border);z-index:900;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);justify-content:space-between;align-items:center;height:60px;padding:0 1.5rem;display:none;position:sticky;top:0}.logo{color:var(--accent-gold);text-transform:uppercase;letter-spacing:2px;align-items:center;gap:.5rem;margin-bottom:3rem;font-size:1.5rem;font-weight:800;display:flex}.nav-links{flex-direction:column;gap:.5rem;margin-top:1rem;list-style:none;display:flex}.nav-item{color:var(--text-dim);transition:var(--transition);cursor:pointer;border:1px solid #0000;border-radius:12px;align-items:center;gap:1rem;padding:.75rem 1rem;text-decoration:none;display:flex}.nav-item:hover{background:var(--glass);color:var(--text-main)}.nav-item.active{color:var(--primary-color);background:#38bdf81a;border:1px solid #38bdf833}.nav-item svg{transition:var(--transition)}.nav-item.active svg{color:var(--primary-color);filter:drop-shadow(0 0 5px #38bdf880)}.main-content{margin-left:var(--main-margin);padding:var(--content-padding);flex:1;min-width:0}.page-header{margin-bottom:3rem}.page-title{background:linear-gradient(to bottom right,#fff,#8b949e);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:2.5rem;font-weight:700}.card{background:var(--glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--glass-border);box-shadow:var(--shadow);transition:var(--transition);border-radius:20px;padding:1.5rem}.section-bubbles{gap:.75rem;padding:.5rem 0;display:flex;overflow-x:auto}.bubble{cursor:pointer;border:2px solid #fff3;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:.75rem;font-weight:800;transition:all .2s;display:flex}.bubble.active{border-color:var(--primary-color);box-shadow:0 0 15px var(--primary-color);transform:scale(1.1)}.bubble-now-playing{border:1px solid var(--primary-color);border-radius:50%;width:100%;height:100%;animation:2s infinite pulse-ring;position:absolute}@keyframes pulse-ring{0%{opacity:.8;transform:scale(.8)}to{opacity:0;transform:scale(1.5)}}.waveform-container{flex:1;align-items:center;gap:2px;height:40px;padding:0 1rem;display:flex}.waveform-bar{background:#fff3;border-radius:1px;width:3px}.waveform-bar.active{background:var(--primary-color)}.mixer-tab{text-transform:uppercase;letter-spacing:1px;cursor:pointer;background:#ffffff0d;border:1px solid #0000;border-radius:8px;padding:.5rem 1rem;font-size:.65rem}.mixer-tab.active{border-color:var(--primary-color);color:var(--primary-color)}.cue-text{color:var(--text-dim);font-size:.75rem;font-style:italic}.chart-section{border-left:2px solid #ffffff1a;margin-bottom:2rem;padding-left:1.5rem}.chart-section.active{border-left-color:var(--primary-color)}.card:hover{border-color:#58a6ff4d;transform:translateY(-5px)}.btn{cursor:pointer;transition:var(--transition);border:none;border-radius:12px;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:600;display:inline-flex}.btn-primary{background:var(--primary-color);color:#000}.btn-primary:hover{filter:brightness(1.1);box-shadow:0 0 20px #58a6ff66}.grid{gap:1.5rem;display:grid}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}@media (width<=1024px){:root{--sidebar-width:80px;--content-padding:2rem}.nav-text,.logo span{display:none}.grid-3{grid-template-columns:repeat(2,1fr)}}@media (width<=768px){:root{--sidebar-width:0px;--content-padding:1.25rem;--main-margin:0px}.app-container{flex-direction:column;width:100%;overflow-x:hidden}.mobile-header{z-index:1100;width:100%;display:flex;position:sticky;top:0;box-shadow:0 4px 12px #0003}.sidebar{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);width:280px;box-shadow:none;z-index:1200;transform:translate(-100%);background:var(--bg-panel)!important;opacity:1!important}.sidebar.open{transform:translate(0);box-shadow:15px 0 30px #00000080}.sidebar-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1150;background:#0009;animation:.3s fadeIn;display:block;position:fixed;inset:0}.main-content{flex:none;width:100%!important;margin-left:0!important;padding:1.5rem 1.25rem 1.25rem!important}.page-title{font-size:1.8rem}.grid-2,.grid-3,.grid-main-layout{grid-template-columns:1fr!important}.responsive-table{display:block;background:0 0!important;border:none!important}.responsive-table thead{display:none}.responsive-table tbody{flex-direction:column;gap:1.25rem;padding:.5rem;display:flex}.responsive-table tr{box-shadow:var(--shadow);display:block;position:relative;background:var(--bg-card)!important;border:1px solid var(--glass-border)!important;border-radius:20px!important;padding:1.5rem!important}.responsive-table td{text-align:right;justify-content:space-between;align-items:center;min-height:40px;display:flex;border:none!important;padding:.75rem 0!important}.responsive-table td:before{content:attr(data-label);text-transform:uppercase;color:var(--text-dim);text-align:left;letter-spacing:1px;font-size:.65rem;font-weight:800}.responsive-table td:first-child{text-align:left;flex-direction:column;align-items:flex-start}.responsive-table td:first-child:before{margin-bottom:.5rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.hide-mobile{display:none!important}}