.drama-product {
 --bg:var(--bg-deep); --bg2:var(--bg-card-2); --card:var(--bg-card); --card2:var(--bg-card-2);
 --line:var(--border-card); --txt:var(--text-main); --muted:var(--text-sub); --dim:var(--text-sub);
 --acc:var(--accent); --acc2:var(--grad-2); --ok:var(--accent); --maxw:var(--max-w);
}
.drama-product * {margin:0;padding:0;box-sizing:border-box}
.drama-product a {color:var(--acc);text-decoration:none}
.drama-product img {max-width:100%;display:block}
.drama-product .drama-wrap {max-width:var(--maxw);margin:0 auto;padding:0 24px}
.drama-product .drama-hero {padding:84px 0 60px;position:relative;overflow:hidden}
.drama-product .drama-hero::before {content:"";position:absolute;top:-260px;left:50%;transform:translateX(-50%);width:900px;height:520px;background:radial-gradient(closest-side,rgba(56,189,248,.16),transparent);pointer-events:none}
.drama-product .drama-hero .drama-tag {display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);border:1px solid var(--line);background:var(--card);padding:5px 14px;border-radius:999px;margin-bottom:22px}
.drama-product .drama-hero .drama-tag .drama-pulse {width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px rgba(56,189,248,.15)}
.drama-product h1 {font-size:44px;line-height:1.25;font-weight:800;letter-spacing:.5px}
.drama-product h1 .drama-grad {background:linear-gradient(90deg,var(--grad-1),var(--grad-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.drama-product .drama-hero p.drama-sub {margin-top:18px;font-size:17px;color:var(--muted);max-width:640px}
.drama-product .drama-hero .drama-ctas {margin-top:30px;display:flex;gap:14px;flex-wrap:wrap}
.drama-product .drama-btn {display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:10px;font-size:15px;font-weight:600;border:1px solid transparent;cursor:pointer}
.drama-product .drama-btn.drama-pri {background:linear-gradient(90deg,var(--grad-1),var(--grad-2));color:#fff}
.drama-product .drama-btn.drama-ghost {border-color:var(--line);color:var(--txt);background:var(--card)}
.drama-product .drama-btn:hover {opacity:.92}
.drama-product .drama-stats {margin-top:46px;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px}
.drama-product .drama-stat {background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px}
.drama-product .drama-stat b {font-size:26px;font-weight:800;display:block}
.drama-product .drama-stat span {font-size:13px;color:var(--muted)}
.drama-product .drama-hero-shot {margin-top:54px;border-radius:16px;border:1px solid var(--line);overflow:hidden;box-shadow:var(--shadow)}
.drama-product .drama-hero-shot img {width:100%}
.drama-product .drama-hero-shot .drama-cap {font-size:12.5px;color:var(--dim);padding:10px 16px;background:var(--bg2);border-top:1px solid var(--line)}
.drama-product section {padding:78px 0;border-top:1px solid var(--line)}
.drama-product .drama-sec-head .drama-kicker {font-size:13px;font-weight:700;color:var(--acc);letter-spacing:2px;text-transform:uppercase}
.drama-product .drama-sec-head h2 {font-size:30px;font-weight:800;margin-top:8px}
.drama-product .drama-sec-head p {color:var(--muted);margin-top:10px;max-width:720px;font-size:15.5px}
.drama-product .drama-grid3 {display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;margin-top:38px}
.drama-product .drama-feat {background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px;transition:border-color .2s}
.drama-product .drama-feat:hover {border-color:var(--accent)}
.drama-product .drama-feat .drama-ico {font-size:26px}
.drama-product .drama-feat h3 {font-size:16.5px;margin:12px 0 8px}
.drama-product .drama-feat p {font-size:14px;color:var(--muted)}
.drama-product .drama-feat p code {background:var(--bg2);border:1px solid var(--line);padding:1px 6px;border-radius:5px;font-size:12.5px;color:var(--accent)}
.drama-product .drama-steps {margin-top:40px;display:grid;gap:0}
.drama-product .drama-step {display:grid;grid-template-columns:52px 1fr;gap:18px;padding:18px 0;border-bottom:1px dashed var(--line)}
.drama-product .drama-step:last-child {border-bottom:none}
.drama-product .drama-step .drama-no {width:40px;height:40px;border-radius:12px;background:var(--card2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--accent);font-size:15px}
.drama-product .drama-step h3 {font-size:16px}
.drama-product .drama-step h3 em {font-style:normal;font-size:12px;color:var(--dim);font-weight:400;margin-left:8px}
.drama-product .drama-step p {font-size:14px;color:var(--muted);margin-top:4px}
.drama-product .drama-gal {display:grid;grid-template-columns:1fr;gap:30px;margin-top:38px}
.drama-product .drama-shot {background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.drama-product .drama-shot img {width:100%;display:block;cursor:zoom-in}
.drama-product .drama-shot .drama-cap {padding:12px 16px;font-size:13.5px}
.drama-product .drama-shot .drama-cap b {display:block;font-size:14.5px}
.drama-product .drama-shot .drama-cap span {color:var(--muted);font-size:13px}
.drama-product .drama-zoom-hint {font-size:12.5px;color:var(--dim);margin-top:8px}
.drama-product .drama-lb {position:fixed;inset:0;z-index:100;background:rgba(245,248,252,.98);display:flex;flex-direction:column}
.drama-product .drama-lb-bar {display:flex;align-items:center;gap:16px;padding:10px 18px;border-bottom:1px solid var(--line);font-size:13px;color:var(--muted);flex:none}
.drama-product .drama-lb-bar .drama-sp {flex:1}
.drama-product .drama-lb-bar button {background:var(--card);border:1px solid var(--line);color:var(--txt);border-radius:8px;padding:5px 14px;font-size:13px;cursor:pointer}
.drama-product .drama-lb-body {flex:1;overflow:auto;text-align:center}
.drama-product .drama-lb-body img {max-width:100%;max-height:calc(100vh - 58px);margin:0 auto;cursor:zoom-in}
.drama-product .drama-lb-body img.full {max-width:none;max-height:none;width:auto;cursor:zoom-out}
.drama-product .drama-works-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:38px}
.drama-product .drama-work {background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.drama-product .drama-work img, .drama-product .drama-work video {width:100%;aspect-ratio:3/4;object-fit:cover;display:block;background:var(--bg-card-2)}
.drama-product .drama-work.drama-wide img, .drama-product .drama-work.drama-wide video {aspect-ratio:4/3}
.drama-product .drama-work .drama-cap {padding:11px 14px;font-size:13px;color:var(--muted)}
.drama-product .drama-work .drama-cap b {color:var(--txt);font-size:14px;display:block;margin-bottom:2px}
.drama-product .drama-films {display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;margin-top:38px}
.drama-product .drama-film {background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.drama-product .drama-film video {width:100%;aspect-ratio:5/9;object-fit:cover;display:block;background:var(--bg-card-2)}
.drama-product .drama-film .drama-cap {padding:12px 16px;font-size:13.5px;color:var(--muted)}
.drama-product .drama-film .drama-cap b {display:block;color:var(--txt);font-size:15px}
.drama-product .drama-arch {margin-top:38px;display:grid;gap:14px}
.drama-product .drama-layer {background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px}
.drama-product .drama-layer h3 {font-size:15.5px;display:flex;align-items:center;gap:10px}
.drama-product .drama-layer h3 .drama-chip {font-size:11.5px;color:var(--dim);border:1px solid var(--line);padding:1px 9px;border-radius:999px;font-weight:400}
.drama-product .drama-layer .drama-boxes {display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-top:14px}
.drama-product .drama-box {background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:10px 13px;font-size:13px;color:var(--muted)}
.drama-product .drama-box b {color:var(--txt);display:block;font-size:13.5px;margin-bottom:2px}
.drama-product .drama-arrow {text-align:center;color:var(--dim);font-size:18px;line-height:1}
.drama-product .drama-hl {margin-top:38px;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.drama-product .drama-hl .drama-feat code {display:block;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:12.5px;color:var(--text-sub);margin-top:12px;overflow-x:auto;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:pre}
.drama-product pre.drama-code {background:var(--bg-card-2);border:1px solid var(--line);border-radius:12px;padding:18px 20px;font-size:13.5px;line-height:1.9;overflow-x:auto;margin-top:26px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--text-main)}
.drama-product pre.drama-code .drama-c {color:var(--dim)}
.drama-product pre.drama-code .drama-g {color:var(--accent)}
.drama-product .drama-start-steps {margin-top:30px;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.drama-product .drama-sstep {background:var(--card);border:1px solid var(--line);border-radius:12px;padding:18px}
.drama-product .drama-sstep b {display:flex;align-items:center;gap:8px;font-size:15px}
.drama-product .drama-sstep b i {font-style:normal;width:22px;height:22px;border-radius:7px;background:var(--card2);border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-size:12px;color:var(--accent)}
.drama-product .drama-sstep p {font-size:13.5px;color:var(--muted);margin-top:8px}
.drama-product .drama-credits {border-top:1px solid var(--line);padding:40px 0 56px;color:var(--dim);font-size:13.5px}
.drama-product .drama-foot-grid {display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.drama-product .drama-foot-grid b {color:var(--muted)}
@media(max-width:760px) {
.drama-product h1 {font-size:32px}
.drama-product .drama-sec-head h2 {font-size:24px}
}


.drama-product {padding-top:var(--nav-h);background:var(--bg-deep);color:var(--text-main);}
.drama-product .drama-hero {min-height:auto;display:block;}
.drama-product .drama-hero .drama-wrap {position:relative;}
.drama-product .drama-btn {min-height:48px;box-shadow:var(--shadow);}
.drama-product section[id] {scroll-margin-top:calc(var(--nav-h) + 76px);}
.drama-product .drama-section-nav {position:sticky;top:var(--nav-h);z-index:40;background:var(--bg-card-2);border-block:1px solid var(--border-card);}
.drama-product .drama-section-nav .drama-wrap {display:flex;gap:28px;overflow-x:auto;padding-block:16px;white-space:nowrap;}
.drama-product .drama-section-nav a {font-size:14px;color:var(--text-sub);}
.drama-product .drama-section-nav a:hover {color:var(--accent);}
.drama-product .drama-preview-trigger {display:block;width:100%;padding:0;border:0;background:transparent;color:inherit;cursor:zoom-in;}
.drama-product :is(a,button):focus-visible {outline:2px solid var(--accent);outline-offset:4px;}
.drama-product .drama-lb {width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;z-index:200;}
.drama-product .drama-lb:not([open]) {display:none;}
.drama-product .drama-lb-bar {flex-wrap:wrap;}
.drama-product .drama-lb-bar button {min-height:44px;}
.drama-product .drama-grid3,.drama-product .drama-hl,.drama-product .drama-films {grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));}
.drama-product .drama-layer h3 {flex-wrap:wrap;}
.drama-product .drama-layer .drama-boxes {grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));}
@media(max-width:760px) {
 .drama-product .drama-hero {padding:48px 0;}
 .drama-product section {padding:48px 0;}
 .drama-product .drama-wrap {padding-inline:20px;}
 .drama-product .drama-hero .drama-tag {font-size:12px;}
 .drama-product .drama-step {grid-template-columns:40px minmax(0,1fr);gap:12px;}
 .drama-product .drama-step h3 em {display:block;margin-left:0;}
 .drama-product .drama-btn {justify-content:center;}
 .drama-product .drama-lb-bar .drama-sp {display:none;}
 .drama-product .drama-lb-bar button {margin-left:auto;}
}