/* =====================================================================
   drama.css — KHUSUS halaman detail drama (pages/drama.php).
   ===================================================================== */
.dview { --accent: var(--cinnabar); }

.dview__hero {
    position: relative; min-height: 88svh;
    display: flex; align-items: flex-end;
    padding-bottom: clamp(2rem, 8vh, 5rem);
    overflow: hidden;
}
.dview__bg {
    position: absolute; inset: 0; width: 100%; height: 116%;
    object-fit: cover; transform: scale(1.08); z-index: -1;
}
.dview__veil {
    position: absolute; inset: 0; z-index: -1;
    background:
        radial-gradient(100% 80% at 25% 100%, color-mix(in srgb, var(--accent) 40%, transparent), transparent 55%),
        linear-gradient(180deg, color-mix(in srgb, var(--ink-900) 40%, transparent), transparent 25%, var(--ink-900) 95%);
}
.dview__back { display: inline-block; margin-bottom: 1.6rem; color: var(--text-on-ink-dim); font-size: var(--step-sm); transition: color .3s; }
.dview__back:hover { color: var(--gold); }
.dview__title { font-size: var(--step-2xl); }
.dview__cn { font-family: var(--font-cn); font-size: var(--step-xl); color: var(--gold-soft); margin-top: .2rem; }
.dview__rating { margin-top: 1.2rem; font-family: var(--font-display); font-size: var(--step-md); color: var(--text-on-ink-dim); }
.dview__rating span { font-size: var(--step-xl); color: var(--gold); }

.dview__body { max-width: 70ch; padding-top: clamp(3rem, 8vh, 6rem); }
.dview__quote { font-family: var(--font-display); font-style: italic; font-size: var(--step-xl); color: var(--gold-soft); line-height: 1.25; margin-bottom: 1.6rem; }
.dview__synopsis { color: var(--text-on-ink); font-size: var(--step-md); margin-bottom: 2rem; }
.dview__tags { display: flex; gap: .7rem; flex-wrap: wrap; margin-bottom: 2.4rem; }
.tag {
    font-size: var(--step-xs); letter-spacing: .08em; text-transform: uppercase;
    padding: .5em 1.1em; border-radius: 100px;
    border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent);
    color: var(--text-on-ink); transition: background .35s var(--ease), color .35s;
}
.tag:hover { background: var(--accent); color: var(--paper); }