/* July 22 Reader Experience styles. */

.reader-discovery,
.release-calendar,
.with-love-feed,
.house-audio-player {
    width: min(1180px, 92vw);
    margin: clamp(2rem, 6vw, 5rem) auto;
}
.update-story-visual .house-audio-player { width: 100%; margin: 0; }
.update-story-chapter-audio { background: linear-gradient(110deg, #020914, #0a1d38); }

.reader-discovery {
    margin-top: clamp(1rem, 2vw, 1.75rem);
    padding: clamp(.9rem, 2vw, 1.25rem);
    border: 1px solid rgba(99, 158, 245, .18);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(10, 27, 52, .96), rgba(3, 12, 25, .98));
}

.reader-discovery-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1.25rem;
    margin-bottom: .8rem;
}

.reader-discovery-heading h2,
.house-audio-player h2,
.with-love-feed h2 {
    margin: .25rem 0 .6rem;
}

.reader-discovery-heading h2 {
    margin: .15rem 0 0;
    font-size: clamp(1.35rem, 2.5vw, 1.9rem);
}

.reader-discovery-heading > p {
    max-width: 360px;
    margin: 0;
    color: #8ea5c2;
    font-size: .78rem;
    text-align: right;
}

.reader-discovery-controls {
    display: grid;
    grid-template-columns: minmax(240px, 2fr) minmax(150px, .7fr) minmax(150px, .7fr);
    gap: .55rem;
}

.reader-discovery-controls label {
    display: grid;
    gap: .25rem;
    color: #a9bad1;
    font-size: .63rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.reader-discovery-controls input,
.reader-discovery-controls select {
    min-height: 42px;
    padding: .62rem .78rem;
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 10px;
    color: #fff;
    background: rgba(255, 255, 255, .055);
    font: inherit;
    text-transform: none;
}

.reader-discovery-count {
    margin: .65rem 0;
    color: #8ea5c2;
    font-size: .8rem;
}

.reader-discovery-results {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
}

.discovery-result {
    display: grid;
    grid-template-columns: 84px 1fr;
    gap: .75rem;
    padding: .75rem;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 14px;
    background: rgba(255, 255, 255, .035);
}

.discovery-result[hidden] { display: none; }
.discovery-result.no-image { grid-template-columns: 1fr; }
.discovery-result-image img { width: 84px; height: 106px; object-fit: cover; border-radius: 10px; }
.discovery-result h3 { margin: .35rem 0 .3rem; font-size: 1rem; }
.discovery-result h3 a { color: #fff; }
.discovery-result p { margin: 0 0 .7rem; color: #aebbd0; font-size: .85rem; }
.discovery-result small { color: #6fa8f5; }

.post-card-advisories,
.post-advisories {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin: .7rem 0;
}

.advisory-badge {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: .26rem .52rem;
    border: 1px solid rgba(111, 168, 245, .25);
    border-radius: 999px;
    color: #accdf8;
    background: rgba(49, 109, 191, .09);
    font-size: .63rem;
    font-weight: 800;
    letter-spacing: .05em;
    line-height: 1;
    text-transform: uppercase;
}

.advisory-age { color: #f1ca82; border-color: rgba(219, 172, 86, .28); background: rgba(153, 107, 34, .1); }
.post-advisories { margin-top: 1rem; }

.story-metadata-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: .8rem;
    margin-top: 1rem;
    padding: .85rem;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 14px;
    background: rgba(255, 255, 255, .025);
}

.story-metadata-group,
.story-content-advisories { min-width: 0; }
.story-synopsis {
    grid-column: 1 / -1;
    padding-bottom: .75rem;
    border-bottom: 1px solid rgba(255, 255, 255, .09);
}
.story-synopsis-copy {
    max-width: 68ch;
    margin: .35rem 0 0;
    color: #c3d0e1;
    font-size: .86rem;
    line-height: 1.55;
}
.story-content-advisories { padding-left: .8rem; border-left: 1px solid rgba(255, 255, 255, .09); }
.story-content-advisories[hidden] { display: none; }
.story-metadata-label { margin: 0; color: #869bb8; font-size: .63rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.story-metadata-panel .post-advisories { margin: .45rem 0 0; }
.advisory-content { color: #efbdc7; border-color: rgba(224, 116, 139, .3); background: rgba(148, 51, 76, .12); }

.jump-to-comments {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin-top: .75rem;
    padding: .72rem 1rem;
    border: 1px solid rgba(48, 112, 220, .38);
    border-radius: 999px;
    color: #dceaff;
    background: rgba(38, 101, 205, .13);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
}

.jump-to-comments:hover { color: #fff; background: rgba(48, 112, 220, .24); }
.jump-to-comments svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 1.8; }
.post-comments { scroll-margin-top: 7rem; }
.post-comments:focus { outline: 1px solid rgba(95, 153, 235, .42); outline-offset: 8px; }

.series-start-guide {
    display: grid;
    grid-template-columns: minmax(170px, .8fr) minmax(330px, 1.5fr) minmax(220px, .9fr);
    align-items: center;
    gap: clamp(1rem, 3vw, 2rem);
    margin: 1.4rem 0 2rem;
    padding: clamp(1.1rem, 3vw, 1.8rem);
    border: 1px solid rgba(86, 146, 227, .24);
    background: linear-gradient(125deg, rgba(16, 43, 79, .7), rgba(4, 16, 31, .92));
    box-shadow: 0 24px 70px rgba(0, 0, 0, .2);
}
.series-start-guide-title .eyebrow { margin: 0 0 .35rem; color: #4d8ee9; }
.series-start-guide-title h3 { margin: 0; color: #e4bd72; font-family: Georgia, serif; font-size: clamp(1.45rem, 2.5vw, 2rem); font-weight: 400; letter-spacing: 0; }
.series-start-guide dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin: 0; }
.series-start-guide dl div { min-height: 76px; padding: .75rem; border: 1px solid rgba(255, 255, 255, .06); background: rgba(255, 255, 255, .035); }
.series-start-guide dt { color: #8096b4; font-size: .6rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.series-start-guide dd { margin: .35rem 0 0; color: #fff; font-size: .82rem; font-weight: 700; }
.series-start-guide-actions { display: grid; gap: .45rem; }
.series-start-guide-actions a:not(.button) { color: #9fc8ff; font-size: .72rem; font-weight: 700; text-align: center; text-decoration: none; }
.series-start-guide-primary { padding: .75rem .8rem; font-size: .68rem; text-align: center; }
.start-guide-update-preview { display: grid; align-items: center; }
.start-guide-update-preview .series-start-guide { width: 100%; margin: 0; }
.series-start-guide-preview { grid-template-columns: 1fr; padding: clamp(1.4rem, 4vw, 2.2rem); }
.series-start-guide-preview .series-start-guide-title h3 { font-size: clamp(1.8rem, 4vw, 2.7rem); }
.series-start-guide-preview .series-start-guide-actions { grid-template-columns: 1fr 1fr; }
.series-start-guide-preview .series-start-guide-primary { grid-column: 1 / -1; }

.release-calendar { margin-top: clamp(1rem, 2vw, 1.75rem); }
.release-calendar-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }
.release-calendar-toolbar .eyebrow { margin-bottom: .15rem; }
.release-calendar-count { margin: 0; color: #8fa3bf; font-size: .78rem; }
.release-calendar-controls { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .35rem; }
.release-calendar-controls button,
.recommendation-actions button {
    padding: .48rem .72rem;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 999px;
    color: #b9c8dc;
    background: rgba(255, 255, 255, .04);
    cursor: pointer;
    font-size: .68rem;
    font-weight: 700;
}
.release-calendar-controls button.is-active { color: #fff; border-color: #4e8fe9; background: rgba(48, 112, 220, .22); }
.release-calendar-note { display: flex; gap: .65rem; margin: 0; padding: .65rem .8rem; border-left: 3px solid #c8943e; color: #9faec2; background: rgba(158, 107, 31, .07); font-size: .75rem; }
.release-calendar-note strong { color: #e1bd78; }
.release-calendar-list { display: grid; gap: .55rem; margin-top: .8rem; }
.release-feed-loading { margin: 0; padding: 1rem; color: #8fa3bf; font-size: .78rem; }
.release-feed-status { margin: 1rem 0 0; color: #d8b77b; font-size: .75rem; text-align: center; }
.release-card { position: relative; display: grid; grid-template-columns: 62px 1fr auto; align-items: center; gap: .9rem; padding: .8rem .9rem; overflow: hidden; border: 1px solid rgba(255, 255, 255, .09); border-radius: 14px; background: rgba(255, 255, 255, .035); }
.release-card::before { position: absolute; inset: 0 auto 0 0; width: 3px; content: ""; background: #4f8fdf; }
.release-card.is-report::before { background: #be914b; }
.release-card.is-trailer::before { background: #9678d5; }
.release-card.is-audio::before { background: #56a6b8; }
.release-card[hidden] { display: none; }
.release-card time { display: grid; place-items: center; height: 58px; border-radius: 11px; color: #fff; background: #102b50; }
.release-card time span { font-size: .66rem; text-transform: uppercase; }
.release-card time strong { font-size: 1.35rem; }
.release-card h2 { margin: .08rem 0 .22rem; font-size: 1.05rem; }
.release-card h2 a { color: inherit; text-decoration: none; }
.release-card h2 a:hover { color: #a9cdfd; }
.release-card p { margin: 0; color: #9eacc0; font-size: .8rem; }
.release-access { padding: .36rem .58rem; border: 1px solid rgba(86, 146, 227, .2); border-radius: 999px; color: #a9cdfd; background: rgba(50, 117, 211, .1); font-size: .64rem; font-weight: 800; text-transform: uppercase; }
.release-access.is-everyone { color: #d8c18c; border-color: rgba(200, 148, 62, .22); background: rgba(158, 107, 31, .08); }
.release-access.is-members { color: #c5b5ed; border-color: rgba(150, 120, 213, .24); background: rgba(119, 84, 187, .09); }
.release-card-badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .4rem; }
.release-special { display: inline-flex; width: fit-content; margin-top: .28rem; padding: .3rem .52rem; border: 1px solid rgba(218, 169, 82, .28); border-radius: 999px; color: #e3bd76; background: rgba(181, 119, 31, .1); font-size: .6rem; font-weight: 800; letter-spacing: .035em; text-transform: uppercase; }
.release-card.is-special-release::before { background: #d09b43; }
.release-calendar-recent { margin-top: clamp(2.8rem, 6vw, 4.8rem); padding-top: clamp(2rem, 4vw, 3.2rem); border-top: 1px solid rgba(255, 255, 255, .1); }
.release-calendar-toolbar h2 { margin: .1rem 0 .25rem; font-size: clamp(1.6rem, 3vw, 2.3rem); }
.release-reading-room { padding: .48rem .7rem; border: 1px solid rgba(86, 146, 227, .25); border-radius: 999px; color: #b9d7ff; background: rgba(50, 117, 211, .1); cursor: pointer; font-size: .66rem; font-weight: 800; }
.release-reading-room:hover, .release-reading-room.is-saved { color: #071426; background: #a9cdfd; }
.release-calendar-empty { margin-top: .75rem; padding: 1rem; border: 1px dashed rgba(255, 255, 255, .12); border-radius: 14px; text-align: center; }
.release-calendar-empty h2 { margin: 0 0 .25rem; font-size: 1rem; }
.release-calendar-empty p { margin: 0; color: #8fa3bf; font-size: .78rem; }

.house-audio-player {
    padding: clamp(1.2rem, 4vw, 2.4rem);
    border: 1px solid rgba(107, 168, 255, .2);
    border-radius: 28px;
    background: radial-gradient(circle at 85% 10%, rgba(41, 114, 218, .2), transparent 34%), #071426;
    box-shadow: 0 25px 70px rgba(0, 0, 0, .28);
}
.house-audio-player-heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; }
.audio-player-access { padding: .4rem .65rem; border-radius: 999px; color: #e4bd72; border: 1px solid rgba(216, 174, 92, .28); }
.audio-waveform { display: flex; align-items: center; gap: 5px; height: 72px; margin: 1rem 0; overflow: hidden; }
.audio-waveform i { flex: 1; height: 35%; border-radius: 99px; background: #5298f4; opacity: .75; }
.audio-waveform i:nth-child(3n) { height: 85%; }
.audio-waveform i:nth-child(4n) { height: 58%; }
.audio-seek { width: 100%; accent-color: #5da2ff; }
.audio-time { display: flex; justify-content: space-between; color: #8296b2; font-size: .7rem; }
.audio-controls { display: flex; align-items: center; justify-content: center; gap: 1rem; margin: 1rem 0; }
.audio-controls button { width: 44px; height: 44px; border: 1px solid rgba(255, 255, 255, .13); border-radius: 50%; color: #fff; background: rgba(255, 255, 255, .05); }
.audio-controls .audio-play { width: 60px; height: 60px; color: #071426; background: #fff; }
.audio-controls button:disabled { cursor: not-allowed; opacity: .42; }
.audio-player-status { color: #8296b2; font-size: .72rem; text-align: center; }

.recommendation-card { display: grid; grid-template-columns: minmax(240px, .85fr) 1.15fr; overflow: hidden; border: 1px solid rgba(255, 255, 255, .1); border-radius: 24px; background: #071426; }
.recommendation-card.is-featured { position: relative; padding-top: 2.35rem; border-color: rgba(228, 189, 114, .38); }
.recommendation-featured-banner { position: absolute; z-index: 2; top: 0; right: 0; left: 0; display: grid; place-items: center; height: 2.35rem; margin: 0; color: #071426; background: #e4bd72; font-size: .68rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.with-love-more { margin-top: clamp(2.8rem, 7vw, 5.5rem); }
.with-love-section-heading { margin-bottom: 1.15rem; }
.with-love-section-heading h2 { margin: .15rem 0 0; font-size: clamp(1.7rem, 3.5vw, 2.5rem); }
.with-love-grid { display: grid; gap: 1.25rem; }
.recommendation-image { position: relative; min-height: 360px; }
.recommendation-image img { width: 100%; height: 100%; object-fit: cover; }
.recommendation-image > .recommendation-adult-badge { position: absolute; z-index: 3; top: 1rem; right: auto; bottom: auto; left: 1rem; width: auto; height: auto; min-width: 0; aspect-ratio: auto; padding: .4rem .55rem; border-radius: 999px; color: #071426; background: #e4bd72; font-size: .7rem; font-weight: 900; line-height: 1; }
.recommendation-monogram { display: grid; place-items: center; background: radial-gradient(circle at 70% 25%, rgba(57, 131, 225, .33), transparent 32%), linear-gradient(145deg, #0c1f38, #030b17); text-decoration: none; }
.recommendation-monogram strong { color: #e4bd72; font-family: Georgia, serif; font-size: clamp(3rem, 8vw, 5rem); font-weight: 500; letter-spacing: .08em; }
.recommendation-monogram strong span { position: static; padding: 0; color: #4c91ed; background: transparent; font-size: .55em; }
.recommendation-copy { align-self: center; padding: clamp(1.4rem, 5vw, 3.2rem); }
.recommendation-credit { color: #8599b5; font-size: .78rem; }
.recommendation-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; margin-top: 1.3rem; }
.recommendation-actions a { color: #9ec8ff; font-size: .75rem; font-weight: 700; }
.recommendation-actions .recommendation-original { color: #071426; padding: .55rem .72rem; border-radius: 999px; background: #e4bd72; text-decoration: none; }
.recommendation-actions .recommendation-original:hover { background: #f0cf8e; }
.with-love-empty { padding: 3rem; border: 1px dashed rgba(255, 255, 255, .18); border-radius: 22px; text-align: center; }

.reading-room-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1.5rem; }
.reading-room-summary div { display: grid; gap: .15rem; padding: 1rem; border: 1px solid rgba(255, 255, 255, .09); border-radius: 14px; background: rgba(255, 255, 255, .035); }
.reading-room-summary strong { color: #fff; font-size: 1.4rem; }
.reading-room-summary span, .reading-room-summary p { color: #8c9eb8; font-size: .7rem; }
.reading-room-summary p { grid-column: 1 / -1; margin: 0; text-align: right; }

@media (max-width: 800px) {
    .reader-discovery-results,
    .recommendation-card { grid-template-columns: 1fr; }
    .series-start-guide { grid-template-columns: 1fr; }
    .series-start-guide-actions { grid-template-columns: 1fr 1fr; }
    .series-start-guide-primary { grid-column: 1 / -1; }
    .discovery-result { grid-template-columns: 88px 1fr; }
    .discovery-result-image img { width: 88px; height: 116px; }
    .release-card { grid-template-columns: 58px 1fr; }
    .release-card time { height: 58px; }
    .release-access, .release-card-badges, .release-reading-room { grid-column: 2; justify-self: start; }
    .release-card-badges { justify-content: flex-start; }
    .recommendation-image { min-height: 260px; }
    .reading-room-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px) {
    .reader-discovery-heading { display: grid; gap: .35rem; }
    .reader-discovery-heading > p { text-align: left; }
    .reader-discovery-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .reader-discovery-controls label:first-child { grid-column: 1 / -1; }
    .release-calendar-toolbar { display: grid; align-items: start; }
    .release-calendar-controls { justify-content: flex-start; }
    .release-calendar-note { display: grid; gap: .15rem; }
    .discovery-result { grid-template-columns: 1fr; }
    .discovery-result-image img { width: 100%; height: 190px; }
    .story-metadata-panel { grid-template-columns: 1fr; }
    .series-start-guide dl { grid-template-columns: 1fr 1fr; }
    .series-start-guide dl div:last-child { grid-column: 1 / -1; }
    .series-start-guide-actions { grid-template-columns: 1fr; }
    .series-start-guide-primary { grid-column: auto; }
    .story-content-advisories { padding: .75rem 0 0; border-top: 1px solid rgba(255, 255, 255, .09); border-left: 0; }
    .post-advisories .advisory-topic:nth-of-type(n+5) { display: none; }
}

/* Topic tags stay hidden until the metadata registry approves them. */
.post-advisories .advisory-topic { display: none; }
.post-advisories .advisory-topic.is-reader-facing { display: inline-flex; }

.reader-discovery :is(input, select):focus-visible,
.release-calendar-controls button:focus-visible,
.release-reading-room:focus-visible,
.release-card h2 a:focus-visible,
.jump-to-comments:focus-visible,
.series-start-guide :is(a, button):focus-visible,
.house-audio-player :is(button, input):focus-visible,
.audio-library button:focus-visible,
.audio-access-actions a:focus-visible,
.recommendation-card :is(a, button):focus-visible {
    outline: 2px solid #77aeff;
    outline-offset: 3px;
}

.audio-library {
    margin: 1.5rem 0 2rem;
    padding: clamp(1rem, 3vw, 1.75rem);
    border: 1px solid rgba(78, 142, 238, .18);
    border-radius: 20px;
    background: rgba(7, 19, 37, .58);
}
.audio-library > header h3 { margin: .25rem 0; }
.audio-library-group { margin-top: .65rem; border-top: 1px solid rgba(144, 188, 255, .14); }
.audio-library-group summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem .15rem;
    color: #d7e8ff;
    cursor: pointer;
    font-weight: 750;
}
.audio-library-group summary small { color: #91a9c7; font-size: .75rem; font-weight: 600; }
.audio-library-group[open] summary { color: #fff; }
.audio-library-group .audio-library-tracks { padding: 0 0 1rem; }
.audio-library-tracks { display: flex; flex-wrap: wrap; gap: .55rem; }
.audio-library-tracks button {
    padding: .65rem .85rem;
    border: 1px solid rgba(144, 188, 255, .28);
    border-radius: 999px;
    background: rgba(12, 35, 67, .82);
    color: #e8f2ff;
    cursor: pointer;
    font: inherit;
    font-size: .9rem;
}
.audio-library-tracks button:hover,
.audio-library-tracks button.is-active {
    border-color: #7eb1ff;
    background: #173f76;
}
.story-audio-playlist {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
    gap: .5rem;
    margin-top: .75rem;
}
.story-audio-playlist button {
    min-height: 2.65rem;
    padding: .55rem .7rem;
    border: 1px solid rgba(144, 188, 255, .24);
    border-radius: 8px;
    background: rgba(8, 24, 47, .8);
    color: #dceaff;
    cursor: pointer;
    font: inherit;
    font-size: .75rem;
    text-align: left;
}
.story-audio-playlist button:hover,
.story-audio-playlist button.is-active { border-color: #7eb1ff; background: #173f76; }

.story-audio-inline {
    box-sizing: border-box;
    width: min(760px, 92vw);
    margin: clamp(1.25rem, 3vw, 2rem) auto;
    padding: 0;
}
.story-audio-launch {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .85rem 1rem;
    border: 1px solid rgba(78, 142, 238, .22);
    border-radius: 14px;
    background: rgba(8, 24, 47, .72);
}
.story-audio-launch h2 { margin: 0 0 .12rem; font-size: .95rem; }
.story-audio-launch p { margin: 0; color: #9fb2cb; font-size: .76rem; }
.story-audio-launch button {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: .42rem;
    padding: .62rem .9rem;
    border: 1px solid rgba(228, 189, 114, .45);
    border-radius: 999px;
    color: #071426;
    background: #e4bd72;
    cursor: pointer;
    font: inherit;
    font-size: .75rem;
    font-weight: 800;
}
.story-audio-launch button:hover { background: #f0cf8e; }
.story-audio-launch button:focus-visible { outline: 2px solid #77aeff; outline-offset: 3px; }
.story-audio-panel { margin-top: .75rem; }
.story-audio-panel[hidden] { display: none; }
.story-audio-panel .house-audio-player {
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 1rem 1.1rem .85rem;
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .18);
}
.story-audio-panel .house-audio-player-heading h2 { margin: .1rem 0 .18rem; font-size: 1.05rem; }
.story-audio-panel .house-audio-player-heading p { margin: 0; font-size: .72rem; }
.story-audio-panel .audio-player-access { padding: .28rem .5rem; font-size: .65rem; }
.story-audio-panel .audio-waveform { height: 34px; margin: .45rem 0; gap: 4px; }
.story-audio-panel .audio-controls { gap: .55rem; margin: .45rem 0 .15rem; }
.story-audio-panel .audio-controls button { width: 32px; height: 32px; font-size: .65rem; }
.story-audio-panel .audio-controls .audio-play { width: 44px; height: 44px; }
.story-audio-panel .audio-player-status { margin: 0; font-size: .65rem; }
.story-audio-inline-intro { margin: 0 0 .7rem; }
.story-audio-inline-intro h2 { margin: 0 0 .2rem; font-size: 1.05rem; }
.story-audio-inline-intro p:last-child { margin: 0; color: #b9cce5; }
.house-audio-player.is-inline {
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: .9rem 1rem .75rem;
    border-radius: 16px;
    background: linear-gradient(120deg, #09182b, #102a4b);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .18);
}
.audio-inline-main { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .85rem; }
.audio-inline-main .audio-play { width: 46px; height: 46px; border: 0; border-radius: 50%; color: #071426; background: #fff; font-size: .9rem; }
.audio-inline-copy { min-width: 0; }
.audio-inline-copy .eyebrow { margin: 0 0 .1rem; font-size: .58rem; }
.audio-inline-copy h2 { overflow: hidden; margin: 0; font-size: 1rem; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.audio-inline-copy > p:last-child { margin: .12rem 0 0; color: #9fb2cb; font-size: .72rem; }
.house-audio-player.is-inline .audio-player-access { padding: .28rem .5rem; font-size: .65rem; }
.house-audio-player.is-inline .audio-seek { display: block; margin: .7rem 0 .25rem; }
.audio-inline-footer { display: flex; align-items: center; gap: .75rem; min-height: 32px; }
.audio-inline-footer .audio-time { justify-content: flex-start; gap: .25rem; min-width: 76px; }
.audio-inline-footer .audio-controls { gap: .35rem; margin: 0; }
.audio-inline-footer .audio-controls button { width: 30px; height: 30px; font-size: .65rem; }
.audio-inline-footer .audio-player-status { flex: 1; margin: 0; text-align: right; }

@media (max-width: 560px) {
    .story-audio-inline { width: 92vw; }
    .story-audio-launch { align-items: flex-start; }
    .story-audio-launch p { display: none; }
    .audio-inline-main { grid-template-columns: auto minmax(0, 1fr); }
    .audio-inline-main .audio-player-access { display: none; }
    .audio-inline-footer .audio-player-status { display: none; }
}