/* FIEZEL Speaking + Listening sidecar. All selectors are namespaced with .fsl-. */
.fsl-shell{display:grid;gap:14px}.fsl-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.fsl-head h1{margin:0;font-size:1.55rem;letter-spacing:-.03em}.fsl-head p{margin:.35rem 0 0;color:var(--muted,#6b5a60);line-height:1.55}.fsl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.fsl-card{background:var(--panel,#fff);color:var(--text,#1d1114);border:1px solid var(--line,#e9dfe1);border-radius:22px;padding:18px;box-shadow:var(--shadow-sm,0 2px 10px rgba(40,20,26,.05))}.fsl-card h2,.fsl-card h3,.fsl-card p,.fsl-card .fsl-status{color:inherit}.fsl-card h2,.fsl-card h3{margin:.2rem 0 .45rem}.fsl-card p{line-height:1.55}.fsl-kicker{display:block;font-size:.7rem;font-weight:800;letter-spacing:.1em;color:var(--muted-soft,#8a757c);text-transform:uppercase}.fsl-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:14px}
/* m025-110: OWNER melaporkan tombol Lanjut terkubur di bawah blok umpan balik dan
   harus dicari dengan menggulir. Blok umpan balik memuat naskah lengkap, jadi pada
   soal panjang tombolnya berada jauh di luar layar tepat ketika ia paling dibutuhkan.
   Kini ia mengambang di atas bilah navigasi dan ikut ke mana pun layar digulir.

   Hanya blok yang memuat data-next yang diangkat: .fsl-actions juga dipakai untuk
   tombol mulai dan rekam, dan membuat SEMUANYA mengambang akan menutupi soalnya. */
.fsl-feedback .fsl-actions{position:fixed;left:50%;transform:translateX(-50%);
  bottom:calc(76px + env(safe-area-inset-bottom,0px));z-index:55;margin-top:0;
  width:min(520px,calc(100vw - 28px));justify-content:stretch}
.fsl-feedback .fsl-actions button{flex:1;box-shadow:0 10px 30px rgba(7,13,29,.22)}
/* Ruang di bawah umpan balik supaya baris terakhir naskah tidak tertutup tombolnya. */
.fsl-feedback{padding-bottom:72px}.fsl-actions button{min-height:44px}/* m028: tombol "Nilai jawaban" pindah ke permukaan tinta. Terracotta dengan putih di
   atasnya hanya 4,3:1 - di bawah ambang untuk teks tombol seukuran ini, dan tombol ini
   adalah satu-satunya jalan menyelesaikan latihan Speaking/Listening. */
.fsl-primary{background:var(--text,#241A11);border-color:var(--text,#241A11);color:var(--on-core,#FDFAF3)}.fsl-options{display:grid;gap:9px;margin-top:14px}.fsl-option{text-align:left}.fsl-option.is-correct{border-color:var(--green,#1f9d6f);background:var(--green-soft,#e7f8f1)}.fsl-option.is-wrong{border-color:var(--red,#e0526f);background:var(--red-soft,#fdeef1)}.fsl-status{padding:11px 13px;border-radius:13px;background:var(--panel-soft,#f6eef0);color:var(--text,#1d1114);font-size:.88rem;line-height:1.5}.fsl-feedback{margin-top:14px;padding:13px;border-radius:14px;background:var(--panel-soft,#f6eef0);color:var(--text,#1d1114)}.fsl-feedback strong{display:block;margin-bottom:4px}.fsl-prompt{font-size:1.15rem;font-weight:750;line-height:1.45}.fsl-transcript{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.84rem;white-space:pre-wrap;word-break:break-word;background:var(--panel-soft,#f6eef0);padding:12px;border-radius:12px}.fsl-privacy{font-size:.78rem;color:var(--muted,#6b5a60);line-height:1.5}.fsl-progress{height:8px;background:var(--line-soft,#f2ebec);border-radius:999px;overflow:hidden}.fsl-progress>span{display:block;height:100%;background:var(--accent,#8C2233)}.fsl-audio{width:100%;margin-top:12px}.fsl-hidden{display:none!important}.fsl-input{width:100%;padding:12px 13px;border:1px solid var(--line,#e9dfe1);border-radius:13px;font:inherit}.fsl-levels{display:flex;gap:7px;flex-wrap:wrap}.fsl-levels button[aria-pressed="true"]{background:var(--accent-soft,#f7e8eb);border-color:var(--accent,#8C2233)}
.fsl-work{min-width:0;margin:12px 0 0;padding:0;border:0}.fsl-work:disabled{opacity:.56}.fsl-work:disabled button,.fsl-work:disabled input{cursor:not-allowed}
@media(max-width:640px){.fsl-grid{grid-template-columns:1fr}.fsl-head{display:block}.fsl-actions>*{flex:1 1 auto}}
/* m025-145: kontrak ujian Speaking. Waktu menyiapkan dan waktu bicara ditaruh di muka
   karena itulah yang membedakan latihan ujian dari latihan harian. */
.fsl-timing{display:grid;gap:3px;margin:0 0 10px;padding:11px 13px;border-radius:14px;background:rgba(194,64,44,.08);font-size:.8rem}
.fsl-timing span{font-weight:700}
.fsl-timing small{line-height:1.45;opacity:.8}
.fsl-cue{margin:10px 0;padding-left:20px;display:grid;gap:5px;font-size:.85rem}
.fsl-source{margin:10px 0;padding:12px 13px;border-radius:12px;background:rgba(0,0,0,.05);font:inherit;font-size:.82rem;line-height:1.55;white-space:pre-wrap;max-height:320px;overflow:auto}
.fsl-adapted{margin:6px 0 0;font-size:.75rem;opacity:.75}
/* m025-146: sesi Listening berformat ujian. Satu audio, banyak soal, sekali putar. */
.fsl-exam-list{display:grid;gap:16px;margin:12px 0 0;padding-left:20px}
.fsl-exam-q p{margin:0 0 7px;line-height:1.5}
.fsl-exam-q .fsl-input{width:100%}
.fsl-q-feedback{display:none}
.fsl-q-feedback.is-ok,.fsl-q-feedback.is-wrong{display:grid;gap:3px;margin-top:7px;padding:8px 10px;border-radius:10px;font-size:.79rem}
.fsl-q-feedback.is-ok{background:rgba(63,143,95,.12)}
.fsl-q-feedback.is-wrong{background:rgba(194,64,44,.12)}
.fsl-q-feedback small{opacity:.85;line-height:1.45}
.fsl-option.is-picked{outline:2px solid var(--accent,#c2402c);outline-offset:1px}
.fsl-notes-label{display:grid;gap:5px;margin:12px 0 0;font-size:.79rem;font-weight:650}
.fsl-notes{width:100%;font:inherit;font-weight:400;padding:9px 11px;border-radius:12px;border:1px solid var(--line,#eadfce);resize:vertical}
.fsl-exam-result{margin:10px 0 0}
.fsl-script{margin:10px 0 0;font-size:.8rem}
.fsl-script pre{white-space:pre-wrap;line-height:1.55;padding:11px;border-radius:12px;background:rgba(0,0,0,.05);font:inherit;font-size:.8rem;max-height:340px;overflow:auto}
/* m028 fase3 (§9.3): blok umpan balik listening dipaku ke dasar layar oleh aturan
   di atas, jadi di panggung Skills Lab ia butuh ruang tambahan agar tombol "Nilai
   jawaban" tidak pernah berbagi tempat dengan gelembung pembimbing. */
body.fz-stage-sl .fsl-feedback{padding-bottom:120px}

/* ===== FASE3 ===== (blok terpisah di akhir berkas; Fase 2 memegang baris .fsl-primary di atas) */
/* §3 pemutar latihan dengar: wajah PAW + gelombang statis + chip jumlah putar. */
.fsl-player{display:flex;align-items:center;gap:11px;margin-top:14px;padding:11px 13px;border-radius:16px;background:var(--panel-soft,#FFF3DC);border:1px solid var(--line,#F0E4CF)}
.fsl-mascot-slot{flex:0 0 auto;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--sun-soft,#FFF3C4);overflow:hidden}
.fsl-mascot-slot .fsl-mascot{width:38px;height:38px}
.fsl-mascot-slot .fz-i{width:20px;height:20px;color:var(--text,#241A11)}
.fsl-wave{flex:1 1 auto;min-width:0;height:22px;color:var(--sun-deep,#E6A800)}
.fsl-replays{flex:0 0 auto;font-size:.72rem;font-weight:650;color:var(--muted,#6E5E47)}

/* §3 audit #4: keadaan terkunci harus TERBACA, bukan diredupkan.
   opacity:.56 di atas kertas cream menjatuhkan tinta soal ke ~2,6:1 - dan yang diredupkan
   itu justru isi latihannya. Redupnya dilepas; keadaan terkunci sekarang punya
   permukaan dan tinta sendiri, plus satu baris alasan supaya tidak perlu ditebak. */
.fsl-work:disabled{opacity:1}
.fsl-work:disabled .fsl-input,.fsl-work:disabled .fsl-option{background:var(--panel-soft,#FFF3DC);color:var(--muted,#6E5E47);border-color:var(--line,#F0E4CF)}
.fsl-work:disabled::before{content:"Terkunci — putar audio dulu";display:block;margin-bottom:9px;font-size:.75rem;font-weight:650;color:var(--muted,#6E5E47)}

/* §3 kolom dikte: garis 1,5px dan cincin fokus yang benar-benar terlihat. */
.fsl-input{padding:12px 13px;border-width:1.5px}
.fsl-input:focus-visible{outline:2px solid var(--focus-ring,#A67A00);outline-offset:2px;border-color:var(--sun-deep,#E6A800)}
.fsl-input::placeholder{color:var(--muted,#6E5E47);opacity:1}