/* The same episode picker is used by both property features. */
.episode-switcher {
  --episode-ink:var(--ink,#152c26);
  --episode-rule:color-mix(in srgb,var(--episode-ink) 14%,white);
  --episode-muted:color-mix(in srgb,var(--episode-ink) 68%,white);
  --episode-soft:color-mix(in srgb,var(--episode-ink) 4%,white);
  --episode-selected:color-mix(in srgb,var(--episode-ink) 7%,white);
  --episode-serif:var(--serif,Georgia,serif);
  position:relative; flex:none; margin-left:auto; color:var(--episode-ink);
}
.episode-switcher>summary {
  display:list-item; list-style:disclosure-closed inside; width:max-content;
  min-height:44px; padding:10px 17px; border:1px solid var(--episode-rule);
  border-radius:24px; background:#fff; color:inherit; cursor:pointer;
  font:500 12px/22px var(--sans,'DM Sans',Arial,sans-serif); white-space:nowrap;
  transition:background .18s,border-color .18s;
}
.episode-menu-trigger-compact { display:none; }
.episode-switcher>summary::marker { color:#887857; font-size:10px; }
.episode-switcher[open]>summary { list-style-type:disclosure-open; background:var(--episode-soft); border-color:#a99a7b; }
.episode-switcher>summary:hover { background:var(--episode-soft); }
.episode-switcher>summary:focus-visible { outline:2px solid #9f8b62; outline-offset:4px; }
.episode-menu-panel {
  position:absolute; z-index:5; top:calc(100% + 12px); right:0;
  width:390px; max-width:calc(100vw - 32px);
  max-height:var(--episode-menu-room,min(520px,calc(100svh - 200px)));
  overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin;
  padding:20px; border:1px solid var(--episode-rule); border-radius:10px;
  background:#fffefa; box-shadow:0 16px 44px #11231e20,0 3px 8px #11231e08;
}
.episode-switcher[open] .episode-menu-panel { animation:episode-menu-enter .18s ease-out; }
.episode-menu-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:0 0 16px; padding:0; }
.episode-menu-heading p { margin:0 0 5px; color:var(--episode-muted); font:500 8px/1.5 var(--sans,'DM Sans',Arial,sans-serif); letter-spacing:.16em; }
.episode-menu-heading h2 { margin:0; color:var(--episode-ink); font:400 26px/1.1 var(--episode-serif); letter-spacing:-.025em; }
.episode-menu-all { flex:none; display:flex; align-items:center; min-height:44px; color:var(--episode-muted); font:500 11px/1.4 var(--sans,'DM Sans',Arial,sans-serif); text-decoration:underline; text-decoration-color:#c2baa6; text-underline-offset:4px; }
.episode-menu-choices { display:grid; gap:8px; margin:0; padding:0; }
.episode-menu-choices>.episode-menu-choice {
  display:grid; grid-template-columns:88px minmax(0,1fr); align-items:center; gap:14px;
  min-height:96px; min-width:0; margin:0; padding:9px; border:1px solid transparent;
  border-radius:6px; color:var(--episode-ink); background:var(--episode-soft); text-align:left;
  transition:background .18s,border-color .18s;
}
.episode-menu-choices>.episode-menu-choice::after { content:none; }
.episode-menu-choices>.episode-menu-choice:hover { background:var(--episode-selected); border-color:var(--episode-rule); }
.episode-menu-choices>.episode-menu-choice[aria-current="page"] { border-color:color-mix(in srgb,var(--episode-ink) 25%,white); background:var(--episode-selected); }
.episode-menu-choice>img { width:88px; height:72px; max-width:none; border-radius:3px; object-fit:cover; }
.episode-menu-copy { display:flex; flex-direction:column; min-width:0; gap:4px; }
.episode-menu-meta { display:flex; flex-wrap:wrap; align-items:center; gap:5px 9px; color:var(--episode-muted); font:500 8px/1.4 var(--sans,'DM Sans',Arial,sans-serif); letter-spacing:.11em; }
.episode-menu-current { color:var(--episode-ink); font-size:8px; font-weight:600; letter-spacing:0; }
.episode-menu-name { display:block; color:var(--episode-ink); font:500 22px/1.08 var(--episode-serif); letter-spacing:-.02em; overflow-wrap:normal; }
.episode-menu-description { display:block; color:var(--episode-muted); font:400 11px/1.5 var(--sans,'DM Sans',Arial,sans-serif); }
.episode-menu-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:3px 18px; margin-top:15px; padding:9px 0 0; border:0; border-top:1px solid var(--episode-rule); background:transparent; color:inherit; }
.episode-menu-footer>a { display:flex; align-items:center; min-height:44px; padding:4px 0; color:var(--episode-muted); font:400 11px/1.5 var(--sans,'DM Sans',Arial,sans-serif); }
.episode-menu-footer>a:hover,.episode-menu-all:hover { color:var(--episode-ink); text-decoration:underline; text-underline-offset:4px; }
@keyframes episode-menu-enter { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:800px) {
  .episode-switcher { position:static; }
  .episode-switcher>summary { padding:8px 13px; font-size:11px; }
  .episode-menu-panel { top:calc(100% + 8px); left:auto; right:var(--gutter,24px); width:390px; max-width:calc(100vw - 32px); }
}
@media(max-width:560px) {
  .episode-menu-trigger-wide { display:none; }
  .episode-menu-trigger-compact { display:inline; }
  .episode-menu-panel { left:16px; right:16px; width:auto; max-width:none; padding:17px; }
  .episode-menu-heading h2 { font-size:25px; }
  .episode-menu-heading { gap:10px; margin-bottom:14px; }
  .episode-menu-choices>.episode-menu-choice { grid-template-columns:76px minmax(0,1fr); gap:12px; padding:8px; min-height:92px; }
  .episode-menu-choice>img { width:76px; height:68px; }
  .episode-menu-name { font-size:21px; }
  .episode-menu-description { font-size:10.5px; }
  .episode-switcher>summary { padding:8px 11px; font-size:11px; }
}
@media(max-width:360px) {
  .episode-switcher>summary { font-size:10px; padding-inline:9px; }
  .episode-menu-heading h2 { font-size:23px; }
  .episode-menu-panel { padding:15px; }
  .episode-menu-choices>.episode-menu-choice { grid-template-columns:64px minmax(0,1fr); gap:10px; }
  .episode-menu-choice>img { width:64px; height:68px; }
  .episode-menu-name { font-size:20px; }
}
@media(prefers-reduced-motion:reduce) {
  .episode-switcher>summary,.episode-menu-choice { transition:none; }
  .episode-switcher[open] .episode-menu-panel { animation:none; }
}
