/* ================================
   AI Shikhi Library — shared site chrome
   Brand: warm cream + ink + amber/teal, matching the existing books
================================ */
@font-face{
  font-family:'Nikosh';
  src:url('/assets/fonts/Nikosh.ttf') format('truetype');
  font-weight:400 700;
  font-display:swap;
}
:root{
  --ink:#0F1923;
  --amber:#D97706;
  --amber2:#F59E0B;
  --teal:#0D9488;
  --cream:#FFFBF0;
  --slate:#374151;
  --muted:#6B7280;
  --line:#EAE3D3;
  --pink:#E91E8C;
  --green:#16A34A;
  --blue:#1D4ED8;
}

*{box-sizing:border-box;}

.lib-body{
  margin:0;
  background-color:var(--cream);
  background-image:radial-gradient(circle at 1px 1px, rgba(15,25,35,.05) 1px, transparent 0);
  background-size:28px 28px;
  color:var(--ink);
  font-family:'Nikosh','Lora',Georgia,serif;
}

/* ---------- top bar (injected into every book page) ---------- */
.lib-topbar{
  position:sticky; top:0; z-index:999;
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding:13px 24px;
  background:linear-gradient(100deg,#0F1923 0%,#1A2C42 55%,#0F1923 100%);
  color:#fff;
  font-family:'Nikosh','Lora',sans-serif;
  font-size:14px;
  border-bottom:2px solid transparent;
  border-image:linear-gradient(90deg,var(--amber),var(--teal),var(--pink)) 1;
  box-shadow:0 6px 28px rgba(0,0,0,.18);
  transition:padding .2s;
}
.lib-topbar a{color:#fff; text-decoration:none;}
.lib-topbar .lib-brand{display:flex; align-items:center; gap:9px; font-weight:700; letter-spacing:.01em; transition:opacity .15s;}
.lib-topbar .lib-brand:hover{opacity:.85;}
.lib-topbar .lib-mark{
  width:26px; height:26px; border-radius:7px;
  background:linear-gradient(135deg,var(--amber),var(--teal));
  display:flex; align-items:center; justify-content:center;
  font-weight:900; font-size:13px; color:#0F1923;
}
.lib-mark-img{width:28px;height:28px;object-fit:contain;vertical-align:middle;}
.lib-brand-full-img{height:34px;width:auto;object-fit:contain;vertical-align:middle;display:block;}
.lib-topbar .lib-back{
  padding:8px 18px; border-radius:999px;
  background:linear-gradient(135deg,var(--amber),#F59E0B);
  color:#1A1206; font-weight:700;
  font-size:13px; white-space:nowrap; transition:.2s cubic-bezier(.4,0,.2,1);
  display:inline-flex; align-items:center; gap:6px;
  box-shadow:0 4px 14px rgba(217,119,6,.35);
}
.lib-topbar .lib-back:hover{transform:translateY(-2px) translateX(-1px); box-shadow:0 6px 20px rgba(217,119,6,.5);}

/* ---------- ad slots ---------- */
.lib-ad-slot{
  margin:28px auto; max-width:900px; padding:14px;
  text-align:center;
  border:1px dashed var(--line);
  border-radius:10px;
  background:rgba(217,119,6,.04);
}
.lib-ad-slot .lib-ad-label{
  display:block; font-size:11px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--muted); margin-bottom:8px; font-family:sans-serif;
}

/* ---------- footer (injected into every book page) ---------- */
.lib-footer{
  background:var(--ink); color:#cbd5c9; padding:36px 20px 28px;
  text-align:center; font-family:'Nikosh','Lora',sans-serif; font-size:13.5px;
  margin-top:40px;
}
.lib-footer a{color:var(--amber2); text-decoration:none;}
.lib-footer a:hover{text-decoration:underline;}
.lib-footer .lib-footer-links{margin-bottom:10px; display:flex; gap:18px; justify-content:center; flex-wrap:wrap;}

/* ================================
   HOMEPAGE
================================ */
.home-header{
  padding:16px 6vw;
  display:flex; align-items:center; justify-content:space-between;
  background:rgba(255,251,240,.82); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(15,25,35,.06);
  position:sticky; top:0; z-index:50;
  transition:box-shadow .25s, padding .25s;
}
.home-header.scrolled{box-shadow:0 4px 24px rgba(15,25,35,.07); padding:11px 6vw;}
.home-brand{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink); transition:opacity .15s;}
.home-brand:hover{opacity:.85;}
.home-brand .mark{
  width:38px; height:38px; border-radius:10px;
  background:linear-gradient(135deg,var(--amber),var(--teal));
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:900; font-family:sans-serif;
}
.mark-img{width:42px;height:42px;object-fit:contain;vertical-align:middle;}
.home-brand-full-img{height:46px;width:auto;object-fit:contain;vertical-align:middle;display:block;}
.home-brand .name{font-weight:800; font-size:19px;}
.home-nav a{
  color:var(--ink); text-decoration:none; margin-left:10px; font-size:14px; font-weight:600;
  font-family:'Nikosh','Lora',sans-serif; position:relative; transition:.2s cubic-bezier(.4,0,.2,1);
  padding:8px 16px; border-radius:999px; display:inline-block;
}
.home-nav a:hover{color:#fff; background:linear-gradient(135deg,var(--amber),var(--teal)); transform:translateY(-2px); box-shadow:0 6px 16px rgba(217,119,6,.3);}

.hero{
  padding:64px 6vw 44px; text-align:center; max-width:820px; margin:0 auto;
}
.hero .eyebrow{
  display:inline-block; font-family:sans-serif; font-size:12.5px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--teal); background:rgba(13,148,136,.09);
  padding:6px 14px; border-radius:999px; margin-bottom:20px;
}
.hero h1{
  font-family:'Georgia',serif; font-weight:900; font-size:clamp(32px,5vw,52px);
  line-height:1.18; margin:0 0 18px;
}
.hero h1 .accent{color:var(--amber);}
.hero p{font-size:17px; color:var(--slate); line-height:1.75; margin:0 auto 28px; max-width:600px;}
.hero-stats{display:flex; gap:28px; justify-content:center; flex-wrap:wrap; margin-top:10px;}
.hero-stats div{text-align:center;}
.hero-stats b{display:block; font-size:24px; font-family:Georgia,serif; color:var(--ink);}
.hero-stats span{font-size:12.5px; color:var(--muted); font-family:sans-serif;}

.shelf{padding:10px 6vw 70px; max-width:1180px; margin:0 auto;}
.shelf-head{display:flex; align-items:baseline; justify-content:space-between; margin:44px 0 22px; flex-wrap:wrap; gap:10px;}
.shelf-head h2{font-family:Georgia,serif; font-size:24px; margin:0;}
.shelf-head .cat-filter{display:flex; gap:8px; flex-wrap:wrap;}
.cat-filter button{
  font-family:'Nikosh','Lora',sans-serif; font-size:13px; padding:6px 14px;
  border-radius:999px; border:1px solid var(--line); background:#fff; color:var(--slate);
  cursor:pointer; transition:.15s;
}
.cat-filter button.active, .cat-filter button:hover{background:var(--ink); color:#fff; border-color:var(--ink);}

.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:22px;}
.card{
  background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden;
  display:flex; flex-direction:column; text-decoration:none; color:var(--ink);
  box-shadow:0 3px 14px rgba(15,25,35,.05);
  transition:transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s cubic-bezier(.22,1,.36,1), border-color .3s;
}
.card:hover{transform:translateY(-6px) scale(1.012); box-shadow:0 20px 36px rgba(15,25,35,.13); border-color:rgba(217,119,6,.3);}
.card .spine{height:10px; transition:height .25s; background-image:linear-gradient(90deg,rgba(255,255,255,.25),transparent);}
.card:hover .spine{height:13px;}
.card .card-body{padding:20px 20px 22px; display:flex; flex-direction:column; flex:1;}
.card .lang-tag{
  align-self:flex-start; font-family:sans-serif; font-size:10.5px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--muted); border:1px solid var(--line);
  padding:2px 8px; border-radius:999px; margin-bottom:12px;
}
.card h3{font-family:Georgia,serif; font-size:19px; line-height:1.35; margin:0 0 10px;}
.card p{font-size:13.5px; color:var(--slate); line-height:1.65; margin:0 0 16px; flex:1;}
.card .read-cta{font-family:sans-serif; font-size:13px; font-weight:700; color:var(--amber);}

.cta-band{
  background:var(--ink); color:#fff; text-align:center; padding:56px 6vw; margin-top:20px;
}
.cta-band h2{font-family:Georgia,serif; font-size:26px; margin:0 0 12px;}
.cta-band p{color:#cbd5c9; max-width:520px; margin:0 auto 24px; font-size:14.5px;}
.cta-band a{
  display:inline-block; background:var(--amber); color:#0F1923; font-weight:800;
  padding:12px 28px; border-radius:999px; text-decoration:none; font-family:sans-serif; font-size:14px;
}

.hero{
  min-height: 92vh; display:flex; align-items:center;
  padding:110px 6vw 70px; position:relative; overflow:hidden; text-align:left; max-width:none; margin:0;
}
.hero-bg{
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse 75% 65% at 82% 35%, rgba(217,119,6,.16) 0%, transparent 70%),
    radial-gradient(ellipse 55% 55% at 18% 75%, rgba(13,148,136,.14) 0%, transparent 60%),
    radial-gradient(ellipse 40% 40% at 50% 0%, rgba(214,51,108,.08) 0%, transparent 65%),
    var(--cream);
}
.hero-grid-bg{
  position:absolute; inset:0; z-index:0; opacity:.04;
  background-image:linear-gradient(var(--ink) 1px, transparent 1px), linear-gradient(90deg, var(--ink) 1px, transparent 1px);
  background-size:48px 48px;
}
.hero-inner{position:relative; z-index:1; max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1fr 400px; gap:60px; align-items:center; width:100%;}
.hero .eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  background:linear-gradient(135deg,rgba(217,119,6,.16),rgba(13,148,136,.12));
  border:1px solid rgba(217,119,6,.35);
  padding:7px 16px; border-radius:100px; font-size:13px; font-weight:700; color:var(--amber);
  text-transform:none; letter-spacing:0; box-shadow:0 2px 10px rgba(217,119,6,.12);
}
.eyebrow .dot{width:6px; height:6px; border-radius:50%; background:var(--amber); animation:blink 2s infinite; display:inline-block;}
@keyframes blink{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.5)}}
.hero h1{font-family:'Playfair Display',Georgia,serif; font-size:clamp(36px,5.5vw,60px); font-weight:900; line-height:1.12; margin:20px 0 14px;}
.hero p{font-size:18px; color:var(--slate); margin:0 0 30px; line-height:1.7; max-width:none;}
.hero-stats{justify-content:flex-start; gap:34px; margin-bottom:34px;}
.hero-stats b{font-family:'Playfair Display',Georgia,serif; font-size:30px; color:var(--amber);}
.hero-btns{display:flex; gap:14px; flex-wrap:wrap;}
.btn-primary{
  display:inline-flex; align-items:center; gap:8px; background:var(--ink); color:#fff;
  padding:14px 28px; border-radius:8px; font-size:15px; font-weight:700; text-decoration:none;
  font-family:'Nikosh','Lora',sans-serif; transition:.2s;
}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 8px 28px rgba(15,25,35,.2);}
.btn-outline{
  display:inline-flex; align-items:center; gap:8px; background:#fff; color:var(--ink);
  padding:14px 28px; border-radius:8px; border:2px solid var(--ink); font-size:15px; font-weight:700;
  text-decoration:none; font-family:'Nikosh','Lora',sans-serif; transition:.2s;
}
.btn-outline:hover{background:var(--ink); color:#fff; transform:translateY(-2px);}
.hero-book-mockup{position:relative; z-index:1;}
.book-cover-art{
  width:100%; border-radius:14px; overflow:hidden; box-shadow:-14px 18px 64px rgba(15,25,35,.28), 8px 8px 0 var(--amber);
  transform:rotate(-2.5deg); transition:transform .35s;
  background:linear-gradient(135deg,#0C1520 0%,#1A3050 55%,#0C1520 100%);
  padding:48px 40px; min-height:440px; display:flex; flex-direction:column; position:relative;
}
.book-cover-art:hover{transform:rotate(0) scale(1.02);}
.book-cover-art::before{content:'';position:absolute;top:-70px;right:-70px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(217,119,6,.22),transparent 70%);}
.book-cover-art::after{content:'';position:absolute;bottom:-50px;left:-50px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(13,148,136,.16),transparent 70%);}
.bca-lbl{font-size:11px;color:rgba(255,255,255,.35);letter-spacing:3px;text-transform:uppercase;margin-bottom:16px;position:relative;z-index:1;}
.bca-title{font-family:'Playfair Display',Georgia,serif;font-size:30px;font-weight:900;color:#fff;line-height:1.25;margin-bottom:8px;position:relative;z-index:1;}
.bca-title .a{color:var(--amber);}
.bca-books{display:flex;flex-direction:column;gap:10px;margin-top:20px;position:relative;z-index:1;}
.bca-book-row{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:9px 12px;font-size:12.5px;color:rgba(255,255,255,.8);}
.bca-book-row .dotc{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.bca-author{margin-top:auto;border-top:1px solid rgba(255,255,255,.1);padding-top:18px;position:relative;z-index:1;}
.bca-a-lbl{font-size:10px;color:rgba(255,255,255,.3);letter-spacing:2px;text-transform:uppercase;margin-bottom:4px;}
.bca-a-name{font-size:16px;font-weight:700;color:#fff;}

@media(max-width:900px){
  .hero-inner{grid-template-columns:1fr; text-align:center;}
  .hero-stats{justify-content:center;}
  .hero-btns{justify-content:center;}
  .hero-book-mockup{max-width:340px; margin:0 auto;}
}
@media(max-width:640px){
  .home-nav{display:none;}
  .hero{padding:44px 6vw 32px; min-height:auto;}
}

/* ================================
   MOTION: scroll-reveal + hero ambience
================================ */
.reveal-on-scroll{
  opacity:0; transform:translateY(22px);
  transition:opacity .6s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1);
}
.reveal-on-scroll.revealed{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal-on-scroll{opacity:1; transform:none; transition:none;}
}

.hero-bg::before, .hero-bg::after{
  content:''; position:absolute; border-radius:50%; filter:blur(60px); opacity:.5;
  animation:hero-float 14s ease-in-out infinite;
}
.hero-bg::before{width:340px; height:340px; background:radial-gradient(circle,rgba(217,119,6,.35),transparent 70%); top:-60px; right:12%;}
.hero-bg::after{width:280px; height:280px; background:radial-gradient(circle,rgba(13,148,136,.3),transparent 70%); bottom:-40px; left:8%; animation-delay:-7s;}
@keyframes hero-float{
  0%,100%{transform:translate(0,0) scale(1);}
  50%{transform:translate(-18px,22px) scale(1.08);}
}
@media (prefers-reduced-motion: reduce){
  .hero-bg::before, .hero-bg::after{animation:none;}
}

@keyframes hero-enter{
  from{opacity:0; transform:translateY(18px);}
  to{opacity:1; transform:translateY(0);}
}
.hero-inner > div:first-child > *{opacity:0; animation:hero-enter .7s cubic-bezier(.22,1,.36,1) forwards;}
.hero-inner > div:first-child > *:nth-child(1){animation-delay:.05s;}
.hero-inner > div:first-child > *:nth-child(2){animation-delay:.15s;}
.hero-inner > div:first-child > *:nth-child(3){animation-delay:.25s;}
.hero-inner > div:first-child > *:nth-child(4){animation-delay:.35s;}
.hero-inner > div:first-child > *:nth-child(5){animation-delay:.45s;}
.hero-book-mockup{opacity:0; animation:hero-enter .8s cubic-bezier(.22,1,.36,1) .3s forwards;}
@media (prefers-reduced-motion: reduce){
  .hero-inner > div:first-child > *, .hero-book-mockup{opacity:1; animation:none;}
}

/* ================================
   BOOK OVERVIEW PAGE (chapter list — "Picture 1")
================================ */
.book-hero{
  padding:48px 6vw 32px; max-width:900px; margin:0 auto; text-align:center;
  animation:hero-enter .6s cubic-bezier(.22,1,.36,1);
}
.book-hero .book-cover-chip{
  width:64px; height:64px; border-radius:16px; margin:0 auto 18px;
  transition:transform .3s cubic-bezier(.22,1,.36,1);
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-family:Georgia,serif; font-weight:900; font-size:26px;
}
.book-hero .book-cover-chip:hover{transform:scale(1.08) rotate(-3deg);}
.book-hero h1{font-family:Georgia,serif; font-size:clamp(26px,4vw,38px); margin:0 0 12px;}
.book-hero p{color:var(--slate); font-size:15.5px; max-width:560px; margin:0 auto 20px;}
.lang-toggle{
  display:inline-flex; border:1px solid var(--line); border-radius:999px; overflow:hidden;
  font-family:sans-serif; font-size:13px; margin-bottom:6px;
}
.lang-toggle button{
  border:none; background:#fff; padding:7px 18px; cursor:pointer; color:var(--slate);
}
.lang-toggle button.active{background:var(--ink); color:#fff;}

.progress-bar-track{
  height:8px; border-radius:999px; background:var(--line); overflow:hidden; max-width:360px; margin:14px auto 4px;
}
.progress-bar-fill{height:100%; background:linear-gradient(90deg,var(--amber),var(--teal)); border-radius:999px; transition:width .3s;}
.progress-label{font-family:sans-serif; font-size:12.5px; color:var(--muted);}

.chapter-list{max-width:760px; margin:0 auto; padding:10px 6vw 60px;}
.chapter-card{
  display:flex; align-items:center; gap:16px;
  background:#fff; border:1px solid var(--line); border-radius:12px;
  padding:16px 18px; margin-bottom:12px; text-decoration:none; color:var(--ink);
  transition:.15s;
}
.chapter-card:hover{border-color:var(--amber); box-shadow:0 6px 18px rgba(15,25,35,.06);}
.chapter-card .ch-index{
  width:38px; height:38px; border-radius:10px; flex-shrink:0;
  background:var(--cream); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  font-family:Georgia,serif; font-weight:700; color:var(--amber);
}
.chapter-card.done .ch-index{background:var(--teal); border-color:var(--teal); color:#fff;}
.chapter-card .ch-info{flex:1; min-width:0;}
.chapter-card h3{font-size:15.5px; margin:0 0 3px; font-family:'Nikosh','Lora',Georgia,sans-serif;}
.chapter-card span.ch-meta{font-size:12px; color:var(--muted); font-family:sans-serif;}
.chapter-card .ch-check{font-size:18px; color:var(--teal);}

.exam-cta{
  max-width:760px; margin:24px auto 0; padding:24px; border-radius:14px;
  background:linear-gradient(135deg,rgba(217,119,6,.08),rgba(13,148,136,.08));
  border:1px solid var(--line); text-align:center;
}
.exam-cta h3{font-family:Georgia,serif; margin:0 0 8px;}
.exam-cta p{font-size:13.5px; color:var(--slate); margin:0 0 16px;}
.exam-cta a.btn, .btn{
  display:inline-block; background:var(--amber); color:#fff; font-weight:700;
  padding:11px 26px; border-radius:999px; text-decoration:none; font-family:sans-serif; font-size:14px;
  border:none; cursor:pointer; transition:transform .2s cubic-bezier(.22,1,.36,1), box-shadow .2s, filter .2s;
}
.exam-cta a.btn:hover, .btn:hover{transform:translateY(-2px); box-shadow:0 10px 22px rgba(217,119,6,.28); filter:brightness(1.04);}
.exam-cta a.btn:active, .btn:active{transform:translateY(0) scale(.98);}
.exam-cta a.btn.locked{background:var(--muted); pointer-events:none;}
.exam-cta a.btn.secondary, .btn.secondary{background:#fff; color:var(--ink); border:1px solid var(--line);}
.exam-cta a.btn.secondary:hover, .btn.secondary:hover{box-shadow:0 10px 22px rgba(15,25,35,.1); filter:none;}

/* ================================
   READER PAGE ("Picture 2")
================================ */
.reader-shell{display:flex; min-height:calc(100vh - 46px);}
.reader-sidebar{
  width:290px; flex-shrink:0; background:#fff; border-right:1px solid var(--line);
  padding:20px 0; overflow-y:auto; max-height:calc(100vh - 46px); position:sticky; top:46px;
}
.reader-sidebar .rs-book-title{
  font-family:Georgia,serif; font-weight:700; font-size:15px; padding:0 20px 14px; line-height:1.4;
}
.reader-sidebar .rs-progress{padding:0 20px 16px; border-bottom:1px solid var(--line); margin-bottom:8px;}
.rs-chapter{margin-bottom:2px;}
.rs-chapter > .rs-ch-head{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:9px 20px; cursor:pointer; font-family:'Nikosh','Lora',sans-serif; font-size:13.5px; font-weight:600;
}
.rs-chapter > .rs-ch-head:hover{background:var(--cream);}
.rs-ch-head .rs-caret{font-size:10px; color:var(--muted); transition:transform .15s;}
.rs-chapter.open .rs-ch-head .rs-caret{transform:rotate(90deg);}
.rs-subs{display:none; padding-left:8px;}
.rs-chapter.open .rs-subs{display:block;}
.rs-sub{
  display:flex; align-items:center; gap:8px; padding:7px 20px 7px 32px; font-size:13px;
  color:var(--slate); text-decoration:none; font-family:'Nikosh','Lora',sans-serif; border-left:2px solid transparent;
}
.rs-sub:hover{background:var(--cream);}
.rs-sub.active{border-left-color:var(--amber); color:var(--amber); font-weight:700; background:rgba(217,119,6,.06);}
.rs-sub .rs-dot{width:7px; height:7px; border-radius:50%; border:1.5px solid var(--muted); flex-shrink:0;}
.rs-sub.read .rs-dot{background:var(--teal); border-color:var(--teal);}
.rs-streak{
  margin-top:10px; display:flex; align-items:center; gap:6px;
  font-family:'Lora',sans-serif; font-size:12.5px; color:var(--amber); font-weight:700;
}
.read-time-chip{
  font-family:sans-serif; font-size:11.5px; color:var(--muted);
  display:inline-flex; align-items:center; gap:4px;
}

.reader-main{flex:1; min-width:0;}
.reader-topline{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:12px 5vw; border-bottom:1px solid var(--line); background:#fff; position:sticky; top:46px; z-index:10;
  font-family:sans-serif; font-size:13px;
}
.reader-topline .rt-crumb{color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.reader-content{max-width:880px; margin:0 auto; padding:36px 6vw 20px; line-height:1.85; font-size:16px;}
.reader-content h1, .reader-content h2, .reader-content h3{font-family:Georgia,serif;}
.reader-content table{width:100%; border-collapse:collapse; margin:18px 0; font-size:14px;}
.reader-content table td, .reader-content table th{border:1px solid var(--line); padding:8px 10px; text-align:left;}
.reader-content .content-box{background:var(--cream); border:1px solid var(--line); border-radius:10px; padding:16px 18px; margin:16px 0;}
.reader-content .content-figure{margin:26px 0; text-align:center;}
.reader-content .content-figure img{max-width:100%; height:auto; border-radius:10px; border:1px solid var(--line); box-shadow:0 8px 24px rgba(15,25,35,.08);}
.reader-content .content-figure figcaption{margin-top:10px; font-size:13px; color:var(--muted); font-family:'Nikosh','Lora',sans-serif; font-style:italic; line-height:1.6;}

/* ---------- code blocks ---------- */
.reader-content .code-block{
  margin:20px 0; border-radius:10px; overflow:hidden;
  background:#0D1117; border:1px solid #21262D;
  box-shadow:0 8px 24px rgba(15,25,35,.12);
}
.reader-content .code-block-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:9px 16px; background:#161B22; border-bottom:1px solid #21262D;
}
.reader-content .code-lang{
  font-family:sans-serif; font-size:11.5px; font-weight:700; letter-spacing:.06em;
  color:#7EE787; text-transform:uppercase;
}
.reader-content .code-copy-btn{
  font-family:sans-serif; font-size:12px; font-weight:600; color:#C9D1D9;
  background:#21262D; border:1px solid #30363D; border-radius:6px;
  padding:4px 12px; cursor:pointer; transition:.15s;
}
.reader-content .code-copy-btn:hover{background:#30363D; color:#fff;}
.reader-content .code-copy-btn.copied{background:#0D9488; border-color:#0D9488; color:#fff;}
.reader-content .code-block pre{
  margin:0; padding:16px 18px; overflow-x:auto;
}
.reader-content .code-block code{
  font-family:'Victor Mono','Fira Code','JetBrains Mono',Consolas,Menlo,monospace;
  font-size:14px; line-height:1.7; color:#E6EDF3; white-space:pre;
}

/* ================================
   CHAPTER MINI-GAME (term matching)
================================ */
.chapter-game{
  margin:36px 0 20px; padding:26px 24px; border-radius:14px;
  background:linear-gradient(135deg,rgba(217,119,6,.07),rgba(13,148,136,.07));
  border:1px solid var(--line);
}
.chapter-game-head{display:flex; align-items:center; gap:10px; margin-bottom:6px;}
.chapter-game-head .icon{font-size:22px;}
.chapter-game-head h3{margin:0; font-family:'Lora',Georgia,serif; font-size:18px;}
.chapter-game-sub{font-size:13px; color:var(--muted); font-family:sans-serif; margin:0 0 18px;}
.game-match-grid{display:grid; grid-template-columns:1fr 1fr; gap:22px;}
.game-match-col{display:flex; flex-direction:column; gap:8px;}
.game-match-item{
  background:#fff; border:1.5px solid var(--line); border-radius:9px; padding:11px 14px;
  font-size:14px; font-family:'Lora',sans-serif; cursor:pointer; transition:.15s; user-select:none;
}
.game-match-item:hover{border-color:var(--amber);}
.game-match-item.selected{border-color:var(--amber); background:rgba(217,119,6,.09); font-weight:700;}
.game-match-item.matched{border-color:var(--teal); background:rgba(13,148,136,.09); color:var(--teal); cursor:default; font-weight:700;}
.game-match-item.wrong{border-color:#DC2626; background:rgba(220,38,38,.08); animation:game-shake .3s;}
@keyframes game-shake{0%,100%{transform:translateX(0);}25%{transform:translateX(-4px);}75%{transform:translateX(4px);}}
.game-status{margin-top:16px; font-family:sans-serif; font-size:13px; color:var(--slate); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px;}
.game-status .score{font-weight:700; color:var(--ink);}
.game-replay-btn{
  font-family:sans-serif; font-size:12.5px; font-weight:600; color:var(--amber);
  background:none; border:1px solid var(--amber); border-radius:999px; padding:5px 14px; cursor:pointer;
}
.game-win-msg{
  display:none; text-align:center; padding:14px; margin-top:14px; border-radius:10px;
  background:rgba(22,163,74,.1); color:#166534; font-weight:700; font-family:sans-serif; font-size:14px;
}
@media(max-width:560px){
  .game-match-grid{grid-template-columns:1fr;}
}
.reader-nav{
  display:flex; justify-content:space-between; gap:12px; max-width:880px; margin:0 auto; padding:10px 6vw 50px;
}
.reader-nav a{
  font-family:sans-serif; font-size:13.5px; font-weight:700; text-decoration:none; color:var(--ink);
  border:1px solid var(--line); border-radius:10px; padding:12px 18px; flex:1; max-width:280px;
}
.reader-nav a.next{text-align:right; background:var(--ink); color:#fff; border-color:var(--ink);}
.reader-nav a.disabled{opacity:.35; pointer-events:none;}
.reader-mobile-toggle{display:none;}

@media(max-width:860px){
  .reader-sidebar{position:fixed; left:-300px; top:46px; bottom:0; z-index:40; transition:left .2s; box-shadow:8px 0 24px rgba(0,0,0,.15);}
  .reader-sidebar.open{left:0;}
  .reader-mobile-toggle{
    display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); border-radius:8px;
    padding:6px 10px; font-family:sans-serif; font-size:12.5px; background:#fff;
  }
}

/* ================================
   EXAM PAGE
================================ */
.exam-shell{max-width:720px; margin:0 auto; padding:40px 6vw 60px;}
.exam-shell h1{font-family:Georgia,serif; font-size:26px; margin:0 0 6px;}
.exam-meta{color:var(--muted); font-size:13.5px; font-family:sans-serif; margin-bottom:28px;}
.exam-q{background:#fff; border:1px solid var(--line); border-radius:12px; padding:20px 22px; margin-bottom:16px;}
.exam-q .eq-title{font-weight:700; margin-bottom:12px; line-height:1.6;}
.exam-opt{
  display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:8px;
  border:1px solid var(--line); margin-bottom:8px; cursor:pointer; font-size:14.5px;
}
.exam-opt:hover{border-color:var(--amber);}
.exam-opt.selected{border-color:var(--amber); background:rgba(217,119,6,.06);}
.exam-opt input{accent-color:var(--amber);}
.exam-result{
  text-align:center; padding:36px 24px; border-radius:14px; margin-top:10px;
}
.exam-result.pass{background:rgba(22,163,74,.08); border:1px solid rgba(22,163,74,.3);}
.exam-result.fail{background:rgba(220,38,38,.07); border:1px solid rgba(220,38,38,.25);}
.exam-result .score-num{font-family:Georgia,serif; font-size:42px; font-weight:900;}

/* ================================
   CERTIFICATE
================================ */
.cert-wrap{max-width:900px; margin:0 auto; padding:40px 6vw 60px; text-align:center;}
.cert-name-form{max-width:380px; margin:0 auto 26px; text-align:left;}
.cert-name-form label{font-family:sans-serif; font-size:13px; color:var(--slate); display:block; margin-bottom:6px;}
.cert-name-form input{
  width:100%; padding:11px 14px; border:1px solid var(--line); border-radius:8px; font-size:15px;
  font-family:'Nikosh','Lora',sans-serif; margin-bottom:12px;
}
#cert-canvas{max-width:100%; height:auto; border:1px solid var(--line); border-radius:10px; box-shadow:0 12px 30px rgba(15,25,35,.1);}
.cert-actions{margin-top:20px; display:flex; gap:10px; justify-content:center; flex-wrap:wrap;}

/* ================================
   AUTHOR PROFILE PAGE
================================ */
.lang-bn, .lang-en{}
.author-hero{
  background:linear-gradient(135deg,#0C1520 0%,#16233A 55%,#0C1520 100%);
  color:#fff; padding:70px 6vw 60px; position:relative; overflow:hidden;
}
.author-hero::before{content:'';position:absolute;top:-120px;right:-80px;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(217,119,6,.18),transparent 70%);}
.author-hero::after{content:'';position:absolute;bottom:-140px;left:-100px;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(13,148,136,.14),transparent 70%);}
.author-hero-inner{position:relative;z-index:1;max-width:1100px;margin:0 auto;display:grid;grid-template-columns:240px 1fr;gap:44px;align-items:center;}
.author-photo-frame{
  width:240px;height:300px;border-radius:16px;overflow:hidden;
  box-shadow:0 20px 50px rgba(0,0,0,.4), 0 0 0 6px rgba(217,119,6,.15);
}
.author-photo-frame img{width:100%;height:100%;object-fit:cover;display:block;}
.author-eyebrow{font-family:sans-serif;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--amber2);margin-bottom:10px;}
.author-hero h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(30px,4.5vw,44px);margin:0 0 10px;}
.author-title{color:rgba(255,255,255,.7);font-size:15.5px;margin:0 0 20px;line-height:1.6;}
.author-social{display:flex;gap:10px;flex-wrap:wrap;}
.author-social a{
  display:inline-flex;align-items:center;gap:6px;color:#fff;text-decoration:none;font-family:sans-serif;font-size:13px;
  border:1px solid rgba(255,255,255,.25);padding:7px 15px;border-radius:999px;transition:.2s;
}
.author-social a:hover{background:rgba(255,255,255,.12);border-color:#fff;}

.author-section{max-width:900px;margin:0 auto;padding:44px 6vw;}
.author-section h2{font-family:Georgia,serif;font-size:24px;margin:0 0 18px;display:flex;align-items:center;gap:10px;}
.author-section h2::before{content:'';width:4px;height:22px;background:var(--amber);border-radius:2px;display:inline-block;}
.author-summary{font-size:15.5px;line-height:1.85;color:var(--slate);}

.skill-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;}
.skill-chip{
  background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:13.5px;
  display:flex;align-items:center;gap:8px;
}
.skill-chip .dot{width:8px;height:8px;border-radius:50%;background:var(--teal);flex-shrink:0;}

.timeline{border-left:2px solid var(--line);padding-left:24px;margin-left:6px;}
.tl-item{position:relative;padding-bottom:30px;}
.tl-item:last-child{padding-bottom:0;}
.tl-item::before{content:'';position:absolute;left:-30px;top:4px;width:12px;height:12px;border-radius:50%;background:var(--amber);border:3px solid var(--cream);}
.tl-role{font-family:Georgia,serif;font-weight:700;font-size:16.5px;margin:0 0 3px;}
.tl-meta{font-family:sans-serif;font-size:12.5px;color:var(--muted);margin-bottom:8px;}
.tl-desc{font-size:14px;color:var(--slate);line-height:1.7;}

.author-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:30px;}
.mini-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 20px;}
.mini-card h4{font-family:Georgia,serif;font-size:15.5px;margin:0 0 4px;}
.mini-card span{font-size:12.5px;color:var(--muted);font-family:sans-serif;}

.award-list, .cert-list{list-style:none;padding:0;margin:0;}
.award-list li, .cert-list li{
  padding:10px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--slate);
  display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;
}
.award-list li:last-child, .cert-list li:last-child{border-bottom:none;}
.award-list b, .cert-list b{color:var(--ink);}

.author-cta-band{
  background:var(--ink);color:#fff;text-align:center;padding:50px 6vw;
}
.author-cta-band h2{font-family:Georgia,serif;font-size:24px;margin:0 0 10px;}
.author-cta-band p{color:#cbd5c9;font-size:14px;margin:0 0 22px;}
.author-cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}

@media(max-width:720px){
  .author-hero-inner{grid-template-columns:1fr;text-align:center;}
  .author-photo-frame{margin:0 auto;width:180px;height:220px;}
  .author-social{justify-content:center;}
  .author-grid-2{grid-template-columns:1fr;}
}

/* ================================
   CONTACT PAGE
================================ */
.contact-hero{
  background:linear-gradient(135deg,#0C1520 0%,#16233A 55%,#0C1520 100%);
  color:#fff; padding:56px 6vw 50px; text-align:center; position:relative; overflow:hidden;
}
.contact-hero::before{content:'';position:absolute;top:-100px;left:50%;transform:translateX(-50%);width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(217,119,6,.16),transparent 70%);}
.contact-hero h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(28px,4vw,40px);margin:10px 0 10px;position:relative;z-index:1;}
.contact-hero p{color:rgba(255,255,255,.7);font-size:15px;max-width:520px;margin:0 auto;position:relative;z-index:1;}

.contact-grid{
  max-width:920px;margin:-38px auto 0;padding:0 6vw 20px;position:relative;z-index:2;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;
}
.contact-card{
  background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px 20px;text-decoration:none;color:var(--ink);
  box-shadow:0 14px 34px rgba(15,25,35,.1);transition:.18s;text-align:center;
}
.contact-card:hover{transform:translateY(-4px);border-color:var(--amber);}
.contact-card .cc-icon{
  width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  margin:0 auto 12px;font-size:20px;color:#fff;
}
.contact-card h4{font-family:Georgia,serif;font-size:15.5px;margin:0 0 4px;}
.contact-card span{font-size:12.5px;color:var(--muted);font-family:sans-serif;word-break:break-word;}

.contact-note{
  max-width:720px;margin:30px auto 60px;padding:22px 26px;border-radius:12px;
  background:var(--cream);border:1px solid var(--line);font-size:13.5px;color:var(--slate);line-height:1.8;
}
.contact-note b{color:var(--ink);}

/* ================================
   SIMPLE LEGAL/TEXT PAGES (privacy policy etc.)
================================ */
.legal-page{max-width:720px;margin:0 auto;padding:50px 6vw 60px;line-height:1.85;color:var(--ink);}
.legal-page h1{font-family:Georgia,serif;}
.legal-page h2{font-family:Georgia,serif;font-size:19px;margin-top:34px;}
.legal-page a{color:var(--amber);}

/* ================================
   DONATE / SUPPORT BUTTON
================================ */
.donate-btn{
  display:inline-flex; align-items:center; gap:8px;
  background:linear-gradient(135deg,#FFDD00,#FFC700); color:#1A1206;
  font-weight:800; font-size:13px; padding:8px 18px; border-radius:999px;
  text-decoration:none; box-shadow:0 4px 14px rgba(255,199,0,.35);
  transition:transform .2s cubic-bezier(.4,0,.2,1), box-shadow .2s;
  font-family:sans-serif;
}
.donate-btn:hover{transform:translateY(-2px); box-shadow:0 8px 20px rgba(255,199,0,.5);}
.donate-btn .cup{font-size:15px;}

.support-banner{
  max-width:760px; margin:20px auto 0; padding:22px 26px; border-radius:14px;
  background:linear-gradient(135deg,rgba(255,199,0,.12),rgba(217,119,6,.08));
  border:1px solid rgba(255,199,0,.35); text-align:center;
}
.support-banner h3{font-family:'Lora',Georgia,serif; margin:0 0 8px; font-size:17px;}
.support-banner p{font-size:13.5px; color:var(--slate); margin:0 0 16px; font-family:sans-serif;}

/* ================================
   CERTIFICATE SOCIAL SHARE
================================ */
.cert-share{margin-top:26px; padding-top:22px; border-top:1px solid var(--line); text-align:center;}
.cert-share-label{font-family:sans-serif; font-size:13px; color:var(--muted); margin:0 0 12px;}
.cert-share-btns{display:flex; gap:10px; justify-content:center; flex-wrap:wrap;}
.share-btn{
  display:inline-flex; align-items:center; gap:7px; padding:9px 18px; border-radius:999px;
  font-family:sans-serif; font-size:13px; font-weight:700; color:#fff; text-decoration:none;
  transition:transform .2s cubic-bezier(.4,0,.2,1), box-shadow .2s;
}
.share-btn:hover{transform:translateY(-2px);}
.share-btn.fb{background:#1877F2; box-shadow:0 4px 12px rgba(24,119,242,.3);}
.share-btn.li{background:#0A66C2; box-shadow:0 4px 12px rgba(10,102,194,.3);}
.share-btn.wa{background:#25D366; box-shadow:0 4px 12px rgba(37,211,102,.3);}
.share-btn.x{background:#0F1923; box-shadow:0 4px 12px rgba(15,25,35,.3);}
