*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:"Cairo","Tajawal",sans-serif;color:#17375f}body{overflow-x:hidden;overflow-y:auto}.scene{position:relative;min-height:100vh;overflow-x:hidden;overflow-y:visible;background:linear-gradient(#8fd7f6 0%,#d8f1ed 52%,#d9e9bd 100%)}button{font:inherit;border:0;cursor:pointer}.sun-glow{position:absolute;width:520px;height:520px;top:-280px;left:45%;border-radius:50%;background:rgba(255,239,160,.55);filter:blur(22px)}.cloud{position:absolute;background:rgba(255,255,255,.75);border-radius:50px;filter:blur(1px)}.cloud:before,.cloud:after{content:"";position:absolute;background:inherit;border-radius:50%}.cloud-a{width:230px;height:45px;top:100px;left:5%}.cloud-a:before{width:80px;height:80px;left:45px;top:-35px}.cloud-a:after{width:100px;height:100px;left:100px;top:-55px}.cloud-b{width:180px;height:38px;top:180px;right:15%}.cloud-b:before{width:75px;height:75px;left:35px;top:-32px}.mountain{position:absolute;bottom:31%;width:55%;height:24%;clip-path:polygon(0 100%,28% 35%,40% 58%,57% 18%,78% 60%,100% 8%,100% 100%);background:rgba(119,173,151,.45)}.mountain-a{left:-5%}.mountain-b{right:-8%;transform:scaleX(-1);opacity:.7}.ground{position:absolute;bottom:-4%;left:-3%;width:106%;height:39%;background:radial-gradient(ellipse at 50% 0,#e9edc6 0,#b8ce8d 60%,#8cae72 100%);border-radius:50% 50% 0 0/22% 22% 0 0}.tree{position:absolute;bottom:28%;z-index:1}.tree i{display:block;position:absolute;border-radius:50%;background:radial-gradient(circle at 40% 30%,#a9d76f,#3c8658);box-shadow:0 8px 18px rgba(39,91,67,.18)}.tree:after{content:"";position:absolute;width:20px;height:140px;background:#8d6748;left:75px;top:95px;border-radius:15px}.tree-a{left:5%;width:220px;height:270px}.tree-a i:nth-child(1){width:125px;height:125px;left:20px;top:35px}.tree-a i:nth-child(2){width:140px;height:140px;left:80px;top:10px}.tree-a i:nth-child(3){width:120px;height:120px;left:105px;top:70px}.tree-b{right:3%;width:180px;height:220px;opacity:.75}.tree-b i:nth-child(1){width:115px;height:115px;left:10px;top:35px}.tree-b i:nth-child(2){width:120px;height:120px;left:65px;top:0}.flowers{position:absolute;bottom:18%;font-size:27px;letter-spacing:16px;color:#e88fa8;z-index:2}.flowers-a{left:19%}.flowers-b{right:19%}.topbar{position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:18px 26px 6px}.brand{text-align:center;position:absolute;left:50%;transform:translateX(-50%);top:17px}.brand-title{font-size:38px;font-weight:800;line-height:1.1;color:#13355d;text-shadow:0 3px 0 rgba(255,255,255,.7)}.brand-subtitle{font-size:23px;font-weight:800}.top-actions{width:100%;display:flex;align-items:center;gap:10px;direction:rtl}.icon-btn,.menu-btn,.points-pill,.profile{background:rgba(255,255,255,.88);border:1px solid rgba(71,106,129,.15);box-shadow:0 7px 18px rgba(38,74,88,.16);border-radius:20px}.menu-btn{order:1;padding:12px 20px;display:flex;gap:10px;align-items:center;color:#163b61;font-size:17px}.points-pill{order:2;min-width:160px;padding:8px 18px;display:grid;grid-template-columns:36px 1fr;grid-template-rows:1fr 1fr;align-items:center;text-align:center}.points-pill span{grid-row:1/3;font-size:31px}.points-pill strong{font-size:22px}.points-pill small{font-size:11px}.icon-btn{order:3;width:56px;height:56px;font-size:25px}.bell{margin-right:0}.profile{order:4;display:flex;align-items:center;gap:9px;padding:5px 7px 5px 15px}.profile-copy{display:flex;flex-direction:column;text-align:right;font-size:11px;line-height:1.35}.profile-copy strong{font-size:17px}.profile-copy small em{background:#6e45bd;color:white;padding:1px 7px;border-radius:12px;font-style:normal}.avatar{font-size:42px;background:#f5dfd3;border-radius:50%;width:62px;height:62px;display:grid;place-items:center}.dashboard{position:relative;z-index:3;max-width:1500px;margin:80px auto 0;padding:0 28px 28px;display:grid;grid-template-columns:1.2fr 1fr 1fr .72fr;grid-template-rows:230px 270px auto;gap:16px}.hero{grid-column:1/3;display:flex;overflow:hidden;border-radius:34px;border:2px solid rgba(255,255,255,.8);box-shadow:0 13px 35px rgba(48,84,85,.18);background:linear-gradient(100deg,rgba(255,241,229,.94),rgba(244,251,245,.9));position:relative}.journey-art{width:52%;position:relative;background:linear-gradient(#bce5f3,#e8f3ce);overflow:hidden}.journey-art:after{content:"";position:absolute;width:150%;height:95px;background:#d9bb82;left:-25%;bottom:18px;transform:rotate(-6deg);border-radius:50%;box-shadow:0 0 0 13px rgba(255,255,255,.35)}.school{position:absolute;font-size:92px;left:25px;bottom:52px;z-index:2}.bench{position:absolute;font-size:45px;right:20px;bottom:48px;z-index:2}.blossom{position:absolute;font-size:90px;left:90px;top:25px;filter:drop-shadow(0 5px 4px rgba(50,80,60,.2))}.sign{position:absolute;right:28px;top:38px;z-index:3;font-size:20px;font-weight:800;color:#633a72;transform:rotate(-3deg);text-align:center}.journey-copy{padding:34px 28px;display:flex;flex-direction:column;justify-content:center}.journey-copy h1{font-size:27px;margin:0 0 8px}.journey-copy p{margin:0 0 20px;font-size:14px}.primary{border-radius:30px;padding:11px 22px;color:white;font-weight:800;box-shadow:0 6px 0 rgba(30,80,120,.18);transition:.2s}.primary:hover{transform:translateY(-2px)}.pink{background:linear-gradient(#f59cae,#e77b9c)}.blue{background:linear-gradient(#4c9de7,#2772c3)}.quick-card{border-radius:28px;padding:20px;box-shadow:0 12px 30px rgba(54,86,81,.16);border:2px solid rgba(255,255,255,.7);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.games{background:rgba(244,237,255,.92)}.quiz{background:rgba(238,248,226,.94)}.mini-illustration{font-size:67px;filter:drop-shadow(0 8px 7px rgba(0,0,0,.12));margin-bottom:3px}.quick-card h2{margin:0;font-size:21px}.quick-card p{margin:2px 0 12px;font-size:12px}.purple-btn,.green-btn{color:white;border-radius:24px;padding:9px 26px;font-weight:800}.purple-btn{background:linear-gradient(#9d66e4,#7042bc)}.green-btn{background:linear-gradient(#69b84d,#3e8d3d)}.clipboard{font-size:58px;margin:2px}.right-rail{grid-column:4;grid-row:1/4;display:flex;flex-direction:column;gap:12px}.progress-card,.streak-card,.achievement-card,.quote-card{background:rgba(255,251,245,.91);border:2px solid rgba(255,255,255,.75);box-shadow:0 11px 28px rgba(57,79,64,.17);border-radius:25px;padding:16px}.card-heading{display:flex;justify-content:space-between;align-items:center}.card-heading h3,.streak-card h3,.achievement-card h3,.quote-card h3{margin:0;font-size:16px}.help-dot{width:28px;height:28px;border-radius:50%;background:#f1eee7}.ring{width:135px;height:135px;border-radius:50%;margin:8px auto;display:grid;place-items:center;background:conic-gradient(#20a37d 0 75%,#e7e5df 75%);position:relative}.ring:before{content:"";position:absolute;width:105px;height:105px;border-radius:50%;background:#fffdf8}.ring span{position:relative;font-size:27px;font-weight:800;color:#184b48}.great{display:block;text-align:center;font-size:12px}.streak-card{text-align:center}.streak-card strong{font-size:13px}.days{display:flex;justify-content:space-between;margin:9px 0 2px}.days i{font-style:normal;width:23px;height:23px;border-radius:50%;background:#2eaa63;color:white;font-size:13px;display:grid;place-items:center}.day-labels{display:flex;justify-content:space-between;font-size:10px;color:#666}.achievement-card{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#fff1ff,#f4e7fb)}.achievement-card p,.achievement-card b{font-size:11px;margin:3px 0}.badge{font-size:52px;filter:drop-shadow(0 4px 4px rgba(0,0,0,.12))}.quote-card{position:relative;min-height:110px}.quote-card p{font-size:12px;line-height:1.9;margin:8px 25px 0 0}.quote-card span{position:absolute;left:12px;bottom:3px;font-size:40px}.lesson-card{grid-column:1/4;grid-row:2;display:grid;grid-template-columns:210px 1fr 1.1fr;align-items:center;gap:18px;border-radius:32px;padding:18px 24px;background:rgba(255,249,239,.96);border:2px solid rgba(255,255,255,.9);box-shadow:0 15px 32px rgba(44,73,82,.18)}.lesson-art{height:210px;border-radius:24px;background:linear-gradient(135deg,#c8e5ef,#f9e7bf);position:relative;display:grid;place-items:center;font-size:92px;overflow:hidden}.lesson-art:before{content:"";position:absolute;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.5);top:-55px;right:-45px}.feather{position:absolute;font-size:50px;top:10px;right:28px}.lesson-art label{position:absolute;top:14px;left:12px;background:#58b787;color:white;padding:6px 12px;border-radius:15px;font-size:11px}.lesson-text{border-left:1px solid #d9d2c6;padding-left:22px}.eyebrow{font-weight:800;color:#174d8c}.lesson-text h2{font-size:28px;margin:4px 0}.lesson-text p{font-size:13px;line-height:1.8;margin:0 0 16px}.activity-preview{padding:12px}.chips{display:flex;gap:7px;justify-content:center;flex-wrap:wrap}.chip{padding:6px 13px;border-radius:9px;color:#fff;font-size:12px;font-weight:800}.chip.purple{background:#a66bc8}.chip.orange{background:#f2a744}.chip.blue{background:#5ca3d9}.chip.green{background:#64a950}.activity-preview p{text-align:center;font-size:12px}.drop-preview{display:flex;gap:10px;justify-content:center}.drop-preview span{background:#f7f5ef;border:2px dashed #d7d2c8;border-radius:13px;padding:12px 24px;font-size:12px}.curriculum{grid-column:1/4;grid-row:3;background:rgba(242,235,209,.52);border-radius:28px;padding:8px 18px;position:relative}.section-title{display:flex;align-items:center;gap:10px}.section-title h2{margin:0;font-size:20px}.section-title span{font-size:11px;color:#6b6b61}.map{height:130px;display:flex;align-items:center;justify-content:space-around;position:relative}.road{position:absolute;height:8px;background:#b99b70;left:8%;right:8%;top:61px;border-radius:50%;transform:rotate(-2deg);z-index:0}.station,.start-flag,.goal{position:relative;z-index:2;text-align:center}.station{width:90px}.station b{display:grid;place-items:center;width:44px;height:44px;margin:auto;border-radius:50%;background:#8d8a82;color:white;border:4px solid rgba(255,255,255,.8);font-size:14px}.station span{display:block;font-size:28px;margin-top:-37px;height:37px}.station strong{display:block;font-size:10px;margin-top:10px}.station em{font-style:normal;color:#e2a42c;font-size:11px}.station.current b{background:#397fc4}.station.current span{font-size:30px}.start-flag,.goal{font-size:27px}.start-flag small,.goal small{display:block;font-size:10px;background:#72543c;color:white;border-radius:10px;padding:2px 8px}.goal small{background:#7e633c}.side-menu{position:fixed;z-index:30;top:0;right:0;width:min(360px,88vw);height:100vh;background:linear-gradient(#173d66,#102d4e);color:white;padding:22px;transform:translateX(110%);transition:.35s ease;box-shadow:-15px 0 35px rgba(0,0,0,.25)}.side-menu.open{transform:none}.overlay{position:fixed;inset:0;background:rgba(10,31,50,.38);z-index:25;opacity:0;pointer-events:none;transition:.3s}.overlay.open{opacity:1;pointer-events:auto}.menu-head{display:flex;justify-content:space-between;align-items:center}.menu-head h2{margin:0}.menu-head button{width:40px;height:40px;border-radius:50%;font-size:25px;background:rgba(255,255,255,.12);color:white}.side-menu nav{display:flex;flex-direction:column;margin-top:22px;gap:7px}.side-menu nav button{display:flex;align-items:center;gap:15px;padding:13px 14px;border-radius:16px;color:white;background:transparent;text-align:right}.side-menu nav button:hover,.side-menu nav button.active{background:rgba(91,153,223,.35)}.menu-tip{margin-top:25px;padding:15px;border-radius:18px;background:rgba(255,255,255,.1);line-height:1.8}.menu-tip small{color:#dbe9f8}.modal{width:min(680px,92vw);border:0;border-radius:28px;padding:28px;background:linear-gradient(#fffdfa,#f4efe5);box-shadow:0 30px 80px rgba(20,47,67,.35);color:#183b60}.modal::backdrop{background:rgba(8,31,50,.5);backdrop-filter:blur(4px)}.modal-close{position:absolute;left:16px;top:14px;width:35px;height:35px;border-radius:50%;background:#eee9df;font-size:23px}.modal-step{text-align:center}.modal-icon{font-size:50px}.modal h2{margin:3px 0;font-size:28px}.modal p{font-size:13px}.interactive-box{margin-top:20px;background:white;border-radius:22px;padding:20px;box-shadow:inset 0 0 0 1px #ece6dc}.sentence{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;direction:rtl}.sentence button{padding:10px 18px;border-radius:13px;background:#f2eef8;border:2px solid transparent;color:#294b70;font-weight:800}.sentence button.selected{border-color:#5c93d2;transform:translateY(-2px)}.instruction{text-align:center}.answer-types{display:flex;justify-content:center;gap:10px}.answer-types button{padding:10px 30px;border-radius:14px;background:#eef2e7;font-weight:800}.feedback{margin-top:14px;min-height:27px;text-align:center;font-size:12px;font-weight:700}.modal-footer{display:flex;justify-content:space-between;align-items:center;margin-top:18px}.modal-title,.quiz-header{display:flex;gap:14px;align-items:center}.modal-title>span,.quiz-header>span{font-size:48px}.word-hunt{height:320px;position:relative;overflow:hidden;border-radius:22px;background:linear-gradient(#ccecf7,#edf3d2);margin-top:20px}.hunt-word{position:absolute;padding:10px 15px;background:#fff;border-radius:16px;box-shadow:0 5px 12px rgba(0,0,0,.12);font-weight:800;animation:drift 6s linear infinite}.hunt-word:hover{transform:scale(1.08)}@keyframes drift{from{transform:translateX(0) rotate(-3deg)}to{transform:translateX(-160px) rotate(3deg)}}.game-score{text-align:center;font-weight:800;margin-top:12px}.quiz-progress{height:9px;background:#e6e2da;border-radius:20px;overflow:hidden}.quiz-progress i{display:block;width:20%;height:100%;background:#4b93d4;transition:.3s}.question{font-size:19px;font-weight:800;text-align:center;padding:30px 10px 20px}.quiz-answers{display:grid;grid-template-columns:1fr 1fr;gap:10px}.quiz-answers button{padding:13px;border-radius:14px;background:#f2eee7;border:2px solid transparent}.quiz-answers button:hover{border-color:#78a6d2}.quiz-answers button.correct{background:#dff2df;border-color:#65ad67}.quiz-answers button.wrong{background:#fae0df;border-color:#d67870}.toast{position:fixed;z-index:60;left:50%;bottom:30px;transform:translate(-50%,20px) scale(.9);opacity:0;background:#173e63;color:#fff;padding:12px 22px;border-radius:30px;box-shadow:0 12px 30px rgba(0,0,0,.25);transition:.3s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0) scale(1)}.pop{animation:pop .45s ease}@keyframes pop{50%{transform:scale(1.08)}100%{transform:scale(1)}}@media(max-width:1100px){.dashboard{grid-template-columns:1.2fr 1fr 1fr;grid-template-rows:auto auto auto auto}.right-rail{grid-column:1/4;grid-row:4;display:grid;grid-template-columns:repeat(4,1fr)}.lesson-card{grid-column:1/4}.curriculum{grid-column:1/4}.brand-title{font-size:30px}.brand-subtitle{font-size:18px}}@media(max-width:760px){body{overflow-x:hidden;overflow-y:auto}.topbar{padding:10px 12px}.brand{position:relative;left:auto;transform:none;top:auto;order:2;flex:1}.brand-title{font-size:21px}.brand-subtitle{font-size:13px}.top-actions{display:grid;grid-template-columns:auto 1fr auto;direction:ltr}.menu-btn{order:1;padding:10px 13px}.menu-btn b{display:none}.points-pill{order:2;min-width:100px;padding:5px}.points-pill span{font-size:22px}.points-pill strong{font-size:17px}.icon-btn{order:3;width:44px;height:44px}.bell,.profile{display:none}.dashboard{margin-top:18px;padding:0 12px 18px;display:flex;flex-direction:column;gap:12px}.hero{min-height:280px;display:block}.journey-art{width:100%;height:155px}.journey-copy{padding:15px 20px}.journey-copy h1{font-size:21px}.journey-copy p{font-size:11px}.quick-card{min-height:190px}.lesson-card{display:flex;flex-direction:column;align-items:stretch;padding:14px}.lesson-art{height:145px}.lesson-text{border:0;padding:0}.activity-preview{border-top:1px solid #ddd4c7}.right-rail{display:grid;grid-template-columns:1fr 1fr;gap:10px}.progress-card,.streak-card,.achievement-card,.quote-card{min-height:145px}.curriculum{padding:10px;overflow:hidden}.map{width:720px;transform:scale(.72);transform-origin:center}.section-title{justify-content:center}.side-menu{width:88vw}.quiz-answers{grid-template-columns:1fr}.cloud-a{left:-70px}.tree-a{left:-60px}.tree-b{right:-70px}.flowers-a,.flowers-b{display:none}}
input{width:100%;padding:13px 15px;border:2px solid #e1ddd4;border-radius:14px;background:#fff;font:inherit;margin:6px 0;color:#17375f;outline:none}input:focus{border-color:#6fa3d2}.full{width:100%;margin-top:10px}.login-error{min-height:25px;color:#bd4b4b;font-size:12px;margin-top:8px}.created-user{display:none;margin-top:12px;padding:14px;border-radius:16px;background:#e6f5e9;font-weight:800}.created-user.show{display:block}.two-inputs{display:grid;grid-template-columns:1fr .45fr;gap:8px}.lesson-modal{max-height:90vh;overflow:auto}

/* Header composition fix: profile stays on the right, menu/stars on the left. */
.top-actions{direction:rtl!important}
.menu-btn{order:1}
.points-pill{order:2}
#helpBtn{order:3}
#notifyBtn{order:4}
.profile{order:5;margin-right:0}
.brand{pointer-events:none}
@media(min-width:761px){.top-actions{justify-content:space-between}.menu-btn{margin-left:auto}.profile{margin-right:auto}.brand{pointer-events:none}}

.teacher-entry{display:block;width:100%;margin-top:12px;padding:11px;border-radius:20px;background:#eee9df;color:#234b70;font-weight:800}.teacher-panel{width:min(900px,94vw)}.teacher-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:15px}.teacher-panel-head h2{margin:4px 0}.teacher-create{margin-top:18px;background:#f8f5ee;border-radius:20px;padding:16px}.teacher-create h3,.student-list h3{margin:0 0 8px}.wide{grid-template-columns:1fr .3fr}.student-list{margin-top:16px}.students-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;max-height:300px;overflow:auto}.student-row{background:white;border:1px solid #e5dfd3;border-radius:15px;padding:10px;display:flex;justify-content:space-between;align-items:center;gap:10px}.student-row b{display:block}.student-row small{display:block;color:#777}.student-username{direction:ltr;font-weight:800;color:#3f75ad;background:#edf5ff;padding:4px 8px;border-radius:9px;white-space:nowrap}@media(max-width:760px){.students-grid{grid-template-columns:1fr}.teacher-panel-head{display:block}.teacher-panel-head .primary{margin-top:8px}.wide{grid-template-columns:1fr}}

/* Final header fix: keep profile at right and menu/points at left around the centered title. */
@media(min-width:761px){.top-actions{direction:ltr!important;display:flex;justify-content:space-between;align-items:center;width:100%;gap:10px}.top-actions>*{flex:0 0 auto}.menu-btn{order:1;margin-left:0}.points-pill{order:2}.icon-btn#helpBtn{order:3}.icon-btn#notifyBtn{order:4}.profile{order:5;margin-right:0;margin-left:auto}.menu-btn,.points-pill,.icon-btn,.profile{direction:rtl}}

.list-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.list-head input{max-width:310px;margin:0}.student-details{width:min(720px,94vw)}.detail-hero{display:flex;align-items:center;gap:14px;background:#f5f1e8;border-radius:20px;padding:16px}.detail-avatar{font-size:46px;background:#fff;border-radius:18px;padding:8px}.detail-hero h2{margin:0}.detail-hero p{margin:3px 0;color:#777}.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}.detail-stat{background:#fff;border:1px solid #e8e1d6;border-radius:16px;padding:13px;text-align:center}.detail-stat b{display:block;font-size:22px;color:#245b87}.detail-section{background:#faf8f3;border-radius:18px;padding:14px;margin-top:12px}.detail-lessons{display:grid;grid-template-columns:1fr 1fr;gap:8px}.detail-lesson{padding:9px 11px;border-radius:12px;background:#fff;display:flex;justify-content:space-between}.detail-lesson.done{background:#e7f6ed}.events{font-size:13px}.event{display:flex;justify-content:space-between;border-bottom:1px dashed #ddd;padding:7px}.event:last-child{border:0}@media(max-width:700px){.list-head{display:block}.list-head input{max-width:none}.detail-grid{grid-template-columns:1fr 1fr}.detail-lessons{grid-template-columns:1fr}}

.teacher-hint{margin-top:10px;padding:9px 12px;border-radius:12px;background:#f5f1e8;color:#6d675d;font-size:12px}.teacher-actions{display:flex;gap:8px;align-items:center}.logout-btn{border:0;border-radius:18px;padding:10px 14px;background:#f3e4e1;color:#9a4d43;font-weight:800;cursor:pointer}

.teacher-menu-item{margin-top:10px!important;border-top:1px solid rgba(255,255,255,.16)!important;padding-top:16px!important;color:#ffe3a0!important}.teacher-menu-item:hover{background:rgba(255,255,255,.1)!important}
/* Curriculum journeys: two real learning parts, preserving the existing map composition. */
.journey-parts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:10px 0 8px}.part-tab{border:1px solid rgba(44,94,130,.15);background:rgba(255,255,255,.8);border-radius:18px;padding:9px 18px;color:#345b7d;font-weight:800;cursor:pointer;transition:.2s;box-shadow:0 5px 15px rgba(39,91,116,.07)}.part-tab small{display:block;font-size:10px;font-weight:600;opacity:.7;margin-top:2px}.part-tab.active{background:linear-gradient(135deg,#dff5ef,#eef9ff);border-color:#72c9ae;transform:translateY(-1px)}.part-note{text-align:center;color:#667b89;font-size:12px;margin:5px 0 10px}.curriculum-units{display:flex;gap:12px;overflow:auto;padding:2px 2px 10px;scrollbar-width:thin}.curriculum-unit{min-width:210px;max-width:280px;background:rgba(255,255,255,.82);border:1px solid rgba(55,105,133,.12);border-radius:20px;padding:13px;box-shadow:0 7px 20px rgba(40,91,116,.08)}.curriculum-unit h3{margin:0 0 8px;color:#244e73;font-size:15px}.unit-meta{font-size:11px;color:#7b8c97;margin-bottom:8px}.unit-lessons{display:grid;gap:6px}.unit-lesson{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 9px;border-radius:12px;background:#f8fbfc;color:#385d78;font-size:12px}.unit-lesson button{border:0;background:#e6f4f0;color:#277c68;border-radius:10px;padding:5px 8px;cursor:pointer;font-weight:800}.unit-lesson.locked{opacity:.55}.unit-lesson .done{color:#269775;font-weight:900}.curriculum-units:empty{display:none}.curriculum .map{margin-top:2px}
@media(max-width:650px){.part-tab{flex:1;min-width:140px}.curriculum-units{justify-content:flex-start}.curriculum-unit{min-width:240px}}

/* V9 journey tunnel: replace the old white curriculum cards with a living map. */
.journey-curriculum{grid-column:1/4;grid-row:3;min-height:390px;padding:18px 20px 14px;border-radius:32px;background:linear-gradient(180deg,rgba(244,250,241,.72),rgba(220,235,204,.48));border:1px solid rgba(255,255,255,.72);box-shadow:0 12px 30px rgba(47,82,71,.12);overflow:hidden}
.journey-head{display:flex;align-items:center;justify-content:space-between;gap:20px;position:relative;z-index:5}.journey-kicker{font-size:12px;font-weight:800;color:#3c7b68}.journey-head h2{margin:2px 0 0;font-size:24px;color:#173f64}.journey-head p{margin:2px 0 0;font-size:11px;color:#718078}.journey-switcher{display:flex;gap:8px}.journey-switcher .part-tab{min-width:150px;display:grid;grid-template-columns:35px 1fr;grid-template-rows:1fr 1fr;align-items:center;text-align:right;padding:8px 12px;border-radius:18px;background:rgba(255,255,255,.72);border:1px solid rgba(72,112,94,.14);box-shadow:0 5px 14px rgba(44,85,70,.08)}.journey-switcher .part-tab>span{grid-row:1/3;font-size:25px}.journey-switcher .part-tab b{font-size:13px}.journey-switcher .part-tab small{font-size:9px;color:#73837b}.journey-switcher .part-tab.active{background:linear-gradient(135deg,#168f67,#48b785);color:#fff;border-color:#14845f;box-shadow:0 7px 16px rgba(30,123,91,.22);transform:none}.journey-switcher .part-tab.active small{color:rgba(255,255,255,.82)}
.journey-note{text-align:center;font-size:10px;color:#6c7e74;margin:4px 0 6px;position:relative;z-index:5}
.journey-tunnel{height:292px;position:relative;overflow:hidden;border-radius:25px;background:linear-gradient(#bde8f3 0%,#d9f0e6 45%,#c9d99d 100%);box-shadow:inset 0 0 50px rgba(255,255,255,.32);isolation:isolate}
.tunnel-sky{position:absolute;inset:0;overflow:hidden;z-index:-1}.t-cloud{position:absolute;background:rgba(255,255,255,.66);width:150px;height:30px;border-radius:50px;filter:blur(1px)}.t-cloud:before,.t-cloud:after{content:"";position:absolute;background:inherit;border-radius:50%}.t-cloud:before{width:55px;height:55px;left:30px;top:-24px}.t-cloud:after{width:70px;height:70px;left:80px;top:-35px}.t-cloud.c1{left:10%;top:35px}.t-cloud.c2{right:15%;top:75px;transform:scale(.8)}.t-hill{position:absolute;bottom:70px;width:60%;height:120px;background:rgba(105,156,117,.27);clip-path:polygon(0 100%,18% 58%,33% 76%,50% 30%,69% 72%,84% 48%,100% 100%)}.t-hill.h1{left:-7%}.t-hill.h2{right:-9%;transform:scaleX(-1);opacity:.8}
.journey-tunnel:after{content:"";position:absolute;left:-5%;right:-5%;bottom:-72px;height:210px;background:radial-gradient(ellipse at 50% 0,#f4e7bd 0,#d6c58f 38%,#b1bd82 72%,#879e6e 100%);border-radius:50% 50% 0 0/45% 45% 0 0;z-index:-1}
.tunnel-road{position:absolute;left:9%;right:9%;top:55%;height:35px;background:#d6c394;border-radius:50%;transform:rotate(-2deg);box-shadow:0 8px 0 rgba(255,255,255,.35),0 -3px 0 rgba(166,139,91,.16);z-index:1}.tunnel-road:before,.tunnel-road:after{content:"";position:absolute;border-radius:50%;border:3px dashed rgba(255,255,255,.55);left:0;right:0}.tunnel-road:before{top:-10px}.tunnel-road:after{bottom:-10px}.road-glow{position:absolute;left:0;right:0;top:9px;height:8px;background:rgba(255,255,255,.42);border-radius:50%;animation:roadPulse 2.8s ease-in-out infinite}@keyframes roadPulse{50%{opacity:.35;transform:scaleX(.88)}100%{opacity:1;transform:scaleX(1)}}
.unit-ribbon{position:absolute;z-index:4;display:flex;align-items:center;gap:9px;padding:9px 17px 9px 12px;color:#fff;filter:drop-shadow(0 6px 8px rgba(37,75,64,.14));clip-path:polygon(0 0,92% 0,100% 50%,92% 100%,0 100%,7% 50%)}.unit-ribbon span{font-size:24px}.unit-ribbon small{display:block;font-size:9px;opacity:.82}.unit-ribbon strong{display:block;font-size:13px}.ribbon-a{left:18px;top:25px;background:linear-gradient(135deg,#159267,#45ad7a)}.ribbon-b{left:18px;bottom:23px;background:linear-gradient(135deg,#2872b7,#4c9dd5)}
.journey-nodes{position:absolute;left:13%;right:12%;top:36%;height:100px;display:flex;align-items:center;justify-content:space-between;z-index:5}.journey-node{position:relative;width:118px;min-width:118px;background:transparent;color:#173f5f;text-align:center;padding:0 3px;transition:.25s;cursor:pointer}.journey-node:before{content:"";position:absolute;width:68px;height:68px;left:25px;top:-10px;border-radius:50%;background:rgba(255,255,255,.88);border:4px solid #5fbe9d;box-shadow:0 7px 15px rgba(41,83,73,.16);z-index:-1}.journey-node.locked:before{border-color:#a9b1b2;background:rgba(240,240,237,.88)}.journey-node.done:before{border-color:#27a86d;background:#e7f8ef}.node-number{position:absolute;left:2px;top:-4px;width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#2879c1;color:#fff;font-size:11px;font-weight:800;border:2px solid #fff}.journey-node.done .node-number{background:#28a46d}.node-icon{display:block;font-size:30px;line-height:52px}.node-label{display:block;margin-top:11px;background:rgba(255,255,255,.86);border-radius:13px;padding:5px 6px;box-shadow:0 4px 10px rgba(48,76,63,.08);min-height:49px}.node-label small{display:block;font-size:8px;color:#708277}.node-label b{display:block;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.journey-node.locked .node-label{opacity:.62}.journey-node.current .node-label{border:2px solid #5db58f}.journey-node.focus{transform:translateY(-8px) scale(1.05)}.journey-node.focus:before{box-shadow:0 0 0 8px rgba(82,178,143,.14),0 9px 20px rgba(41,83,73,.2)}
.journey-start,.journey-goal{position:absolute;z-index:6;text-align:center;font-weight:800}.journey-start{left:3%;bottom:27px;font-size:25px}.journey-start small,.journey-goal small{display:block;font-size:9px;color:#315e51}.journey-goal{right:3%;bottom:22px;background:rgba(255,255,255,.84);padding:7px 11px;border-radius:16px;font-size:28px;box-shadow:0 5px 13px rgba(54,78,58,.12)}.journey-goal b{display:block;font-size:9px;color:#765d2d}.tunnel-arrow{position:absolute;z-index:8;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.86);color:#28557a;font-size:27px;line-height:1;box-shadow:0 5px 13px rgba(39,75,77,.16);top:50%;transform:translateY(-50%)}.tunnel-prev{left:8px}.tunnel-next{right:8px}.tunnel-caption{position:absolute;z-index:7;right:50%;transform:translateX(50%);bottom:9px;background:rgba(23,63,95,.76);color:#fff;padding:6px 15px;border-radius:18px;font-size:9px;white-space:nowrap;max-width:70%;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1100px){.journey-curriculum{grid-column:1/4}.journey-head{align-items:flex-start}.journey-switcher .part-tab{min-width:130px}.journey-nodes{left:10%;right:8%}.journey-node{width:105px;min-width:105px}.journey-node:before{left:18px}}
@media(max-width:760px){.journey-curriculum{min-height:520px;overflow:visible;padding:14px 10px}.journey-head{display:block}.journey-head h2{font-size:20px}.journey-head p{font-size:10px}.journey-switcher{margin-top:9px}.journey-switcher .part-tab{flex:1;min-width:0}.journey-note{font-size:9px}.journey-tunnel{height:390px}.journey-nodes{left:0;right:0;top:72px;height:285px;display:grid;grid-template-columns:1fr 1fr;gap:18px 30px;padding:0 38px}.journey-node{width:auto;min-width:0}.journey-node:before{left:50%;transform:translateX(-50%)}.node-number{left:calc(50% - 42px)}.node-label{margin-top:10px}.unit-ribbon{padding:7px 13px 7px 9px}.ribbon-a{left:12px;top:12px}.ribbon-b{left:12px;bottom:14px}.tunnel-road{left:22%;right:22%;top:105px;width:56%;height:220px;background:transparent;border:0;box-shadow:none;transform:none}.tunnel-road:before{inset:0;border:9px solid #d6c394;border-radius:45%;border-left-color:transparent;border-right-color:transparent;transform:rotate(7deg)}.tunnel-road:after{display:none}.road-glow{display:none}.journey-start{left:10px;bottom:16px}.journey-goal{right:10px;bottom:13px}.tunnel-caption{bottom:56px;max-width:84%;font-size:8px}.tunnel-arrow{top:auto;bottom:12px;transform:none}.tunnel-prev{left:72px}.tunnel-next{right:72px}}
/* V10 FIX: let the curriculum tunnel extend the page instead of being clipped at the viewport bottom. */
.journey-curriculum{min-height:385px;overflow:visible}
.journey-tunnel{min-height:292px}
/* V10: full curriculum tunnel + unit detail, without the standalone quiz card. */
.journey-track{position:absolute;left:9%;right:9%;top:30%;height:155px;display:flex;align-items:center;justify-content:space-between;gap:22px;z-index:5;overflow-x:auto;overflow-y:visible;scroll-behavior:smooth;padding:0 12px 8px;scrollbar-width:none}.journey-track::-webkit-scrollbar{display:none}.journey-track .journey-node{flex:0 0 122px}.journey-track .journey-node:after{content:"";position:absolute;right:-35px;top:25px;width:48px;border-top:4px dotted rgba(255,255,255,.72);z-index:-2}.journey-track .journey-node:last-child:after{display:none}.unit-modal{width:min(620px,92vw);border:0;border-radius:30px;padding:0;background:linear-gradient(180deg,#fffdf9,#f4f8ee);color:#173f64;box-shadow:0 28px 80px rgba(27,61,66,.3)}.unit-modal::backdrop{background:rgba(17,48,65,.46);backdrop-filter:blur(5px)}.unit-modal-hero{display:flex;gap:16px;align-items:center;padding:28px 30px 18px;background:linear-gradient(135deg,#e7f7ee,#eef7ff);border-bottom:1px solid rgba(55,98,111,.1)}.unit-big-icon{width:76px;height:76px;border-radius:24px;display:grid;place-items:center;font-size:42px;background:rgba(255,255,255,.85);box-shadow:0 8px 20px rgba(48,88,87,.12)}.unit-modal-hero h2{margin:4px 0;font-size:25px}.unit-modal-hero p{margin:0;font-size:11px;color:#71818a}.unit-route{padding:18px 30px;display:grid;gap:10px}.unit-route-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:17px;background:#f8faf5;border:1px solid #e6ebe1}.unit-route-item span{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#dcefe5;color:#28785e;font-weight:800}.unit-route-item b{display:block;font-size:13px}.unit-route-item small{display:block;font-size:9px;color:#84918d}.unit-route-item.active{border-color:#8ac8af;background:#eef9f3}.unit-modal-actions{display:flex;align-items:center;justify-content:space-between;padding:15px 30px 24px;border-top:1px solid rgba(55,98,111,.1)}.unit-modal-actions>span{font-size:11px;color:#5f786d}.unit-modal .modal-close{position:absolute;left:15px;top:13px;z-index:3;width:34px;height:34px;border-radius:50%;background:#fff;color:#38546a;box-shadow:0 3px 10px rgba(0,0,0,.08)}
@media(max-width:760px){.journey-track{left:4%;right:4%;top:24%;height:230px;display:flex;align-items:center;gap:32px}.journey-track .journey-node{flex-basis:130px}.journey-track .journey-node:after{right:-45px;width:58px}.unit-modal-hero{padding:24px 20px 15px}.unit-route{padding:15px 20px}.unit-modal-actions{padding:12px 20px 20px}}
.lesson-question{padding:8px 4px 16px;text-align:center}.lesson-question span{display:inline-block;padding:5px 10px;border-radius:14px;background:#eef6ff;color:#47729a;font-size:10px}.lesson-question h3{margin:12px 0 0;font-size:18px;color:#173f64}.quiz-answers button:disabled{cursor:default;opacity:.9}.unit-modal-actions button:disabled{opacity:.45;cursor:not-allowed}.unit-route-item small{line-height:1.7}
.guided-lesson{margin-top:18px}.guided-progress{margin-bottom:14px}.guided-progress>span{display:block;text-align:center;font-size:11px;color:#6b7d8d;margin-bottom:7px}.guided-progress>div{height:8px;background:#e7e2d8;border-radius:20px;overflow:hidden}.guided-progress i{display:block;height:100%;background:linear-gradient(90deg,#56b78d,#4b93d4);border-radius:20px;transition:.3s}.guided-head{display:flex;align-items:center;gap:13px;background:linear-gradient(135deg,#eef8f4,#eef5ff);border-radius:20px;padding:13px 16px;margin-bottom:10px}.guided-head>span{font-size:39px}.guided-head small{color:#5b7183;font-size:10px;font-weight:800}.guided-head h3{margin:2px 0 0;font-size:20px;color:#183e62}.guided-card{background:#fff;border:1px solid #ebe4d8;border-radius:22px;padding:18px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.8)}.guided-card>p{line-height:2;font-size:14px;margin:0}.guided-examples{display:grid;gap:8px;margin-top:15px}.guided-examples>div{display:flex;align-items:flex-start;gap:9px;padding:9px 11px;border-radius:14px;background:#f8f6f0}.guided-examples b{min-width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#5c9bd1;color:#fff;font-size:11px}.guided-examples span{font-size:12px;line-height:1.8}.guided-note{margin-top:13px;padding:10px 12px;border-radius:13px;background:#fff5d9;color:#795f27;font-size:12px;font-weight:700}.guided-nav{display:flex;justify-content:space-between;gap:10px;margin-top:14px}.guided-nav button:first-child{border-radius:22px;padding:9px 18px;background:#eeeae2;color:#51677a;font-weight:800}.guided-nav button:disabled{opacity:.4;cursor:not-allowed}.guided-question{font-size:17px!important;font-weight:800;text-align:center!important;line-height:1.8!important;margin-bottom:15px!important;color:#173f64}.guided-complete{margin-top:14px;padding:13px;border-radius:16px;background:#e5f6ea;text-align:center;color:#26704b;font-weight:800;font-size:13px}@media(max-width:760px){.guided-head h3{font-size:17px}.guided-card{padding:14px}.guided-card>p{font-size:13px}.guided-examples span{font-size:11px}.guided-nav .primary{padding:9px 15px}}

/* Balanced palette refresh: medium contrast, less white, clearer lesson typography */
:root{
  --ink:#193a3d;
  --ink-soft:#496466;
  --teal:#176b67;
  --teal-2:#2f8d84;
  --teal-soft:#dceee9;
  --cream:#eee9dc;
  --paper:#f4f0e7;
  --paper-2:#e9e5da;
  --blue:#3e718d;
  --gold:#b27a28;
  --line:#c8c9bd;
}
html,body{color:var(--ink);background:var(--cream)}
.scene{background:linear-gradient(180deg,#dfe8e1 0%,#e9e6db 54%,#d7ded0 100%)}
.sun-glow{background:rgba(235,211,137,.28)}
.cloud{background:rgba(255,255,255,.42)}
.brand-title{color:#174f50;text-shadow:0 2px 0 rgba(255,255,255,.45)}
.brand-subtitle{color:#426365}
.icon-btn,.menu-btn,.points-pill,.profile{background:rgba(247,244,235,.93);border-color:rgba(52,91,88,.18);box-shadow:0 6px 16px rgba(35,70,67,.12);color:var(--ink)}
.profile-copy small em{background:var(--teal)}
.avatar{background:#dce9df}
.hero{background:linear-gradient(100deg,#ece5d9,#e1ece5);border-color:rgba(255,255,255,.55)}
.journey-art{background:linear-gradient(#b9d5d6,#dfe5c9)}
.journey-copy h1,.journey-copy p{color:var(--ink)}
.quick-card{border-color:rgba(78,99,91,.15);box-shadow:0 10px 24px rgba(49,73,69,.13)}
.games{background:#e7e0ed}.quiz{background:#e0ebe2}
.purple-btn,.pink{background:linear-gradient(135deg,#765f91,#66547d)}
.blue,.primary{background:linear-gradient(135deg,#367f86,#286b70)}
.green-btn{background:linear-gradient(135deg,#4d947b,#3c806c)}
.right-rail .progress-card,.right-rail .streak-card,.right-rail .achievement-card,.right-rail .quote-card{background:#e9e5da;border-color:rgba(75,91,82,.16);box-shadow:0 9px 22px rgba(48,68,64,.12)}
.ring{background:conic-gradient(#2e8278 0 75%,#c9cec5 75%)}
.ring:before{background:#e9e5da}
.lesson-card{background:#ebe7dc;border-color:rgba(77,91,82,.15);box-shadow:0 12px 28px rgba(44,67,64,.14)}
.lesson-art{background:linear-gradient(135deg,#c8dedd,#e8d8b9)}
.curriculum{background:rgba(218,217,198,.76)}
.journey-node{color:var(--ink)}
.journey-node:before{background:#e8e6dc;border-color:#5b9c91}
.journey-node.locked:before{background:#d8d9d2;border-color:#a3aaa5}
.node-label{background:#e9e6dc;color:var(--ink)}
.tunnel-arrow{background:#e7e5db;color:#24595b}
.tunnel-caption{background:rgba(35,73,74,.84)}
.modal,.unit-modal{background:linear-gradient(180deg,#eee9df,#e5e6dc);color:var(--ink)}
.modal::backdrop,.unit-modal::backdrop{background:rgba(28,57,58,.54)}
.modal-close{background:#dcded5;color:#284c4e}
.interactive-box{background:#e5e5dc;box-shadow:inset 0 0 0 1px #c9cdc3}
.sentence button,.quiz-answers button{background:#d9e1de;color:#244d50}
.sentence button.selected{border-color:#3b8b83;background:#d1e4df}
.answer-types button{background:#dce5df;color:#28575a}
.quiz-answers button.correct{background:#cfe6d5;border-color:#5c9b72}
.quiz-answers button.wrong{background:#ead2cf;border-color:#b76f67}
.word-hunt{background:linear-gradient(#c9dedc,#dedfca)}
.hunt-word{background:#e9e6dc;color:var(--ink)}
.guided-progress>div{background:#cfd3ca}
.guided-progress i{background:linear-gradient(90deg,#3d8f83,#477b91)}
.guided-head{background:linear-gradient(135deg,#dbe9e3,#dde7e9)}
.guided-head small,.guided-head h3{color:var(--ink)}
.guided-card{background:#e7e5dc;border-color:#c9ccc2;box-shadow:none}
.guided-card>p,.guided-examples span{color:#263f41}
.guided-examples>div{background:#dedfd7}
.guided-examples b{background:#477e8d}
.guided-note{background:#eadfbd;color:#705322}
.guided-nav button:first-child{background:#d8d9d2;color:#36595a}
.guided-question{color:var(--ink)!important}
.guided-complete{background:#d4e8d9;color:#276247}
.lesson-question span{background:#d8e5e3;color:#356b6d}
.lesson-question h3{color:var(--ink)}
.unit-modal-hero{background:linear-gradient(135deg,#dceae4,#e1e7e4)}
.unit-big-icon{background:#e7e5dc}
.unit-modal-hero h2{color:var(--ink)}
.unit-modal-hero p,.unit-route-item small{color:#5a7070}
.unit-route-item{background:#dedfd7;border-color:#c7cbc1}
.unit-route-item span{background:#cfe3dd;color:#286a64}
.unit-route-item.active{border-color:#6da69c;background:#d8e9e4}
.unit-modal-actions{border-top-color:#c9ccc2}
.unit-modal-actions>span{color:#55706e}
.lesson-text{border-left-color:#c5c8bf}
.eyebrow{color:#2e6f73}
.drop-preview span{background:#dedfd7;border-color:#b9beb7}
.tips,.tip,.quick-info{background:#e4e2d7}

/* Lesson typography: darker, larger, and easier to read on every step. */
.guided-card>p{font-size:15px;line-height:2.15;font-weight:500}
.guided-examples span{font-size:13px;line-height:2;font-weight:600}
.guided-head h3{font-size:21px;font-weight:800}
.guided-head small{font-size:11px}
.guided-question{font-size:18px!important;line-height:2!important}
.lesson-question h3{font-size:20px;line-height:1.9}
.unit-route-item b{font-size:14px;line-height:1.7}
.unit-route-item small{font-size:10px;line-height:1.8}
.modal p,.unit-modal p{line-height:2;font-size:14px}
.question{font-size:20px;line-height:2;color:var(--ink)}
.quiz-answers button{font-size:14px;line-height:1.8}
.interactive-box{font-size:14px;line-height:2}

@media(max-width:760px){
  .guided-card>p{font-size:14px;line-height:2.05}
  .guided-examples span{font-size:12px;line-height:1.9}
  .guided-head h3{font-size:18px}
  .guided-question{font-size:16px!important}
  .lesson-question h3{font-size:18px}
  .question{font-size:18px}
}

/* Student menu utilities: real destinations for achievements, library and settings. */
.utility-modal{width:min(680px,92vw);max-height:86vh;overflow:auto;padding:24px;background:linear-gradient(145deg,#fbfaf4,#eef7f2);border:1px solid rgba(36,92,76,.14);border-radius:28px;box-shadow:0 24px 70px rgba(25,62,55,.24);color:#183c38}
.utility-modal::backdrop{background:rgba(19,48,44,.42);backdrop-filter:blur(3px)}
.utility-head{display:flex;align-items:center;gap:16px;padding:6px 4px 18px;border-bottom:1px solid rgba(42,102,83,.12)}
.utility-head>span{width:58px;height:58px;display:grid;place-items:center;border-radius:18px;background:#d9eee6;font-size:30px;flex:none}
.utility-head h2{margin:2px 0 4px;font-size:25px;color:#194f43}.utility-head p{margin:0;color:#667b75;font-size:13px}
.utility-stat{display:flex;align-items:baseline;gap:10px;margin:18px 0;padding:16px 18px;border-radius:18px;background:#e5f2ec;border:1px solid rgba(45,116,92,.12)}
.utility-stat strong{font-size:34px;color:#168064}.utility-stat span{font-size:13px;color:#61766f}
.utility-list{display:grid;gap:9px}.utility-item{display:flex;align-items:center;gap:12px;width:100%;padding:13px 15px;border:1px solid rgba(51,105,88,.12);border-radius:15px;background:#fffdf8;color:#244d45;text-align:right;box-sizing:border-box}
.library-item{cursor:pointer;font:inherit}.library-item.ready:hover{transform:translateY(-1px);border-color:#65b497;background:#f1faf6}.library-item>span:first-child{font-size:21px}.library-item b,.library-item small{display:block}.library-item small{margin-top:2px;color:#778782;font-size:11px}.muted{opacity:.62;background:#f3f4ef}
.settings-list{display:grid;gap:10px;margin:18px 0}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 16px;border:1px solid rgba(51,105,88,.12);border-radius:17px;background:#fffdf8}.setting-row b,.setting-row small{display:block}.setting-row small{margin-top:4px;color:#778782;font-size:11px}.setting-toggle{border:1px solid #b9cbc4;background:#edf2ef;color:#536d65;border-radius:13px;padding:8px 13px;font-weight:800;cursor:pointer}.setting-toggle.on{background:#d9eee6;border-color:#73b79f;color:#17745e}.utility-note{padding:13px 15px;border-radius:16px;background:#fff1d8;color:#80612d;font-size:12px;line-height:1.9}
.focus-mode .guided-card,.focus-mode .lesson-question,.focus-mode .interactive-box{box-shadow:0 0 0 2px rgba(39,145,111,.13),0 10px 26px rgba(35,94,76,.09)}
@media(max-width:650px){.utility-modal{padding:18px}.utility-head h2{font-size:21px}.setting-row{align-items:flex-start}.setting-toggle{flex:none}}

/* Black + antique-gold palette inspired by the supplied reference image. */
:root{
  --ink:#f2eee6;
  --ink-soft:#c5bcac;
  --teal:#b79a63;
  --teal-2:#d2b77d;
  --teal-soft:#2b2822;
  --cream:#11100f;
  --paper:#181715;
  --paper-2:#211f1b;
  --blue:#c9ad74;
  --gold:#c6a15b;
  --line:#3a352c;
}
html,body{color:var(--ink);background:#0b0b0a}
body{background:linear-gradient(180deg,#0b0b0a 0%,#12110f 55%,#0c0c0b 100%)}
.scene{background:linear-gradient(180deg,#171613 0%,#12110f 55%,#0d0d0c 100%)}
.sun-glow{background:rgba(198,161,91,.10)}
.cloud{background:rgba(255,255,255,.035)}
.brand-title{color:#ead7ad;text-shadow:0 2px 12px rgba(0,0,0,.45)}
.brand-subtitle{color:#aaa092}
.icon-btn,.menu-btn,.points-pill,.profile{background:rgba(25,24,21,.94);border-color:rgba(198,161,91,.28);box-shadow:0 8px 22px rgba(0,0,0,.28);color:#eee8dc}
.profile-copy small em{background:#b38c4c;color:#0e0d0b}
.avatar{background:#26241f}
.hero{background:linear-gradient(115deg,#191815,#24211b);border-color:rgba(198,161,91,.24);box-shadow:0 12px 34px rgba(0,0,0,.24)}
.journey-art{background:linear-gradient(135deg,#27231c,#171613)}
.journey-copy h1,.journey-copy p{color:#f0eadf}
.quick-card{background:#191815;border-color:rgba(198,161,91,.16);box-shadow:0 12px 28px rgba(0,0,0,.28)}
.games{background:#201d22}.quiz{background:#18201c}
.purple-btn,.pink{background:linear-gradient(135deg,#8d7043,#6f542e);color:#fff8eb}
.blue,.primary{background:linear-gradient(135deg,#c3a260,#9a783d);color:#17130d}
.green-btn{background:linear-gradient(135deg,#7f8b5c,#536340);color:#fff8eb}
.right-rail .progress-card,.right-rail .streak-card,.right-rail .achievement-card,.right-rail .quote-card{background:#171614;border-color:rgba(198,161,91,.17);box-shadow:0 10px 26px rgba(0,0,0,.28)}
.ring{background:conic-gradient(#c6a15b 0 75%,#3a362e 75%)}
.ring:before{background:#171614}
.lesson-card{background:#171614;border-color:rgba(198,161,91,.18);box-shadow:0 14px 32px rgba(0,0,0,.3)}
.lesson-art{background:linear-gradient(135deg,#302a20,#1c1915)}
.curriculum{background:rgba(28,26,22,.9)}
.journey-node{color:#eee7db}
.journey-node:before{background:#24211b;border-color:#a98a50}
.journey-node.locked:before{background:#1c1b18;border-color:#514a3e}
.node-label{background:#201e1a;color:#eee7db}
.tunnel-arrow{background:#24211c;color:#d1b77e}
.tunnel-caption{background:rgba(15,14,12,.9)}
.modal,.unit-modal{background:linear-gradient(145deg,#211f1b,#141311);color:#eee8dd;border-color:rgba(198,161,91,.2)}
.modal::backdrop,.unit-modal::backdrop{background:rgba(0,0,0,.72)}
.modal-close{background:#2a2721;color:#dfc48c}
.interactive-box{background:#1d1b17;box-shadow:inset 0 0 0 1px #39342b}
.sentence button,.quiz-answers button{background:#24221e;color:#eee8dd;border-color:#403a30}
.sentence button.selected{border-color:#c6a15b;background:#332a1d}
.answer-types button{background:#24221e;color:#eee8dd;border-color:#403a30}
.quiz-answers button.correct{background:#263127;border-color:#6e8a62}
.quiz-answers button.wrong{background:#322522;border-color:#9a6258}
.word-hunt{background:linear-gradient(#29261f,#1b1a16)}
.hunt-word{background:#24221e;color:#eee8dd}
.guided-progress>div{background:#353129}
.guided-progress i{background:linear-gradient(90deg,#b68d4d,#d6bb7f)}
.guided-head{background:linear-gradient(135deg,#25221d,#1b1a17);border:1px solid rgba(198,161,91,.13)}
.guided-head small,.guided-head h3{color:#f0e8d9}
.guided-card{background:#191816;border-color:#3a352c;box-shadow:0 10px 26px rgba(0,0,0,.18)}
.guided-card>p,.guided-examples span{color:#e6dfd2}
.guided-examples>div{background:#211f1b;border:1px solid #363128}
.guided-examples b{background:#a27e45;color:#fff7e9}
.guided-note{background:#2d271b;color:#dfc083;border:1px solid #5a4930}
.guided-nav button:first-child{background:#24221e;color:#d9d0c0;border-color:#3d382f}
.guided-question{color:#eadfcf!important}
.guided-complete{background:#243025;color:#b7cf9e;border:1px solid #53664b}
.lesson-question span{background:#2a2923;color:#d6b875}
.lesson-question h3{color:#eee7da}
.unit-modal-hero{background:linear-gradient(135deg,#28241d,#1a1915)}
.unit-big-icon{background:#26231e}
.unit-modal-hero h2{color:#f0e7d7}
.unit-modal-hero p,.unit-route-item small{color:#b8afa1}
.unit-route-item{background:#211f1b;border-color:#39342c}
.unit-route-item span{background:#332b1d;color:#d2b06d}
.unit-route-item.active{border-color:#a7844b;background:#29241c}
.unit-modal-actions{border-top-color:#39342c}
.unit-modal-actions>span{color:#b9ae9d}
.lesson-text{border-left-color:#5b4b32}
.eyebrow{color:#d0ad68}
.drop-preview span{background:#24221e;border-color:#4a4337}
.tips,.tip,.quick-info{background:#211f1b;border-color:#39342c;color:#ddd4c6}

.utility-modal{background:linear-gradient(145deg,#24211c,#141311);border-color:rgba(198,161,91,.24);box-shadow:0 24px 70px rgba(0,0,0,.58);color:#eee7da}
.utility-modal::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(3px)}
.utility-head{border-bottom-color:rgba(198,161,91,.16)}
.utility-head>span{background:#30291d;color:#d2b06c}
.utility-head h2{color:#ead7ad}.utility-head p{color:#aaa092}
.utility-stat{background:#29231a;border-color:rgba(198,161,91,.2)}
.utility-stat strong{color:#d0aa63}.utility-stat span{color:#b7ad9e}
.utility-item{background:#1d1b18;border-color:rgba(198,161,91,.14);color:#e8e0d3}
.library-item.ready:hover{border-color:#a88951;background:#28231b}
.library-item small{color:#a79d8e}.muted{opacity:.55;background:#191816}
.settings-list{margin:18px 0}.setting-row{background:#1d1b18;border-color:rgba(198,161,91,.14)}
.setting-row small{color:#a79d8e}.setting-toggle{border-color:#514938;background:#28251f;color:#c8bdac}
.setting-toggle.on{background:#332b1e;border-color:#a88a52;color:#e0bf7b}
.utility-note{background:#2b2419;color:#d1b16e;border-color:#59482f}
.focus-mode .guided-card,.focus-mode .lesson-question,.focus-mode .interactive-box{box-shadow:0 0 0 2px rgba(198,161,91,.12),0 12px 28px rgba(0,0,0,.25)}

/* Keep Arabic body copy readable against the darker surfaces. */
.guided-card>p{font-weight:500}.question{color:#eee6d8}.quiz-answers button{font-size:14px}

/* Final visual cleanup: unify every remaining blue/green surface with the black + gold identity. */
.scene{background:linear-gradient(180deg,#090909 0%,#11100f 48%,#0b0b0a 100%) !important}
.sun-glow{background:rgba(198,161,91,.08) !important}
.cloud,.mountain,.ground,.tree,.flowers{opacity:.08 !important}
.ground{background:radial-gradient(ellipse at 50% 0,#3a3020 0,#1b1813 65%,#0c0c0b 100%) !important}
.tree i{background:radial-gradient(circle at 40% 30%,#a88952,#4b3920) !important}

/* Header and student controls */
.brand-title{color:#e6c47a !important;text-shadow:0 2px 12px rgba(0,0,0,.65) !important}
.brand-subtitle{color:#b9ad98 !important}
.icon-btn,.menu-btn,.points-pill,.profile{background:#151412 !important;border-color:rgba(198,161,91,.30) !important;color:#eee7da !important}
.profile-copy small em{background:#b18a48 !important;color:#0d0c0a !important}
.avatar{background:#28231b !important}

/* Main hero: remove the remaining pastel/blue look. */
.hero{background:linear-gradient(115deg,#141311,#211d17) !important;border-color:rgba(198,161,91,.25) !important}
.journey-art{background:linear-gradient(135deg,#201c16,#0f0f0e) !important}
.journey-art:after{background:#8f6d36 !important;box-shadow:0 0 0 13px rgba(198,161,91,.07) !important}
.sign{color:#d4b36e !important}
.journey-copy h1,.journey-copy p{color:#eee7da !important}
.pink,.blue,.primary{background:linear-gradient(135deg,#d0a552,#9c7639) !important;color:#17130d !important;box-shadow:0 6px 0 rgba(80,57,22,.35) !important}

/* Quick cards */
.quick-card{background:#171614 !important;border-color:rgba(198,161,91,.18) !important;color:#eee7da !important}
.games,.quiz{background:#171614 !important}
.purple-btn,.green-btn{background:linear-gradient(135deg,#b9904b,#76572c) !important;color:#fff6e5 !important}

/* Right rail */
.progress-card,.streak-card,.achievement-card,.quote-card{background:#151412 !important;border-color:rgba(198,161,91,.17) !important;color:#eee7da !important}
.achievement-card{background:linear-gradient(135deg,#1c1915,#161513) !important}
.help-dot{background:#28241d !important;color:#d8bd82 !important}
.ring{background:conic-gradient(#c6a15b 0 75%,#34302a 75%) !important}
.ring:before{background:#151412 !important}
.ring span,.great{color:#eee7da !important}
.days i{background:#92713b !important;color:#fff7e9 !important}
.day-labels{color:#a79e91 !important}
.quote-card p{color:#ded5c7 !important}

/* Today's lesson card */
.lesson-card{background:#151412 !important;border-color:rgba(198,161,91,.18) !important}
.lesson-art{background:linear-gradient(135deg,#28231b,#151412) !important}
.lesson-art:before{background:rgba(198,161,91,.07) !important}
.lesson-art label{background:#a98242 !important;color:#fff6e5 !important}
.lesson-text{border-left-color:#51452f !important}
.eyebrow{color:#d1ad67 !important}
.activity-preview{color:#eee7da !important}
.chip.purple,.chip.blue,.chip.green,.chip.orange{background:linear-gradient(135deg,#a98242,#71542c) !important;color:#fff7e8 !important}
.drop-preview span{background:#1e1b17 !important;border-color:#625235 !important;color:#ddd4c6 !important}

/* Curriculum: the blue/green map was the main leftover. Make it fully black + gold. */
.journey-curriculum{background:linear-gradient(180deg,#171513,#10100f) !important;border-color:rgba(198,161,91,.20) !important;box-shadow:0 12px 30px rgba(0,0,0,.35) !important}
.journey-kicker,.journey-head h2{color:#d6b36b !important}
.journey-head p,.journey-note{color:#aaa092 !important}
.journey-switcher .part-tab{background:#1d1a16 !important;border-color:rgba(198,161,91,.18) !important;color:#eee7da !important;box-shadow:none !important}
.journey-switcher .part-tab small{color:#9f9587 !important}
.journey-switcher .part-tab.active{background:linear-gradient(135deg,#b88e49,#795a2e) !important;border-color:#c6a15b !important;color:#17130d !important}
.journey-switcher .part-tab.active small{color:#302311 !important}
.journey-tunnel{background:radial-gradient(circle at 50% 15%,#242018 0%,#151412 46%,#0c0c0b 100%) !important;box-shadow:inset 0 0 50px rgba(0,0,0,.45) !important}
.tunnel-sky{background:transparent !important}
.t-cloud{background:rgba(198,161,91,.07) !important}
.t-hill{background:rgba(198,161,91,.05) !important}
.journey-tunnel:after{background:radial-gradient(ellipse at 50% 0,#5b482b 0,#302719 42%,#191611 72%,#0d0d0c 100%) !important}
.tunnel-road{background:#806235 !important;box-shadow:0 8px 0 rgba(198,161,91,.10),0 -3px 0 rgba(198,161,91,.15) !important}
.tunnel-road:before,.tunnel-road:after{border-color:rgba(245,223,171,.35) !important}
.road-glow{background:rgba(235,202,128,.25) !important}
.unit-ribbon{color:#fff6e5 !important}
.ribbon-a,.ribbon-b{background:linear-gradient(135deg,#b88d48,#75572d) !important}
.journey-node{color:#eee7da !important}
.journey-node:before{background:#211e19 !important;border-color:#b28b4b !important;box-shadow:0 7px 15px rgba(0,0,0,.35) !important}
.journey-node.locked:before{background:#171614 !important;border-color:#4d4539 !important}
.journey-node.done:before{background:#2a241a !important;border-color:#b28b4b !important}
.node-number,.journey-node.done .node-number{background:#a47d3d !important;color:#fff7e8 !important;border-color:#171411 !important}
.node-label{background:#1d1a17 !important;color:#eee7da !important;border:1px solid rgba(198,161,91,.12) !important}
.node-label small{color:#a79e91 !important}
.journey-node.current .node-label{border-color:#b28b4b !important}
.tunnel-arrow{background:#211e19 !important;color:#d4b36d !important;border:1px solid rgba(198,161,91,.18) !important}
.tunnel-caption{background:rgba(12,11,10,.88) !important;color:#e3d8c6 !important;border:1px solid rgba(198,161,91,.15) !important}
.journey-start small,.journey-goal small{color:#bcae98 !important}
.journey-goal{background:#1b1916 !important;color:#d6b36b !important}
.journey-goal b{color:#bcae98 !important}

/* Side menu: remove the blue panel and make every item readable. */
.side-menu{background:linear-gradient(180deg,#0d0d0c,#171512 52%,#0c0c0b) !important;color:#eee7da !important;border-left:1px solid rgba(198,161,91,.18);box-shadow:-18px 0 40px rgba(0,0,0,.55) !important}
.menu-head h2{color:#e2c17b !important}
.menu-head button{background:#26221b !important;color:#e0c181 !important}
.side-menu nav{gap:5px !important}
.side-menu nav button{color:#eee7da !important;background:transparent !important;border:1px solid transparent !important}
.side-menu nav button:hover,.side-menu nav button.active{background:linear-gradient(135deg,#a98040,#76572d) !important;color:#17130d !important;border-color:#c6a15b !important}
.menu-tip{background:#1b1916 !important;border:1px solid rgba(198,161,91,.16) !important;color:#dfd4c3 !important}
.menu-tip small{color:#aaa092 !important}
.overlay{background:rgba(0,0,0,.62) !important}

/* Modals, exercises and lesson pages: no stray blue text/backgrounds. */
.modal,.unit-modal{background:linear-gradient(145deg,#211e19,#12110f) !important;color:#eee7da !important;border-color:rgba(198,161,91,.20) !important}
.modal-close,.unit-modal .modal-close{background:#29251e !important;color:#d9bb78 !important}
.interactive-box,.guided-card,.guided-head,.lesson-question,.quiz-answers button,.sentence button,.answer-types button,.hunt-word{background:#1b1916 !important;color:#eee7da !important;border-color:#453b2c !important}
.guided-head{background:linear-gradient(135deg,#27231d,#1a1815) !important}
.guided-head small,.guided-head h3,.guided-card>p,.guided-examples span,.guided-question,.question,.lesson-question h3{color:#eee7da !important}
.guided-progress>div,.quiz-progress{background:#332f29 !important}
.guided-progress i,.quiz-progress i{background:linear-gradient(90deg,#a98040,#d4b36e) !important}
.guided-examples>div{background:#211e19 !important;border-color:#3b3429 !important}
.guided-examples b{background:#9e783d !important;color:#fff7e8 !important}
.guided-note,.utility-note{background:#2c2418 !important;color:#d9b975 !important;border-color:#5a472b !important}
.guided-nav button:first-child{background:#24211c !important;color:#cfc4b4 !important;border-color:#453d31 !important}
.guided-complete{background:#29291f !important;color:#c7c18e !important;border-color:#625a38 !important}
.lesson-question span{background:#2b241a !important;color:#d4b16b !important}
.unit-modal-hero{background:linear-gradient(135deg,#28231b,#181613) !important}
.unit-big-icon{background:#28231c !important}
.unit-modal-hero h2{color:#eee7da !important}
.unit-modal-hero p,.unit-route-item small{color:#aaa092 !important}
.unit-route-item{background:#211e1a !important;border-color:#3d352a !important;color:#eee7da !important}
.unit-route-item span{background:#33291c !important;color:#d2ae68 !important}
.unit-route-item.active{border-color:#a98243 !important;background:#29231a !important}
.unit-modal-actions{border-top-color:#3b3328 !important}
.unit-modal-actions>span{color:#aaa092 !important}
.utility-modal{background:linear-gradient(145deg,#24211c,#141311) !important;color:#eee7da !important}
.utility-head h2{color:#ead7ad !important}.utility-head p{color:#aaa092 !important}
.utility-item,.setting-row{background:#1d1b18 !important;color:#e8e0d3 !important;border-color:rgba(198,161,91,.14) !important}
.utility-stat{background:#29231a !important}.utility-stat strong{color:#d0aa63 !important}.utility-stat span,.setting-row small,.library-item small{color:#a79d8e !important}
.setting-toggle{background:#28251f !important;color:#c8bdac !important;border-color:#514938 !important}.setting-toggle.on{background:#332b1e !important;border-color:#a88a52 !important;color:#e0bf7b !important}
.toast{background:#211e19 !important;color:#f0e6d5 !important;border:1px solid rgba(198,161,91,.22) !important}


/* BLACK + GOLD V2: hard override for the real UI */
html,body{background:#0b0b0b!important;color:#f1eadc!important}
body{color-scheme:dark!important}
.scene{background:#0b0b0b!important;background-image:none!important;color:#f1eadc!important}
/* eliminate the old landscape/green decorative layer */
.sun-glow,.cloud,.mountain,.ground,.tree,.flowers{display:none!important}
/* all common text */
.dashboard,.dashboard h1,.dashboard h2,.dashboard h3,.dashboard h4,.dashboard p,.dashboard span,.dashboard b,.dashboard strong,.dashboard small,.dashboard label{color:#f1eadc}
.brand-title,.journey-kicker,.journey-head h2,.eyebrow,.card-heading h3,.streak-card h3,.achievement-card h3,.quote-card h3,.section-title h2{color:#d6ae62!important}
.brand-subtitle,.journey-head p,.journey-note,.day-labels,.right-rail p,.right-rail small{color:#b9ad9a!important}
/* top bar */
.topbar{background:#0b0b0b!important;border-bottom:1px solid #2e281e!important}
.icon-btn,.menu-btn,.points-pill,.profile{background:#151412!important;color:#f1eadc!important;border:1px solid #4b3b24!important;box-shadow:none!important}
.points-pill strong,.points-pill small,.profile-copy b,.profile-copy strong{color:#f1eadc!important}
.profile-copy small{color:#b9ad9a!important}.profile-copy small em{background:#b28a48!important;color:#111!important}
/* homepage cards */
.hero,.lesson-card,.quick-card,.progress-card,.streak-card,.achievement-card,.quote-card,.curriculum{background:#151412!important;border:1px solid #3b3020!important;box-shadow:0 10px 28px rgba(0,0,0,.35)!important}
.hero{background:linear-gradient(120deg,#121211,#1b1814)!important}
.journey-art,.lesson-art{background:#1b1813!important}
.journey-art:after{background:#795b2d!important;box-shadow:none!important}
.journey-copy h1{color:#f4ede1!important}.journey-copy p{color:#c5b9a7!important}
.primary,.pink,.blue{background:linear-gradient(135deg,#d2aa5c,#987238)!important;color:#17120b!important}
.quick-card h2{color:#e6d4b0!important}.quick-card p{color:#b9ad9a!important}
.games,.quiz{background:#171614!important}
.purple-btn,.green-btn{background:linear-gradient(135deg,#b58b48,#795a2e)!important;color:#fff6e5!important}
/* right rail */
.ring{background:conic-gradient(#c6a15b 0 75%,#373129 75%)!important}.ring:before{background:#151412!important}.ring span,.great{color:#f1eadc!important}
.days i{background:#98763f!important;color:#fff8e8!important}.achievement-card{background:#171513!important}.badge{filter:none!important}
/* lesson preview */
.lesson-text{border-left-color:#4b3b27!important}.lesson-text h2{color:#f1eadc!important}.lesson-text p{color:#bfb4a3!important}
.chip.purple,.chip.blue,.chip.green,.chip.orange{background:#8f6c38!important;color:#fff7e8!important}
.drop-preview span{background:#1d1a16!important;border-color:#51412b!important;color:#eee5d6!important}
/* curriculum: completely remove old sky/green appearance */
.journey-curriculum{background:#12110f!important;color:#f1eadc!important;border-color:#4a3924!important}
.journey-tunnel{background:#0e0e0d!important;background-image:none!important;box-shadow:inset 0 0 45px rgba(0,0,0,.55)!important}
.journey-tunnel:after{background:#18140f!important}
.tunnel-sky,.t-cloud,.t-hill{background:none!important;display:none!important}
.tunnel-road{background:#76582d!important;box-shadow:0 8px 0 rgba(198,161,91,.10),0 -3px 0 rgba(198,161,91,.15)!important}
.journey-node,.journey-node b,.journey-node strong{color:#eee7da!important}.journey-node:before{background:#1e1b16!important;border-color:#b28b4b!important}.journey-node.locked:before{background:#131210!important;border-color:#4a4032!important}.journey-node.done:before{background:#292219!important;border-color:#b28b4b!important}
.node-label{background:#1b1916!important;color:#eee7da!important;border-color:#3d3222!important}.node-label small{color:#a99e8c!important}.node-number{background:#9d783d!important;color:#fff8e8!important;border-color:#15130f!important}
.journey-switcher .part-tab{background:#1a1815!important;color:#eee7da!important;border-color:#463724!important}.journey-switcher .part-tab small{color:#a99e8c!important}.journey-switcher .part-tab.active{background:linear-gradient(135deg,#b88e49,#795a2e)!important;color:#17130d!important;border-color:#c6a15b!important}.journey-switcher .part-tab.active small{color:#302311!important}
.tunnel-arrow{background:#1e1b17!important;color:#d4b36d!important}.tunnel-caption{background:#0c0c0b!important;color:#e3d8c6!important}
/* menu */
.side-menu{background:#0e0e0d!important;color:#f1eadc!important;border-left:1px solid #4a3924!important;box-shadow:-18px 0 40px rgba(0,0,0,.65)!important}
.menu-head h2{color:#d6ae62!important}.menu-head button{background:#211c16!important;color:#d6ae62!important}
.side-menu nav button,.side-menu nav button span{background:transparent!important;color:#f1eadc!important}
.side-menu nav button:hover,.side-menu nav button.active{background:linear-gradient(135deg,#a67f42,#75572e)!important;color:#17130d!important;border-color:#c6a15b!important}
.side-menu nav button:hover span,.side-menu nav button.active span{color:#17130d!important}
.menu-tip{background:#191714!important;border-color:#3d3020!important;color:#e1d6c5!important}.menu-tip small{color:#a99e8c!important}
.overlay{background:rgba(0,0,0,.70)!important}
/* dialogs and all lesson text */
.modal,.unit-modal,.utility-modal{background:#171512!important;color:#f1eadc!important;border-color:#4a3924!important}.modal::backdrop,.unit-modal::backdrop{background:rgba(0,0,0,.78)!important}
.modal h2,.unit-modal h2,.utility-modal h2{color:#f1eadc!important}.modal p,.unit-modal p,.utility-modal p{color:#bfb4a3!important}
.interactive-box,.guided-card,.guided-head,.lesson-question,.quiz-answers button,.sentence button,.answer-types button,.hunt-word{background:#1d1a16!important;color:#eee7da!important;border-color:#4b3d29!important}
.guided-head small,.guided-head h3,.guided-card>p,.guided-examples span,.guided-question,.question,.lesson-question h3{color:#eee7da!important}
.guided-progress>div,.quiz-progress{background:#373129!important}.guided-progress i,.quiz-progress i{background:#c6a15b!important}
.guided-examples>div{background:#211e19!important;border-color:#3d3428!important}.guided-examples b{background:#9e783d!important;color:#fff7e8!important}
.guided-note,.utility-note{background:#2a2117!important;color:#d9b975!important;border-color:#5a472b!important}
.quiz-answers button.correct{background:#292c20!important;border-color:#777b55!important}.quiz-answers button.wrong{background:#30221e!important;border-color:#8e5f53!important}
.utility-item,.setting-row{background:#1d1b18!important;color:#e8e0d3!important;border-color:#443724!important}.utility-item b,.setting-row b{color:#eee7da!important}.utility-stat{background:#292219!important}.utility-stat strong{color:#d0aa63!important}

/* Games redesign — Black & Gold, varied and readable */
.games-modal{width:min(1120px,95vw)!important;max-height:92vh;overflow:auto;padding:26px!important}
.games-page-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:4px 8px 18px;border-bottom:1px solid #3b3020}
.games-page-head h2{font-size:30px;margin:4px 0!important;color:#f3e7d1!important}.games-page-head p{margin:0!important}.games-big-icon{font-size:72px;filter:drop-shadow(0 8px 12px rgba(198,161,91,.18))}
.game-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}
.game-card-tab{min-height:185px;text-align:right;padding:17px;border-radius:18px;background:#11110f!important;color:#eee7da!important;border:1px solid #3f3322!important;display:flex;flex-direction:column;align-items:flex-start;transition:.2s;box-shadow:none!important}
.game-card-tab:hover{transform:translateY(-3px);border-color:#a98243!important}.game-card-tab.active{background:linear-gradient(145deg,#211b13,#151311)!important;border-color:#c6a15b!important;box-shadow:inset 0 0 0 1px rgba(198,161,91,.12)!important}
.game-card-icon{font-size:43px;margin-bottom:5px}.game-card-tab b{font-size:17px;color:#f1dfbb!important}.game-card-tab small{display:inline-block;background:#2b2318;color:#d4b16b!important;border-radius:12px;padding:2px 9px;margin:5px 0;font-size:10px}.game-card-tab em{font-style:normal;color:#a99e8c!important;font-size:11px;line-height:1.6}.game-card-tab strong{margin-top:auto;background:linear-gradient(135deg,#c49a50,#87652f);color:#17120b!important;border-radius:12px;padding:8px 13px;font-size:11px;width:100%;text-align:center}
.game-stage{min-height:290px;background:#0f0f0e;border:1px solid #3c3020;border-radius:20px;padding:18px}.game-play-head{display:flex;align-items:center;gap:12px;border-bottom:1px solid #332a1e;padding-bottom:12px;margin-bottom:14px}.game-play-head>span{font-size:38px}.game-play-head h3{margin:0;color:#e4c27c!important;font-size:21px}.game-play-head p{margin:2px 0 0;color:#aaa092!important;font-size:11px}.game-back{margin-right:auto;background:#211d17!important;color:#d9bb78!important;border:1px solid #4a3a25!important;border-radius:12px;padding:7px 13px}
.word-hunt{height:285px!important;background:radial-gradient(circle at 20% 20%,#242016,#11110f 65%)!important;border:1px solid #3d3020}.hunt-word{background:#1d1a16!important;color:#f1eadc!important;border:1px solid #806338!important;box-shadow:0 5px 14px rgba(0,0,0,.35)!important}.hunt-word:nth-child(3n){color:#d7b56d!important}.wrong-pop{animation:wrongPop .3s}.game-score{color:#e0c17c!important}.game-score span{color:#f4e6cb!important}
.type-game,.sentence-puzzle,.letters-game,.tf-game{max-width:760px;margin:0 auto;text-align:center}.game-big-word{font-size:54px;font-weight:800;color:#f2d59a;padding:24px}.type-options,.tf-options{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.type-options button,.tf-options button{min-width:140px;padding:13px 22px;border-radius:14px;background:#1c1915!important;color:#eee7da!important;border:1px solid #55432a!important}.type-options button:hover,.tf-options button:hover{background:#2a2217!important;border-color:#c09a55!important}.mini-progress{color:#9f927f;font-size:11px;margin-top:14px}.tf-question{font-size:22px;color:#eee7da;padding:30px 10px}.game-result{text-align:center;padding:35px 10px;color:#d6b36b}.game-result>strong{display:block;font-size:28px;color:#f1eadc;margin:5px}.game-result p{color:#aaa092;font-size:12px}.game-result .primary{margin-top:10px}
.target-sentence{min-height:64px;display:flex;justify-content:center;gap:8px;align-items:center;flex-wrap:wrap;margin:12px 0 22px}.target-sentence span{min-width:95px;padding:11px 14px;border:1px dashed #675333;border-radius:12px;color:#d6c7b3;background:#191714}.puzzle-words{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.puzzle-words button{padding:11px 20px;border-radius:13px;background:#2a2117!important;color:#e7d5b6!important;border:1px solid #7b5e32!important}.puzzle-words button:disabled{opacity:.25}
.letter-result{display:flex;justify-content:center;gap:8px;margin:22px 0}.letter-result span{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:#1d1a16;border:2px solid #806338;color:#e8d1a2;font-weight:800;font-size:20px}.letter-bubbles{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.letter-bubbles button{width:52px;height:52px;border-radius:50%;background:linear-gradient(145deg,#2b2318,#171411)!important;border:1px solid #8d6b37!important;color:#f0dfbe!important;font-size:19px;font-weight:800}.letter-bubbles button:disabled{opacity:.25}
.memory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:650px;margin:20px auto}.memory-card{height:90px;border-radius:16px;background:linear-gradient(145deg,#252017,#151311)!important;border:1px solid #66502e!important;color:#e8d1a2!important;font-size:25px}.memory-card.open{background:#302719!important;color:#f5e4c3!important}.memory-card.matched{background:#3a2d1b!important;border-color:#c6a15b!important;color:#f4d38d!important}
@keyframes wrongPop{50%{transform:scale(.9);border-color:#9c5b43}}
@media(max-width:800px){.game-tabs{grid-template-columns:repeat(2,1fr)}.games-page-head h2{font-size:24px}.games-big-icon{font-size:50px}.game-card-tab{min-height:170px}.memory-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.game-tabs{grid-template-columns:1fr}.games-modal{padding:17px!important}.game-card-tab{min-height:145px}.game-stage{padding:12px}.game-big-word{font-size:42px}}
/* مراحل الألعاب - Black & Gold */
.level-picker{max-width:760px;margin:22px auto 8px;text-align:center;padding:12px 4px}
.level-picker h4{margin:0;color:#f0d59b;font-size:24px}
.level-picker p{margin:7px 0 18px;color:#a99d8b;font-size:12px}
.level-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.level-btn{min-height:105px;border:1px solid #4b3a23!important;border-radius:18px!important;background:linear-gradient(145deg,#1c1915,#11110f)!important;color:#eee7da!important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;cursor:pointer;transition:.2s;box-shadow:none!important}
.level-btn b{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#292117;color:#d6ad5f;border:1px solid #76572d;font-size:20px}
.level-btn span{font-size:11px;color:#b8aa95}
.level-btn:hover{transform:translateY(-3px);border-color:#c39b51!important;box-shadow:0 8px 20px rgba(0,0,0,.3)!important}
.level-btn:hover b{background:#b7893e;color:#17120b}
.primary.gold{background:linear-gradient(135deg,#c49a50,#87652f)!important;color:#17120b!important;border-color:#c6a15b!important}
@media(max-width:700px){.level-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:480px){.level-grid{grid-template-columns:repeat(2,1fr)}.level-btn{min-height:90px}}

/* ================== روح وحركة المنصة ================== */
:root{--gold:#c6a15b;--gold-light:#ead29b;--charcoal:#11110f;--charcoal-2:#191714}
html{scroll-behavior:smooth}
body{overflow-x:hidden}
.ambient-motion{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden;opacity:.6}
.ambient-motion i{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);border-radius:50%;background:#c6a15b;box-shadow:0 0 10px rgba(198,161,91,.45);animation:floatGold var(--d) ease-in-out var(--delay) infinite;opacity:.16}
.topbar,.page,.main,.side-menu,.overlay,dialog{position:relative;z-index:1}
@keyframes floatGold{0%,100%{transform:translate3d(0,8px,0) scale(.8);opacity:.08}50%{transform:translate3d(0,-28px,0) scale(1.35);opacity:.28}}
@keyframes riseIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes softPulse{0%,100%{box-shadow:0 0 0 rgba(198,161,91,0)}50%{box-shadow:0 0 24px rgba(198,161,91,.13)}}
@keyframes goldShimmer{0%{background-position:180% 0}100%{background-position:-80% 0}}
@keyframes ringGlow{0%,100%{filter:drop-shadow(0 0 0 rgba(198,161,91,0))}50%{filter:drop-shadow(0 0 10px rgba(198,161,91,.24))}}
.motion-ready{animation:riseIn .55s cubic-bezier(.2,.75,.25,1) both;animation-delay:var(--motion-delay,0ms)}
.hero,.journey-curriculum,.games,.quiz{animation:riseIn .65s cubic-bezier(.2,.75,.25,1) both,softPulse 5s ease-in-out 1s infinite}
.ring{animation:ringGlow 3s ease-in-out infinite}
button,.game-card-tab,.journey-node,.part-tab,.utility-item,.library-item,.setting-toggle,.primary,.teacher-primary{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background .22s ease,filter .22s ease}
button:hover,.game-card-tab:hover,.journey-node:hover,.part-tab:hover{transform:translateY(-2px)}
button:active,.game-card-tab:active,.journey-node:active,.part-tab:active{transform:translateY(1px) scale(.985)}
.primary,.teacher-primary,.game-card-tab strong{background-size:200% 100%!important;background-image:linear-gradient(110deg,#87652f 0%,#d8b66e 38%,#a57b3b 55%,#d8b66e 70%,#87652f 100%)!important;animation:goldShimmer 6s linear infinite}
.primary:hover,.teacher-primary:hover,.game-card-tab:hover strong{box-shadow:0 8px 24px rgba(198,161,91,.22)!important;filter:brightness(1.08)}
.ui-ripple{position:absolute!important;border-radius:50%;pointer-events:none;transform:scale(0);background:rgba(234,210,155,.28);animation:rippleOut .55s ease-out forwards;z-index:5}
@keyframes rippleOut{to{transform:scale(1);opacity:0}}
.side-menu.open{animation:menuIn .28s cubic-bezier(.2,.8,.25,1)}
@keyframes menuIn{from{transform:translateX(24px);opacity:.4}to{transform:translateX(0);opacity:1}}
.side-menu nav button:hover span{transform:translateX(-3px);display:inline-block;transition:transform .2s ease}
.toast.show{animation:toastPop .35s cubic-bezier(.2,.8,.25,1)}
@keyframes toastPop{from{opacity:0;transform:translate(-50%,12px) scale(.94)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
.modal[open],.unit-modal[open],.utility-modal[open],.games-modal[open]{animation:modalIn .28s ease-out}
@keyframes modalIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.guided-progress i,.quiz-progress i,.bar i{position:relative;overflow:hidden}
.guided-progress i:after,.quiz-progress i:after,.bar i:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);transform:translateX(-100%);animation:progressShine 2.8s linear infinite}
@keyframes progressShine{to{transform:translateX(100%)}}
.game-card-tab:hover .game-card-icon{animation:iconBounce .5s ease}
@keyframes iconBounce{50%{transform:translateY(-5px) rotate(-3deg) scale(1.08)}}
.memory-card.open,.memory-card.matched{animation:cardFlip .28s ease-out}
@keyframes cardFlip{50%{transform:rotateY(12deg) scale(1.04)}}
.hunt-word{animation:huntFloat 3.2s ease-in-out infinite;animation-delay:calc(var(--i,0)*-0.4s)}
@keyframes huntFloat{50%{transform:translateY(-5px)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.ambient-motion{display:none!important}}

/* ================== Final motion + side menu fix ================== */
/* The menu must slide from the viewport edge and sit above the page, never inside the content flow. */
.side-menu{
  position:fixed !important;
  top:0 !important;
  right:0 !important;
  bottom:0 !important;
  height:100vh !important;
  z-index:120 !important;
  transform:translateX(110%) !important;
  transition:transform .36s cubic-bezier(.22,.75,.2,1),box-shadow .36s ease !important;
}
.side-menu.open{
  transform:translateX(0) !important;
  animation:menuInFinal .42s cubic-bezier(.22,.75,.2,1) both !important;
}
.overlay{
  position:fixed !important;
  inset:0 !important;
  z-index:110 !important;
}
.topbar{z-index:20 !important}
.dashboard{z-index:3 !important}
@keyframes menuInFinal{
  0%{transform:translateX(110%);opacity:.65}
  70%{transform:translateX(-5px);opacity:1}
  100%{transform:translateX(0);opacity:1}
}

/* Big cards: calm floating motion + a moving gold highlight. */
.hero,.lesson-card,.quick-card,.progress-card,.streak-card,.achievement-card,.quote-card,.curriculum{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.hero::after,.lesson-card::after,.quick-card::after,.progress-card::after,.streak-card::after,.achievement-card::after,.quote-card::after,.curriculum::after{
  content:"";
  position:absolute;
  top:-40%;
  left:-35%;
  width:28%;
  height:180%;
  background:linear-gradient(90deg,transparent,rgba(234,210,155,.075),transparent);
  transform:rotate(16deg) translateX(-180%);
  pointer-events:none;
  z-index:0;
  animation:cardShine 8s ease-in-out infinite;
}
.hero>*,.lesson-card>* ,.quick-card>* ,.progress-card>* ,.streak-card>* ,.achievement-card>* ,.quote-card>* ,.curriculum>*{position:relative;z-index:1}
@keyframes cardShine{
  0%,58%{transform:rotate(16deg) translateX(-180%)}
  78%,100%{transform:rotate(16deg) translateX(620%)}
}
.hero,.lesson-card{animation:bigCardFloat 7s ease-in-out infinite}
.quick-card{animation:smallCardFloat 6s ease-in-out infinite}
.progress-card,.streak-card,.achievement-card,.quote-card{animation:railFloat 7.5s ease-in-out infinite}
.progress-card{animation-delay:.2s}.streak-card{animation-delay:.7s}.achievement-card{animation-delay:1.2s}.quote-card{animation-delay:1.7s}
@keyframes bigCardFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes smallCardFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes railFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}

/* Interactive cards feel alive even before the user clicks them. */
.quick-card:hover,.progress-card:hover,.streak-card:hover,.achievement-card:hover,.quote-card:hover,.lesson-card:hover,.hero:hover{
  transform:translateY(-5px) !important;
  border-color:rgba(198,161,91,.48) !important;
  box-shadow:0 16px 38px rgba(0,0,0,.46),0 0 22px rgba(198,161,91,.08) !important;
}
.mini-illustration,.badge,.lesson-art,.journey-art,.quote-card span{
  transition:transform .35s ease,filter .35s ease;
}
.quick-card:hover .mini-illustration{transform:translateY(-7px) rotate(-4deg) scale(1.06);filter:drop-shadow(0 10px 12px rgba(198,161,91,.22))}
.achievement-card:hover .badge{transform:rotate(-7deg) scale(1.08);filter:drop-shadow(0 7px 10px rgba(198,161,91,.24))}
.lesson-card:hover .lesson-art{transform:scale(1.015)}
.quote-card:hover span{transform:translateY(-6px) rotate(-7deg)}

/* Progress ring has a gentle living glow rather than a static circle. */
.ring{animation:ringGlow 3s ease-in-out infinite,ringBreath 4.5s ease-in-out infinite !important}
@keyframes ringBreath{50%{transform:scale(1.025)}}

/* The lesson-path nodes and curriculum respond as the learner moves through them. */
.journey-node{transition:transform .25s ease,filter .25s ease,box-shadow .25s ease}
.journey-node:hover{filter:brightness(1.12);box-shadow:0 0 18px rgba(198,161,91,.12)}
.part-tab{position:relative;overflow:hidden}
.part-tab::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent,rgba(234,210,155,.18),transparent);transform:translateX(-120%);animation:tabShine 6s ease-in-out infinite}
@keyframes tabShine{0%,65%{transform:translateX(-120%)}85%,100%{transform:translateX(120%)}}

/* Make the menu items arrive one after another. */
.side-menu nav button{opacity:0;transform:translateX(18px)}
.side-menu.open nav button{animation:menuItemIn .34s cubic-bezier(.2,.8,.25,1) forwards}
.side-menu.open nav button:nth-child(1){animation-delay:.04s}.side-menu.open nav button:nth-child(2){animation-delay:.08s}.side-menu.open nav button:nth-child(3){animation-delay:.12s}.side-menu.open nav button:nth-child(4){animation-delay:.16s}.side-menu.open nav button:nth-child(5){animation-delay:.20s}.side-menu.open nav button:nth-child(6){animation-delay:.24s}.side-menu.open nav button:nth-child(7){animation-delay:.28s}.side-menu.open nav button:nth-child(8){animation-delay:.32s}
@keyframes menuItemIn{to{opacity:1;transform:translateX(0)}}

/* Mobile: keep the side panel attached to the edge and comfortably tappable. */
@media(max-width:760px){
  .side-menu{width:min(340px,88vw) !important;max-width:88vw !important}
  .hero,.lesson-card,.quick-card,.progress-card,.streak-card,.achievement-card,.quote-card{animation-duration:8s}
}
@media (prefers-reduced-motion:reduce){
  .hero,.lesson-card,.quick-card,.progress-card,.streak-card,.achievement-card,.quote-card,.curriculum,.ring,.part-tab::after,.hero::after,.lesson-card::after,.quick-card::after,.progress-card::after,.streak-card::after,.achievement-card::after,.quote-card::after,.curriculum::after{animation:none !important}
  .side-menu nav button{opacity:1;transform:none}
}

/* Teacher tests launch button — same black/gold visual language */
.tests-launch{border:1px solid #73562f;background:#1c1812;color:#d6ae62;border-radius:14px;padding:10px 15px;font-weight:900;cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s}.tests-launch:hover{transform:translateY(-2px);border-color:#d6ae62;box-shadow:0 8px 20px rgba(198,161,91,.13)}
.tests-panel{scroll-margin-top:20px;position:relative;overflow:hidden}.tests-panel::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 8% 10%,rgba(214,174,98,.08),transparent 28%)}.tests-panel>.teacher-head,.tests-panel>.test-toolbar,.tests-panel>#testCreateView,.tests-panel>#testResultsView{position:relative;z-index:1}
.progress-mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:12px}.progress-mini-stats span{font-size:9px;text-align:center;padding:7px 3px;border:1px solid rgba(198,161,91,.16);border-radius:10px;color:#cdb987}.progress-mini-stats b{color:#eee7da;font-size:12px}.days i{transition:.25s;opacity:.38}.days i.active{opacity:1;transform:scale(1.08);box-shadow:0 0 0 3px rgba(198,161,91,.12),0 0 14px rgba(198,161,91,.18)}.utility-item.ready{border-color:rgba(198,161,91,.38)!important}.utility-item.muted{opacity:.62}

/* =========================================================
   Cinematic Arabic intro — visual-only landing transition.
   It intentionally lives outside the application UI and does
   not change lessons, progress, tests, games, or database state.
   ========================================================= */
.arabic-intro{position:fixed;inset:0;z-index:99999;overflow:hidden;display:grid;place-items:center;background:#080706;color:#f1d28a;isolation:isolate;opacity:1;transition:opacity .8s ease,visibility .8s ease}.arabic-intro::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 55%,rgba(198,161,91,.15),transparent 30%),radial-gradient(circle at 50% 110%,rgba(198,161,91,.12),transparent 45%),linear-gradient(180deg,#050504,#0b0906 55%,#050403);z-index:-4}.arabic-intro::after{content:"";position:absolute;inset:7%;border:1px solid rgba(198,161,91,.18);border-radius:28px;box-shadow:inset 0 0 70px rgba(198,161,91,.035);z-index:-1}.intro-ambient{position:absolute;width:42vw;height:42vw;max-width:650px;max-height:650px;border-radius:50%;background:rgba(210,166,77,.11);filter:blur(80px);animation:introBreath 3.8s ease-in-out infinite}.intro-arch{position:absolute;width:min(82vw,900px);height:78vh;bottom:-18vh;border:2px solid rgba(198,161,91,.18);border-bottom:0;border-radius:48% 48% 0 0;box-shadow:0 0 50px rgba(198,161,91,.04),inset 0 0 35px rgba(198,161,91,.03)}.intro-arch::before,.intro-arch::after{content:"";position:absolute;top:3%;bottom:0;width:16%;border:1px solid rgba(198,161,91,.12);border-bottom:0}.intro-arch::before{left:-5%;border-radius:80% 0 0 0}.intro-arch::after{right:-5%;border-radius:0 80% 0 0}.intro-letter-field{position:absolute;inset:0;overflow:hidden}.intro-letter-field span{position:absolute;left:var(--x);top:-12vh;color:#d9ad58;font-family:"Amiri","Noto Naskh Arabic",serif;font-size:var(--size);font-weight:700;opacity:0;filter:drop-shadow(0 0 9px rgba(215,173,88,.34));animation:introFall var(--fall) cubic-bezier(.2,.55,.25,1) var(--delay) forwards}.intro-particles{position:absolute;inset:0;overflow:hidden}.intro-particles i{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);border-radius:50%;background:#e5bd6d;box-shadow:0 0 12px rgba(229,189,109,.65);opacity:.35;animation:introSpark 2.8s ease-in-out var(--delay) infinite}.intro-book{position:absolute;bottom:12%;width:190px;height:72px;opacity:.7;filter:drop-shadow(0 0 18px rgba(218,174,84,.22));transform:perspective(250px) rotateX(28deg)}.intro-book::before,.intro-book::after{content:"";position:absolute;bottom:0;width:50%;height:100%;border:1px solid rgba(224,184,94,.55);background:linear-gradient(145deg,rgba(225,185,95,.18),rgba(0,0,0,.1));box-shadow:inset 0 0 15px rgba(225,185,95,.07)}.intro-book::before{left:0;border-radius:5px 0 0 4px;transform-origin:right center;transform:skewY(4deg)}.intro-book::after{right:0;border-radius:0 5px 4px 0;transform-origin:left center;transform:skewY(-4deg)}.intro-book span{position:absolute;bottom:4px;left:50%;height:64px;width:1px;background:#e5bc67;z-index:2}.intro-book i{position:absolute;left:50%;bottom:0;width:220px;height:8px;transform:translateX(-50%);border-radius:50%;background:rgba(218,174,84,.2);filter:blur(5px)}.intro-title-wrap{position:relative;z-index:4;text-align:center;transform:translateY(-4%);animation:introTitleIn 1.1s cubic-bezier(.2,.75,.25,1) 2.8s both}.intro-kicker{font-size:12px;letter-spacing:2px;color:#aa8b55;margin-bottom:8px}.intro-title{margin:0;font-family:"Amiri","Noto Naskh Arabic",serif;font-size:clamp(52px,10vw,118px);font-weight:700;line-height:1.15;color:#f3d48d;text-shadow:0 0 14px rgba(240,202,120,.35),0 7px 35px rgba(0,0,0,.7);background:linear-gradient(180deg,#fff0bb,#d2a44e);-webkit-background-clip:text;background-clip:text;color:transparent}.intro-rule{display:flex;align-items:center;justify-content:center;gap:10px;margin:5px auto 4px;width:min(360px,70vw)}.intro-rule i{height:1px;flex:1;background:linear-gradient(90deg,transparent,#bd9250,transparent)}.intro-rule b{font-size:12px;color:#e7bd68}.intro-title-wrap p{margin:0;color:#d2b46f;font-size:clamp(13px,2vw,18px);letter-spacing:.5px}.intro-loader{position:absolute;bottom:7%;width:min(300px,58vw);height:3px;border-radius:99px;background:rgba(198,161,91,.13);overflow:hidden;z-index:5}.intro-loader span{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#a8782f,#f1d28a,#a8782f);box-shadow:0 0 12px rgba(241,210,138,.55);transition:width .12s linear}.intro-status{position:absolute;bottom:9.8%;font-size:10px;color:#8f784d;transform:translateY(28px);z-index:5}.intro-skip{position:absolute;top:22px;left:22px;z-index:6;color:#a9946a;background:rgba(12,10,7,.55);border:1px solid rgba(198,161,91,.2);border-radius:18px;padding:7px 13px;font-size:10px;transition:.2s}.intro-skip:hover{color:#f0d28d;border-color:rgba(198,161,91,.55);transform:translateY(-1px)}.scene{opacity:0;transition:opacity .85s ease}.scene.scene-reveal{opacity:1}.arabic-intro.intro-exit{opacity:0;visibility:hidden;pointer-events:none}.intro-exit .intro-title-wrap{animation:introTitleOut .55s ease both}.intro-exit .intro-book{animation:introBookOut .55s ease both}.intro-exit .intro-letter-field{animation:introLettersOut .7s ease both}@keyframes introFall{0%{opacity:0;transform:translate3d(var(--drift),-5vh,0) rotate(var(--rot)) scale(.75)}18%{opacity:.72}62%{opacity:.52}100%{opacity:0;transform:translate3d(calc(50vw - var(--x)),58vh,0) rotate(0deg) scale(.3)}}@keyframes introSpark{0%,100%{transform:translateY(0) scale(.65);opacity:.15}50%{transform:translateY(-16px) scale(1.2);opacity:.7}}@keyframes introTitleIn{0%{opacity:0;transform:translateY(28px) scale(.92);filter:blur(8px)}100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}@keyframes introTitleOut{to{opacity:0;transform:scale(1.05);filter:blur(8px)}}@keyframes introBookOut{to{opacity:0;transform:perspective(250px) rotateX(28deg) translateY(15px)}}@keyframes introLettersOut{to{opacity:0;transform:scale(1.08)}}@keyframes introBreath{0%,100%{transform:scale(.85);opacity:.55}50%{transform:scale(1.05);opacity:1}}@media(max-width:760px){.intro-arch{width:110vw;height:62vh;bottom:-10vh}.intro-book{bottom:15%;width:150px;height:58px}.intro-status{bottom:10.8%;font-size:9px}.intro-loader{bottom:8%}.intro-skip{top:14px;left:14px}.intro-title-wrap{transform:translateY(-8%)}}@media(prefers-reduced-motion:reduce){.arabic-intro,.scene{transition:none}.intro-ambient,.intro-letter-field span,.intro-particles i,.intro-title-wrap{animation:none!important}.intro-letter-field span{opacity:.16;top:20%;transform:none}.intro-title-wrap{opacity:1}.intro-loader span{width:100%!important}.intro-status{color:#c9ab6a}}


/* Developer credit */
.developer-credit{position:relative;z-index:2;text-align:center;padding:18px 16px 24px;color:rgba(241,234,220,.58);font-size:12px;letter-spacing:.2px}.developer-credit strong{color:#d6ae62;font-weight:800;margin-inline-start:4px}.teacher-page .developer-credit{max-width:1200px;margin:0 auto}
