*{margin:0;padding:0;box-sizing:border-box}:root{--primary-color: #31c27c;--primary-hover: #28a366;--bg-primary: #1a1a1a;--bg-secondary: #242424;--bg-tertiary: #2a2a2a;--bg-hover: #333333;--text-primary: #ffffff;--text-secondary: #999999;--text-tertiary: #666666;--border-color: #333333;--shadow: 0 4px 20px rgba(0, 0, 0, .3);--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--transition: all .3s ease}html,body{height:100%;font-family:Noto Sans SC,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--bg-primary);color:var(--text-primary);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{height:100%;display:flex;flex-direction:column}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;transition:var(--transition)}button:disabled{cursor:not-allowed;opacity:.5}input,textarea{font-family:inherit;border:none;background:none;color:inherit;outline:none}a{color:inherit;text-decoration:none}ul,ol{list-style:none}img{display:block;max-width:100%}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary);border-radius:4px}::-webkit-scrollbar-thumb{background:var(--text-tertiary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.app-container{display:flex;flex-direction:column;height:100vh;overflow:hidden}.main-content{flex:1;display:flex;overflow:hidden}.sidebar{width:200px;background:var(--bg-secondary);border-right:1px solid var(--border-color);display:flex;flex-direction:column;overflow-y:auto}.content-area{flex:1;overflow-y:auto;padding:20px}.player-bar{height:72px;background:linear-gradient(to right,var(--bg-secondary),var(--bg-tertiary));border-top:1px solid var(--border-color);display:flex;align-items:center;padding:0 20px;position:relative;z-index:100}@media (max-width: 768px){.sidebar{display:none}.content-area{padding:15px}.player-bar{height:64px;padding:0 10px}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.loading-spinner{animation:spin 1s linear infinite}.fade-in{animation:slideUp .3s ease}