/* Karka · Pedda Bala Siksha — manuscript palette, 5-tier display */
:root{
  --leaf:#f4ecd8;--leaf-deep:#ead9b3;--paper:#fbf6e8;--ivory:#fffaee;
  --ink:#1a120a;--ink-soft:#3a2a18;--muted:#7a6849;--rule:#d6c7a4;
  --gold:#b88a2e;--gold-deep:#8b6520;--gold-bright:#d8a648;
  --vermillion:#a83323;--vermillion-bright:#c44535;
  --indigo:#2b1d4a;
  --motion-fast:.32s cubic-bezier(.2,.8,.2,1);
  --motion-med:.6s cubic-bezier(.2,.8,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--leaf)}
body{margin:0;background:var(--leaf);color:var(--ink);font-family:'Spectral',serif;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
:lang(te){font-family:'Noto Serif Telugu','Spectral',serif;font-feature-settings:"kern" 1,"calt" 1,"liga" 1;letter-spacing:0;line-height:1.6}
a{color:var(--vermillion);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--vermillion) 35%,transparent)}
a:hover{color:var(--vermillion-bright);border-bottom-color:currentColor}
body::before{content:"";position:fixed;inset:-20vmax;z-index:-2;background:radial-gradient(ellipse 60vmax 30vmax at 50% 0%, color-mix(in srgb,var(--leaf-deep) 40%,transparent), transparent 70%),repeating-linear-gradient(90deg, transparent 0 40px, color-mix(in srgb,var(--leaf-deep) 8%,transparent) 40px 41px);filter:blur(20px);animation:drift 28s ease-in-out infinite alternate}
@keyframes drift{0%{transform:translate(-2vmin,-1vmin) rotate(-.4deg)}100%{transform:translate(2vmin,1vmin) rotate(.4deg)}}
.skip{position:absolute;left:-10000px;top:8px;background:var(--ink);color:var(--leaf);padding:10px 14px;border-radius:4px;z-index:100}
.skip:focus{left:8px}
.sr{position:absolute!important;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden}

.topnav{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--ivory) 92%,transparent);backdrop-filter:saturate(140%) blur(8px);border-bottom:2px solid var(--ink)}
.topnav-inner{max-width:1200px;margin:0 auto;padding:14px 24px;display:flex;align-items:baseline;gap:18px;flex-wrap:wrap}
.brand{display:inline-flex;align-items:baseline;gap:8px;text-decoration:none;color:var(--ink);font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:700;border:0}
.brand .karka{color:var(--vermillion)}
.brand .sep{color:var(--muted);margin:0 2px;font-style:italic}
.crumbs{margin-left:auto;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:14px;color:var(--muted)}
.crumbs a{color:inherit;border:0;border-bottom:1px dotted}
.crumbs b{color:var(--ink);font-style:normal;font-weight:600}

.shell{max-width:1100px;margin:0 auto;padding:36px clamp(20px,4vw,48px) 80px}

.lhead{padding:32px 0 12px;text-align:center}
.lhead .invocation{font-family:'Noto Serif Telugu',serif;color:var(--vermillion);font-size:24px;letter-spacing:.04em;margin-bottom:8px}
.lhead .pill{display:inline-flex;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13px;color:var(--gold-deep);background:transparent;border:1px solid var(--gold);padding:5px 14px;border-radius:999px;letter-spacing:.05em;margin-bottom:14px}
.lhead h1{font-family:'Noto Serif Telugu',serif;font-size:clamp(38px,6vw,72px);color:var(--indigo);margin:6px 0 4px;line-height:1.22;font-weight:600;letter-spacing:0}
.lhead .tier{display:block;margin-top:8px;font-weight:500;letter-spacing:.005em}
.lhead .tier-translit{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--gold-deep);font-size:clamp(20px,2.4vw,28px);font-weight:600}
.lhead .tier-expte{font-family:'Noto Serif Telugu',serif;color:var(--vermillion);font-size:clamp(18px,2.2vw,26px);font-weight:500;line-height:1.5}
.lhead .tier-exptranslit{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--ink-soft);font-size:clamp(15px,1.6vw,18px);font-weight:500}
.lhead .tier-en{font-family:'Spectral',serif;color:var(--ink);font-size:clamp(15px,1.6vw,18px);font-weight:500}
.lhead .standfirst{font-size:18px;color:var(--ink-soft);max-width:62ch;margin:18px auto 0;line-height:1.6}
.lhead .meta{display:flex;flex-wrap:wrap;gap:8px 14px;justify-content:center;margin-top:16px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13.5px;color:var(--muted)}
.lhead .meta b{font-style:normal;font-weight:700;color:var(--ink);margin-right:4px}
.lhead .meta span+span::before{content:"·";margin-right:14px;color:var(--gold)}

.audio{margin:24px auto 0;background:var(--ivory);border:1px solid var(--rule);border-radius:6px;padding:14px 16px;display:flex;align-items:center;gap:14px;max-width:560px;position:relative}
.audio::after{content:"";position:absolute;inset:4px;border:1px solid var(--gold);border-radius:3px;pointer-events:none;opacity:.5}
.audio .play{width:42px;height:42px;flex:0 0 42px;border-radius:50%;background:var(--vermillion);color:var(--ivory);border:0;display:grid;place-items:center;font-size:14px;cursor:pointer}
.audio .info{font-family:'Cormorant Garamond',serif;font-size:13px;line-height:1.4;flex:1}
.audio .info b{display:block;color:var(--ink);font-weight:700}
.audio .info span{font-style:italic;color:var(--muted)}

.ornament{display:flex;align-items:center;justify-content:center;gap:14px;height:18px;margin:28px 0}
.ornament i{flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--gold) 60%,transparent);max-width:240px}
.ornament .lz{width:10px;height:10px;background:var(--gold);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.ornament .lz.v{background:var(--vermillion)}

.lcard{background:var(--paper);border:1px solid var(--rule);border-radius:6px;padding:24px 28px;margin:18px 0;position:relative}
.lcard::before{content:"";position:absolute;inset:6px;border:1px solid color-mix(in srgb,var(--gold) 50%,transparent);border-radius:3px;pointer-events:none;opacity:.4}
.lcard > *{position:relative}
.lcard h2{font-family:'Cormorant Garamond',serif;color:var(--vermillion);font-size:22px;font-weight:600;margin:0 0 8px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;line-height:1.4}
.lcard h2 .num{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--gold-deep);font-size:16px}
.lcard h2 .te-sub{font-family:'Noto Serif Telugu',serif;color:var(--ink-soft);font-size:17px;margin-left:auto;line-height:1.5}
.lcard p{font-size:16.5px;line-height:1.7;margin:8px 0;color:var(--ink)}
.lcard p:lang(te){font-family:'Noto Serif Telugu',serif;font-size:18px;line-height:2.05}

.bileaf{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--rule);margin-top:14px}
@media (max-width:720px){.bileaf{grid-template-columns:1fr}}
.bileaf > div{padding:14px 18px;border-right:1px solid var(--rule)}
.bileaf > div:last-child{border-right:0;background:color-mix(in srgb,var(--leaf-deep) 18%,transparent)}
.bileaf .head{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.18em;margin:0 0 6px}

.pull{border-left:3px solid var(--gold);padding:14px 18px;background:color-mix(in srgb,var(--leaf-deep) 24%,transparent);font-family:'Noto Serif Telugu',serif;font-size:19px;color:var(--ink);margin:18px 0;line-height:1.6;border-radius:0 6px 6px 0}
.pull cite{display:block;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13.5px;color:var(--muted);margin-top:10px;font-style:italic}

.itable{width:100%;border-collapse:collapse;margin:10px 0;font-size:14.5px;background:var(--ivory);border:1px solid var(--rule);border-radius:6px;overflow:hidden}
.itable th{text-align:left;font-family:'Cormorant Garamond',serif;font-size:11px;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);font-weight:700;border-bottom:1px solid var(--rule);padding:10px 12px;background:var(--paper)}
.itable td{padding:10px 12px;border-bottom:1px solid var(--rule);font-family:'Spectral',serif;color:var(--ink);vertical-align:middle}
.itable td:first-child:lang(te){font-size:18px;color:var(--vermillion);font-weight:600;line-height:1.4}
.itable tr:last-child td{border-bottom:0}

.flashes{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:10px}
@media (max-width:720px){.flashes{grid-template-columns:repeat(2,1fr)}}
.fl{min-height:200px;background:var(--ivory);border:1px solid var(--gold);border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;padding:14px 10px;gap:4px;position:relative}
.fl::after{content:"";position:absolute;inset:3px;border:1px solid color-mix(in srgb,var(--gold) 40%,transparent);border-radius:3px;pointer-events:none}
.fl .g{font-family:'Noto Serif Telugu',serif;font-size:36px;color:var(--vermillion);line-height:1.2;font-weight:600;display:block}
.fl .translit{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:14px;color:var(--gold-deep);font-weight:600}
.fl .expte{font-family:'Noto Serif Telugu',serif;font-size:13.5px;color:var(--ink);line-height:1.5;margin-top:2px}
.fl .exptranslit{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:11.5px;color:var(--muted);line-height:1.3}
.fl .en{font-family:'Spectral',serif;font-size:12px;color:var(--ink-soft);line-height:1.35;margin-top:2px}

ol,ul{padding-left:22px}
ol li,ul li{margin:4px 0}
ol li:lang(te),ul li:lang(te){line-height:1.85}

.acts{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:720px){.acts{grid-template-columns:1fr}}
.acts h3{font-family:'Cormorant Garamond',serif;font-size:13px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin:0 0 6px;font-weight:700}

.etym{list-style:none;padding:0;margin:8px 0;font-size:14px}
.etym li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px dotted var(--rule)}
.etym li:last-child{border:0}
.etym li:lang(te) .term{font-family:'Noto Serif Telugu',serif;color:var(--vermillion);font-weight:600;font-size:17px}
.etym li .gl em{font-family:'Cormorant Garamond',serif;color:var(--gold-deep);font-style:italic;margin-right:6px}

.nxprv{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:24px 0 0;font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--muted);font-size:14.5px;border-top:1px solid var(--rule);margin-top:24px}
.nxprv a{color:var(--vermillion);font:inherit;font-style:italic;padding:8px 12px;border-radius:4px;border:0;border-bottom:1px dotted var(--vermillion)}
.nxprv a.disabled{opacity:.3;pointer-events:none;color:var(--muted);border-bottom:0}

.foot{margin-top:48px;padding:24px 0;border-top:2px solid var(--ink);font-family:'Cormorant Garamond',serif;color:var(--ink-soft);font-size:14px;text-align:center}
.foot .device{font-family:'Noto Serif Telugu',serif;color:var(--vermillion);font-size:24px;margin-bottom:6px;letter-spacing:.04em}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-delay:0!important}
  body::before{animation:none}
}

/* ────────────── Accessibility additions (WCAG 2.1 AA) ────────────── */
/* Visible focus rings on all interactive elements */
*:focus-visible{outline:3px solid var(--vermillion,#a83323);outline-offset:2px;border-radius:3px}
.audio .play:focus-visible{outline:3px solid var(--vermillion,#a83323);outline-offset:3px}
/* Reduced motion support */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:0.01ms !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}
  .titem:hover{padding-left:8px;transform:none}
  .parvam-card:hover{transform:none}
}
/* High-contrast mode support */
@media (prefers-contrast: more){
  body{background:#fff;color:#000}
  .lcard,.card,.parvam-card,.titem{border-width:2px}
  a{text-decoration:underline}
}
/* Min touch target size (Apple HIG/WCAG) */
.audio .play,.titem,.parvam-card,.nxprv a,.brand,.crumbs a{min-height:44px;display:inline-flex;align-items:center}
/* Skip-link visible on focus */
.skip{position:absolute;top:-40px;left:0;background:var(--vermillion,#a83323);color:#fff;padding:10px 16px;z-index:1000;text-decoration:none;font-weight:600;border-radius:0 0 4px 0}
.skip:focus{top:0}
/* Screen-reader-only utility */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ────────────── AI image + video media blocks ────────────── */
.hero-image{margin:18px 0 24px;padding:0}
.hero-image picture{display:block}
.hero-image img{transition:opacity 0.3s ease}
.hero-image img[loading]{opacity:0.7}
.hero-image img[loading="lazy"]{opacity:1}
.hero-caption{margin-top:8px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13px;color:var(--ink-soft,#5a4a32);text-align:center;padding:0 12px}
.concept-image{margin:14px 0;text-align:center}
.video-slot{margin:24px 0;padding:0}
.video-frame{position:relative;width:100%;max-width:720px;margin:0 auto;background:color-mix(in srgb,var(--gold,#b8923a) 6%,var(--paper,#faf3e7));border:2px dashed var(--rule,#dcc89a);border-radius:6px;padding:24px}
.video-frame iframe{width:100%;aspect-ratio:16/9;border-radius:4px;border:0}
.video-placeholder{text-align:center}
.video-placeholder p{margin:0 0 6px;font-family:'Spectral',serif}
.video-placeholder code{display:inline-block;text-align:left;background:#e8d4a3;padding:6px 10px;border-radius:3px;margin-top:4px;word-break:break-all}

/* Inline English transliteration of Telugu phrases */
.translit-roman{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:0.85em;color:var(--gold-deep,#7a5c1f);font-weight:400;margin-left:2px;letter-spacing:0.01em;opacity:0.85}

.digital-toolbox{position:fixed;right:14px;top:18%;display:flex;flex-direction:column;gap:6px;background:color-mix(in srgb,var(--gold,#b8923a) 12%,var(--paper,#faf3e7));border:1px solid var(--rule,#dcc89a);border-radius:8px;padding:8px 6px;box-shadow:0 2px 12px rgba(0,0,0,0.08);z-index:50}
.tb-btn{width:38px;height:38px;border:1px solid var(--rule,#dcc89a);background:var(--paper,#faf3e7);color:var(--ink,#2a2014);border-radius:5px;font-family:'Cormorant Garamond',serif;font-size:15px;font-weight:600;cursor:pointer;line-height:1;padding:0;display:flex;align-items:center;justify-content:center;transition:background 0.18s}
.tb-btn:hover{background:color-mix(in srgb,var(--gold,#b8923a) 20%,var(--paper,#faf3e7));border-color:var(--gold-deep,#7a5c1f)}
/* old toolbox mobile rule removed v3 */
[data-theme="sepia"]{--paper:#f0e3c4;--ink:#3a2a14}
[data-theme="dark"]{--paper:#1a1410;--ink:#e8d4a3;--paper-dark:#0a0805;--rule:#3a2a14;--ink-soft:#a89a7a;--gold-deep:#d4a838}
[data-theme="dark"] body{background:#1a1410}
[data-theme="dark"] .lcard, [data-theme="dark"] .card{background:#221b14;color:#e8d4a3}
@media print{.digital-toolbox,.audio,.video-slot,.nxprv,.topnav,nav.crumbs,.skip{display:none !important}body{background:#fff;color:#000;font-size:11pt}.lcard{break-inside:avoid;page-break-inside:avoid}.hero-image,.concept-image{max-height:200px;page-break-inside:avoid}}
.lesson-quiz{margin:24px 0;padding:18px;background:color-mix(in srgb,var(--vermillion,#a83323) 4%,var(--paper,#faf3e7));border:2px solid var(--vermillion,#a83323);border-radius:8px}
.lesson-quiz h3{margin:0 0 12px;font-family:'Cormorant Garamond',serif;color:var(--vermillion,#a83323)}
.quiz-q{margin:14px 0;padding:10px;background:rgba(255,255,255,0.5);border-radius:5px}
.quiz-q-text{font-weight:600;margin-bottom:8px}
.quiz-q label{display:block;padding:4px 6px;cursor:pointer;border-radius:3px}
.quiz-q label:hover{background:color-mix(in srgb,var(--gold,#b8923a) 20%,var(--paper,#faf3e7))}
.quiz-q.correct{border-left:4px solid #1a7a3a;padding-left:14px}
.quiz-q.wrong{border-left:4px solid var(--vermillion,#a83323);padding-left:14px}
.quiz-feedback{margin-top:6px;font-style:italic;font-size:0.92em}
.quiz-feedback.ok{color:#1a7a3a}.quiz-feedback.bad{color:var(--vermillion,#a83323)}
.dgwidget{margin:24px 0;padding:18px;background:color-mix(in srgb,var(--gold,#b8923a) 6%,var(--paper,#faf3e7));border:1px solid var(--gold,#b8923a);border-radius:8px}
.dgwidget h3{margin:0 0 10px;font-family:'Cormorant Garamond',serif;color:var(--gold-deep,#7a5c1f);font-size:18px}
.dgwidget .widget-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:8px 0}
.dgwidget label{font-family:'Spectral',serif;font-size:14.5px}
.dgwidget input,.dgwidget select{padding:6px 10px;border:1px solid var(--rule,#dcc89a);border-radius:4px;background:var(--paper,#faf3e7);font-family:'Spectral',serif;font-size:14px;color:var(--ink,#2a2014)}
.dgwidget button.calc{padding:8px 16px;background:var(--vermillion,#a83323);color:#fff;border:0;border-radius:4px;font-family:'Cormorant Garamond',serif;font-size:14px;cursor:pointer;font-weight:600}
.dgwidget button.calc:hover{background:#c43e2e}
.dgwidget .result{margin-top:12px;padding:10px;background:#fff;border:1px dashed var(--gold-deep,#7a5c1f);border-radius:4px;font-family:'Cormorant Garamond',serif;font-size:16px;color:var(--indigo,#1a3055);min-height:24px}

/* === Telugu/English numeral stacking (v2) === */
.titem .n, .parvam-num{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;line-height:1;gap:2px}
.titem .n small, .parvam-num small{display:block;font-size:11px !important;font-style:normal;color:var(--ink-soft,#5a4a32);font-family:'Cormorant Garamond',serif;font-weight:500;letter-spacing:0.05em;opacity:0.85;line-height:1;margin-top:0 !important;text-align:right}
@media (max-width:720px){
  .titem .n, .parvam-num{font-size:26px !important}
  .titem .n small, .parvam-num small{font-size:10px !important}
}
/* lesson section header numerals stay inline but well-spaced */
h2 .num{white-space:nowrap}
.lhead .pill{white-space:normal}


/* === Mobile accessibility toolbox FAB (v3) === */
@media (max-width:720px){
  .digital-toolbox{
    position:fixed !important;
    right:12px !important;
    bottom:12px !important;
    top:auto !important;
    left:auto !important;
    flex-direction:column-reverse !important;
    align-items:flex-end !important;
    gap:8px !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    padding:0 !important;
    max-width:52px !important;
    max-height:52px !important;
    overflow:visible !important;
    z-index:9999 !important;
    transition:max-height 0.25s ease;
  }
  .digital-toolbox::before{
    content:"♿";
    display:flex !important;
    align-items:center;
    justify-content:center;
    width:52px;
    height:52px;
    border-radius:50%;
    background:linear-gradient(135deg,#b8923a 0%,#7a5c1f 100%);
    color:#faf3e7;
    font-size:26px;
    cursor:pointer;
    box-shadow:0 4px 14px rgba(0,0,0,0.3);
    border:2px solid #fffaf0;
    order:-1;
    flex-shrink:0;
  }
  .digital-toolbox.open::before{
    content:"×";
    font-size:32px;
    background:linear-gradient(135deg,#7a1f15 0%,#5a1414 100%);
  }
  .digital-toolbox .tb-btn{
    display:none !important;
    width:44px !important;
    height:44px !important;
    font-size:14px !important;
    background:#faf3e7 !important;
    border:1px solid #dcc89a !important;
    box-shadow:0 2px 8px rgba(0,0,0,0.2) !important;
    border-radius:50% !important;
    flex-shrink:0;
  }
  .digital-toolbox.open{
    max-width:none !important;
    max-height:none !important;
  }
  .digital-toolbox.open .tb-btn{
    display:flex !important;
  }
}