/* UI-026 · load after the bright detail theme. Existing topbar, CTA and Dock stay owned. */
.drama-detail>.drama-heading.drama-reference-hero {
 position:relative;
 overflow:hidden;
 isolation:isolate;
 margin:-24px -22px 19px;
 padding:24px 22px 22px;
 border:0;
 border-radius:0 0 24px 24px;
 background:linear-gradient(130deg,#e9def8,#fae8f0);
}
.drama-reference-hero>.drama-reference-backdrop {
 position:absolute;
 z-index:-2;
 inset:-26px;
 width:calc(100% + 52px);
 height:calc(100% + 52px);
 object-fit:cover;
 filter:blur(24px) saturate(.85);
 opacity:.7;
 pointer-events:none;
}
.drama-reference-hero::after {content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(110deg,#f5edfebd,#fff5f8ad);pointer-events:none;}
.drama-reference-layout {display:grid;grid-template-columns:104px minmax(0,1fr);gap:16px;align-items:start;min-width:0;}
.drama-reference-layout>.drama-reference-poster {display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:cover;border:0;border-radius:12px;background:#e7d9f1;box-shadow:0 7px 20px #5c3b7a26;}
.drama-reference-copy {min-width:0;}
.drama-reference-copy>small {display:block;color:#8a6d91;font-size:10px;line-height:1.7;overflow-wrap:anywhere;}
.drama-reference-hero .drama-reference-copy>h1 {color:#4d305e;font-size:22px;font-weight:650;line-height:1.4;letter-spacing:-.03em;margin:7px 0 9px;overflow-wrap:anywhere;}
.drama-reference-copy>.drama-reference-metadata {display:flex;flex-wrap:wrap;gap:5px 11px;color:#7d6489;font-size:11px;line-height:1.75;margin:0;}
.drama-reference-copy>.drama-detail-meta {min-width:0;margin:11px 0 0;}
.drama-reference-copy>.drama-detail-meta:empty {display:none;}
.drama-reference-copy .drama-detail-tags {gap:6px;}
.drama-reference-copy .drama-detail-tag {padding:3px 7px;border-radius:5px;font-size:10px;line-height:1.5;}

/* Native details works without JS and keeps the configurable text in real DOM. */
.drama-detail>.drama-reference-summary {padding:16px 17px;margin:18px 0;border:0;border-radius:16px;background:#fff0f6;}
.drama-reference-summary>summary {display:block;cursor:pointer;list-style:none;min-height:44px;}
.drama-reference-summary>summary::-webkit-details-marker {display:none;}
.drama-summary-heading {display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:28px;color:#593c6a;font-size:16px;font-weight:650;line-height:1.6;}
.drama-summary-toggle {flex:0 0 auto;color:#9a76b3;font-size:11px;font-weight:500;}
.drama-reference-summary:not([open]) .drama-summary-less,
.drama-reference-summary[open] .drama-summary-more {display:none;}
.drama-summary-preview {display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;color:#816c8b;font-size:12px;font-weight:400;line-height:1.9;margin-top:7px;overflow-wrap:anywhere;}
.drama-reference-summary[open] .drama-summary-preview,.drama-summary-preview:empty {display:none;}
.drama-reference-summary>p {color:#75617e;font-size:12px;line-height:1.95;margin:9px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;}
.drama-reference-summary>summary:focus-visible {outline:2px solid #b28dce;outline-offset:5px;border-radius:7px;}

/* Keep the unchanged episode markup and prices; tighten only its presentation. */
.drama-detail>.drama-detail-selection {padding:17px 14px;margin:18px 0;border:0;border-radius:16px;}
.drama-detail-selection>.drama-episodes {grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:13px 0 0;}
.drama-detail-selection .drama-episode {align-items:center;gap:4px;min-height:76px;padding:9px 6px;border:0;border-radius:10px;background:#f3ecfb;box-shadow:none;text-align:center;}
.drama-detail-selection .drama-episode>strong {font-size:12px;line-height:1.5;}
.drama-detail-selection .drama-episode>small {display:block;max-width:100%;font-size:9px;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.drama-detail-selection .drama-access {max-width:100%;padding:2px 5px;font-size:9px;line-height:1.5;}
.drama-detail-selection .drama-episode:is([aria-current=true],.is-current) {background:#e4d3f6;}

/* Matches the actual drama-comments controller; an unmounted host stays empty. */
.drama-detail>.drama-comments {padding:18px 16px;margin:18px 0;border:0;border-radius:16px;background:#f4edfc;color:#573b67;}
.drama-detail>.drama-comments:empty {display:none;}
.drama-comments-heading {display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;}
.drama-comments-heading>h2 {margin:0;color:#573b67;font-size:17px;font-weight:650;line-height:1.6;}
.drama-comments-heading>span {color:#81678f;font-size:10px;line-height:1.6;}
.drama-comments-list {display:grid;gap:10px;}
.drama-comments .drama-comment {padding:13px 12px;border:0;border-radius:12px;background:#fffafc;}
.drama-comment-heading {display:flex;align-items:center;gap:9px;margin-bottom:9px;}
.drama-comment-avatar {display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;object-fit:cover;border-radius:50%;background:#e5d6f4;color:#8861a3;font-size:12px;font-weight:600;}
.drama-comment-by {min-width:0;}
.drama-comment-by>strong {display:block;color:#6b4c7f;font-size:11px;font-weight:600;line-height:1.6;overflow-wrap:anywhere;}
.drama-comment-by>time {display:block;color:#7d648a;font-size:9px;line-height:1.6;}
.drama-comment>.drama-comment-text {color:#786385;font-size:12px;line-height:1.85;margin:0;white-space:pre-wrap;overflow-wrap:anywhere;}
.drama-comment>.drama-comment-status {display:inline-block;margin-top:8px;padding:2px 6px;border-radius:4px;background:#fff0d7;color:#93703f;font-size:9px;line-height:1.6;}
.drama-comments .drama-comments-empty {padding:16px 0;color:#9c83aa;font-size:12px;line-height:1.9;text-align:center;}
.drama-comments-actions {display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;margin-top:12px;}
.drama-comments .quiet-button {min-height:44px;padding:9px 12px;border:0;border-radius:9px;background:#eae0f6;color:#86639c;font-size:11px;line-height:1.6;}
.drama-comment-form {margin-top:17px;}
.drama-comment-form>label {display:block;color:#7f658e;font-size:11px;line-height:1.8;}
.drama-comment-form textarea {display:block;width:100%;min-width:0;min-height:82px;margin-top:7px;padding:11px 12px;border:0;border-radius:10px;background:#fffbfe;color:#664d77;font:inherit;font-size:16px;line-height:1.65;resize:vertical;scroll-margin-block:88px 130px;}
.drama-comment-form textarea::placeholder {color:#856b96;}
.drama-comment-form>.primary-button {display:block;min-height:44px;margin:10px 0 0 auto;padding:10px 17px;border:0;border-radius:9px;background:#dfcdf1;color:#6c438a;box-shadow:none;font-size:12px;line-height:1.6;}
.drama-comments .drama-comments-notice {color:#7e648d;font-size:10px;line-height:1.8;margin:9px 0 0;overflow-wrap:anywhere;}
.drama-comments-notice:empty {display:none;}
@media(max-width:350px){.drama-detail>.drama-heading.drama-reference-hero{padding-left:18px;padding-right:18px}.drama-reference-layout{grid-template-columns:90px minmax(0,1fr);gap:12px}.drama-reference-hero .drama-reference-copy>h1{font-size:20px}.drama-detail>.drama-detail-selection{padding-left:12px;padding-right:12px}.drama-detail-selection>.drama-episodes{gap:6px}}