:root{--p:#4b2e83;--p2:#6a45b5;--gold:#c77d1a;--bg:#f6f3fb;--card:#fff;--ink:#222;--mut:#666;--ok:#1f8a4c;--bad:#b3261e;--line:#e1dbee}
*{box-sizing:border-box}
body{margin:0;font-family:"Segoe UI","Nirmala UI",system-ui,sans-serif;background:var(--bg);color:var(--ink);line-height:1.5;font-size:16px}
header#top{position:sticky;top:0;z-index:10;display:flex;gap:10px;align-items:center;background:var(--p);color:#fff;padding:8px 12px}
header button{background:none;border:0;color:#fff;font-size:20px;cursor:pointer}
.brand{white-space:nowrap}.brand span{opacity:.8;font-size:13px}
#search{flex:1;min-width:80px;padding:7px 10px;border-radius:8px;border:0}
.pill{background:var(--gold);color:#fff;border-radius:14px;padding:3px 10px;font-size:13px;white-space:nowrap}
button.pill{border:0;cursor:pointer;font-size:14px}
#layout{display:flex;min-height:calc(100vh - 100px)}
#side{width:290px;background:#fff;border-right:1px solid var(--line);padding:10px;overflow:auto;max-height:calc(100vh - 50px);position:sticky;top:50px}
#side h4{margin:14px 6px 4px;font-size:12px;letter-spacing:.06em;color:var(--mut);text-transform:uppercase}
#side a{display:flex;justify-content:space-between;gap:8px;padding:7px 8px;border-radius:8px;color:var(--ink);text-decoration:none;font-size:14px;cursor:pointer}
#side a:hover{background:#f0eaff}#side a.on{background:#e7dcff;font-weight:600}
#side a small{color:var(--mut)}
#main{flex:1;padding:16px;max-width:980px;margin:0 auto;width:100%}
.hero{background:linear-gradient(135deg,var(--p),var(--p2));color:#fff;border-radius:14px;padding:20px}
.hero h1{margin:4px 0}.hero p{margin:6px 0;opacity:.92}
.btn{display:inline-block;background:var(--gold);color:#fff;border:0;padding:9px 16px;border-radius:8px;cursor:pointer;font-size:15px;margin:4px 6px 4px 0;text-decoration:none}
.btn.alt{background:#fff;color:var(--p);border:1px solid var(--p)}
.btn.sm{padding:4px 10px;font-size:13px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;margin-top:12px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;margin:12px 0}
.grid .card{margin:0;cursor:pointer}.grid .card:hover{border-color:var(--p2)}
.card h2,.card h3{margin-top:0;color:var(--p)}
h1.day{color:var(--p);margin:6px 0}
.mut{color:var(--mut);font-size:13px}
table{border-collapse:collapse;width:100%;margin:8px 0;font-size:14px;display:block;overflow-x:auto}
th,td{border:1px solid var(--line);padding:6px 8px;text-align:left;vertical-align:top}
th{background:#efe8fb}
details{margin:8px 0}summary{cursor:pointer;font-weight:600;color:var(--p)}
.callout{border-left:4px solid var(--gold);background:#fff8ec;padding:8px 12px;border-radius:6px;margin:8px 0}
.note{background:#eef6ff;border-left:4px solid #3b82c4}
.fw{background:#fffbe9;border:1px solid #ecd98a}
textarea,input[type=text]{width:100%;padding:8px;border:1px solid var(--line);border-radius:8px;font:inherit}
textarea{min-height:60px}
.opt{display:block;width:100%;text-align:left;margin:4px 0;padding:8px 10px;border:1px solid var(--line);background:#fff;border-radius:8px;cursor:pointer;font:inherit}
.opt.right{background:#e3f6ea;border-color:var(--ok)}.opt.wrong{background:#fde8e6;border-color:var(--bad)}
.fc{perspective:800px;height:170px;cursor:pointer;margin:10px 0}
.fc>div{height:100%;display:flex;align-items:center;justify-content:center;text-align:center;padding:16px;border-radius:14px;background:#fff;border:2px solid var(--p2);font-size:18px}
.fc.back>div{background:#efe8fb}
.tag{display:inline-block;background:#efe8fb;color:var(--p);border-radius:10px;padding:1px 8px;font-size:12px;margin-right:4px}
.score{font-weight:700;color:var(--p)}
.gridtool svg{width:100%;max-width:560px;border:1px solid var(--line);background:#fff;touch-action:none;border-radius:8px}
footer#disc{font-size:12px;color:var(--mut);text-align:center;padding:14px;border-top:1px solid var(--line);background:#fff}
.deeper{background:#faf7ff;border-left:4px solid var(--p2)}.deeper h4{margin-top:0;color:var(--p)}
ul.chk{list-style:none;padding-left:4px}
.certificate{border:10px double #c77d1a;background:#fffdf6;padding:8px;margin:14px 0}
.certin{border:2px solid #4b2e83;padding:22px 16px;text-align:center}
.certin h1{color:#4b2e83;margin:6px 0;font-size:28px}.certin h2{color:#9a5200;margin:6px 0}
.ct1{letter-spacing:.12em;text-transform:uppercase;color:#9a5200;font-size:13px}
.cname{font-size:30px;font-weight:700;color:#7a3e00;border-bottom:2px solid #c77d1a;display:inline-block;padding:2px 24px;margin:6px 0}
.csign{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;text-align:left;margin-top:22px;font-size:14px}
.csign span{color:#666;font-size:12px}
.cdisc{font-size:11px;color:#666;margin-top:16px}
@media print{.certificate{page-break-inside:avoid}}
@media(max-width:800px){header#top{gap:6px;padding:8px}.brand span{display:none}#search{min-width:0;width:0}.pill{padding:3px 8px;font-size:12px}#main{padding:10px}.hero h1{font-size:22px}h1.day{font-size:22px}#side{position:fixed;left:-310px;top:50px;height:calc(100vh - 50px);z-index:9;transition:left .2s;box-shadow:2px 0 10px #0003}#side.open{left:0}}
@media print{header#top,#side,footer#disc,.noprint,.btn{display:none!important}#main{max-width:none}.card{break-inside:avoid}}

/* ===== Ashtakoota additions (appended after the RAVA rules above, which are unchanged; same variables) ===== */
#main:focus{outline:none}
#main{min-width:0}   /* a wide table or matrix scrolls inside its own wrapper; without this its width pushes #main wider and squeezes the 290px sidebar (801-1100px screens) */
#search{text-overflow:ellipsis}   /* a placeholder that does not fit (long brand, language pill on phones) ends with an ellipsis instead of being cut mid-letter */
.card[role=link]{cursor:pointer}.card[role=link]:hover{border-color:var(--p2)}
.card[role=link]:focus-visible,.fc:focus-visible,ul.chk li:focus-visible,.opt:focus-visible{outline:2px solid var(--p2);outline-offset:2px}
.lk{color:var(--p2);font-weight:600;text-decoration:none}.lk:hover{text-decoration:underline}
.badge{display:inline-block;background:#fff8ec;color:#9a5200;border:1px solid #ecd98a;border-radius:10px;padding:1px 8px;font-size:12px;margin-right:4px;white-space:nowrap}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.chip{display:inline-block;background:#f0eaff;border:1px solid var(--line);color:var(--p);border-radius:14px;padding:2px 10px;font-size:12px}
.callout.plus{background:#faf7ff;border-left-color:var(--p2)}
.callout.result{margin:12px 0}
.callout.result.pass{background:#e3f6ea;border-left-color:var(--ok)}
.callout.result.fail{background:#fde8e6;border-left-color:var(--bad)}
mark{background:#ecd98a;color:inherit;border-radius:2px;padding:0 1px}
label>textarea,label>input[type=text]{margin:4px 0 10px}
/* instructor (home card and instructor page) */
.ins{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap}
.ins-photo{width:150px;height:187px;object-fit:cover;object-position:top;border-radius:12px;border:3px solid var(--gold);box-shadow:0 2px 8px #0003;background:#efe8fb}
.ins.big .ins-photo{width:200px;height:249px}
.ins-body{flex:1;min-width:240px}
.ins-body h2{margin-bottom:2px}.ins-body .insname{margin:0 0 2px}
.ins-body .ttl{margin:0 0 10px;color:var(--mut);font-size:14px}
/* the eight Kootas at a glance */
table.kt td:nth-child(2){text-align:center;font-weight:700;color:var(--p)}
table.kt td:last-child{white-space:nowrap}
table.kt tr:last-child td{background:#efe8fb;font-weight:700}
table.tm td:first-child{white-space:nowrap;font-weight:600;color:var(--p)}
/* enhanced syllabus */
h2.part{margin:26px 0 2px;color:var(--p);border-bottom:2px solid var(--line);padding-bottom:4px}
.sylday h3{margin:0 0 8px;font-size:18px}
.sylday h4{margin:12px 0 2px;color:var(--p)}
.sylday ul{margin:4px 0}
/* weekly tests: running score */
.tscore{position:sticky;top:45px;z-index:5;background:#fffdf6;border:1px solid #ecd98a;border-radius:10px;padding:8px 12px;margin:10px 0;font-size:14px}
.meter{height:8px;border-radius:6px;background:#efe8fb;overflow:hidden;margin-top:6px}
.meter>i{display:block;height:100%;background:var(--gold);transition:width .3s}
/* quick-reference checklist and progress backup */
ul.chk li{padding:2px 0}ul.chk li[data-chk]{cursor:pointer}
ul.chk .cb{display:inline-block;min-width:1.2em}
.backup .row{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
@media(max-width:800px){.ins{justify-content:center}.ins-body{min-width:0;flex-basis:100%}}
@media print{.tscore{position:static}}

/* ===== Ashtakoota additions, engine step C: Moon Finder, Guna Milan Lab, Koota table explorer ===== */
[hidden]{display:none!important}
.labwrap section,.labwrap details.kex,.refwrap section{scroll-margin-top:62px}
.labnav{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:10px 0}
button.chip{cursor:pointer;font:inherit;font-size:12px;background:#f0eaff}
button.chip:hover{border-color:var(--p2);background:#efe8fb}
button.linkbtn{background:none;border:0;padding:0;font:inherit;cursor:pointer;text-align:left}
.bad,.fl{color:var(--bad)}.fl{cursor:help}
.dirlab{display:block;color:var(--mut);font-size:11px;font-weight:600}
.err{color:var(--bad);font-weight:600;margin:6px 0}
.callout.warn{background:#fffbe9;border:1px solid #ecd98a;border-left:4px solid var(--gold)}
.callout.ok{background:#e3f6ea;border-left-color:var(--ok)}
/* inputs */
.fld{display:flex;flex-direction:column;gap:2px;margin:6px 8px 6px 0;font-size:13px;color:var(--mut)}
.fld>span:first-child{font-weight:600}
.fld select,.fld input{font:inherit;font-size:15px;color:var(--ink);padding:7px 8px;border:1px solid var(--line);border-radius:8px;background:#fff;max-width:100%}
.fld select:focus,.fld input:focus,.segopt input:focus-visible{outline:2px solid var(--p2);outline-offset:1px}
.fld.sm input{width:72px}.fld .inl{display:flex;align-items:center;gap:3px}.fld .inl b{color:var(--p);font-size:16px}
.dms{display:flex;flex-wrap:wrap;align-items:flex-end}
.pn-nak{display:flex;flex-wrap:wrap;align-items:flex-end}.pn-nak select{max-width:100%}
.seg{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.segopt{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:18px;padding:4px 12px;background:#fff;cursor:pointer;font-size:14px}
.segopt:hover{border-color:var(--p2)}
.segopt:has(input:checked){border-color:var(--p);background:#efe8fb;color:var(--p);font-weight:600}
/* partner panels */
.partners{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:12px;margin:10px 0}
.partner{border:1px solid var(--line);border-top:4px solid var(--p2);border-radius:12px;padding:12px;background:#fff;min-width:0}
.partner.pg{border-top-color:var(--gold)}
.partner h3{margin:0 0 2px;display:flex;align-items:center;gap:8px;font-size:17px}
.partner .sub{margin:0 0 6px}
.dot{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--p2)}.pg .dot{background:var(--gold)}
.pn-out{margin-top:8px;font-size:14px}.pn-out p{margin:4px 0}.pn-out .chips{margin:6px 0 0}
.pn-half{margin:8px 0}.pn-half .halfnote{margin:6px 0;font-size:14px}
.labtools{margin:4px 0 8px}
/* Moon Finder */
table.kv{display:table;width:100%;max-width:100%}
table.kv th{background:#faf7ff;width:34%;font-weight:600;text-align:left}
.mfbtns{margin-top:8px}
.mfout .callout{margin:8px 0}
/* presets */
.presets{margin:8px 0}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:8px;margin-top:8px}
button.pre{text-align:left;font:inherit;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 10px;cursor:pointer;display:flex;flex-direction:column;gap:2px}
button.pre:hover{border-color:var(--p2);background:#faf7ff}
button.pre b{color:var(--p);font-size:14px}button.pre span{font-size:12px;color:var(--mut)}
/* result table and total */
.tw{overflow-x:auto}
table.labtab{display:table;width:100%}
table.labtab th[scope=col]{white-space:nowrap}
table.labtab td.sc{white-space:nowrap;min-width:64px}
table.labtab .why{min-width:240px;font-size:13px}
table.labtab tr.tot th,table.labtab tr.tot td{background:#efe8fb;font-weight:700}
table.labtab tr.kfocus th,table.labtab tr.kfocus td{background:#fff8ec}table.labtab tr.kfocus th:first-child{box-shadow:inset 4px 0 0 var(--gold)}
.sbar{display:block;height:5px;border-radius:3px;background:#efe8fb;margin-top:3px}
.sbar>i{display:block;height:100%;border-radius:3px;background:var(--gold)}
.totalbox{border:1px solid #ecd98a;border-radius:12px;padding:12px;margin:12px 0;background:#fffdf6}
.tnum{font-size:32px;font-weight:700;color:var(--p);line-height:1.1}.tnum small{font-size:16px;font-weight:600;color:var(--mut)}.tpct{font-size:16px;color:var(--gold);margin-left:6px}
.bar{position:relative;height:16px;border-radius:8px;background:#efe8fb;overflow:hidden;margin:8px 0}
.bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--p2),var(--gold))}
.bar>.tk{position:absolute;top:0;bottom:0;width:2px;background:#fff}
.bandline{margin:4px 0}
.bandscale{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.bs{border:1px solid var(--line);border-radius:10px;padding:2px 10px;font-size:12px;color:var(--mut);background:#fff}
.bs.on{background:var(--p);color:#fff;border-color:var(--p);font-weight:600}
.dflag{border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:6px;padding:8px 12px;margin:8px 0;background:#fff}
.dflag.dd{border-left-color:var(--bad)}
.dflag .dh{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.dtag{display:inline-block;border-radius:10px;padding:1px 9px;font-size:12px;font-weight:600;background:#fff8ec;color:#9a5200;border:1px solid #ecd98a}
.dflag.dd .dtag{background:#fde8e6;color:var(--bad);border-color:var(--bad)}
.dflag p{margin:6px 0 2px;font-size:14px}
ul.beyond li{padding:4px 0;cursor:pointer}ul.beyond li:focus-visible{outline:2px solid var(--p2);outline-offset:2px}
.labact{margin:12px 0}
.copybox{width:100%;min-height:150px;margin-top:8px;font:13px/1.4 Consolas,monospace}
.sheethead{border-bottom:2px solid var(--p);margin-bottom:10px}
.printonly{display:none}
/* explorer */
details.kex{padding:0;margin:10px 0}
details.kex>summary{padding:10px 14px;list-style:none;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
details.kex>summary::-webkit-details-marker{display:none}
details.kex>summary::before{content:'▸';font-weight:700;display:inline-block;transition:transform .15s}
details.kex[open]>summary::before{transform:rotate(90deg)}
.kexbody{padding:0 14px 14px}
.ksc{margin-left:auto;font-weight:700;color:var(--p)}
.here{background:#faf7ff;border-left:4px solid var(--p2);border-radius:6px;padding:8px 12px;margin:8px 0;font-size:14px}
.kgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;align-items:start}
.kgrid>div{min-width:0}
.kexbody h4{margin:12px 0 4px;color:var(--p)}
.legend{display:flex;flex-wrap:wrap;gap:12px;font-size:13px;margin:6px 0}.legend span{display:inline-flex;align-items:center;gap:5px}
.sw{display:inline-block;width:14px;height:14px;border-radius:3px;border:1px solid #0003}
.sw.hb{background:#d9c8ff}.sw.hg{background:#ffd48a}.sw.hx{background:var(--p)}
.mxw{overflow-x:auto}
table.mx{display:table;width:auto;font-size:13px;margin:6px 0}
table.mx th,table.mx td{padding:4px 7px;text-align:center;white-space:nowrap}
table.mx td.l,table.mx th.l{text-align:left;white-space:normal}
table.mx tbody th[scope=row]{background:#faf7ff;text-align:left}
table.mx .corner{background:#efe8fb;font-size:11px;line-height:1.2}
table.mx td.zero,table.mx td .zero{color:var(--bad)}
table.mx td.good{color:var(--ok);font-weight:600}
table.mx td.mut{color:var(--mut)}
table.mx td.vdiff{background:#fff8ec;font-weight:700;outline:1px solid var(--gold);outline-offset:-1px}
table.mx.bk th,table.mx.bk td{padding:3px 5px}
table.mx.yn th,table.mx.yn td{padding:3px 5px}
table.mx.grpc td{min-width:120px}
details.var{margin:6px 0}details.var summary{font-size:14px}
.sg{display:inline-block;border-radius:4px;padding:0 4px}
/* highlights: bride = purple, groom = gold, both = deep purple with a gold outline. Palette rule for this whole block: RAVA variables or RAVA's own
   literals only; the three highlight tints below (lavender #d9c8ff, amber #ffd48a, violet #b79cf2) are tints of --p2 and --gold, the only extra colours */
.hb{background:#d9c8ff;font-weight:700}
.hg{background:#ffd48a;font-weight:700}
.hx{background:var(--p);color:#fff;font-weight:700;box-shadow:inset 0 0 0 2px var(--gold)}
td.rb{background:#f0eaff}td.cg{background:#fff8ec}
table.mx th.hb,table.mx td.hb{background:#d9c8ff}table.mx th.hg,table.mx td.hg{background:#ffd48a}
table.mx tbody th.hb{background:#d9c8ff}table.mx tbody th.hg{background:#ffd48a}
table.mx tbody tr.hb>*{background:#d9c8ff}table.mx tbody tr.hg>*{background:#ffd48a}table.mx tbody tr.hx>*{background:var(--p);color:#fff}
table.mx tbody tr.hx .sg.hb,table.mx tbody tr.hx .sg.hg,table.mx tbody tr.hx .sg.hx,.sg.hb,.sg.hg,.sg.hx{color:var(--ink)}
.sg.hb{background:#d9c8ff}.sg.hg{background:#ffd48a}.sg.hx{background:#b79cf2;box-shadow:none}
table.mx tbody tr.hx .sg{box-shadow:none}
@media(max-width:640px){
  .tw{overflow:visible}
  table.labtab,table.labtab tbody,table.labtab tfoot,table.labtab tr,table.labtab th,table.labtab td{display:block;width:auto}
  table.labtab thead{display:none}
  table.labtab tr{border:1px solid var(--line);border-radius:10px;margin:8px 0;padding:6px 10px;background:#fff}
  table.labtab th,table.labtab td{border:0;padding:2px 0;background:none!important}
  table.labtab td[data-l]::before{content:attr(data-l) ': ';font-weight:600;color:var(--mut)}
  table.labtab .dirlab{display:none}
  table.labtab .why{min-width:0}
  table.labtab tr.tot{background:#efe8fb}
  .tnum{font-size:28px}
  table.kv th{width:38%}
}
@media print{
  .printsel .printonly{display:block!important}
  .printsel>*:not(.psel){display:none!important}
  .printsel .noprintsheet{display:none!important}
  .printsel .psel{border:0!important;padding:0!important;margin:0!important;break-inside:auto!important;break-before:auto!important;page-break-before:auto!important}
  .bar>i,.sbar>i,.bs.on,.dtag{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  table.labtab .why{min-width:0}
  .tw{overflow:visible}
}

/* ===== engine step C: Koota reference tables and printable worksheets ===== */
.rtw{overflow-x:auto}
table.rt{display:table;width:100%;font-size:13px}
table.rt th,table.rt td{padding:4px 7px}
table.rt .nw{white-space:nowrap}
table.rt td.l{text-align:left}
table.rt tbody th[scope=row]{text-align:left;background:#faf7ff}
table.rt tr.grp th{background:#efe8fb;color:var(--p);text-align:left;font-size:14px}
table.rt tr.strad td,table.rt tr.strad th{background:#fff8ec}
table.rt tr.tot th,table.rt tr.tot td{background:#efe8fb;font-weight:700}
table.rt tr.hide{display:none}
#ref-pada-d>summary{margin-bottom:6px}
.wsheet{border-color:var(--p2)}
.wshead h2{margin:0 0 2px}
.wstools{margin:6px 0 10px}
.wsheet h3{margin:14px 0 4px;color:var(--p);font-size:16px}
.wsheet p{margin:6px 0}
.wsheet .ul{display:inline-block;min-width:150px;min-height:1.3em;border-bottom:1px solid var(--ink);margin:0 4px;vertical-align:bottom;padding:0 4px}
.wsheet .ul.w1{min-width:110px}
.wsheet .ul.w2{min-width:240px}
.wsheet .ul.w3{display:block;min-width:0;width:100%;min-height:1.7em;margin:0}
.wsheet .bx{display:inline-block;font-size:17px;line-height:1}
table.wst{display:table;width:100%;font-size:13px}
table.wst th,table.wst td{border:1px solid var(--p2);padding:4px 6px;vertical-align:top;height:2.3em}
table.wst.tall td{height:3.6em}
table.wst th{background:#efe8fb}
table.wst td.hint{font-size:11.5px;color:var(--mut)}
table.wst td.small{font-size:11.5px}
table.wst tr.tot th,table.wst tr.tot td{background:#faf7ff;font-weight:700}
@media(max-width:640px){
  table.wst{display:block;overflow-x:auto}
  .wsheet .ul.w2{min-width:150px}
}
@media print{
  .wsheet{break-before:page;page-break-before:always;break-inside:auto}
  table.wst tr,table.labtab tr{break-inside:avoid;page-break-inside:avoid}
  .wsheet .ul{border-bottom-color:var(--ink)}
  table.wst,table.wst td,table.wst th{font-size:11px}
  table.wst th{background:#efe8fb!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .refwrap .rtw{overflow:visible}
  table.rt{font-size:11px}
}

/* ===== QA-4 learning flows ===== */
/* flashcards: the face grows with its text; RAVA's fixed 170px box let long text spill over the counter and hint lines on phones */
.fc{height:auto;min-height:170px}
.fc>div{height:auto;min-height:170px;overflow-wrap:anywhere}
/* answered MCQ options carry a mark as well as a colour, so the right and the wrong pick can be told apart without seeing green and red */
.opt.right::after{content:" \2713";font-weight:700;color:var(--ok)}
.opt.wrong::after{content:" \2717";font-weight:700;color:var(--bad)}

/* ===== QA-6 Hindi (Devanagari) typography: the app sets <html lang="hi"> ===== */
/* RAVA's body stack already names Nirmala UI, but buttons, inputs and selects do not inherit it (they fall back to Arial, which has no Devanagari),
   so the Hindi font list is given to them too and is extended with the Devanagari system fonts of the other platforms */
html[lang="hi"] body,html[lang="hi"] button,html[lang="hi"] input,html[lang="hi"] select,html[lang="hi"] textarea{font-family:"Segoe UI","Nirmala UI","Noto Sans Devanagari","Kohinoor Devanagari","Devanagari Sangam MN",Mangal,"Lohit Devanagari",system-ui,sans-serif}
/* a line-height below about 1.45 crowds or clips the matras and the headline: buttons, inputs and the matrix corner cells otherwise use "normal" (about 1.33) or 1.2 */
html[lang="hi"] #main button,html[lang="hi"] #main input,html[lang="hi"] #main select,html[lang="hi"] #main textarea,html[lang="hi"] #main option{line-height:1.5}
html[lang="hi"] #search{line-height:1.5;padding-top:5px;padding-bottom:5px}   /* typed Hindi gets room for the matras; the box stays about as tall as RAVA's (a phone's 40px height rule above still wins) */
html[lang="hi"] table.mx .corner{line-height:1.5}
html[lang="hi"] .copybox{line-height:1.6}
html[lang="hi"] .tnum .tag{line-height:1.5}   /* the "अस्थायी" (provisional) tag sits inside the big total, whose line-height is 1.1 */

/* QA-5: a long unbroken word (a pasted address typed into the search box is echoed in the results heading) must wrap instead of widening the page */
h1.day,.card[role=link]{overflow-wrap:anywhere}

/* ===== QA-5 small screens (800px and below: phones and tablets in portrait): touch targets of at least 40px and text of at least 14px.
   RAVA colours, fonts and layout are unchanged; only sizes and paddings grow. The header stays 50px high, so the drawer and the sticky score panel keep their offsets. ===== */
@media(max-width:800px){
  header#top{padding:5px 8px}
  header button{min-width:40px;min-height:40px}
  #search{height:40px;font-size:16px}
  .pill{font-size:14px}
  button.pill{border-radius:20px;padding:3px 12px}
  #side a{padding:10px 8px}
  #side h4{font-size:14px}
  .tscore{top:50px}
  .btn{display:inline-flex;align-items:center;justify-content:center;min-height:40px}
  .btn.sm{font-size:14px}
  button.chip,button.linkbtn{display:inline-flex;align-items:center;min-height:40px}
  summary{padding:9px 0}
  details.var summary{padding:10px 0}
  ul.chk li[data-chk]{padding:9px 0}
  .segopt{min-height:40px}
  #main input,#main select,#main textarea{font-size:16px}
  #main input:not([type=radio]):not([type=checkbox]),#main select{min-height:40px}
  .mut,.tag,.badge,.chip,button.chip,.bs,.dtag,.legend,.fld,.dirlab,small,footer#disc,.ct1,.csign span,.cdisc,button.pre span,table.labtab .why,table.mx,table.rt,table.wst,table.wst td.hint,table.wst td.small,table.mx .corner{font-size:14px}
  .cname{max-width:100%;overflow-wrap:anywhere}
  /* the closed drawer sits off-canvas: keep it out of the Tab order and away from screen readers until it is opened */
  #side{visibility:hidden;transition:left .2s,visibility 0s linear .2s}
  #side.open{visibility:visible;transition:left .2s,visibility 0s}
}
/* QA-5 phones: while the search box has focus the brand and the progress pill step aside, so that there is room to type */
@media(max-width:480px){
  header#top:has(#search:focus) .brand,header#top:has(#search:focus) #progressPill{display:none}
}
/* QA-5 contrast: the palette is unchanged; only the text colour of a few small items is deepened so that the pair reaches 4.5:1 */
#side a.on small{color:#595959}
mark{color:var(--ink)}
table.mx td.good,table.mx td .good{color:#14663a}
table.mx td.zero,table.mx td .zero{color:#9c1f18}
table.mx td.good.hx{color:#b7f0c8}
table.mx td.zero.hx{color:#ffb4ab}
.hb .mut,.hg .mut,.hb small,.hg small{color:#4a4a4a}
.hb .bad,.hg .bad,.hb .fl,.hg .fl{color:#9c1f18}
.hx .mut,.hx small{color:#e9e1ff}
.sg.hb small,.sg.hg small,.sg.hx small,.sg.hb .mut,.sg.hg .mut,.sg.hx .mut{color:var(--ink)}
table.mx tbody th[scope=row].hx,table.rt tbody th[scope=row].hx{background:var(--p);color:#fff}
table.mx td.mut.hx{color:#e9e1ff}
table.mx td.mut.hb,table.mx td.mut.hg{color:#4a4a4a}
/* QA-5 skip link: off-screen until it receives keyboard focus */
.skip{position:absolute;left:8px;top:-100px;z-index:30;background:#fff;color:var(--p);border:2px solid var(--p);border-radius:8px;padding:8px 14px;font:inherit;font-weight:600;cursor:pointer}
.skip:focus{top:8px}
@media print{.skip{display:none!important}}