
:root{
  --bg:#f8fbff; --white:#ffffff; --text:#23304b; --muted:#64748b; --primary:#7C3AED; --primary-dark:#6D28D9;
  --pink:#EC4899; --cyan:#38BDF8; --green:#22C55E; --yellow:#FBBF24; --border:#e8eef7; --shadow:0 18px 50px rgba(31,41,55,.08);
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:linear-gradient(180deg,#eef6ff 0%,#ffffff 46%,#fff4fb 100%);color:var(--text);font-family:"Nunito",system-ui,sans-serif}
h1,h2,h3,h4,.brand-title{margin:0;font-family:"Baloo 2","Nunito",sans-serif;line-height:1.05}
p{line-height:1.7} a{text-decoration:none;color:inherit}
body.rtl{direction:rtl}
.container{width:min(1180px,calc(100% - 32px));margin:0 auto}
.topbar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
.nav{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:14px}.brand-logo{width:88px;height:auto;display:block}
.brand-title{font-size:1.55rem;font-weight:800}.brand-sub{font-size:.88rem;color:var(--muted)}
.nav-links,.right-tools{display:flex;gap:18px;align-items:center}.nav-links{font-weight:800}
.nav-links a:hover{color:var(--primary)}
.lang-select,.input,textarea.input{padding:12px 14px;border:1px solid var(--border);border-radius:16px;font:inherit;background:#fff}
.btn{display:inline-flex;align-items:center;justify-content:center;border:none;cursor:pointer;border-radius:18px;padding:14px 22px;font-weight:800;transition:.22s ease}
.btn:hover{transform:translateY(-1px)} .btn-primary{background:var(--primary);color:#fff;box-shadow:0 12px 30px rgba(124,58,237,.22)}
.btn-primary:hover{background:var(--primary-dark)} .btn-secondary{background:#fff;color:var(--text);border:1px solid var(--border)}
.hero{position:relative;overflow:hidden;padding:56px 0 40px}.hero-grid{position:relative;display:grid;grid-template-columns:1.02fr .98fr;gap:40px;align-items:center}
.eyebrow,.section-eyebrow,.chip{display:inline-flex;align-items:center;border-radius:999px;padding:10px 16px;font-size:.9rem;font-weight:800}
.eyebrow{background:#fef3c7;color:#92400e}.section-eyebrow{background:#ede9fe;color:var(--primary);text-transform:uppercase;letter-spacing:.2em;font-size:.75rem}.chip{background:#f3e8ff;color:#6d28d9;padding:8px 12px;font-size:.78rem}
.hero h1,.page-card h1{margin-top:18px;font-size:clamp(2.6rem,6vw,4.8rem);max-width:720px}
.hero p,.page-card p{margin:18px 0 0;font-size:1.1rem;color:var(--muted);max-width:800px}
.hero-actions{margin-top:28px;display:flex;gap:14px;flex-wrap:wrap}
.stats{margin-top:28px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:720px}
.stat-card,.page-card,.feature-card,.subject-card,.lesson-card,.story-card,.quiz-card,.dashboard-card,.login-card,.contact-card,.donate-card{
  background:#fff;border:1px solid var(--border);border-radius:30px;box-shadow:var(--shadow)
}
.stat-card{padding:18px 16px}.stat-card strong{display:block;color:var(--primary);font-size:1.7rem}.stat-card span{color:var(--muted);font-size:.92rem}
.hero-panel,.page-card,.quiz-card,.dashboard-card,.login-card,.contact-card,.donate-card{padding:26px}
.hero-logo{max-width:360px;width:100%;display:block;margin:0 auto 16px}
.note-box{border-radius:26px;padding:16px 18px;background:linear-gradient(90deg,#fff2b3,#ffe4f1);margin-bottom:18px}
.panel-grid,.lesson-grid,.story-grid,.dashboard-stats,.cards-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.feature-card{padding:22px;display:block;min-height:170px}.feature-card h3{margin-top:8px;font-size:1.5rem}
.purple-card{background:linear-gradient(135deg,#7c3aed,#d946ef);color:#fff;border:none}.sky-card{background:#eef9ff}.pink-card{background:#fff1f8}.green-card{background:#eefdf3}
.subjects{margin-top:26px;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.subject-card,.lesson-card,.story-card{padding:24px;transition:.22s ease}.subject-card:hover,.lesson-card:hover,.story-card:hover{transform:translateY(-4px)}
.subject-card h3,.lesson-card h3,.story-card h3{margin-top:14px;font-size:1.55rem}.subject-card p,.lesson-card p,.story-card p{color:var(--muted)}
.subject-icon{width:62px;height:62px;border-radius:20px;display:grid;place-items:center;font-size:2rem;box-shadow:0 12px 22px rgba(15,23,42,.08)}
.yellow{background:linear-gradient(135deg,#fde68a,#fdba74)} .blue{background:linear-gradient(135deg,#93c5fd,#67e8f9)} .pink{background:linear-gradient(135deg,#f9a8d4,#fda4af)} .green{background:linear-gradient(135deg,#86efac,#6ee7b7)}
.page-hero,.section{padding:48px 0 72px}
.section-head,.footer-wrap{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}.section-tag{background:#fff;border:1px solid var(--border);border-radius:18px;padding:12px 16px;color:var(--muted)}
.list,.bar-group,.form-grid,.options{display:grid;gap:12px}.list div,.info-box,.login-note,.result-box{background:#f8fafc;padding:16px 18px;border-radius:20px}
.dashboard-stats{grid-template-columns:repeat(3,1fr);margin-top:20px}.bar-label{display:flex;justify-content:space-between;margin-bottom:8px}
.bar{height:12px;background:#eef2f7;border-radius:999px;overflow:hidden}.bar span{display:block;height:100%;background:linear-gradient(90deg,#7c3aed,#38bdf8)}
.question{padding:18px;border-radius:20px;background:#f8fafc}.footer{background:#fff;border-top:1px solid var(--border);padding:28px 0}
.footer-sub{color:var(--muted);margin-top:4px}.footer-tags{display:flex;gap:12px;flex-wrap:wrap}.footer-tags span{background:#f8fafc;border-radius:999px;padding:10px 14px;font-weight:800;color:#475569}
.flash{padding:14px 16px;border-radius:18px;font-weight:800}.flash.success{background:#ecfdf5;color:#166534}.flash.error{background:#fff1f2;color:#be123c}
.blob{position:absolute;border-radius:50%;filter:blur(48px);opacity:.36}.blob-a{width:220px;height:220px;background:#facc15;left:30px;top:50px}.blob-b{width:260px;height:260px;background:#f472b6;right:40px;top:20px}.blob-c{width:280px;height:280px;background:#67e8f9;left:32%;bottom:30px}
@media (max-width:1024px){.hero-grid,.subjects,.lesson-grid,.story-grid,.cards-2{grid-template-columns:1fr 1fr}.panel-grid{grid-template-columns:1fr}}
@media (max-width:760px){.nav{flex-wrap:wrap;padding:14px 0}.nav-links{display:none}.hero-grid,.subjects,.lesson-grid,.story-grid,.stats,.dashboard-stats,.cards-2{grid-template-columns:1fr}.section-head,.footer-wrap{align-items:flex-start;flex-direction:column}.section-tag{display:none}.brand-logo{width:68px}.container{width:min(100% - 20px,1180px)}}


.ai-chat{display:grid;gap:14px;max-height:420px;overflow:auto;padding-right:4px}
.reading-box{padding:20px;border-radius:24px;background:#f8fafc;border:1px solid var(--border)}
.tool-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}
.teacher-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.table-wrap{overflow:auto;margin-top:18px}
.simple-table{width:100%;border-collapse:collapse;background:#fff;border-radius:20px;overflow:hidden}
.simple-table th,.simple-table td{padding:12px 14px;border-bottom:1px solid var(--border);text-align:left}
.simple-table th{background:#f8fafc}
.badge{display:inline-block;padding:6px 10px;border-radius:999px;background:#ede9fe;color:#6d28d9;font-size:.8rem;font-weight:800}
@media (max-width:760px){.teacher-grid{grid-template-columns:1fr}}


:root{
  --bg:#f5f7fb;
  --panel:#ffffff;
  --text:#20345f;
  --muted:#5f6f94;
  --line:#d8dfeb;
  --accent:#2a4aa0;
  --gold:#e0b52b;
  --teal:#d9efef;
  --shadow:0 2px 0 rgba(16,24,40,.08), 0 10px 24px rgba(16,24,40,.04);
}
body{background:var(--bg)!important;color:var(--text)!important;font-family:"Nunito",system-ui,sans-serif}
.topbar{background:#fff!important;border-bottom:1px solid var(--line)!important;backdrop-filter:none!important}
.nav{min-height:88px!important}
.brand-logo{width:72px!important}
.brand-title{font-size:1.45rem!important;color:var(--accent)}
.brand-sub{color:var(--muted)!important}
.nav-links a{color:var(--accent);font-weight:700}
.btn{border-radius:12px!important;padding:12px 20px!important;box-shadow:none!important}
.btn-primary{background:var(--gold)!important;color:#1d2842!important;border:1px solid #caa22a!important}
.btn-secondary{background:#fff!important;border:2px solid #bcc6d8!important;color:var(--accent)!important}
.hero,.page-hero,.section{padding-top:32px!important}
.page-card,.quiz-card,.dashboard-card,.lesson-card,.story-card,.contact-card,.donate-card,.login-card,.feature-card,.subject-card{
  background:var(--panel)!important;border:1px solid var(--line)!important;border-radius:18px!important;box-shadow:var(--shadow)!important
}
.page-card h1,.hero h1{color:var(--accent)!important;font-size:clamp(2rem,4vw,3.3rem)!important}
.page-card p,.hero p,.lesson-card p,.story-card p,.dashboard-card p{color:var(--muted)!important}
.section-eyebrow,.chip,.eyebrow{background:#ece8fb!important;color:#6846d7!important;letter-spacing:.12em!important;font-size:.76rem!important}
.blob{display:none!important}
.note-box,.info-box,.reading-box,.result-box,.login-note{
  background:#f7f9fd!important;border:1px solid var(--line)!important;color:var(--muted)!important;border-radius:14px!important
}
.lesson-grid,.subjects,.panel-grid,.cards-2,.teacher-grid{gap:18px!important}
.feature-card h3,.subject-card h3,.lesson-card h3,.story-card h3{color:var(--accent)!important}
.purple-card,.sky-card,.pink-card,.green-card{background:#fff!important;color:var(--text)!important}
.input,.lang-select{background:#fff!important;border:1px solid #bfc9da!important;border-radius:12px!important}
.simple-table th{background:#f5f7fb!important;color:var(--accent)!important}
.footer{background:#fff!important;border-top:1px solid var(--line)!important}
.footer-tags span{background:#f5f7fb!important;color:var(--accent)!important}
.academic-top-actions{display:flex;gap:12px;align-items:center}
.academic-ghost{background:#fff;border:2px solid #c7cfdd;color:var(--accent);border-radius:12px;padding:10px 18px;font-weight:700}
.academic-gold{background:var(--gold);border:1px solid #c89e1d;color:#1d2842;border-radius:12px;padding:10px 18px;font-weight:800}
.library-layout{display:grid;grid-template-columns:2.2fr 1fr;gap:20px}
.library-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.library-card{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:20px}
.library-card h3{color:var(--accent);font-size:1.15rem;margin:0 0 8px 0}
.library-card p{color:var(--muted);margin:0}
.library-sidebar{display:grid;gap:16px}
.library-soft{background:#ddf0ef}
.library-search{display:flex;justify-content:flex-end;margin-bottom:8px}
.search-box{width:280px;background:#fff;border:1px solid #bcc6d8;border-radius:14px;display:flex;align-items:center;justify-content:space-between;padding:0 14px}
.search-box input{border:none;outline:none;background:transparent;width:100%;padding:14px 0;font:inherit;color:var(--text)}
.icon-badge{width:36px;height:36px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;margin-right:10px;font-size:18px}
.badge-gold{background:#e9a63b;color:#fff}
.badge-teal{background:#6ed0c3;color:#fff}
.badge-blue{background:#6ebfe7;color:#fff}
.badge-green{background:#77c94d;color:#fff}
.badge-purple{background:#8f22e8;color:#fff}
@media (max-width:900px){.library-layout{grid-template-columns:1fr}.library-columns{grid-template-columns:1fr}}
