/* أكاديمية رزين — هوية "ملف الحادثة"
   يُحمَّل بعد أنماط كل صفحة، فيغيّر الألوان والخط والمكوّنات دون المساس بالمنطق.
   لتغيير الخط لاحقًا: عدّلي --ar و --display فقط. */

@font-face{
  font-family:"Hail";
  src:url("/assets/fonts/hail-light.ttf") format("truetype");
  font-weight:400;font-style:normal;font-display:swap;
}

:root{
  --mint:#B4E4D6; --lemon:#FFF6A9; --peach:#FFCA88; --rose:#DE7272;
  --bg:#FFFBE3; --panel:#FFFFFF; --ink:#1E3B36; --muted:#3D5650; --faint:#5E716B; --line:#E5DBAE;
  --brand:#1E3B36; --brand-deep:#0F2622; --brand-soft:#B4E4D6;
  --coral:#A23E3E; --coral-soft:#F3B9B9; --amber:#7A5200;
  --ar:"Hail","Almarai",system-ui,sans-serif;
  --display:"Hail","Readex Pro","Almarai",sans-serif;
  --edge:1.5px solid var(--ink);
  --lift:8px 8px 0 var(--mint);
  color-scheme:light;
}
[dir="rtl"]{--lift:-8px 8px 0 var(--mint)}

body{background:var(--bg);color:var(--ink);font-family:var(--ar)}
h1,h2,h3,h4{color:var(--ink);font-family:var(--display)}
:focus-visible{outline-color:var(--rose)}

/* الشريط العلوي: شريط نعناعي بعرض الشاشة */
.top,.spine{
  background:var(--mint);
  box-shadow:0 0 0 100vmax var(--mint),0 1.5px 0 100vmax var(--ink);
  clip-path:inset(0 -100vmax -2px);
  border-bottom:0;
  margin-bottom:.5rem;
}
.top,.top nav{flex-wrap:wrap}
.top nav a,.back,.navlink{color:var(--ink)}
.top nav a:hover,.navlink:hover{background:var(--lemon);color:var(--ink)}
.back:hover{color:var(--coral)}
.mark small{color:var(--muted)}

/* الأزرار */
.btn{background:var(--ink);color:var(--lemon);border-radius:.4rem;border:1.5px solid var(--ink)}
.btn:hover{background:var(--brand-deep);color:var(--lemon);text-decoration:none}
.btn.ghost{background:var(--panel);color:var(--ink);border-color:var(--ink)}
.btn.ghost:hover{background:var(--lemon)}
.btn.danger{background:var(--rose);color:var(--ink);border-color:var(--ink)}
.btn.danger:hover{background:#cf5f5f}

/* الحقول */
input,textarea,select,
input[type=email],input[type=password],input[type=text]{
  background:var(--bg);border:var(--edge);border-radius:.4rem;color:var(--ink);
}
input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--rose);outline-offset:1px;border-color:var(--ink)}
.check input{accent-color:var(--ink)}
.msg,.msg.err{color:var(--coral)}
.msg.ok{color:var(--ink);font-weight:700}

/* صفحات الحساب */
.box{border:var(--edge);border-radius:.4rem;box-shadow:var(--lift)}
.tabs{background:var(--bg);border:var(--edge);border-radius:.4rem}
.tabs button{color:var(--ink);border-radius:.3rem}
.tabs button[aria-selected="true"]{background:var(--lemon);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.note{background:var(--lemon);border:var(--edge);border-radius:.4rem}
.labrow{border-top-color:var(--line)}
.bar{background:var(--lemon);border:1px solid var(--ink)}
.bar i{background:var(--ink)}
.danger-zone{border:2px dashed var(--rose);border-radius:.4rem}
.danger-zone h2{color:var(--coral)}
.doc h2{color:var(--ink)}

/* صفحات المختبرات */
.kicker{color:var(--coral);font-weight:600}
.kicker::before{background:var(--rose);height:2px}
.side{border-inline-start:var(--edge)}
.progress,.stat .n{color:var(--ink)}
.lbl{color:var(--muted)}
.browser{border:var(--edge);border-radius:.4rem;box-shadow:var(--lift)}
.story{background:var(--lemon);border:var(--edge);border-radius:.4rem;padding:1.6rem 1.8rem;box-shadow:var(--lift);max-width:none}
.story p{color:var(--ink)}
.ledger{border-top:var(--edge)}
.step{border-bottom-color:var(--line)}
.step.current{background:var(--panel);box-shadow:inset 0 0 0 1.5px var(--ink);border-radius:.4rem;padding-inline:1rem;border-bottom-color:transparent}
.step.current .idx,.step.current .state{color:var(--coral)}
.step.solved .idx,.step.solved .state{color:var(--ink)}
.step.solved .state{background:var(--mint);border-radius:99px;padding:.15rem .6rem;justify-self:start}
.answer{color:var(--ink);font-weight:700}
.hint summary{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rose);text-underline-offset:4px}
.hint summary:hover{color:var(--coral)}
.hint[open] p{background:var(--peach);color:var(--ink);border-radius:.4rem;padding:.7rem .9rem}
code{background:var(--lemon);border-color:var(--line);color:var(--ink)}
.finish{border-top:var(--edge)}
.finish h2 span{color:var(--ink);background:linear-gradient(transparent 58%,var(--rose) 58%,var(--rose) 90%,transparent 90%);padding:0 .15em}
.disclaimer{border-top-color:var(--line);color:var(--faint)}

/* ملفات الأدلة (السياسة، الشيفرة) */
.file{background:var(--panel);color:var(--ink);border:var(--edge);border-radius:.4rem}
.file .fh{background:var(--mint);color:var(--ink);border-bottom:var(--edge)}
.file .fh b{color:var(--ink);font-weight:600}
.file .fh span{color:var(--muted)}
.file .k{color:#0E6B5C}.file .s{color:#8A5A00}.file .c{color:#6B7C77}
.file .warn{background:rgba(222,114,114,.2)}

/* التذييل */
footer,.foot{color:var(--faint)}
footer{border-top-color:var(--ink)}
.foot a,footer a{color:var(--ink)}
.foot a:hover,footer a:hover{color:var(--coral)}

/* الختم الكامل في الهيدر */
.brand svg,.glyph{width:3.1rem;height:3.1rem}
