/* ─────────────────────────────────────────────
   108 TEMPLES — Landing E
   Design language benchmarked against the
   be10x workshop page: Poppins, orange marker
   highlights, alternating black / light bands,
   chip grids, block CTAs, hard urgency.
   Content is entirely 108 Temples'.
   ───────────────────────────────────────────── */
:root{
  color-scheme: only light;

  /* be10x core palette */
  --ink:#1C1C1C;          /* headings on light */
  --ink-2:#4B4F58;        /* body grey */
  --ink-3:#69727D;        /* muted */
  --black:#1D1D1D;        /* dark band */
  --black-2:#141414;      /* deeper band */
  --black-3:#2A2A2A;      /* raised card on dark */
  --white:#FFFFFF;
  --off:#FCFCFC;          /* light band */
  --grey:#F2F5F7;         /* cool light band */
  --line:#E3E8EC;
  --line-dark:#383838;

  --orange:#FF6D07;        /* fills, marks, buttons — the brand orange */
  --orange-text:#C24800;   /* same hue, darkened for orange-on-light TEXT */
  --orange-2:#FF9933;
  --orange-deep:#D14F00;
  --yellow:#FFF015;
  --red:#FF0202;
  --green:#1E9E5A;

  --deva:"Tiro Devanagari Hindi",Georgia,serif;
  --f:"Poppins","Noto Sans Gujarati","Helvetica Neue",Arial,sans-serif;
  --wrap:1140px;
  --gut:clamp(16px,4vw,28px);
  --r:7px;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--white);color:var(--ink-2);font-family:var(--f);
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;
  padding-bottom:86px;overflow-x:hidden}
img,svg{max-width:100%}
p{margin:0}

h1,h2,h3,h4{font-family:var(--f);margin:0;line-height:1.18;font-weight:600;text-wrap:balance}
h1{font-size:clamp(2rem,5.4vw,3.2rem);color:var(--orange);letter-spacing:-.015em}
h2{font-size:clamp(1.5rem,3.6vw,2.25rem);color:var(--ink);letter-spacing:-.01em}
h3{font-size:clamp(1.05rem,2.2vw,1.3rem);color:var(--ink)}
.on-dark h2,.on-dark h3{color:var(--white)}
/* light cards keep dark headings even inside a dark band */
.plan h3,.card:not(.dark) h3,.fcol h3,.voice h3{color:var(--ink)}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
section{padding-block:clamp(42px,6vw,74px)}
.band-dark{background:var(--black);color:#C9CDD4}
.band-deep{background:var(--black-2);color:#C9CDD4}
.band-off{background:var(--off)}
.band-grey{background:var(--grey)}
.center{text-align:center}
.stack{display:flex;flex-direction:column;gap:clamp(14px,2vw,22px)}

/* the signature marker highlight */
mark{background:var(--orange);color:#fff;padding:.06em .3em;border-radius:0;
  font-weight:600;box-decoration-break:clone;-webkit-box-decoration-break:clone}
mark.y{background:var(--yellow);color:var(--ink)}
.u{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:3px}
.o{color:var(--orange);font-weight:600}
.deva{font-family:var(--deva)}
.num{font-variant-numeric:tabular-nums}

/* ── urgency strip ────────────────────────── */
.urg{background:var(--orange);color:#fff;font-size:.82rem;font-weight:500}
.urg .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:6px 16px;padding-block:9px;text-align:center}
.urg b{font-weight:700}
.urg .dot{width:7px;height:7px;border-radius:50%;background:#fff;flex:none;
  animation:blink 1.5s steps(2,start) infinite}
@keyframes blink{50%{opacity:.25}}

/* ── hero ─────────────────────────────────── */
.hero{background:var(--black);color:#C9CDD4;padding-block:clamp(28px,4vw,46px) clamp(34px,5vw,56px);
  position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:-30% -20% auto -20%;height:90%;pointer-events:none;
  background:radial-gradient(50% 46% at 50% 0%,rgba(255,109,7,.22),transparent 68%)}
.hero .wrap{position:relative}
.hero h1{text-align:center}
.hero .sub{max-width:62ch;margin:18px auto 0;text-align:center;color:#D7DBE1;
  font-size:clamp(1rem,2.1vw,1.14rem);line-height:1.65}

.ticks{list-style:none;margin:clamp(20px,3vw,28px) 0 0;padding:0;
  display:flex;flex-direction:column;gap:9px;align-items:center}
.ticks li{display:flex;gap:9px;align-items:flex-start;font-size:clamp(.84rem,1.8vw,.95rem);
  font-weight:600;letter-spacing:.01em;color:#E8EBEF;text-align:left}
.ticks svg{flex:none;width:16px;height:16px;margin-top:3px;color:var(--green)}
.ticks li.no svg{color:var(--red)}

/* icon-chip logistics grid */
.chips{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:clamp(22px,3vw,30px)}
.chip{background:var(--black-3);border:1px solid var(--line-dark);border-radius:10px;
  padding:13px 15px;display:flex;align-items:center;gap:11px;font-size:.87rem;color:#E8EBEF;font-weight:500}
.chip svg{flex:none;width:19px;height:19px;color:var(--orange)}

.herogrid{display:grid;gap:clamp(20px,3vw,34px);grid-template-columns:1fr;
  align-items:center;margin-top:clamp(26px,4vw,38px)}
@media(min-width:900px){.herogrid{grid-template-columns:1fr 1fr}}

.arrows{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:13px}
.arrows li{position:relative;padding-left:26px;font-size:.95rem;line-height:1.55;color:#D7DBE1}
.arrows li::before{content:"→";position:absolute;left:0;top:0;color:var(--orange);font-weight:600}

/* poster card, drawn not photographed */
.poster{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/3.4;
  background:linear-gradient(150deg,#2A0F06,#5A1A08 46%,#8C2A0C);
  display:flex;flex-direction:column;justify-content:space-between;padding:22px;
  box-shadow:0 26px 60px -30px rgba(0,0,0,.9)}
.poster .shards{position:absolute;inset:0;opacity:.9}
.poster .ptxt{position:relative;font-weight:700;line-height:1.12;letter-spacing:-.015em;
  font-size:clamp(1.3rem,3.2vw,1.85rem);color:#fff;text-wrap:balance}
.poster .ptxt em{font-style:normal;color:var(--yellow);display:block}
.poster .pfoot{position:relative;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.pbadge{background:var(--yellow);color:var(--ink);font-weight:700;font-size:.74rem;
  letter-spacing:.04em;padding:8px 14px;border-radius:999px}
.pmeta{color:#F3C9B4;font-size:.76rem;font-weight:500}

/* ── buttons ──────────────────────────────── */
.btn{display:inline-flex;flex-direction:column;align-items:center;gap:2px;
  background:var(--orange);color:#fff;border:0;border-radius:var(--r);cursor:pointer;
  font-family:var(--f);font-weight:600;font-size:clamp(1rem,2.2vw,1.25rem);
  padding:16px 26px;text-decoration:none;text-align:center;width:100%;max-width:520px;
  transition:transform .16s,filter .16s}
.btn:hover,.btn:focus-visible{transform:translateY(-2px);filter:brightness(1.07)}
.btn small{font-weight:500;font-size:.72rem;letter-spacing:.02em;opacity:.92}
.btn.y{background:var(--yellow);color:var(--ink)}
.btn.ghost{background:transparent;border:2px solid var(--orange);color:var(--orange)}
.btn.wide{max-width:none}
.btnrow{display:flex;flex-direction:column;align-items:center;gap:11px;margin-top:clamp(22px,3vw,30px)}
.btnnote{font-size:.82rem;color:var(--ink-3);text-align:center}
.on-dark .btnnote{color:#8E96A1}
:where(a,button,select,summary,[tabindex]):focus-visible{outline:3px solid var(--orange-2);outline-offset:3px}

/* ── price rail ───────────────────────────── */
.rail{background:var(--black-2);border-block:1px solid var(--line-dark)}
.rail .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:10px 22px;padding-block:16px;text-align:center}
.rail .big{font-size:clamp(1.2rem,3vw,1.6rem);font-weight:700;color:#fff}
.rail s{color:#8E96A1;font-weight:500}
.rail .tag{background:rgba(255,109,7,.16);border:1px solid rgba(255,109,7,.5);color:var(--orange-2);
  font-size:.76rem;font-weight:600;padding:5px 12px;border-radius:999px}

/* ── section head ─────────────────────────── */
.shead{text-align:center;max-width:62ch;margin-inline:auto;display:flex;flex-direction:column;gap:12px}
.shead p{color:var(--ink-2);font-size:clamp(.95rem,2vw,1.05rem)}
.on-dark .shead p{color:#B4BAC3}
.kicker{font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--orange-text)}
.on-dark .kicker{color:var(--orange)}

/* ── card grids ───────────────────────────── */
.grid{display:grid;gap:clamp(12px,1.8vw,18px);grid-template-columns:1fr;margin-top:clamp(26px,3.5vw,38px)}
@media(min-width:640px){.grid.two{grid-template-columns:1fr 1fr}}
@media(min-width:900px){.grid.three{grid-template-columns:repeat(3,1fr)}
  .grid.four{grid-template-columns:repeat(4,1fr)}}
.card{background:var(--white);border:1px solid var(--line);border-radius:12px;
  padding:22px 20px;display:flex;flex-direction:column;gap:9px;
  transition:transform .18s,box-shadow .18s}
.card:hover{transform:translateY(-3px);box-shadow:0 16px 34px -22px rgba(28,28,28,.4)}
.card .ic{width:38px;height:38px;border-radius:9px;background:rgba(255,109,7,.1);
  display:grid;place-items:center;color:var(--orange);flex:none}
.card .ic svg{width:19px;height:19px}
.card p{font-size:.92rem;color:var(--ink-2)}
.card.dark{background:var(--black-3);border-color:var(--line-dark)}
.card.dark p{color:#B4BAC3}

/* stat row */
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-top:clamp(24px,3vw,34px)}
@media(min-width:760px){.stats{grid-template-columns:repeat(4,1fr)}}
.stats div{background:var(--white);padding:20px 14px;text-align:center;display:flex;flex-direction:column;gap:3px}
.stats .n{font-size:clamp(1.5rem,3.4vw,2rem);font-weight:700;color:var(--orange-text);line-height:1.1}
.stats .l{font-size:.76rem;font-weight:500;color:var(--ink-3);letter-spacing:.03em}

/* ── for-you / not-for-you ────────────────── */
.foryou{display:grid;gap:16px;grid-template-columns:1fr;margin-top:clamp(26px,3.5vw,36px)}
@media(min-width:820px){.foryou{grid-template-columns:1fr 1fr}}
.fcol{background:var(--white);border:2px solid var(--line);border-radius:14px;padding:24px 22px;
  display:flex;flex-direction:column;gap:14px}
.fcol.yes{border-color:rgba(30,158,90,.4)}
.fcol.no{border-color:rgba(255,2,2,.28)}
.fcol h3{display:flex;align-items:center;gap:9px}
.fcol h3 span{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none;color:#fff}
.fcol.yes h3 span{background:var(--green)}
.fcol.no h3 span{background:var(--red)}
.fcol ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.fcol li{position:relative;padding-left:20px;font-size:.93rem;color:var(--ink-2)}
.fcol li::before{content:"—";position:absolute;left:0;top:0;color:var(--ink-3)}

/* ── value stack ──────────────────────────── */
.stackbox{max-width:660px;margin:clamp(26px,3.5vw,36px) auto 0;background:var(--black-3);
  border:1px solid var(--line-dark);border-radius:14px;overflow:hidden}
.stackbox .row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  padding:14px 20px;border-bottom:1px solid var(--line-dark);font-size:.93rem;color:#D7DBE1}
.stackbox .row b{font-weight:500}
.stackbox .row i{font-style:normal;color:#8E96A1;white-space:nowrap;font-size:.88rem}
.stackbox .row.free i{color:#35C97E;font-weight:600}
.stackbox .tot{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  padding:18px 20px;background:rgba(255,109,7,.1)}
.stackbox .tot b{color:#fff;font-weight:600;font-size:1rem}
.stackbox .tot .amt{font-size:clamp(1.5rem,4vw,2rem);font-weight:700;color:var(--orange-2);line-height:1}
.stackbox .tot .amt s{font-size:1rem;color:#8E96A1;font-weight:500;margin-right:8px}

/* ── plans ────────────────────────────────── */
.plans{display:grid;gap:16px;grid-template-columns:1fr;margin-top:clamp(26px,3.5vw,36px);align-items:stretch}
@media(min-width:860px){.plans{grid-template-columns:1fr 1.15fr 1fr}}
.plan{background:var(--white);border:2px solid var(--line);border-radius:14px;padding:26px 22px;
  display:flex;flex-direction:column;gap:14px}
.plan.hot{border-color:var(--orange);position:relative;box-shadow:0 22px 50px -30px rgba(255,109,7,.7)}
.plan.hot::after{content:"MOST CHOSEN";position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  background:var(--orange);color:#fff;font-size:.66rem;font-weight:700;letter-spacing:.12em;
  padding:5px 14px;border-radius:999px;white-space:nowrap}
.plan .amt{font-size:clamp(1.9rem,4.6vw,2.5rem);font-weight:700;color:var(--ink);line-height:1;
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.plan .amt s{font-size:1.05rem;color:var(--ink-3);font-weight:500}
.plan .per{font-size:.8rem;color:var(--ink-3);font-weight:500}
.plan ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:.91rem}
.plan li{display:flex;gap:9px;align-items:flex-start;color:var(--ink-2)}
.plan li svg{flex:none;width:15px;height:15px;margin-top:4px;color:var(--green)}
.plan .foot{margin-top:auto;padding-top:6px}
.plan .btn{font-size:1rem;padding:14px 18px}

/* ── included ─────────────────────────────── */
.incl{list-style:none;margin:clamp(24px,3vw,34px) 0 0;padding:0;display:grid;gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;
  grid-template-columns:1fr}
@media(min-width:700px){.incl{grid-template-columns:1fr 1fr}}
.incl li{background:var(--white);padding:17px 19px;display:flex;gap:12px;align-items:flex-start;font-size:.92rem}
.incl svg{flex:none;width:18px;height:18px;margin-top:3px;color:var(--orange)}
.incl b{color:var(--ink);font-weight:600}

/* ── voices ───────────────────────────────── */
.voices{display:grid;gap:14px;grid-template-columns:1fr;margin-top:clamp(24px,3vw,34px)}
@media(min-width:780px){.voices{grid-template-columns:repeat(3,1fr)}}
.voice{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:20px;
  display:flex;flex-direction:column;gap:11px}
.voice .st{color:#A06400;font-size:.88rem;letter-spacing:.1em}
.voice p{font-size:.93rem;color:var(--ink-2);line-height:1.6}
.voice .who{display:flex;align-items:center;gap:10px;font-size:.8rem;color:var(--ink-3)}
.voice .av{width:32px;height:32px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--orange);color:#fff;font-weight:700;font-size:.82rem}

/* ── teller ───────────────────────────────── */
.teller{display:grid;gap:clamp(20px,3vw,36px);grid-template-columns:1fr;align-items:center}
@media(min-width:820px){.teller{grid-template-columns:.7fr 1.3fr}}
.portrait{aspect-ratio:4/5;border-radius:14px;border:1px solid var(--line-dark);position:relative;
  overflow:hidden;background:linear-gradient(165deg,#2A2A2A,#171717 62%,#2A1409);display:grid;place-items:center}
.portrait .halo{position:absolute;width:64%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(255,109,7,.2),transparent 68%)}
.portrait span{position:relative;font-size:.78rem;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:#8E96A1;text-align:center;padding:0 18px}
.tbd{display:inline-flex;align-items:center;gap:7px;border:1px dashed var(--orange);color:var(--orange-2);
  font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:6px 12px;border-radius:999px;align-self:flex-start}

/* ── faq ──────────────────────────────────── */
.faq{max-width:820px;margin-inline:auto;margin-top:clamp(24px,3vw,34px);
  border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:18px 40px 18px 0;position:relative;
  font-weight:600;font-size:clamp(.98rem,2.1vw,1.08rem);color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:8px;top:50%;width:10px;height:10px;
  border-right:2px solid var(--orange);border-bottom:2px solid var(--orange);
  transform:translateY(-70%) rotate(45deg);transition:transform .2s}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq .a{padding:0 0 18px;color:var(--ink-2);font-size:.94rem;max-width:72ch}

/* ── closing ──────────────────────────────── */
.close .wrap{max-width:760px}
.close h2{color:#fff}
.close p{color:#B4BAC3;font-size:clamp(1rem,2.1vw,1.12rem)}
.sig{font-family:var(--deva);color:var(--orange-2);font-size:1.1rem}

footer{background:var(--black-2);color:#8E96A1;padding-block:30px 36px;font-size:.8rem}
footer .wrap{display:flex;flex-direction:column;gap:12px;text-align:center;align-items:center}
footer .disc{max-width:74ch;line-height:1.55;font-size:.72rem;color:#7C838D}

/* ── sticky ───────────────────────────────── */
.sticky{position:fixed;inset:auto 0 0 0;z-index:50;background:rgba(20,20,20,.97);
  backdrop-filter:blur(10px);border-top:1px solid var(--line-dark)}
.sticky .wrap{display:flex;align-items:center;gap:12px;padding-block:11px;justify-content:space-between}
.sticky .pr{display:flex;flex-direction:column;line-height:1.15}
.sticky .pr b{font-size:2.15rem;font-weight:700;color:#fff;line-height:1;letter-spacing:-.01em}
.sticky .pr s{font-size:.74rem;color:#8E96A1}
.sticky .clk{display:none;flex-direction:column;text-align:center;line-height:1.2}
@media(min-width:860px){.sticky .clk{display:flex}}
.sticky .clk .l{font-size:.62rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:#8E96A1}
.sticky .clk .t{font-size:1.05rem;font-weight:700;color:var(--orange-2);font-variant-numeric:tabular-nums}
.sticky .btn{width:auto;padding:12px 22px;font-size:.95rem}
.sticky .gift{display:none;color:var(--orange-2);text-decoration:none;font-size:.86rem;font-weight:500;
  border:1px solid rgba(255,109,7,.5);border-radius:var(--r);padding:11px 16px;white-space:nowrap}
@media(min-width:640px){.sticky .gift{display:inline-block}}

.rv{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}}

/* ═════════════════════════════════════════════
   DEVAM ADDITIONS
   New components the course funnel needs that
   the 108-Temples landing did not. Every value
   below is derived from the tokens above — no
   new colours, no new type sizes, no new radii.
   ═════════════════════════════════════════════ */

/* ── site header ──────────────────────────── */
.top{background:var(--black-2);border-bottom:1px solid var(--line-dark);position:relative;z-index:20}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-block:12px}
.brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:#fff;
  font-weight:700;font-size:1.05rem;letter-spacing:-.01em}
.brand .mk{width:28px;height:28px;border-radius:7px;background:var(--orange);color:#fff;
  display:grid;place-items:center;font-size:.9rem;flex:none}

/* language toggle — orange pill, two states */
.lang{display:inline-flex;border:1px solid rgba(255,109,7,.55);border-radius:999px;
  overflow:hidden;flex:none;background:rgba(255,109,7,.08)}
.lang a{padding:6px 13px;font-size:.76rem;font-weight:600;letter-spacing:.04em;
  text-decoration:none;color:var(--orange-2);line-height:1.4}
.lang a[aria-current]{background:var(--orange);color:#fff}
.lang a.deva{font-family:var(--deva);font-size:.86rem;padding-block:4px}

/* ── forms ────────────────────────────────── */
.form{display:flex;flex-direction:column;gap:17px}
.field{display:flex;flex-direction:column;gap:7px}
.field label{font-size:.82rem;font-weight:600;color:var(--ink);letter-spacing:.01em}
.on-dark .field label{color:#E8EBEF}
.field .hint{font-size:.76rem;color:var(--ink-3);font-weight:400}
.on-dark .field .hint{color:#8E96A1}
.field input,.field select,.field textarea{font:inherit;font-size:1rem;color:var(--ink);
  background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  padding:13px 14px;width:100%;transition:border-color .15s,box-shadow .15s}
.field input:focus,.field select:focus{outline:0;border-color:var(--orange);
  box-shadow:0 0 0 3px rgba(255,109,7,.16)}
.field .pre{display:flex;align-items:stretch}
.field .pre span{display:grid;place-items:center;padding:0 13px;font-size:.95rem;font-weight:600;
  color:var(--ink-2);background:var(--grey);border:1px solid var(--line);border-right:0;
  border-radius:var(--r) 0 0 var(--r);flex:none}
.field .pre input{border-radius:0 var(--r) var(--r) 0}
.field.err input{border-color:var(--red)}
.field .msg{font-size:.78rem;color:var(--red);font-weight:500}

/* radio cards — "whose number is this" */
.picks{display:grid;gap:9px;grid-template-columns:1fr}
@media(min-width:560px){.picks{grid-template-columns:repeat(3,1fr)}}
.pick{position:relative;border:2px solid var(--line);border-radius:var(--r);padding:13px 14px;
  cursor:pointer;background:var(--white);font-size:.88rem;font-weight:500;color:var(--ink-2);
  display:flex;flex-direction:column;gap:2px;transition:border-color .15s,background .15s}
.pick b{font-weight:600;color:var(--ink);font-size:.93rem}
.pick input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.pick:has(input:checked){border-color:var(--orange);background:rgba(255,109,7,.06)}
.pick:has(input:focus-visible){box-shadow:0 0 0 3px rgba(255,109,7,.2)}

/* form card wrapper */
.panel{background:var(--white);border:1px solid var(--line);border-radius:14px;
  padding:clamp(22px,3.4vw,32px);max-width:560px;margin-inline:auto;
  display:flex;flex-direction:column;gap:20px}
.panel.narrow{max-width:460px}
.panel h2{font-size:clamp(1.25rem,2.8vw,1.6rem)}
.panel .lede{font-size:.93rem;color:var(--ink-2)}
.panel hr{border:0;border-top:1px solid var(--line);margin:0}
.panel .alt{font-size:.86rem;color:var(--ink-3);text-align:center}
.panel .alt a{color:var(--orange-text);font-weight:600}

/* order summary strip inside checkout */
.osum{display:flex;align-items:center;gap:14px;background:var(--grey);
  border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.osum .thumb{width:56px;height:56px;border-radius:var(--r);flex:none;
  background:linear-gradient(150deg,#5A1A08,#8C2A0C);display:grid;place-items:center;
  color:var(--yellow);font-size:1.3rem}
.osum .t{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.osum .t b{font-size:.95rem;color:var(--ink);font-weight:600}
.osum .t span{font-size:.78rem;color:var(--ink-3)}
.osum .amt{font-size:1.3rem;font-weight:700;color:var(--ink);white-space:nowrap}
.osum .amt s{display:block;font-size:.76rem;color:var(--ink-3);font-weight:500}

/* trust row under a pay button */
.trust{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;
  font-size:.74rem;color:var(--ink-3);font-weight:500}
.trust span{display:inline-flex;align-items:center;gap:6px}
.trust svg{width:14px;height:14px;color:var(--green)}
.on-dark .trust{color:#8E96A1}

/* ── the code ─────────────────────────────── */
.codebox{background:var(--black-3);border:1px solid var(--line-dark);border-radius:14px;
  padding:clamp(22px,3.4vw,30px);text-align:center;display:flex;flex-direction:column;
  gap:13px;align-items:center;max-width:520px;margin-inline:auto}
.codebox .l{font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--orange)}
.code{font-size:clamp(1.9rem,6.5vw,2.9rem);font-weight:700;letter-spacing:.22em;color:var(--yellow);
  font-variant-numeric:tabular-nums;line-height:1.1;word-break:break-all;padding-left:.22em}
.codebox .sub{font-size:.84rem;color:#B4BAC3;max-width:44ch}
.copy{background:transparent;border:1px solid var(--line-dark);color:#C9CDD4;border-radius:var(--r);
  padding:9px 16px;font:inherit;font-size:.8rem;font-weight:500;cursor:pointer;display:inline-flex;
  align-items:center;gap:7px}
.copy:hover{border-color:var(--orange);color:#fff}

/* WhatsApp delivery ticker */
.wa-tick{display:inline-flex;align-items:center;gap:9px;background:rgba(30,158,90,.12);
  border:1px solid rgba(30,158,90,.4);border-radius:999px;padding:8px 16px;
  font-size:.82rem;font-weight:500;color:#35C97E}
.wa-tick .dot{width:7px;height:7px;border-radius:50%;background:#35C97E;flex:none;
  animation:blink 1.5s steps(2,start) infinite}

/* ── episode list ─────────────────────────── */
.eps{list-style:none;margin:clamp(22px,3vw,30px) 0 0;padding:0;display:grid;gap:1px;
  background:var(--line-dark);border:1px solid var(--line-dark);border-radius:12px;overflow:hidden}
.ep{background:var(--black-3);display:flex;gap:15px;padding:16px 18px;align-items:flex-start;
  text-decoration:none;transition:background .16s;position:relative}
.ep:hover{background:#333}
.ep .n{width:34px;height:34px;border-radius:8px;flex:none;display:grid;place-items:center;
  background:rgba(255,109,7,.14);color:var(--orange-2);font-weight:700;font-size:.95rem}
.ep.done .n{background:var(--green);color:#fff}
.ep .b{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0}
.ep .b h3{font-size:1rem;color:#fff;font-weight:600;line-height:1.35}
.ep .b p{font-size:.86rem;color:#B4BAC3;line-height:1.55}
.ep .meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.74rem;color:#8E96A1;font-weight:500}
.ep .play{flex:none;align-self:center;width:30px;height:30px;border-radius:50%;display:grid;
  place-items:center;background:var(--orange);color:#fff}
.ep .play svg{width:13px;height:13px}
.ep .bar{position:absolute;left:0;bottom:0;height:2px;background:var(--orange)}
/* light-band variant */
.eps.light{background:var(--line);border-color:var(--line)}
.eps.light .ep{background:var(--white)}
.eps.light .ep:hover{background:var(--off)}
.eps.light .ep .b h3{color:var(--ink)}
.eps.light .ep .b p{color:var(--ink-2)}
.eps.light .ep .meta{color:var(--ink-3)}

/* ── player ───────────────────────────────── */
.player{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;
  background:linear-gradient(150deg,#2A0F06,#1D1D1D 55%,#141414);display:grid;place-items:center;
  border:1px solid var(--line-dark)}
.player .big{width:64px;height:64px;border-radius:50%;background:var(--orange);color:#fff;
  display:grid;place-items:center;box-shadow:0 12px 34px -12px rgba(255,109,7,.9)}
.player .big svg{width:24px;height:24px;margin-left:3px}
.player .tagl{position:absolute;left:14px;top:14px;background:rgba(20,20,20,.8);color:#E8EBEF;
  font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:6px 11px;border-radius:999px;backdrop-filter:blur(6px)}
.player .tagl.free{background:var(--yellow);color:var(--ink)}
.playbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;
  margin-top:14px}
.playbar .lft{display:flex;flex-direction:column;gap:3px}
.playbar h2{font-size:clamp(1.1rem,2.6vw,1.4rem)}
.playbar .ctx{font-size:.8rem;color:#8E96A1}
.awake{display:inline-flex;align-items:center;gap:9px;font-size:.8rem;color:#C9CDD4;font-weight:500;
  border:1px solid var(--line-dark);border-radius:999px;padding:8px 14px;cursor:pointer;background:transparent}
.awake .sw{width:30px;height:17px;border-radius:999px;background:var(--green);position:relative;flex:none}
.awake .sw::after{content:"";position:absolute;top:2px;right:2px;width:13px;height:13px;
  border-radius:50%;background:#fff}

/* chapter rail under the player */
.chaps{display:flex;gap:9px;overflow-x:auto;padding-block:4px;margin-top:18px;
  scrollbar-width:thin}
.chaps a{flex:none;min-width:132px;background:var(--black-3);border:1px solid var(--line-dark);
  border-radius:10px;padding:12px 13px;text-decoration:none;display:flex;flex-direction:column;gap:5px}
.chaps a[aria-current]{border-color:var(--orange);background:rgba(255,109,7,.1)}
.chaps .k .num{display:none}
.chaps .k{font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--orange-2)}
.chaps .ti{font-size:.84rem;color:#E8EBEF;font-weight:500;line-height:1.35}

/* ── tabs ─────────────────────────────────── */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line-dark);overflow-x:auto}
.tabs a{padding:12px 16px;font-size:.9rem;font-weight:600;color:#8E96A1;text-decoration:none;
  border-bottom:2px solid transparent;white-space:nowrap;margin-bottom:-1px}
.tabs a[aria-current]{color:#fff;border-bottom-color:var(--orange)}
.tabs.light{border-color:var(--line)}
.tabs.light a{color:var(--ink-3)}
.tabs.light a[aria-current]{color:var(--ink)}

/* ── samagri checklist ────────────────────── */
.samagri{list-style:none;margin:clamp(20px,3vw,28px) 0 0;padding:0;display:grid;gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;
  grid-template-columns:1fr}
@media(min-width:640px){.samagri{grid-template-columns:1fr 1fr}}
@media(min-width:980px){.samagri{grid-template-columns:repeat(3,1fr)}}
.samagri li{background:var(--white);padding:14px 16px;display:flex;gap:11px;align-items:flex-start;
  font-size:.9rem;color:var(--ink-2)}
.samagri .bx{width:18px;height:18px;border:2px solid var(--line);border-radius:4px;flex:none;margin-top:2px}
.samagri b{color:var(--ink);font-weight:600;display:block;font-size:.93rem}
.samagri i{font-style:normal;font-size:.78rem;color:var(--ink-3);display:block;margin-top:1px}
.samagri .deva{font-family:var(--deva);font-size:.95rem;color:var(--ink)}

/* ── timings table ────────────────────────── */
.citypick{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin-top:clamp(18px,2.6vw,24px)}
.citypick button{background:var(--white);border:1px solid var(--line);border-radius:999px;
  padding:8px 15px;font:inherit;font-size:.82rem;font-weight:500;color:var(--ink-2);cursor:pointer}
.citypick button[aria-pressed="true"]{background:var(--orange);border-color:var(--orange);
  color:#fff;font-weight:600}
.times{margin-top:clamp(18px,2.6vw,24px);border:1px solid var(--line);border-radius:12px;
  overflow:hidden;background:var(--white)}
.times .hd{display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:14px 18px;background:var(--grey);border-bottom:1px solid var(--line)}
.times .hd b{color:var(--ink);font-size:.95rem;font-weight:600}
.times .hd span{font-size:.76rem;color:var(--ink-3);font-weight:500}
.times .tr{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  padding:14px 18px;border-bottom:1px solid var(--line)}
.times .tr:last-child{border-bottom:0}
.times .tr .w{display:flex;flex-direction:column;gap:2px;min-width:0}
.times .tr b{font-size:.93rem;color:var(--ink);font-weight:600}
.times .tr i{font-style:normal;font-size:.78rem;color:var(--ink-3)}
.times .tr .v{font-size:1rem;font-weight:700;color:var(--orange-text);white-space:nowrap;
  font-variant-numeric:tabular-nums}
.times .tr.hot{background:rgba(255,109,7,.06)}
/* a long value (the tithi span) goes under its label instead of squeezing the label into one word a line */
.times .tr .w{flex:1 1 auto}
.times .tr .v{flex:none}
.times .tr.stack{flex-direction:column;align-items:flex-start;gap:6px}
.times .tr.stack .v{white-space:normal;font-size:.95rem;line-height:1.45}

/* ── order history ────────────────────────── */
.orders{display:grid;gap:12px;margin-top:clamp(20px,3vw,28px)}
.order{background:var(--black-3);border:1px solid var(--line-dark);border-radius:12px;
  padding:18px;display:flex;flex-wrap:wrap;gap:15px;align-items:center;text-decoration:none;
  transition:border-color .16s}
.order:hover{border-color:var(--orange)}
.order .thumb{width:64px;height:64px;border-radius:9px;flex:none;
  background:linear-gradient(150deg,#5A1A08,#8C2A0C);display:grid;place-items:center;
  color:var(--yellow);font-size:1.5rem}
.order .b{flex:1;min-width:170px;display:flex;flex-direction:column;gap:4px}
.order .b h3{font-size:1rem;color:#fff}
.order .b .meta{font-size:.78rem;color:#8E96A1;display:flex;flex-wrap:wrap;gap:5px 14px}
.order .b .meta .cd{color:var(--orange-2);font-weight:600;letter-spacing:.08em}
.order .prog{flex:none;width:100%;max-width:170px;display:flex;flex-direction:column;gap:6px}
.order .prog .track{height:5px;border-radius:99px;background:#3C3C3C;overflow:hidden}
.order .prog .fill{height:100%;background:var(--orange);border-radius:99px}
.order .prog .pl{font-size:.72rem;color:#8E96A1;font-weight:500}

/* profile identity block */
.me{display:flex;flex-wrap:wrap;gap:16px;align-items:center;
  background:var(--black-3);border:1px solid var(--line-dark);border-radius:14px;padding:20px}
.me .av{width:52px;height:52px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--orange);color:#fff;font-weight:700;font-size:1.15rem}
.me .b{flex:1;min-width:150px;display:flex;flex-direction:column;gap:3px}
.me .b b{color:#fff;font-size:1.05rem;font-weight:600}
.me .b span{font-size:.82rem;color:#8E96A1}
.me .out{border:1px solid var(--line-dark);border-radius:var(--r);padding:10px 16px;
  color:#C9CDD4;text-decoration:none;font-size:.84rem;font-weight:500}
.me .out:hover{border-color:var(--red);color:#FF6B6B}

/* device slots */
.devices{display:grid;gap:10px;margin-top:16px}
.devrow{display:flex;gap:13px;align-items:center;background:var(--black-3);
  border:1px solid var(--line-dark);border-radius:10px;padding:14px 16px}
.devrow .ic{width:32px;height:32px;border-radius:8px;flex:none;display:grid;place-items:center;
  background:rgba(255,109,7,.12);color:var(--orange-2)}
.devrow .b{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.devrow .b b{font-size:.9rem;color:#E8EBEF;font-weight:600}
.devrow .b span{font-size:.76rem;color:#8E96A1}
.devrow .this{font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--green);flex:none}
.devrow .rm{background:transparent;border:1px solid var(--line-dark);color:#8E96A1;border-radius:6px;
  padding:7px 12px;font:inherit;font-size:.76rem;cursor:pointer;flex:none}
.devrow .rm:hover{border-color:var(--red);color:#FF6B6B}
.devrow.empty{border-style:dashed;opacity:.6}

/* ── notice ───────────────────────────────── */
.notice{display:flex;gap:12px;align-items:flex-start;border-left:3px solid var(--orange);
  background:rgba(255,109,7,.08);padding:14px 16px;border-radius:0 var(--r) var(--r) 0;
  font-size:.87rem;line-height:1.6;color:var(--ink-2)}
.on-dark .notice{color:#C9CDD4}
.notice svg{flex:none;width:17px;height:17px;color:var(--orange);margin-top:3px}

/* ── legal / long-form pages ──────────────── */
.legal{max-width:760px;margin-inline:auto}
.legal h2{margin-top:clamp(28px,4vw,38px);font-size:clamp(1.15rem,2.4vw,1.4rem)}
.legal h2:first-of-type{margin-top:0}
.legal p,.legal li{font-size:.94rem;color:var(--ink-2);line-height:1.7}
.legal p{margin-top:12px}
.legal ul{margin:12px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:8px}
.legal .upd{font-size:.78rem;color:var(--ink-3);font-weight:500}

/* ── footer nav columns ───────────────────── */
.fnav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px}
.fnav a{color:#8E96A1;text-decoration:none}
.fnav a:hover{color:var(--orange-2)}


/* ── toasts ───────────────────────────────── */
.toasts{position:fixed;z-index:90;left:50%;transform:translateX(-50%);bottom:104px;
  display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none;
  width:calc(100% - 32px);max-width:420px}
.toast{background:var(--black-3);border:1px solid var(--line-dark);color:#E8EBEF;
  border-radius:999px;padding:11px 20px;font-size:.86rem;font-weight:500;text-align:center;
  box-shadow:0 18px 40px -18px rgba(0,0,0,.9);
  opacity:0;transform:translateY(10px);transition:opacity .25s,transform .25s}
.toast.in{opacity:1;transform:none}
.toast.warn{border-color:rgba(255,2,2,.5);color:#FFB3B3}


/* ── empty state ──────────────────────────── */
.empty{border:1px dashed var(--line-dark);border-radius:12px;padding:28px 20px;text-align:center;
  display:flex;flex-direction:column;gap:10px;align-items:center;margin-top:22px}
.empty p{color:#8E96A1;font-size:.92rem}
.empty a{color:var(--orange-2);font-weight:600;font-size:.9rem;text-decoration:none}

/* ── episode row state ────────────────────── */
.ep .state{flex:none;align-self:center;font-size:.76rem;font-weight:600;letter-spacing:.04em;
  color:#8E96A1;text-align:right;min-width:74px}
.ep .state.on{color:var(--orange-2)}
.ep .bar{width:0}


/* A class that sets `display` outranks the UA stylesheet's [hidden]{display:none},
   so any element toggled with .hidden = true silently stayed visible. */
[hidden]{display:none!important}


/* ═════════════════════════════════════════════
   DESKTOP OPTIMISATION
   Everything above is mobile-first and stays
   as it is. These rules only take effect at
   wider viewports, where the single narrow
   column wastes the screen.
   ═════════════════════════════════════════════ */

/* a wider container for the data-dense signed-in pages */
:root{--wrap-wide:1320px}
.wrap.wide{max-width:var(--wrap-wide)}

/* ── two-column shells ────────────────────── */
.cols{display:grid;gap:clamp(20px,2.4vw,28px);grid-template-columns:1fr;align-items:start}
/* grid items default to min-width:auto, which lets the canvas push the
   column past a narrow viewport. */
.cols>*{min-width:0}
.side{display:flex;flex-direction:column;gap:16px}
@media(min-width:980px){
  .cols.checkout{grid-template-columns:minmax(0,1fr) 340px}
  .cols.checkout .panel{max-width:none;margin-inline:0}
  .side.sticky-side{position:sticky;top:22px}
}
@media(min-width:1000px){
  .cols.profile{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr)}
}
@media(min-width:1100px){
  .cols.watch{grid-template-columns:minmax(0,1fr) 350px}
}

/* ── checkout aside ───────────────────────── */
.sidecard{background:var(--white);border:1px solid var(--line);border-radius:12px;
  padding:20px;display:flex;flex-direction:column;gap:14px}
.sidecard h3{font-size:.95rem}
.sidecard .osum{background:transparent;border:0;padding:0}
.sidecard .rows{display:flex;flex-direction:column;gap:9px;font-size:.88rem;color:var(--ink-2)}
.sidecard .rows div{display:flex;justify-content:space-between;gap:12px}
.sidecard .rows b{color:var(--ink);font-weight:600}
.sidecard hr{border:0;border-top:1px solid var(--line);margin:0}
.sidecard .tot{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.sidecard .tot span{font-size:.88rem;color:var(--ink-2)}
.sidecard .tot b{font-size:1.5rem;font-weight:700;color:var(--ink)}
.sidecard .tot b s{font-size:.9rem;color:var(--ink-3);font-weight:500;margin-right:7px}
.sidecard .assure{display:flex;flex-direction:column;gap:9px;font-size:.83rem;color:var(--ink-2)}
.sidecard .assure span{display:flex;gap:9px;align-items:flex-start}
.sidecard .assure svg{flex:none;width:15px;height:15px;margin-top:3px;color:var(--green)}
.side .sidecard.dark{background:var(--black-3);border-color:var(--line-dark)}
.side .sidecard.dark h3,.side .sidecard.dark .rows b{color:#fff}
.side .sidecard.dark .rows,.side .sidecard.dark .assure{color:#B4BAC3}


/* ── profile: history left, devices right ─── */
@media(min-width:1000px){
  .cols.profile .shead{margin-top:0}
}

/* ── landing: use the width at large sizes ── */
@media(min-width:1180px){
  .hero .chips{grid-template-columns:1fr 1fr}
  .hero .ticks li{font-size:.95rem}
  .grid.three{gap:20px}
  .foryou{gap:20px}
}
@media(min-width:1400px){
  .hero h1{font-size:3.4rem}
  .hero .sub{font-size:1.18rem;max-width:66ch}
}

/* pointer-only affordances — no hover states on touch */
@media(hover:hover) and (pointer:fine){
  .ep:hover .state{color:var(--orange-2)}
  .order:hover .b h3{color:var(--orange-2)}
  .samagri li:hover{background:var(--off)}
  .times .tr:hover{background:var(--grey)}
  .times .tr.hot:hover{background:rgba(255,109,7,.1)}
}


/* An unresolved fact that must be filled before launch. Deliberately loud. */
.gap{background:rgba(255,109,7,.12);border-bottom:1.5px dashed var(--orange);
  color:var(--orange-text);font-weight:600;padding:0 3px;white-space:nowrap}
.on-dark .gap{color:var(--orange-2)}
.gapnote{display:flex;gap:11px;align-items:flex-start;border:1.5px dashed var(--orange);
  background:rgba(255,109,7,.06);border-radius:var(--r);padding:14px 16px;
  font-size:.86rem;color:var(--ink-2);margin-bottom:clamp(20px,3vw,28px)}
.gapnote b{color:var(--orange-text);font-weight:700}
.gapnote svg{flex:none;width:18px;height:18px;color:var(--orange);margin-top:2px}

/* Long-form prose on the policy pages. Deliberately the same measure,
   size and colour theme E already uses for a FAQ answer, so these pages
   read as part of the same set rather than as a new layout. */
.doctext{max-width:72ch;margin:clamp(22px,3vw,30px) auto 0;
  display:flex;flex-direction:column;gap:14px}
.doctext p{font-size:.94rem;color:var(--ink-2);line-height:1.75}
.doctext h3{margin-top:clamp(14px,2vw,20px)}
.doctext a{color:var(--orange-text);font-weight:600}
.on-dark .doctext p{color:#B4BAC3}
.on-dark .doctext a{color:var(--orange-2)}
.upd{font-size:.78rem;color:var(--ink-3);font-weight:500}
.on-dark .upd{color:#8E96A1}
.incl li span{min-width:0}
.incl a{color:var(--orange-text);font-weight:600}
.card h3 .tag{font-size:.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:3px 9px;border-radius:999px;background:rgba(255,109,7,.14);color:var(--orange-2);
  vertical-align:middle;margin-left:7px}
.gapnote{max-width:72ch;margin-inline:auto;margin-top:clamp(20px,3vw,26px)}
.on-dark .gapnote{color:#C9CDD4}
/* inline links inside theme E's content components take the brand colour
   rather than the browser default */
.fcol a,.card p a,.ticks a,.stackbox a{color:var(--orange-text);font-weight:600}
.on-dark .fcol a,.card.dark p a,.on-dark .stackbox a{color:var(--orange-2)}
/* live vs coming, using theme E's own green */
.card h3 .tag.live{background:rgba(30,158,90,.16);color:#35C97E}

/* ═════════════════════════════════════════════
   SITE BLOCK (4 September 2026)
   The header without a menu, the funnel pages,
   the profile and the watch page. Theme tokens
   only; the watch page adds its own dark set.
   ═════════════════════════════════════════════ */

/* ── header: mark left, person right ──────── */
.top .wrap{padding-block:10px;min-height:56px}
.brand svg{width:26px;height:26px;flex:none}
.brand span{font-size:1.02rem}
.top-right{display:flex;align-items:center;gap:12px}
.top-right .who{display:inline-flex;align-items:center;gap:12px;font-size:.84rem;color:#A8B1C0}
.top-right .who b{color:#fff;font-weight:500}
.top-right .who a{color:#A8B1C0;text-decoration:none;border:1px solid var(--line-dark);border-radius:999px;padding:7px 13px}
.top-right .who a:hover{color:#fff;border-color:var(--orange)}
.lang a{padding:6px 11px}
footer .fnav a{padding:4px 2px}

/* ── funnel shells ────────────────────────── */
.funnel{padding-block:clamp(22px,4vw,44px)}
.funnel.tall{min-height:72vh}
.wrap.narrow{max-width:560px}
.centre{text-align:center}
.muted{color:var(--ink-3)}
.on-dark .muted{color:#8E96A1}
.small{font-size:.84rem}
.spinner{display:inline-block;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;
  border-radius:50%;animation:spin .8s linear infinite;vertical-align:-3px;margin-right:9px}
@keyframes spin{to{transform:rotate(360deg)}}
.shead.left{text-align:left;align-items:flex-start}
.btn:disabled{opacity:.6;cursor:default;transform:none}
.btn.ghost{background:transparent;border:2px solid var(--orange);color:var(--orange-text)}
.on-dark .btn.ghost{color:var(--orange-2)}
.btn.small{padding:10px 16px;font-size:.88rem;width:auto}

/* ── checkout ─────────────────────────────── */
.try-strip{background:var(--yellow);color:#1C1C1C;font-weight:600;font-size:.86rem;padding:10px 14px;
  border-radius:var(--r);margin-bottom:18px;text-align:center}
.osum .thumb{background:var(--black-2)}
.osum .thumb svg{width:34px;height:34px}
.osum .amt{display:flex;flex-direction:column;align-items:flex-end;line-height:1.2}
.osum .amt small{font-size:.72rem;color:var(--ink-3);font-weight:500;white-space:nowrap}
.field select{appearance:none;-webkit-appearance:none;padding-right:40px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234B4F58' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;background-size:18px}
.field.err select{border-color:var(--red)}
.refund-line{font-size:.86rem;color:var(--ink-2);text-align:center;margin:-4px 0 0;font-weight:500}
.form-error{font-size:.86rem;color:#B3261E;background:rgba(255,2,2,.06);border:1px solid rgba(255,2,2,.25);
  border-radius:var(--r);padding:10px 12px;margin:0;text-align:center}
.form-error a{color:var(--orange-text);font-weight:600}
.form-error.ok{color:#1E7A48;background:rgba(30,158,90,.08);border-color:rgba(30,158,90,.35)}
.on-dark .form-error{color:#FFB3B3;background:rgba(255,2,2,.12);border-color:rgba(255,2,2,.35)}
.on-dark .form-error.ok{color:#8FE3B4;background:rgba(30,158,90,.14)}
.linkbox{display:flex;flex-direction:column;gap:12px}
.linkbox p{font-size:.9rem;color:var(--ink-2);margin:0}
.linkbox p b{color:var(--ink)}

/* ── success (dark panel) ─────────────────── */
.panel.dark{background:var(--black-3);border-color:var(--line-dark)}
.panel.dark h3{color:#fff;font-size:1.1rem}
.panel.dark .lede{color:#B4BAC3}
.panel.dark .field label{color:#E8EBEF}
.panel.dark .field .hint{color:#8E96A1}
.panel.dark .field input{background:#141414;border-color:var(--line-dark);color:#fff}
.panel.dark .alt{color:#8E96A1}
.panel.dark .alt a{color:var(--orange-2)}
.panel.dark hr{border-top-color:var(--line-dark)}
.sx-links{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:18px}
.ghostlink{color:var(--orange-2);font-weight:600;text-decoration:none;border:1px solid rgba(255,109,7,.5);
  border-radius:999px;padding:10px 18px;font-size:.9rem}

/* ── profile: course cards ────────────────── */
.course-cards{display:grid;gap:16px;margin-top:22px}
@media(min-width:760px){.course-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
.course-card{display:grid;grid-template-columns:96px minmax(0,1fr);gap:18px;align-items:center;
  background:var(--black-3);border:1px solid var(--line-dark);border-radius:16px;padding:20px}
.cc-art{position:relative;width:96px;height:96px;display:grid;place-items:center}
.cc-ring{position:absolute;inset:0;transform:rotate(-90deg)}
.cc-ring circle{fill:none;stroke:#3C3C3C;stroke-width:3}
.cc-ring circle+circle{stroke:var(--orange);stroke-linecap:round;stroke-dasharray:100.53;
  stroke-dashoffset:calc(100.53 - 100.53 * var(--p,0) / 100);transition:stroke-dashoffset 1s ease}
.cc-pct{font-weight:700;font-size:1.5rem;color:#fff;font-variant-numeric:tabular-nums}
.cc-pct small{font-size:.8rem;color:#8E96A1;font-weight:500}
.cc-body{display:flex;flex-direction:column;gap:8px;min-width:0}
.cc-body h3{color:#fff;font-size:1.1rem}
.cc-meta{font-size:.84rem;color:#8E96A1;margin:0}
.cc-body .btn{width:auto;align-self:flex-start;padding:12px 20px;font-size:.95rem}
.cc-foot{font-size:.76rem;color:#8E96A1;margin:4px 0 0}
.cc-foot a{color:var(--orange-2);font-weight:600;text-decoration:none}
@media(max-width:480px){.course-card{grid-template-columns:1fr}.cc-art{margin-inline:auto}.cc-body{text-align:center;align-items:center}}

/* ── landing episode rows ─────────────────── */
.free-pill{background:var(--yellow);color:#1C1C1C;font-size:.62rem;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;padding:2px 7px;border-radius:999px}
.ep .play.locked{background:#3C3C3C}
a.ep{text-decoration:none}
.tnote{font-size:.84rem;color:var(--ink-3);margin-top:12px;max-width:70ch}

/* ── watch page ───────────────────────────── */
body[data-page="watch"]{background:var(--black-2);color:#E8EBEF}
body[data-page="watch"] .page{position:relative;z-index:1}
body[data-page="watch"] .top{background:transparent;border-bottom-color:rgba(255,255,255,.06)}
.art{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.art .drift{position:absolute;inset:0}
.art svg{position:absolute;top:4vh;left:50%;height:96vh;width:auto;transform:translateX(-50%);
  color:var(--orange-2);fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.art svg.ghost{opacity:.13}
.art svg.ink use{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.7s cubic-bezier(.45,0,.2,1)}
.art svg.ink use.on{stroke-dashoffset:0}
.art.done svg.ink{color:#F2A93B;filter:drop-shadow(0 0 7px rgba(242,169,59,.55));transition:color 2.4s ease,filter 2.4s ease}
.art.done svg.ghost{opacity:.22;transition:opacity 2.4s ease}
.veil{position:absolute;inset:0;background:radial-gradient(60% 55% at 50% 42%,rgba(20,20,20,0) 0%,rgba(20,20,20,.55) 75%,rgba(20,20,20,.9) 100%)}
@media(min-width:980px){
  .art svg{left:max(2vw, calc((100vw - var(--wrap-wide)) / 2 + 8px));right:auto;transform:none;top:9vh;
    width:min(34vw, calc(88vh * 0.7467));height:auto}
  .art svg.ghost{opacity:.16}
  .veil{background:linear-gradient(90deg,rgba(20,20,20,.2) 0%,rgba(20,20,20,.45) 42%,rgba(20,20,20,.92) 62%)}
}
@supports (animation-timeline: scroll()){
  .art .drift{animation:drift linear both;animation-timeline:scroll(root)}
  @keyframes drift{from{transform:translateY(0) scale(1)}to{transform:translateY(-9%) scale(1.045)}}
}
@media (prefers-reduced-motion: reduce){.art .drift{animation:none}.art svg.ink use{transition:none}}

/* phone: heading, player, episode info, panels, list. Laptop: the side column (title, festival line, now playing,
   progress) on the left over the Ganesh sketch, the player in the middle with the Samagri and Timings panels under
   it, and the list of twelve on the right, sticky and scrolling inside its column */
.watch-grid{max-width:var(--wrap-wide);margin:0 auto;padding:6px var(--gut) 60px;display:grid;gap:22px;
  grid-template-areas:"head" "player" "info" "list" "panels"}   /* on a phone the twelve episodes follow the player; the panels and the share button close the page (Shiban, 8 September) */
.watch-side{display:contents}
.watch-grid section{padding:0}   /* the landing bands pad every section; these blocks are not bands */
.watch-head{grid-area:head}
.watch-player{grid-area:player;min-width:0}
.watch-info{grid-area:info;display:flex;flex-direction:column;gap:14px;min-width:0}
.watch-panels{grid-area:panels;display:flex;flex-direction:column;gap:14px;min-width:0}
.watch-list{grid-area:list;min-width:0}
body[data-page="watch"]{padding-bottom:0}
body[data-page="watch"] .top .wrap{max-width:var(--wrap-wide)}
@media(min-width:980px){
  .watch-grid{grid-template-columns:minmax(280px,300px) minmax(0,1fr) minmax(320px,360px);grid-template-rows:auto 1fr;
    grid-template-areas:"side player list" "side panels list";gap:22px 32px;align-items:start}
  .watch-side{display:flex;flex-direction:column;gap:22px;grid-area:side;min-width:0}
  .mini-art{display:none}
}
@media(max-width:979px){.watch-head h1{font-size:1.32rem;margin-top:4px}}
.watch-head .kicker{color:var(--orange-2)}
.watch-head h1{font-size:clamp(1.5rem,3.4vw,2.1rem);color:#fff;margin:6px 0 0;text-wrap:balance;letter-spacing:-.01em}
.fest{color:#F2A93B;font-size:.9rem;font-weight:500;margin:10px 0 0;line-height:1.45}
.fest.sub{color:#E8EBEF;font-weight:400;margin-top:6px}
.watch-head .quick{margin-top:14px;display:flex;flex-direction:column;gap:8px}
.watch-head .ql{font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#8E96A1}
.watch-head .qbtns{display:flex;flex-wrap:wrap;gap:8px}
.watch-head .qb{display:inline-flex;align-items:center;gap:8px;border:1px solid #3E3E3E;background:rgba(29,29,29,.7);color:#E8EBEF;
  border-radius:999px;padding:6px 12px 6px 6px;font:inherit;font-size:.82rem;cursor:pointer;text-align:left}
.watch-head .qb b{width:22px;height:22px;border-radius:50%;background:var(--orange);color:#fff;display:grid;place-items:center;font-size:.72rem;font-weight:700;flex:none}
.watch-head .qb:hover{border-color:var(--orange-2)}
.progrow{display:flex;align-items:center;gap:14px}
.mini-art{position:relative;width:58px;height:78px;flex:none}
.mini-art svg{position:absolute;inset:0;width:100%;height:100%;color:var(--orange-2);fill:none;stroke:currentColor;stroke-width:24;stroke-linecap:round;stroke-linejoin:round}
.mini-art svg.ghost{opacity:.22}
.mini-art svg.ink use{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.7s cubic-bezier(.45,0,.2,1)}
.mini-art svg.ink use.on{stroke-dashoffset:0}
.mini-art.done svg.ink{color:#F2A93B}
.cap{margin:4px 0 0;font-size:.78rem;color:#8E96A1}
@keyframes inkpulse{0%,100%{filter:none}50%{filter:drop-shadow(0 0 9px #F2A93B) drop-shadow(0 0 2px #fff)}}
svg.ink use.pulse{animation:inkpulse 1.3s ease-in-out 2}
.watch-grid .share{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;margin-top:4px;color:#C9CDD4;text-decoration:none;
  font-size:.84rem;font-weight:500;border:1px solid #3E3E3E;border-radius:999px;padding:8px 14px}
.watch-grid .share svg{width:16px;height:16px;color:var(--green)}
.watch-grid .share:hover{border-color:var(--green);color:#fff}
.player-slot{position:relative}
.watch-grid .player{aspect-ratio:9/16;border-radius:14px;overflow:hidden;position:relative;border:1px solid var(--line-dark);
  background:#0f0f0f;display:block;max-height:78vh;max-width:calc(78vh * 9 / 16);margin-inline:auto;width:100%}
.watch-grid .frame,.watch-grid .frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.watch-grid .player .frame-note{position:absolute;inset:0;display:grid;place-items:center;color:#8E96A1;font-size:.86rem;text-align:center;padding:20px}
.free-tag{position:absolute;top:14px;left:14px;background:var(--yellow);color:#1C1C1C;font-size:.66rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;padding:5px 9px;border-radius:999px;z-index:2}
.next,.finish{position:absolute;inset:0;z-index:3;background:rgba(20,20,20,.88);display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:10px;text-align:center;padding:20px}
.next .l{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#8E96A1}
.next .t{font-size:.98rem;font-weight:600;color:#fff;line-height:1.35}
.ring{width:54px;height:54px;border-radius:50%;background:conic-gradient(var(--orange-2) calc(var(--p,0)*1%),#333 0);display:grid;place-items:center}
.ring i{width:42px;height:42px;border-radius:50%;background:#141414;display:grid;place-items:center;font-style:normal;
  font-weight:600;font-size:1rem;font-variant-numeric:tabular-nums;color:#fff}
.next .ctl,.finish .ctl{display:flex;gap:8px;margin-top:6px}
.finish .ctl{flex-wrap:wrap;justify-content:center}
.finish .sh{font-size:1.25rem;font-weight:600;color:#F2A93B}
.finish .s{font-size:.82rem;color:#8E96A1}
.now{display:flex;flex-direction:column;gap:4px}
.now .ep{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--orange-2);background:transparent;padding:0;border:0;border-radius:0}
.now .dt{font-size:1.12rem;font-weight:600;line-height:1.35;color:#fff;text-wrap:balance}
.now .rt{font-size:.8rem;color:#8E96A1}
.prog{display:flex;align-items:baseline;gap:8px}
.prog b{font-size:1.9rem;font-weight:600;color:#fff;font-variant-numeric:tabular-nums;line-height:1}
.prog span{color:#8E96A1;font-size:.86rem}
.mala{display:flex;align-items:center;margin-top:12px;padding:6px 2px;overflow:visible}
.bead{flex:1 1 0;display:flex;align-items:center;min-width:0}
.bead::after{content:"";flex:1;height:1px;background:#3E3E3E}
.bead:last-child::after{display:none}
.bead button{width:22px;height:22px;border-radius:50%;border:2px solid #5F6772;background:transparent;padding:0;flex:none;
  cursor:pointer;transition:background .3s,border-color .3s,box-shadow .3s}
.bead.on button{background:var(--orange-2);border-color:var(--orange-2)}
.bead.now button{border-color:var(--orange-2);box-shadow:0 0 0 4px rgba(255,153,51,.18),0 0 14px rgba(255,153,51,.6)}
.bead.on::after{background:var(--orange-2);opacity:.7}
.watch-grid .ctl{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.watch-grid .btn.ghost{border:1px solid #3E3E3E;color:#C9CDD4;background:transparent;font-weight:500;display:inline-flex;align-items:center;gap:9px}
.watch-grid .btn.ghost .sw{width:30px;height:17px;border-radius:999px;background:var(--green);position:relative;flex:none}
.watch-grid .btn.ghost .sw::after{content:"";position:absolute;top:2px;right:2px;width:13px;height:13px;border-radius:50%;background:#fff}
.watch-grid .btn.ghost[aria-pressed="false"] .sw{background:#4A4A4A}
.watch-grid .btn.ghost[aria-pressed="false"] .sw::after{right:auto;left:2px}
.watch-list .hd{display:flex;justify-content:space-between;align-items:baseline;padding:0 4px 10px}
.watch-list .hd h2{font-size:1rem;color:#fff;margin:0}
.watch-list .hd span{font-size:.8rem;color:#8E96A1}
.watch-list .rows{display:grid;gap:1px;background:#333;border:1px solid #333;border-radius:14px;overflow:hidden}
.watch-list .row{display:grid;grid-template-columns:22px 34px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;
  background:rgba(29,29,29,.86);text-align:left;border:0;width:100%;cursor:pointer;color:inherit;font:inherit}
.watch-list .row:hover{background:rgba(42,42,42,.9)}
.watch-list .row .n{font-weight:600;color:#8E96A1;font-variant-numeric:tabular-nums;font-size:.9rem}
.watch-list .row .th{width:34px;aspect-ratio:9/16;border-radius:6px;background:linear-gradient(160deg,#4A1A08,#1D1D1D 70%) center/cover no-repeat;border:1px solid #3E3E3E;flex:none}
.watch-list .row .t{display:flex;flex-direction:column;gap:2px;min-width:0}
.watch-list .row .t .d{font-size:.94rem;font-weight:500;line-height:1.35;color:#fff;overflow-wrap:anywhere}
.watch-list .row .t .r{font-size:.74rem;color:#8E96A1}
.watch-list .row .st{font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#5F6772;
  white-space:nowrap;display:inline-flex;align-items:center;gap:6px;font-variant-numeric:tabular-nums}
.watch-list .row.on .n,.watch-list .row.on .st{color:var(--orange-2)}
.watch-list .row.now{background:rgba(255,109,7,.10);box-shadow:inset 3px 0 0 var(--orange)}
.watch-list .row.now .st{color:#fff}
.watch-list .row .tick{width:16px;height:16px;border-radius:50%;background:var(--orange-2);display:none;place-items:center}
.watch-list .row .tick::after{content:"";width:5px;height:9px;border:solid #1C1C1C;border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
.watch-list .row.on .tick{display:grid}
/* logged in and already the owner: the selling pages say so and point at the course */
.owned-strip{background:var(--green);color:#fff;text-align:center;padding:10px 14px;font-weight:600;font-size:.9rem;position:relative;z-index:5}
.owned-strip a{color:#fff;text-decoration:underline;margin-left:8px}
.owned-strip.login-strip{background:var(--orange)}
.owns-course .sticky{display:none}
/* the two panels under the player: dark cards, folded until opened */
.watch-panels details{border:1px solid #333;border-radius:14px;background:rgba(20,20,20,.6)}
.watch-panels summary{padding:14px 16px;font-weight:600;font-size:.95rem;cursor:pointer;list-style:none;display:flex;align-items:center;gap:12px;color:#fff}
.watch-panels summary::-webkit-details-marker{display:none}
.watch-panels summary .tl{flex:1}
.watch-panels summary .cnt{font-size:.8rem;font-weight:500;color:#8E96A1;font-variant-numeric:tabular-nums}
.watch-panels summary::after{content:"+";color:#8E96A1;font-weight:400}
.watch-panels details[open] summary::after{content:"-"}
.watch-panels details .in{padding:0 16px 16px;font-size:.86rem;color:#8E96A1}
.watch-panels .pnote{margin:0;font-size:.84rem;color:#8E96A1}
.watch-panels .samagri{margin-top:10px;background:#333;border-color:#333;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.watch-panels .samagri li{background:#1D1D1D;color:#B4BAC3;cursor:pointer;user-select:none}
.watch-panels .samagri li:hover{background:#242424}
.watch-panels .samagri li:focus-visible{outline:2px solid var(--orange-2);outline-offset:-2px}
.watch-panels .samagri b{color:#fff}
.watch-panels .samagri i{color:#8E96A1}
.watch-panels .samagri .bx{border-color:#4A4A4A;position:relative;transition:background .2s,border-color .2s}
.watch-panels .samagri li.on .bx{background:var(--orange-2);border-color:var(--orange-2)}
.watch-panels .samagri li.on .bx::after{content:"";position:absolute;left:5px;top:1px;width:4px;height:9px;border:solid #1C1C1C;border-width:0 2px 2px 0;transform:rotate(45deg)}
.watch-panels .samagri li.on b{color:#8E96A1}
.watch-panels .pshare{display:inline-flex;align-items:center;gap:8px;margin-top:14px;color:#C9CDD4;text-decoration:none;font-size:.84rem;font-weight:500;
  border:1px solid #3E3E3E;border-radius:999px;padding:7px 12px}
.watch-panels .pshare svg{width:16px;height:16px;color:var(--green)}
.watch-panels .pshare:hover{border-color:var(--green);color:#fff}
.watch-panels .times{background:#1D1D1D;border-color:#333;margin-top:10px}
.watch-panels .times .hd{background:#242424;border-color:#333}
.watch-panels .times .hd b,.watch-panels .times .tr b{color:#fff}
.watch-panels .times .tr{border-color:#333}
.watch-panels .times .tr i{color:#8E96A1}
.watch-panels .times .tr .v{color:var(--orange-2)}
.watch-panels .times .tr.hot{background:rgba(255,109,7,.08)}
.watch-panels .tnote{color:#8E96A1}
.watch-panels .tnote a{color:var(--orange-2);font-weight:600;text-decoration:none}
/* the finish card and the player's error state */
.finish .s2{font-size:.86rem;color:#E8EBEF;max-width:34ch;line-height:1.45}
.finish .again{color:#8E96A1;font-size:.8rem;margin-top:6px}
.watch-grid .player .frame-note{align-content:center;gap:12px}
.frame-note .wa{color:var(--orange-2);font-size:.86rem;text-decoration:none;font-weight:600}
/* beads are small; the tap target is not */
.bead button{position:relative}
.bead button::before{content:"";position:absolute;inset:-9px}
/* the password eye */
.pwbox{position:relative;display:block}
.pwbox input{width:100%;padding-right:46px;box-sizing:border-box}
.eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:0;background:transparent;color:#8E96A1;
  cursor:pointer;display:grid;place-items:center;border-radius:8px;padding:0}
.eye svg{width:20px;height:20px}
.eye:hover{color:var(--ink)}
.panel.dark .eye:hover,body[data-page="watch"] .eye:hover{color:#fff}
.eye.on{color:var(--orange-2)}
/* success and profile: spacing, wrapping, one-card width */
#sx-pass{margin-top:22px}
.ghostlink{text-align:center}
.ghostlink small{display:block;font-size:.74rem;color:#8E96A1;font-weight:500;margin-top:2px}
.cc-foot a{white-space:nowrap}
.cc-links{display:flex;flex-wrap:wrap;gap:14px;margin:0}
.cc-links a{font-size:.84rem;color:var(--orange-2);font-weight:600;text-decoration:none}
.course-card:only-child{grid-column:1/-1;max-width:720px}
@media(max-width:480px){.cc-body .btn{align-self:center}.cc-links{justify-content:center}}
#w-loading.tall{min-height:60vh;display:flex;align-items:center;justify-content:center;color:#8E96A1}
body[data-page="watch"] footer{position:relative;z-index:1}
/* the player shrinks to a corner when you scroll down the list on a phone */
@media(max-width:979px){
  .watch-grid .player.mini{position:fixed;top:8px;right:8px;width:104px;max-height:185px;z-index:30;
    box-shadow:0 14px 34px -12px rgba(0,0,0,.9);border-color:#3E3E3E}
  .watch-grid .player.mini .free-tag{display:none}
}

/* ── LANDING ADDITIONS (4 September 2026) ── */
.try-banner{background:var(--yellow);color:#1C1C1C;text-align:center;font-weight:600;font-size:.86rem;padding:9px 14px}
.player{text-decoration:none;display:grid}
.player .tagl.free{background:var(--yellow);color:#1C1C1C}
.player .cap{position:absolute;left:14px;right:14px;bottom:14px;color:#fff;font-weight:600;font-size:.95rem;
  text-shadow:0 1px 8px rgba(0,0,0,.7);text-align:left;line-height:1.35}
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(10,10,10,.93);display:flex;align-items:center;justify-content:center;padding:14px}
.lightbox .lb-frame{position:relative;height:min(92vh,calc((100vw - 28px) * 16 / 9));aspect-ratio:9/16;max-width:100%;
  background:#000;border-radius:14px;overflow:hidden;border:1px solid var(--line-dark)}
.lightbox iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lightbox .frame-note{position:absolute;inset:0;display:grid;place-items:center;color:#8E96A1;font-size:.9rem;text-align:center;padding:20px}
.lightbox .lb-x{position:absolute;top:12px;right:12px;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.3);
  background:rgba(20,20,20,.75);color:#fff;font-size:1.5rem;line-height:1;cursor:pointer;z-index:2}
.lightbox .lb-cta{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:2;width:auto;padding:12px 20px;font-size:.95rem;white-space:nowrap}
.sticky .pr small{display:block;font-size:.8rem;color:#8E96A1;font-weight:500;margin-top:3px}
.sticky .pr b .only{font-size:.8rem;font-weight:600;color:#D7DBE1;margin:0 5px;vertical-align:middle;letter-spacing:0}
.sticky .pr small em{font-style:normal;font-weight:700;font-size:1.1rem;color:var(--orange-2);margin-left:2px}
.sticky .btn small{display:inline-flex;align-items:baseline;gap:5px;font-size:.72rem}
.sticky .btn small b{font-size:2em;font-weight:700;line-height:1}
.eps a.ep .n{background:var(--yellow);color:#1C1C1C}
.stackbox .tot .amt small{display:block}

/* a light panel inside a dark band keeps dark text */
.on-dark .panel:not(.dark) .field label{color:var(--ink)}
.on-dark .panel:not(.dark) .field .hint{color:var(--ink-3)}
.on-dark .panel:not(.dark) .form-error{color:#B3261E;background:rgba(255,2,2,.06);border-color:rgba(255,2,2,.25)}
.on-dark .panel:not(.dark) .form-error.ok{color:#1E7A48;background:rgba(30,158,90,.08);border-color:rgba(30,158,90,.35)}
.on-dark .panel:not(.dark) .alt{color:var(--ink-3)}
.on-dark .panel:not(.dark) .btn.ghost{color:var(--orange-text)}

/* Hindi labels are longer: keep the header on one line and let the order summary stack on narrow phones */
.top-right .who a,.lang a{white-space:nowrap}
@media(max-width:440px){
  .top-right{gap:8px}
  .top-right .who{gap:8px;font-size:.8rem}
  .top-right .who a{padding:6px 10px}
  .lang a{padding:6px 9px}
  .osum{flex-wrap:wrap}
  .osum .amt{flex-basis:100%;display:flex;align-items:baseline;gap:8px;justify-content:flex-start;text-align:left;margin-top:6px;padding-top:10px;border-top:1px solid var(--line)}
}
@media(max-width:360px){.top-right .who b{display:none}}

/* launch offer: the listed price struck out, the discount as a small chip */
.was,.urg s,.sticky .pr s{text-decoration:line-through;opacity:.62;font-weight:500}
.rail .was{font-size:clamp(1.1rem,2.6vw,1.4rem);color:#8E96A1;margin-right:2px}
.off{display:inline-block;background:var(--green);color:#fff;font-size:.68rem;font-weight:700;letter-spacing:.06em;
  padding:3px 8px;border-radius:999px;vertical-align:middle;text-transform:uppercase;white-space:nowrap}
.hero .off{font-size:.72rem;vertical-align:2px}
.compare-line{margin-top:clamp(26px,3.5vw,36px);text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}
.compare-line b{font-size:clamp(2rem,6vw,3rem);font-weight:700;color:var(--orange);line-height:1}
.compare-line .was{font-size:clamp(1.1rem,3vw,1.5rem)}
.compare-line p{max-width:560px;color:var(--ink-2);font-size:1rem;line-height:1.55;margin:0}
.compare-line .btn{margin-top:6px}
.offer-line{margin:0 0 8px;font-size:.82rem;color:var(--green);font-weight:600}
.osum .amt s{display:block;font-size:.76rem;color:var(--ink-3);font-weight:500;text-decoration:line-through}
/* the total never breaks in two, even when the struck price makes the label long */
.sidecard .tot b{white-space:nowrap}
.sidecard .tot span{padding-right:10px}

/* ═════════════════════════════════════════════
   LANDING REBUILD (7 September 2026)
   The hero splits copy left / media right, and
   four new blocks: the badge strip, the six
   question tiles, the "what you get" list and
   the three how-it-was-made cards. Theme tokens
   only — no new colours, sizes or radii.
   ═════════════════════════════════════════════ */

/* ── hero: copy on the left, media on the right ── */
.herotop{display:grid;gap:clamp(24px,4vw,44px);grid-template-columns:1fr;align-items:center}
@media(min-width:900px){.herotop{grid-template-columns:1.05fr .95fr}}
.hcopy{display:flex;flex-direction:column;gap:clamp(14px,2vw,20px);text-align:left}
.hcopy h1{text-align:left}
.hcopy .sub{max-width:56ch;margin:0;text-align:left}
.invoke{font-size:clamp(1rem,2.4vw,1.22rem);color:var(--orange-2);letter-spacing:.02em}
.pricelede{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;
  font-size:clamp(1.15rem,3vw,1.5rem);font-weight:600;color:#fff}
.pricelede .was{font-size:.82em;color:#8E96A1}
.pricelede mark{font-size:1.08em}
.pricelede .valid{font-size:.6em;font-weight:500;color:#D7DBE1;letter-spacing:.01em}
.btnrow.left{align-items:flex-start;margin-top:2px}
.btnrow.left .btnnote{text-align:left}
.hmedia{display:flex;flex-direction:column;gap:12px}

/* the Ganesh Chaturthi image or GIF, until the real asset lands */
.heromedia{aspect-ratio:4/3;border-radius:14px;border:1px dashed var(--line-dark);position:relative;
  overflow:hidden;background:linear-gradient(150deg,#2A1409,#1D1D1D 58%,#2A2A2A);
  display:grid;place-items:center;box-shadow:0 26px 60px -34px rgba(0,0,0,.9)}
.heromedia .halo{position:absolute;width:70%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(255,109,7,.22),transparent 68%)}
.heromedia .ph{position:relative;font-size:.74rem;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:#8E96A1;text-align:center;padding:0 22px;line-height:1.7}

/* ── trust badge strip, under the hero ────────── */
.badges{background:var(--black-2);border-bottom:1px solid var(--line-dark)}
.badges .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:10px 22px;padding-block:14px}
.badge{display:inline-flex;align-items:center;gap:8px;font-size:.86rem;font-weight:500;color:#D7DBE1}
.badge svg{flex:none;width:15px;height:15px;color:var(--green)}

/* ── the six question tiles ───────────────────── */
.tiles{display:grid;gap:clamp(12px,1.8vw,18px);grid-template-columns:1fr;margin-top:clamp(26px,3.5vw,38px)}
@media(min-width:640px){.tiles{grid-template-columns:1fr 1fr}}
@media(min-width:960px){.tiles{grid-template-columns:repeat(3,1fr)}}
.tile{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:22px 20px;
  display:flex;flex-direction:column;gap:9px;transition:transform .18s,box-shadow .18s}
.tile:hover{transform:translateY(-3px);box-shadow:0 16px 34px -22px rgba(28,28,28,.4)}
.tile .n{width:30px;height:30px;border-radius:8px;background:rgba(255,109,7,.1);color:var(--orange-text);
  display:grid;place-items:center;font-weight:700;font-size:.9rem;flex:none}
.tile h3{font-size:clamp(1rem,2vw,1.13rem)}
.tile p{font-size:.92rem;color:var(--ink-2)}

/* ── what the price covers ────────────────────── */
.gets{list-style:none;margin:clamp(26px,3.5vw,36px) auto 0;padding:0;max-width:760px;
  display:grid;gap:10px;grid-template-columns:1fr}
@media(min-width:700px){.gets{grid-template-columns:1fr 1fr}}
.gets li{background:var(--black-3);border:1px solid var(--line-dark);border-radius:10px;
  padding:15px 17px;display:flex;gap:11px;align-items:flex-start}
.gets svg{flex:none;width:17px;height:17px;margin-top:4px;color:var(--green)}
.gets b{display:block;color:#fff;font-weight:600;font-size:.95rem;line-height:1.4}
.gets i{display:block;font-style:normal;color:#B4BAC3;font-size:.86rem;margin-top:3px;line-height:1.5}
.getsline{max-width:640px;margin:clamp(22px,3vw,30px) auto 0;text-align:center;color:var(--orange-2);
  font-size:clamp(1rem,2.2vw,1.16rem);font-weight:600;line-height:1.5}

/* ── how the guide was made ───────────────────── */
.made{display:grid;gap:12px;grid-template-columns:1fr}
.madecard{background:var(--white);border:1px solid var(--line);border-left:3px solid var(--orange);
  border-radius:10px;padding:17px 19px;display:flex;flex-direction:column;gap:5px}
.madecard h3{font-size:clamp(1rem,2vw,1.12rem)}
.madecard p{font-size:.91rem;color:var(--ink-2)}

/* ── the bonus artwork, until the files exist ─── */
.bonuswrap{max-width:760px;margin:clamp(20px,2.6vw,28px) auto 0}
.bonusnote{text-align:center;font-size:.82rem;color:#8E96A1;margin-bottom:14px}
.bonusrow{display:grid;gap:12px;grid-template-columns:repeat(3,1fr)}
.bonus{margin:0;display:flex;flex-direction:column;gap:8px}
.bonus .frame{aspect-ratio:3/4;border-radius:10px;border:1px dashed var(--line-dark);position:relative;
  overflow:hidden;background:linear-gradient(160deg,#2A1409,#1D1D1D 60%,#2A2A2A);display:grid;place-items:center}
.bonus .ph{position:relative;font-size:.6rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:#8E96A1;text-align:center;padding:0 10px;line-height:1.6}
.bonus .wall{position:absolute;inset:8px;display:grid;grid-template-columns:repeat(2,1fr);
  grid-template-rows:repeat(4,1fr);gap:4px;opacity:.5}
.bonus .wall i{background:rgba(255,109,7,.14);border-radius:3px}
.bonus figcaption{text-align:center;font-size:.8rem;color:#D7DBE1}
.bonus figcaption b{font-weight:600}

/* ── downloads panel on the watch page ────────── */
.dl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.dl li{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;justify-content:space-between;
  background:var(--black-3);border:1px solid var(--line-dark);border-radius:10px;padding:14px 16px}
.dl .dl-b{display:flex;flex-direction:column;gap:3px;min-width:min(100%,15rem);flex:1}
.dl .dl-b b{color:#fff;font-weight:600;font-size:.95rem;line-height:1.4}
.dl .dl-b i{font-style:normal;color:#B4BAC3;font-size:.86rem;line-height:1.5}
.dl-get{display:inline-flex;align-items:center;gap:8px;flex:none;text-decoration:none;font-weight:600;
  font-size:.84rem;color:var(--orange-2);border:1px solid rgba(255,109,7,.5);border-radius:var(--r);padding:9px 14px}
.dl-get:hover{background:rgba(255,109,7,.12)}
.dl-get svg{width:16px;height:16px;flex:none}
.dl-soon{flex:none;font-size:.78rem;color:#8E96A1;max-width:22rem}
.bonusnote .soon{color:var(--orange-2)}

/* ═════════════════════════════════════════════
   LANDING, 8 September 2026
   Log in in the header, the hero loop, the four
   temple loops, the wallpaper samples, the pandit
   ji photograph with three bullets. Theme tokens
   only.
   ═════════════════════════════════════════════ */
.top-right .lgin{color:#A8B1C0;text-decoration:none;border:1px solid var(--line-dark);border-radius:999px;padding:7px 13px;font-size:.84rem;white-space:nowrap}
.top-right .lgin:hover,.top-right .lgin:focus-visible{color:#fff;border-color:var(--orange)}
@media(max-width:480px){.top-right .lgin{padding:6px 10px;font-size:.8rem}}

/* the hero loop: the square artwork, whole, at every width */
.heromedia.live{border:0;aspect-ratio:1;display:block;background:#1D1D1D;width:100%;max-width:560px;margin-inline:auto}
.heromedia.live video,.heromedia.live img{width:100%;height:100%;object-fit:cover;display:block}

.credit{font-size:.74rem;color:var(--ink-3);text-align:center;margin-top:14px}

/* ── the four temples ─────────────────────────── */
.temples{display:grid;gap:clamp(10px,1.6vw,16px);grid-template-columns:1fr 1fr;margin-top:clamp(26px,3.5vw,38px)}
@media(min-width:900px){.temples{grid-template-columns:repeat(4,1fr)}}
.temple{margin:0;display:flex;flex-direction:column;gap:9px;min-width:0}
.tframe{aspect-ratio:1;border-radius:12px;overflow:hidden;background:#F5EFE2;border:1px solid var(--line);
  box-shadow:0 18px 40px -30px rgba(28,28,28,.45)}
.tframe video,.tframe img{width:100%;height:100%;object-fit:cover;display:block}
.temple figcaption{display:flex;flex-direction:column;gap:2px;text-align:center}
.temple figcaption b{font-weight:600;font-size:.95rem;color:var(--ink)}
.temple figcaption span{font-size:.78rem;color:var(--ink-3)}

/* ── three wallpaper samples and the card for the rest ── */
.wallrow{display:grid;gap:clamp(10px,1.6vw,16px);grid-template-columns:1fr 1fr;max-width:920px;margin:clamp(22px,3vw,30px) auto 0}
@media(min-width:760px){.wallrow{grid-template-columns:repeat(4,1fr)}}
.wcard{margin:0;display:flex;flex-direction:column;gap:8px;min-width:0}
.wframe{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--black-3);border:1px solid var(--line-dark)}
.wframe video{width:100%;height:100%;object-fit:cover;display:block}
.wdl{position:absolute;top:10px;right:10px;width:38px;height:38px;border-radius:50%;background:rgba(20,20,20,.72);color:#fff;
  display:grid;place-items:center;border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(4px);transition:background .18s,transform .18s}
.wdl svg{width:18px;height:18px}
.wdl:hover,.wdl:focus-visible{background:var(--orange);transform:translateY(-1px)}
.wcard figcaption{display:flex;flex-direction:column;gap:1px;text-align:center}
.wcard figcaption b{font-weight:600;font-size:.9rem;color:#fff}
.wcard figcaption small{font-size:.74rem;color:#8E96A1}
.wcard.more{aspect-ratio:1;border-radius:12px;border:1px dashed var(--line-dark);
  background:linear-gradient(160deg,#2A1409,#1D1D1D 60%,#2A2A2A);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:18px;text-align:center}
.wcard.more .ic{width:40px;height:40px;border-radius:50%;background:rgba(255,109,7,.14);color:var(--orange-2);display:grid;place-items:center}
.wcard.more .ic svg{width:18px;height:18px}
.wcard.more b{color:#D7DBE1;font-weight:600;font-size:.92rem;line-height:1.45}

/* ── the pandit ji photograph and the three bullets ── */
.portrait.photo{aspect-ratio:1;border:0;overflow:hidden;background:#1D1D1D;display:block;max-width:520px;margin-inline:auto;width:100%}
.portrait.photo img{width:100%;height:100%;object-fit:cover;display:block}
.teller .stack h2{text-align:left}
.made-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.made-list li{display:flex;gap:12px;align-items:center;background:var(--white);border:1px solid var(--line);border-left:3px solid var(--orange);
  border-radius:10px;padding:15px 18px;font-size:clamp(1rem,2vw,1.1rem);font-weight:600;color:var(--ink)}
.made-list svg{flex:none;width:18px;height:18px;color:var(--green)}

/* ═════════════════════════════════════════════
   DOWNLOADS PANEL, 8 September 2026
   The PDF, the fifteen wallpapers as a grid, a
   viewer that plays the loop and saves the GIF.
   ═════════════════════════════════════════════ */
.dl-card{display:flex;align-items:center;gap:14px;text-decoration:none;background:var(--black-3);border:1px solid var(--line-dark);
  border-radius:12px;padding:14px 16px;margin-top:12px;transition:border-color .18s}
.dl-card:hover,.dl-card:focus-visible{border-color:var(--orange)}
.dl-card .dl-ic{width:40px;height:40px;border-radius:10px;background:rgba(255,109,7,.14);color:var(--orange-2);display:grid;place-items:center;flex:none}
.dl-card .dl-ic svg{width:20px;height:20px}
.dl-card .dl-b{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.dl-card .dl-b b{color:#fff;font-weight:600;font-size:.95rem;line-height:1.4}
.dl-card .dl-b i{font-style:normal;color:#B4BAC3;font-size:.84rem;line-height:1.5}
.dl-card .dl-get{flex:none}
@media(max-width:560px){.dl-card{display:grid;grid-template-columns:40px 1fr;gap:10px 14px;align-items:center}.dl-card .dl-get{grid-column:2;justify-self:start}}
.wp-head{display:flex;flex-direction:column;gap:3px;margin-top:20px}
.wp-head b{color:#fff;font-weight:600;font-size:.95rem}
.wp-head i{font-style:normal;color:#8E96A1;font-size:.84rem;line-height:1.5}
.wp-grid{display:grid;gap:8px;grid-template-columns:repeat(3,1fr);margin-top:12px}
@media(min-width:600px){.wp-grid{grid-template-columns:repeat(5,1fr)}}
.wp{appearance:none;padding:0;background:var(--black-3);border-radius:10px;overflow:hidden;cursor:pointer;display:flex;flex-direction:column;
  text-align:left;border:1px solid var(--line-dark);transition:transform .18s,border-color .18s;font-family:inherit}
.wp:hover,.wp:focus-visible{transform:translateY(-2px);border-color:var(--orange);outline:none}
.wp img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;display:block}
.wp .wp-n{font-size:.72rem;color:#B4BAC3;padding:6px 8px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}
.watch-panels .dl{margin-top:16px}
.dl .dl-soon{flex:1 1 100%;max-width:none;white-space:normal}

.lightbox.wpv{z-index:200}
.wpv-box{position:relative;width:min(100%,520px);display:flex;flex-direction:column;gap:12px;padding:52px 0 8px}
.wpv-stage{aspect-ratio:1;border-radius:14px;overflow:hidden;background:#000;width:100%;max-width:calc(100vh - 210px);margin-inline:auto}
.wpv-stage video{width:100%;height:100%;object-fit:cover;display:block}
.wpv-meta{display:flex;justify-content:space-between;align-items:baseline;gap:12px;color:#fff}
.wpv-meta b{font-weight:600;font-size:1rem}
.wpv-meta span{font-size:.8rem;color:#8E96A1;font-variant-numeric:tabular-nums}
.wpv-ctl{display:flex;align-items:center;justify-content:space-between;gap:10px}
.wpv-nav{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.06);color:#fff;
  font-size:1.6rem;line-height:1;cursor:pointer;flex:none;font-family:inherit}
.wpv-nav:hover,.wpv-nav:focus-visible{background:var(--orange);border-color:var(--orange)}
.wpv-dl{flex:1;width:auto;max-width:none}
.lightbox.wpv .lb-x{top:8px;right:0}

/* the course intro sits first in the list with no number (9 September 2026) */
.watch-list .row.intro .n::before{content:"";display:block;width:0;height:0;margin:auto;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent #8E96A1}

/* the certificate after the twelfth episode (9 September 2026): a row under the mala once the course is done,
   and a dialog that leads with the card and Share on WhatsApp; the photo and the name come after, as "make it yours" */
.certrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:12px;
  background:linear-gradient(135deg,rgba(242,169,59,.16),rgba(255,109,7,.1));border:1px solid rgba(242,169,59,.35)}
.certrow span{font-size:.86rem;font-weight:600;color:#F2A93B}
.certrow .btn{flex:none}
body.noscroll{overflow:hidden}
.lightbox.cert{z-index:200;overflow:auto;align-items:flex-start;background:rgba(10,10,10,.97)}
.cert-box{position:relative;width:min(100%,440px);margin:auto;display:flex;flex-direction:column;gap:12px;padding:16px 0 28px}
.lightbox.cert .lb-x{top:8px;right:0}
.cert-head{display:flex;flex-direction:column;gap:4px;padding-right:52px}
.cert-head b{font-size:1.25rem;font-weight:600;color:#F2A93B;line-height:1.25}
.cert-head span{font-size:.88rem;color:#D7DBE1;line-height:1.45}
.cert-stage{width:100%;aspect-ratio:4/5;border-radius:14px;overflow:hidden;background:#4A0C0C;box-shadow:0 10px 40px rgba(0,0,0,.5)}
.cert-stage canvas,.cert-stage img{display:block;width:100%;height:100%}
.cert-act{display:flex;gap:10px}
.cert-act .btn{flex:1;width:auto;max-width:none;flex-direction:row;gap:8px;padding:14px 12px;font-size:1rem}
.cert-act .btn svg{width:20px;height:20px;flex:none}
.cert-act .btn.wa{flex:1.6;background:#25D366;color:#062E17;border:2px solid #25D366}
.cert-act .btn[disabled]{opacity:.5;cursor:default}
.cert-note{color:#E8EBEF;font-size:.86rem;text-align:center;margin:0;line-height:1.45}
.cert-own{display:flex;flex-direction:column;gap:12px;margin-top:6px;padding-top:14px;border-top:1px solid rgba(255,255,255,.12)}
.cert-own-h{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#8E96A1}
.cert-photo{display:flex;gap:10px;flex-wrap:wrap}
.cert-photo .btn{flex:1;width:auto;max-width:none}
.cert-crop{display:flex;gap:14px;align-items:center}
.cert-crop-stage{flex:none;width:150px;height:150px;border-radius:20px;overflow:hidden;border:3px solid #D9A83E;background:#2a0606;touch-action:none}
.cert-crop-stage canvas{display:block;width:100%;height:100%;cursor:grab}
.cert-crop-side{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px}
.cert-crop-hint{margin:0;color:#E8EBEF;font-size:.82rem;line-height:1.45}
.cert-zoom{display:flex;align-items:center;gap:10px;color:#8E96A1;font-size:.78rem}
.cert-zoom input{flex:1;accent-color:var(--orange);min-width:0}
.cert-name{display:flex;flex-direction:column;gap:6px;color:#8E96A1;font-size:.8rem}
.cert-name input{width:100%;padding:12px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:#fff;font:inherit;font-size:1rem}
.cert-name input:focus{outline:2px solid var(--orange);outline-offset:1px}

/* the language dropdown (four languages since 10 September 2026): a pill that shows the current language
   in its own script and opens the phone's own picker */
.lang{display:inline-flex;align-items:center;border:1px solid rgba(255,109,7,.55);border-radius:999px;padding:0;overflow:hidden}
.lang select{appearance:none;-webkit-appearance:none;border:0;background:transparent;color:#fff;font:inherit;font-size:.8rem;font-weight:600;
  padding:6px 26px 6px 12px;border-radius:999px;cursor:pointer;max-width:132px;line-height:1.3;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23FF9933' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;background-size:11px}
.lang select option{color:#111;background:#fff}
.lang select:focus-visible{outline:2px solid var(--orange);outline-offset:1px}
@media (max-width:420px){.lang select{padding:6px 22px 6px 9px;font-size:.76rem;max-width:112px;background-position:right 7px center}}

/* the admin reports page (11 September 2026) */
.admin-page h3{margin-top:28px;font-size:1.1rem}
.admin-page .small{font-size:.86rem;line-height:1.5}
.adm-range{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:14px 0 6px}
.adm-range label{display:inline-flex;align-items:center;gap:6px;font-size:.86rem;color:var(--ink-2)}
.adm-range input{padding:8px 10px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:.9rem;background:var(--white)}
.adm-range .btn.small{width:auto}
.adm-all{display:inline-flex;align-items:center;gap:6px;margin-left:10px;white-space:nowrap}
.adm-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.adm-t{width:100%;border-collapse:collapse;font-size:.9rem;background:var(--white);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.adm-t th,.adm-t td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);white-space:nowrap;vertical-align:top}
.adm-t th{font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);background:var(--off)}
.adm-t td.num,.adm-t th.num{text-align:right;font-variant-numeric:tabular-nums}
.adm-t tr.paid td{color:var(--ink-2)}
.adm-t a{color:var(--orange-text)}
#pf-admin{margin:-6px 0 14px}