/* v3.3.5 Watch cards (owner pick: "strip"). S · E pill + season name across the top; big square art (left
   square of the YouTube thumbnail) with the bookmark on its corner; title only; Hosted by; date · length. */
.episode.watch-card{position:relative;display:grid!important;grid-template-columns:clamp(112px,33vw,160px) minmax(0,1fr)!important;grid-template-areas:none!important;column-gap:14px!important;row-gap:10px!important;padding:12px!important;align-items:center!important}
.wc-top{grid-column:1/-1;display:flex;align-items:center;gap:10px;min-width:0}
.wc-label{font-size:12px;letter-spacing:.8px;color:#f6f1ff;border:1px solid #ffffff26;background:linear-gradient(135deg,#7c3aed70,#db277760);box-shadow:inset 0 1px 0 #ffffff1f}
.wc-code{padding:5px 10px;border-radius:999px;flex:none}
.wc-top .wc-season{font-size:12px;color:#c4b5fd;letter-spacing:.2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wc-art{position:relative;grid-column:1;min-width:0}
.episode.watch-card .thumb{width:100%!important;aspect-ratio:1/1!important;height:auto!important;border-radius:16px!important;overflow:hidden;background:#0b1020;grid-area:auto!important;display:block}
.episode.watch-card .thumb img{width:100%;height:100%;object-fit:cover;object-position:left center}
.episode.watch-card .save{position:absolute;top:6px;right:6px;width:44px!important;height:44px!important;grid-area:auto!important;border-radius:14px!important;background:#0b1020b3!important;border-color:#ffffff33!important;backdrop-filter:blur(4px)}
.episode.watch-card .save.on{background:#a7f3d0!important;color:#0b1020!important}
.episode.watch-card .info{grid-column:2;grid-area:auto!important;min-width:0;padding:0!important;align-self:center!important;text-align:left;display:block}
.wc-tap{cursor:pointer;outline:none}.wc-tap:focus-visible{outline:2px solid #a7f3d0;border-radius:8px}
.episode.watch-card h3{font-size:14px!important;line-height:1.35!important;margin:0 0 8px!important;color:#fff!important;overflow-wrap:break-word!important;word-break:normal!important;hyphens:auto;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
/* Hosted by + date · length: same calm grey. Date and length always share ONE line. */
.wc-hosts,.wc-meta{display:block;font-size:11px;line-height:1.5;letter-spacing:0;color:#b4afce;text-align:left}
.wc-hosts{width:100%;margin:0 0 3px;padding:0;background:none;border:0;font:inherit;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
button.wc-hosts{min-height:32px;cursor:pointer;text-decoration:underline dotted #b4afce80;text-underline-offset:3px}
.wc-hosts-add{color:#c4b5fd!important;text-decoration:none!important}
.wc-meta{white-space:nowrap}
/* Host filter chip + picker + sheet */
.chips.host-row{margin-top:-4px}
.chip.host-filter{white-space:nowrap}
.host-picker{display:grid;gap:4px;min-width:180px;max-height:60vh;overflow:auto}
.host-picker button{text-align:left;padding:10px 12px;min-height:44px;border-radius:12px;background:none;border:0;color:var(--ink)}
.host-picker button.on{background:#a7f3d0;color:#0b1020}
.host-chips{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.host-chip-wrap{display:inline-flex;align-items:center;gap:2px}
.host-chip{min-height:44px;padding:0 16px;border-radius:999px;border:1px solid #ffffff33;background:#ffffff0d;color:var(--ink)}
.host-chip.on{background:#a7f3d0;color:#0b1020;border-color:#a7f3d0}
.host-x{width:32px;height:44px;border:0;background:none;color:#f9a8d4;font-size:18px}
.host-new{display:flex;gap:8px;margin-bottom:14px}.host-new input{flex:1;min-width:0}
/* Sound button + panel (3.3.5) */
#sound-button svg{width:20px;height:20px}
.sound-dialog{max-width:min(380px,calc(100vw - 32px));width:100%;border:1px solid #a7f3d033;border-radius:22px;background:#141b33;color:var(--ink);padding:22px}
.sound-dialog::backdrop{background:#04060fcc}
.sound-dialog h2{margin:0 0 14px;font-size:20px}
.sound-row{padding:12px 0;border-top:1px solid #ffffff14}
.sound-row-head{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-bottom:6px}
.sound-row-head output{color:#a7f3d0;font-size:12px}
.sound-row-ctl{display:flex;align-items:center;gap:10px}
.sound-mute{width:44px;height:44px;flex:none;border-radius:14px;display:grid;place-items:center;border:1px solid #a7f3d055;background:#a7f3d01f;color:#a7f3d0}
.sound-mute.off{border-color:#ffffff26;background:#ffffff0a;color:#b4afce}
.sound-mute svg{width:20px;height:20px}
.sound-row input[type=range]{flex:1;min-width:0;height:44px;accent-color:#a7f3d0}
.sound-note{font-size:11px;color:#b4afce;line-height:1.5;margin:6px 0 12px}
.sound-credits{display:grid;gap:6px;padding:12px;border-radius:16px;background:#0e1430;margin-bottom:16px}
.sound-credits>small{font-size:11px;letter-spacing:1px;color:#c4b5fd}
.music-credit{display:flex;align-items:center;gap:8px;min-height:44px;width:100%;padding:6px 8px;border-radius:12px;border:0;background:none;color:var(--ink);text-align:left;font-size:12px}
.music-credit span{flex:1;min-width:0;line-height:1.35}.music-credit b{font-weight:400;color:#fff}
.music-credit small{font-size:11px;color:#f9a8d4;white-space:nowrap}
.fg-music{margin:4px 0 10px}.fg-music .music-credit{background:#ffffff0a;border:1px solid #ffffff1a}
.sound-dialog .actions button{width:100%;min-height:48px}
/* Home (3.3.5): less empty space above the greeting; compact "Next recording" card with a date tile. */
.ph-top{padding:2px 0 12px!important;align-items:center!important}
main:has(> .ph-top){padding-top:14px!important}
.ph-next.ph-next2{display:grid!important;grid-template-columns:auto minmax(0,1fr) 20px;align-items:center;gap:14px!important;padding:12px 14px!important;margin:2px 0 20px!important;border-radius:22px!important;border:1px solid #c4b5fd55!important;background:radial-gradient(120% 140% at 0% 0%,#7c3aed3d,transparent 60%),linear-gradient(135deg,#1b1f46,#141a33)!important;min-height:0}
.ph-next.ph-next2>svg{position:static!important;transform:none!important;width:20px;height:20px;color:#a7f3d0}
.ph-date-tile{width:62px;height:66px;flex:none;border-radius:16px;display:grid;place-content:center;text-align:center;line-height:1;background:linear-gradient(160deg,#a7f3d0,#34d399 55%,#0ea5a4);color:#0b1020;box-shadow:0 6px 18px #34d39933,inset 0 1px 0 #ffffff80}
.ph-date-tile b{font-size:26px;font-weight:400;margin:3px 0}
.ph-date-tile small{font-size:11px;letter-spacing:1px}
.ph-date-tile.is-empty{background:linear-gradient(160deg,#3b3f6b,#262a4d);color:#c4b5fd;box-shadow:none}
.ph-next-copy{display:grid;gap:3px;min-width:0}
.ph-next2 .ph-label{font-size:11px!important;letter-spacing:1px;color:#c4b5fd!important;display:flex;gap:8px;align-items:center}
.ph-next2 .ph-code{font-size:11px;padding:2px 7px;border-radius:999px;background:#ffffff14;color:#f6f1ff}
.ph-next2 .ph-next-copy b{font-size:17px!important;line-height:1.25!important;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ph-next-meta{font-size:12px;color:#a7f3d0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ph-next2.is-today .ph-date-tile{background:linear-gradient(160deg,#fde68a,#f59e0b);box-shadow:0 6px 18px #f59e0b40}
/* Header with the extra sound button: title wraps between words only ("The U.F.O." / "Cast"). */
.app-header .brand-name{overflow-wrap:normal!important;word-break:keep-all}
@media (max-width:390px){.app-header{padding-left:14px!important;padding-right:14px!important;gap:8px!important}.app-header .brand{gap:8px!important}.app-header .brand-image{width:36px!important;height:36px!important}.app-header .brand-name{font-size:13px!important}.app-header .header-tools{gap:3px!important}}
/* Date tile, calmer (owner feedback): dark glass in the card's purple tones, white day, soft violet labels. */
.ph-date-tile{background:linear-gradient(160deg,#2c2f63,#1d2045)!important;color:#f6f1ff!important;border:1px solid #c4b5fd59;box-shadow:inset 0 1px 0 #ffffff1a,0 4px 14px #0006!important}
.ph-date-tile small{color:#c4b5fd}
.ph-date-tile b{color:#fff}
.ph-next-meta{color:#b4afce!important}
.ph-next2.is-today .ph-date-tile{background:linear-gradient(160deg,#3b2f63,#2a2050)!important;border-color:#fcd34d88}
.ph-next2.is-today .ph-date-tile small{color:#fcd34d}
/* 3.3.6: bookmark in the card's top-right corner (owner), smaller look, still a 44 px touch target. */
.wc-top .save{position:relative!important;top:auto!important;right:auto!important;margin:-6px -6px -6px auto;width:44px!important;height:44px!important;min-width:44px;background:none!important;border:0!important;backdrop-filter:none!important;display:grid;place-items:center;color:#c4b5fd}
.wc-top .save svg{width:18px;height:18px;padding:7px;box-sizing:content-box;border-radius:10px;background:#ffffff0d;border:1px solid #ffffff1f}
.wc-top .save.on{background:none!important;color:#0b1020!important}
.wc-top .save.on svg{background:#a7f3d0;border-color:#a7f3d0}
