/* Gems' existing paper, ink and artwork; a smaller listening footprint. */
body{--navigation-height:0px;}
body.has-player #listening{
 position:fixed;inset:auto 16px 12px;display:grid;grid-template-columns:minmax(0,1fr) 144px 76px;
 grid-template-rows:auto;gap:0 16px;width:calc(100% - 32px);max-width:1100px;margin:0 auto;
 padding:8px 14px;min-height:64px;background:#fffaf5fa;border:1px solid #cdb7b8;border-radius:10px;
 box-shadow:0 4px 20px #35232c14;align-items:center;z-index:25;
}
#listening .dock-top{grid-area:1/1;width:auto;min-width:0;gap:10px;}
#listening #active-art{display:block;width:38px;min-width:38px;height:38px;}
#listening #active-art[hidden]{display:none;}
#listening #active-art img{width:100%;height:100%;object-fit:cover;}
#listening .active-meta{min-width:0;}
#listening .active-meta .eyebrow{display:none;}
#listening:is(.expanded,:not(.expanded)) #return-playing{display:flex;flex-direction:column;justify-content:center;align-items:stretch;padding:0;min-height:44px;text-align:left;min-width:0;}
#listening #active-title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 13px/1.25 Arial,sans-serif;}
#listening #active-artist{display:block;font:11px/1.3 Arial,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#listening #playback-status{font:10px/1.25 Arial,sans-serif;margin:2px 0 0;}
#listening .transport{display:contents;}
#listening .player-tools{grid-area:1/2;display:flex;gap:4px;width:auto;justify-content:center;flex-wrap:nowrap;}
#listening .player-tools button{flex:0 0 44px;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;}
#listening .player-tools button[hidden]{display:none!important;}
#listening #expand-mini{display:block;grid-area:1/3;justify-self:stretch;min-width:44px;min-height:44px;padding:8px 6px;border:1px solid #cdb7b8;border-radius:5px;background:transparent;color:#4a2436;font:600 12px/1.2 Arial,sans-serif;}
#listening #expand-mini:hover{background:#f8e8de;}
#listening:not(.expanded) :is(.seek-line,.source-connection,#queue-context){display:none;}
#listening.expanded .active-meta #active-title{white-space:normal;overflow-wrap:anywhere;}
#listening.expanded .seek-line{display:flex;grid-area:2/1/3/-1;max-width:none;width:100%;gap:8px;align-items:center;margin:8px 0 0;min-height:36px;flex-wrap:nowrap;}
#listening.expanded #seek{flex:1;min-width:0;height:30px;}
#listening #playback-time,#listening #playback-duration{flex:0 0 auto;font:11px/1.2 Arial,sans-serif;white-space:nowrap;}
#listening.expanded .source-connection{grid-area:3/1/4/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:4px 16px;border-top:1px solid #dfd0ca;padding-top:6px;}
#listening.expanded .source-connection :is(button,a){min-height:44px;display:inline-flex;align-items:center;font-size:12px;}
#listening.expanded #source-credit{width:auto;margin:0;text-align:left;}
#listening.expanded #provider-limit{display:block;width:auto;font:11px/1.3 Arial,sans-serif;text-align:left;}
#listening.expanded #stop-audio{margin-left:auto;min-width:44px;justify-content:center;font-size:23px;}
#listening.expanded #queue-context{margin-top:3px;}
body.has-player{padding-bottom:calc(var(--mini-height,64px) + 28px);}
body.has-player #feedback{bottom:calc(var(--mini-height,64px) + 24px);}
#primary-nav :is(button,summary):focus-visible,#listening button:focus-visible{outline:2px solid #762d51;outline-offset:2px;}
@media(max-width:620px),(max-width:1000px) and (max-height:500px){
 body,body.has-player{height:var(--app-height,100dvh);padding:0!important;}
 .review-strip{display:none;}
 header{display:flex;align-items:center;justify-content:flex-start;min-height:60px;height:60px;padding:8px 18px;gap:0;}
 header .brand{min-height:44px;display:flex;align-items:center;}
 header .brand-wordmark{width:176px;}
 #page{scroll-padding-bottom:18px;}
 #primary-nav{position:relative;overflow:visible;flex:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;align-items:center;z-index:30;width:100%;margin:0;padding:4px max(8px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));background:#fff4e9;border-top:1px solid #cdb7b8;}
 #primary-nav>button,#primary-nav>details>summary{display:flex;align-items:center;justify-content:center;gap:0;width:100%;min-width:0;min-height:44px;padding:6px 3px;margin:0;border:0;border-radius:4px;background:none;color:#61404e;font:600 12px/1.2 Arial,sans-serif;letter-spacing:0;white-space:nowrap;text-decoration:none;}
 #primary-nav>button[aria-current=page],#primary-nav>details>summary[aria-current=page]{color:#461b30;background:#efd0d3;box-shadow:inset 0 -2px #762d51;}
 #primary-nav>button:hover,#primary-nav>details>summary:hover{background:#f6e4de;}
 #primary-nav #search-toggle span{display:inline;}
 #primary-nav #search-toggle svg{display:none;}
 #primary-nav #nav-more{width:100%;}
 #primary-nav #nav-more summary::after{display:none;}
 #primary-nav #nav-more>div{position:absolute;top:auto;bottom:calc(100% + 8px);right:0;min-width:190px;max-width:calc(100vw - 24px);}
 body.has-player #listening,body.has-player #listening:is(.expanded,:not(.expanded)){
  position:relative;inset:auto;flex:none;width:100%;max-width:none;margin:0;border-width:1px 0 0;border-radius:0;
  grid-template-columns:minmax(0,1fr) 44px 56px;gap:0 6px;padding:6px max(8px,env(safe-area-inset-right)) 6px max(8px,env(safe-area-inset-left));min-height:64px;
  max-height:min(300px,46dvh);overflow-y:auto;overscroll-behavior:contain;box-shadow:none;
 }
 #listening #active-art{display:block;width:32px;min-width:32px;height:32px;}
 #listening .dock-top{gap:8px;}
 #listening #active-title{font-size:12px;}
 #listening #playback-status{font-size:9px;}
 #listening #expand-mini{grid-area:1/3;justify-self:stretch;min-width:0;font-size:11px;padding:5px 2px;}
 #listening .player-tools{grid-area:1/2;gap:0;}
 #listening:not(.expanded) #previous-discovery,#listening:not(.expanded) #next-discovery{display:none;}
 body.has-player #listening.expanded{grid-template-columns:minmax(0,1fr) 132px 56px;}
 #listening.expanded .dock-top{grid-area:1/1/2/3;}
 #listening.expanded .player-tools{grid-area:2/1/3/-1;justify-self:center;margin-top:3px;}
 #listening.expanded #active-title{font-size:13px;}
 #listening.expanded .seek-line{grid-area:3/1/4/-1;margin:0;}
 #listening.expanded .source-connection{grid-area:4/1/5/-1;gap:2px 10px;}
 #listening.expanded #provider-limit{flex:1 0 50%;}
 #listening.expanded #stop-audio{min-height:44px;}
 #listening.expanded #source-credit{font-size:11px;}
 #listening.expanded #show-source{font-size:12px;}
 body #feedback{bottom:calc(var(--navigation-height,53px) + 12px);max-width:calc(100vw - 24px);}
 body.has-player #feedback{bottom:calc(var(--mini-height,64px) + var(--navigation-height,53px) + 12px);}
 body[data-keyboard] header{display:none;}
 body[data-keyboard] #page{scroll-padding-top:8px;}
 body[data-keyboard] #primary-nav{padding-block:0;}
 #sheet{max-height:calc(var(--app-height,100dvh) - 24px);}
}
@media(max-width:620px){#search{font-size:16px;} #browse-genre{font-size:16px;}}
