.account-nav { flex: 0 0 auto; margin-left: .35rem; }
.account-link { display: inline-flex; align-items: center; min-height: 42px; padding: .55rem .8rem; border: 1px solid rgba(255,255,255,.28); border-radius: .25rem; background: rgba(15,20,28,.72); text-decoration: none; font-size: .82rem; white-space: nowrap; }
.account-link:hover, .account-link.is-current { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.55); }
.account-main { background: radial-gradient(circle at top, #1a2432, #05070a 58%); }
.account-shell { max-width: 900px; margin: 0 auto; padding: clamp(3rem, 8vw, 7rem) clamp(1rem, 4vw, 3rem); }
.eyebrow { margin: 0 0 .45rem; text-transform: uppercase; letter-spacing: .14em; font-size: .72rem; opacity: .68; }
.account-shell h1, .player-panel h2, .podcast-panel h2 { margin-top: 0; }
.account-status-grid, .player-status-card, .podcast-status-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin: 1.2rem 0; }
.account-status-grid > div, .player-status-card > div, .podcast-status-grid > div { padding: .9rem; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.045); }
.account-status-grid span, .player-status-card span, .podcast-status-grid span { display: block; margin-bottom: .3rem; font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; opacity: .68; }
.account-alert { margin: 1rem 0; padding: 1rem; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.06); }
.account-alert--blocked { border-color: rgba(255,130,130,.5); background: rgba(90,15,15,.32); }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: .65rem .95rem; border: 1px solid rgba(255,255,255,.35); border-radius: .25rem; background: rgba(255,255,255,.12); color: inherit; text-decoration: none; cursor: pointer; }
.button:hover { background: rgba(255,255,255,.18); }
.button--secondary { margin-top: 1rem; background: transparent; }
.muted-copy { color: rgba(245,247,250,.65); font-size: .9rem; }
.login-callout { margin-top: 1.25rem; padding: 1rem; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.04); }
.player-controls { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1rem; }
.player-controls button { min-width: 95px; padding: .7rem .9rem; border: 1px solid rgba(255,255,255,.2); border-radius: .25rem; background: rgba(255,255,255,.08); color: inherit; }
.player-controls button:disabled { opacity: .45; cursor: not-allowed; }
.volume-control { display: flex; align-items: center; gap: .6rem; min-width: 230px; padding: .65rem .8rem; border: 1px solid rgba(255,255,255,.14); }
.volume-control input { width: 150px; }
.podcast-feature-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin: 1.25rem 0; }
.podcast-feature-grid article { padding: 1rem; border: 1px solid rgba(255,255,255,.14); background: rgba(2,7,12,.42); }
.podcast-feature-grid h3, .podcast-architecture h3 { margin: 0 0 .45rem; font-size: 1rem; }
.podcast-feature-grid p { margin: 0; color: rgba(245,247,250,.82); }
.podcast-architecture { margin-top: 1.25rem; padding-top: 1.1rem; border-top: 1px solid rgba(255,255,255,.14); }
.podcast-architecture p { max-width: 58rem; }
@media (max-width: 760px) { .account-nav { grid-column: 1 / -1; margin: .25rem 0 0; } .account-link { width: 100%; justify-content: center; } .account-status-grid, .player-status-card, .podcast-status-grid, .podcast-feature-grid { grid-template-columns: 1fr; } }