*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#0f172a;color:#e2e8f0}button{cursor:pointer}.app-shell{max-width:1100px;margin:0 auto;padding:24px}header{margin-bottom:24px}h1{margin:0 0 8px;font-size:clamp(2.2rem,2.5vw,3rem)}p{margin:0;color:#cbd5e1}main{display:block}.menu-bar{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:24px}.menu-button{border:1px solid #334155;background:transparent;color:#cbd5e1;padding:.9rem 1.4rem;border-radius:999px;font-size:.95rem;transition:background .2s ease,color .2s ease,border-color .2s ease}.menu-button:hover{border-color:#94a3b8}.menu-button.active{background:#2563eb;color:#fff;border-color:#2563eb}.library-card,.player-card,.page-card{background:#111827;border:1px solid #334155;border-radius:18px;padding:20px}.music-section{display:grid;grid-template-columns:minmax(280px,380px) 1fr;gap:24px;align-items:start}.emails-section{display:grid;grid-template-columns:minmax(260px,320px) 1fr;gap:24px;align-items:start}.emails-list{background:#111827;border:1px solid #334155;border-radius:18px;padding:20px;max-height:calc(100vh - 240px);overflow-y:auto}.emails-list h2{margin:0}.emails-list ul{list-style:none;padding:0;margin:18px 0 0}.email-item{padding:.95rem 1rem;margin-bottom:10px;border-radius:12px;background:#1e293b;border:1px solid transparent;transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease;cursor:pointer}.email-item:hover{background:#334155}.email-item.active{background:linear-gradient(135deg,#0a1223,#111827);border-color:#38bdf8;box-shadow:0 0 24px #38bdf82e}.email-item span{display:block;color:#cbd5e1;font-size:.95rem}.email-details{background:#111827;border:1px solid #334155;border-radius:18px;padding:20px;max-height:calc(100vh - 240px);overflow-y:auto}.email-details h3{margin-top:0;color:#fff}.email-details p{margin-bottom:1rem;line-height:1.8;color:#cbd5e1;white-space:pre-wrap;word-break:break-word}.email-audio-player{margin-top:1.5rem}.email-audio-player h4{margin:0 0 .75rem;color:#fff;font-size:1rem}.email-no-audio{margin-top:1.5rem;color:#94a3b8}.music-section>.library-card{min-height:0;max-height:calc(100vh - 240px);overflow-y:auto}.music-section>.player-card{position:sticky;top:24px;align-self:start}@media (max-width: 880px){.music-section{grid-template-columns:1fr}.music-section>.player-card{position:static;top:auto}}.track-list{list-style:none;padding:0;margin:16px 0 0}.track-item{display:flex;justify-content:space-between;align-items:center;padding:.95rem 1rem;margin-bottom:10px;border-radius:12px;background:#1e293b;transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease}.track-item:hover{background:#334155}.track-item.selected{background:linear-gradient(135deg,#0a1223,#111827);border:1px solid #38bdf8;box-shadow:0 0 30px #38bdf838}.track-details{display:flex;align-items:center;gap:.75rem}.playing-badge{font-size:.8rem;color:#0f172a;background:#38bdf8;padding:.35rem .75rem;border-radius:999px;border:1px solid rgba(255,255,255,.14)}.track-item.selected .playing-badge{background:#22d3ee;color:#0f172a}.controls-row,.progress-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}.controls-row button{border:none;background:#2563eb;color:#fff;padding:.85rem 1.2rem;border-radius:999px;font-size:.95rem}.toggle-group{display:flex;align-items:center;gap:10px}.toggle-button{border:1px solid #334155;background:#0f172a;color:#cbd5e1;padding:.65rem 1rem;border-radius:999px;font-size:.9rem;transition:background .2s ease,border-color .2s ease,color .2s ease}.toggle-button.active{background:#2563eb;border-color:#2563eb;color:#fff}.controls-row span{color:#cbd5e1}.progress-row input[type=range]{width:100%}.time-labels{min-width:90px;text-align:right;color:#94a3b8}.track-title{margin:0;font-size:1.15rem;font-weight:600}.section-header{display:flex;justify-content:space-between;align-items:center;gap:12px}.refresh-button{border:1px solid #334155;background:#1e293b;color:#cbd5e1;padding:.55rem 1rem;border-radius:999px;transition:background .2s ease,border-color .2s ease}.refresh-button:hover{background:#334155;border-color:#94a3b8}.error-text{margin:0;color:#fca5a5}@media (max-width: 880px){main{grid-template-columns:1fr}.emails-section{grid-template-columns:1fr}.emails-list,.email-details{max-height:none}}
