/* NaamSimar lessons (Harmonium & Gurbani Kirtan course) */
:root{--blue:#163A84;--blue2:#1656ce;--kesri:#d9731a;--red:#c0392b;--soft:#eaf2ff;--warn:#fff4e5;--muted2:#5c6f8c}
.lhero h1{display:flex;flex-direction:column;gap:4px}
.lhero .h1pa{font:700 clamp(28px,4.6vw,48px)/1.25 Baloo,Mukta,sans-serif;color:#ffd687}
.lhero .h1en{font:700 clamp(22px,3.2vw,34px)/1.2 Baloo,Mukta,sans-serif}
.lhero .crumbs{font-size:15px;color:#c6d9f0;margin-bottom:10px}
.lhero .eyebrow{text-transform:none;letter-spacing:.02em;font-size:15px;color:#cfe6ff}
.lmain{max-width:1000px}
.ltools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;padding:12px 16px;margin-bottom:16px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 10px 28px #163f7912}
.lsa{display:flex;align-items:center;gap:8px;font-weight:700;color:#14406f;font-size:15px}
.lsa select{min-height:44px;padding:6px 12px;border:1px solid #b9d0ec;border-radius:12px;font:inherit;font-size:16px;background:#f7fbff;color:#0b2e70}
.lang{display:inline-flex;border:1px solid #c8dcf3;border-radius:99px;overflow:hidden}
.lang button{min-height:44px;padding:6px 14px;border:0;background:#fff;color:#14406f;font-weight:700;font-size:15px;cursor:pointer}
.lang button+button{border-left:1px solid #c8dcf3}
.lang button[aria-pressed="true"]{background:#1656ce;color:#fff}
.lprint{min-height:44px;padding:6px 16px;border:1px solid #c8dcf3;border-radius:99px;background:#fff;color:#14406f;font-weight:700;font-size:15px;cursor:pointer}
.lesson{padding:30px 34px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:0 14px 38px #163f7912}
.lesson p,.lesson li{font-size:17.5px;line-height:1.75;color:#22395a;margin:0 0 10px}
.lesson .pa p,.lesson .pa li{font-size:18.5px;line-height:1.85}
.lesson h2{margin:30px 0 12px;color:#0e2d63;font:700 25px/1.3 Baloo,Mukta,sans-serif;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline}
.lesson h2 .en{font:600 19px/1.3 Mukta,sans-serif;color:#4f6684}
.lesson h3{margin:22px 0 8px;color:#14406f;font:700 20px/1.35 Baloo,Mukta,sans-serif}
.lesson h3 .en{font-weight:600;color:#4f6684;font-size:17px}
.lesson h2.sect{margin-top:46px;padding-top:22px;border-top:2px solid #e3edf9;font-size:30px}
.bi{display:grid;grid-template-columns:1fr 1fr;gap:6px 28px;margin:0 0 8px}
.bi>.en{color:#3a5372}
.bi.intro{padding:16px 18px;border-radius:16px;background:var(--soft);margin-bottom:18px}
.bi.intro p{font-size:18.5px;color:#10254a}
.bi ul,.bi ol{padding-left:22px;margin:0 0 10px}
body.lang-pa .bi{grid-template-columns:1fr}body.lang-pa .bi>.en,body.lang-pa h2>.en,body.lang-pa h3>.en,body.lang-pa .box-t .en{display:none}
body.lang-en .bi{grid-template-columns:1fr}body.lang-en .bi>.pa,body.lang-en h2>.pa,body.lang-en h3>.pa,body.lang-en .box-t .pa{display:none}
body.lang-en .lesson h2 .en{font:700 25px/1.3 Baloo,Mukta,sans-serif;color:#0e2d63}
/* boxes */
.box{margin:18px 0;padding:16px 18px 8px;border-radius:16px;border:1px solid #c8dcf3;background:#f3f8ff}
.box-t{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;font:700 18px/1.3 Baloo,Mukta,sans-serif;color:#0e3f8a;margin-bottom:10px}
.box-t .en{font:600 15.5px Mukta,sans-serif;color:#4f6684}
.box.warn{background:var(--warn);border-color:#f2c48c}.box.warn .box-t{color:#9a4a07}
.box.practice{background:#fff;border:2px solid #1656ce}.box.practice .box-t{color:#1656ce}
.kf-box{margin:12px 0;padding:14px 16px;border-radius:14px;background:#eef7ff;border:1px solid #c8dcf3}
/* Gurbani */
.gurbani{margin:20px 0;padding:18px 20px;border-radius:18px;background:linear-gradient(180deg,#fffaf0,#fff6e6);border:1px solid #f0dcb4;text-align:center}
.gurbani .head{font:600 17px Mukta,sans-serif;color:#7a5200;margin-bottom:6px}
.gurbani .gl{font:600 clamp(20px,2.6vw,25px)/1.7 Mukta,'Noto Sans Gurmukhi',sans-serif;color:#3a2100}
.gurbani .gl.rahao{color:#0b4fb3}
.gurbani .gr{font-size:14.5px;color:#7b6a52;font-style:italic;margin:-2px 0 6px}
.gurbani.shabad{text-align:left}.gurbani.shabad .gl{font-size:clamp(19px,2.3vw,22px)}
.gurbani .ref{margin-top:8px;font-size:14.5px;color:#7a5200}.gurbani .ref a{color:#1656ce;font-weight:700}
.gurbani .meaning{margin-top:12px;padding-top:12px;border-top:1px dashed #e7cf9f;text-align:left}
.gurbani .meaning p{font-size:16px;margin:0}
body.no-roman .gr{display:none}
/* sargam marks */
.sargam{white-space:normal}
.nt{position:relative;display:inline-block;padding:0 1px;line-height:1.3}
.nt.komal{border-bottom:2px solid currentColor}
.nt.tivra::before{content:"";position:absolute;top:-6px;left:48%;width:2px;height:6px;background:currentColor}
.nt.taar::after{content:"•";position:absolute;top:-.85em;left:0;right:0;text-align:center;font-size:.6em;line-height:1}
.nt.mandra::after{content:"•";position:absolute;bottom:-.95em;left:0;right:0;text-align:center;font-size:.6em;line-height:1}
.hold{color:#8aa0bd}.bar{color:var(--kesri);padding:0 4px}.gap{display:inline-block;width:12px}
.grp{border-bottom:1.5px solid #7d90ad;border-radius:0 0 9px 9px;padding:0 2px}
.binotes{display:flex;gap:12px;align-items:flex-start;margin:6px 0 14px}
.binotes .bn>div:first-child{font:600 21px/1.6 Mukta,sans-serif;color:#0b2e70;letter-spacing:.02em}
.binotes .bn .en{font-size:15px;color:#4f6684;margin-top:4px}
.binotes .nt{margin-right:7px}
.play,.btn-play,.btn-soft{cursor:pointer;font-weight:700}
.play{flex:none;width:44px;height:44px;border-radius:50%;border:0;background:#1656ce;color:#fff;font-size:16px;box-shadow:0 4px 0 #0e3f8a;margin-top:2px}
.play:active{transform:translateY(2px);box-shadow:0 2px 0 #0e3f8a}
.play.on,.btn-play.on{background:#d9731a;box-shadow:0 4px 0 #9c430c}
.nt.now{background:#ffe3a6;border-radius:5px}
.al-row{display:flex;align-items:flex-start;gap:10px}
.al-dir{width:56px;flex:none;font:700 15px Mukta,sans-serif;color:var(--kesri);padding-top:10px}
.al-dir .en{display:block;font-size:13px;color:#5c6f8c}
.alankar{margin:6px 0 18px;padding:10px 0;border-bottom:1px dashed #dbe7f5}
.ex-title{font:700 18px Baloo,Mukta,sans-serif;color:#14406f;margin:18px 0 6px}
.ex-title .en{font:600 15px Mukta,sans-serif;color:#5c6f8c;margin-left:6px}
.phr{display:flex;gap:10px;align-items:flex-start}
.phr .pn{width:28px;height:28px;border-radius:50%;background:var(--kesri);color:#fff;text-align:center;font:700 15px/28px Mukta,sans-serif;flex:none;margin-top:9px}
/* notation tables */
.ntn-wrap{margin:14px 0 20px;padding:12px;border:1px solid #d6e5f6;border-radius:16px;background:#fbfdff}
.ntn-title{font:700 17px Baloo,Mukta,sans-serif;color:#14406f;margin-bottom:8px}
.ntn-title .en{font:600 15px Mukta,sans-serif;color:#5c6f8c}
.ntn-btns{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.btn-play,.btn-soft{min-height:44px;padding:8px 16px;border-radius:99px;border:1px solid #1656ce;background:#1656ce;color:#fff;font-size:15px}
.btn-soft{background:#fff;color:#14406f;border-color:#c8dcf3}
.ntn-scroll,.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.notation{width:100%;min-width:560px;border-collapse:collapse;table-layout:fixed}
table.notation th{width:58px;font:600 13px Mukta,sans-serif;color:#5c6f8c;text-align:left;padding-right:4px}
table.notation td{text-align:center;padding:5px 1px;vertical-align:middle}
table.notation td.vs{border-left:2px solid var(--blue)}
table.notation tr.marks td{font:700 14px Mukta,sans-serif;color:var(--kesri);border-bottom:1px solid #e1eaf6}
table.notation tr.sw-g td{font:600 20px Mukta,sans-serif;color:#0b2e70;padding-top:12px}
table.notation tr.sw-e td{font-size:14px;color:#5c6f8c}
table.notation tr.bol td{font:500 17px Mukta,sans-serif;color:#3a2410;border-bottom:1px solid #e1eaf6;padding-bottom:10px}
table.notation tr.num td{font-weight:700;color:#5c6f8c}
table.notation tr.bol-e td{font-style:italic;color:#5c6f8c;font-size:14px}
table.notation td.now{background:#ffe9bf}
table.notation.theka{min-width:420px}
.theka{margin:12px 0 18px}
.tune-link{margin:6px 0 18px}.tune-link a{color:#1656ce;font-weight:700}
.player-frame{width:100%;height:640px;border:1px solid #c8dcf3;border-radius:16px;margin-top:10px;background:#fff}
/* data tables */
table.data{width:100%;border-collapse:collapse;margin:10px 0 18px;font-size:16px}
table.data th{background:#eaf2ff;color:#0e2d63;text-align:left;padding:10px;font-weight:700}
table.data td{padding:10px;border-bottom:1px solid #e1eaf6;vertical-align:top;color:#22395a}
table.data .en{color:#4f6684}
.raagcard table.rc{width:100%;border-collapse:collapse;margin:8px 0}
.rc th{width:150px;text-align:left;vertical-align:top;font:700 16px Mukta,sans-serif;color:var(--blue);padding:10px;background:#eef4fd;border-bottom:3px solid #fff}
.rc th .en{display:block;font:italic 14px Mukta,sans-serif;color:#5c6f8c}
.rc td{padding:10px 12px;border-bottom:1px solid #e1eaf6;font-size:16.5px}
.rc td .binotes{margin:0}
.checklist{padding-left:0}.checklist li{list-style:none;padding-left:30px;position:relative}
.checklist li::before{content:"☐";position:absolute;left:0;color:var(--kesri);font-size:20px;line-height:1.3}
.fingers-line{font-weight:700;color:var(--kesri);letter-spacing:.06em}
.sheet-head{display:flex;flex-wrap:wrap;gap:8px 24px;margin:12px 0;font-size:16px}
/* keyboard */
.kbd-wrap{margin:16px 0 22px}
.kbd{position:relative;height:170px;margin:0 auto;width:100%}
.kw,.kb{position:absolute;top:0;padding:0;cursor:pointer;font:inherit}
.kw{height:170px;background:#fbf7ee;border:1px solid #0f2a63;border-radius:0 0 8px 8px}
.kb{height:104px;background:#0b1530;border:0;border-radius:0 0 6px 6px;color:#fff;z-index:2}
.kw.on{background:#cfe0fb}.kb.on{background:#2a5fbf}
.kw.soft{background:#f1f5fc}.kb.soft{background:#4a5570}
.kw.press{background:#ffd687}.kb.press{background:#d9731a}
.kw .kl{position:absolute;bottom:28px;left:0;right:0;text-align:center;font:700 15px Mukta,sans-serif;color:var(--blue)}
.kb .kl{position:absolute;bottom:8px;left:0;right:0;text-align:center;font:700 12px Mukta,sans-serif;color:#fff}
.kw .kn{position:absolute;bottom:6px;left:0;right:0;text-align:center;font:500 11px Mukta,sans-serif;color:#5c6f8c}
.fg{position:absolute;left:50%;margin-left:-11px;width:22px;height:22px;border-radius:50%;background:var(--kesri);color:#fff;font:700 13px/22px Mukta,sans-serif;text-align:center}
.kw .fg{bottom:58px}.kb .fg{top:40px}
.sadot{position:absolute;left:50%;margin-left:-7px;width:14px;height:14px;border-radius:50%;background:var(--red)}
.kw .sadot{top:116px}.kb .sadot{top:10px}
.kcap{text-align:center;font-size:15.5px;color:#4f6684;margin-top:10px}
.khint{text-align:center;font-size:13.5px;color:#7d90ad;margin-top:4px}
/* harmonium diagram */
.hdiag{margin:14px 0 20px}
.hd-box{position:relative;max-width:560px;margin:0 auto 16px;border:2px solid #6b4a2b;border-radius:10px;background:#f4e8d6;padding:0 0 12px}
.hd-bellows{height:44px;background:repeating-linear-gradient(90deg,#3b5c9e 0,#3b5c9e 22px,#2a447a 22px,#2a447a 26px);color:#fff;font:700 15px/44px Mukta,sans-serif;text-align:center;border-radius:8px 8px 0 0}
.hd-top{height:34px;display:flex;align-items:center;justify-content:center}
.hd-stops i{display:inline-block;width:16px;height:16px;border-radius:50%;background:#6b4a2b;margin:0 9px}.hd-stops i.d{background:#d9731a}
.hd-keys{display:flex;margin:0 22px;height:66px;border:1px solid #555}.hd-keys b{flex:1;background:#fff;border-right:1px solid #999}
.hd-front{display:flex;justify-content:space-between;margin:10px 26px 0;font:600 13px/1.25 Mukta,sans-serif;color:#6b4a2b;text-align:center}
.hd-labels div{font-size:16.5px;margin-bottom:8px;color:#22395a}
.hd-labels b{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--blue);color:#fff;font-size:14px;margin-right:8px}
.hd-labels .en{display:block;margin-left:34px;font-size:15px;color:#4f6684}
/* extras, progress */
.extras,.progress,.start-card,.parents,.lvl{margin-top:22px;padding:24px 26px;border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:0 12px 30px #163f7910}
.extras h2,.progress h2,.parents h2,.start-card h2{margin:0 0 14px;color:#0e2d63;font:700 23px/1.3 Baloo,Mukta,sans-serif}
.xgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.xcard{display:flex;flex-direction:column;gap:3px;padding:16px 18px;border:1px solid #c8dcf3;border-radius:16px;text-decoration:none;color:#14406f;background:#f7fbff;transition:transform .15s,box-shadow .15s}
.xcard:hover{transform:translateY(-3px);box-shadow:0 12px 26px #163f7920}
.xcard b{font-size:17px;color:#0b2e70}.xcard span{font-size:15.5px;color:#7a5200}.xcard small{font-size:14px;color:#4f6684}
.xcard.sh b{font:700 19px/1.5 Mukta,sans-serif}
.pchk{display:flex;gap:12px;align-items:flex-start;padding:12px 4px;font-size:17px;cursor:pointer}
.pchk input{width:26px;height:26px;flex:none;margin-top:2px;accent-color:#1b8f4c}
.pchk span span{display:block;color:#5c6f8c;font-size:15.5px}
.pnote{font-size:14.5px;color:#5c6f8c;margin:8px 0 0}
.lnav{max-width:none;margin-top:22px}
.lnav span:empty{display:block}
.credit{font-size:14px;color:#5c6f8c;margin:22px 4px 0;line-height:1.6}
/* course index */
.start-card{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;align-items:center;background:linear-gradient(120deg,#fff,#eef6ff)}
.start-card p{margin:0 0 8px;font-size:17px;color:#22395a}
.start-btns{display:flex;flex-direction:column;gap:10px}
.btn-big{display:flex;justify-content:center;align-items:center;gap:8px;min-height:56px;padding:12px 22px;border-radius:99px;background:linear-gradient(180deg,#d3651a,#b5500e 55%,#9a420a);color:#fff;font-weight:800;font-size:19px;text-decoration:none;box-shadow:inset 0 1px 0 #ffe2c2,0 4px 0 #9c430c,0 8px 18px #f08a2455}
.btn-soft2{display:flex;justify-content:center;min-height:48px;align-items:center;padding:10px 18px;border-radius:99px;border:1px solid #c8dcf3;background:#fff;color:#14406f;font-weight:700;text-decoration:none}
.parents ul{margin:0;padding-left:20px}.parents li{font-size:16.5px;color:#22395a;margin-bottom:6px}
.lvl-head{display:flex;gap:14px;align-items:center;margin-bottom:10px}
.lvl-n{flex:none;width:50px;height:50px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(145deg,#d8f2ff,#8dc9ff);color:#0d4387;font:700 22px Baloo,Mukta,sans-serif}
.lvl h2{margin:0;color:#0e2d63;font:700 22px/1.3 Baloo,Mukta,sans-serif}.lvl p{margin:2px 0 0;color:#5c6f8c;font-size:15px}
.lrows{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.lrow{display:flex;gap:12px;align-items:center;min-height:56px;padding:10px 14px;border:1px solid #dce8f7;border-radius:14px;text-decoration:none;color:#14406f;background:#fbfdff}
.lrow:hover{border-color:#9cc6f2;background:#f0f7ff}
.lno{flex:none;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#e2efff;color:#0d4387;font-weight:800}
.lt{display:flex;flex-direction:column;line-height:1.35}.lt b{font-size:16.5px;color:#0b2e70}.lt span{font-size:15px;color:#7a5200}
.lst{margin-left:auto;font-size:18px;color:#1b8f4c}
.lrow.tried .lst::after{content:"◐"}.lrow.done .lst::after{content:"✔"}.lrow.done .lno{background:#1b8f4c;color:#fff}
/* night */
body.night-mode :is(.ltools,.lesson,.extras,.progress,.start-card,.parents,.lvl){background:#102440;border-color:#2a4566}
body.night-mode .lesson :is(p,li),body.night-mode .bi>.en,body.night-mode :is(.parents li,.start-card p,table.data td){color:#d3e1f2}
body.night-mode .lesson :is(h2,h3),body.night-mode :is(.extras h2,.progress h2,.parents h2,.start-card h2,.lvl h2,.ex-title,.ntn-title){color:#fff}
body.night-mode .bi.intro,body.night-mode .box,body.night-mode .kf-box{background:#16325a;border-color:#2a4566}
body.night-mode .box.warn{background:#3a2a12;border-color:#7a5218}
body.night-mode .box.practice{background:#102440;border-color:#5aa0ff}
body.night-mode .gurbani{background:#2a2414;border-color:#5a4a24}body.night-mode .gurbani .gl{color:#ffe7b0}body.night-mode .gurbani .gl.rahao{color:#9fd0ff}
body.night-mode .gurbani :is(.gr,.ref,.head){color:#d8c49a}
body.night-mode .ntn-wrap{background:#0c1d36;border-color:#2a4566}
body.night-mode table.notation tr.sw-g td,body.night-mode .binotes .bn>div:first-child{color:#cfe6ff}
body.night-mode table.notation tr.bol td{color:#ffe7b0}
body.night-mode table.data th,body.night-mode .rc th{background:#1d3d66;color:#fff}
body.night-mode :is(.xcard,.lrow){background:#16325a;border-color:#2a4566}body.night-mode :is(.xcard b,.lt b){color:#fff}
body.night-mode :is(.lsa select,.lang button,.lprint,.btn-soft,.btn-soft2){background:#16325a;color:#fff;border-color:#2a4566}
body.night-mode .lang button[aria-pressed="true"]{background:#1656ce}
body.night-mode .start-card{background:#102440}
@media(max-width:760px){
 .bi{grid-template-columns:1fr;gap:2px}
 .bi>.en{padding-bottom:6px;border-bottom:1px dashed #e3edf9;margin-bottom:6px}
 .lesson{padding:20px 16px;border-radius:18px}
 .start-card{grid-template-columns:1fr}
 .lrows{grid-template-columns:1fr}
 .kbd{height:130px}.kw{height:130px}.kb{height:80px}.kw .sadot{top:84px}.kw .kl{bottom:22px;font-size:13px}.kw .fg{bottom:44px}
 .ltools{padding:10px 12px}
 .rc th{width:108px}
 .lesson h2{font-size:22px}
}
@media print{
 .site-top,.ltools,.extras,.progress,.lnav,footer,.ntn-btns,.play,.khint,.wafollow,.homefab{display:none!important}
 body{background:#fff}.lmain{margin:0;padding:0}.lesson{border:0;box-shadow:none;padding:0}
 .lesson::before{content:attr(data-title);display:block;font:700 22px Baloo,Mukta,sans-serif;margin-bottom:10px}
 .ntn-wrap,.box,.gurbani,.binotes,.kbd-wrap{break-inside:avoid}
 table.notation{min-width:0}
}
.seg{display:inline-block;white-space:nowrap}
.binotes .bn>div:first-child{line-height:2.3}
.binotes .bn .en{line-height:2}
.nt.taar::after,.nt.mandra::after{color:var(--kesri);font-size:.7em}
.nt.mandra::after{bottom:-1.05em}
@media(max-width:760px){
 .ltools{display:grid;grid-template-columns:1fr;gap:8px}
 .lsa{justify-content:space-between}
 .lang{display:grid;grid-template-columns:repeat(3,1fr)}
 .lprint{display:none}
 .binotes .bn>div:first-child{font-size:19px}
 .al-row{flex-direction:column;gap:0}.al-dir{padding-top:0;width:auto;display:flex;gap:6px}.al-dir .en{display:inline}
}
@media(max-width:560px){.rc,.rc tbody,.rc tr,.rc th,.rc td{display:block;width:auto}.rc th{border-bottom:0;padding-bottom:2px}.rc th .en{display:inline;margin-left:6px}.rc td{padding:4px 10px 12px}}
/* ---- contrast pass (day + night) ---- */
.lesson a{color:#1450b8;font-weight:700}
table.notation tr.marks td,.al-dir,.bar{color:#a84a0c}
.phr .pn{background:#b5530d}
.khint{color:#5c6f8c}
.kw .kn{color:#3b4a63}
.xcard span{color:#7a4a00}
body.night-mode .lesson a,body.night-mode .gurbani .ref a,body.night-mode .tune-link a,body.night-mode .sheet-link a{color:#8fd0ff}
body.night-mode .lsa,body.night-mode .lsa span{color:#e8f1ff}
body.night-mode .lesson h2 .en,body.night-mode .lesson h3 .en,body.night-mode .ex-title .en,body.night-mode .ntn-title .en{color:#b9c9dd}
body.night-mode .box-t{color:#9fd0ff}body.night-mode .box-t .en{color:#c9d8ea}
body.night-mode .box.warn .box-t{color:#ffc58a}body.night-mode .box.practice .box-t{color:#9fc4ff}
body.night-mode .binotes .bn .en,body.night-mode .kcap,body.night-mode .khint,body.night-mode .saName{color:#c9d8ea}
body.night-mode :is(.credit,.pnote,.lvl p,.lvl-count,.xcard small,.pchk span span){color:#b9c9dd}
body.night-mode :is(.lt span,.xcard span){color:#ffd687}
body.night-mode table.notation th,body.night-mode table.notation tr.sw-e td,body.night-mode table.notation tr.num td,body.night-mode table.notation tr.bol-e td{color:#b9c9dd}
body.night-mode table.notation tr.marks td,body.night-mode .al-dir,body.night-mode .bar{color:#ffb36b}
body.night-mode .gurbani .meaning p{color:#eadcbd}
body.night-mode .hold{color:#7f93b0}
body.night-mode table.data th .en,body.night-mode .rc th .en{color:#c9d8ea}
body.night-mode .kf-box a{color:#8fd0ff}
body.night-mode table.data .en,body.night-mode .al-dir .en{color:#c9d8ea}

/* lesson photos: parts of the harmonium, how to sit */
.lphoto{margin:16px 0 22px;display:grid;grid-template-columns:1.2fr 1fr;gap:18px;align-items:start}
.lp-stage{position:sticky;top:84px;border-radius:18px;overflow:hidden;box-shadow:0 14px 30px #0a1e4a2e;background:#0b1e3a}
.lp-stage img{display:block;width:100%;height:auto}
.lp-pin{position:absolute;transform:translate(-50%,-50%);width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#1473d6;color:#fff;font:800 15px Mukta,system-ui,sans-serif;border:3px solid #fff;box-shadow:0 0 0 6px #69baff55,0 4px 12px #0007}
.lp-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.lp-list li{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border-radius:14px;background:#f5f9ff;border:1px solid #dce9f8}
.lp-list i{flex:none;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:#1473d6;color:#fff;font:800 14px Mukta,system-ui,sans-serif;font-style:normal}
.lp-list b{font:700 18px/1.3 Baloo,Mukta,sans-serif;color:#0e2d63}.lp-list .lp-en{font-weight:700;color:#1458a7;font-size:15px}
.lp-list p{margin:2px 0 0;font-size:15.5px;line-height:1.5;color:#2c4564}.lp-list .lp-en2{font-size:14.5px;color:#4f6684}
.lsit{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:14px 0 22px}
.lsit figure{margin:0;border-radius:18px;overflow:hidden;background:#f5f9ff;border:1px solid #dce9f8;display:flex;flex-direction:column}
.lsit img{display:block;width:100%;height:240px;object-fit:cover;background:radial-gradient(circle at 50% 60%,#fff,#e3eeff 75%)}
.lsit figure:first-child img{object-fit:contain;padding:10px;filter:drop-shadow(0 12px 12px #0003)}
.lsit figcaption{padding:12px 14px;display:grid;gap:3px}.lsit figcaption b{font:700 18px/1.3 Baloo,Mukta,sans-serif;color:#0e2d63}.lsit figcaption span{font-size:15px;color:#3b5576;line-height:1.5}
body.night-mode .lp-list li,body.night-mode .lsit figure{background:#102a4f;border-color:#24497a}
body.night-mode .lp-list b,body.night-mode .lsit figcaption b{color:#fff}body.night-mode .lp-list .lp-en{color:#8fd0ff}
body.night-mode .lp-list p,body.night-mode .lsit figcaption span{color:#dce8f7}body.night-mode .lp-list .lp-en2{color:#b9cde6}
body.night-mode .lsit figure:first-child img{background:radial-gradient(circle at 50% 60%,#fff,#c9dbf5 80%)}
@media(max-width:760px){.lphoto{grid-template-columns:1fr}.lp-stage{position:relative;top:auto}.lp-stage{position:sticky;top:84px;top:auto}.lsit{grid-template-columns:1fr}.lsit img{height:auto;max-height:300px}.lp-pin{width:27px;height:27px;font-size:13px;box-shadow:0 0 0 4px #69baff55,0 3px 8px #0007}}
@media print{.lp-pin{box-shadow:none}.lsit img{max-height:200px}}
