@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800;900&family=Noto+Naskh+Arabic:wght@400;500;600;700&display=swap');
:root{color-scheme:light;--bg:#f8f7fc;--card:#fff;--ink:#2d2940;--muted:#7e7891;--line:#ece8f3;--main:#7556b8;--light:#efe9fb;--good:#25785e;--green:#e6f5ee;--bad:#b34d53;--rose:#fff0f2;--gold:#d3a658;--shadow:0 10px 28px rgba(47,30,80,.045);font-family:Nunito,'Segoe UI',sans-serif;font-size:15px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}body[data-theme=mint]{--main:#308971;--light:#e7f6f0;--bg:#f5fbf7}body[data-theme=rose]{--main:#b35c88;--light:#f9e9f1;--bg:#fff9fc}body[data-theme=sand]{--main:#947343;--light:#f8eedc;--bg:#faf8f1}body[data-theme=night]{--main:#5963ab;--light:#e9ecff;--bg:#f2f4fb}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}input,textarea,select{width:100%;padding:11px 13px;min-height:44px;border:1px solid #dcd6e9;border-radius:12px;background:#fff;color:var(--ink);outline:none}textarea{min-height:96px;resize:vertical}input:focus,select:focus,textarea:focus,button:focus-visible{outline:3px solid #c8b8e8;outline-offset:2px}a{color:var(--main)}p{line-height:1.6}h1,h2,h3,h4{line-height:1.28;letter-spacing:-.02em}h1{font-size:29px;margin:0 0 8px}h2{font-size:23px;margin:0 0 14px}h3{font-size:18px;margin:0 0 12px}.muted,.sub{color:var(--muted)}.sub{font-size:13px}.arabic{font-family:'Noto Naskh Arabic',serif;font-size:30px;line-height:1.9;direction:rtl;text-align:center}.btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:13px;background:var(--main);color:white;padding:10px 17px;font-weight:800;white-space:normal;text-align:center}.btn:hover:not(:disabled){filter:brightness(.97)}.btn.light{background:var(--light);color:var(--main)}.btn.neutral{background:#fff;color:var(--ink);border-color:var(--line)}.btn.green{background:var(--good)}.btn.danger{background:#fff0f0;color:#ab4355;border-color:#f2c8d0}.btn.sm{min-height:36px;padding:8px 12px;font-size:13px}.btn.full{width:100%}.chip{display:inline-flex;align-items:center;gap:5px;border-radius:999px;font-weight:800;font-size:12px;padding:6px 10px;background:#f1eef9;color:#6d588f}.chip.green{background:var(--green);color:var(--good)}.chip.red{background:var(--rose);color:var(--bad)}.chip.gold{background:#fdf4de;color:#966f28}.shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}.side{background:#fff;border-right:1px solid var(--line);padding:23px 14px;position:sticky;top:0;height:100vh;overflow:auto}.brand{display:flex;gap:11px;align-items:center;padding:0 12px 23px;font-size:21px;font-weight:900}.brandmark{width:43px;height:43px;display:grid;place-items:center;border-radius:15px;background:var(--light);font-size:24px;color:var(--main)}.brand small{display:block;font-size:11px;color:var(--muted);font-weight:700;letter-spacing:.08em}.navlabel{color:#9e95af;font-size:11px;font-weight:900;letter-spacing:.11em;padding:20px 12px 10px;text-transform:uppercase}.navbtn{display:flex;width:100%;border:0;background:transparent;color:#57516a;padding:12px 13px;margin:2px 0;text-align:left;gap:12px;border-radius:13px;font-weight:800;align-items:center}.navbtn.active{background:var(--light);color:var(--main)}.navbtn:hover{background:#f7f5fb}.navbtn .ico{width:23px;text-align:center;font-size:18px}.sidefooter{margin-top:25px;border-top:1px solid var(--line);padding:19px 11px 5px}.main{min-width:0;padding:20px clamp(16px,4vw,55px) 65px;max-width:1460px;width:100%;margin:auto}.topbar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:32px;padding:5px 0 15px;border-bottom:1px solid var(--line)}.topbar h4{margin:0}.topright{display:flex;align-items:center;gap:10px}.rolebox{max-width:230px;min-width:146px}.avatar{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#f8e4ef;border:2px solid white;box-shadow:0 0 0 1px #ebd8e5;font-size:23px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:22px;align-items:start}.stack>*+*{margin-top:19px}.card{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:20px;padding:22px;min-width:0}.hero{display:flex;justify-content:space-between;align-items:center;gap:14px;background:linear-gradient(105deg,#f0eafb,#fff8f4);border:1px solid #e9e0f5;border-radius:24px;padding:27px 30px;position:relative;overflow:hidden}.hero:after{content:'✿';font-size:124px;color:#decff3;opacity:.5;position:absolute;right:30px;top:-18px;pointer-events:none}.hero > *{position:relative;z-index:1}.hero p{margin:6px 0 13px;max-width:590px}.hero h1{font-size:27px}.sectiontitle{display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap;margin:21px 0 13px}.sectiontitle h2{margin:0}.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.tile{border:1px solid var(--line);background:#fff;border-radius:18px;padding:18px;text-align:left;box-shadow:var(--shadow);min-height:112px}.tile .emoji{font-size:27px;margin-bottom:9px}.tile strong{display:block;font-size:15px}.tile .sub{display:block;margin-top:5px}.tile:hover{border-color:#d9c4f3;transform:translateY(-1px)}.notice{padding:13px 15px;background:#fcf7e9;border:1px solid #f3e5bd;color:#6f5930;border-radius:13px;margin:12px 0;line-height:1.6}.notice.good{background:var(--green);color:#256e55;border-color:#cce8d9}.notice.rose{background:#fff0f2;color:#a24459;border-color:#f7d6df}.hint{font-size:13px;color:var(--muted);line-height:1.6}.statrow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.stat{border-radius:15px;padding:17px;background:#f9f7fd;border:1px solid #eee8f7}.stat .number{font-size:23px;font-weight:900;display:block}.stat .label{font-size:12px;color:var(--muted);display:block;margin-top:4px}.progressbar{height:8px;background:#f0edf7;border-radius:99px;overflow:hidden}.progressbar i{display:block;background:var(--main);height:100%;border-radius:99px}.mapheading{text-align:center;background:#f2edf9;padding:18px;border-radius:17px;color:var(--main);font-weight:900;margin:6px 0 20px}.path-stage{position:relative;padding-bottom:28px}.path-stage:not(:last-child):after{content:'';position:absolute;width:3px;height:26px;bottom:0;left:calc(50% - 1.5px);background:repeating-linear-gradient(to bottom,#cfbfe9 0 5px,transparent 5px 9px)}.stage-index{text-align:center;font-size:12px;font-weight:900;color:#9d88bc;margin-bottom:10px}.stage-lanes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:670px;margin:auto}.stage-lanes.single{grid-template-columns:minmax(0,330px);justify-content:center}.stage-node{background:white;border:2px solid #ebe4f5;border-radius:19px;padding:17px;position:relative;box-shadow:0 8px 20px #43226609}.stage-node.nahv{border-color:#d4e9dd;background:#fbfffc}.stage-node.done{border-color:#c1e4d2;background:#f4fdf6}.stage-node h3{font-size:17px;margin:6px 0 8px}.stage-node .nodeicon{font-size:25px}.lesson-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.lesson-card{padding:15px;border:1px solid var(--line);background:#fff;border-radius:16px;text-align:left;min-height:115px}.lesson-card:hover:not(:disabled){border-color:#bfa8e1}.lesson-card.locked{background:#f7f6fa;color:#aaa3b3}.lesson-card .chip{margin:8px 0}.steps{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.step{padding:9px 12px;border-radius:13px;background:#f4f1fa;color:#75628e;font-size:12px;font-weight:800}.step.good{background:var(--green);color:var(--good)}.split{display:grid;grid-template-columns:1fr 1fr;gap:15px}.wordcard{border:1px solid #ebe5f2;padding:16px;border-radius:14px;background:#fff;min-width:0}.wordcard .arabic{font-size:26px}.exercise{padding:15px 0;border-bottom:1px solid var(--line)}.exercise:last-child{border-bottom:0}.field{margin:13px 0}.field label{font-weight:800;display:block;margin-bottom:7px}.actions{display:flex;flex-wrap:wrap;gap:9px;margin:15px 0}.tablewrap{overflow-x:auto}.table{width:100%;border-collapse:collapse;min-width:500px}.table th{text-align:left;background:#f8f6fd;color:#6e6682;font-size:12px;font-weight:900;padding:11px 12px}.table td{border-bottom:1px solid #f1eef5;padding:11px 12px;vertical-align:middle}.table tr:last-child td{border-bottom:0}.table button{min-height:36px}.empty{padding:35px 12px;text-align:center;color:var(--muted)}.formgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.authouter{min-height:100vh;display:grid;place-items:center;padding:22px;background:radial-gradient(circle at 5% 5%,#eee0fa,transparent 42%),radial-gradient(circle at 90% 80%,#f6e7df,transparent 38%),#faf9fe}.authcard{max-width:480px;width:100%;background:white;border:1px solid var(--line);padding:30px;border-radius:26px;box-shadow:0 25px 70px #5d448218}.authhead{text-align:center;margin-bottom:27px}.authhead .brandmark{margin:0 auto 12px;width:60px;height:60px;font-size:29px}.authhead h1{font-size:27px}.authswitch{display:flex;background:#f8f6fc;border-radius:14px;padding:5px;margin-bottom:24px}.authswitch button{flex:1;border:0;border-radius:10px;padding:11px;background:transparent;color:var(--muted);font-weight:900}.authswitch button.active{background:white;color:var(--main);box-shadow:0 3px 9px #4e356914}.alert{position:fixed;right:22px;bottom:22px;z-index:100;background:#34304a;color:white;max-width:400px;padding:17px 20px;border-radius:13px;box-shadow:0 12px 24px #20142f44;font-weight:800;white-space:pre-wrap}.alert.error{background:#a3415a}.loader{font-size:60px;color:var(--main)}.loading{display:grid;place-content:center;min-height:65vh;text-align:center}.dashnews{border-bottom:1px solid var(--line);padding:12px 0}.dashnews:last-child{border:0}.dashnews h4{margin:0 0 5px}.footer{font-size:12px;color:var(--muted);padding-top:30px}.floating-back{display:inline-flex;margin-bottom:14px}.rightmeta{border-left:3px solid #dfd0f5;padding-left:11px}.checks{display:flex;flex-direction:column;gap:7px}.choice{display:flex;gap:10px;align-items:center;min-height:44px;border:1px solid var(--line);border-radius:10px;padding:10px}.choice input{width:auto;min-height:auto}.choice:hover{background:#f9f7fd}.video-box{background:linear-gradient(135deg,#e8e0f8,#f8f2f9);border:1px solid #e7dbef;border-radius:17px;padding:30px;text-align:center}.video-box .bigplay{font-size:52px}.hide{display:none!important}
@media(max-width:1050px){.layout{grid-template-columns:minmax(0,1fr)}.side{width:230px}.shell{grid-template-columns:230px minmax(0,1fr)}}
@media(max-width:760px){.shell{display:block}.side{position:static;width:100%;height:auto;padding:11px 13px 5px;overflow:visible;border-right:0;border-bottom:1px solid var(--line)}.brand{padding:5px 2px 13px;font-size:19px}.brand small{display:none}.navlabel,.sidefooter{display:none}.navlinks{display:flex;gap:7px;overflow-x:auto;padding:3px 0 8px}.navbtn{white-space:nowrap;width:auto;flex-shrink:0;padding:10px;font-size:12px;border:1px solid var(--line)}.navbtn .ico{font-size:16px;width:auto}.main{padding:15px 14px 35px}.topbar{margin-bottom:18px}.rolebox{min-width:130px;width:155px}.hero{padding:21px 18px}.hero h1{font-size:24px}.hero:after{right:-20px;opacity:.3}.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.card{padding:17px}.formgrid,.split{grid-template-columns:1fr}.lesson-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.statrow{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:390px){.stage-lanes{gap:7px}.stage-node{padding:10px}.stage-node h3{font-size:14px}.tiles{gap:8px}.tile{padding:12px}.tile strong{font-size:13px}.main{padding:12px 10px 24px}.topbar h4{font-size:13px}.lesson-grid{grid-template-columns:1fr 1fr}}
/* Lesson editor and internal correspondence */
.feature-card{margin-top:24px}.editor-row{padding:16px;background:var(--bg,#f7f5fc);border:1px solid var(--line,#e8e2f0);border-radius:14px;margin:12px 0}.word-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.word-row .field{margin:0}.word-row .field:nth-child(3){grid-column:1/-1}.editor-actions{position:sticky;bottom:10px;padding:12px;background:var(--card,#fff);border:1px solid var(--line,#e8e2f0);border-radius:14px;z-index:2}.program-grid,.asset-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin:20px 0}.asset-card{padding:16px;border:1px solid var(--line,#e8e2f0);border-radius:14px;overflow-wrap:anywhere}.message{padding:16px;margin:14px 0;background:var(--bg,#f7f5fc);border-radius:14px;border-left:3px solid #aa97ca}.message.mine{border-left-color:#729785}.prewrap{white-space:pre-wrap;overflow-wrap:anywhere}dialog{width:min(850px,94vw);max-height:90vh;overflow:auto;border:1px solid #e4dceb;border-radius:20px;padding:24px;background:var(--card,#fff);color:var(--text,#30283d)}dialog::backdrop{background:#25163788}audio{max-width:100%}progress{width:100%;margin-top:12px}@media(max-width:650px){.word-row{grid-template-columns:1fr}.editor-actions{position:static}.editor-actions .btn{width:100%}.program-grid{grid-template-columns:1fr}}

/* Lesson media and review tools */
.lesson-media-grid{display:grid;gap:20px;align-items:start}.lesson-media-grid.has-notes{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.lesson-notes{max-height:650px;overflow:auto;padding:0 8px}.note-page{margin-bottom:22px}.protected-media{position:relative;isolation:isolate;overflow:hidden;border-radius:12px;background:#eeebf4;user-select:none}.protected-media img{display:block;width:100%;height:auto;-webkit-user-drag:none}.protected-media video{display:block;width:100%}.watermark{position:absolute;z-index:2;top:20%;left:7%;max-width:85%;font-weight:700;font-size:clamp(12px,1.5vw,20px);color:#211c36b3;background:#ffffff70;padding:5px 10px;border-radius:8px;pointer-events:none;animation:watermark-drift 22s ease-in-out infinite alternate;overflow-wrap:anywhere}.media-expand{position:relative;z-index:3;margin:6px}.protected-media:fullscreen{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#16121f}.protected-media:fullscreen video{max-height:88vh!important;width:100%;flex:1;min-height:0}.protected-media:fullscreen .watermark{font-size:24px}.note-uploader{border:1px dashed #b7a4d2;padding:16px;border-radius:14px}#study-dialog{width:min(1000px,94vw);max-height:90vh;overflow:auto;border:1px solid #d9cdec;border-radius:18px;padding:22px}#study-dialog::backdrop{background:#17102299}#study-dialog .protected-media{max-width:100%}[data-study-form="approve"]{margin-top:24px;border-top:1px solid #ddd;padding-top:18px}[data-feedback]{margin-top:8px;font-size:14px}#practice-body:empty{display:none}@keyframes watermark-drift{0%{top:18%;left:7%}50%{top:45%;left:20%}100%{top:68%;left:10%}}@media(prefers-reduced-motion:reduce){.watermark{animation:none}}@media(max-width:800px){.lesson-media-grid.has-notes{grid-template-columns:1fr}.lesson-notes{max-height:none;padding:0}.watermark{font-size:14px}}@media print{.protected-media{visibility:hidden}}

/* Compact, accessible classroom and circular results */
.class-context{margin-top:18px}.workspace-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:20px 0}.workspace-tabs button{border:1px solid var(--border,#dce5df);border-radius:12px;background:var(--card,#fff);color:inherit;padding:12px 16px;font:inherit;cursor:pointer}.workspace-tabs button.active{background:var(--main,#318b78);color:#fff}.class-metrics,.score-heading{display:flex;gap:28px;align-items:center;flex-wrap:wrap;margin:12px 0 24px}.ring-unit{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;font-size:13px;flex-shrink:0}.result-ring{--tone:#438d79;--rest:#e9efeb;width:104px;height:104px;border-radius:50%;background:conic-gradient(var(--tone) var(--ring),var(--rest) 0);display:grid;place-items:center;position:relative}.result-ring:before{content:'';position:absolute;inset:10px;background:var(--card,#fff);border-radius:50%}.result-ring strong{position:relative;font-size:24px}.result-ring.red{--tone:#ca706c}.result-ring.gold{--tone:#c49a49}.mistake-detail{border-top:1px solid #e4e9e5;padding:14px 0}.mistake-detail summary{display:flex;gap:18px;align-items:center;cursor:pointer;font-weight:650}.mistake-detail .result-ring{width:68px;height:68px}.mistake-detail .result-ring:before{inset:7px}.mistake-detail .result-ring strong{font-size:18px}.student-row{border-bottom:1px solid #e3e9e6;padding:12px 0}.student-row summary{display:flex;gap:12px;align-items:center;cursor:pointer;list-style:none}.student-initial{background:#eaf3ee;border-radius:50%;width:38px;height:38px;display:grid;place-items:center;color:#357c66;flex-shrink:0}.student-name{flex:1;min-width:0;overflow-wrap:anywhere}.student-name small{display:block;color:var(--muted,#66746c);margin-top:4px}.score-pill{white-space:nowrap;background:#f0f4f1;border-radius:20px;padding:7px 10px;font-size:13px;color:#284c40}.student-details{padding:16px 4px}.wrong-item{border-left:3px solid #cb817a;background:#fcf6f4;border-radius:8px;padding:12px 15px;margin:10px 0;color:#3e3533}.wrong-item p{margin:7px 0}.wrong-answer{color:#a44943}.schedule-event{display:flex;gap:12px;flex-wrap:wrap;justify-content:space-between;border-bottom:1px solid #e5ebe7;padding:15px 0}.access-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:15px 0}.access-list small{margin-left:auto}.result-question{border-radius:10px;padding:13px;margin:10px 0;border:1px solid #d9e5dc}.result-question.incorrect{border-color:#dba9a2;background:#fff8f6;color:#533b36}.result-question.correct{background:#f1f8f3;color:#315841}.result-question summary{cursor:pointer;font-weight:600}.locked-answer{background:#edf4ee;border-radius:9px;padding:12px;color:#325744}.completion-checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px}.completion-checks p{background:#f1f6f2;border-radius:10px;padding:12px;margin:0;color:#30513d}.exercise button{margin-top:12px}.group-tabs{flex-wrap:wrap}details.card>summary{cursor:pointer;font-weight:700}input:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible{outline:3px solid #88b8a8;outline-offset:3px}@media(max-width:600px){.workspace-tabs{gap:5px}.workspace-tabs button{font-size:13px;padding:10px}.class-metrics{gap:20px;justify-content:center}.student-row summary{gap:7px}.score-pill{font-size:12px;padding:6px}.result-ring{width:90px;height:90px}.student-initial{width:30px;height:30px}.class-context .formgrid{display:block}}

.result-ring.score{--tone:#438d79;--rest:#ca706c}
/* Compact lesson authoring */
.lesson-workspace{max-width:1100px;margin:0 auto 18px}.lesson-chooser{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}.lesson-fold{border:1px solid var(--border,#e1dce9);border-radius:14px;background:var(--card,#fff);margin:12px auto;max-width:1100px;overflow:hidden}.lesson-fold>summary{display:flex;align-items:center;gap:12px;padding:18px;cursor:pointer;list-style:none}.lesson-fold>summary::-webkit-details-marker{display:none}.fold-symbol{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:#f0ebf8;color:#614a85;font-size:22px}.fold-symbol:before{content:'+'}.lesson-fold[open]>.summary .fold-symbol:before,.lesson-fold[open]>summary .fold-symbol:before{content:'−'}.lesson-fold>summary>small{margin-left:auto;color:#736b80;font-size:13px}.fold-body{padding:0 18px 18px}.fold-body .editor-row{margin:12px 0}.file-pick{display:block;padding:16px;border:1px dashed #b7a8cb;border-radius:12px;font-weight:600}.file-pick input{display:block;width:100%;margin-top:10px}.lesson-workspace .editor-actions{padding:18px 0 6px;flex-wrap:wrap}.lesson-workspace .editor-row{grid-template-columns:repeat(2,minmax(0,1fr))}.lesson-workspace [data-fold="manage"] form{margin-bottom:24px}@media(max-width:700px){.lesson-chooser{grid-template-columns:1fr;gap:4px}.lesson-fold>summary{padding:14px 12px;gap:8px}.fold-body{padding:0 12px 14px}.lesson-workspace .editor-row{grid-template-columns:1fr}.lesson-workspace .editor-actions>.btn{width:100%}}
.management-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-top:18px}.group-card{text-align:left;cursor:pointer;color:inherit;font:inherit;display:flex;flex-direction:column;gap:10px;border:1px solid #e5dfee}.group-card.chosen{border:2px solid #8362b0;background:#f7f2ff}.group-card span{font-size:13px;color:#756e80}.management-person{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #eee}.people-picker{max-height:280px;overflow:auto;padding:10px}.people-picker [hidden]{display:none!important}[data-management] fieldset{border:1px solid #e5dfee;border-radius:12px;padding:14px;margin:18px 0}[data-management] details{margin:16px 0}[data-management] summary{cursor:pointer;padding:10px 0}