/* Portrait-first discovery. The announcement hero keeps its existing layout. */
.showcase .feed-entry{margin:24px 0 48px;padding:28px;gap:32px;background:var(--color-sheet) url('../assets/brand/pattern-muted.svg') right center/320px no-repeat}
.feed-entry-actions{display:flex;gap:12px;flex-shrink:0}
.feed-entry-actions .button{margin:0}
.feed-entry-random{border:1px solid var(--color-border);background:var(--color-sheet);color:var(--text)}
.feed-entry-random:hover{border-color:var(--lime);color:var(--lime)}
.showcase .shelf{margin-bottom:48px}
.showcase .section-head{margin-bottom:20px}
.showcase .section-heading{min-width:0}
.showcase .section-note{font-size:13px;line-height:1.5}
.showcase .card-caption h3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;line-height:1.3;min-height:2.6em}
.showcase .card-caption p{font-size:13px;line-height:1.5}
.showcase .mini-time{left:8px;right:8px;bottom:12px;width:fit-content;max-width:calc(100% - 16px);margin-left:auto;padding:4px 7px;border-radius:6px;background:rgb(0 0 0 / .8);font-size:11px;line-height:1.3}
.showcase .poster-tag{max-width:calc(100% - 42px);font-size:11px;line-height:1.3}
.showcase .shelf:has(.ranked-rail){padding-top:24px;border-top:1px solid var(--lime)}
.showcase .shelf:has(.ranked-rail) .section-head h2{font-size:40px;line-height:1.1;color:var(--lime);letter-spacing:-.03em}
.ranked-rail{--showcase-poster:180px;--rank-lane:108px;grid-auto-columns:calc(var(--showcase-poster) + var(--rank-lane));gap:28px}
.ranked-card{padding-left:var(--rank-lane);isolation:isolate}
.poster-rank{position:absolute;left:0;top:calc(var(--showcase-poster)*1.5 - 96px);width:var(--rank-lane);padding-right:8px;font-size:96px;font-weight:700;line-height:1;letter-spacing:-.04em;font-variant-numeric:lining-nums;color:var(--lime);z-index:0}
.ranked-card .card-caption{margin-left:calc(-1 * var(--rank-lane));padding-top:14px;border-top:1px solid var(--edge)}
#search-genres{margin:20px 0 0;padding-block:3px 6px;scroll-padding-inline:3px}
#search-genres .chip{min-height:44px;flex-shrink:0}
.app-menu-tools small{display:block;font-size:11px;line-height:1.4;color:var(--muted)}
.app-menu-nav [data-menu-route=login]{min-height:58px}
.detail-content .feed-episode-strip{margin-top:20px}
.detail-content .feed-episode-choice[data-current=true]{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-text-on-accent)}
.detail-content .feed-episode-choice[data-current=true]:focus-visible{outline-color:var(--color-text-on-accent)}
.detail-content .feed-episode-choice[data-current=true]>.icon[data-icon-name=play]{fill:currentColor}
.detail-content .feed-episode-choice[data-current=true] .episode-cell-progress{background:#08080824}
.detail-content .feed-episode-choice[data-current=true] .episode-cell-progress>span{background:var(--color-text-on-accent)}
.detail-content .feed-episode-extra[data-current=true]{color:var(--color-accent);border-color:var(--color-accent)}
.account-page{max-width:720px;margin:0 auto;padding:calc(var(--header-height) + 32px) var(--gutter) 64px;min-height:100dvh}
.account-heading{display:flex;align-items:center;gap:16px;margin-bottom:48px}
.account-heading h1{font-size:32px;line-height:1.2;letter-spacing:-.03em}
.account-content{max-width:520px;margin:auto}
.guest-identity{display:flex;align-items:center;gap:20px;margin-bottom:40px}
.guest-avatar{width:76px;height:76px;padding:18px;border-radius:24px;background:var(--color-sheet);color:var(--lime);flex-shrink:0}
.guest-identity h2,.account-content>h2{font-size:28px;line-height:1.25;letter-spacing:-.03em}
.guest-identity p{color:var(--muted);font-size:14px;margin-top:8px}
.account-rows{border-block:1px solid var(--edge);margin-bottom:24px}
.account-rows a{display:flex;align-items:center;gap:16px;min-height:84px;padding:16px 0;border-bottom:1px solid var(--edge)}
.account-rows a:last-child{border:0}
.account-rows .icon{width:24px;height:24px;flex-shrink:0}
.account-rows a>.icon:last-child{margin-left:auto;width:20px;height:20px;color:var(--muted)}
.account-rows strong{font-size:16px;font-weight:500}
.account-rows small{display:block;color:var(--muted);font-size:13px;line-height:1.5;margin-top:6px}
.account-rows a:hover strong{color:var(--lime)}
.account-note,.account-description{font-size:15px;line-height:1.65;color:var(--muted);margin:20px 0 28px}
.account-description{font-size:17px;color:var(--text)}
.account-content>.button{min-height:48px}
.account-symbol{margin:0 0 32px;color:var(--lime)}
.account-symbol .icon{width:56px;height:56px}
.account-secondary{display:block;width:fit-content;min-height:44px;padding-block:16px;font-size:14px;color:var(--muted);margin-top:8px}
.account-secondary:hover{color:var(--lime)}
@media(min-width:1200px){.ranked-rail{--showcase-poster:200px}}
@media(max-width:1100px){.showcase .feed-entry{align-items:flex-start;flex-direction:column}.feed-entry-actions{flex-wrap:wrap}}
@media(max-width:640px),(min-width:641px) and (max-width:1024px) and (orientation:portrait){
  .showcase .feed-entry{display:flex;padding:24px 20px;margin:16px 0 36px;gap:24px}
  .feed-entry-title{gap:12px;align-items:flex-start}
  .feed-entry-title>.icon{width:28px;height:28px;flex-shrink:0;margin-top:2px}
  .showcase .feed-entry h2{font-size:24px;line-height:1.2;letter-spacing:-.03em}
  .showcase .feed-entry p{font-size:13px;line-height:1.6;margin-top:8px}
  .feed-entry-actions{display:grid;grid-template-columns:1fr;width:100%;gap:10px}
  .feed-entry-actions .button{width:100%;margin:0;min-height:48px}
  .showcase .shelf{margin-bottom:36px}
  .showcase .section-head{align-items:center;gap:12px;margin-bottom:16px}
  .showcase .section-head h2{font-size:24px;line-height:1.2;letter-spacing:-.03em}
  .showcase .section-note{display:block;margin-top:6px;font-size:12px}
  .showcase .section-head .text-link{font-size:12px;flex-shrink:0}
  .showcase .section-head .text-link .icon{width:16px;height:16px}
  .showcase .card-caption{margin-top:12px;gap:4px}
  .showcase .card-caption h3{font-size:17px}
  .showcase .card-caption p{font-size:12px}
  .showcase .shelf:has(.ranked-rail){padding-top:20px}
  .showcase .shelf:has(.ranked-rail) .section-head h2{font-size:32px}
  .ranked-rail{--showcase-poster:clamp(132px,40vw,180px);--rank-lane:96px;grid-auto-columns:calc(var(--showcase-poster) + var(--rank-lane));gap:20px}
  .poster-rank{font-size:84px;top:calc(var(--showcase-poster)*1.5 - 84px)}
  .account-page{padding-top:calc(var(--header-height) + 24px)}
  .account-heading{margin-bottom:36px;justify-content:center}
  .account-heading .list-back{display:none}
  .account-heading h1{font-size:28px}
  .guest-identity{margin-bottom:32px}
}