@import"https://fonts.googleapis.com/css2?family=Amiri:ital,wght@0,400;0,700;1,400&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";:root{--cakep-cendekia: #2563eb;--cakep-akrab: #f59e0b;--cakep-kreatif: #10b981;--cakep-elegan: #8b5cf6;--cakep-progresif: #06b6d4;--arabic-font: "Amiri", "Traditional Arabic", serif}.pojok-container{max-width:1120px;margin:0 auto;padding:16px;display:flex;flex-direction:column;gap:20px}.cakep-hero-banner{background:linear-gradient(135deg,#1e3a8a,#3b82f6,#8b5cf6);color:#fff;border-radius:18px;padding:24px;box-shadow:0 10px 25px -5px #1e3a8a40;position:relative;overflow:hidden}.cakep-hero-banner:after{content:"العربية • English • Basa Jawa";position:absolute;right:-20px;bottom:-15px;font-size:3.5rem;font-weight:800;color:#ffffff12;pointer-events:none;white-space:nowrap}.hero-top-row{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:16px}.hero-title-group h1{margin:0 0 6px;font-size:1.75rem;font-weight:800;display:flex;align-items:center;gap:10px}.hero-title-group p{margin:0;font-size:.95rem;opacity:.9;max-width:600px;line-height:1.4}.hero-actions{display:flex;gap:10px;align-items:center}.btn-projector-mode{background:#fffffff2;color:#1e3a8a;border:none;padding:10px 18px;border-radius:12px;font-weight:700;font-size:.95rem;display:inline-flex;align-items:center;gap:8px;cursor:pointer;box-shadow:0 4px 12px #00000026;transition:all .2s ease}.btn-projector-mode:hover{background:#fff;transform:translateY(-2px);box-shadow:0 6px 18px #00000040}.btn-projector-mode i{color:#2563eb;font-size:1.1rem}.cakep-pills-bar{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.2)}.cakep-pill{font-size:.8rem;font-weight:600;padding:4px 10px;border-radius:20px;background:#ffffff2e;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;display:inline-flex;align-items:center;gap:5px}.cakep-pill.active{background:#fff;color:#1e3a8a}.nav-filter-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--background-color-card, #ffffff);padding:14px 18px;border-radius:16px;border:1px solid var(--border-color-light, #e2e8f0)}.day-switcher{display:flex;align-items:center;gap:10px}.btn-nav-day{width:38px;height:38px;border-radius:10px;border:1px solid var(--border-color-light, #e2e8f0);background:var(--background-color-main, #f8fafc);color:var(--text-color-primary, #1e293b);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.btn-nav-day:hover:not(:disabled){background:var(--primary-color, #2563eb);color:#fff;border-color:var(--primary-color, #2563eb)}.btn-nav-day:disabled{opacity:.4;cursor:not-allowed}.day-badge-selector{display:flex;align-items:center;gap:8px;cursor:pointer;background:var(--background-color-main, #f1f5f9);padding:6px 14px;border-radius:10px;font-weight:700;font-size:.95rem;color:var(--text-color-primary, #1e293b);border:1px solid var(--border-color-light, #e2e8f0);transition:all .2s ease}.day-badge-selector:hover{border-color:var(--primary-color, #2563eb)}.filter-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.select-filter{padding:8px 12px;border-radius:10px;border:1px solid var(--border-color-light, #e2e8f0);background:var(--background-color-main, #ffffff);color:var(--text-color-primary, #1e293b);font-size:.88rem;font-weight:500;outline:none}.btn-today-quick{background:#f1f5f9;border:1px solid #cbd5e1;color:#334155;padding:8px 14px;border-radius:10px;font-size:.88rem;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:all .2s ease}.btn-today-quick:hover{background:#e2e8f0}.flashcard-wrapper{perspective:1000px}.main-slide-card{background:var(--background-color-card, #ffffff);border-radius:20px;border:1px solid var(--border-color-light, #e2e8f0);box-shadow:0 10px 30px -5px #0000000d;overflow:hidden;position:relative;transition:transform .3s ease,box-shadow .3s ease}.slide-header{padding:16px 24px;background:var(--background-color-main, #f8fafc);border-bottom:1px solid var(--border-color-light, #e2e8f0);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}.slide-badges{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.badge-day-number{background:#1e3a8a;color:#fff;font-weight:800;font-size:.85rem;padding:4px 12px;border-radius:8px}.badge-pillar{font-size:.85rem;font-weight:700;padding:4px 12px;border-radius:8px;display:inline-flex;align-items:center;gap:6px}.badge-pillar.cendekia{background:#dbeafe;color:#1d4ed8}.badge-pillar.akrab{background:#fef3c7;color:#b45309}.badge-pillar.kreatif{background:#d1fae5;color:#065f46}.badge-pillar.elegan{background:#ede9fe;color:#6d28d9}.badge-pillar.progresif{background:#cffafe;color:#0e7490}.slide-theme-tag{font-size:.85rem;color:var(--text-color-secondary, #64748b);font-weight:600}.slide-situation-banner{padding:14px 24px;background:#eff6ff;border-bottom:1px dashed #bfdbfe;display:flex;align-items:center;gap:10px;font-size:1rem;font-weight:700;color:#1e40af}.slide-situation-banner i{color:#3b82f6;font-size:1.15rem}.languages-body{padding:24px;display:flex;flex-direction:column;gap:20px}.lang-block{border-radius:16px;padding:18px 20px;transition:transform .2s ease,box-shadow .2s ease;position:relative}.lang-block:hover{transform:translateY(-2px);box-shadow:0 6px 16px #0000000a}.lang-block-arabic{background:#fdfaf3;border:1px solid #fde68a}.lang-block-english{background:#f0fdf4;border:1px solid #bbf7d0}.lang-block-javanese{background:#fdf2f8;border:1px solid #fbcfe8}.lang-block-indonesian{background:#f8fafc;border:1px solid #e2e8f0}.lang-meta-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.lang-tag{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;display:inline-flex;align-items:center;gap:6px}.lang-tag.ar{color:#b45309}.lang-tag.en{color:#15803d}.lang-tag.jv{color:#be185d}.lang-tag.id{color:#475569}.btn-audio-speak{background:#fff;border:1px solid rgba(0,0,0,.1);color:var(--text-color-primary, #1e293b);padding:6px 14px;border-radius:20px;font-size:.82rem;font-weight:600;display:inline-flex;align-items:center;gap:6px;cursor:pointer;box-shadow:0 2px 5px #0000000d;transition:all .2s ease}.btn-audio-speak:hover{background:var(--primary-color, #2563eb);color:#fff;border-color:var(--primary-color, #2563eb);transform:scale(1.03)}.btn-audio-speak.speaking{background:#ef4444;color:#fff;border-color:#ef4444;animation:pulseAudio 1s infinite alternate}@keyframes pulseAudio{0%{transform:scale(1)}to{transform:scale(1.08);box-shadow:0 0 12px #ef444466}}.text-arabic-display{font-family:var(--arabic-font);font-size:1.85rem;font-weight:700;line-height:2.1;direction:rtl;text-align:right;color:#1f2937;margin:4px 0 8px}.translit-latin{font-size:.95rem;color:#4b5563;font-style:italic;margin:0;line-height:1.4}.text-english-display{font-size:1.25rem;font-weight:700;color:#065f46;margin:4px 0 6px;line-height:1.4}.phonetic-hint{font-size:.88rem;color:#047857;font-style:italic;margin:0}.text-javanese-display{font-size:1.2rem;font-weight:700;color:#831843;margin:4px 0 6px;line-height:1.4}.text-indonesian-display{font-size:1.05rem;font-weight:600;color:#334155;margin:0;line-height:1.5}.adab-callout{background:#fefce8;border:1px solid #fde047;border-radius:12px;padding:16px 20px;display:flex;align-items:flex-start;gap:14px}.adab-icon{font-size:1.5rem;color:#ca8a04;margin-top:2px}.adab-content h4{margin:0 0 4px;font-size:.95rem;font-weight:700;color:#854d0e}.adab-content p{margin:0;font-size:.9rem;color:#713f12;line-height:1.45}.slide-footer-practice{padding:16px 24px;background:var(--background-color-main, #f8fafc);border-top:1px solid var(--border-color-light, #e2e8f0);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}.practice-status-info{display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--text-color-secondary, #64748b)}.btn-toggle-practice{background:#fff;border:1.5px solid #cbd5e1;color:#475569;padding:8px 18px;border-radius:12px;font-weight:700;font-size:.9rem;display:inline-flex;align-items:center;gap:8px;cursor:pointer;transition:all .2s ease}.btn-toggle-practice:hover{border-color:#10b981;color:#059669}.btn-toggle-practice.done{background:#10b981;border-color:#10b981;color:#fff;box-shadow:0 4px 12px #10b9814d}.modal-overlay-60{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a99;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;display:none;align-items:center;justify-content:center;padding:16px}.modal-overlay-60.active{display:flex}.modal-content-60{background:#fff;width:100%;max-width:800px;max-height:85vh;border-radius:20px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 25px 50px -12px #00000040;animation:modalPop .25s ease-out}@keyframes modalPop{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.modal-header-60{padding:18px 24px;border-bottom:1px solid #e2e8f0;display:flex;justify-content:space-between;align-items:center}.modal-header-60 h3{margin:0;font-size:1.2rem;font-weight:700;color:#1e293b}.btn-close-modal{background:none;border:none;font-size:1.4rem;color:#94a3b8;cursor:pointer;padding:4px 8px;border-radius:6px}.btn-close-modal:hover{color:#ef4444;background:#fee2e2}.modal-body-60{padding:20px;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}.day-grid-card{padding:10px 8px;border-radius:12px;border:1px solid #e2e8f0;background:#f8fafc;text-align:center;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;gap:4px}.day-grid-card:hover{background:#eff6ff;border-color:#3b82f6;transform:translateY(-2px)}.day-grid-card.active{background:#1e3a8a;color:#fff;border-color:#1e3a8a;box-shadow:0 4px 10px #1e3a8a4d}.day-grid-card.active .grid-card-num,.day-grid-card.active .grid-card-day,.day-grid-card.active .grid-card-pillar{color:#fff!important}.grid-card-num{font-weight:800;font-size:1rem;color:#1e3a8a}.grid-card-day{font-size:.75rem;color:#64748b;font-weight:600}.grid-card-pillar{font-size:.7rem;font-weight:700;padding:2px 6px;border-radius:6px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.projector-fullscreen-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:99999;background:#f1f5f9;color:#0f172a;display:none;flex-direction:column;padding:20px 32px;overflow-y:auto;box-sizing:border-box}.projector-fullscreen-overlay.active{display:flex}.proj-header{display:flex;justify-content:space-between;align-items:center;background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:12px 24px;margin-bottom:16px;box-shadow:0 4px 14px #0000000a}.proj-brand{display:flex;align-items:center;gap:16px}.proj-logo-img{height:50px;width:auto;max-width:140px;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.08))}.proj-brand-info{display:flex;flex-direction:column;gap:2px}.proj-brand-title-wrap{display:flex;align-items:center;gap:10px}.proj-logo-tag{background:linear-gradient(135deg,#1e3a8a,#2563eb);color:#fff;padding:4px 12px;border-radius:8px;font-weight:800;font-size:1.05rem;letter-spacing:.5px}.proj-app-badge{background:#dbeafe;color:#1e40af;padding:4px 10px;border-radius:8px;font-weight:800;font-size:.85rem}.proj-slogan{font-size:.92rem;font-weight:700;color:#2563eb;letter-spacing:.3px}.proj-controls-top{display:flex;align-items:center;gap:10px}.proj-timer-badge{background:#f8fafc;border:1px solid #cbd5e1;padding:8px 14px;border-radius:10px;font-size:.95rem;font-weight:700;display:flex;align-items:center;gap:8px;color:#1e3a8a}.btn-proj-control{background:#f8fafc;border:1px solid #cbd5e1;color:#1e293b;padding:8px 16px;border-radius:10px;font-weight:700;font-size:.92rem;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:all .2s ease}.btn-proj-control:hover{background:#e2e8f0;transform:translateY(-1px)}.btn-proj-voice-toggle{background:#f0fdf4;border-color:#86efac;color:#15803d}.btn-proj-voice-toggle.active{background:#10b981;border-color:#059669;color:#fff;box-shadow:0 2px 8px #10b9814d}.btn-proj-voice-toggle.active:hover{background:#059669}.btn-proj-voice-toggle.muted{background:#f8fafc;border-color:#cbd5e1;color:#64748b}.btn-proj-close{background:#ef4444;color:#fff;border-color:#ef4444}.btn-proj-close:hover{background:#dc2626;color:#fff}.proj-progress-bar-container{width:100%;height:6px;background:#e2e8f0;border-radius:3px;margin-bottom:16px;overflow:hidden}.proj-progress-bar{height:100%;width:0%;background:linear-gradient(90deg,#2563eb,#10b981)}.proj-meta-bar{display:flex;justify-content:space-between;align-items:center;background:#fff;border:1px solid #e2e8f0;padding:12px 24px;border-radius:14px;margin-bottom:18px;box-shadow:0 4px 12px #00000008}.proj-meta-left{display:flex;align-items:center;gap:14px}.proj-day-tag{background:#1e3a8a;color:#fff;font-size:1.15rem;font-weight:800;padding:4px 14px;border-radius:8px}.proj-pillar-tag{font-size:1rem;font-weight:700;padding:4px 12px;border-radius:8px}.proj-situation-title{font-size:1.35rem;font-weight:800;color:#1e3a8a}.proj-columns-container{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;flex:1}.proj-column-card{background:#fff;border:2px solid #e2e8f0;border-radius:20px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;position:relative;box-shadow:0 8px 24px #0000000d;transition:all .3s ease}.proj-column-card.ar{border-top:6px solid #d97706;background:linear-gradient(180deg,#fffdfa,#fff 30%)}.proj-column-card.en{border-top:6px solid #059669;background:linear-gradient(180deg,#f6fef9,#fff 30%)}.proj-column-card.jv{border-top:6px solid #be185d;background:linear-gradient(180deg,#fdf4f8,#fff 30%)}.proj-column-card.speaking-card{border-color:#2563eb!important;box-shadow:0 0 0 4px #2563eb40,0 14px 32px #2563eb26!important;transform:translateY(-4px)}.proj-col-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;padding-bottom:10px;border-bottom:1px dashed #e2e8f0}.proj-col-title{font-size:1.05rem;font-weight:800;text-transform:uppercase;letter-spacing:.5px}.proj-column-card.ar .proj-col-title{color:#b45309}.proj-column-card.en .proj-col-title{color:#047857}.proj-column-card.jv .proj-col-title{color:#9d174d}.proj-text-arabic{font-family:var(--arabic-font);font-size:2.6rem;font-weight:700;line-height:2;direction:rtl;text-align:right;color:#0f172a;margin:10px 0}.proj-translit{font-size:1.15rem;color:#475569;font-style:italic;line-height:1.45}.proj-text-english{font-size:2rem;font-weight:800;color:#0f172a;line-height:1.35;margin:10px 0}.proj-text-javanese{font-size:1.85rem;font-weight:800;color:#0f172a;line-height:1.4;margin:10px 0}.proj-col-footer{margin-top:18px;padding-top:12px;border-top:1px dashed #e2e8f0;display:flex;justify-content:flex-end}.proj-bottom-row{margin-top:20px;background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:14px 24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;box-shadow:0 4px 14px #0000000a}.proj-meaning-box{display:flex;align-items:center;gap:14px;font-size:1.15rem;color:#0f172a}.proj-nav-buttons{display:flex;align-items:center;gap:10px}.btn-proj-nav{background:#2563eb;color:#fff;border:none;width:44px;height:44px;border-radius:12px;font-size:1.1rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 2px 8px #2563eb4d}.btn-proj-nav:hover{background:#1d4ed8;transform:scale(1.05)}@media (max-width: 900px){.proj-columns-container{grid-template-columns:1fr;gap:16px}.proj-text-arabic{font-size:2rem}.proj-text-english,.proj-text-javanese{font-size:1.5rem}}@media (max-width: 640px){.hero-actions{width:100%}.btn-projector-mode{width:100%;justify-content:center}.text-arabic-display{font-size:1.55rem;line-height:1.9}.text-english-display,.text-javanese-display{font-size:1.1rem}.nav-filter-bar{flex-direction:column;align-items:stretch}.day-switcher{justify-content:space-between}}.streak-badge-hero{background:#fff3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.35);color:#fff;padding:8px 16px;border-radius:20px;font-size:.9rem;font-weight:700;display:inline-flex;align-items:center;gap:8px;box-shadow:0 4px 12px #0000001a;transition:all .2s ease}.streak-badge-hero i{color:#fbbf24;font-size:1.1rem;filter:drop-shadow(0 0 6px rgba(251,191,36,.6));animation:flamePulse 1.5s infinite alternate ease-in-out}@keyframes flamePulse{0%{transform:scale(1);filter:drop-shadow(0 0 4px rgba(251,191,36,.4))}to{transform:scale(1.18);filter:drop-shadow(0 0 10px rgba(245,158,11,.9))}}.lang-actions-group{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}.btn-speaking-challenge{background:#10b981;color:#fff;border:none;padding:6px 14px;border-radius:20px;font-size:.82rem;font-weight:700;display:inline-flex;align-items:center;gap:6px;cursor:pointer;box-shadow:0 2px 6px #10b9814d;transition:all .2s cubic-bezier(.4,0,.2,1)}.btn-speaking-challenge:hover{background:#059669;transform:translateY(-2px);box-shadow:0 4px 12px #10b98166}.btn-speaking-challenge.ar{background:#d97706;box-shadow:0 2px 6px #d977064d}.btn-speaking-challenge.ar:hover{background:#b45309}.btn-speaking-challenge.en{background:#0284c7;box-shadow:0 2px 6px #0284c74d}.btn-speaking-challenge.en:hover{background:#0369a1}.btn-speaking-challenge.jv{background:#db2777;box-shadow:0 2px 6px #db27774d}.btn-speaking-challenge.jv:hover{background:#be185d}.modal-overlay-challenge{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172abf;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1050;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease;padding:16px}.modal-overlay-challenge.active{opacity:1;visibility:visible}.modal-content-challenge{background:#fff;border-radius:24px;width:100%;max-width:620px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 40px #00000040;transform:scale(.92);transition:transform .25s cubic-bezier(.16,1,.3,1);display:flex;flex-direction:column}.modal-overlay-challenge.active .modal-content-challenge{transform:scale(1)}.challenge-header{display:flex;justify-content:space-between;align-items:center;padding:18px 24px;border-bottom:1px solid #e2e8f0;background:#f8fafc;border-radius:24px 24px 0 0}.challenge-header-title{display:flex;flex-direction:column;gap:4px}.challenge-badge-lang{font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:#1e3a8a;display:inline-flex;align-items:center;gap:5px}.challenge-header-title h3{margin:0;font-size:1.25rem;font-weight:800;color:#1e293b}.btn-close-challenge{background:#f1f5f9;border:none;width:36px;height:36px;border-radius:50%;color:#64748b;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.1rem;transition:all .2s ease}.btn-close-challenge:hover{background:#e2e8f0;color:#0f172a;transform:rotate(90deg)}.challenge-body{padding:24px;display:flex;flex-direction:column;gap:20px}.challenge-target-box{background:linear-gradient(135deg,#f8fafc,#f1f5f9);border:2px solid #e2e8f0;border-radius:18px;padding:20px;text-align:center}.challenge-target-text{font-size:1.5rem;font-weight:700;color:#0f172a;margin-bottom:8px;line-height:1.5}.challenge-target-text.ar{font-family:var(--arabic-font);font-size:1.95rem;line-height:2.1;direction:rtl}.challenge-target-translit{font-size:.95rem;color:#475569;font-style:italic;margin-bottom:6px}.challenge-target-meaning{font-size:.88rem;color:#64748b;font-weight:500}.challenge-listen-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;background:#f0fdf4;border:1px solid #bbf7d0;padding:10px 16px;border-radius:14px}.challenge-hint-text{font-size:.88rem;font-weight:700;color:#166534;display:flex;align-items:center;gap:6px}.listen-btn-group{display:flex;gap:8px}.btn-listen-sample{border:none;padding:6px 14px;border-radius:12px;font-size:.82rem;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:all .2s ease}.btn-listen-sample.normal{background:#fff;color:#166534;border:1px solid #86efac}.btn-listen-sample.normal:hover{background:#dcfce7}.btn-listen-sample.slow{background:#fef3c7;color:#92400e;border:1px solid #fde68a}.btn-listen-sample.slow:hover{background:#fde68a}.challenge-record-section{display:flex;flex-direction:column;align-items:center;gap:12px;padding:10px 0}.mic-wave-wrapper{position:relative;width:96px;height:96px;display:flex;align-items:center;justify-content:center}.mic-pulse-ring{position:absolute;top:-10px;right:-10px;bottom:-10px;left:-10px;border-radius:50%;border:3px solid rgba(239,68,68,.4);opacity:0;transform:scale(.8);pointer-events:none}.mic-wave-wrapper.recording .mic-pulse-ring{opacity:1;animation:pulseRing 1.5s infinite cubic-bezier(.215,.61,.355,1)}@keyframes pulseRing{0%{transform:scale(.85);opacity:.8}50%{transform:scale(1.3);opacity:.3}to{transform:scale(1.5);opacity:0}}.btn-challenge-mic{width:76px;height:76px;border-radius:50%;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;border:4px solid #ffffff;box-shadow:0 8px 20px #2563eb59;font-size:1.8rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .25s cubic-bezier(.16,1,.3,1);position:relative;z-index:2}.btn-challenge-mic:hover{transform:scale(1.08);box-shadow:0 12px 25px #2563eb73}.btn-challenge-mic.recording{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 8px 25px #ef444480;animation:micBeat .8s infinite alternate ease-in-out}@keyframes micBeat{0%{transform:scale(1)}to{transform:scale(1.12)}}.challenge-mic-status{font-size:.92rem;font-weight:600;color:#475569;text-align:center;max-width:420px}.challenge-mic-status.listening{color:#ef4444;font-weight:700;animation:blinkText 1.2s infinite alternate}@keyframes blinkText{0%{opacity:.7}to{opacity:1}}.challenge-transcript-container{background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px}.words-chip-header{font-size:.8rem;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.5px}.words-chip-grid{display:flex;flex-wrap:wrap;gap:8px;min-height:44px;align-items:center}.words-chip-grid.ar{direction:rtl;justify-content:flex-start}.word-chip{padding:6px 12px;border-radius:10px;background:#fff;border:1.5px solid #cbd5e1;color:#64748b;font-size:.95rem;font-weight:600;display:inline-flex;align-items:center;gap:6px;transition:all .25s ease}.word-chip.ar{font-family:var(--arabic-font);font-size:1.35rem;line-height:1.6;direction:rtl;padding:4px 14px}.word-chip.hit{background:#dcfce7;border-color:#22c55e;color:#15803d;transform:scale(1.04);box-shadow:0 2px 8px #22c55e33}.word-chip.hit:after{content:"✓";font-size:.8rem;font-weight:800}.word-chip.ar.hit:after{content:" ✓";font-size:.95rem;font-family:sans-serif;margin-right:4px}.word-chip.near{background:#fef3c7;border-color:#f59e0b;color:#b45309}.challenge-raw-speech{font-size:.85rem;color:#94a3b8;font-style:italic;border-top:1px dashed #e2e8f0;padding-top:8px}.challenge-raw-speech.ar{direction:rtl;text-align:right;font-family:var(--arabic-font);font-size:1.15rem;line-height:1.6}.challenge-result-box{background:linear-gradient(135deg,#eff6ff,#f0fdf4);border:2px solid #86efac;border-radius:20px;padding:24px;text-align:center;animation:popIn .35s cubic-bezier(.16,1,.3,1)}@keyframes popIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.result-stars{display:flex;justify-content:center;gap:12px;margin-bottom:12px}.result-stars i{font-size:2.2rem;color:#cbd5e1;transition:all .3s cubic-bezier(.16,1,.3,1)}.result-stars i.active{color:#eab308;filter:drop-shadow(0 0 10px rgba(234,179,8,.5));transform:scale(1.2)}.result-headline{font-size:1.3rem;font-weight:800;color:#0f172a;margin-bottom:6px}.result-feedback{font-size:.92rem;color:#475569;margin:0 0 16px}.self-listen-player{background:#fff;border:1px solid #cbd5e1;border-radius:14px;padding:12px 16px;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}.btn-play-self-audio{background:#3b82f6;color:#fff;border:none;padding:8px 16px;border-radius:12px;font-size:.88rem;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:all .2s ease}.btn-play-self-audio:hover{background:#2563eb;transform:translateY(-2px)}.btn-play-self-audio.playing{background:#ef4444}.self-listen-hint{font-size:.85rem;color:#64748b;font-weight:500}.challenge-mode-tabs{display:flex;background:#f1f5f9;padding:6px;border-radius:16px;gap:8px;margin:14px 24px 0}.mode-tab-pill{flex:1;border:2px solid transparent;background:transparent;padding:8px 12px;border-radius:12px;cursor:pointer;display:flex;align-items:center;gap:10px;text-align:left;transition:all .25s cubic-bezier(.16,1,.3,1)}.mode-tab-pill:hover{background:#ffffffb3}.mode-tab-pill.active{background:#fff;border-color:#3b82f6;box-shadow:0 4px 12px #3b82f626;transform:translateY(-1px)}.mode-tab-pill.active[data-mode=challenge]{border-color:#f59e0b;box-shadow:0 4px 12px #f59e0b33}.mode-tab-pill.active[data-mode=studio]{border-color:#10b981;box-shadow:0 4px 12px #10b98133}.pill-icon{width:34px;height:34px;border-radius:10px;background:#e2e8f0;display:flex;align-items:center;justify-content:center;font-size:1.05rem;color:#475569;flex-shrink:0;transition:all .2s ease}.mode-tab-pill.active[data-mode=challenge] .pill-icon{background:#fef3c7;color:#d97706}.mode-tab-pill.active[data-mode=studio] .pill-icon{background:#d1fae5;color:#059669}.pill-text{display:flex;flex-direction:column}.pill-text strong{font-size:.92rem;font-weight:800;color:#1e293b}.pill-text small{font-size:.72rem;color:#64748b;font-weight:600}.mode-container{display:flex;flex-direction:column;gap:18px;animation:fadeInContainer .25s ease}@keyframes fadeInContainer{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.studio-recorder-box{background:#f8fafc;border:2px dashed #cbd5e1;border-radius:18px;padding:20px 16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center}.studio-rec-status{font-size:.92rem;font-weight:700;color:#334155;display:flex;align-items:center;gap:6px}.studio-rec-control{display:flex;flex-direction:column;align-items:center;gap:8px}.btn-studio-record{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border:none;padding:12px 28px;border-radius:50px;font-size:1.05rem;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;gap:10px;box-shadow:0 6px 18px #ef444459;transition:all .25s cubic-bezier(.16,1,.3,1)}.btn-studio-record:hover{transform:scale(1.04);box-shadow:0 8px 24px #ef444473}.btn-studio-record.recording{background:linear-gradient(135deg,#0f172a,#334155);box-shadow:0 0 0 4px #ef444466,0 6px 18px #0f172a66;animation:pulseRec 1.2s infinite}@keyframes pulseRec{0%{transform:scale(1)}50%{transform:scale(1.03)}to{transform:scale(1)}}.studio-record-timer{display:inline-flex;align-items:center;gap:6px;background:#fee2e2;color:#991b1b;font-size:.9rem;font-weight:800;padding:4px 12px;border-radius:20px}.timer-dot{width:8px;height:8px;border-radius:50%;background:#ef4444;animation:blinkDot 1s infinite}@keyframes blinkDot{0%,to{opacity:1}50%{opacity:.2}}.studio-playback-card{background:#f0fdf4;border:2px solid #86efac;border-radius:20px;padding:18px;display:flex;flex-direction:column;gap:14px;animation:popIn .3s cubic-bezier(.16,1,.3,1)}@keyframes popIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.studio-playback-head{text-align:center}.studio-badge-great{display:inline-block;background:#10b981;color:#fff;font-size:.85rem;font-weight:800;padding:3px 12px;border-radius:20px;margin-bottom:6px}.studio-prompt-text{font-size:.88rem;color:#1e3a8a;margin:0;font-weight:600}.studio-player-row{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}.btn-studio-play{background:#3b82f6;color:#fff;border:none;padding:10px 22px;border-radius:12px;font-size:.95rem;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;gap:8px;box-shadow:0 4px 12px #3b82f640;transition:all .2s ease}.btn-studio-play:hover{background:#2563eb;transform:translateY(-2px)}.btn-studio-play.playing{background:#ef4444}.studio-wave-anim{display:flex;align-items:center;gap:4px;height:26px}.studio-wave-anim span{width:4px;height:8px;background:#10b981;border-radius:4px;transition:all .2s ease}.studio-wave-anim.active span:nth-child(1){animation:studioWave .6s infinite ease-in-out alternate;animation-delay:.1s}.studio-wave-anim.active span:nth-child(2){animation:studioWave .6s infinite ease-in-out alternate;animation-delay:.2s}.studio-wave-anim.active span:nth-child(3){animation:studioWave .6s infinite ease-in-out alternate;animation-delay:.3s}.studio-wave-anim.active span:nth-child(4){animation:studioWave .6s infinite ease-in-out alternate;animation-delay:.4s}.studio-wave-anim.active span:nth-child(5){animation:studioWave .6s infinite ease-in-out alternate;animation-delay:.5s}@keyframes studioWave{0%{height:6px}to{height:24px}}.studio-feedback-bar{display:flex;align-items:center;justify-content:space-between;background:#fff;padding:8px 12px;border-radius:12px;border:1px solid #bbf7d0;flex-wrap:wrap;gap:8px}.self-eval-title{font-size:.85rem;font-weight:700;color:#334155}.self-eval-chips{display:flex;gap:8px}.btn-self-eval{background:#f1f5f9;border:1.5px solid #cbd5e1;padding:5px 12px;border-radius:8px;font-size:.82rem;font-weight:700;cursor:pointer;color:#334155;transition:all .2s ease}.btn-self-eval:hover{transform:scale(1.04)}.btn-self-eval[data-eval=mirip]:hover,.btn-self-eval[data-eval=mirip].selected{background:#dcfce7;border-color:#22c55e;color:#15803d}.btn-self-eval[data-eval=ulangi]:hover{background:#fee2e2;border-color:#f87171;color:#b91c1c}.studio-save-action{display:flex;justify-content:center;margin-top:2px}.btn-studio-save{background:linear-gradient(135deg,#059669,#047857);color:#fff;border:none;padding:10px 22px;border-radius:12px;font-size:.92rem;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;gap:8px;box-shadow:0 4px 12px #05966940;transition:all .2s ease}.btn-studio-save:hover{background:#065f46;transform:translateY(-2px)}.result-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.btn-retry-challenge{background:#fff;border:1.5px solid #cbd5e1;color:#475569;padding:10px 20px;border-radius:14px;font-size:.92rem;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:all .2s ease}.btn-retry-challenge:hover{background:#f1f5f9;color:#0f172a}.btn-retry-challenge.highlight{background:linear-gradient(135deg,#f59e0b,#d97706);border-color:#b45309;color:#fff;box-shadow:0 4px 14px #f59e0b66;animation:pulseRetry 1.8s infinite ease-in-out}.btn-retry-challenge.highlight:hover{background:linear-gradient(135deg,#d97706,#b45309);transform:translateY(-2px);box-shadow:0 6px 18px #d9770680}@keyframes pulseRetry{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}.btn-finish-challenge{background:#10b981;border:none;color:#fff;padding:10px 24px;border-radius:14px;font-size:.92rem;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:8px;box-shadow:0 4px 12px #10b9814d;transition:all .2s ease}.btn-finish-challenge:hover{background:#059669;transform:translateY(-2px);box-shadow:0 6px 16px #10b98166}.btn-finish-challenge.secondary{background:#f1f5f9;border:1.5px solid #cbd5e1;color:#475569;box-shadow:none}.btn-finish-challenge.secondary:hover{background:#e2e8f0;color:#1e293b;transform:none;box-shadow:none}html.dark .modal-content-challenge{background:#1e293b;color:#f8fafc}html.dark .challenge-header{background:#0f172a;border-color:#334155}html.dark .challenge-header-title h3{color:#f8fafc}html.dark .challenge-target-box{background:#0f172a;border-color:#334155}html.dark .challenge-target-text{color:#f8fafc}html.dark .challenge-target-translit,html.dark .challenge-target-meaning{color:#94a3b8}html.dark .challenge-listen-row{background:#10b9811a;border-color:#10b98140}html.dark .challenge-transcript-container{background:#0f172a;border-color:#334155}html.dark .word-chip{background:#1e293b;border-color:#475569;color:#94a3b8}html.dark .challenge-result-box{background:#0f172a;border-color:#059669}html.dark .result-headline{color:#f8fafc}html.dark .result-feedback{color:#cbd5e1}html.dark .self-listen-player{background:#1e293b;border-color:#334155}