:root{
  --ink:#1d2a24; --muted:#6b7268;
  --paper:#fffdf6; --paper2:#f6efdf; --line:#e0d7c2;
  --green:#0d4a31; --green2:#156b48; --mint:#eaf6ee; --mintline:#cbe4d5;
  --gold:#b99429; --goldsoft:#fbf2d5; --goldline:#e6d49a;
  --red:#9c2b25; --blue:#1f5f9e; --teal:#0d6f68; --amber:#a25a09;
  --violet:#5b3a9e; --rose:#9c2148; --indigo:#25439b; --leaf:#177a4b;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:#e6dfd0}
body{font-family:'Noto Naskh Arabic',serif;color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.45}
.kufi{font-family:'Noto Kufi Arabic',sans-serif}
.sans{font-family:'Noto Sans Arabic',sans-serif}
svg{display:block}

.sheet{width:420mm;height:297mm;display:flex;background:#e6dfd0;position:relative;margin:0 auto;overflow:hidden}
.page{
  width:207mm;height:297mm;padding:6.5mm 7mm 5.5mm;display:flex;flex-direction:column;
  gap:3mm;overflow:hidden;position:relative;
  background:radial-gradient(circle at 20% 8%,#fffdf7,#fffdf7 55%,#faf3e3 100%);
}
.page.left{background:radial-gradient(circle at 80% 6%,#fffdf7,#fffdf7 55%,#f7f2e6 100%)}
.fold{width:6mm;height:297mm;position:relative;background:#e9e2d3;display:flex;align-items:center;justify-content:center}
.fold:before{content:"";position:absolute;top:0;bottom:0;right:50%;border-right:.4mm dashed #b3a68c}
.fold span{position:relative;font-family:'Noto Kufi Arabic',sans-serif;font-size:5pt;color:#a2967e;
  background:#e9e2d3;padding:1.5mm 0;letter-spacing:.1em;writing-mode:vertical-rl}

/* ============ MASTHEAD ============ */
.masthead{
  position:relative;display:flex;align-items:center;gap:3mm;padding:4mm 4mm 4mm 4mm;
  border-radius:3mm;color:#f7f1de;overflow:hidden;
  background:
    radial-gradient(circle at 85% -20%,rgba(214,178,80,.35),transparent 60%),
    linear-gradient(135deg,#0a3d28 0%,#0f5a3a 45%,#0b4630 100%);
  box-shadow:0 1.2mm 3mm rgba(10,50,35,.22);
  border-bottom:.9mm solid var(--gold);
}
.masthead:after{content:"";position:absolute;inset:1.4mm;border:.25mm solid rgba(233,205,126,.35);border-radius:2.2mm;pointer-events:none}
.mast-text{flex:1;text-align:center;z-index:1}
.kicker{font-family:'Noto Sans Arabic',sans-serif;font-size:6.6pt;letter-spacing:.06em;color:#e5cf94;margin-bottom:.8mm}
.masthead h1{font-family:'Noto Kufi Arabic',sans-serif;font-weight:800;font-size:23pt;line-height:1.15;
  color:#fffdf3;text-shadow:0 .4mm 0 rgba(0,0,0,.25)}
.masthead .sub{font-size:8.4pt;color:#dccfa9;margin-top:.8mm}
.badge{width:23mm;z-index:1;text-align:center;padding:2.2mm 1mm;border:.3mm solid rgba(233,205,126,.5);
  border-radius:2mm;background:rgba(255,255,255,.07);display:flex;flex-direction:column;gap:.4mm;justify-content:center}
.badge .b-top{font-family:'Noto Sans Arabic',sans-serif;font-size:5.6pt;color:#e5cf94;letter-spacing:.04em}
.badge strong{font-family:'Noto Kufi Arabic',sans-serif;font-size:8.4pt;color:#fffdf3;line-height:1.25}
.badge .b-num{font-size:14pt;color:#f4dc9a;line-height:1}
/* ============ INTRO NOTEBOOK ============ */
.intro{position:relative;padding:3mm 9mm 3mm 4mm;border-radius:2.2mm;
  background:repeating-linear-gradient(to bottom,#fffdf4 0,#fffdf4 6mm,#e7edf7 6mm,#e7edf7 6.2mm);
  border:.3mm solid var(--line);box-shadow:0 .6mm 1.4mm rgba(60,50,20,.08)}
.intro:before{content:"";position:absolute;top:0;bottom:0;right:6.5mm;border-right:.35mm solid #d98e86;opacity:.75}
.intro .holes{position:absolute;top:2.5mm;bottom:2.5mm;right:1.6mm;display:flex;flex-direction:column;justify-content:space-between}
.intro .holes i{width:2.2mm;height:2.2mm;border-radius:50%;background:#e3dccb;box-shadow:inset 0 .3mm .6mm rgba(0,0,0,.15);display:block}
.sec-label{font-family:'Noto Kufi Arabic',sans-serif;font-size:7.4pt;color:var(--green);display:flex;align-items:center;gap:1.4mm;margin-bottom:1mm}
.sec-label .dot{width:2mm;height:2mm;background:var(--gold);border-radius:50%}
.intro p{font-size:8.9pt;line-height:1.9;text-align:justify;color:#243029}
.intro b{color:var(--green)}

/* ============ CONCEPT ============ */
.concept{display:flex;gap:3mm;align-items:stretch;padding:3mm;border-radius:2.5mm;
  background:linear-gradient(180deg,#f1faf4,#e8f5ec);border:.35mm solid var(--mintline)}
.concept .txt{flex:1}
.concept h3{font-family:'Noto Kufi Arabic',sans-serif;font-size:10pt;color:var(--green);display:flex;align-items:center;gap:1.5mm;margin-bottom:1.4mm}
.concept h3 .pill{font-family:'Noto Sans Arabic',sans-serif;font-size:5.6pt;background:var(--green);color:#fdf8e7;
  padding:.6mm 1.8mm;border-radius:2mm;letter-spacing:.03em}
.concept p{font-size:8.5pt;line-height:1.85;text-align:justify}
.concept .fig{width:36mm;display:flex;align-items:center;justify-content:center;position:relative}
.concept .fig .bubble{position:absolute;top:-1mm;right:-1mm;background:#fff;border:.3mm solid var(--goldline);
  border-radius:2mm;font-family:'Noto Kufi Arabic',sans-serif;font-size:6.2pt;color:var(--amber);padding:.8mm 1.6mm;
  box-shadow:0 .4mm 1mm rgba(0,0,0,.07)}

/* ============ 4 CARDS ============ */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:2.6mm}
.card{background:#fffdf6;border:.3mm solid var(--line);border-radius:2.4mm;padding:2.4mm 2mm 2.6mm;
  text-align:center;position:relative;overflow:hidden;box-shadow:0 .5mm 1.2mm rgba(60,50,20,.06)}
.card:before{content:"";position:absolute;top:0;left:0;right:0;height:1.4mm;background:var(--c)}
.card .ic{width:13mm;height:13mm;margin:2.4mm auto 1.6mm;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--ct);color:var(--c)}
.card h4{font-family:'Noto Kufi Arabic',sans-serif;font-size:8pt;color:var(--ink);line-height:1.5;margin-bottom:.7mm}
.card small{display:block;font-size:6.4pt;color:var(--muted);line-height:1.55}
/* ============ KEY POINTS ============ */
.points{border:.4mm dashed var(--gold);border-radius:2.4mm;background:#fffcf1;padding:3mm;display:flex;gap:3mm}
.points .list{flex:1}
.points h3{font-family:'Noto Kufi Arabic',sans-serif;font-size:9.4pt;color:var(--green);display:flex;align-items:center;gap:1.6mm;margin-bottom:1.6mm}
.points ul{list-style:none;display:flex;flex-direction:column;gap:1.5mm}
.points li{display:flex;gap:1.8mm;font-size:8.3pt;line-height:1.7;align-items:flex-start}
.points li .tick{flex:0 0 auto;width:4mm;height:4mm;border-radius:50%;background:var(--green2);color:#fff;
  display:flex;align-items:center;justify-content:center;margin-top:.7mm}
.points li .tick svg{width:2.4mm;height:2.4mm}
.points li b{color:var(--green)}
.scene{width:52mm;border-radius:2mm;background:#eef6f1;border:.3mm solid var(--mintline);padding:2.2mm;display:flex;flex-direction:column;gap:1.2mm}
.scene .sh{display:flex;align-items:center;gap:1.2mm;font-family:'Noto Kufi Arabic',sans-serif;font-size:6.8pt;color:var(--teal)}
.scene .art{flex:1;border-radius:1.6mm;background:#fff;border:.3mm dashed #c9dccf;display:flex;align-items:center;justify-content:center;padding:1mm}
.scene p{font-size:7pt;line-height:1.65;color:#37503f}

/* ============ DID YOU KNOW ============ */
.dyk{position:relative;display:flex;gap:3mm;align-items:center;padding:2.6mm 3mm;border-radius:3mm 3mm 3mm 3mm;
  background:linear-gradient(120deg,#fdf4d6,#fbecc4);border:.35mm solid var(--goldline)}
.dyk:after{content:"";position:absolute;right:16mm;bottom:-2.2mm;width:4mm;height:4mm;background:#fbecc4;
  border-left:.35mm solid var(--goldline);border-bottom:.35mm solid var(--goldline);transform:rotate(-45deg)}
.dyk .lamp{width:9mm;height:9mm;flex:0 0 auto;color:var(--amber)}
.dyk .body{flex:1}
.dyk h4{font-family:'Noto Kufi Arabic',sans-serif;font-size:8pt;color:var(--amber);margin-bottom:.6mm}
.dyk p{font-size:7.8pt;line-height:1.7;color:#5b4516}
.page-strip{display:flex;align-items:center;justify-content:space-between;gap:2mm;
  font-family:'Noto Kufi Arabic',sans-serif;font-size:7pt;color:#f7f1de;
  background:linear-gradient(90deg,#0b4630,#146b48);border-radius:2mm;padding:1.8mm 3mm;letter-spacing:.03em}
.page-strip .thin{font-family:'Noto Sans Arabic',sans-serif;font-size:6pt;color:#d9c99f}
/* ============ ACTIVITIES ============ */
.acts{flex:1;display:flex;flex-direction:column;gap:2.4mm;min-height:0}
.row{display:grid;gap:2.4mm}
.row.two{grid-template-columns:1fr 1fr}
.row.wide{grid-template-columns:1.12fr .88fr}
.act{border:.35mm solid var(--c);border-radius:2.4mm;background:var(--ct);padding:2.2mm 2.8mm 2.4mm;
  display:flex;flex-direction:column;min-height:0;box-shadow:0 .4mm 1mm rgba(60,50,20,.05)}
.act-head{display:flex;align-items:center;gap:1.8mm;margin-bottom:1.4mm}
.act-head .chip{width:7mm;height:7mm;border-radius:1.8mm;background:var(--c);color:#fff;display:flex;
  align-items:center;justify-content:center;flex:0 0 auto}
.act-head .chip svg{width:4.4mm;height:4.4mm}
.act-head h3{font-family:'Noto Kufi Arabic',sans-serif;font-size:8.6pt;color:var(--c);line-height:1.3}
.act-head .num{margin-inline-start:auto;font-family:'Noto Sans Arabic',sans-serif;font-size:5.6pt;color:var(--c);
  border:.25mm solid var(--c);border-radius:1.4mm;padding:.2mm 1.4mm;opacity:.85}
.act .hint{font-family:'Noto Sans Arabic',sans-serif;font-size:6pt;color:var(--muted);margin-bottom:1.2mm}

.qlist{list-style:none;display:flex;flex-direction:column;gap:1.5mm}
.qlist li{display:flex;gap:1.6mm;font-size:8.2pt;line-height:1.7}
.qlist .n{width:4.2mm;height:4.2mm;border-radius:50%;background:var(--c);color:#fff;
  font-family:'Noto Sans Arabic',sans-serif;font-size:5.8pt;display:flex;align-items:center;justify-content:center;
  flex:0 0 auto;margin-top:.9mm}
.lines{display:flex;flex-direction:column;gap:2.6mm;margin-top:1mm}
.lines i{display:block;border-bottom:.25mm dotted #b9b09a;height:0}

.tf{list-style:none;display:flex;flex-direction:column;gap:1.5mm}
.tf li{display:flex;align-items:flex-start;gap:1.6mm;font-size:8pt;line-height:1.65}
.tf .st{flex:1}
.tf .boxes{display:flex;gap:1.2mm;flex:0 0 auto;margin-top:.4mm}
.tf .boxes span{width:6mm;height:4.4mm;border:.25mm solid var(--c);border-radius:.9mm;background:#fff;
  font-family:'Noto Sans Arabic',sans-serif;font-size:5pt;color:var(--c);display:flex;align-items:center;justify-content:center}

.blank{display:inline-block;min-width:20mm;border-bottom:.3mm dotted var(--c);height:3.4mm;margin:0 1mm}

.ws{display:flex;gap:2.6mm;align-items:flex-start}
.ws-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:.55mm;direction:rtl;flex:0 0 auto}
.ws-grid span{width:5.8mm;height:5.8mm;display:flex;align-items:center;justify-content:center;
  border:.22mm solid #d7cfba;border-radius:.7mm;background:#fffdf7;font-size:8.2pt;line-height:1}
.ws-side{flex:1;min-width:0}
.ws-side .ttl{font-family:'Noto Sans Arabic',sans-serif;font-size:5.8pt;color:var(--muted);margin-bottom:1mm}
.ws-words{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:.6mm 2mm;font-size:7.4pt}
.ws-words li:before{content:"◂ ";color:var(--c);font-size:6pt}
.match{display:grid;grid-template-columns:1fr 4mm 1fr;gap:1.6mm;align-items:start}
.match .col{display:flex;flex-direction:column;gap:1.3mm}
.match .item{display:flex;gap:1.4mm;font-size:7.4pt;line-height:1.55;align-items:flex-start;
  background:#fffdf7;border:.22mm solid var(--line);border-radius:1.2mm;padding:1.1mm 1.6mm}
.match .item .lb{flex:0 0 auto;width:3.6mm;height:3.6mm;border-radius:50%;display:flex;align-items:center;
  justify-content:center;font-family:'Noto Sans Arabic',sans-serif;font-size:5.4pt;color:#fff;background:var(--c)}
.match .item .lb.lt{background:#7b8794}
.match .mid{display:flex;flex-direction:column;justify-content:space-around;align-items:center;
  height:100%;color:var(--c);font-size:8pt}
.match .hdr{font-family:'Noto Kufi Arabic',sans-serif;font-size:6.2pt;color:var(--c) ;text-align:center;margin-bottom:.6mm}

.think p{font-size:8pt;line-height:1.75;margin-bottom:1.2mm}
.think .tip{font-family:'Noto Sans Arabic',sans-serif;font-size:6pt;color:var(--c);background:#fffdf7;
  border:.22mm dashed var(--c);border-radius:1.2mm;padding:1mm 1.6mm;display:inline-block}

.final{display:flex;gap:2.6mm;align-items:flex-start}
.final .cup{flex:0 0 auto;width:11mm;height:11mm;color:var(--c)}
.final .txt{flex:1}
.final p{font-size:8.4pt;line-height:1.8}
.final .rule{display:flex;flex-direction:column;gap:3.2mm;margin-top:1.4mm}
.final .rule i{display:block;border-bottom:.25mm dotted #b9b09a;height:0}

/* ============ PRINT ============ */
@page{size:420mm 297mm;margin:0}
@media print{
  html,body{background:#fff}
  .sheet{margin:0;box-shadow:none;page-break-after:avoid}
}
@media screen{
  body{padding:8mm 0}
  .sheet{box-shadow:0 4mm 10mm rgba(0,0,0,.18)}
}

/* ============ مقياس الطباعة والتوزيع ============ */
.masthead{padding:4.6mm 4mm}
.masthead h1{font-size:29pt}
.masthead .sub{font-size:10pt}
.kicker{font-size:7.2pt}
.badge .b-top{font-size:6pt}
.badge strong{font-size:8.8pt}
.intro{padding:3.4mm 9mm 3.4mm 4.5mm}
.intro p{font-size:10.4pt;line-height:2.1}
.sec-label{font-size:8.2pt}
.concept{padding:3.4mm}
.concept h3{font-size:11pt}
.concept p{font-size:10.1pt;line-height:1.95}
.concept .fig{width:42mm}
.card{padding:2.8mm 2.2mm 3mm}
.card .ic{width:15mm;height:15mm;margin:2.6mm auto 1.8mm}
.card h4{font-size:9.2pt}
.card small{font-size:7.2pt;line-height:1.6}
.points{flex:1;padding:3.4mm}
.points h3{font-size:10.4pt}
.points li{font-size:9.8pt;line-height:1.85}
.points .list{display:flex;flex-direction:column}
.points ul{flex:1;justify-content:space-evenly}
.scene{width:63mm}
.scene p{font-size:8.3pt;line-height:1.8}
.dyk{padding:3mm}
.dyk p{font-size:9.2pt;line-height:1.8}
.dyk h4{font-size:9pt}
.act-head h3{font-size:9.8pt}
.qlist li{font-size:9.7pt;line-height:1.9}
.tf li{font-size:9.4pt;line-height:1.85}
.match .item{font-size:8.7pt;padding:1.3mm 1.7mm}
.ws-grid span{width:7.4mm;height:7.4mm;font-size:10pt}
.ws-words{font-size:8.6pt}
.think p{font-size:9.6pt;line-height:1.9}
.final p{font-size:9.9pt;line-height:1.95}
.act{height:100%}
.acts>.row:nth-child(1){flex:205}
.acts>.row:nth-child(2){flex:225}
.acts>.row:nth-child(3){flex:238}
.acts>.row:nth-child(4){flex:152}
.lines.grow{flex:1;justify-content:space-evenly}
.qlist.spread{flex:1;justify-content:space-evenly}
.tf.spread{flex:1;justify-content:space-evenly}
.ws.center{flex:1;align-items:center}
.match{height:100%}
.match .col{justify-content:space-between;height:100%}
.rule.grow{flex:1;justify-content:space-evenly}

/* ============ موازنة نهائية ============ */
.intro{flex:.85}
.concept{flex:.65}
.cards{flex:.85}
.points{flex:2.05}
.card{display:flex;flex-direction:column;justify-content:center}
.acts{gap:2.8mm}
.row{gap:2.8mm}
.act{padding:2.5mm 3mm 2.7mm}
.act-head h3{font-size:10.1pt}
.qlist li{font-size:10.3pt;line-height:1.9}
.tf li{font-size:10pt;line-height:1.85}
.match .item{font-size:9.2pt;padding:1.4mm 1.8mm}
.ws-grid span{width:8mm;height:8mm;font-size:10.6pt}
.ws-words{font-size:9pt}
.think p{font-size:10.1pt}
.final p{font-size:10.1pt}
.acts>.row:nth-child(4){flex:0 1 auto}
