/* Rangooo series pages, "streaming" look: dark stage, big posters, episode rows, play-style buttons.
   Used by the Ramayana pages (native .ot-* markup) and, through body.ott, by the Diwali and Panchatantra pages. */
body.ott{
  --bg:#0A0D12;--ink:#F4F1EA;--muted:#A9B1BE;--line:#232B37;--accent:#F4A340;--accent-2:#E08A1E;--soft:#171F2A;--mark:#F4A340;--mark-soft:#2B2113;--warm:#F4A340;
  --sh:0 12px 32px rgba(0,0,0,.5);--surf:#121821;--surf-2:#18202B;--text:#D3D9E2;
  --rg-bg:#0A0D12;--rg-surface:#121821;--rg-ink:#F4F1EA;--rg-muted:#A9B1BE;--rg-line:#232B37;--rg-accent:#F4A340;--rg-accent-2:#E08A1E;--rg-soft:#171F2A;
  background:#0A0D12!important;color:var(--ink);color-scheme:dark}
html:has(body.ott){background:#0A0D12}

/* ---------- shared header, footer and tab bar ---------- */
body.ott .sh{background:rgba(10,13,18,.88);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid #1C232D}
body.ott .sh-nav a{color:#B4BBC7}body.ott .sh-nav a:hover{color:#fff;background:#1A222D}
body.ott .sh-nav a[aria-current="page"]{color:#fff}body.ott .sh-nav a[aria-current="page"]::after{background:#F4A340}
body.ott .sh-lang summary{background:#141B25;border-color:#2A3340;color:#F4F1EA}
body.ott .sh-menu{background:#141B25;border-color:#2A3340;box-shadow:0 18px 44px rgba(0,0,0,.6)}
body.ott .sh-menu a{color:#F4F1EA}body.ott .sh-menu a:hover{background:#1D2632}body.ott .sh-menu a[aria-current]{background:#2B2113;color:#F4A340}
body.ott .sh-cta{background:#F4A340;color:#1A1208;box-shadow:0 6px 18px rgba(244,163,64,.25)}body.ott .sh-cta:hover{background:#E08A1E}
body.ott .sh-tab{background:rgba(10,13,18,.95);border-top-color:#1C232D}
body.ott .sh-tab a{color:#9AA3B0}body.ott .sh-tab a[aria-current="page"]{color:#F4A340}
@media (max-width:960px){body.ott .sh-menu::before{background:#2A3340}body.ott .sh-menu a{border-color:#2A3340}}
body.ott footer.sf{background:#0D1117;color:#9AA3B0}
body.ott .sf-col h2{color:#F4F1EA}body.ott .sf-col a,body.ott .sf-brand p{color:#9AA3B0}body.ott .sf-col a:hover{color:#F4A340}
body.ott .sf-langs a{border-color:#2A3340}body.ott .sf-langs a[aria-current]{border-color:#F4A340;color:#F4A340}
body.ott .sf-cta{background:#F4A340;color:#1A1208!important}body.ott .sf-cta:hover{background:#E08A1E}
body.ott .sf-base{border-top-color:#1C232D}

/* ---------- shared bits ---------- */
body.ott .wrap{max-width:1200px}
body.ott .wrap.ot{margin:0 auto;padding:0 20px 24px}
@media (max-width:860px){body.ott .wrap.ot{padding:0 14px 24px}}
body.ott .crumb,body.ott .crumb a{color:#9AA3B0}
body.ott h1{font:500 clamp(36px,5.6vw,64px)/1.04 var(--head,'Fraunces',Georgia,serif);letter-spacing:-.02em;color:#fff;text-wrap:balance}
body.ott h2{color:#fff}
body.ott .pill,body.ott .ot-pill{display:inline-flex;align-items:center;gap:8px;background:rgba(244,163,64,.14);color:#F7C27C;border:1px solid rgba(244,163,64,.28);border-radius:999px;padding:6px 14px;font-size:13px;font-weight:600;letter-spacing:.01em}
body.ott .pill i{background:#F4A340}
body.ott a{color:#F7C27C}

/* ---------- Ramayana (native markup) ---------- */
.ot-hero{position:relative;margin:14px 0 8px;border-radius:28px;overflow:hidden;isolation:isolate;background:#0F141C}
.ot-hero::before{content:"";position:absolute;inset:-30px;z-index:-2;background:var(--img) center/cover;filter:blur(26px) saturate(1.2) brightness(.62)}
.ot-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(10,13,18,.92) 0%,rgba(10,13,18,.62) 48%,rgba(10,13,18,.15) 100%),linear-gradient(0deg,rgba(10,13,18,.8) 0%,transparent 40%)}
.ot-hero-in{display:flex;flex-wrap:wrap;align-items:center;gap:28px 40px;padding:44px clamp(20px,4vw,56px)}
.ot-hero-txt{flex:1 1 440px;min-width:0;max-width:640px}
.ot-hero h1{margin:16px 0 14px}
.ot-meta{display:flex;flex-wrap:wrap;gap:6px 10px;list-style:none;margin:14px 0 16px;padding:0;font-size:14px;font-weight:600;color:#E9E4D8}
.ot-meta li{display:inline-flex;align-items:center}.ot-meta li+li::before{content:"";width:4px;height:4px;border-radius:50%;background:#F4A340;margin-right:10px}
.ot-lede{font-size:18px;line-height:1.55;color:#D3D9E2;margin:0 0 24px;max-width:560px}
.ot-btns{display:flex;flex-wrap:wrap;gap:12px}.ot-btns.col{flex-direction:column;margin-top:14px}
.ot-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:12px;font:700 16px var(--ui,Inter,system-ui,sans-serif);text-decoration:none;border:1px solid transparent;cursor:pointer;transition:transform .15s,background .15s}
.ot-btn.play{background:#fff;color:#0A0D12}.ot-btn.play:hover{background:#F0E6D2;transform:scale(1.03)}
.ot-btn.ghost{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.22);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.ot-btn.ghost:hover{background:rgba(255,255,255,.24)}
.ot-fan{flex:1 1 320px;min-width:0;position:relative;height:400px;max-width:520px}
.ot-fan img{position:absolute;width:44%;height:auto;aspect-ratio:2/3;object-fit:cover;border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.12);background:#1A2230}
.ot-fan .f0{left:0;top:56px;transform:rotate(-7deg)}.ot-fan .f1{left:28%;top:0;z-index:2;width:46%}.ot-fan .f2{right:0;top:60px;transform:rotate(7deg)}
.ot-ep-hero .ot-hero-in{flex-wrap:nowrap}
.ot-ep-art{flex:0 0 min(300px,34%);min-width:0}
.ot-ep-art img{display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:cover;border-radius:18px;box-shadow:0 24px 60px rgba(0,0,0,.65);border:1px solid rgba(255,255,255,.14);background:#1A2230}
.ot-sec{padding:26px 0 18px}
.ot-sec-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0 2px 14px}
.ot-sec-h h2{margin:0;font:700 clamp(20px,2.6vw,26px)/1.2 var(--ui,Inter,system-ui,sans-serif);letter-spacing:-.01em}
.ot-sec-h span{font-size:14px;color:#9AA3B0}
.ot-row{display:flex;gap:16px;list-style:none;margin:0;padding:6px 2px 18px;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#2A3340 transparent}
.ot-card{flex:0 0 clamp(150px,19vw,232px);scroll-snap-align:start}
.ot-card.wide{flex-basis:clamp(190px,24vw,260px)}
.ot-card a{display:block;text-decoration:none;color:inherit;border-radius:16px}
.ot-poster{position:relative;display:block;aspect-ratio:2/3;border-radius:16px;overflow:hidden;background:#161D28;border:1px solid #232B37;box-shadow:0 10px 26px rgba(0,0,0,.45);transition:transform .2s ease,box-shadow .2s ease,border-color .2s}
.ot-card.wide .ot-poster{aspect-ratio:3/4}
.ot-card a:hover .ot-poster,.ot-card a:focus-visible .ot-poster{transform:translateY(-6px) scale(1.035);box-shadow:0 22px 48px rgba(0,0,0,.65);border-color:#F4A340}
.ot-poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ot-card.wide .ot-poster img{object-position:50% 50%}
.ot-poster::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,8,12,.94) 0%,rgba(6,8,12,.5) 34%,transparent 62%)}
.ot-ep{position:absolute;z-index:2;left:10px;top:10px;background:#F4A340;color:#1A1208;border-radius:7px;padding:3px 8px;font:800 11px/1.3 var(--ui,Inter,sans-serif);letter-spacing:.06em}
.ot-cap{position:absolute;z-index:2;left:12px;right:12px;bottom:12px;display:flex;flex-direction:column;gap:3px}
.ot-cap b{font:700 clamp(15px,1.5vw,17px)/1.25 var(--ui,Inter,sans-serif);color:#fff;text-wrap:balance}
.ot-cap small{font-size:12px;color:#C9D0DA}
.ot-about{background:var(--surf);border:1px solid var(--line);border-radius:20px;padding:22px 24px;max-width:820px}
.ot-about h2{font:700 20px var(--ui,Inter,sans-serif);margin:0 0 8px}.ot-about p{margin:0 0 10px;color:var(--text);line-height:1.65}
.ot-credit{font-size:13px;color:#8B94A1!important}.ot-credit-end{text-align:center;margin:4px 0 24px}
.ot-link{display:inline-block;margin-top:6px;font-weight:600;color:#F4A340!important;text-decoration:none}.ot-link:hover{text-decoration:underline}
.ot-rel-h{font:600 16px var(--ui,Inter,sans-serif);margin:18px 0 0}.ot-rel{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:0 20px}.ot-rel a,.ot-relp a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:#F4A340;text-decoration:none}.ot-rel a:hover,.ot-relp a:hover{text-decoration:underline}.ot-relp{margin:10px 0 0;line-height:1.7}.ot-relp a{display:inline;min-height:0}
/* episode: story + colouring sheet */
.ot-two{display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start;padding:24px 0 8px}
.ot-story{flex:1 1 460px;min-width:0;max-width:700px;scroll-margin-top:84px}
.ot-pages{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:14px}
.ot-pages li{display:flex;gap:16px;align-items:flex-start;background:var(--surf);border:1px solid var(--line);border-radius:18px;padding:18px 20px}
.ot-pg{flex:0 0 34px;height:34px;border-radius:50%;background:#2B2113;color:#F4A340;display:flex;align-items:center;justify-content:center;font:800 15px var(--ui,Inter,sans-serif)}
.ot-pages p{margin:0;font-size:clamp(18px,2vw,20px);line-height:1.7;color:#E8E4DA}
.ot-moral{background:linear-gradient(135deg,#2B2113,#1B1610);border:1px solid #4A3719;border-radius:18px;padding:18px 22px;margin:6px 0 14px}
.ot-moral b{display:block;font:800 12px var(--ui,Inter,sans-serif);letter-spacing:.1em;text-transform:uppercase;color:#F4A340;margin-bottom:6px}
.ot-moral span{font:500 clamp(20px,2.4vw,24px)/1.4 var(--head,'Fraunces',Georgia,serif);color:#FFF4DE}
.ot-ask{background:var(--surf-2);border-radius:14px;padding:14px 18px;font-size:16px;color:var(--text);line-height:1.6}.ot-ask b{color:#F4A340}
.ot-prevnext{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:22px}
.ot-prevnext a{flex:1 1 220px;display:block;padding:14px 18px;border-radius:14px;background:var(--surf);border:1px solid var(--line);color:#F4F1EA!important;text-decoration:none;font-weight:600;font-size:15px}
.ot-prevnext a:hover{border-color:#F4A340}.ot-prevnext a[rel=next]{text-align:right}
.ot-side{flex:1 1 300px;min-width:0;max-width:400px;position:sticky;top:84px}
.ot-sheet{background:var(--surf);border:1px solid var(--line);border-radius:20px;padding:16px}
.ot-sheet h2{font:700 16px var(--ui,Inter,sans-serif);margin:0 0 10px}
.ot-sheet img{display:block;width:100%;height:auto;border-radius:12px;background:#fff}
@media (max-width:860px){
  .ot-hero-in{padding:28px 18px}.ot-hero{border-radius:20px}
  .ot-fan{height:290px;order:-1;flex-basis:100%;max-width:none}
  .ot-ep-hero .ot-hero-in{flex-wrap:wrap}.ot-ep-art{flex:0 0 150px}
  .ot-side{position:static;max-width:none;flex-basis:100%}
  .ot-btn{flex:1 1 auto;min-height:50px;padding:0 18px}
  .ot-pages li{padding:14px 14px}
  .ot-card{flex-basis:clamp(138px,40vw,200px)}
}

/* ---------- Diwali page and Panchatantra pages (their own markup, dark skin) ---------- */
body.ott .lede,body.ott .band p,body.ott .sub{color:#C5CCD6}
body.ott .hero,body.ott .hhero{position:relative;background:radial-gradient(ellipse at 20% 0%,rgba(244,163,64,.14),transparent 60%),radial-gradient(ellipse at 90% 100%,rgba(229,72,123,.1),transparent 55%);border:1px solid #1C232D;border-radius:28px;padding:36px clamp(18px,3vw,40px)!important;margin-top:14px;margin-bottom:22px}
body.ott .btn.pri,body.ott .btn.pri:hover{background:#fff;color:#0A0D12;border-color:#fff;box-shadow:none}
body.ott .btn.pri:hover{background:#F0E6D2}
body.ott .btn.out,body.ott .btn{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.2)}
body.ott .btn.out:hover,body.ott .btn:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.3)}
body.ott .facts,body.ott .facts b{color:#B4BBC7}body.ott .facts b{color:#fff}
body.ott .art img,body.ott .fan img{border:1px solid rgba(255,255,255,.14);box-shadow:0 24px 54px rgba(0,0,0,.6)}
body.ott .tab{background:#121821;color:#E8E4DA;border-color:#232B37}
body.ott .tab[aria-selected="true"]{background:#F4A340;color:#1A1208;border-color:#F4A340}
body.ott .day,body.ott .card,body.ott .band,body.ott details,body.ott .sheet,body.ott .about,body.ott .moral,body.ott .story .txt p.pz{background:var(--surf);border-color:var(--line);box-shadow:none;color:var(--text)}
body.ott .band .r{background:#171F2A}
body.ott .day p,body.ott .two p,body.ott .two li,body.ott .about p,body.ott .story .txt p,body.ott .card p{color:#DDE2EA}
body.ott .card .pic{background:#0F141C;border-bottom-color:var(--line)}
body.ott .day .pic img,body.ott .card .pic img,body.ott .sheet img{border-color:var(--line)}
body.ott .card span,body.ott .card .bd span{color:#9AA3B0}
body.ott .card{transition:transform .2s ease,box-shadow .2s,border-color .2s}
body.ott .card:hover{transform:translateY(-6px) scale(1.02);border-color:#F4A340;box-shadow:0 22px 48px rgba(0,0,0,.6)}
body.ott .grid a:hover{color:inherit}
body.ott .chip{background:rgba(244,163,64,.14);color:#F7C27C}
body.ott .ask{background:#2B2113;color:#F2D3A1}body.ott .ask b{color:#F4A340}
body.ott .moral{border:1px solid #4A3719;background:linear-gradient(135deg,#2B2113,#1B1610)}body.ott .moral b{color:#F4A340}body.ott .moral span{color:#FFF4DE}
body.ott .meta li{background:#151C26;border-color:#2A3340;color:#E8E4DA}
body.ott .pill.for{background:rgba(244,163,64,.14);color:#F7C27C}
body.ott .chips a{background:#121821;border-color:#232B37;color:#F4F1EA}body.ott .chips a:hover{border-color:#F4A340}
body.ott summary{color:#fff}body.ott details{border-radius:14px}
body.ott .namerow input,body.ott .nm input{background:#0F141C;border-color:#2A3340;color:#fff}
body.ott .gseg label{background:#121821;border-color:#2A3340;color:#E8E4DA}
body.ott .book{box-shadow:0 22px 44px rgba(0,0,0,.55)}
body.ott .cta{color:#F4A340}
body.ott .ribbon,body.ott .rib{color:#1A1A1A}
body.ott [class*="sh-"] img.logo-dark{display:none}
@media (prefers-reduced-motion:reduce){.ot-poster,.ot-btn,body.ott .card{transition:none}.ot-card a:hover .ot-poster,body.ott .card:hover{transform:none}}

/* ---------- Panchatantra episode pages: the child's name box, the ribbon on the sheet, the grandmother's lines ---------- */
.pill[hidden]{display:none!important}
.ot-note{margin:0 0 14px;padding:12px 16px;border-left:3px solid #F4A340;border-radius:0 12px 12px 0;background:#171F2A;color:#F7C27C;font-style:italic;font-size:clamp(17px,1.9vw,19px);line-height:1.6}
.ot-story .pill.for{margin:0 0 14px}
.ot-sheet .nm{display:block;margin:0 0 4px}.ot-sheet .nm span{display:block;font-weight:600;font-size:14px;margin-bottom:6px;color:#E8E4DA}
.ot-sheet .nm input{box-sizing:border-box;width:100%;min-height:46px;border:1px solid #2A3340;border-radius:12px;padding:0 14px;font:500 16px var(--ui,Inter,system-ui,sans-serif);color:#fff;background:#0F141C}
.ot-sheet .nm input:focus{outline:2px solid #F4A340;outline-offset:1px}
.ot-sheet .hint{margin:6px 0 12px;font-size:13px;color:#9AA3B0}
.ot-sheet .pic{position:relative}
.ot-sheet .rib{position:absolute;left:25%;right:25%;top:90.4%;height:4%;display:flex;align-items:center;justify-content:center;font:700 clamp(11px,2.4vw,17px)/1 var(--ui,Inter,system-ui,sans-serif);color:#1A1A1A;pointer-events:none;overflow:hidden;white-space:nowrap}
.ot-lede+.ot-lede{font-size:15px;color:#A9B1BE;margin-top:-12px}
body.ott .band p b{color:#fff!important}