@font-face{font-family:Arabic;src:url('/arabic-Regular.woff') format('woff');font-weight:400;font-display:swap}@font-face{font-family:Arabic;src:url('/arabic-Bold.woff') format('woff');font-weight:700 900;font-display:swap}
:root{--ink:#233832;--muted:#4c655d;--green:#215847;--teal:#326d57;--line:#dce7df;--paper:#fafbf7;--cream:#fff9ec;--purple:#593f6b;--lav:#efe8f3;--font:Arabic,"Noto Sans Arabic",Tahoma,sans-serif}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.8 var(--font)}
a{color:inherit;text-decoration:none} button,input,select,textarea{font:inherit} button,summary{cursor:pointer} h1,h2,h3,p{margin:0} h1,h2,h3{line-height:1.4} ul{padding-inline-start:1.4em} :focus-visible{outline:3px solid #9363af;outline-offset:4px}
.wrap{width:min(1200px,calc(100% - 64px));margin-inline:auto}.skip{position:absolute;top:-100px;right:10px;background:white;padding:12px;z-index:3}.skip:focus{top:8px}
.top{background:#ffffffeb;border-bottom:1px solid var(--line)}.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:17px;line-height:1.35}.brand small{display:block;color:var(--muted);font-size:11px;font-weight:600;margin-top:4px}.mark{width:41px;height:41px;display:grid;place-items:center;border-radius:13px;background:#e2eee6;color:#235b47;font:29px/1 system-ui}.nav nav{display:flex;gap:29px;font-weight:700;color:#48635a;font-size:14px}.nav a:hover,.foot a:hover{text-decoration:underline}.teacher-link{border:1px solid var(--line);padding:7px 13px;border-radius:10px;font-size:13px;font-weight:700;color:var(--green);white-space:nowrap}
.hero{position:relative;isolation:isolate;min-height:455px;margin-top:28px;display:flex;align-items:center;overflow:hidden;border-radius:26px;border:1px solid #e3d9e9;background:#f4edf6}.hero-picture{position:absolute;inset:0 auto 0 0;width:70%;z-index:-2;background:#dccbe8 url('/classroom.webp') center 44%/cover no-repeat}.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(270deg,#f6eff7 0%,#f6eff7 31%,#f6eff7eb 39%,#f6eff755 53%,transparent 67%)}.hero-text{width:54%;padding:42px 49px 47px}.eyebrow{font-size:13px;font-weight:800;color:var(--teal);margin-bottom:7px}.hero .eyebrow{color:#684f78}.hero h1{font-size:clamp(42px,6vw,78px);letter-spacing:-.045em;color:#2b2435;font-weight:850;line-height:1.26}.subtitle{font-size:clamp(17px,2vw,27px);color:var(--purple);font-weight:800;margin:10px 0 13px;line-height:1.5}.hero-copy{color:#4b3e50;max-width:375px;font-size:16px;line-height:1.85}.actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px;align-items:center}.button{min-height:43px;display:inline-flex;align-items:center;justify-content:center;gap:11px;border:1px solid var(--line);padding:6px 17px;border-radius:10px;font-weight:750;line-height:1.6;color:var(--green);background:white}.button:hover{filter:brightness(.96)}.button.primary{background:var(--green);color:#fff;border-color:var(--green)}.button.light{border-color:#d9cce1;color:#513e60;background:#fff9}.button:disabled{cursor:wait;opacity:.65}.hero-meta{display:flex;gap:14px;flex-wrap:wrap;margin-top:20px;color:#58455f;font-size:13px;font-weight:750}.hero-meta span+span{border-inline-start:1px solid #cdbed6;padding-inline-start:14px}.quote{position:absolute;bottom:20px;left:20px;color:white;background:#251b31df;border:1px solid #ffffff60;border-radius:11px;padding:7px 13px;font-size:12px;font-weight:650}
.map{padding-top:32px;scroll-margin-top:14px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:17px}.section-head h2,.page-title h1{font-size:clamp(28px,4vw,42px);font-weight:850}.progress-box{min-width:170px;color:var(--muted);font-weight:700;font-size:12px}.progress-box progress{display:block;width:100%;margin-top:5px;height:8px;appearance:none;border:0;border-radius:9px;overflow:hidden;background:#e5ece6}.progress-box progress::-webkit-progress-bar{background:#e5ece6}.progress-box progress::-webkit-progress-value{background:#36775d}.progress-box progress::-moz-progress-bar{background:#36775d}
.station-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.station-card{display:block;background:white;border:1px solid var(--line);border-radius:15px;padding:16px 18px;transition:transform .15s,border-color .15s}.station-card:hover{border-color:#8db6a3;transform:translateY(-3px)}.card-top,.card-foot{display:flex;align-items:center;justify-content:space-between;gap:8px}.station-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:#e8f3eb;color:#256049;font:700 24px/1 system-ui}.station-card:nth-child(2n) .station-icon{background:#f1e8f6;color:#6a457c}.station-card:nth-child(3n) .station-icon{background:#fbefd8;color:#814d16}.duration{font-weight:750;font-size:12px;color:var(--muted);background:#f1f5f0;border-radius:20px;padding:2px 9px;white-space:nowrap}.station-card h3{font-size:20px;margin:10px 0 4px}.station-card p{color:var(--muted);font-size:13px;line-height:1.65}.card-foot{margin-top:11px;color:var(--green);font-size:12px;font-weight:750}
.guide{margin-top:20px;border:1px solid var(--line);border-radius:14px;background:#fff;padding:12px 18px}.guide summary{font-weight:800;color:var(--green)}.guide-body p{margin-top:9px}
.foot{display:flex;justify-content:space-between;gap:15px;margin-top:32px;padding:15px 0 22px;border-top:1px solid var(--line);color:var(--muted);font-weight:700;font-size:12px}
.page-title{padding:25px 0 20px}.breadcrumbs{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:13px;margin-bottom:9px}.breadcrumbs a{text-decoration:underline}.page-title p:not(.eyebrow){color:var(--muted);margin-top:7px}.station-layout{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(245px,1fr);gap:16px;align-items:start}.panel{background:#fff;border:1px solid var(--line);border-radius:17px;padding:20px;min-width:0}.panel h2{font-size:23px;margin-bottom:8px}.panel h3{font-size:17px;margin:13px 0 5px}.panel p+p{margin-top:7px}.sidebar{display:grid;gap:12px}.time-card{background:#eaf3ec}.timer{font-weight:850;font-size:30px;color:var(--green);font-variant-numeric:tabular-nums;line-height:1.35}.timeline{font-size:13px;line-height:1.75;padding-inline-start:20px;margin:7px 0}.time-card .actions{margin-top:9px}.small{font-size:13px;color:var(--muted)}.aside-pic{min-height:170px;background:#efe5f3 url('/classroom.webp') 49% 48%/cover;border-radius:14px}
.callout{border-inline-start:4px solid #8a63a0;background:#f4edf6;padding:10px 13px;border-radius:9px;margin-top:12px}.callout strong{color:var(--purple)}.hint{margin-top:12px;background:#f4f8f3;padding:8px 12px;border-radius:10px}.hint summary{font-weight:800;color:var(--green)}.hint p{margin-top:5px}.station-nav{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-top:15px}.station-nav .actions{margin:0}.media{display:block;width:100%;background:#edf5ed;border-radius:12px;margin:10px 0 12px;max-height:470px}.media.audio{max-width:520px}.task-list{padding-inline-start:23px;margin:7px 0}.task-list li+li{margin-top:5px}.label{display:block;font-weight:750;margin-bottom:4px} input:not([type=radio]),textarea,select{width:100%;border:1px solid #a8bcb0;border-radius:8px;padding:6px 10px;background:white;color:var(--ink);min-height:42px}textarea{min-height:72px;resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:10px 0}.status{color:var(--green);font-weight:750;margin-top:8px}.status.error{color:#972d39}.badge{background:#e7f1e9;color:#215847;border-radius:100px;padding:2px 9px;font-size:12px;font-weight:750}
fieldset{padding:11px;border:1px solid var(--line);border-radius:12px;margin:10px 0;min-width:0}legend{font-weight:800;padding:0 5px;line-height:1.65}.option{display:flex;align-items:start;gap:8px;padding:5px 8px;border:1px solid transparent;border-radius:8px;cursor:pointer}.option:hover,.option:has(input:checked){background:#eef5ef;border-color:#c7dbce}.option input{accent-color:var(--green);margin-top:7px}.rubric{display:grid;gap:5px}.level{min-width:28px;color:var(--purple);font-weight:850}.lab{background:#eff6ef;border-radius:12px;margin-top:12px;overflow:hidden;border:1px solid #dae8dd}.lab canvas{display:block;width:100%;height:auto;touch-action:none}.lab-tools{display:flex;gap:7px;flex-wrap:wrap;padding:9px;border-top:1px solid #dae8dd}.lab-tools button[aria-pressed=true]{background:var(--green);color:#fff}.lab-tools .button{min-height:36px;padding:4px 9px;font-size:12px}.metrics{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}.metric{background:#eaf3ed;padding:3px 8px;border-radius:7px;font-size:12px;font-weight:750}.stepper{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.stepper button[aria-pressed=true]{background:var(--lav);color:var(--purple);border-color:#d8c6e1}.step-text{min-height:48px}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:13px}th,td{padding:8px;text-align:start;border-bottom:1px solid var(--line);vertical-align:top}th{background:#eef5ef;color:var(--green);white-space:nowrap}.dashboard{display:grid;gap:14px}.dash-stats{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.dash-stats span{background:#eaf3ed;border-radius:8px;padding:6px 10px;font-weight:750}.code{font:700 17px system-ui;letter-spacing:.06em}.result-grid{display:grid;gap:6px;margin-top:10px}.result-grid div{background:#f0f5ef;padding:7px 9px;border-radius:8px}.ltr{display:inline-block;direction:ltr;unicode-bidi:isolate}
@media(max-width:900px){.wrap{width:calc(100% - 36px)}.hero-text{padding-inline:27px}.station-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.wrap{width:calc(100% - 24px)}.nav{min-height:66px;gap:8px}.nav nav{display:none}.brand{font-size:15px}.teacher-link{font-size:12px}.hero{display:block;min-height:0;margin-top:15px;padding-top:61%;border-radius:17px}.hero-picture{inset:0 0 auto;width:100%;height:auto;aspect-ratio:1.65;background-position:center 37%}.hero::after{background:linear-gradient(180deg,transparent 0%,transparent 23%,#f6eff7 50%)}.hero-text{width:auto;padding:0 16px 21px}.hero h1{font-size:43px}.quote{top:10px;bottom:auto;left:10px;font-size:10px;max-width:92%}.hero-meta{margin-top:12px}.map{padding-top:22px}.progress-box{min-width:90px;font-size:10px}.station-grid{gap:8px}.station-card{padding:10px}.station-card h3{font-size:16px}.station-card p{font-size:11px}.duration{font-size:10px}.station-layout{display:flex;flex-direction:column}.station-layout>*{width:100%}.sidebar{grid-template-columns:1fr;order:-1}.aside-pic,.role-card{display:none}.panel{padding:13px}.form-row{grid-template-columns:1fr}.station-nav .button{padding-inline:8px;font-size:12px}.time-card{display:grid;grid-template-columns:1fr auto;gap:0 6px}.time-card .timeline,.time-card .status{grid-column:1/-1}.time-card .actions{grid-column:1/-1}.time-card h2{margin:0}.page-title{padding-top:15px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.diagram{margin:12px 0;background:#f1f7f2;border:1px solid #d9e9dc;border-radius:13px;overflow:hidden}
.geometry{width:100%;max-width:405px;height:auto;display:block;margin-inline:auto;overflow:visible}
.geometry .triangle-fill{fill:#e5f0e7;stroke:#274d3e;stroke-width:2.6;stroke-linejoin:round}
.geometry .edge{stroke:#274d3e;stroke-width:3;stroke-linecap:round}
.geometry .vertex{fill:#274d3e}
.geometry .center{fill:#624174}
.geometry .contact{fill:#9b561e}
.geometry .bisector{stroke:#247154;stroke-width:2.5;stroke-dasharray:6 5;fill:none;stroke-linecap:round}
.geometry .radius-line{fill:none;stroke:#9b561e;stroke-width:2.2;stroke-linecap:round}
.geometry .arc-mark,.geometry .arc-outer{fill:none;stroke:#85539b;stroke-width:2.1}
.geometry .arc-outer{stroke-dasharray:4 4}
.geometry .incircle{fill:#f0e1f6;stroke:#85539b;stroke-width:2.5}
.geometry .water{fill:#c8e8ea;stroke:#2e6975;stroke-width:2.5}
.geometry .water-ring{fill:none;stroke:#3c8391;stroke-width:1.5}
.geometry .candidate{fill:#fff3d8;stroke:#9c6225;stroke-width:1.4}
.geometry .candidate-label{fill:#724010;font:800 14px var(--font)}
.geometry .label-main{fill:#213c32;font:750 15px system-ui}
.geometry .measure{fill:#703c18;font:800 16px var(--font);paint-order:stroke;stroke:#f1f7f2;stroke-width:4px;stroke-linejoin:round}
.diagram figcaption{padding:5px 12px 8px;text-align:center;color:var(--muted);font-size:13px;border-top:1px solid #e1ebe2}
.visual-deck{background:#f8f5fa;border:1px solid #e7ddec;border-radius:14px;padding:11px;margin:10px 0 16px}
.visual-deck .stepper{margin:0 0 8px}
.visual-deck .button{font-size:13px;padding-inline:10px}
.slide-content{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(130px,1fr);align-items:center;gap:12px}
.slide-content .geometry{background:#f1f7f2;border-radius:10px}
.slide-content h3{margin-top:0;color:var(--purple)}
.rubric{display:block}
.rubric-table{margin-top:7px}
.rubric-table th,.rubric-table td{vertical-align:middle}
.rubric-table th:first-child,.rubric-table td:first-child{text-align:center}
.rubric-table td:nth-child(2){white-space:nowrap}
.rubric-table input{accent-color:var(--green);width:17px;height:17px;margin:0;vertical-align:middle;cursor:pointer}
.rubric-table label{display:block;cursor:pointer}
.rubric-table label span{display:block;color:var(--muted);line-height:1.65}
.rubric-table tr:has(input:checked){background:#edf5ef}
#exit-form .diagram{margin:5px 0 8px}
#exit-form .geometry{max-width:310px}
.teacher-entry{margin-top:15px;padding:15px 18px;background:#eef5ef;border:1px solid var(--line);border-radius:14px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.teacher-entry h2{font-size:20px;margin-bottom:4px}
.teacher-entry p{font-size:13px;color:var(--muted)}
.teacher-entry .button{flex-shrink:0}
@media(max-width:650px){.slide-content{grid-template-columns:1fr}.teacher-entry{flex-wrap:wrap}.rubric-table th,.rubric-table td{padding:5px}.rubric-table label span{font-size:12px}}

.station-card .station-window{margin-top:5px;color:var(--green);font-weight:750}
.stage-window{grid-column:1/-1}

.rug-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.rug-option{display:block;border:1px solid #a8bcb0;background:#fbfcfa;border-radius:12px;padding:6px;cursor:pointer}
.rug-option:has(input:checked),.rug-option:focus-within{border-color:var(--green);box-shadow:inset 0 0 0 1px var(--green)}
.rug-symbol{display:flex;gap:6px;align-items:center;font-weight:800;padding-inline:5px}
.rug-symbol input{accent-color:var(--green)}
.rug-option .geometry{width:100%;max-width:none}
.geometry .rug{fill:#e7cdef;stroke:#654571;stroke-width:2}
.geometry .rug-ring{fill:none;stroke:#9b6cad;stroke-width:1.5}
.evidence-table td:nth-child(3),.evidence-table td:nth-child(4){min-width:190px;white-space:pre-wrap;overflow-wrap:anywhere}
.evidence-table td:nth-child(5){min-width:170px;overflow-wrap:anywhere}
.evidence-table td p+p{margin-top:3px}
.class-links{display:flex;flex-wrap:wrap;gap:5px}

.book-example .geometry{max-width:330px}
.example-steps{display:grid;gap:6px;margin-block-start:10px}
.example-steps details{background:#fff;border:1px solid var(--line);border-radius:8px;padding:7px 10px}
.example-equation{display:block;max-width:100%;overflow-wrap:anywhere;background:#edf5ee;border-radius:6px;padding:5px 9px;margin-block-start:5px;color:var(--green);font-weight:750;font-family:system-ui,sans-serif}

.video-checks{margin-block-start:16px}
.video-checks .geometry{max-width:315px}
.video-check input[name=answer]{max-width:10rem}
.video-check .label{margin-block-start:8px}

@font-face{
  font-family:"Noto Kufi Display";
  src:url('/noto-kufi-arabic-bold.woff') format('woff');
  font-weight:700;
  font-display:swap;
}

:root{
  --heading-font:"Noto Kufi Display",var(--font);
  --ink:#302439;
  --muted:#62536a;
  --green:#315b52;
  --teal:#446f66;
  --line:#e4dbe9;
  --paper:#fbf8fd;
  --purple:#663f79;
  --lav:#f1e6f6;
  --action-gradient:linear-gradient(120deg,#4d326c,#754c88);
  --soft-shadow:0 12px 32px #54366b10;
}

body{
  background:radial-gradient(ellipse at 100% 8%,#f0e4f6 0,transparent 32rem),
    radial-gradient(ellipse at 0 40%,#eef7f0 0,transparent 28rem),
    var(--paper);
  font-size:16px;
}
h1,h2,h3,.brand{font-family:var(--heading-font);font-weight:700}
h1,h2,h3{line-height:1.55}
.top{background:#fffcfff2;border-color:#e8dced}
.nav nav,.teacher-link{color:#5c4369}
.mark{background:linear-gradient(145deg,#eedaf6,#dcedde);color:#654476}
.teacher-link{border-color:#e2d5e9;background:#f9f4fb;border-radius:14px}

.hero{
  border-color:#e2d2e9;
  background:#f2e5f5;
  box-shadow:0 18px 48px #5b376d20;
}
.hero::after{
  background:
    radial-gradient(ellipse at 100% 100%,#fff1d9b0 0,transparent 52%),
    linear-gradient(270deg,#f7ecf9 0%,#f4e6f7 29%,#f2e1f5ed 38%,#f4e4f482 52%,transparent 68%);
}
.hero h1{
  font-size:clamp(38px,5vw,62px);
  letter-spacing:normal;
  line-height:1.48;
  color:#422450;
}
.hero .eyebrow,.hero-meta{color:#624674}
.subtitle{color:#623a76;font-size:clamp(17px,2vw,25px)}
.hero-copy{color:#493751}
.quote{background:#3a2546ec;border-color:#f6e4fa70}
.button{border-color:#ddd0e5;border-radius:12px;color:#5b3c6b}
.button.primary{background:var(--action-gradient);border-color:#67417a;color:#fff;box-shadow:0 4px 11px #5a367028}
.button.light{background:#fffdfce0;border-color:#ded1e6;color:#5b3c6b}

.station-card{
  --station-accent:#9769ae;
  --station-tint:#f6ebfb;
  background:linear-gradient(150deg,var(--station-tint),#fff 77%);
  border-color:#e6dce9;
  border-block-start:3px solid var(--station-accent);
  border-radius:17px;
  box-shadow:var(--soft-shadow);
}
.station-card:nth-child(3n+2){--station-accent:#648f82;--station-tint:#e9f5ee}
.station-card:nth-child(3n){--station-accent:#bd8a55;--station-tint:#fbefd9}
.station-card:hover{border-color:var(--station-accent)}
.station-card h3{font-size:clamp(15px,1.6vw,19px)}
.station-card:nth-child(n) .station-icon{
  background:var(--station-tint);
  border:1px solid var(--station-accent);
  color:#553967;
}
.duration{background:#fffdfbdb;color:#604d6a}
.progress-box progress::-webkit-progress-value{background:linear-gradient(90deg,#6b9687,#a675b8)}
.progress-box progress::-moz-progress-bar{background:linear-gradient(90deg,#6b9687,#a675b8)}

.page-title{
  margin-block:20px 16px;
  padding:20px clamp(14px,3vw,30px);
  background:linear-gradient(110deg,#f2f7f0,#fbf2e6 48%,#f0e2f6);
  border:1px solid var(--line);
  border-radius:19px;
}
.page-title h1,.section-head h2{color:#422450}
.page-title h1[tabindex="-1"]:focus{outline:none}
.panel,.guide{box-shadow:var(--soft-shadow)}
.panel h2{font-size:clamp(18px,2vw,22px)}
.panel h3{font-size:clamp(15px,1.7vw,17px)}
.time-card{background:linear-gradient(145deg,#f1e5f7,#f4f7ed)}
.timer{color:#5c3b72}
.callout{background:linear-gradient(120deg,#f8edf9,#fbf2e3);border-inline-start-color:#a775b1}
.hint{background:#f7f1fa}
.hint summary{color:#5b3c6b}
.rug-option{border-color:#d8c9e0;background:#fefbff}
.rug-option:has(input:checked),.rug-option:focus-within{
  border-color:#7c4d94;
  box-shadow:inset 0 0 0 1px #7c4d94;
}
.teacher-entry{background:linear-gradient(115deg,#f4e9fa,#eef7ef);box-shadow:var(--soft-shadow)}
th{background:#f1e6f6;color:#553968}
.dash-stats span{background:#edf5ee}

@media(max-width:650px){
  .hero::after{
    background:linear-gradient(180deg,transparent 0%,transparent 22%,#f5e8f8c9 38%,#f5e8f8 49%,#fff0dc 100%);
  }
  .hero h1{font-size:clamp(32px,8.4vw,48px)}
  .hero-text .actions{gap:7px}
  .hero-text .button{font-size:13px;padding-inline:11px}
  .page-title{margin-block-start:12px}
}