---
title: DramaBox Clone Features
description: 
url: https://miracuves.com/dramabox-clone/features
date_modified: 2026-08-14
author: miracuves
language: en_US
---

.mcv-dbf{
    --crimson:#e8344f; --crimson-deep:#a70d2a; --crimson-hot:#d81b46; --crimson-light:#ff8090;
    --amber:#fbbf24; --black:#0a0a0a; --white:#ffffff; --paper:#faf8f8; --ink:#191419; --ink-dim:#6d666d;
    --line:rgba(11,11,16,0.1); --line-light:rgba(255,255,255,0.12);
    --card-bg:rgba(8,3,8,0.82);
    font-family:'Plus Jakarta Sans',Arial,sans-serif; color:var(--ink); background:var(--white); margin:0; padding:0;
  }
  .mcv-dbf *{ box-sizing:border-box; }
  .mcv-dbf h1,.mcv-dbf h2,.mcv-dbf h3{ font-family:'Plus Jakarta Sans',Arial,sans-serif; font-weight:800; margin:0; letter-spacing:-0.02em; line-height:1.12; }
  .mcv-dbf p{ margin:0 0 14px; line-height:1.7; color:var(--ink); }
  .mcv-dbf a{ color:var(--crimson); text-decoration:none; }
  .mcv-dbf .mono{ font-family:'JetBrains Mono',monospace; }
  .mcv-dbf-wrap{ max-width:1180px; margin:0 auto; padding:0 24px; position:relative; z-index:2; }
  .mcv-dbf-bleed{ position:relative; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw; width:100vw; }

  .mcv-seo-ref{ background:#FFF7E0; border:2px dashed #C79A00; padding:18px 22px; font-family:Arial,sans-serif; font-size:13px; color:#4A3B00; max-width:1180px; margin:18px auto; border-radius:8px; }

  .mcv-dbf-crumb{ display:flex; gap:8px; align-items:center; font-family:'JetBrains Mono',monospace; font-size:11.5px; color:rgba(255,255,255,.45); margin-bottom:20px; }
  .mcv-dbf-crumb a{ color:rgba(255,255,255,.45); }
  .mcv-dbf-crumb a:hover{ color:var(--crimson-light); }
  .mcv-dbf-crumb span.sep{ opacity:.5; }
  .mcv-dbf-crumb span.cur{ color:rgba(255,255,255,.75); }

  .mcv-dbf-eyebrow{ display:inline-flex; align-items:center; gap:8px; padding:7px 16px; border-radius:100px; background:rgba(255,255,255,.06); border:1px solid var(--line-light); font-family:'JetBrains Mono',monospace; font-size:11.5px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--crimson-light); margin-bottom:22px; }
  .mcv-dbf-eyebrow .dot{ width:6px; height:6px; border-radius:50%; background:var(--crimson); }

  .mcv-dbf-hero{ background:radial-gradient(ellipse 900px 500px at 85% -10%, rgba(232,52,79,.16), transparent), #0a0a0a; color:#fff; padding:56px 0 150px; position:relative; overflow:hidden; }
  .mcv-dbf-hero .ring{ position:absolute; border:2px solid rgba(232,52,79,.18); border-radius:50%; pointer-events:none; }
  .mcv-dbf-hero .ring1{ width:560px; height:560px; top:-260px; right:-200px; }
  .mcv-dbf-hero .ring2{ width:340px; height:340px; bottom:-200px; right:120px; border-color:rgba(232,52,79,.1); }
  .mcv-dbf-herogrid{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:48px; align-items:center; }
  .mcv-dbf-hero h1{ font-size:clamp(27px,3.9vw,44px); color:#fff; }
  .mcv-dbf-hero h1 em{ font-style:normal; color:#ff8090; }
  .mcv-dbf-hero p.sub{ font-size:16px; color:rgba(255,255,255,.68); max-width:600px; margin:20px 0 30px; }

  .mcv-dbf a.mcv-dbf-btn{ display:inline-flex; align-items:center; gap:8px; border-radius:12px; background:linear-gradient(160deg,#d81b46,#e8344f); color:#fff; font-weight:700; font-size:15px; padding:15px 28px; box-shadow:0 10px 30px rgba(232,52,79,.3); transition:transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s; }
  .mcv-dbf a.mcv-dbf-btn:hover{ color:#fff; transform:translateY(-2px); box-shadow:0 14px 36px rgba(232,52,79,.42); text-decoration:none; }
  .mcv-dbf a.mcv-dbf-btn-outline{ display:inline-flex; align-items:center; border:2px solid rgba(255,255,255,.7); color:#fff; border-radius:12px; font-weight:700; font-size:15px; padding:13px 26px; margin-left:12px; transition:all .2s; }
  .mcv-dbf a.mcv-dbf-btn-outline:hover{ background:#fff; color:#191419; text-decoration:none; }

  .mcv-dbf-trust{ display:flex; flex-wrap:wrap; gap:22px; margin-top:34px; padding-top:24px; border-top:1px solid var(--line-light); }
  .mcv-dbf-trust-item{ display:flex; align-items:center; gap:8px; font-size:12.5px; color:rgba(255,255,255,.6); }
  .mcv-dbf-trust-item strong{ font-family:'JetBrains Mono',monospace; color:#fff; font-size:14px; }

  .mcv-dbf-cardstack{ position:relative; height:340px; }
  .mcv-dbf-fincard{ position:absolute; width:300px; height:180px; border-radius:18px; padding:22px; background:linear-gradient(150deg,#1c1418,#0d0709); border:1px solid var(--line-light); box-shadow:0 30px 70px rgba(0,0,0,.5); }
  .mcv-dbf-fincard.c1{ top:0; left:10px; z-index:1; opacity:.5; transform:rotate(-6deg) scale(.92); }
  .mcv-dbf-fincard.c2{ top:30px; left:40px; z-index:2; background:linear-gradient(150deg,#3a0a15,#160408 60%,#0a0a0a); border-color:rgba(232,52,79,.3); box-shadow:0 40px 90px rgba(0,0,0,.55), 0 0 60px -12px rgba(232,52,79,.35); }
  .mcv-dbf-fincard .brand{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.55); }
  .mcv-dbf-fincard .chip{ width:34px; height:24px; border-radius:5px; background:linear-gradient(135deg,#ff8090,#e8344f); margin:22px 0 18px; }
  .mcv-dbf-fincard .num{ font-family:'JetBrains Mono',monospace; font-size:15px; color:#fff; letter-spacing:.1em; }
  .mcv-dbf-fincard .curr{ position:absolute; bottom:22px; right:22px; font-family:'JetBrains Mono',monospace; font-size:11px; color:#ff8090; }
  .mcv-dbf-float{ position:absolute; background:rgba(8,3,8,0.82); border:1px solid var(--line-light); border-radius:14px; padding:12px 16px; box-shadow:0 16px 40px rgba(0,0,0,.35); z-index:3; }
  .mcv-dbf-float .k2{ font-family:'JetBrains Mono',monospace; font-size:10px; color:#ff8090; text-transform:uppercase; letter-spacing:.08em; margin-bottom:3px; }
  .mcv-dbf-float .v{ font-family:'JetBrains Mono',monospace; font-size:15px; color:#fff; font-weight:700; }
  .mcv-dbf-float-1{ top:-10px; right:0; }
  .mcv-dbf-float-2{ bottom:10px; left:0; }

  .mcv-dbf-statbar{ margin-top:-72px; position:relative; z-index:3; }
  .mcv-dbf-statbar .inner{ background:rgba(8,3,8,0.82); border:1px solid var(--line-light); border-radius:18px; box-shadow:0 24px 60px rgba(0,0,0,.35); padding:32px 20px; display:grid; grid-template-columns:repeat(4,1fr); }
  .mcv-dbf-statbar .stat{ text-align:center; padding:0 12px; border-right:1px solid var(--line-light); }
  .mcv-dbf-statbar .stat:last-child{ border-right:none; }
  .mcv-dbf-statbar .num{ font-family:'JetBrains Mono',monospace; font-weight:700; font-size:22px; color:#ff8090; }
  .mcv-dbf-statbar .lbl{ font-size:11.5px; color:rgba(255,255,255,.62); margin-top:6px; line-height:1.4; }

  .mcv-dbf-section{ padding:100px 0 76px; }
  .mcv-dbf-section.paper{ background:#faf8f8; }
  .mcv-dbf-section.tight{ padding-top:76px; }
  .mcv-dbf-head{ text-align:center; max-width:720px; margin:0 auto 48px; }
  .mcv-dbf-head .kicker{ font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:#a70d2a; margin-bottom:12px; }
  .mcv-dbf-head h2{ font-size:clamp(22px,3vw,34px); color:#191419; }
  .mcv-dbf-head p{ color:#6d666d; margin-top:14px; }

  .mcv-dbf-rolegrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
  .mcv-dbf-rolecard{ background:#fff; border:1px solid var(--line); border-radius:18px; padding:28px 24px; box-shadow:0 6px 18px rgba(0,0,0,.05); transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s, border-color .3s; }
  .mcv-dbf-rolecard:hover{ transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,.09); border-color:#e8344f; }
  .mcv-dbf-roleicon{ width:40px; height:40px; border-radius:10px; background:rgba(232,52,79,.12); border:1px solid rgba(232,52,79,.3); display:flex; align-items:center; justify-content:center; margin-bottom:16px; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:14px; color:#a70d2a; }
  .mcv-dbf-rolecard h3{ font-size:17px; margin-bottom:12px; color:#191419; }
  .mcv-dbf-rolecard ul{ margin:0; padding-left:18px; font-size:13.5px; color:#191419; }
  .mcv-dbf-rolecard li{ margin-bottom:8px; line-height:1.5; }

  .mcv-dbf-tablewrap{ overflow-x:auto; border-radius:16px; box-shadow:0 12px 34px rgba(0,0,0,.07); border:1px solid var(--line); }
  table.mcv-dbf-table{ border-collapse:collapse; width:100%; min-width:680px; background:#fff; font-size:13.5px; }
  table.mcv-dbf-table th{ background:#0a0a0a; color:#ffffff; text-align:left; padding:14px 16px; font-family:'JetBrains Mono',monospace; font-weight:600; font-size:12px; letter-spacing:.04em; text-transform:uppercase; }
  table.mcv-dbf-table td{ padding:14px 16px; border-bottom:1px solid rgba(11,11,16,0.1); vertical-align:top; color:#191419; }
  table.mcv-dbf-table td.hl{ background:rgba(232,52,79,.06); border-top:3px solid #e8344f; font-weight:600; color:#191419; }
  table.mcv-dbf-table th.hl{ background:#e8344f; color:#ffffff; }
  table.mcv-dbf-table tbody tr:hover td{ background:#f4f1f1; color:#191419; }
  table.mcv-dbf-table tbody tr:hover td.hl{ background:rgba(232,52,79,.13); color:#191419; }
  table.mcv-dbf-table tr:last-child td{ border-bottom:none; }
  .mcv-dbf-note{ font-size:12.5px; color:#6d666d; margin-top:12px; }

  .mcv-dbf-callout{ background:linear-gradient(135deg,#2B0710,#4A0F1E); color:#fff; border-radius:20px; padding:40px 44px; }
  .mcv-dbf-callout h2{ color:#fff; font-size:22px; margin-bottom:12px; }
  .mcv-dbf-callout p{ color:rgba(255,255,255,.78); font-size:14.5px; margin:0; }

  .mcv-dbf-honest{ background:#fff; border:1px solid var(--line); border-left:4px solid #fbbf24; border-radius:14px; padding:28px 30px; }
  .mcv-dbf-honest h3{ font-size:17px; margin-bottom:14px; color:#191419; }
  .mcv-dbf-honestgrid{ display:grid; grid-template-columns:1fr 1fr; gap:10px 28px; }
  .mcv-dbf-honestgrid div{ font-size:13.5px; color:#191419; line-height:1.55; padding-left:18px; position:relative; }
  .mcv-dbf-honestgrid div::before{ content:'!'; position:absolute; left:0; top:0; font-family:'JetBrains Mono',monospace; font-weight:700; color:#8a6100; }

  .mcv-dbf-cs{ background:#fff; border:1px solid var(--line); border-radius:20px; padding:32px 34px; display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; box-shadow:0 8px 24px rgba(0,0,0,.05); }
  .mcv-dbf-cs-badge{ display:inline-flex; align-items:center; gap:7px; padding:6px 14px; border-radius:100px; background:rgba(232,52,79,.08); border:1px solid rgba(232,52,79,.25); font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#a70d2a; margin-bottom:12px; }
  .mcv-dbf-cs-badge .dot{ width:6px; height:6px; border-radius:50%; background:#e8344f; }
  .mcv-dbf-cs-body{ flex:1; min-width:260px; }
  .mcv-dbf-cs-body h3{ font-size:16.5px; margin-bottom:6px; color:#191419; }
  .mcv-dbf-cs-body p{ color:#6d666d; font-size:13.5px; margin:0; max-width:460px; }
  .mcv-dbf a.mcv-dbf-cs-link{ font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:700; color:#a70d2a; white-space:nowrap; }

  .mcv-dbf-faqgrid{ display:grid; grid-template-columns:1fr 1fr; gap:0 40px; max-width:1000px; margin:0 auto; }
  .mcv-dbf-faq details{ border-bottom:1px solid var(--line); padding:18px 0; }
  .mcv-dbf-faq summary{ font-family:'Plus Jakarta Sans',Arial,sans-serif; font-weight:700; font-size:15px; color:#191419; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; }
  .mcv-dbf-faq summary::-webkit-details-marker{ display:none; }
  .mcv-dbf-faq summary::after{ content:'+'; font-family:'JetBrains Mono',monospace; color:#a70d2a; font-size:20px; font-weight:700; flex:none; }
  .mcv-dbf-faq details[open] summary::after{ content:'\2212'; }
  .mcv-dbf-faq .a{ color:#6d666d; font-size:13.5px; margin-top:10px; line-height:1.65; }

  .mcv-dbf-cta{ background:linear-gradient(120deg,#e8344f,#6e0e1f); color:#fff; padding:64px 0; position:relative; overflow:hidden; }
  .mcv-dbf-cta .ring{ position:absolute; border:2px solid rgba(255,255,255,.14); border-radius:50%; width:360px; height:360px; top:-140px; right:-100px; }
  .mcv-dbf-cta .flex{ display:flex; justify-content:space-between; align-items:center; gap:28px; flex-wrap:wrap; position:relative; z-index:2; }
  .mcv-dbf-cta h2{ color:#fff; font-size:clamp(20px,2.6vw,28px); margin-bottom:8px; }
  .mcv-dbf-cta p{ color:rgba(255,255,255,.82); margin:0; max-width:460px; }
  .mcv-dbf-cta a.mcv-dbf-btn-outline{ border-color:#fff; }
  .mcv-dbf-cta a.mcv-dbf-btn{ background:#fff; box-shadow:0 10px 30px rgba(0,0,0,.2); }
  .mcv-dbf-cta a.mcv-dbf-btn,.mcv-dbf-cta a.mcv-dbf-btn:hover{ color:#a70d2a; }

  .mcv-dbf-explore{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
  .mcv-dbf a.mcv-dbf-pill{ font-family:'JetBrains Mono',monospace; font-size:12.5px; font-weight:600; padding:10px 18px; border-radius:100px; border:1px solid var(--line); color:#191419; background:#fff; transition:all .2s; }
  .mcv-dbf a.mcv-dbf-pill:hover{ border-color:#e8344f; color:#a70d2a; text-decoration:none; }
  .mcv-dbf a.mcv-dbf-pill.cur{ background:#191419; color:#fff; border-color:#191419; }

  .mcv-dbf-finalcta{ background:#0a0a0a; color:#fff; text-align:center; padding:96px 24px 64px; position:relative; overflow:hidden; }
  .mcv-dbf-finalcta .ring{ position:absolute; border:1.5px solid rgba(232,52,79,.16); border-radius:50%; }
  .mcv-dbf-finalcta .ring1{ width:480px; height:480px; top:-220px; left:-160px; }
  .mcv-dbf-finalcta .ring2{ width:300px; height:300px; bottom:-180px; right:-90px; }
  .mcv-dbf-finalcta .card{ background:rgba(8,3,8,0.82); border:1px solid var(--line-light); border-radius:24px; padding:56px 40px; max-width:720px; margin:0 auto; position:relative; z-index:2; }
  .mcv-dbf-finalcta h2{ color:#fff; font-size:clamp(24px,3.2vw,34px); max-width:640px; margin:0 auto 14px; }
  .mcv-dbf-finalcta p.sub{ color:rgba(255,255,255,.7); max-width:520px; margin:0 auto 30px; }
  .mcv-dbf-footerbar{ max-width:1180px; margin:56px auto 0; padding-top:28px; border-top:1px solid var(--line-light); position:relative; z-index:2; }
  .mcv-dbf-byline{ display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center; font-family:'JetBrains Mono',monospace; font-size:11.5px; color:rgba(255,255,255,.55); border-bottom:1px solid rgba(255,255,255,.12); padding-bottom:16px; margin-bottom:12px; }
  .mcv-dbf-byline strong{ color:#fff; font-weight:600; }
  .mcv-dbf-byline .dotsep{ opacity:.4; }
  .mcv-dbf-footermeta{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; font-family:'JetBrains Mono',monospace; font-size:11px; color:rgba(255,255,255,.55); }

  @media (max-width:900px){
    .mcv-dbf-herogrid{ grid-template-columns:1fr; }
    .mcv-dbf-statbar .inner{ grid-template-columns:repeat(2,1fr); gap:18px 0; }
    .mcv-dbf-statbar .stat:nth-child(2){ border-right:none; }
    .mcv-dbf-rolegrid{ grid-template-columns:1fr; }
    .mcv-dbf-honestgrid{ grid-template-columns:1fr; }
    .mcv-dbf-faqgrid{ grid-template-columns:1fr; }
    .mcv-dbf-hero h1{ font-size:27px; }
    .mcv-dbf-cta .flex{ flex-direction:column; align-items:flex-start; }
    .mcv-dbf-cardstack{ height:260px; }
    .mcv-dbf-fincard{ width:250px; height:150px; }
  }
  @media (prefers-reduced-motion: reduce){ .mcv-dbf *{ animation:none !important; transition:none !important; } }
  /* --- components used by cost / company / business-model --- */
  .mcv-dbf-pricecard{ background:linear-gradient(150deg,#3a0a15,#160408 60%,#0a0a0a); border:1px solid rgba(232,52,79,.3); border-radius:22px; padding:34px 32px; box-shadow:0 40px 90px rgba(0,0,0,.55), 0 0 60px -12px rgba(232,52,79,.35); }
  .mcv-dbf-pricecard .plan{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:#ff8090; margin-bottom:14px; }
  .mcv-dbf-pricecard .amt{ font-family:'JetBrains Mono',monospace; font-size:44px; font-weight:700; color:#fff; line-height:1; }
  .mcv-dbf-pricecard .per{ font-size:13px; color:rgba(255,255,255,.6); margin-top:8px; }
  .mcv-dbf-pricecard ul{ margin:22px 0 0; padding-left:18px; color:rgba(255,255,255,.78); font-size:13.5px; }
  .mcv-dbf-pricecard li{ margin-bottom:8px; line-height:1.5; }
  .mcv-dbf-drivers{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
  .mcv-dbf-driver{ background:#fff; border:1px solid rgba(11,11,16,0.1); border-radius:18px; padding:26px 24px; box-shadow:0 6px 18px rgba(0,0,0,.05); transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s, border-color .3s; }
  .mcv-dbf-driver:hover{ transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,.09); border-color:#e8344f; }
  .mcv-dbf-driver h3{ font-size:16px; margin-bottom:10px; color:#191419; }
  .mcv-dbf-driver p{ font-size:13.5px; color:#6d666d; margin:0; }
  .mcv-dbf-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
  .mcv-dbf-step{ background:#fff; border:1px solid rgba(11,11,16,0.1); border-radius:16px; padding:24px 22px; }
  .mcv-dbf-step .n{ font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#a70d2a; margin-bottom:8px; }
  .mcv-dbf-step h3{ font-size:15.5px; margin-bottom:8px; color:#191419; }
  .mcv-dbf-step p{ font-size:13.5px; color:#6d666d; margin:0; }
  .mcv-dbf-checkgrid{ display:grid; grid-template-columns:1fr 1fr; gap:16px 28px; }
  .mcv-dbf-check{ background:#fff; border:1px solid rgba(11,11,16,0.1); border-radius:14px; padding:20px 22px; }
  .mcv-dbf-check h3{ font-size:15px; margin-bottom:8px; color:#191419; }
  .mcv-dbf-check p{ font-size:13.5px; color:#6d666d; margin:0; }
  .mcv-dbf-flags{ display:grid; grid-template-columns:1fr 1fr; gap:14px 28px; }
  .mcv-dbf-flag{ font-size:13.5px; color:#191419; line-height:1.55; padding-left:22px; position:relative; }
  .mcv-dbf-flag::before{ content:'\2715'; position:absolute; left:0; top:0; font-family:'JetBrains Mono',monospace; font-weight:700; color:#a70d2a; }
  .mcv-dbf-pt{ background:radial-gradient(ellipse 800px 400px at 20% 0%, rgba(232,52,79,.14), transparent), #0a0a0a; color:#fff; padding:92px 0 84px; }
  .mcv-dbf-pt .mcv-dbf-head h2{ color:#fff; }
  .mcv-dbf-pt .mcv-dbf-head p{ color:rgba(255,255,255,.68); }
  .mcv-dbf-ptgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
  .mcv-dbf-ptcard{ background:rgba(8,3,8,0.82); border:1px solid rgba(255,255,255,0.12); border-radius:18px; padding:26px 24px; }
  .mcv-dbf-ptcard h3{ font-size:15.5px; color:#fff; margin-bottom:10px; }
  .mcv-dbf-ptcard p{ font-size:13.5px; color:rgba(255,255,255,.72); margin:0; }
  .mcv-dbf-ptcard .tag{ display:inline-block; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:#ff8090; border:1px solid rgba(232,52,79,.35); border-radius:100px; padding:3px 10px; margin-bottom:12px; }
  .mcv-dbf-csbox{ background:#fff; border:1px solid rgba(11,11,16,0.1); border-radius:22px; padding:40px 42px; box-shadow:0 12px 34px rgba(0,0,0,.06); }
  .mcv-dbf-csmeta{ display:flex; flex-wrap:wrap; gap:26px; margin:22px 0 26px; padding:20px 0; border-top:1px solid rgba(11,11,16,0.1); border-bottom:1px solid rgba(11,11,16,0.1); }
  .mcv-dbf-csmeta div{ font-size:13px; color:#6d666d; }
  .mcv-dbf-csmeta strong{ display:block; font-family:'JetBrains Mono',monospace; font-size:18px; color:#191419; margin-bottom:2px; }
  .mcv-dbf-cscols{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
  .mcv-dbf-cscols h4{ font-size:13px; font-family:'JetBrains Mono',monospace; letter-spacing:.08em; text-transform:uppercase; color:#a70d2a; margin:0 0 10px; }
  .mcv-dbf-cscols ul{ margin:0; padding-left:18px; font-size:13.5px; color:#191419; }
  .mcv-dbf-cscols li{ margin-bottom:8px; line-height:1.5; }
  .mcv-dbf-quote{ margin-top:28px; padding:24px 26px; background:#faf8f8; border-left:3px solid #e8344f; border-radius:0 12px 12px 0; }
  .mcv-dbf-quote p{ font-size:15px; font-style:italic; color:#191419; margin:0 0 10px; }
  .mcv-dbf-quote .who{ font-family:'JetBrains Mono',monospace; font-size:12px; color:#6d666d; font-style:normal; }
  .mcv-dbf-revgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
  .mcv-dbf-revcard{ background:#fff; border:1px solid rgba(11,11,16,0.1); border-radius:18px; padding:28px 24px; box-shadow:0 6px 18px rgba(0,0,0,.05); transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s, border-color .3s; }
  .mcv-dbf-revcard:hover{ transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,.09); border-color:#e8344f; }
  .mcv-dbf-revcard .n{ font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#a70d2a; margin-bottom:10px; }
  .mcv-dbf-revcard h3{ font-size:16.5px; margin-bottom:10px; color:#191419; }
  .mcv-dbf-revcard p{ font-size:13.5px; color:#6d666d; margin:0; }
  .mcv-dbf-revcard .core{ display:inline-block; margin-top:14px; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:#a70d2a; background:rgba(232,52,79,.08); border:1px solid rgba(232,52,79,.25); border-radius:100px; padding:3px 10px; }
  .mcv-dbf-aside{ background:#fff; border:1px solid rgba(11,11,16,0.1); border-left:4px solid #fbbf24; border-radius:14px; padding:28px 30px; }
  .mcv-dbf-aside h3{ font-size:17px; margin-bottom:12px; color:#191419; }
  .mcv-dbf-aside ul{ margin:0; padding-left:20px; font-size:13.5px; color:#191419; }
  .mcv-dbf-aside li{ margin-bottom:10px; line-height:1.55; }
  .mcv-dbf-disclose{ background:#faf8f8; border:1px dashed rgba(11,11,16,0.1); border-radius:14px; padding:26px 28px; max-width:860px; margin:0 auto; }
  .mcv-dbf-disclose h3{ font-size:16px; margin-bottom:10px; color:#191419; }
  .mcv-dbf-disclose p{ font-size:13.5px; color:#6d666d; margin:0 0 10px; }
  .mcv-dbf-disclose p:last-child{ margin-bottom:0; }
  .mcv-dbf-callout .figs{ display:flex; flex-wrap:wrap; gap:32px; margin-top:22px; padding-top:20px; border-top:1px solid rgba(255,255,255,0.12); }
  .mcv-dbf-callout .figs div{ font-size:12.5px; color:rgba(255,255,255,.65); }
  .mcv-dbf-callout .figs strong{ display:block; font-family:'JetBrains Mono',monospace; font-size:20px; color:#fff; margin-bottom:3px; }
  @media (max-width:900px){
    .mcv-dbf-drivers,.mcv-dbf-steps,.mcv-dbf-checkgrid,.mcv-dbf-flags,.mcv-dbf-ptgrid,.mcv-dbf-cscols,.mcv-dbf-revgrid{ grid-template-columns:1fr; }
    .mcv-dbf-csbox{ padding:28px 24px; }
  }

  
    
    
      
        
          
            [Home](/)/[DramaBox Clone](/dramabox-clone/)/Features
          
          DramaBox Clone · Features
          
# DramaBox Clone Features: One Catalog, Many Markets

          
Most short-drama platforms can serve one language well. This one is built so that opening a second market is a console job rather than a release - five locales, right-to-left on every surface, and interface copy the operator owns. Here is every capability, grouped by who touches it.

          [Request a Live Demo →](/dramabox-clone/)[See Pricing](/dramabox-clone/development-cost/)
          
            **5** locales, RTL included
            **3** clients, one API
            **6 days** to deploy
          
        
        
          Localear · RTL
          APP LANGUAGE JSONen · he · hi · ar · es
          EDITED IN CONSOLENO REBUILD REQUIREDone catalog, many markets
          Payment Railper market
        
      
    
  

  
    
      
        5Locales, Two of Them Right-to-Left
        33Mongoose Models on MongoDB
        202Registered API Handlers
        24Permission Modules
      
    
  

  
    
      
        By Role
        
## Feature Set by Role

        
Every capability grouped by who actually touches it - the viewer in whichever language they arrived in, the wallet deciding whether an episode opens, and the operator running catalog, copy and economy across markets.

      
      
        
          V
          
### Viewer & Player

          
- Vertical episode player with sequential play
- Language picker on the consumer web app
- Right-to-left layout for Hebrew and Arabic
- Categories, titles and numbered episodes
- Episode 0 as the trailer convention
- Banner, trending, new release and coming soon rails
- Subtitle track from a stored VTT or SRT file
- My List, likes, comments capped at 400 characters

        
        
          W
          
### Wallet, Coins & Rewards

          
- Free episode window set from one setting
- Coin unlock priced per episode
- Rewarded ad unlock with a per-title daily cap
- Reward and purchased coins tracked apart
- Spend draws reward coins first, promos carry an expiry
- Seven typed ledger codes for earn and spend
- Currency catalog with a default for checkout
- Seven day check-in ladder, referrals and bonuses

        
        
          O
          
### Operator Console

          
- App language JSON editing without a rebuild
- Series language catalog kept separate from UI copy
- Default locale set from settings
- Film category, film list and episode modules
- Drag and drop episode reorder with relocking
- Coin packs, VIP plans and order history
- Block, comment hide and report queue
- 24 permission modules across four actions

        
      
    
  

  
    
      
        Compare
        
## DramaBox vs Miracuves Clone vs Building From Scratch

        
The same capability, three different paths to get it - weighted toward what a multi-market operator actually needs.

      
      
        
| Capability | Original DramaBox | Miracuves Clone | Build From Scratch |
| --- | --- | --- | --- |
| Locale coverage | Broad, market by market | Five locales shipped: English, Hebrew, Hindi, Arabic, Spanish | One language, then a retrofit per market |
| Right-to-left layout | Yes | Hebrew and Arabic across web, store build and console | Touches every screen you have already built |
| Who owns interface copy | Internal teams | The operator, through app language JSON editing in the console | Developers, via a release, every time a string changes |
| UI copy vs content language | Separated | Series language catalog kept separate from interface copy | Commonly conflated, then painful to untangle |
| Payment rails per market | Yes | PayPlus hosted plus Stripe, Razorpay, Flutterwave and Play switches | One gateway, then an integration per territory |
| Per-episode monetization | Yes | Coins, rewarded ad and VIP window on the same episode | An entitlement model before you write a player |
| Wallet correctness | Yes | Two balance types, seven typed ledger codes, unique keys on unlock rows | Where most builds leak money or double-credit |
| Source code ownership | N/A | Full ownership, self-hosted | Full ownership (you are building it) |
| Content licensing | Held by DramaBox | Not included - you supply and license your catalog per territory | Not included - you supply and license your catalog |
| Price | N/A | $3,399 one-time | Roughly a year of engineering |

      
      
The demo catalog that ships is original seed material with royalty-free stills, not licensed third-party drama. Rights clearance is per territory, which is exactly the cost that grows when you open a second market - see [Development Cost](/dramabox-clone/development-cost/).

    
  

  
    
      
        End to End
        
## How It Works, End to End

        
Follow one viewer, in one language, from landing to paying - and then follow the operator opening the next market.

      
      
        
          1
          
### Arrive in a Language

          
- Default locale comes from settings
- Viewer can switch with the language picker
- Hebrew or Arabic flips the layout, not just the strings
- Rails, search and For You render in that locale
- Series language catalog is separate from interface copy

        
        
          2
          
### Hit the Wall, Choose a Tender

          
- Access resolved at read time from four facts
- Locked in catalog, inside the free window
- Active VIP window, or an existing unlock row
- Coins, rewarded ad and auto-unlock write the same row
- Checkout displays through the currency catalog

        
        
          3
          
### Open the Next Market

          
- Operator edits app language JSON in the console
- No rebuild and no release to change client copy
- Enable the payment rail that market expects
- Same catalog, same wallet, same ledger behind it
- Coin price and free window tuned per market

        
      
      
That third card is the difference. On most platforms a new language is an engineering ticket; here the interface strings live in the console, so the constraint becomes translation and licensing rather than release cycles.

    
  

  
    
      
        Rationale
        
## Every Feature Earns Its Place

        
Nothing here is on the list because it demos well. Each capability exists because leaving it out breaks something specific for an operator running more than one market.

      
      
        
| Capability | Why it is not optional |
| --- | --- |
| Operator-owned interface copy | Because otherwise every wording fix in Arabic is a developer ticket and a release, and a market you cannot iterate on is a market you will not grow. |
| Series language kept separate from UI language | Because a Hindi interface does not mean a Hindi catalog. Conflating them means a viewer switching language loses the titles they were watching. |
| True RTL, not a stylesheet flip | Because Hebrew and Arabic markets are underserved precisely because most platforms treat right-to-left as a CSS afterthought and it shows immediately. |
| Currency catalog with a default | Because a coin pack priced in one currency and displayed in another is the fastest way to lose a checkout. |
| Multiple payment rails | Because the gateway that works in one territory frequently does not exist in the next, and hosted checkout keeps card data out of your database either way. |
| Two balance types in one wallet | Because promotional coins and paid coins are different liabilities. Pooling them means you cannot expire a promo without confiscating money a viewer paid. |
| Seven typed ledger codes | Because "balance changed" is unanswerable when a viewer disputes a spend, and disputes arrive in every language you serve. |
| Unlock resolved at read time | Because caching entitlement is how a viewer ends up locked out of an episode they paid for on another device. |
| Unique compound keys on unlock rows | Because a double-tap on a slow connection should not charge twice, and slow connections are the norm in the markets this format grows fastest in. |

      
    
  

  
    
      
        
## The Technology Behind the Features

        
A Vite and React consumer web app served as a static single page application, a Next.js 14 operator console on its own subdomain, and a Flutter GetX store build for iOS and Android. All three talk to one Node.js and Express service running roughly 202 registered handlers across a client router and an admin router, behind nginx and PM2. State is 33 Mongoose models on MongoDB: categories, titles and numbered episodes carrying lock state and coin price; reward and purchased balances against a seven-code typed ledger; unique compound keys on the per-user unlock rows; and indexes on active titles, release date and ledger timelines. The locale provider covers five languages with right-to-left support on every surface, and the same five locale packs serve the console as serve the consumer app.

        
          **3**Clients, one API
          **33**Mongoose models
          **202**API handlers
          **5**Locale packs, shared
        
      
    
  

  
    
      
        Honest Readiness
        
## What Is Not Included in the Base Package

        
Every capability above is built and demonstrable in the live demo. These are not - and the hub says so too, because it is the kind of thing that surprises buyers otherwise.

      
      
        
### Stated against the feature, not implied away

        
          Some later Hindi, Arabic and Spanish web strings fall back to English - completing that copy is a configuration task
          Web ad unlock is a simulated timed preview, not a live ad network
          Store-build ads run through AdMob with your own unit IDs - an integration step
          Processor-side purchase verification for store and card gateways is scheduled work
          Coin cash-out is wallet architecture only - no consumer flow, payout desk or bank rails
          Password hashing currently uses reversible encryption rather than a slow hash
          Request rate limiting is not bundled
          CORS defaults open
          The client settings payload is unscoped
          Staff permissions are enforced in the console rather than on every route
        
      
      
The first item matters most if you are opening markets: the locale framework is complete and RTL is real, but the translated strings themselves are yours to finish. The last five are named in the platform's own VAPT reference as a labelled hardening backlog rather than buried, and they are closed with you at deployment.

    
  

  
    
      
        
          Development Company
          
### See how Miracuves compares to scripts, freelancers and agencies

          
The deployment process, the content-licensing reality per territory, and what to check before you hire anyone - on the Development Company page.

        
        [See the comparison →](/dramabox-clone/development-company/)
      
    
  

  
    
      
        FAQ
        
## Frequently Asked Questions

      
      
        
          
            What languages does the interface support?
            Five locales ship: English, Hebrew, Hindi, Arabic and Spanish, with right-to-left layout for Hebrew and Arabic across the consumer web app, the store build and the operator console. The console also carries an app language editor so you can change client copy without a rebuild. Some later Hindi, Arabic and Spanish web strings fall back to English, so completing that copy is a configuration task.
          
          
            Can I add a language that does not ship?
            Yes. Interface copy lives in app language JSON that the operator console edits directly, so adding a locale is a console and translation exercise rather than a code release. The two things to plan for are the translation itself and, if the language is right-to-left, checking your own added strings behave in the mirrored layout - the framework already does, but your copy is yours to verify.
          
          
            Is the catalog language the same as the interface language?
            No, and keeping them separate is deliberate. The series language catalog is held apart from interface copy, so a viewer can read the app in Arabic while watching a title in Hindi. Conflating the two is a common shortcut that breaks the moment a viewer switches language and finds their titles gone.
          
        
        
          
            How does episode unlocking actually work?
            Access is decided at read time from four facts: whether the episode is locked in the catalog, whether its number falls inside the free window, whether the viewer holds an active VIP window, and whether a per-user unlock row already exists. Coins, a rewarded ad or auto-unlock all write that same row, so the entitlement is identical however it was earned.
          
          
            Can I price differently in different markets?
            Yes, within the model. Coin price is a per-episode field and the free episode window is a setting, so both can be tuned for what a market will bear, and a currency catalog with a default drives how checkout displays. What the platform does not do out of the box is geo-detect and auto-switch pricing tiers, so running genuinely separate market pricing is an operator decision rather than an automatic one.
          
          
            Which payment gateways are supported?
            PayPlus hosted checkout is the primary path and is the strongest from a compliance angle, because the card is taken on the processor side and no card number reaches the database. Stripe, Razorpay, Flutterwave and Google Play switches also ship. Each needs your own merchant account, and for the store and card gateways adding processor side purchase verification is scheduled work.
          
        
      
    
  

  
    
    
      
        
## See it running in Arabic before you commit

Request a working demo of the catalog, the unlock paths and the console, in whichever locale matters to you.

        [See Pricing](/dramabox-clone/development-cost/)[Full Overview](/dramabox-clone/)
      
    
  

  
    
      
        Explore
        
## Explore the DramaBox Clone

      
      
        [Overview](/dramabox-clone/)
        [Features](/dramabox-clone/features/)
        [Development Cost](/dramabox-clone/development-cost/)
        [Development Company](/dramabox-clone/development-company/)
        [Business Model](/dramabox-clone/business-model/)
      
    
  

  
    
    
      
        
## Ready to launch across more than one market?

        
Deploy in 6 days with five locales, right-to-left support and operator-owned interface copy included, full source code ownership.

        [Talk to Us →](/dramabox-clone/)
      
      
        
          **Written by the Miracuves Product Team**·
          Reviewed for accuracy·
          Last updated **August 14, 2026**
        
        
          Miracuves · DramaBox Clone Solution
          Ships from the same short-drama codebase as the ReelShort Clone - one platform, two product framings