:root{--color-primary: #2185d0;--color-primary-light: #21b8d0;--color-background: #f6f8fa;--color-background-light: #f1f4f8;--color-text: #1a1a1a;--color-text-secondary: #666;--color-border: rgba(0, 0, 0, .05);--color-card-background: #ffffff;--color-progress-background: #edf2f7;--shadow-card: 0 8px 24px rgba(0, 0, 0, .12);--shadow-bottom: 0 -4px 20px rgba(0, 0, 0, .08);--transition-fast: .2s ease;--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--spacing-normal: 1rem;--spacing-large: 2rem;--spacing-xlarge: 3rem}body{margin:0;padding:0;background:linear-gradient(135deg,var(--color-background) 0%,var(--color-background-light) 100%);min-height:100vh}.ui.container{padding:var(--spacing-large)}.ui.card{margin:var(--spacing-normal) 0!important}.ui.card .content .header{font-size:1.4em!important;margin-bottom:.8em;color:var(--color-text)}.ui.card .description{color:var(--color-text-secondary);line-height:1.6}.ui.card .extra.content{background:var(--color-background);border-top:1px solid var(--color-border)}.ui.circular.button{transition:transform var(--transition-fast)}.ui.circular.button:hover{transform:scale(1.1)}.now-playing{position:fixed;bottom:0;left:0;right:0;background:#fffffffa;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:1.2rem;box-shadow:var(--shadow-bottom);transform:translateY(100%);transition:transform var(--transition-normal);z-index:1000}.now-playing.active{transform:translateY(0)}.now-playing-info{margin:0 var(--spacing-normal)}.now-playing-title{font-size:1.2em!important;margin-bottom:.8em!important;color:var(--color-text)}.audio-progress{width:100%;height:6px;background-color:var(--color-progress-background);border-radius:3px;margin-top:.8rem;cursor:pointer;overflow:hidden}.progress-bar{height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-primary-light));border-radius:3px;width:0;transition:width .1s linear}.ui.center.aligned.header{margin:var(--spacing-xlarge) 0!important}.ui.center.aligned.header .icon{font-size:2.5em;margin-bottom:.5rem;background:linear-gradient(135deg,var(--color-primary),var(--color-primary-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.ui.center.aligned.header .sub.header{font-size:1.2em;margin-top:.5rem;color:var(--color-text-secondary)}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.play-button i.icon{margin:0!important}.now-playing.active .play-button{animation:pulse 2s infinite}