/* FIEZEL 2.0 — lapisan redesign (dimuat SETELAH style.css & fiezel-lux.css).
   Prinsip: token dulu, komponen kemudian. Maskot PAW tidak disentuh. */
/* F17: token lapisan ini pindah ke :root tunggal di style.css (satu sumber token). */
html[lang="th"]{--fz-display:'Noto Sans Thai Looped','FZ Plus Jakarta Sans',-apple-system,sans-serif}
body{letter-spacing:-.005em}

/* ---------- tipografi ---------- */
body.fz-lux h1,body h1,body.fz-lux h2,body h2,body.fz-lux h3,body h3,body.fz-lux .today-title,body .today-title,body.fz-lux .hero h2,body .hero h2,body.fz-lux .section-head h1,body .section-head h1{font-family:var(--fz-display);font-weight:700;letter-spacing:-.025em}
body.fz-lux .section-head h1,body .section-head h1{font-size:1.9rem;line-height:1.1}
body.fz-lux .today-title,body .today-title{font-weight:700;font-size:clamp(1.6rem,4.5vw,2rem);letter-spacing:-.03em}
body.fz-lux .eyebrow,body .eyebrow,body.fz-lux .today-eyebrow,body .today-eyebrow,body.fz-lux .today-isi-head,body .today-isi-head,body.fz-lux .modal-mark,body .modal-mark{font-size:.72rem;letter-spacing:.14em;color:var(--muted)}

/* ---------- topbar ----------
   m025-267: aturan topbar/brand/icon-button DIPINDAH ke style.css "Top bar". */
body.fz-lux .version,body .version{display:none}

/* ---------- tombol: pill tactile (specificity > body.fz-lux) ---------- */
body button,body.fz-lux button{border-radius:999px;font-weight:700;padding:13px 20px}
body button:hover,body.fz-lux button:hover{transform:none}
body button:active,body.fz-lux button:active{transform:translateY(2px) scale(1);transition-duration:.08s}
body button.primary,body .primary,body.fz-lux button.primary,body.fz-lux .primary,body.fz-lux .primary.luxe,body.fz-lux .quiz-next:not(:disabled){background:var(--accent);color:#FFFFFF;border:0;border-radius:999px;box-shadow:var(--lift-sun)}
body button.primary:hover,body .primary:hover,body.fz-lux .primary:hover,body.fz-lux .primary.luxe:hover{background:var(--accent-strong);border-color:var(--accent-strong);color:#FFFFFF;box-shadow:var(--lift-sun),var(--shadow-sm)}
body .primary:active,body.fz-lux .primary:active{transform:translateY(2px);box-shadow:0 4px 10px rgba(155,58,74,.16)}
body .primary.luxe,body .today-cta,body.fz-lux .primary.luxe,body.fz-lux .today-cta,body.fz-lux .quiz-next:not(:disabled){background:var(--accent);color:#FFFFFF;border-color:var(--accent);box-shadow:var(--lift-sun)}
body .primary.luxe:hover,body .today-cta:hover,body.fz-lux .primary.luxe:hover,body.fz-lux .today-cta:hover{background:var(--accent-strong);color:#FFFFFF;border-color:var(--accent-strong);box-shadow:var(--lift-sun)}
body .today-cta .fz-i,body .today-cta i,body .primary.luxe i{color:#F7EACB}
body .text-button,body.fz-lux .text-button{box-shadow:none;background:transparent;border-color:transparent}
body button:disabled,body.fz-lux button:disabled{box-shadow:none;transform:none}
body .today-cta{min-height:56px;font-size:1.05rem;margin-top:var(--sp-3)}
body .today-cta-soft{border-radius:999px}
body .modal-actions button{min-height:48px}
body .danger,body.fz-lux .danger{background:var(--panel);color:var(--bad);border:0;box-shadow:0 6px 16px rgba(160,58,48,.12)}

/* ---------- kartu ---------- */
body.fz-lux .card,body .card{border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--sp-5)}
body.fz-lux .today-card,body .today-card{border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);background:linear-gradient(160deg,#FBF3E2 0%,#F3E3C0 100%);border-color:transparent}
body.fz-lux .today-card .today-blocks li,body .today-card .today-blocks li{background:rgba(255,255,255,.72);border-color:rgba(255,255,255,.9);border-radius:var(--radius-sm)}
body.fz-lux .today-card .today-eyebrow,body .today-card .today-eyebrow{background:var(--maroon);color:#fff;padding:5px 10px;border-radius:999px;letter-spacing:.1em;font-size:.68rem}
body.fz-lux .today-rhythm-bar .rhythm-track,body .today-rhythm-bar .rhythm-track{background:rgba(36,26,17,.08)}
body.fz-lux .today-rhythm-bar .rhythm-fill,body .today-rhythm-bar .rhythm-fill{background:var(--maroon)}
body.fz-lux .paw-hero-cockpit,body .paw-hero-cockpit{border-radius:var(--radius-xl);border-color:var(--line);box-shadow:none;background:var(--panel)}
body.fz-lux .paw-speech-bubble,body .paw-speech-bubble{border-radius:18px;border-color:var(--line);background:var(--surface-tint)}
body.fz-lux .quick-practice-section,body .quick-practice-section{margin-top:var(--sp-4)}
body.fz-lux .quick-chip,body .quick-chip{border-radius:var(--radius-md);box-shadow:var(--lift-line);border:1px solid var(--line);background:var(--panel)}
body.fz-lux .quick-chip:active,body .quick-chip:active{box-shadow:0 1px 0 var(--line)}

/* ---------- skill hub: pastel per skill ---------- */
body.fz-lux .skill-hub,body .skill-hub{gap:12px}
body.fz-lux .skill-card,body .skill-card{border-radius:var(--radius-lg);box-shadow:0 3px 0 var(--skill-line,var(--surface-edge));min-height:140px;padding:16px 16px 14px}
body.fz-lux .skill-card:hover,body .skill-card:hover{transform:none;box-shadow:0 3px 0 var(--skill-line,var(--surface-edge)),var(--shadow-sm)}
body.fz-lux .skill-card:active,body .skill-card:active{transform:translateY(2px);box-shadow:0 1px 0 var(--skill-line,var(--surface-edge))}
body.fz-lux .skill-card .skill-card-top>.fz-i,body .skill-card .skill-card-top>.fz-i,body.fz-lux .skill-card .skill-card-top>i,body .skill-card .skill-card-top>i{width:40px;height:40px;padding:8px;border-radius:14px;background:rgba(255,255,255,.75)}
body.fz-lux .skill-listening,body .skill-listening{--skill-bg:var(--pz-pink);--skill-line:var(--pz-pink-line);--skill-ink:var(--pz-pink-ink)}
body.fz-lux .skill-speaking,body .skill-speaking{--skill-bg:var(--pz-mint);--skill-line:var(--pz-mint-line);--skill-ink:var(--pz-mint-ink)}
body.fz-lux .skill-reading,body .skill-reading{--skill-bg:var(--pz-lilac);--skill-line:var(--pz-lilac-line);--skill-ink:var(--pz-lilac-ink)}
body.fz-lux .skill-writing,body .skill-writing{--skill-bg:var(--pz-peach);--skill-line:var(--pz-peach-line);--skill-ink:var(--pz-peach-ink)}
body.fz-lux .skill-vocab,body .skill-vocab{--skill-bg:var(--pz-yellow);--skill-line:var(--pz-yellow-line);--skill-ink:var(--pz-yellow-ink)}
body.fz-lux .skill-grammar,body .skill-grammar{--skill-bg:var(--pz-sky);--skill-line:var(--pz-sky-line);--skill-ink:var(--pz-sky-ink)}
body.fz-lux .launch-card,body .launch-card{border-radius:var(--radius-lg);box-shadow:var(--lift-line);min-height:0}
body.fz-lux .launch-card:hover,body .launch-card:hover{transform:none}
body.fz-lux .launch-card .launch-icon,body .launch-card .launch-icon{border-radius:14px;background:var(--sun-soft)}

/* ---------- tabs segmented ---------- */
body.fz-lux .progress-tabs,body .progress-tabs{background:var(--panel-soft);padding:4px;border-radius:999px;gap:4px}
body.fz-lux .progress-tab,body .progress-tab{border-radius:999px;font-weight:700;min-height:40px;box-shadow:none}
body.fz-lux .progress-tab.active,body .progress-tab.active{background:var(--panel);color:var(--text);border-color:transparent;box-shadow:var(--shadow-sm)}

/* ---------- bottom nav ----------
   m025-266: enam aturan .bottomnav/.nav yang dulu di sini (label .7rem, ikon 22 px,
   aktif = lingkaran kuning penuh) DIPINDAH ke style.css, satu definisi untuk semua
   berkas. Lapisan ini tidak lagi menyentuh tab bar. */

/* ---------- kuis: opsi berhuruf + umpan balik sheet ---------- */
body.fz-lux .quiz-topbar,body .quiz-topbar{align-items:center}
body.fz-lux .quiz-exit,body .quiz-exit{border-radius:999px;width:44px;min-width:44px;height:44px;padding:0;display:grid;place-items:center;box-shadow:none}
body.fz-lux .quiz-exit-label,body .quiz-exit-label{display:none}
body.fz-lux .quiz-progress-bar,body .quiz-progress-bar{border-radius:999px;background:rgba(36,26,17,.08)}
body.fz-lux .quiz-progress-bar b,body .quiz-progress-bar b{background:var(--sun);border-radius:999px}
body.fz-lux .quiz-next,body .quiz-next{border-radius:999px;background:var(--text);color:var(--on-core);border-color:var(--text);box-shadow:var(--lift-ink)}
body.fz-lux .quiz-next:disabled,body .quiz-next:disabled{background:var(--panel-soft);color:var(--text-disabled);border-color:var(--line);box-shadow:none}
body.fz-lux .question,body .question{font-family:var(--fz-display);font-weight:700;letter-spacing:-.01em;font-size:1.35rem;line-height:1.45;white-space:pre-line;word-break:break-word}
body.fz-lux .options,body .options{gap:12px;counter-reset:fz2opt}
body.fz-lux .option,body .option{border-radius:18px;border:1.5px solid var(--line);background:var(--panel);box-shadow:var(--lift-line);min-height:56px;padding:14px 16px 14px 60px;font-weight:600;font-size:1.02rem;line-height:1.45;word-break:break-word;position:relative}
body.fz-lux .option::before,body .option::before{counter-increment:fz2opt;content:counter(fz2opt,upper-alpha);position:absolute;left:14px;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:11px;background:var(--panel-soft);color:var(--muted);display:grid;place-items:center;font-size:.8rem;font-weight:700}
body.fz-lux .option[data-choice="0"]::before,body .option[data-choice="0"]::before{content:"A"}
body.fz-lux .option[data-choice="1"]::before,body .option[data-choice="1"]::before{content:"B"}
body.fz-lux .option[data-choice="2"]::before,body .option[data-choice="2"]::before{content:"C"}
body.fz-lux .option[data-choice="3"]::before,body .option[data-choice="3"]::before{content:"D"}
body.fz-lux .option[data-choice="4"]::before,body .option[data-choice="4"]::before{content:"E"}
body.fz-lux .option:not(:disabled):hover,body .option:not(:disabled):hover{background:var(--surface-tint);border-color:var(--sun);box-shadow:0 3px 0 var(--sun-deep)}
body.fz-lux .option:active,body .option:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}
body.fz-lux .option.correct,body .option.correct,body.fz-lux .option.correct:disabled,body .option.correct:disabled{border-color:var(--good-bright);background:var(--good-soft);color:var(--good);box-shadow:0 3px 0 var(--good-bright)}
body.fz-lux .option.correct::before,body .option.correct::before{background:var(--good-bright)!important;color:#fff!important;content:"✓"!important}
body.fz-lux .option.wrong,body .option.wrong,body.fz-lux .option.wrong:disabled,body .option.wrong:disabled{border-color:var(--bad);background:var(--bad-soft);color:var(--bad);box-shadow:0 3px 0 var(--bad)}
body.fz-lux .option.wrong::before,body .option.wrong::before{background:var(--bad)!important;color:#fff!important;content:"✕"!important}
body.fz-lux .option:disabled:not(.correct):not(.wrong),body .option:disabled:not(.correct):not(.wrong){opacity:.78;color:var(--muted);box-shadow:none}
body.fz-lux .feedback,body .feedback{border-radius:20px;padding:16px 18px;background:var(--surface-tint);border:1px solid var(--line);font-size:.95rem}
body.fz-lux .feedback.feedback-success,body .feedback.feedback-success,body.fz-lux .feedback.is-correct,body .feedback.is-correct{background:var(--good-soft);border-color:#CDE9DD}
body.fz-lux .feedback.feedback-error,body .feedback.feedback-error,body.fz-lux .feedback.is-wrong,body .feedback.is-wrong{background:#FFF5F2;border-color:#F5C6BC}
body.fz-lux .feedback-title,body .feedback-title{font-family:var(--fz-display);font-weight:700;font-size:1.15rem;letter-spacing:-.02em}

/* ---------- form ---------- */
body.fz-lux input[type="text"],body input[type="text"],body.fz-lux input[type="url"],body input[type="url"],body.fz-lux input[type="email"],body input[type="email"],body.fz-lux input[type="password"],body input[type="password"],body.fz-lux input[type="number"],body input[type="number"],body.fz-lux select,body select,body.fz-lux textarea,body textarea{border-radius:16px;border:1.5px solid var(--line);background:var(--panel);padding:12px 14px;font:inherit;color:var(--text)}
body.fz-lux input:focus-visible,body input:focus-visible,body.fz-lux textarea:focus-visible,body textarea:focus-visible{border-color:var(--sun-deep);outline:2px solid var(--sun-soft);outline-offset:0}
body.fz-lux .endpoint-label,body .endpoint-label{font-weight:700;font-size:.85rem;color:var(--muted);display:flex;flex-direction:column;gap:6px;margin-top:10px}
body.fz-lux .modal-panel,body .modal-panel{border-radius:var(--radius-xl)}

/* ---------- panel Online & Teman (Home) ---------- */
body.fz-lux .fz2-social,body .fz2-social{padding:16px 18px;margin-top:var(--sp-4);border-radius:var(--radius-xl);background:var(--panel);border:1px solid var(--line)}
body.fz-lux .fz2-social-head,body .fz2-social-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
body.fz-lux .fz2-social-sub,body .fz2-social-sub{margin:4px 0 0;font-size:.9rem;color:var(--text);font-weight:600;line-height:1.4}
body.fz-lux .fz2-link,body .fz2-link{position:relative;background:transparent;border:0;box-shadow:none;padding:10px 8px;min-height:44px;color:var(--maroon);font-weight:700;font-size:.85rem;display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
body.fz-lux .fz2-link i,body .fz2-link i{width:16px;height:16px}
body.fz-lux .fz2-link .social-badge,body .fz2-link .social-badge{position:absolute;top:-4px;right:-10px}
body.fz-lux .fz2-friends,body .fz2-friends{display:flex;margin:12px 0 2px;padding-left:4px}
body.fz-lux .fz2-friend,body .fz2-friend{width:36px;height:36px;border-radius:50%;margin-left:-8px;background:var(--pz-lilac);color:var(--pz-lilac-ink);border:2px solid #fff;display:grid;place-items:center;font-weight:700;font-size:.8rem;position:relative}
body.fz-lux .fz2-friend:nth-child(2n),body .fz2-friend:nth-child(2n){background:var(--pz-mint);color:var(--pz-mint-ink)}
body.fz-lux .fz2-friend:nth-child(3n),body .fz2-friend:nth-child(3n){background:var(--pz-pink);color:var(--pz-pink-ink)}
body.fz-lux .fz2-friend:nth-child(4n),body .fz2-friend:nth-child(4n){background:var(--pz-yellow);color:var(--pz-yellow-ink)}
body.fz-lux .fz2-friend.is-online::after,body .fz2-friend.is-online::after{content:"";position:absolute;right:-1px;bottom:-1px;width:10px;height:10px;border-radius:50%;background:var(--good-bright);border:2px solid #fff}
body.fz-lux .fz2-friend-more,body .fz2-friend-more{background:var(--panel-soft);color:var(--muted);font-size:.7rem}
body.fz-lux .fz2-acts,body .fz2-acts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin-top:14px}
body.fz-lux .fz2-act,body .fz2-act{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 12px;border-radius:999px;background:var(--panel);border:1.5px solid var(--line);box-shadow:var(--lift-line);font-size:.88rem;font-weight:700;color:var(--text)}
body.fz-lux .fz2-act i,body .fz2-act i{width:18px;height:18px;color:var(--maroon)}
body.fz-lux .fz2-act,body .fz2-act{min-width:0}
/* AUDIT-2026-09-21 T7: label "Gabung KelasKu" terpotong 9px di 390px ("Gabung Kela…") dan
   44px di 320px — ellipsis satu-baris di kolom 2× membuat nama merek tak terbaca.
   Label boleh membungkus dua baris; pemotongan diam-diam tidak boleh. */
body.fz-lux .fz2-act span,body .fz2-act span{min-width:0;white-space:normal;overflow:visible;text-overflow:clip;text-align:center;line-height:1.25}
body.fz-lux .fz2-act.is-set,body .fz2-act.is-set{background:var(--pz-mint);border-color:var(--pz-mint-line);box-shadow:0 3px 0 var(--pz-mint-line);color:var(--pz-mint-ink)}
body.fz-lux .fz2-act.is-set i,body .fz2-act.is-set i{color:var(--pz-mint-ink)}
body.fz-lux .fz2-act.is-hot,body .fz2-act.is-hot{grid-column:1/-1;background:var(--sun-soft);border-color:var(--pz-yellow-line);box-shadow:0 3px 0 var(--pz-yellow-line)}
body.fz-lux .fz2-act:active,body .fz2-act:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}

/* ---------- tab Teman ---------- */
body.fz-lux .fz2-inline,body .fz2-inline{display:flex;gap:8px;margin-top:10px}
body.fz-lux .fz2-inline input,body .fz2-inline input{flex:1;min-width:0}
body.fz-lux .fz2-inline .primary,body .fz2-inline .primary{white-space:nowrap}
body.fz-lux .fz2-myid,body .fz2-myid{margin:8px 0 0;padding:8px 12px;border-radius:12px;background:var(--sun-soft);border:1px solid var(--pz-yellow-line);font-size:.85rem;font-weight:700;color:var(--text)}
body.fz-lux .fz2-classrow,body .fz2-classrow{display:flex;align-items:center;justify-content:space-between;gap:12px}
body.fz-lux .fz2-classrow h3,body .fz2-classrow h3{margin:0 0 4px;font-size:1rem}
body.fz-lux .fz2-classrow p,body .fz2-classrow p{margin:0}
body.fz-lux .fz2-classrow button,body .fz2-classrow button{white-space:nowrap;flex:none}
body.fz-lux .fz2-more,body .fz2-more{margin:6px 0 var(--sp-3)}
body.fz-lux .fz2-more summary,body .fz2-more summary{cursor:pointer;font-weight:700;font-size:.85rem;color:var(--muted);padding:10px 4px;list-style:none;display:flex;align-items:center;gap:6px}
body.fz-lux .fz2-more summary::before,body .fz2-more summary::before{content:"+";display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--panel-soft);font-size:.9rem}
body.fz-lux .fz2-more[open] summary::before,body .fz2-more[open] summary::before{content:"–"}
body.fz-lux .fz2-more[open] summary,body .fz2-more[open] summary{margin-bottom:8px}

/* ---------- sistem pertemanan ala LINE: tombol suara, QR, lencana tab ---------- */
/* Tombol "Ajak Main Suara" hanya di baris teman; ikon pengeras suara menandainya sebagai
   aksi suara, terpisah dari sorakan di sebelahnya. Radius & warna memakai token optik FIEZEL. */
.social-friend-acts{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.social-voice-btn{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;padding:7px 11px;border-radius:12px;font-size:.82rem;font-weight:700;border:1px solid var(--pz-mint-line);background:var(--pz-mint);color:var(--pz-mint-ink);cursor:pointer;line-height:1}
.social-voice-btn i{width:15px;height:15px}
.social-voice-btn:active{transform:translateY(1px)}
/* Lencana angka pada tab Teman (permintaan yang belum diproses). */
.progress-tab .fz3-tab-badge{position:relative;top:auto;right:auto;margin-left:6px;vertical-align:middle}
.progress-tab .fz3-tab-badge.hidden{display:none}
/* Kode QR profil: kotak putih dengan bantalan, QR selalu gelap di atas terang. */
.fz3-qr{display:flex;justify-content:center;align-items:center;margin:14px auto;padding:14px;width:min(78vw,320px);border-radius:18px;background:#FFFFFF;border:1px solid var(--line);box-shadow:0 8px 30px rgba(17,17,17,.12)}
.fz3-qr svg{display:block;width:100%;height:auto;aspect-ratio:1/1}
p.fz2-myid,
.modal-panel p.fz2-myid,
#modalPanel p.fz2-myid {
  color: #111118 !important;
  font-weight: 800 !important;
  background: #FFF9E6 !important;
  border: 1px solid rgba(255, 222, 67, 0.4) !important;
  padding: 8px 16px !important;
  border-radius: 12px !important;
  display: inline-block !important;
  margin: 10px auto !important;
  text-align: center !important;
}

/* ---------- gerak ---------- */
@media (prefers-reduced-motion:no-preference){
  body.fz-lux .fz2-social,body .fz2-social{animation:riseIn var(--dur-m) var(--ease) both;animation-delay:.12s}
  body.fz-lux .fz2-friend,body .fz2-friend{transition:transform var(--dur-s) var(--ease-spring)}
  body.fz-lux .fz2-friends:hover .fz2-friend,body .fz2-friends:hover .fz2-friend{transform:translateY(-3px)}
}
@media (min-width:720px){
  body.fz-lux .fz2-acts,body .fz2-acts{grid-template-columns:repeat(3,minmax(0,1fr))}
  body.fz-lux .fz2-act.is-hot,body .fz2-act.is-hot{grid-column:auto}
}
/* AUDIT-2026-09-21 T7: di 320px dua kolom memaksa "Tambah teman" jadi "Tamba…" (32px hilang).
   Satu kolom di layar sangat sempit — tombol penuh selalu lebih baik daripada label terpotong. */
@media (max-width:360px){
  body.fz-lux .fz2-acts,body .fz2-acts{grid-template-columns:minmax(0,1fr)}
}

/* ---------- Jalur Grammar bernode ---------- */
body.fz-lux .fz2-path-summary,body .fz2-path-summary{display:flex;align-items:center;gap:14px;border-radius:var(--radius-lg);background:var(--cream);border:1px solid var(--line);padding:14px 16px}
body.fz-lux .fz2-path-summary>div,body .fz2-path-summary>div{display:flex;flex-direction:column;gap:2px;min-width:0}
body.fz-lux .fz2-path-summary>div>b,body .fz2-path-summary>div>b{font-size:1rem}
body .fz2-path-ring{--p:0;flex:none;width:56px;height:56px;border-radius:50%;background:conic-gradient(var(--maroon) calc(var(--p)*1%),rgba(36,26,17,.08) 0);display:grid;place-items:center;position:relative}
body .fz2-path-ring::after{content:"";position:absolute;inset:6px;border-radius:50%;background:var(--panel)}
body .fz2-path-ring b,body .fz2-path-ring .fz2-path-ring-count{position:relative;z-index:1;font-size:.78rem;font-weight:700;color:var(--text)}
body.fz-lux .lesson-path,body .lesson-path{padding:6px 0 18px 4px}
body.fz-lux .path-step,body .path-step{grid-template-columns:28px minmax(0,1fr);gap:12px;padding:0 0 12px;align-items:start}
body.fz-lux .path-step::after,body .path-step::after{left:12px;top:26px;bottom:-2px;width:3px;background:var(--line);opacity:1}
body.fz-lux .path-step.is-mastered::after,body .path-step.is-mastered::after,body .path-step.is-completed::after{background:var(--good-bright)}
body.fz-lux .path-node,body .path-node{width:28px;height:28px;margin-top:16px}
body.fz-lux .path-ring,body .path-ring{width:16px;height:16px;background:var(--panel);box-shadow:inset 0 0 0 3px var(--line)}
body .path-ring>b,body .path-ring>i,body .path-ring>svg{display:none}
body.fz-lux .path-step.is-mastered .path-ring,body .path-step.is-mastered .path-ring,body .path-step.is-completed .path-ring{background:var(--good-bright);box-shadow:inset 0 0 0 3px var(--good-bright)}
body.fz-lux .path-step.is-current .path-ring,body .path-step.is-current .path-ring{background:var(--sun);box-shadow:inset 0 0 0 3px var(--sun-deep),0 0 0 5px var(--sun-soft)}
body.fz-lux .path-step.is-locked .path-ring,body .path-step.is-locked .path-ring{background:var(--line-soft);box-shadow:inset 0 0 0 3px var(--line)}
body.fz-lux .path-label,body .path-label{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:14px 16px;cursor:pointer;position:relative}
body.fz-lux .path-label b,body .path-label b{font-size:.98rem;font-weight:700;padding-right:32px}
body.fz-lux .path-label>span,body .path-label>span{font-weight:600}
body.fz-lux .path-step.is-mastered .path-label::after,body .path-step.is-mastered .path-label::after,body .path-step.is-completed .path-label::after{content:"✓";position:absolute;right:14px;top:14px;width:26px;height:26px;border-radius:9px;background:var(--good-soft);color:var(--good);display:grid;place-items:center;font-weight:700;font-size:.85rem}
body.fz-lux .path-step.is-current .path-label,body .path-step.is-current .path-label{border:2px solid var(--sun);box-shadow:0 4px 0 var(--sun-deep)}
body.fz-lux .path-step.is-locked .path-label,body .path-step.is-locked .path-label{background:var(--line-soft);cursor:default}
body .path-progress{height:6px;border-radius:999px;background:rgba(36,26,17,.08);margin-top:10px;overflow:hidden}
body .path-progress i{display:block;height:100%;border-radius:999px;background:var(--sun)}
body .path-cta,body.fz-lux .path-cta{margin-top:12px;min-height:44px;padding:0 18px;font-size:.92rem}
body.fz-lux .path-mascot,body .path-mascot{position:absolute;right:14px;top:-18px;width:44px}
body.fz-lux .path-step.is-current,body .path-step.is-current{position:relative}
body.fz-lux .lesson-skip-link,body .lesson-skip-link{margin-top:8px}
body.fz-lux .path-node-exam,body .path-node-exam{width:28px;height:28px}
body.fz-lux .path-node-exam .path-ring,body .path-node-exam .path-ring{background:var(--gold);box-shadow:inset 0 0 0 3px #C9A24B}
body.fz-lux .path-step-exam .path-label,body .path-step-exam .path-label{background:linear-gradient(140deg,#FFF6DF,#FCEBC4);border-color:#EED9A6}

/* ---------- Progres: kartu level gelap + minggu ini ---------- */
body.fz-lux .fz2-level,body .fz2-level{background:var(--core);color:var(--on-core);border:0;border-radius:var(--radius-xl);padding:20px;position:relative;overflow:hidden}
body .fz2-level .eyebrow{color:rgba(253,250,243,.7)}
body .fz2-level-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
body .fz2-level-streak{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:999px;background:rgba(255,199,0,.16);color:var(--sun);font-weight:700;font-size:.8rem}
body .fz2-level-streak .fz-i{width:16px;height:16px;--fz-i-fill:var(--sun);--fz-i-line:var(--sun)}
body .fz2-level-body{display:flex;align-items:center;gap:14px;margin-top:8px;padding-right:96px}
body .fz2-level-big{font-family:var(--fz-display);font-size:3rem;line-height:1;font-weight:700;color:var(--sun);letter-spacing:-.04em}
body .fz2-level-lead{margin:0;font-size:.9rem;line-height:1.45;color:rgba(253,250,243,.88);max-width:200px}
body .fz2-level-paw{position:absolute;right:12px;bottom:-6px;width:96px;height:96px;display:grid;place-items:end}
body .fz2-level-paw :is(svg,img,canvas){width:96px;height:96px}
body .fz2-lvls{display:flex;gap:6px;margin-top:18px;max-width:280px}
body .fz2-lvl{flex:1;text-align:center;font-size:.72rem;font-weight:700;color:rgba(253,250,243,.5)}
body .fz2-lvl::before{content:"";display:block;height:8px;border-radius:999px;background:rgba(255,255,255,.16);margin-bottom:6px}
body .fz2-lvl.is-done{color:#7FD1B0}body .fz2-lvl.is-done::before{background:#7FD1B0}
body .fz2-lvl.is-now{color:#0A0A0E !important}body .fz2-lvl.is-now::before{background:linear-gradient(90deg,var(--sun) calc(var(--p,0)*1%),rgba(255,255,255,.16) 0)}
body.fz-lux .fz2-week,body .fz2-week{border-radius:var(--radius-xl)}
body .fz2-week-head{display:flex;align-items:center;justify-content:space-between}
body .fz2-week-head b{font-size:1rem}
body .fz2-week-pill{display:inline-flex;align-items:center;height:28px;padding:0 10px;border-radius:999px;background:var(--sun);font-weight:700;font-size:.75rem}
body .fz2-days{display:flex;gap:6px;margin-top:14px}
body .fz2-day{flex:1;text-align:center}
body .fz2-day i{display:block;height:36px;border-radius:11px;background:var(--line-soft)}
body .fz2-day i.is-on{background:var(--sun)}
body .fz2-day i.is-big{background:var(--sun-deep)}
body .fz2-day i.is-today{background:transparent;border:2px dashed var(--sun-deep)}
body .fz2-day span{display:block;margin-top:6px;font-size:.7rem;font-weight:700;color:var(--muted)}
body .fz2-week-note{margin:12px 0 0;font-size:.8rem}

/* ==========================================================================
   Audit UI/UX F17 + F18 (2026-09-23): SATU wujud tombol dan SATU gaya "terpilih".
   Akar F17: `body.fz-lux button` (fiezel-lux.css, 0-1-2) mengalahkan `.fiezel-btn-primary`
   (style.css, 0-1-0), jadi "Lanjut" di perkenalan tercat putih - identik dengan "Lewati
   langkah ini" - dan keadaan nonaktifnya memakai pink yang sama dengan "terpilih".
   Empat keadaan, semuanya dari token tombol utama aplikasi (lihat baris .primary di atas):
     primary  : --accent, teks putih        (sama dengan Home dan kuis)
     secondary: tanpa bidang, teks tinta
     disabled : redup (bidang --line-soft, teks --text-disabled) - BUKAN berwarna
     selected : garis 2px --accent (7:1 terhadap putih, lolos WCAG 1.4.11) + tanda centang
   ========================================================================== */
body .fiezel-ob .fiezel-btn-primary:not([disabled]){background:var(--accent);background-image:none;color:#FFFFFF;border:0;box-shadow:var(--lift-sun)}
body .fiezel-ob .fiezel-btn-ghost{background:transparent;color:var(--text);border:0!important;box-shadow:none!important;text-decoration:underline;text-underline-offset:3px}
body .fiezel-ob .fiezel-btn[disabled]{background:var(--line-soft);background-image:none;color:var(--text-disabled);border:0;box-shadow:none;cursor:not-allowed}
/* !important di tiga baris ini disengaja: resep tombol global `html.fiezel-ui-v6 body
   button:not(...)x11` berspesifisitas 0-12-3 dan memaku border/bayangan ke SEMUA tombol. */
body .fiezel-ob .fiezel-goal-card.is-selected,
body .fiezel-ob .fiezel-level-chip.is-selected{position:relative;border:2px solid var(--accent)!important;background:#FFFFFF;color:var(--text);box-shadow:0 0 0 3px rgba(155,58,74,.14)!important}
body .fiezel-ob .fiezel-goal-card.is-selected b,body .fiezel-ob .fiezel-level-chip.is-selected{color:var(--accent)}
body .fiezel-ob .fiezel-goal-card.is-selected::after,body .fiezel-ob .fiezel-level-chip.is-selected::after{content:"\2713";position:absolute;top:8px;right:10px;width:20px;height:20px;border-radius:50%;background:var(--accent);color:#FFFFFF;font-size:12px;font-weight:800;line-height:20px;text-align:center}
body .fiezel-ob .fiezel-level-chip.is-selected::after{top:-7px;right:-7px;width:18px;height:18px;line-height:18px;font-size:11px}
/* Segmen progres perkenalan: yang selesai berwarna penuh (dulu 1,03-1,08:1 terhadap yang belum). */
body .fiezel-ob .fiezel-segments i.is-done{background:var(--accent);background-image:none}

/* ==========================================================================
   Audit UI/UX F19 (2026-09-23): hierarki tipografi dan spasi kata.
   Dua H2 setingkat di Home tampil sangat berbeda ("Rencana belajar" 24px tebal 400 vs
   "Latihan Singkat" 13px tebal 700). Skala tetap untuk judul bagian di layar utama:
   H2 18px/700. Plus Jakarta Sans berspasi kata sempit (0,17em); ditambah letter-spacing
   negatif di teks 12,5-13px batas kata jadi kabur - teks kecil kini letter-spacing 0 dan
   word-spacing .05em.
   ========================================================================== */
body main.app .section-head h2,
body main.app h2.quick-practice-title,
body main.app .home-section-head h2{font-size:1.125rem;font-weight:700;letter-spacing:0;line-height:1.3}
body small,body .muted,body .ch-small,body .launch-card small,body .setting-row small,body .today-blocks span{letter-spacing:0;word-spacing:.05em}
/* F19: judul kartu peluncur (Rencana Hari Ini, PAW ARENA) setebal judul lain. */
body .learning-launcher .launch-card b{font-weight:700;letter-spacing:0}

/* ==========================================================================
   Audit UI/UX F21 (2026-09-23): desktop bukan ponsel yang dilebarkan.
   Kartu perkenalan dan tur dulu melebar sampai 1.408px dengan teks kecil rata kiri. Di
   layar lebar keduanya dibatasi ±560px (tur ±440px) dan diletakkan di tengah.
   ========================================================================== */
@media (min-width:900px){
  body .fiezel-ob .fiezel-sheet,
  body .fiezel-ob .fiezel-stepper,
  body .fiezel-ob .fiezel-topbar,
  body .fiezel-ob .fiezel-stage{max-width:560px;width:100%;margin-left:auto;margin-right:auto;box-sizing:border-box}
  body .fz-tour-card{left:50%;right:auto;width:min(440px,calc(100vw - 32px));transform:translateX(-50%)}
}

/* ==== Kursus Bahasa Jepang: tema khas Jepang (body.fz-lang-ja, dipasang renderInner) ====
   Palet tradisional: shu (朱, merah vermilion torii) sebagai aksen, ai (藍, nila) sebagai tinta,
   washi (kertas krem) sebagai latar, sakura sebagai lembut. Motif seigaiha (gelombang) sangat
   tipis di latar, judul memakai huruf Mincho bawaan sistem (tanpa unduhan font - CSP).
   Kontras teks tetap >= 4.5:1: shu #B3372A di atas putih ~5.6:1, ai #1E2B45 ~14:1. */
html body.fz-lang-ja,html.fiezel-ui-v6 body.fz-lang-ja{
  --bg:#F7F2E8;--panel:#FFFDF8;--panel-soft:#F2EBDD;
  --line:#E6DCCB;--line-soft:#EFE8DA;--line-strong:#D6C8B0;
  --text:#1E2B45;--muted:#555C6B;--muted-soft:#5F6574;--black:#1E2B45;--ambient-muted:#555C6B;
  --accent:#B3372A;--accent-strong:#8C2920;--accent-soft:#FBE7E1;--accent-on-glass:#8C2920;
  --chrome-bg:rgba(247,242,232,.94);--launcher-start:#FBEDE8;--launcher-end:#F6DCD3;
  --lux-accent:#B3372A;--lux-accent-deep:#8C2920;--lux-cream:#F7F2E8;--lux-ink:#1E2B45;--lux-muted:#555C6B;
  --lux-paper:#FFFDF8;--lux-paper-warm:#FBF6EC;--lux-yellow:#F6DCD3;--lux-yellow-soft:#FBEDE8;--lux-yellow-deep:#E9BFB2;
  --lux-glow:0 10px 28px -6px rgba(179,55,42,.28);
  --ui-accent:#B3372A;--ui-accent-soft:#FBE7E1;--ui-tint-soft:#FBEDE8;
  --fz-accent:#B3372A;--fz-accent-deep:#8C2920;--fz-soft:#FBE7E1;--fz-sun:#F4DDD2;--fz-sun-soft:#FBEDE8;--fz-sun-press:#E9C6B8;
  --maroon:#B3372A;--maroon-deep:#8C2920;--maroon-soft:#FBE7E1;--wordmark-accent-lo:#B3372A;
  --sun:#F4DDD2;--sun-soft:#FBEDE8;--sun-deep:#E9C6B8;--yellow:#F4DDD2;--yellow-soft:#FBEDE8;--yellow-deep:#E9C6B8;
  --pz-yellow:#F4DDD2;--pz-yellow-line:#E9C6B8;--skill-bg:#FBEDE8;--skill-line:#E9C6B8;--info-soft:#FBEDE8;
  --scene-light:rgba(179,55,42,.07);
  /* Pastel kartu -> warna tradisional: sakura, matcha, fuji (wisteria), sora (langit). */
  --pz-pink:#F7DEDF;--pz-pink-line:#EDC4C7;--pz-pink-ink:#8C2F3E;
  --pz-mint:#E0E8CF;--pz-mint-line:#C8D6AE;--pz-mint-ink:#3F5A1E;
  --pz-lilac:#E4DEEF;--pz-lilac-line:#CDC3E2;--pz-lilac-ink:#4B3D7A;
  --pz-sky:#DCE5EF;--pz-sky-line:#C1D0E0;--pz-sky-ink:#1E3F5E;
  --fz-ja-serif:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP","Noto Serif CJK JP","Source Han Serif JP",serif;
  --fz-ja-wave:rgba(30,43,69,.045);
}
/* html.fiezel-ui-v6 body (tutor-v3.css) melukis latar krem; spesifisitas disamakan agar washi menang. */
html body.fz-lang-ja,html.fiezel-ui-v6 body.fz-lang-ja{
  background-color:var(--bg);
  background-image:
    radial-gradient(circle at 50% 100%,transparent 9px,var(--fz-ja-wave) 10px 11px,transparent 12px 15px,var(--fz-ja-wave) 16px 17px,transparent 18px),
    radial-gradient(circle at 0 50%,transparent 9px,var(--fz-ja-wave) 10px 11px,transparent 12px 15px,var(--fz-ja-wave) 16px 17px,transparent 18px),
    radial-gradient(circle at 100% 50%,transparent 9px,var(--fz-ja-wave) 10px 11px,transparent 12px 15px,var(--fz-ja-wave) 16px 17px,transparent 18px);
  background-size:40px 20px,40px 20px,40px 20px;
  background-position:0 0,20px 10px,20px 10px;
}
/* Judul dan merek: Mincho, sedikit renggang seperti papan nama kuil. */
html body.fz-lang-ja :is(h1,h2,.fz-display,.today-title,.page-title):not(#quizStem,#quizStem *,.quiz-shell *,.quiz-stage *){font-family:var(--fz-ja-serif);letter-spacing:.02em}
/* Kartu: kertas washi dengan garis shu tipis di atas (seperti sabuk obi). */
body.fz-lang-ja :is(.card,.panel,.lux-card,.today-card,.setting-card){background-color:var(--panel);border-color:var(--line);box-shadow:inset 0 3px 0 -1px rgba(179,55,42,.55),var(--shadow-sm)}
/* Kartu Hari ini: washi dengan matahari terbit samar di belakang lencana level. */
html body.fz-lang-ja .today-card{background:radial-gradient(circle at calc(100% - 66px) 64px,rgba(179,55,42,.13) 0 62px,transparent 63px),linear-gradient(160deg,#FFFBF4 0%,#F4E3D8 100%)}
/* Topbar: garis bawah nila tipis seperti noren. */
body.fz-lang-ja .topbar{border-bottom:none}
/* Tombol utama: shu padat, sudut sedikit lebih tegas. */
body.fz-lang-ja :is(.btn-primary,.primary,.fiezel-btn-primary,.quiz-next):not([disabled]){background:var(--accent);border-color:var(--accent);color:#fff}
body.fz-lang-ja :is(.btn-primary,.primary,.fiezel-btn-primary,.quiz-next):not([disabled]):hover{background:var(--accent-strong)}
/* Kuis: pilihan jawaban di atas washi, huruf Jepang di soal sedikit lebih besar agar kana/kanji terbaca. */
body.fz-lang-ja .option{background:var(--panel);border-color:var(--line-strong)}
body.fz-lang-ja .option:lang(ja),body.fz-lang-ja [lang="ja"]{font-family:"Hiragino Sans","Yu Gothic","Noto Sans JP","Noto Sans CJK JP",system-ui,sans-serif;line-height:1.7}
/* Bentuk: sudut lebih tegas seperti ubin dan papan kayu, bukan kapsul marshmallow kursus Inggris. */
html body.fz-lang-ja,html.fiezel-ui-v6 body.fz-lang-ja{--radius-xl:18px;--radius-lg:14px;--radius-md:10px;--radius-sm:8px;--lux-r-xl:20px;--lux-r-lg:16px;--lux-r-md:12px;--lux-r-sm:10px}
/* Nav bawah: pita nila (ai) seperti noren; tab aktif diberi cap shu. Kontras krem #EDE6D6 di atas #1E2B45 ~11:1. */
html body.fz-lang-ja nav.bottomnav,html body.fz-lang-ja .bottomnav{background:#1E2B45!important;border:1px solid #1E2B45!important;box-shadow:0 12px 30px -10px rgba(30,43,69,.55)!important;border-radius:18px!important}
html body.fz-lang-ja nav.bottomnav .nav,html body.fz-lang-ja .bottomnav .nav{color:#EDE6D6!important}
html body.fz-lang-ja nav.bottomnav .nav .fz-i{--fz-i-fill:transparent!important;--fz-i-line:#EDE6D6!important}
html body.fz-lang-ja nav.bottomnav .nav .fz-i svg{stroke:#EDE6D6!important}
html body.fz-lang-ja nav.bottomnav .nav.active,html body.fz-lang-ja .bottomnav .nav.active{color:#FFFFFF!important;background:transparent!important}
html body.fz-lang-ja nav.bottomnav .nav.active::after{background:transparent!important}
html body.fz-lang-ja nav.bottomnav .nav.active .fz-i,html body.fz-lang-ja nav.bottomnav .nav[data-view="classroom"].active .fz-i{background:#B3372A!important;border:1.5px solid rgba(255,255,255,.85)!important;border-radius:50%!important;box-shadow:0 6px 14px rgba(179,55,42,.45)!important;--fz-i-fill:#B3372A!important;--fz-i-line:#FFFFFF!important}
html body.fz-lang-ja nav.bottomnav .nav.active .fz-i svg{stroke:#FFFFFF!important}
html body.fz-lang-ja nav.bottomnav .nav .kelasku-wordmark,html body.fz-lang-ja nav.bottomnav .nav[data-view="classroom"].active .kelasku-wordmark{color:inherit!important}
html body.fz-lang-ja #app :is(.launch-card,.today-card,.card){border-radius:16px!important}
/* Judul bagian: garis shu tegak di kiri, seperti penanda bab buku ajar Jepang. */
html body.fz-lang-ja #app :is(h2,.section-title):not(#quizStem):not(.quiz-shell *){border-left:4px solid var(--accent);padding-left:10px}
@media (prefers-reduced-transparency:reduce){html.fiezel-ui-v6 body.fz-lang-ja{background-image:none}}
@media print{html.fiezel-ui-v6 body.fz-lang-ja{background:#fff}}

/* ==== Kursus Jepang: furigana/romaji, tabel kana, kata hari ini, kartu segera hadir ====
   Elemen .ja-* hanya dirakit saat kursus Jepang aktif (features/japanese/fiezel-ja-ui.js). */
.ja-display{display:inline-flex;gap:6px;margin:0 0 12px;padding:4px;border-radius:12px;background:var(--panel-soft);border:1px solid var(--line)}
html body .ja-display .ja-toggle{min-height:36px;padding:6px 12px;border-radius:9px;border:1px solid transparent;background:transparent;color:var(--muted);font-weight:700;font-size:14px;line-height:1;box-shadow:none;cursor:pointer}
html body .ja-display .ja-toggle[aria-pressed="true"]{background:var(--text);color:#fff;border-color:var(--text)}
html body .ja-display .ja-toggle[aria-pressed="false"] span{text-decoration:line-through;text-decoration-thickness:1.5px}
.ja-display .ja-toggle:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
ruby.ja-word{ruby-position:over;ruby-align:center}
ruby.ja-word rt{font-size:.42em;font-weight:600;color:var(--accent-strong);letter-spacing:.04em}
body.fz-ja-no-furigana ruby.ja-word rt,body.fz-ja-no-furigana ruby.ja-word rp{display:none}
body.fz-ja-no-romaji .ja-romaji{display:none}
.vocab-focus .ja-display,.flash-face .ja-display{margin:10px 0 10px}
.flash-face .ja-display{position:relative;z-index:2}
/* Tabel kana */
.ja-kana .kana-tabs{display:inline-flex;gap:4px;padding:4px;border-radius:12px;background:var(--panel-soft);border:1px solid var(--line);margin-bottom:6px}
html body .ja-kana .kana-tab{min-height:40px;padding:8px 16px;border-radius:9px;border:0;background:transparent;color:var(--muted);font-weight:800;font-size:15px;box-shadow:none}
html body .ja-kana .kana-tab[aria-selected="true"]{background:var(--accent);color:#fff}
.ja-kana .kana-heading{font-size:15px;margin:18px 0 8px}
.ja-kana .kana-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.ja-kana .kana-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:64px;border-radius:10px;background:var(--panel);border:1px solid var(--line);box-shadow:inset 0 -3px 0 var(--line-soft)}
.ja-kana .kana-cell.is-empty{background:transparent;border:0;box-shadow:none}
.ja-kana .kana-cell b{font-family:"Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif;font-size:26px;line-height:1.1;color:var(--text)}
.ja-kana .kana-cell small{font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.02em}
/* Kartu Renshū khas Jepang */
.launch-icon.ja-glyph{font-family:"Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif;font-size:24px;font-weight:700;color:var(--accent)}
.ja-soon-section{margin-top:22px}
.ja-soon-section h2{font-size:16px;margin:0 0 10px}
.ja-soon{position:relative;cursor:default;opacity:.78;filter:saturate(.6)}
.ja-soon .ja-soon-badge{position:absolute;top:10px;right:10px;padding:3px 9px;border-radius:999px;background:var(--text);color:#fff;font-size:12px;font-weight:800;letter-spacing:.02em}
/* Kata hari ini */
.ja-kotoba{margin:14px 0;padding:18px 18px 16px}
.ja-kotoba-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ja-kotoba-head .ja-display{margin:0}
.ja-kotoba-word{margin:14px 0 2px;font-family:"Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif;font-size:40px;line-height:1.35;color:var(--text)}
.ja-kotoba-reading{margin:0;font-size:15px;font-weight:700;color:var(--muted)}
.ja-kotoba-meaning{margin:8px 0 0;font-size:16px;color:var(--text)}
/* Anotasi soal & jawaban kursus Jepang: romaji duduk di bawah potongan Jepang, bukan menyela. */
.ja-run{display:inline-flex;flex-direction:column;align-items:flex-start;vertical-align:bottom;line-height:1.5}
.option .ja-run{align-items:center}
.ja-run-romaji{font-size:.62em;font-weight:600;letter-spacing:.01em;color:var(--muted);line-height:1.2;margin-top:1px;white-space:normal}
.ja-quiz-display{display:flex;justify-content:center;margin:8px 0 2px}
.ja-quiz-display .ja-display{margin:0}
body.fz-ja-no-romaji .ja-run{display:inline}

/* ==== Audit F21: desktop bukan ponsel yang dilebarkan (≥1100px) ====
   Kolom konten melebar, rel navigasi kiri MENEMPEL ke tepi kolom (bukan mengambang di tepi
   layar), Home menjadi dua kolom: kartu Hari ini di kiri (menempel saat digulir), rencana +
   latihan singkat + sosial di kanan. Layar baca/kuis tetap sempit supaya panjang baris nyaman. */
@media (min-width:1100px){
  html.fiezel-ui-v6 body.fz-lux .app{max-width:1240px;padding-left:136px;padding-right:32px}
  html.fiezel-ui-v6 body.fz-lux .bottomnav{left:max(20px,calc(50% - 620px + 28px));top:112px;transform:none}
  /* Audit UI/UX Home 2026-09-27: aturan dua-kolom Home (grid + kartu sticky top:88px) DICABUT.
     Home sejak redesign kokpit dipaku satu kolom flex 440px (.home-today .today-home-cockpit,
     style.css, !important), jadi grid ini tidak pernah terjadi - tetapi sisa-sisanya tetap
     berlaku: kartu pertama (position dipaksa relative oleh mobile-edge-fit.css) bergeser 88px
     ke bawah dan MENUTUPI tombol utamanya di bawah kartu kedua, dan align-items:start membuat
     setiap blok di bawahnya selebar isinya sendiri (198/139/296/381px dalam kolom 440px). */
  .quiz-shell,.lesson-page,.reading-stage{max-width:780px;margin-left:auto;margin-right:auto}
  /* Tiga kolom hanya untuk hub Latihan; peluncur di Home hidup di kolom kokpit 440px. */
  .learning-launcher:not(.learner-flow-launcher){grid-template-columns:repeat(3,minmax(0,1fr))}
  #app .stats:has(> :nth-child(5):last-child){grid-template-columns:repeat(5,minmax(0,1fr))}
}
/* Audit F15: galeri Prasasti terlipat untuk murid baru (lencana redup semua), terbuka bagi yang sudah punya riwayat. */
.prasasti-fold>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;list-style:none;min-height:44px}
.prasasti-fold>summary::-webkit-details-marker{display:none}
.prasasti-fold>summary h3{margin:0}
.prasasti-fold>summary svg,.prasasti-fold>summary i{transition:transform .2s ease;flex:none}
.prasasti-fold[open]>summary svg,.prasasti-fold[open]>summary i{transform:rotate(180deg)}
@media (prefers-reduced-motion:reduce){.prasasti-fold>summary svg,.prasasti-fold>summary i{transition:none}}
@media (max-width:1099px){#app .stats > :nth-child(5):last-child:nth-child(odd){grid-column:1/-1}}