/* Rak Ajar · preferensi bersama (assets/rakpref.js): bahasa, tema gelap, ukuran huruf, huruf mudah dibaca, navigasi bawah HP.
   Variabel warna halaman toko (--ink, --sub, --mut, --bg, --card, --line, --lav, --peach, --link, --acc2) diganti saat gelap.
   Aturan gelap khusus halaman ditulis di halaman masing-masing. */
@font-face{font-family:OpenDyslexic;font-weight:400;font-display:swap;src:url(/murid/fonts/opendyslexic-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:OpenDyslexic;font-weight:700;font-display:swap;src:url(/murid/fonts/opendyslexic-latin-700-normal.woff2) format('woff2')}

/* teks dua bahasa di HTML statis: <span data-l="id">…</span><span data-l="en">…</span> */
html:not([data-lang=en]) [data-l=en],html[data-lang=en] [data-l=id]{display:none!important}

/* huruf mudah dibaca (judul tetap memakai huruf judul) */
html.mudah body,html.mudah :is(p,li,small,label,input,textarea,select,button,a,td,th,figcaption,summary,.note,.jt,span:not(.logo *)){font-family:OpenDyslexic,Nunito,system-ui,sans-serif!important;letter-spacing:.01em;word-spacing:.12em}
html.mudah .jt{text-align:left;hyphens:manual}

/* tema gelap: token */
html[data-mode=dark]{--ink:#F3EDF9;--sub:#D9CFE4;--mut:#B9ACC8;--bg:#15101C;--card:#211A2B;--line:#3A3048;--lav:#3A2D52;--peach:#3B2A1C;--link:#93C5F8;--acc2:#FFB066;color-scheme:dark}
html[data-mode=dark] body{background:var(--bg);color:var(--ink)}
html[data-mode=dark] :is(input,select,textarea){background:#1B1524;color:var(--ink);border-color:var(--line)}

/* tombol Aa + panel */
.rp{position:relative;flex:none}
.rp-btn{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:0 12px;border-radius:12px;border:1.5px solid var(--line,#EFE3D3);background:var(--card,#fff);color:var(--ink,#2B2238);font:800 1rem 'Baloo 2',Nunito,sans-serif;cursor:pointer}
.rp-btn .rp-bhs{font:800 .7rem Nunito,sans-serif;letter-spacing:.06em;background:var(--lav,#E8DDF2);border-radius:6px;padding:2px 5px}
.rp-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:80;width:min(300px,calc(100vw - 24px));background:var(--card,#fff);color:var(--ink,#2B2238);border:1.5px solid var(--line,#EFE3D3);border-radius:18px;padding:14px;box-shadow:0 22px 44px -20px rgba(20,14,30,.55);display:flex;flex-direction:column;gap:6px}
.rp-panel[hidden]{display:none}
.rp-l{margin:6px 0 0;font:800 .74rem Nunito,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--mut,#6B5B4E)}
.rp-seg{display:flex;gap:4px;background:var(--bg,#FFF8EE);border-radius:12px;padding:4px;align-items:center}
.rp-seg button{flex:1;min-height:40px;border:0;border-radius:9px;background:transparent;color:var(--sub,#4A3F55);font:800 .88rem Nunito,sans-serif;cursor:pointer}
.rp-seg button[aria-pressed=true]{background:var(--ink,#2B2238);color:var(--bg,#fff)}
.rp-seg button[disabled]{opacity:.4;cursor:not-allowed}
.rp-fs span{flex:1;text-align:center;font:800 .9rem Nunito,sans-serif}
.rp-sw{display:flex;gap:10px;align-items:flex-start;margin-top:8px;cursor:pointer;font:700 .9rem Nunito,sans-serif}
.rp-sw input{width:20px;height:20px;margin-top:2px;accent-color:#F08A24;flex:none}
.rp-sw small{display:block;font-size:.76rem;color:var(--mut,#6B5B4E)}
.rp-reset{margin-top:8px;border:0;background:none;color:var(--link,#1D5A94);font:800 .84rem Nunito,sans-serif;text-decoration:underline;cursor:pointer;align-self:flex-start;padding:4px 0}

/* navigasi bawah: hanya layar sempit */
.ra-bawah{display:none}
@media (max-width:820px){
  .ra-bawah{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--card,#fff);border-top:1.5px solid var(--line,#EFE3D3);padding:6px 4px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -10px 24px -18px rgba(20,14,30,.5)}
  .ra-bawah a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;color:var(--mut,#6B5B4E);font:800 .68rem Nunito,sans-serif;min-height:48px;justify-content:center;border-radius:12px}
  .ra-bawah .ic{position:relative;display:grid;place-items:center;width:44px;height:28px;border-radius:99px;transition:background .2s}
  .ra-bawah svg{width:22px;height:22px}
  .ra-bawah a.on{color:var(--ink,#2B2238)}
  .ra-bawah a.on .ic{background:var(--peach,#FFE9D6)}
  .ra-bawah .nb-n{position:absolute;right:2px;top:-4px;min-width:18px;height:18px;border-radius:99px;background:#F08A24;color:#2B2238;font:800 .66rem Nunito,sans-serif;font-style:normal;display:grid;place-items:center;padding:0 4px}
  .ra-bawah .nb-n[hidden]{display:none}
  .ra-bawah a>span:last-child{white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
  body.ada-bawah{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
}
@media print{.ra-bawah,.rp{display:none!important}}

.rp-pasang{display:block;width:100%;margin-top:10px;min-height:44px;border:0;border-radius:12px;background:var(--acc,#F08A24);color:#fff;font:inherit;font-weight:800;cursor:pointer}
.rp-cat{margin:10px 0 0;font-size:.78rem;line-height:1.45;color:var(--mut,#6B5B4E)}