/* ============================================================
   KITAB KA ILM (ʿIlm al-Kitāb) — the complete-case reading page.
   Layers on the shared design system (styles.css). Loaded only by
   kitab-ka-ilm.html. Mirrors the concordance.css precedent: page-only
   styles, no edits to the shared tokens.
   ============================================================ */

.kk-intro{ max-width:var(--wrap-narrow); }
.kk-sub{ font-family:var(--ui); font-size:.86rem; letter-spacing:.02em;
  color:var(--patina-hi); margin:.2rem 0 1rem; }

/* the reading-instructions callout under the title */
.kk-howto{ font-family:var(--ui); font-size:.92rem; color:var(--on-ink);
  background:rgba(92,140,130,.07); border:1px solid rgba(92,140,130,.26);
  border-left:2px solid var(--patina); border-radius:0 var(--r) var(--r) 0;
  padding:.9rem 1.2rem; margin-top:1.3rem; }

.kk-section{ scroll-margin-top:84px; }
.kk-section .wrap--narrow > h2{ margin-top:.2rem; }

/* ---- Movement verdict lead block ---- */
.kk-verdict{ background:radial-gradient(680px 280px at 28% 0%, rgba(194,162,74,.08), transparent 60%), var(--ink-2);
  border:1px solid var(--line-strong); border-left:2px solid var(--brass);
  border-radius:0 var(--r) var(--r) 0; padding:1.3rem 1.5rem; margin:1.2rem 0 1.8rem; }
.kk-verdict__k{ display:block; font-family:var(--ui); font-size:.64rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--brass-hi); margin-bottom:.5rem; }
.kk-verdict p{ margin:0; font-size:1.02rem; line-height:1.7; color:var(--bone); }
.kk-verdict em{ color:var(--brass-hi); font-style:italic; }

/* ---- Intro / connective prose inside a section ---- */
.kk-prose{ color:var(--on-ink); line-height:1.75; max-width:68ch; margin:0 0 1.3rem; }
.kk-prose em{ color:var(--bone); }

/* ---- Verse component ---- */
.kk-verse{ position:relative; border-top:1px solid var(--line);
  padding:1.15rem 0 1.15rem 0; scroll-margin-top:84px; }
.kk-verse:first-of-type{ border-top:0; }
.kk-ref{ display:inline-block; font-family:var(--mono); font-size:.72rem; letter-spacing:.03em;
  color:var(--brass-hi); background:rgba(194,162,74,.1); border:1px solid rgba(194,162,74,.28);
  border-radius:2px; padding:.08em .5em; text-decoration:none; margin-bottom:.6rem; }
.kk-ref:hover{ background:rgba(194,162,74,.2); color:var(--bone); }
.kk-verse .ar{ display:block; text-align:right; line-height:2.05;
  color:var(--bone); margin:.1rem 0 .55rem; }
.kk-en{ color:var(--on-ink); line-height:1.72; max-width:70ch; margin:.1rem 0 0; }
.kk-note{ font-family:var(--ui); font-size:.86rem; line-height:1.6; color:var(--muted-ink);
  border-left:2px solid var(--patina); padding:.1rem 0 .1rem .8rem; margin:.7rem 0 0; }
.kk-note em{ color:var(--patina-hi); font-style:italic; }
.kk-note--free{ margin-top:1rem; }

/* ---- Method footer note ---- */
.kk-method{ font-family:var(--ui); font-size:.9rem; line-height:1.7; color:var(--muted-ink);
  border-left:2px solid var(--brass); background:rgba(194,162,74,.06);
  border-radius:0 var(--r) var(--r) 0; padding:1rem 1.2rem; max-width:none; }
.kk-method em{ font-style:italic; color:var(--on-ink); }

@media (max-width:640px){
  .kk-verse .ar{ line-height:1.95; }
  .kk-verdict{ padding:1.1rem 1.15rem; }
}

/* ============================================================
   Gated proofs layer (kitab-ka-ilm.js)
   ============================================================ */

/* the "sealed" banner near the top */
.kk-gate__card{ border:1px solid var(--line-strong); border-left:2px solid var(--brass);
  background:radial-gradient(620px 240px at 22% 0%, rgba(194,162,74,.08), transparent 60%), var(--ink-2);
  border-radius:0 var(--r) var(--r) 0; padding:1.2rem 1.4rem; }
.kk-gate__k{ font-family:var(--ui); font-size:.66rem; font-weight:600; letter-spacing:.16em;
  text-transform:uppercase; color:var(--brass-hi); margin:0 0 .5rem; }
.kk-gate__p{ margin:0; color:var(--on-ink); font-size:.97rem; line-height:1.65; }
.kk-gate__count{ color:var(--muted-ink); font-family:var(--ui); font-size:.88rem; }
#kk-gate.is-unlocked .kk-gate__card{ border-left-color:var(--patina); }
#kk-gate.is-unlocked .kk-gate__k{ color:var(--patina-hi); }

/* per-Movement proof box */
.kk-proof{ margin-top:1.8rem; border:1px solid var(--line); border-radius:var(--r);
  background:var(--ink-2); overflow:hidden; }
.kk-proof__bar{ display:flex; align-items:center; gap:.7rem; flex-wrap:wrap;
  padding:.8rem 1rem; font-family:var(--ui); }
.kk-proof__lock{ color:var(--muted-ink); flex:none; }
.kk-proof__label{ font-size:.72rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted-ink); }
.kk-proof__status{ font-size:.82rem; color:var(--brass-hi); margin-left:.2rem;
  font-variant-numeric:tabular-nums; }
.kk-proof__btn{ margin-left:auto; font-family:var(--ui); font-size:.8rem; font-weight:600;
  color:var(--ink); background:var(--brass); border:1px solid var(--brass);
  border-radius:var(--r); padding:.42em 1em; cursor:pointer; transition:background .15s, opacity .15s; }
.kk-proof__btn:hover:not(:disabled){ background:var(--brass-hi); border-color:var(--brass-hi); }
.kk-proof__btn:disabled{ background:transparent; color:var(--muted-ink);
  border-color:var(--line-strong); cursor:not-allowed; }
.kk-proof__btn:focus-visible{ outline:2px solid var(--brass-hi); outline-offset:2px; }

/* state cues on the bar */
.kk-proof.is-active{ border-color:rgba(194,162,74,.4); }
.kk-proof.is-active .kk-proof__lock{ color:var(--brass); }
.kk-proof.is-read .kk-proof__label,
.kk-proof.is-read .kk-proof__lock{ color:var(--patina-hi); }
.kk-proof.is-locked{ opacity:.7; }

/* the revealed body */
.kk-proof__body{ padding:0 1.2rem 1.3rem; border-top:1px solid var(--line); }
.kk-proof.is-open{ border-color:var(--line-strong);
  background:radial-gradient(700px 300px at 30% 0%, rgba(92,140,130,.07), transparent 62%), var(--ink-2); }
.kk-proof.is-open .kk-proof__label{ color:var(--patina-hi); }
.kk-proof.is-open .kk-proof__bar{ border-bottom:1px solid var(--line); }
.kk-proof.is-open .kk-proof__body{ border-top:0; padding-top:1.1rem;
  animation:kk-reveal .5s ease both; }
.kk-proof.is-open.no-anim .kk-proof__body{ animation:none; }
@keyframes kk-reveal{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce){ .kk-proof__body{ animation:none !important; } }

/* proof content */
.kk-proof__pt{ font-family:var(--display); font-size:1.18rem; color:var(--bone);
  margin:1.3rem 0 .5rem; }
.kk-proof__pt:first-child{ margin-top:.3rem; }
.kk-proof__p{ color:var(--on-ink); line-height:1.72; margin:.5rem 0; max-width:70ch; }
.kk-proof__p em{ color:var(--bone); font-style:italic; }
.kk-proof__v{ border-left:2px solid var(--patina); padding:.5rem 0 .5rem .9rem; margin:.7rem 0; }
.kk-proof__v .ar{ display:block; text-align:right; line-height:1.95; color:var(--bone);
  font-size:1.35rem; margin:.1rem 0 .4rem; }
.kk-proof__v .kk-ref{ margin-bottom:.45rem; }
.kk-proof__g{ font-family:var(--ui); font-size:.88rem; line-height:1.6; color:var(--muted-ink); margin:0; }