/* =========================================================================
   لارتيستو — واجهة الإعلام الثقافي البديل
   الفكرة: مطبوع رخيص بحبرين، يُلصق على جدار. كل قسم فضاء ثقافي قائم بذاته.
   ========================================================================= */

body .lart,
body .lart * { box-sizing: border-box; }

body .lart {
  --lart-vw: 100vw;
  --ink: var(--lart-ink);
  font-family: var(--lart-ui), system-ui, sans-serif;
  color: var(--lart-text);
  direction: rtl;
  text-align: start;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

/* دفاعا عن القالب: لا نتّكل على أن أفادا يعرّف هذا الصنف. */
.lart .screen-reader-text {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

body section.lart,
body header.lart,
body footer.lart {
  position: relative;
  display: block;
  width: var(--lart-vw);
  margin-inline: calc(50% - var(--lart-vw) / 2);
  padding: clamp(38px, 5vw, 76px) 0;
  background: var(--lart-paper);
  overflow: clip;
}

body .lart.lart-snip,
body .lart.lart-work,
body .lart.lart-sum,
body .lart.lart-margin,
body .lart.lart-listen,
body .lart.lart-body { width: auto; margin-inline: 0; }

body .lart h1, body .lart h2, body .lart h3,
body .lart p, body .lart ul, body .lart ol, body .lart dl,
body .lart blockquote, body .lart figure {
  margin: 0; padding: 0;
}
body .lart ul, body .lart ol { list-style: none; }
body .lart a { color: inherit; text-decoration: none; }
body .lart img { max-width: 100%; height: auto; display: block; }
body .lart button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }

/* ——— حبيبات الورق فوق كل شيء ——— */
body section.lart::after,
body header.lart::after,
body footer.lart::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 5;
  background-image: var(--lart-grain);
  background-size: 160px 160px;
  opacity: var(--lart-grain-o);
  mix-blend-mode: multiply;
}

/* ——— لبنات مشتركة ——— */
.lart-in, .lart-wall__in, .lart-lead__in, .lart-stage__in, .lart-reel__in,
.lart-sleeve__in, .lart-salle__in, .lart-marge__in, .lart-agenda__in,
.lart-voices__in, .lart-archive__in, .lart-grid__in, .lart-footer__in,
.lart-mast__in, .lart-topbar__in, .lart-portrait__in, .lart-tonight .lart-board {
  position: relative; z-index: 2;
  width: min(100% - 2 * clamp(16px, 4vw, 54px), var(--lart-max));
  margin-inline: auto;
}

.lart-mis { position: relative; display: inline-block; }
.lart-mis::before {
  content: attr(data-t); position: absolute; inset: 0;
  transform: translate(calc(2px * var(--lart-misreg)), calc(-2px * var(--lart-misreg)));
  color: var(--ink); mix-blend-mode: multiply; opacity: .5;
  pointer-events: none; z-index: -1;
}

.lart-kicker {
  display: inline-block; font-size: .68rem; font-weight: 700;
  letter-spacing: .14em; text-transform: none;
  color: var(--ink);
}
.lart-kicker--stamp {
  padding: .26em .62em .3em; border: 1.5px solid currentColor;
  transform: rotate(-1.4deg); background: rgba(255,255,255,.06);
}

.lart-meta {
  display: flex; flex-wrap: wrap; gap: .45em; align-items: center;
  font-size: .76rem; color: var(--lart-mute); margin-top: .55em;
}
.lart-meta i { opacity: .45; font-style: normal; }
.lart-meta__a { color: var(--lart-text); font-weight: 500; }

.lart-btn {
  display: inline-flex; align-items: center; gap: .5em;
  padding: .7em 1.25em; margin-top: 1.1em;
  background: var(--ink); font-weight: 700; font-size: .88rem;
  border: 0; box-shadow: 4px 4px 0 var(--lart-text);
  transition: transform .14s, box-shadow .14s;
}
/* أخصّ من «body .lart a { color: inherit }» فلا يبتلع لونَها الأبيضَ */
body .lart a.lart-btn,
body .lart a.lart-btn:hover { color: #fff; }
.lart-btn:hover { transform: translate(2px, 2px); box-shadow: 2px 2px 0 var(--lart-text); }
.lart-btn .lart-i { transform: scaleX(1); }

.lart-head { position: relative; z-index: 2; margin-bottom: clamp(20px, 3vw, 38px); }
.lart-head__in { display: flex; align-items: flex-end; gap: 1em; flex-wrap: wrap; }
.lart-head__t {
  font-family: var(--lart-display), sans-serif; font-weight: 400;
  font-size: clamp(1.9rem, 4.3vw, 3.1rem); line-height: 1; letter-spacing: 0;
}
.lart-head__s { font-size: .9rem; color: var(--lart-mute); padding-bottom: .35em; }
.lart-head__more {
  margin-inline-start: auto; font-size: .82rem; font-weight: 700; color: var(--ink);
  display: inline-flex; align-items: center; gap: .35em; padding-bottom: .4em;
}
.lart-head__more .lart-i { transition: transform .15s; }
.lart-head__more:hover .lart-i { transform: translateX(-4px); }
.lart-head__rule {
  display: block; height: 3px; margin-top: .55em;
  background: var(--lart-text);
  box-shadow: 0 5px 0 -3.5px var(--ink);
}
.lart-head.is-dark .lart-head__t { color: var(--lart-paper); }
.lart-head.is-dark .lart-head__s { color: rgba(255,255,255,.55); }
.lart-head.is-dark .lart-head__rule { background: rgba(255,255,255,.75); }

.lart-note {
  margin: 1em auto; padding: .8em 1em; max-width: 44em;
  border: 1.5px dashed var(--ink); color: var(--ink);
  font-size: .85rem; text-align: center; background: rgba(255,255,255,.4);
}

/* علامات القصّ: نحن مطبوع */
.lart-crop { position: relative; width: 18px; height: 18px; flex: none; opacity: .5; }
.lart-crop::before, .lart-crop::after {
  content: ""; position: absolute; background: currentColor;
}
.lart-crop::before { inset-block: 0; inset-inline-start: 8px; width: 1px; }
.lart-crop::after { inset-inline: 0; top: 8px; height: 1px; }

/* شريط لاصق */
.lart-tape {
  position: absolute; width: 92px; height: 26px; z-index: 6;
  background: linear-gradient(105deg, rgba(255,255,255,.42), rgba(255,255,255,.16) 45%, rgba(255,255,255,.4));
  box-shadow: 0 1px 3px rgba(0,0,0,.28);
  backdrop-filter: blur(.5px);
  -webkit-mask-image: linear-gradient(#000, #000);
}
.lart-tape::after {
  content: ""; position: absolute; inset: 0;
  background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.28) 0 2px, transparent 2px 5px);
  opacity: .5;
}
.lart-tape--tl { inset-block-start: -13px; inset-inline-start: 22px; transform: rotate(-7deg); }
.lart-tape--br { inset-block-end: -11px; inset-inline-end: 30px; transform: rotate(5deg); }
.lart-tape--tc { inset-block-start: -12px; inset-inline-start: 50%; transform: translateX(50%) rotate(-3deg); width: 68px; }

/* =========================================================================
   صورة المادة — ثلاث معالجات لا واحدة (Lart_Options::photo_type):
   لماذا؟ لأن غسل كل صورة بحبر صنفها آليا يجعل كل مادة الصنف الواحد تبدو
   بهوية واحدة، بصرف النظر عمّا تحمله الصورة فعلا. الحبر هنا خيار عدد كل
   مادة يحمله «دَور طبعها»، لا قانونا يفرضه الصنف على كل ما فيه.
   ========================================================================= */
.lart-duo {
  position: relative; display: block; overflow: hidden; isolation: isolate;
  background: var(--duo-lo, var(--ink));
  aspect-ratio: var(--ratio, 4 / 3);
}
.lart-duo img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .5s cubic-bezier(.2,.7,.3,1);
}
.lart-duo__hi {
  position: absolute; inset: 0; pointer-events: none;
  background: var(--duo-hi, var(--lart-paper));
  mix-blend-mode: multiply;
}
.lart-duo__dot {
  position: absolute; inset: 0; pointer-events: none; color: #000;
  background-image: radial-gradient(currentColor 36%, transparent 37%);
  background-size: 3px 3px;
  opacity: var(--lart-half-o); mix-blend-mode: multiply;
}
.lart-duo.is-empty {
  display: grid; place-items: center; background: var(--ink);
}
.lart-duo.is-empty b {
  font-family: var(--lart-display), sans-serif; font-size: 4rem;
  color: var(--lart-paper); opacity: .85; line-height: 1;
}
.lart-duo--tiny { aspect-ratio: 1; }
.lart-duo--sq { aspect-ratio: 1; }
.lart-duo--wide { aspect-ratio: 21 / 9; }
.lart-duo--poster { aspect-ratio: auto; height: 100%; }
.lart-duo--lead { aspect-ratio: 4 / 5; }
.lart-duo--frame { aspect-ratio: 16 / 10; }
.lart-duo--act { aspect-ratio: 3 / 4; }
.lart-duo--hang { aspect-ratio: var(--r, 4 / 5); }
.lart-duo--free { aspect-ratio: var(--ratio, 4 / 3); }

/* — duo: حبران، كالتقنية الأصلية، وفوقها شبح إزاحة تسجيل — */
.lart-duo--is-duo img {
  filter: grayscale(1) brightness(1.1) contrast(1.12);
  mix-blend-mode: screen;
}
/* نسخة ثانية من الصورة نفسها بحبر اللوحة الثانية الثابت، مزاحة بضع بكسرات —
   كما تفعل مطبعة رخيصة حين لا تلتقي لوحتا الحبر تماما. */
.lart-duo__ghost {
  position: absolute; inset: 0; pointer-events: none;
  background-image: var(--img); background-size: cover; background-position: center;
  filter: grayscale(1) sepia(.55) hue-rotate(178deg) saturate(2.4) contrast(1.32) brightness(.84);
  mix-blend-mode: multiply;
  opacity: .28;
  transform: translate(3px, -2px) scale(1.008);
}
@media (max-width: 46.24em) {
  .lart-duo__ghost { opacity: .2; transform: translate(2px, -1.4px) scale(1.006); }
}

/* — mono: أبيض وأسود صرف، بلا حبر على الصورة، هالفتون أقوى بلا غسلة ورق — */
.lart-duo--is-mono { background: #201c19; }
.lart-duo--is-mono img {
  filter: grayscale(1) contrast(1.3) brightness(1.03);
}
.lart-duo--is-mono .lart-duo__hi { display: none; }
.lart-duo__dot--hi {
  background-size: 2.3px 2.3px;
  opacity: calc(var(--lart-half-o) * 1.9 + .16);
}

/* — natural: الصورة بلونها الكامل تقريبا، والحبر في إطار وبطاقة لا فوقها — */
.lart-duo--is-natural img {
  filter: saturate(.92) contrast(1.05) brightness(1.01);
}
.lart-duo--is-natural .lart-duo__hi { display: none; }
.lart-duo__frame {
  position: absolute; inset: 0; pointer-events: none;
  box-shadow: inset 0 0 0 3px var(--ink);
}
.lart-duo__chip {
  position: absolute; inset-block-end: 9px; inset-inline-start: 9px;
  width: 12px; height: 12px; background: var(--ink); pointer-events: none;
  box-shadow: 0 1px 3px rgba(0,0,0,.35);
}
.lart-duo--tiny .lart-duo__chip,
.lart-duo--sq .lart-duo__chip { width: 8px; height: 8px; inset-block-end: 6px; inset-inline-start: 6px; }

/* =========================================================================
   الشريط العلوي + الترويسة
   ========================================================================= */
body .lart.lart-topbar {
  padding: 0; background: var(--lart-text); color: var(--lart-paper);
  width: var(--lart-vw); margin-inline: calc(50% - var(--lart-vw) / 2);
  position: relative; z-index: 30;
}
.lart-topbar__in {
  display: flex; align-items: center; gap: 1em; min-height: 34px;
  font-size: .74rem; letter-spacing: .02em;
}
.lart-topbar__t { color: var(--lart-ink); font-weight: 700; }
.lart-topbar__s { margin-inline-start: auto; display: flex; gap: .9em; }
.lart-topbar__s a { opacity: .7; }
.lart-topbar__s a:hover { opacity: 1; color: var(--lart-ink); }
.lart-topbar__d { opacity: .62; }

body .lart.lart-mast {
  padding: 0; background: var(--lart-paper);
  border-bottom: 3px solid var(--lart-text);
  position: relative; z-index: 28;
}
body .lart.lart-mast.is-sticky { position: sticky; top: 0; }
.lart-mast__in {
  display: grid; align-items: center; gap: .4em 1.1em;
  grid-template-columns: auto 1fr auto;
  grid-template-areas: "brand tag tools" "nav nav nav";
  padding-block: .55em .1em;
}
.lart-brand { grid-area: brand; display: flex; flex-direction: column; line-height: .88; }
.lart-brand__ar {
  font-family: var(--lart-display), sans-serif;
  font-size: clamp(1.75rem, 3.6vw, 2.6rem); color: var(--lart-text);
}
.lart-brand__la {
  font-size: .56rem; letter-spacing: .48em; font-weight: 700;
  color: var(--lart-ink); padding-inline-start: .3em;
}
.lart-brand__img { max-height: 54px; width: auto; }
.lart-brand__tag {
  grid-area: tag; font-size: .74rem; color: var(--lart-mute);
  border-inline-start: 2px solid var(--lart-ink); padding-inline-start: .8em;
  align-self: center;
}
.lart-mast__tools { grid-area: tools; display: flex; align-items: center; gap: .5em; min-width: 0; }

.lart-nav { grid-area: nav; min-width: 0; }
.lart-nav ul {
  display: flex; gap: .15em; overflow-x: auto; scrollbar-width: none;
  border-top: 1px solid var(--lart-line); margin-top: .35em;
}
.lart-nav ul::-webkit-scrollbar { display: none; }
.lart-nav a {
  display: flex; align-items: center; gap: .42em; white-space: nowrap;
  padding: .65em .8em; font-size: .86rem; font-weight: 500;
  border-bottom: 3px solid transparent;
}
.lart-nav i {
  width: 7px; height: 7px; background: var(--ink); flex: none;
  transition: transform .16s;
}
.lart-nav a:hover { border-bottom-color: var(--ink); }
.lart-nav a:hover i { transform: scale(1.7) rotate(45deg); }

.lart-burger { display: none; padding: .45em; }

.lart-search { position: relative; display: flex; align-items: center; min-width: 0; }
.lart-search .lart-i {
  position: absolute; inset-inline-start: .55em; color: var(--lart-mute); pointer-events: none;
}
.lart-search input {
  width: 100%; min-width: 0; padding-block: .5em;
  padding-inline: 2em .7em;
  font: inherit; font-size: .82rem;
  background: var(--lart-paper-2); color: var(--lart-text);
  border: 1.5px solid var(--lart-line); border-radius: 0;
}
.lart-search--mast input { width: clamp(120px, 20vw, 230px); }
.lart-search input:focus { outline: 2px solid var(--lart-ink); outline-offset: 1px; }
.lart-search__out {
  position: absolute; inset-block-start: calc(100% + 4px); inset-inline: 0; z-index: 60;
  background: var(--lart-paper); border: 2px solid var(--lart-text);
  box-shadow: 6px 6px 0 rgba(0,0,0,.18); max-height: 62vh; overflow: auto;
}
.lart-search__out a {
  display: flex; gap: .6em; align-items: center; padding: .5em .6em;
  border-bottom: 1px solid var(--lart-line);
}
.lart-search__out a:last-child { border-bottom: 0; }
.lart-search__out a:hover { background: var(--lart-paper-2); }
.lart-search__out img { width: 42px; height: 42px; object-fit: cover; flex: none; filter: grayscale(1) contrast(1.15); }
.lart-search__out b { display: block; font-size: .84rem; font-weight: 600; }
.lart-search__out em { font-style: normal; font-size: .7rem; color: var(--ink); }
.lart-search__empty { padding: .8em; font-size: .82rem; color: var(--lart-mute); }

/* =========================================================================
   الجدار — الهيرو
   ========================================================================= */
body .lart.lart-wall {
  background: var(--lart-wall);
  padding-block: clamp(26px, 3.4vw, 52px) 0;
  color: var(--lart-paper);
}
.lart-wall__bg { position: absolute; inset: 0; z-index: 0; }
.lart-wall__grain {
  position: absolute; inset: 0;
  background-image: var(--lart-wallimg);
  background-size: 420px 420px; opacity: .16; mix-blend-mode: overlay;
}
.lart-wall__vig {
  position: absolute; inset: 0;
  background:
    radial-gradient(110% 80% at 72% 6%, rgba(255,246,228,.10), transparent 58%),
    radial-gradient(90% 70% at 20% 100%, rgba(0,0,0,.6), transparent 62%),
    linear-gradient(0deg, rgba(0,0,0,.5), rgba(0,0,0,.12) 55%, rgba(0,0,0,.35));
}
.lart-wall__in {
  display: grid; gap: clamp(16px, 2.4vw, 34px);
  grid-template-columns: minmax(0, 1fr) clamp(220px, 23vw, 300px);
  align-items: stretch;
  padding-bottom: clamp(26px, 3.4vw, 50px);
}
/* ذرّات عائمة: بديلنا لمؤثّرات «الفقاعات» بلا إضافة سلايدر خارجية — غبار
   يطفو كأنه في حزمة ضوء مسرحي، فوق الملصقات نفسها لا خلفها. */
.lart-wall__dust { position: absolute; inset: 0; z-index: 32; overflow: hidden; pointer-events: none; }
.lart-wall__dust i {
  position: absolute;
  inset-inline-start: var(--l); inset-block-end: -8%;
  width: var(--s); height: var(--s); border-radius: 50%;
  background: radial-gradient(circle, rgba(243,237,224,.85), rgba(243,237,224,0) 72%);
  opacity: 0;
  animation: lart-dust-rise var(--t) linear var(--d) infinite;
}
@keyframes lart-dust-rise {
  0%   { inset-block-end: -8%; transform: translateX(0); opacity: 0; }
  10%  { opacity: .7; }
  50%  { transform: translateX(10px); }
  90%  { opacity: 0; }
  100% { inset-block-end: 112%; transform: translateX(-8px); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .lart-wall__dust { display: none; }
}
.lart-wall__stamp {
  position: absolute; inset-block-start: 0;
  inset-inline-end: 0; z-index: 34;
  display: flex; align-items: baseline; gap: .55em;
  transform: rotate(-2.2deg);
  padding: .34em .8em .4em; border: 2px solid var(--lart-ink); color: var(--lart-ink);
  font-size: .76rem; font-weight: 700; letter-spacing: .08em;
  background: rgba(0,0,0,.42);
  box-shadow: 0 4px 14px rgba(0,0,0,.4);
}
.lart-wall__stamp time { opacity: .72; font-size: .66rem; }

/* — كومة الملصقات — */
.lart-wall__stack {
  position: relative; min-height: clamp(400px, 44vw, 560px);
  perspective: 1400px;
}
.lart-poster {
  position: absolute; inset: 0;
  --k: 0;
  transform:
    translate(var(--px, 0px), var(--py, 0px))
    rotate(calc(var(--rot) + var(--k) * 1.5deg))
    translate(calc(var(--k) * 22px), calc(var(--k) * 13px))
    scale(calc(1 - var(--k) * .035));
  transform-origin: 70% 40%;
  z-index: calc(20 - var(--k));
  opacity: clamp(0, calc(1.6 - var(--k) * .42), 1);
  filter: brightness(calc(1 - var(--k) * .12));
  transition: transform .5s cubic-bezier(.2,.8,.25,1), opacity .4s, filter .4s;
  pointer-events: none;
}
.lart-poster.is-on {
  transform: translate(var(--px, 0px), var(--py, 0px)) rotate(var(--rot));
  z-index: 30; opacity: 1; filter: none; pointer-events: auto;
}
.lart-poster__paper {
  position: relative; height: 100%; overflow: hidden;
  background: var(--lart-paper);
  clip-path: var(--tear, none);
  box-shadow: 0 18px 40px rgba(0,0,0,.45), 0 2px 0 rgba(255,255,255,.08) inset;
}
.lart-poster__paper::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 4;
  background:
    linear-gradient(103deg, rgba(0,0,0,.12) 0 6%, transparent 18%),
    linear-gradient(255deg, rgba(0,0,0,.08) 0 4%, transparent 16%);
}
.lart-poster__a { display: grid; grid-template-columns: 1.22fr 1fr; height: 100%; }
.lart-poster__art { position: relative; overflow: hidden; }
.lart-poster__art .lart-duo { height: 100%; }
.lart-poster:hover .lart-duo img { transform: scale(1.035); }
.lart-poster__txt {
  display: flex; flex-direction: column; justify-content: center; gap: .55em;
  padding: clamp(18px, 2.4vw, 36px);
  border-inline-start: 2px solid var(--lart-text);
}
.lart-poster__t {
  font-family: var(--lart-display), sans-serif; font-weight: 400;
  font-size: clamp(1.7rem, 3.5vw, 3.15rem); line-height: 1.02;
  color: var(--lart-text);
}
.lart-poster__d {
  font-family: var(--lart-read), serif; font-size: clamp(.86rem, 1.05vw, 1rem);
  line-height: 1.7; color: #3a332c;
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
}
.lart-poster__m {
  margin-top: .5em; padding-top: .8em; font-size: .74rem; color: var(--lart-mute);
  border-top: 1px solid var(--lart-line);
  display: flex; gap: .45em; align-items: center;
}
.lart-poster__m i { opacity: .4; font-style: normal; }

@keyframes lart-slap {
  0%   { transform: rotate(calc(var(--rot) - 3deg)) scale(1.085) translateY(-10px); }
  55%  { transform: rotate(calc(var(--rot) + .8deg)) scale(.985) scaleY(.965); }
  100% { transform: rotate(var(--rot)) scale(1); }
}
.lart-poster.is-slap { animation: lart-slap .46s cubic-bezier(.3,1.4,.5,1); }

/* — عمود الملصقات الصغيرة — */
.lart-wall__rail {
  display: flex; flex-direction: column; gap: .3em;
  align-self: start; position: relative; z-index: 31;
  border-inline-end: 1px solid rgba(255,255,255,.14);
  padding-inline-end: .6em; padding-block-start: 2.6em;
  max-height: clamp(400px, 44vw, 560px); overflow: auto; scrollbar-width: none;
}
.lart-wall__rail::-webkit-scrollbar { display: none; }
.lart-wall__tab {
  position: relative; display: grid; gap: .55em; align-items: center;
  grid-template-columns: 44px 1fr;
  padding: .5em .55em; text-align: start; width: 100%;
  color: rgba(255,255,255,.62);
  border: 1px solid transparent;
  transition: color .18s, background .18s, border-color .18s;
}
.lart-wall__tab:hover { color: #fff; background: rgba(255,255,255,.05); }
.lart-wall__tab.is-on {
  color: #fff; background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.16);
}
.lart-wall__thumb { position: relative; }
.lart-wall__thumb .lart-duo { --duo-hi: #efe6d4; }
.lart-wall__tab.is-on .lart-wall__thumb::after {
  content: ""; position: absolute; inset: -3px; border: 2px solid var(--ink);
}
.lart-wall__lab { display: flex; flex-direction: column; gap: .08em; min-width: 0; }
.lart-wall__lab b { font-size: .64rem; color: var(--ink); letter-spacing: .12em; }
.lart-wall__lab em {
  font-style: normal; font-size: .62rem; opacity: .6;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.lart-wall__lab i {
  font-style: normal; font-size: .8rem; font-weight: 600; line-height: 1.25;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.lart-wall__bar {
  position: absolute; inset-block-end: 0; inset-inline-start: 0;
  height: 2px; width: 0; background: var(--ink);
}
.lart-wall__tab.is-on .lart-wall__bar { width: 100%; }
.lart-wall__tab.is-on.is-timing .lart-wall__bar { animation: lart-fill var(--dur, 7s) linear forwards; }
@keyframes lart-fill { from { width: 0; } to { width: 100%; } }

/* — الشريط الملصق — */
.lart-tick {
  position: relative; z-index: 8;
  display: flex; align-items: stretch;
  width: var(--lart-vw); margin-inline: calc(50% - var(--lart-vw) / 2);
  background: var(--lart-paper); color: var(--lart-text);
  border-block: 2px solid var(--lart-text);
  transform: rotate(-.35deg) scaleX(1.02);
}
.lart-tick__lab {
  flex: none; padding: .55em 1em; background: var(--lart-ink); color: #fff;
  font-weight: 700; font-size: .78rem; letter-spacing: .08em;
}
.lart-tick__win { overflow: hidden; flex: 1; display: flex; align-items: center; }
.lart-tick__run { display: flex; white-space: nowrap; animation: lart-run 38s linear infinite; }
.lart-tick__i { padding-inline: 1.1em; font-size: .8rem; display: inline-flex; gap: 1.1em; align-items: center; }
.lart-tick__i i { color: var(--lart-ink); font-style: normal; font-size: .55rem; }
@keyframes lart-run { from { transform: translateX(0); } to { transform: translateX(50%); } }

/* =========================================================================
   الليلة — لوحة الحروف
   ========================================================================= */
body .lart.lart-tonight { background: var(--lart-paper); padding-block: clamp(26px, 3.6vw, 54px); }
.lart-board {
  background: #14120f;
  background-image:
    repeating-linear-gradient(180deg, rgba(255,255,255,.055) 0 1px, transparent 1px 38px),
    radial-gradient(120% 140% at 50% 0%, rgba(255,255,255,.07), transparent 70%);
  border: 10px solid #2a2118;
  box-shadow: 0 16px 40px rgba(0,0,0,.35), 0 0 0 1px rgba(0,0,0,.4) inset;
  padding: clamp(16px, 2.2vw, 30px);
  color: #efe9dc;
}
.lart-board__head {
  display: flex; align-items: baseline; gap: .8em;
  border-bottom: 1px solid rgba(255,255,255,.16); padding-bottom: .5em; margin-bottom: .7em;
}
.lart-board__head b {
  font-family: var(--lart-display), sans-serif; font-size: clamp(1.4rem, 2.6vw, 2.1rem);
  color: var(--lart-ink); line-height: 1;
}
.lart-board__head span { font-size: .72rem; opacity: .5; margin-inline-start: auto; }
.lart-board__row {
  display: grid; align-items: baseline; gap: .6em;
  grid-template-columns: minmax(0, auto) 1fr auto minmax(0, 2.1fr);
  padding: .42em 0;
  font-weight: 500; letter-spacing: .055em;
  text-shadow: 0 1px 0 rgba(0,0,0,.75), 0 0 8px rgba(255,255,255,.07);
  animation: lart-flip .5s both;
  animation-delay: calc(var(--i) * .06s);
}
@keyframes lart-flip {
  from { opacity: 0; transform: translateY(-6px) rotateX(-55deg); }
  to   { opacity: 1; transform: none; }
}
.lart-board__place { font-size: .88rem; opacity: .82; white-space: nowrap; }
.lart-board__dots {
  border-bottom: 1px dotted rgba(255,255,255,.22); transform: translateY(-.25em);
}
.lart-board__time {
  font-size: .95rem; font-weight: 700; color: var(--lart-ink);
  font-variant-numeric: tabular-nums;
}
.lart-board__what {
  font-size: .92rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* =========================================================================
   المقالة
   ========================================================================= */
body .lart.lart-lead--paper { background: var(--lart-paper); }
body .lart.lart-lead--wall { background: var(--lart-wall); color: var(--lart-paper); }
body .lart.lart-lead--ink { background: var(--ink); color: #fff; }
.lart-lead__in {
  display: grid; gap: clamp(20px, 3vw, 52px);
  grid-template-columns: minmax(0, .82fr) minmax(0, 1fr);
  align-items: center;
}
.lart-lead--end .lart-lead__in { direction: ltr; }
.lart-lead--end .lart-lead__in > * { direction: rtl; }
.lart-lead__art { position: relative; }
.lart-lead__art .lart-duo { box-shadow: 10px 10px 0 var(--lart-text); }
.lart-lead__art figcaption {
  margin-top: .6em; font-size: .7rem; letter-spacing: .1em; color: var(--ink); font-weight: 700;
}
.lart-lead__t {
  font-family: var(--lart-display), sans-serif; font-weight: 400;
  font-size: clamp(2rem, 5vw, 3.9rem); line-height: 1.03; margin-block: .1em .18em;
}
.lart-lead__stand {
  font-family: var(--lart-read), serif; font-size: clamp(.95rem, 1.3vw, 1.12rem);
  line-height: 1.75; color: #40382f;
}
.lart-lead--wall .lart-lead__stand, .lart-lead--ink .lart-lead__stand { color: rgba(255,255,255,.78); }
.lart-lead--wall .lart-meta, .lart-lead--ink .lart-meta { color: rgba(255,255,255,.6); }
.lart-lead--wall .lart-meta__a, .lart-lead--ink .lart-meta__a { color: #fff; }
.lart-lead__cols {
  margin-top: 1.1em; columns: 2; column-gap: 2.2em;
  column-rule: 1px solid var(--lart-line);
  font-family: var(--lart-read), serif; font-size: .9rem; line-height: 1.85;
  text-align: justify; hyphens: auto; color: #4a4239;
}
.lart-lead--wall .lart-lead__cols, .lart-lead--ink .lart-lead__cols {
  color: rgba(255,255,255,.7); column-rule-color: rgba(255,255,255,.2);
}
.lart-pull {
  position: relative; margin-top: 1.3em; padding: .9em 1.1em;
  border-inline-start: 5px solid var(--ink);
  background: rgba(0,0,0,.035);
  font-family: var(--lart-display), sans-serif;
  font-size: clamp(1.05rem, 1.7vw, 1.4rem); line-height: 1.45;
}
.lart-pull .lart-i { color: var(--ink); opacity: .8; margin-bottom: .1em; }
.lart-lead--wall .lart-pull, .lart-lead--ink .lart-pull { background: rgba(255,255,255,.07); }

/* =========================================================================
   الخشبة
   ========================================================================= */
body .lart.lart-stage {
  background: #0d0b0a; color: #efe7d8;
  padding-block: clamp(46px, 6vw, 92px) clamp(60px, 7vw, 110px);
}
.lart-stage__curtain {
  position: absolute; inset-block: 0; width: clamp(40px, 9vw, 150px); z-index: 1;
  background:
    repeating-linear-gradient(90deg, rgba(0,0,0,.55) 0 8px, rgba(0,0,0,.12) 8px 22px, rgba(0,0,0,.6) 22px 30px),
    linear-gradient(90deg, #5c1410, #8d2019 55%, #45100d);
  box-shadow: 0 0 60px rgba(0,0,0,.7);
}
.lart-stage__curtain--s { inset-inline-start: 0; }
.lart-stage__curtain--e { inset-inline-end: 0; transform: scaleX(-1); }
.lart-stage__beam {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(60% 70% at var(--mx, 50%) 12%, rgba(255,242,214,.20), rgba(255,240,205,.06) 42%, transparent 68%);
  transition: background .4s;
}
.lart-stage__in { z-index: 3; }
.lart-stage__floor {
  position: relative; z-index: 3;
  display: grid; gap: clamp(14px, 2vw, 30px);
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  align-items: end;
}
.lart-act { position: relative; animation: lart-enter .6s both; animation-delay: calc(var(--i) * .08s); }
@keyframes lart-enter { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.lart-act a { display: block; }
.lart-act__art { display: block; position: relative; }
.lart-act__art .lart-duo { --duo-hi: #f6ead0; box-shadow: 0 14px 30px rgba(0,0,0,.6); }
.lart-act:hover .lart-duo img { transform: scale(1.04); }
.lart-act__b { display: block; padding-top: .7em; }
.lart-act__t {
  font-family: var(--lart-title), sans-serif;
  font-size: 1.02rem; font-weight: 700; line-height: 1.3; margin-top: .18em;
  color: #f4ecdd;
}
.lart-act__d {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font-size: .8rem; color: rgba(255,255,255,.5); margin-top: .3em;
}
.lart-act__sh {
  display: block; height: 14px; margin-top: 6px;
  background: radial-gradient(50% 50% at 50% 50%, rgba(0,0,0,.65), transparent 70%);
  filter: blur(2px);
}
.lart-stage__boards {
  position: absolute; inset-inline: 0; inset-block-end: 0; height: clamp(40px, 6vw, 86px); z-index: 1;
  background:
    repeating-linear-gradient(90deg, rgba(0,0,0,.45) 0 2px, transparent 2px 64px),
    linear-gradient(0deg, #2b2119, #16110d);
  box-shadow: 0 -10px 30px rgba(0,0,0,.6) inset;
}

/* =========================================================================
   الشريط — السينما
   ========================================================================= */
body .lart.lart-reel { background: #11131c; color: #e9eaf2; padding-block: clamp(36px, 4.6vw, 72px); }
.lart-reel__strip { position: relative; padding-block: 26px; }
.lart-reel__perf {
  position: absolute; inset-inline: 0; height: 26px; z-index: 3;
  background-color: #07080d;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='26'%3E%3Crect x='7' y='7' width='20' height='12' rx='3' fill='%23d9dbe6'/%3E%3C/svg%3E");
  background-repeat: repeat-x; background-position: center;
}
.lart-reel__perf--t { inset-block-start: 0; }
.lart-reel__perf--b { inset-block-end: 0; }
.lart-reel__frames {
  display: flex; gap: 4px; overflow-x: auto; scroll-snap-type: x mandatory;
  background: #07080d; padding: 4px; scrollbar-width: none;
  cursor: grab;
}
.lart-reel__frames::-webkit-scrollbar { display: none; }
.lart-reel__frames.is-drag { cursor: grabbing; }
.lart-frame {
  flex: 0 0 clamp(210px, 25vw, 290px); scroll-snap-align: start;
  background: #0d0f18; border-inline: 1px solid rgba(255,255,255,.07);
  --duo-lo: #1b2c6b; --duo-hi: #e8e4d2;
}
.lart-frame--leader {
  flex: 0 0 clamp(120px, 14vw, 170px);
  display: grid; place-content: center; gap: .7em; justify-items: center;
  background: repeating-conic-gradient(#0d0f18 0 25%, #121522 0 50%) 0 0 / 22px 22px;
}
.lart-leader {
  position: relative; width: 62px; height: 62px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,.35); display: grid; place-items: center;
}
.lart-leader i {
  position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(rgba(255,255,255,.16) 0 25%, transparent 0 100%);
  animation: lart-spin 4s linear infinite;
}
@keyframes lart-spin { to { transform: rotate(360deg); } }
.lart-leader b { font-family: var(--lart-display), sans-serif; font-size: 1.7rem; color: #fff; }
.lart-frame--leader em { font-style: normal; font-size: .6rem; letter-spacing: .24em; opacity: .5; }
.lart-frame__art { position: relative; display: block; }
.lart-frame__no {
  position: absolute; inset-block-start: 6px; inset-inline-start: 6px; z-index: 3;
  font-size: .6rem; letter-spacing: .14em; padding: .2em .45em;
  background: rgba(0,0,0,.6); color: #fff;
}
.lart-frame__b { display: block; padding: .7em .8em 1em; }
.lart-frame__b h3 { font-family: var(--lart-title), sans-serif; font-size: .96rem; font-weight: 700; line-height: 1.32; margin-top: .2em; }
.lart-frame__w { display: block; font-size: .74rem; color: rgba(255,255,255,.45); margin-top: .3em; }
.lart-frame .lart-kicker { color: #8fa4ff; }
.lart-frame:hover .lart-duo img { transform: scale(1.05); }

/* =========================================================================
   الأغلفة — الموسيقى
   ========================================================================= */
body .lart.lart-sleeve { background: var(--lart-paper-2); }
.lart-crate {
  display: grid; gap: clamp(16px, 2.2vw, 30px);
  grid-template-columns: repeat(auto-fill, minmax(165px, 1fr));
}
.lart-crate.is-few {
  grid-template-columns: repeat(auto-fit, minmax(165px, 230px));
  justify-content: center;
}
.lart-lp { position: relative; }
.lart-lp__box { position: relative; display: block; }
.lart-lp__disc {
  position: absolute; inset-block: 6%; aspect-ratio: 1; inset-inline-end: 4%;
  border-radius: 50%; z-index: 1;
  background:
    repeating-radial-gradient(circle, rgba(255,255,255,.05) 0 1px, transparent 1px 4px),
    radial-gradient(circle, #2a2a2a 0 28%, #101010 29%);
  transform: translateX(0) rotate(0deg);
  transition: transform .45s cubic-bezier(.2,.8,.3,1);
  box-shadow: 0 6px 16px rgba(0,0,0,.4);
}
.lart-lp__disc i {
  position: absolute; inset: 36%; border-radius: 50%; background: var(--ink);
}
.lart-lp:hover .lart-lp__disc { transform: translateX(-34%) rotate(70deg); }
.lart-lp__cover { position: relative; z-index: 2; display: block; box-shadow: 6px 6px 0 rgba(0,0,0,.18); }
.lart-lp__wave {
  display: flex; align-items: flex-end; gap: 2px; height: 22px; margin-top: .6em;
}
.lart-lp__wave i {
  flex: 1; height: calc(var(--v) * 100%); background: var(--ink); opacity: .5;
  transition: opacity .2s;
}
.lart-lp:hover .lart-lp__wave i { opacity: .95; }
.lart-lp__t { font-family: var(--lart-title), sans-serif; font-size: .95rem; font-weight: 700; line-height: 1.32; margin-top: .15em; }

/* =========================================================================
   الصالة — الفنون التشكيلية
   ========================================================================= */
body .lart.lart-salle { background: #e8e2d4; padding-block: clamp(36px, 4.6vw, 76px) clamp(50px, 6vw, 96px); }
.lart-salle__spot {
  position: absolute; inset-block-start: 0; inset-inline: 0; height: 60%;
  background: linear-gradient(180deg, rgba(255,250,235,.85), transparent 75%);
  pointer-events: none;
}
.lart-salle__wall {
  position: relative; display: flex; align-items: flex-start; gap: clamp(14px, 2.4vw, 38px);
  padding-top: 46px; overflow-x: auto; scrollbar-width: none;
}
.lart-salle__wall.is-few { justify-content: center; }
.lart-salle__wall::-webkit-scrollbar { display: none; }
.lart-salle__rail {
  position: absolute; inset-block-start: 26px; inset-inline: 0; height: 3px;
  background: linear-gradient(180deg, #c9bfa9, #9d927c);
  box-shadow: 0 2px 5px rgba(0,0,0,.14);
}
.lart-hang {
  flex: 0 0 clamp(180px, 21vw, 260px); position: relative;
  margin-block-start: var(--drop);
  animation: lart-enter .6s both; animation-delay: calc(var(--i) * .07s);
}
.lart-hang__wire {
  position: absolute; inset-block-start: calc(-1 * var(--drop) - 20px); inset-inline-start: 50%;
  width: 1px; height: calc(var(--drop) + 20px);
  background: linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.2));
}
.lart-hang__frame {
  display: block; padding: 9px; background: #faf6ec;
  border: 1px solid #cdc2ab;
  box-shadow: 0 12px 26px rgba(0,0,0,.2), 0 1px 0 #fff inset;
}
.lart-hang__frame .lart-duo { --duo-hi: #f7f1e2; }
.lart-hang:hover .lart-duo img { transform: scale(1.03); }
.lart-cartel {
  margin-top: .9em; padding-inline-start: .55em;
  border-inline-start: 3px solid var(--ink);
  font-size: .74rem; line-height: 1.5;
}
.lart-cartel b { display: block; font-weight: 700; }
.lart-cartel span { display: block; font-style: italic; color: #5c5346; }
.lart-cartel em { display: block; font-style: normal; color: #8a7f6d; font-size: .68rem; }

/* =========================================================================
   الهامش — الأدب
   ========================================================================= */
body .lart.lart-marge { background: var(--lart-paper); }
.lart-page {
  position: relative; background: #f6f1e4;
  border: 1px solid var(--lart-line);
  box-shadow: 0 10px 30px rgba(0,0,0,.08);
  padding: clamp(20px, 3vw, 46px);
}
.lart-page__fold {
  position: absolute; inset-block: 0; inset-inline-start: clamp(150px, 20%, 250px);
  width: 1px; background: var(--ink); opacity: .35;
}
.lart-entry {
  display: grid; gap: clamp(10px, 2vw, 26px);
  grid-template-columns: 2.1rem minmax(0, 1fr) clamp(130px, 18%, 220px);
  padding-block: clamp(14px, 1.8vw, 24px);
  border-bottom: 1px dashed var(--lart-line);
}
.lart-entry:last-child { border-bottom: 0; }
.lart-entry__num {
  font-family: var(--lart-display), sans-serif; font-size: 1.5rem; color: var(--ink); line-height: 1;
}
.lart-entry__txt h3 {
  font-family: var(--lart-read), serif; font-size: clamp(1.05rem, 1.7vw, 1.38rem);
  font-weight: 700; line-height: 1.35;
}
.lart-entry__txt h3 a { background-image: linear-gradient(var(--ink), var(--ink)); background-size: 0 2px; background-repeat: no-repeat; background-position: 100% 100%; transition: background-size .3s; }
.lart-entry__txt h3 a:hover { background-size: 100% 2px; }
.lart-entry__txt p {
  font-family: var(--lart-read), serif; font-size: .88rem; line-height: 1.8;
  color: #554c41; margin-top: .4em;
}
.lart-entry__note {
  position: relative; font-size: .72rem; line-height: 1.6; color: #6d6455;
  padding-inline-start: .8em;
}
.lart-entry__lead {
  position: absolute; inset-block-start: .7em; inset-inline-end: 100%;
  width: clamp(8px, 2vw, 28px); height: 1px; background: var(--ink); opacity: .5;
}
.lart-entry__note b { display: block; color: var(--ink); font-size: .7rem; letter-spacing: .08em; }
.lart-entry__note em { font-style: normal; opacity: .65; }

/* =========================================================================
   الأجندة
   ========================================================================= */
body .lart.lart-agenda {
  background: var(--lart-paper-3);
  background-image: radial-gradient(rgba(0,0,0,.05) 1px, transparent 1px);
  background-size: 7px 7px;
}
.lart-slips {
  display: grid; gap: clamp(16px, 2.4vw, 32px);
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  padding-top: 14px;
}
.lart-slip {
  position: relative; background: #fffaf0; padding: 1.15em .95em 1em;
  transform: rotate(var(--rot));
  box-shadow: 0 8px 20px rgba(0,0,0,.14);
  border-top: 5px solid var(--ink);
  transition: transform .2s;
}
.lart-slip:hover { transform: rotate(0deg) translateY(-3px); }
.lart-slip__date {
  display: block; font-family: var(--lart-display), sans-serif;
  font-size: 1.35rem; color: var(--ink); line-height: 1;
}
.lart-slip__place {
  display: flex; align-items: center; gap: .3em; margin-top: .3em;
  font-size: .72rem; color: var(--lart-mute);
}
.lart-slip__what { display: block; margin-top: .5em; font-size: .92rem; font-weight: 600; line-height: 1.4; }

/* =========================================================================
   أصوات — جهاز الشريط
   ========================================================================= */
body .lart.lart-voices { background: #17151a; color: #ece7dd; }
.lart-deck {
  position: relative; display: grid; align-items: center; gap: 1.2em;
  grid-template-columns: 78px minmax(0, 1fr) 78px;
  max-width: 660px; margin-inline: auto;
  padding: clamp(16px, 2.2vw, 26px);
  background: linear-gradient(180deg, #2a262c, #1b181d);
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: 0 16px 40px rgba(0,0,0,.45), 0 1px 0 rgba(255,255,255,.08) inset;
  margin-bottom: clamp(16px, 2.2vw, 28px);
}
.lart-deck__reel {
  width: 78px; height: 78px; border-radius: 50%;
  background:
    radial-gradient(circle, transparent 0 18%, #3a353c 19% 22%, transparent 23%),
    conic-gradient(from 0deg, #4a444d 0 12%, #2f2b33 0 25%, #4a444d 0 37%, #2f2b33 0 50%, #4a444d 0 62%, #2f2b33 0 75%, #4a444d 0 87%, #2f2b33 0);
  border: 3px solid #56505c;
  box-shadow: 0 0 0 6px rgba(0,0,0,.35) inset;
}
.lart-deck.is-play .lart-deck__reel { animation: lart-spin 2.4s linear infinite; }
.lart-deck.is-play .lart-deck__reel--b { animation-duration: 3.4s; }
.lart-deck__tape {
  height: 5px; width: 100%; background: linear-gradient(180deg, #6b5b46, #40352a);
  box-shadow: 0 0 10px rgba(0,0,0,.5);
}
.lart-deck__mid { display: grid; gap: .7em; justify-items: center; min-width: 0; width: 100%; }
.lart-deck__face { display: grid; gap: .35em; justify-items: center; width: 100%; }
.lart-deck__title { font-size: .86rem; font-weight: 700; text-align: center; }
.lart-deck__counter {
  font-variant-numeric: tabular-nums; font-size: .72rem; color: var(--lart-ink);
  letter-spacing: .1em;
}
.lart-deck__scrub { display: block; width: 100%; height: 3px; background: rgba(255,255,255,.16); cursor: pointer; }
.lart-deck__scrub i { display: block; height: 100%; width: 0; background: var(--lart-ink); }
.lart-voices__list { display: grid; gap: .2em; }
.lart-voice {
  display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: .7em;
  padding: .55em .6em; border-bottom: 1px solid rgba(255,255,255,.08);
}
.lart-voice.is-off { opacity: .45; }
.lart-voice__play {
  width: 34px; height: 34px; display: grid; place-items: center;
  border: 1.5px solid var(--ink); color: var(--ink); border-radius: 50%;
}
.lart-voice__play:hover:not(:disabled) { background: var(--ink); color: #fff; }
.lart-voice.is-play .lart-voice__play { background: var(--ink); color: #fff; }
.lart-voice__t { font-family: var(--lart-title), sans-serif; font-size: .92rem; font-weight: 600; }
.lart-voice__m { font-size: .7rem; color: rgba(255,255,255,.42); }

.lart-listen {
  display: grid; align-items: center; gap: .8em;
  grid-template-columns: auto 1fr auto auto;
  padding: .85em 1em; margin: 1.6em 0;
  background: #1a181c; color: #ece7dd;
  border-inline-start: 5px solid var(--ink);
}
.lart-listen__deck { display: flex; align-items: center; gap: 5px; }
.lart-listen__deck .lart-deck__reel { width: 30px; height: 30px; border-width: 2px; }
.lart-listen__deck .lart-deck__tape { width: 16px; height: 3px; }
.lart-listen.is-play .lart-deck__reel { animation: lart-spin 2.4s linear infinite; }
.lart-listen__b { display: grid; gap: .3em; min-width: 0; }
.lart-listen__b b { font-size: .85rem; }
.lart-listen__note { font-style: normal; font-size: .66rem; color: rgba(255,255,255,.4); }
.lart-listen__play {
  width: 40px; height: 40px; display: grid; place-items: center;
  background: var(--ink); color: #fff; border-radius: 50%;
}

/* =========================================================================
   بورتريه
   ========================================================================= */
body .lart.lart-portrait { padding: 0; background: var(--lart-wall); color: #fff; }
.lart-portrait__art { position: absolute; inset: 0; z-index: 0; }
.lart-portrait__art .lart-duo { height: 100%; aspect-ratio: auto; --duo-hi: #cbb488; }
.lart-portrait__art::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(-90deg, rgba(0,0,0,.86) 0 44%, rgba(0,0,0,.42) 74%, rgba(0,0,0,.2)),
    linear-gradient(0deg, rgba(0,0,0,.45), transparent 60%);
}
.lart-portrait__in {
  position: relative; z-index: 3;
  padding-block: clamp(56px, 8vw, 130px);
  max-width: min(100% - 2 * clamp(16px, 4vw, 54px), var(--lart-max));
  margin-inline: auto;
}
.lart-portrait__q {
  font-family: var(--lart-display), sans-serif; font-weight: 400;
  font-size: clamp(1.5rem, 3.6vw, 2.9rem); line-height: 1.3;
  max-width: 22ch; margin-top: .5em;
  text-shadow: 0 2px 20px rgba(0,0,0,.5);
}
.lart-portrait__n { display: block; margin-top: 1.1em; }
.lart-portrait__n b { display: block; font-size: 1.05rem; color: var(--ink); }
.lart-portrait__n span { font-size: .78rem; opacity: .6; }
.lart-portrait .lart-kicker--stamp { color: #fff; }

/* =========================================================================
   الأرشيف
   ========================================================================= */
body .lart.lart-archive { background: var(--lart-paper-2); }
.lart-drawer {
  display: grid; gap: 10px;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
}
.lart-idx {
  position: relative; background: #fdf9ee; padding: 1.1em 1em 1em 1.6em;
  border: 1px solid #ddd4bf;
  background-image: repeating-linear-gradient(180deg, transparent 0 25px, rgba(0,0,0,.05) 25px 26px);
  box-shadow: 3px 3px 0 rgba(0,0,0,.07);
  transition: transform .18s, box-shadow .18s;
}
.lart-idx:hover, .lart-idx:focus-within {
  transform: translateY(-5px) rotate(-.6deg); box-shadow: 5px 8px 0 rgba(0,0,0,.1);
}
.lart-idx::before {
  content: ""; position: absolute; inset-block: 0; inset-inline-start: 0;
  width: 4px; background: var(--ink);
}
.lart-idx__hole {
  position: absolute; inset-block-start: 10px; inset-inline-start: 14px;
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--lart-paper-3); box-shadow: 0 1px 0 #fff;
}
.lart-idx__year {
  font-family: var(--lart-display), sans-serif; font-size: 1.1rem; color: var(--ink);
  letter-spacing: .04em;
}
.lart-idx h3 { font-family: var(--lart-title), sans-serif; font-size: 1rem; font-weight: 700; line-height: 1.35; margin-top: .2em; }
.lart-idx p { font-size: .8rem; color: #6a6053; margin-top: .35em; line-height: 1.65; }
.lart-idx__tag {
  display: inline-block; margin-top: .6em; font-size: .66rem;
  letter-spacing: .1em; color: var(--ink);
}

/* =========================================================================
   الشبكة العامة + البطاقة
   ========================================================================= */
body .lart.lart-grid--paper { background: var(--lart-paper); }
body .lart.lart-grid--paper2 { background: var(--lart-paper-2); }
body .lart.lart-grid--wall { background: var(--lart-wall); color: var(--lart-paper); }
body .lart.lart-grid--none { background: transparent; }
.lart-grid__items {
  display: grid; gap: clamp(16px, 2.4vw, 32px);
  grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
}
.lart-grid--rail .lart-grid__items {
  display: flex; overflow-x: auto; scroll-snap-type: x proximity;
  scrollbar-width: none; padding-bottom: 6px;
}
.lart-grid--rail .lart-grid__items::-webkit-scrollbar { display: none; }
.lart-grid--rail .lart-card { flex: 0 0 clamp(215px, 26vw, 290px); scroll-snap-align: start; }
.lart-grid--list .lart-grid__items { display: grid; grid-template-columns: 1fr; gap: 0; }
.lart-grid--mosaic .lart-grid__items { grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); }
.lart-grid--mosaic .lart-card--big { grid-column: span 2; grid-row: span 2; }
.lart-grid--mosaic .lart-card--big .lart-duo { aspect-ratio: 1 / 1; }
.lart-grid--mosaic .lart-card--big .lart-card__t { font-size: clamp(1.2rem, 2.4vw, 1.8rem); }

.lart-card { position: relative; }
.lart-card__a { display: block; }
.lart-card__art { display: block; overflow: hidden; }
.lart-card__art .lart-duo { clip-path: var(--tear, none); }
.lart-card:hover .lart-duo img { transform: scale(1.045); }
.lart-card__body { display: block; padding-top: .7em; }
.lart-card__t {
  font-family: var(--lart-title), sans-serif;
  font-size: clamp(.98rem, 1.3vw, 1.12rem); font-weight: 700; line-height: 1.34;
  margin-top: .22em;
}
.lart-card__d {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font-family: var(--lart-read), serif;
  font-size: .82rem; line-height: 1.7; color: var(--lart-mute); margin-top: .35em;
}
.lart-grid--wall .lart-card__d { color: rgba(255,255,255,.5); }
.lart-grid--wall .lart-meta { color: rgba(255,255,255,.45); }
.lart-grid--wall .lart-meta__a { color: rgba(255,255,255,.8); }
.lart-card--row .lart-card__a { display: grid; grid-template-columns: 110px 1fr; gap: .9em; align-items: start; }
.lart-card--poster .lart-card__body {
  margin-top: -2.2em; margin-inline: .9em; position: relative; z-index: 3;
  background: var(--lart-paper); padding: .8em .9em;
  box-shadow: 0 6px 18px rgba(0,0,0,.14);
}

.lart-row {
  display: grid; grid-template-columns: 2.4rem 1fr auto; gap: .8em; align-items: baseline;
  padding: .85em 0; border-bottom: 1px solid var(--lart-line);
}
.lart-row__n { font-family: var(--lart-display), sans-serif; font-size: 1.25rem; color: var(--ink); }
.lart-row h3 { font-family: var(--lart-title), sans-serif; font-size: 1.02rem; font-weight: 700; line-height: 1.35; }
.lart-row h3 + span { font-size: .7rem; color: var(--ink); letter-spacing: .08em; }
.lart-row__m { font-size: .72rem; color: var(--lart-mute); }
.lart-row a:hover h3 { color: var(--ink); }

/* =========================================================================
   التذييل
   ========================================================================= */
body .lart.lart-footer { background: var(--lart-text); color: var(--lart-paper); }
.lart-footer__in { display: grid; gap: clamp(20px, 3vw, 46px); grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
.lart-footer__brand .lart-brand__ar { color: var(--lart-paper); font-size: clamp(2rem, 4vw, 3rem); }
.lart-footer__brand .lart-brand__la { color: var(--lart-ink); }
.lart-footer__brand p { margin-top: .9em; font-size: .84rem; line-height: 1.8; color: rgba(255,255,255,.55); max-width: 46ch; }
.lart-footer__cols { display: grid; gap: 1.6em; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
.lart-footer__cols b {
  display: block; font-size: .68rem; letter-spacing: .18em; color: var(--lart-ink);
  padding-bottom: .5em; margin-bottom: .5em; border-bottom: 1px solid rgba(255,255,255,.14);
}
.lart-footer__cols li { padding: .22em 0; }
.lart-footer__cols a { font-size: .84rem; color: rgba(255,255,255,.72); display: flex; align-items: center; gap: .45em; }
.lart-footer__cols a:hover { color: #fff; }
.lart-footer__cols i { width: 6px; height: 6px; background: var(--ink); flex: none; }
.lart-footer__end {
  grid-column: 1 / -1; display: flex; align-items: center; gap: 1em;
  margin-top: .6em; padding-top: 1em; border-top: 1px solid rgba(255,255,255,.12);
  font-size: .72rem; color: rgba(255,255,255,.4);
}
.lart-footer__end .lart-crop { margin-inline-start: auto; }

/* =========================================================================
   صفحة المقال
   ========================================================================= */
body .lart.lart-ahead {
  position: relative; padding: 0; color: #fff;
  width: var(--lart-vw); margin-inline: calc(50% - var(--lart-vw) / 2);
  background: var(--lart-wall);
}
.lart-ahead__art { position: absolute; inset: 0; z-index: 0; clip-path: var(--tear, none); }
.lart-ahead__art .lart-duo { height: 100%; aspect-ratio: auto; --duo-hi: #efe3c8; }
.lart-ahead__art::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,.88) 0 22%, rgba(0,0,0,.45) 60%, rgba(0,0,0,.3));
}
.lart-ahead__in {
  position: relative; z-index: 3;
  width: min(100% - 2 * clamp(16px, 4vw, 54px), 900px); margin-inline: auto;
  padding-block: clamp(70px, 11vw, 190px) clamp(28px, 4vw, 56px);
}
.lart-ahead__t {
  font-family: var(--lart-display), sans-serif; font-weight: 400;
  font-size: clamp(1.9rem, 5.2vw, 4rem); line-height: 1.04; margin-block: .22em .2em;
  text-shadow: 0 2px 24px rgba(0,0,0,.45);
}
.lart-ahead__d {
  font-family: var(--lart-read), serif; font-size: clamp(.95rem, 1.35vw, 1.15rem);
  line-height: 1.75; color: rgba(255,255,255,.78); max-width: 60ch;
}
.lart-ahead__m {
  display: flex; flex-wrap: wrap; gap: .5em; align-items: center;
  margin-top: 1em; font-size: .78rem; color: rgba(255,255,255,.6);
}
.lart-ahead__m a { color: #fff; font-weight: 600; }
.lart-ahead__m i { opacity: .4; font-style: normal; }
.lart-ahead .lart-kicker--stamp { color: #fff; }

/* مشاركة: صفّ أزرار مدوّرة صغيرة إلى جانب السطر البيبلوغرافي مباشرة. */
.lart-share { display: flex; align-items: center; gap: .7em; flex-wrap: wrap; margin-top: 1.1em; }
.lart-share__h { font-size: .7rem; letter-spacing: .1em; color: rgba(255,255,255,.55); }
.lart-share__row { display: flex; align-items: center; gap: .5em; }
.lart-share__b {
  position: relative; display: grid; place-items: center;
  width: 34px; height: 34px; border-radius: 50%; padding: 0; line-height: 0;
  background: rgba(255,255,255,.12); color: #fff; border: 1px solid rgba(255,255,255,.2);
  cursor: pointer; transition: background .18s, border-color .18s, transform .18s;
}
.lart-share__b svg { width: 15px; height: 15px; fill: currentColor; }
.lart-share__b:hover { background: var(--ink); border-color: var(--ink); transform: translateY(-2px); }
.lart-share__b--copy.is-copied::after {
  content: "نُسخ!"; position: absolute; inset-block-end: 132%; inset-inline-end: 50%;
  transform: translateX(50%); background: #000; color: #fff; font-size: .64rem;
  padding: .25em .6em; white-space: nowrap; border-radius: 3px; pointer-events: none;
}

/* المقال صفحة واحدة: النصّ ورفيقه الجانبي (بطاقة العمل، الخلاصة، الهامش،
   الاستماع، وأزرار المشاركة) جنبا إلى جنب — لا فراغ إلى جانب المقال، ولا
   عمود ضيّق يتوه في صفحة عريضة. */
.lart-body {
  font-family: var(--lart-read), serif; font-size: 1.02rem; line-height: 1.95;
  color: #2f2822; max-width: 74ch;
}
.lart-body p { margin: 0 0 1.2em; }
.lart-body h2, .lart-body h3 {
  font-family: var(--lart-display), sans-serif; font-weight: 400;
  line-height: 1.2; margin: 1.6em 0 .5em;
}
.lart-body h2 { font-size: clamp(1.4rem, 2.6vw, 2rem); }
.lart-body h3 { font-size: clamp(1.2rem, 2vw, 1.55rem); }
.lart-body blockquote {
  margin: 1.4em 0; padding-inline-start: 1.1em;
  border-inline-start: 4px solid var(--lart-ink);
  font-size: 1.1em; color: #4a4038;
}
.lart-single__in {
  display: grid; gap: clamp(20px, 3.4vw, 54px);
  grid-template-columns: minmax(0, 1fr) clamp(230px, 26%, 320px);
  width: min(100% - 2 * clamp(16px, 4vw, 54px), var(--lart-max));
  margin-inline: auto; padding-block: clamp(28px, 4vw, 58px);
}
.lart-single__main { min-width: 0; }
.lart-single__side { display: grid; gap: 1.2em; align-content: start; position: sticky; top: 90px; min-width: 0; }

.lart-mark {
  display: inline; padding: 0 .12em; font: inherit;
  background-image: linear-gradient(var(--lart-ink), var(--lart-ink));
  background-size: 100% 1.5px; background-repeat: no-repeat; background-position: 0 100%;
  color: inherit;
}
.lart-mark i {
  display: inline-block; width: .42em; height: .42em; margin-inline-start: .2em;
  background: var(--lart-ink); vertical-align: .32em;
}
.lart-mark:hover { background-color: rgba(240,60,24,.1); }

.lart-work, .lart-sum, .lart-margin {
  background: #f7f2e5; border: 1px solid var(--lart-line);
  border-top: 4px solid var(--ink);
  padding: 1em 1.05em; font-size: .86rem;
}
.lart-work__h, .lart-sum__h, .lart-margin__h {
  display: flex; align-items: center; gap: .4em;
  font-size: .68rem; letter-spacing: .16em; color: var(--ink);
  padding-bottom: .55em; margin-bottom: .6em; border-bottom: 1px dashed var(--lart-line);
}
.lart-work dl { display: grid; gap: .42em; }
.lart-work dl > div { display: grid; grid-template-columns: 5.2rem 1fr; gap: .6em; }
.lart-work dt { color: var(--lart-mute); font-size: .76rem; }
.lart-work dd { font-weight: 600; font-size: .84rem; }
.lart-sum ul { display: grid; gap: .55em; }
.lart-sum li { position: relative; padding-inline-start: 1.1em; line-height: 1.7; }
.lart-sum li::before {
  content: ""; position: absolute; inset-inline-start: 0; inset-block-start: .58em;
  width: 6px; height: 6px; background: var(--ink);
}
.lart-margin dl { display: grid; gap: .8em; }
.lart-margin dt { font-weight: 700; color: var(--ink); font-size: .82rem; }
.lart-margin dd { font-size: .8rem; line-height: 1.65; color: #5b5246; }
.lart-margin__i { transition: background .3s; padding: .2em .35em; margin-inline: -.35em; }
.lart-margin__i.is-on { background: rgba(240,60,24,.12); }

.lart-snip { margin-block: 1.2em; }

/* =========================================================================
   استجابة
   ========================================================================= */
@media (max-width: 1080px) {
  .lart-wall__in { grid-template-columns: 1fr; }
  .lart-wall__stack { min-height: clamp(430px, 66vw, 560px); }
  .lart-wall__rail {
    flex-direction: row; overflow-x: auto; border-inline-start: 0;
    border-top: 1px solid rgba(255,255,255,.14); padding: .5em 0 0; max-height: none;
  }
  .lart-wall__tab { flex: 0 0 clamp(190px, 44vw, 250px); }
  .lart-single__in { grid-template-columns: 1fr; }
  .lart-single__side { position: static; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
}

@media (max-width: 860px) {
  .lart-mast__in {
    grid-template-columns: auto 1fr;
    grid-template-areas: "brand tools" "tag tag" "nav nav";
  }
  .lart-brand__tag { border: 0; padding: 0; font-size: .68rem; }
  .lart-burger { display: grid; place-items: center; }
  .lart-nav { display: none; }
  .lart-nav.is-open { display: block; }
  .lart-nav ul { flex-wrap: wrap; }
  .lart-search--mast input { width: clamp(90px, 34vw, 180px); }
  .lart-poster__a { grid-template-columns: 1fr; grid-template-rows: 46% 1fr; }
  .lart-poster__txt { border-inline-start: 0; border-top: 2px solid var(--lart-text); padding: 1em 1.1em 1.2em; }
  .lart-poster__d { -webkit-line-clamp: 3; }
  .lart-lead__in { grid-template-columns: 1fr; }
  .lart-lead__cols { columns: 1; }
  .lart-lead--end .lart-lead__in { direction: rtl; }
  .lart-entry { grid-template-columns: 1.8rem 1fr; }
  .lart-entry__note {
    grid-column: 2; padding-inline-start: .8em; border-inline-start: 2px solid var(--ink);
    display: flex; gap: .6em; flex-wrap: wrap; align-items: baseline;
  }
  .lart-entry__lead { display: none; }
  .lart-entry__note b { display: inline; }
  .lart-page__fold { display: none; }
  .lart-footer__in { grid-template-columns: 1fr; }
  .lart-deck { grid-template-columns: 54px 1fr 54px; }
  .lart-deck__reel { width: 54px; height: 54px; }
  .lart-deck__face { inset-inline: 66px; }
  .lart-listen { grid-template-columns: 1fr auto; }
  .lart-listen__deck { display: none; }
}

@media (max-width: 560px) {
  .lart-wall__stack { min-height: 78vh; }
  .lart-board__row { grid-template-columns: 1fr auto; row-gap: .1em; }
  .lart-board__dots { display: none; }
  .lart-board__what { grid-column: 1 / -1; font-size: .84rem; opacity: .85; white-space: normal; }
  .lart-grid__items { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
  .lart-grid--mosaic .lart-card--big { grid-column: span 2; grid-row: auto; }
  .lart-card--row .lart-card__a { grid-template-columns: 88px 1fr; }
  .lart-tape { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  body .lart *, body .lart *::before, body .lart *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}

@media print {
  body .lart-wall, body .lart-stage, body .lart-reel, body .lart-voices { background: #fff; color: #000; }
}

/* =========================================================================
   طبقة الأسطح والتباين — 1.1.0
   أفادا يفرض لونا صريحا على h1..h6 و p و a، فيسقط كل نصّ يرث لونه فوق
   سطح داكن. هنا يُعلن كل سطح لونَه ولونَ نصّه، وتُعاد الوراثة بقوّة كافية.
   ولذلك أيضا هدأت اللوحة: الورق هو الأصل، والداكن علامة ترقيم لا قاعدة.
   ========================================================================= */

body .lart {
  --paper: var(--lart-paper);
  --on:    var(--lart-text);
  --on-2:  var(--lart-mute);
  --rule:  var(--lart-line);
}

/* --- الأسطح الثلاثة --- */
body .lart.lart-t-paper  { --paper: var(--lart-paper);   --on: var(--lart-text); --on-2: var(--lart-mute); --rule: var(--lart-line); }
body .lart.lart-t-paper2 { --paper: var(--lart-paper-2); --on: var(--lart-text); --on-2: var(--lart-mute); --rule: var(--lart-line); }
body .lart.lart-t-dark {
  --paper: var(--lart-wall);
  --on: #F3EDE0; --on-2: rgba(243,237,224,.64); --rule: rgba(243,237,224,.22);
}

body section.lart, body header.lart, body footer.lart,
body .lart.lart-topbar { background: var(--paper); color: var(--on); }

/* --- الأسطح داخل الأقسام: شيء فاتح داخل قسم داكن والعكس --- */
body .lart .lart-poster__paper,
body .lart .lart-idx,
body .lart .lart-slip,
body .lart .lart-page,
body .lart .lart-hang__frame,
body .lart .lart-work,
body .lart .lart-sum,
body .lart .lart-margin {
  --on: var(--lart-text); --on-2: var(--lart-mute); --rule: var(--lart-line);
  color: var(--on);
}
body .lart .lart-wall__rail,
body .lart .lart-board,
body .lart .lart-stage__box,
body .lart .lart-reel__strip,
body .lart .lart-deck,
body .lart .lart-voices__list,
body .lart .lart-listen,
body .lart .lart-portrait__in,
body .lart .lart-ahead__in,
body .lart .lart-topbar__in {
  --on: #F3EDE0; --on-2: rgba(243,237,224,.64); --rule: rgba(243,237,224,.22);
  color: var(--on);
}

/* --- الوراثة بالقوّة: كل نصّ بلا صنف خاصّ يرث لون سطحه --- */
body .lart :is(h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,blockquote,figure,figcaption,
  span,b,strong,em,i,small,time,label,button,a,abbr,cite,q,sub,sup):not([class*="lart-"]) {
  color: inherit;
}

/* --- العناصر المصنّفة: لون صريح من رموز السطح --- */
body .lart .lart-card__t,
body .lart .lart-lead__t,
body .lart .lart-lead__t a,
body .lart .lart-poster__t,
body .lart .lart-ahead__t,
body .lart .lart-portrait__q,
body .lart .lart-voice__t,
body .lart .lart-deck__title,
body .lart .lart-board__place,
body .lart .lart-board__what,
body .lart .lart-lp__t,
body .lart .lart-act__t,
body .lart .lart-head__t,
body .lart .lart-brand__ar,
body .lart .lart-slip__what,
body .lart .lart-listen__b b { color: var(--on); }

body .lart .lart-card__d,
body .lart .lart-meta,
body .lart .lart-meta__a,
body .lart .lart-act__d,
body .lart .lart-frame__w,
body .lart .lart-voice__m,
body .lart .lart-row__m,
body .lart .lart-head__s,
body .lart .lart-poster__d,
body .lart .lart-poster__m,
body .lart .lart-lead__stand,
body .lart .lart-lead__cols,
body .lart .lart-ahead__d,
body .lart .lart-ahead__m,
body .lart .lart-topbar__d,
body .lart .lart-listen__note,
body .lart .lart-share__h,
body .lart .lart-brand__tag { color: var(--on-2); }

body .lart .lart-kicker,
body .lart .lart-head__more,
body .lart .lart-entry__num,
body .lart .lart-row__n,
body .lart .lart-idx__year,
body .lart .lart-idx__tag,
body .lart .lart-slip__date,
body .lart .lart-brand__la,
body .lart .lart-deck__counter,
body .lart .lart-topbar__t,
body .lart .lart-board__time,
body .lart .lart-margin dt,
body .lart .lart-cartel b { color: var(--ink, var(--lart-ink)); }

body .lart .lart-meta__a,
body .lart .lart-ahead__m a,
body .lart .lart-share__b { color: var(--on); }

/* الخطوط الفاصلة تتبع السطح أيضا */
body .lart .lart-head__rule { background: var(--on); }
body .lart .lart-entry,
body .lart .lart-row,
body .lart .lart-voice { border-bottom-color: var(--rule); }
body .lart .lart-poster__m { border-top-color: var(--rule); }

/* =========================================================================
   صورة خلفية، لكن بأدب
   رمادية، مطبوعة بحبر القسم، خافتة، وفوقها حجاب من لون السطح نفسه.
   مهما كانت الصورة لا يمكن أن يسقط التباين.
   ========================================================================= */
.lart-bg {
  position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none;
  background-image: var(--bg);
  background-size: cover;
  background-position: var(--bg-pos, center);
  filter: grayscale(1) contrast(.9);
  opacity: .22;
}
.lart-bg > i {
  position: absolute; inset: 0;
  background: var(--ink, var(--lart-ink));
  mix-blend-mode: multiply; opacity: .5;
}
body .lart.lart-t-dark .lart-bg { opacity: .3; filter: grayscale(1) contrast(1.05) brightness(.55); }
body .lart.lart-t-dark .lart-bg > i { opacity: .35; }

/* =========================================================================
   الخشبة: صندوق داكن على ورق، لا شريط أسود يقطع الصفحة
   ========================================================================= */
body .lart.lart-stage { padding-block: clamp(34px, 4.4vw, 70px); }
.lart-stage__box {
  position: relative; overflow: hidden;
  background: #100d0c;
  padding: clamp(26px, 4vw, 58px) clamp(30px, 6vw, 96px) clamp(48px, 6vw, 92px);
  box-shadow: 0 22px 50px rgba(0,0,0,.28);
}
.lart-stage__box .lart-stage__curtain { width: clamp(26px, 5vw, 78px); }
.lart-stage__box .lart-stage__floor { position: relative; z-index: 3; }
.lart-stage__box .lart-stage__boards { height: clamp(28px, 4vw, 56px); }

/* =========================================================================
   الشريط وأصوات: الشيء الداكن مُحتوى، والقسم على ورق
   ========================================================================= */
body .lart.lart-reel   { padding-block: clamp(34px, 4.4vw, 70px); }
body .lart.lart-voices { padding-block: clamp(34px, 4.4vw, 70px); }
.lart-reel__strip { box-shadow: 0 18px 44px rgba(0,0,0,.22); }
.lart-voices__list {
  background: #17151a; padding: .4em .8em;
  box-shadow: 0 14px 34px rgba(0,0,0,.2);
}

/* =========================================================================
   تهدئة الإيقاع الطباعي
   ========================================================================= */
.lart-head { margin-bottom: clamp(22px, 3.2vw, 42px); }
.lart-head__t { letter-spacing: -.005em; }
.lart-card__t, .lart-lp__t, .lart-act__t { letter-spacing: -.004em; }
.lart-grid__items { gap: clamp(20px, 2.8vw, 38px); }

/* =========================================================================
   اللوحة النهائية — إيقاع الصفحة
   الورق هو الأصل. الداكن ثلاث مرّات فقط: الجدار في الأعلى، البورتريه في
   الوسط، التذييل في الأسفل. وبينها أسطح ورقية تتفاوت قليلا لا كثيرا.
   هذه القواعد تأتي بعد ما سبقها عمدا: عند تساوي الأولوية يفوز الأخير.
   ========================================================================= */

body .lart.lart-topbar  { --paper: var(--lart-text); --on: #F3EDE0; --on-2: rgba(243,237,224,.6); }
body .lart.lart-mast    { --paper: var(--lart-paper); --on: var(--lart-text); background: var(--paper); color: var(--on); }
body .lart.lart-wall    { --paper: var(--lart-wall); --on: #F3EDE0; --on-2: rgba(243,237,224,.64); --rule: rgba(243,237,224,.2); background: var(--paper); color: var(--on); }
body .lart.lart-tonight { --paper: var(--lart-paper-2); --on: var(--lart-text); background: var(--paper); color: var(--on); }
body .lart.lart-lead    { background: var(--paper); color: var(--on); }
body .lart.lart-stage   { --paper: var(--lart-paper); --on: var(--lart-text); background: var(--paper); color: var(--on); }
body .lart.lart-reel    { --paper: var(--lart-paper-2); --on: var(--lart-text); background: var(--paper); color: var(--on); }
body .lart.lart-sleeve  { --paper: var(--lart-paper); --on: var(--lart-text); background: var(--paper); color: var(--on); }
body .lart.lart-salle   { --paper: var(--lart-paper-2); --on: var(--lart-text); background: var(--paper); color: var(--on); }
body .lart.lart-marge   { --paper: var(--lart-paper); --on: var(--lart-text); background: var(--paper); color: var(--on); }
body .lart.lart-agenda  { --paper: var(--lart-paper-3); --on: var(--lart-text); background: var(--paper); color: var(--on); }
body .lart.lart-voices  { --paper: var(--lart-paper); --on: var(--lart-text); background: var(--paper); color: var(--on); }
body .lart.lart-portrait{ --paper: var(--lart-wall); --on: #F3EDE0; --on-2: rgba(243,237,224,.7); background: var(--paper); color: var(--on); }
body .lart.lart-archive { --paper: var(--lart-paper-2); --on: var(--lart-text); background: var(--paper); color: var(--on); }
body .lart.lart-grid    { background: var(--paper); color: var(--on); }
body .lart.lart-footer  { --paper: var(--lart-text); --on: #F3EDE0; --on-2: rgba(243,237,224,.55); --rule: rgba(243,237,224,.14); background: var(--paper); color: var(--on); }
body .lart.lart-ahead   { --paper: var(--lart-wall); --on: #F3EDE0; --on-2: rgba(243,237,224,.78); color: var(--on); }

/* الأقسام الأخيرة تتبع اختيار المحرّر إن اختار، وإلّا فلها لونها أعلاه */
body .lart.lart-t-dark   { background: var(--paper); color: var(--on); }
body .lart.lart-t-paper  { background: var(--paper); color: var(--on); }
body .lart.lart-t-paper2 { background: var(--paper); color: var(--on); }

/* الشريط داخل قسم ورقي: أبقِ إطاره الداكن وحده */
body .lart.lart-reel .lart-reel__strip { background: #07080d; padding-block: 26px; }
body .lart.lart-reel .lart-reel__perf { background-color: #07080d; }

/* فاصل أبيض رقيق بين الأقسام، كما طُلب في المدى ونحتاجه هنا أيضا */
body section.lart + section.lart,
body section.lart + footer.lart { border-top: 1px solid rgba(0,0,0,.06); }

/* =========================================================================
   حبر للنصّ الصغير
   الحبر الخالص جميل في الكتل والخطوط، لكنه لا يكفي تباينا في كلمة صغيرة.
   لذلك نمزجه بلون نصّ السطح نفسه: يغمق فوق الورق، ويفتح فوق الداكن،
   من غير أن يتغيّر الحبر في الكتل والأختام والنقاط.
   ========================================================================= */
body .lart { --ink-t: var(--ink, var(--lart-ink)); }
@supports (color: color-mix(in srgb, red 50%, blue)) {
  body .lart { --ink-t: color-mix(in srgb, var(--ink, var(--lart-ink)) 66%, var(--on)); }
}

body .lart .lart-kicker,
body .lart .lart-head__more,
body .lart .lart-brand__la,
body .lart .lart-deck__counter,
body .lart .lart-idx__tag,
body .lart .lart-cartel b,
body .lart .lart-board__time,
body .lart .lart-margin dt,
body .lart .lart-work__h,
body .lart .lart-sum__h,
body .lart .lart-margin__h,
body .lart .lart-lead__art figcaption,
body .lart .lart-entry__note b,
body .lart .lart-frame .lart-kicker { color: var(--ink-t); }

/* الأرقام والعناوين الكبيرة تبقى بالحبر الخالص: حجمها يكفيها */
body .lart .lart-entry__num,
body .lart .lart-row__n,
body .lart .lart-idx__year,
body .lart .lart-slip__date,
body .lart .lart-head__t .lart-mis::before { color: var(--ink, var(--lart-ink)); }

/* --- الأسطح التي يحمل عنصرها صنف lart نفسه، لا أبا له --- */
body .lart.lart-listen,
body .lart.lart-work,
body .lart.lart-sum,
body .lart.lart-margin { color: var(--on); }
body .lart.lart-listen {
  --on: #F3EDE0; --on-2: rgba(243,237,224,.64); --rule: rgba(243,237,224,.22);
}
body .lart.lart-work,
body .lart.lart-sum,
body .lart.lart-margin {
  --on: var(--lart-text); --on-2: var(--lart-mute); --rule: var(--lart-line);
}
body .lart .lart-listen__b b,
body .lart .lart-listen__b { color: var(--on); }
body .lart .lart-listen__note { color: var(--on-2); }

/* شارة الشريط: الأبيض على الأحمر لا يكفي في حجم صغير */
body .lart .lart-tick__lab { background: var(--lart-text); color: var(--lart-paper); }
body .lart .lart-tick__i i { color: var(--lart-ink); }

/* --- آخر ما بقي من التباين --- */
body .lart .lart-entry__num,
body .lart .lart-row__n,
body .lart .lart-idx__year,
body .lart .lart-slip__date { color: var(--ink-t); }
body .lart .lart-tick__i i { color: var(--lart-mute); }
body .lart.lart-footer { --on-2: rgba(243,237,224,.66); }
body .lart .lart-footer__end { color: var(--on-2); }
body .lart .lart-footer__brand p { color: var(--on-2); }
body .lart .lart-footer__cols a { color: var(--on-2); }
body .lart .lart-footer__cols a:hover { color: var(--on); }
/* التدرّج خلفية صورة لا لون: أضف لونا تحته حتى لا يعتمد النصّ عليه وحده */
.lart-deck { background-color: #221e25; }
.lart-listen { background-color: #1a181c; }
.lart-board { background-color: #14120f; }
.lart-stage__box { background-color: #100d0c; }

/* =========================================================================
   بورتريه: صورة داكنة فعلا، لا غبش ذهبي
   ========================================================================= */
body .lart.lart-portrait .lart-portrait__art .lart-duo { --duo-lo: #14100E; --duo-hi: #D6C29B; }
body .lart.lart-portrait .lart-portrait__art img { filter: grayscale(1) brightness(.88) contrast(1.22); }
.lart-portrait__art::after {
  background:
    linear-gradient(-90deg, rgba(10,8,7,.92) 0 46%, rgba(10,8,7,.6) 74%, rgba(10,8,7,.34)),
    linear-gradient(0deg, rgba(10,8,7,.6), transparent 58%);
}
body .lart.lart-portrait .lart-portrait__in { padding-block: clamp(50px, 7vw, 108px); }

/* جدار الرواق يُمرَّر: اجعل حافّتيه تتلاشيان بدل أن تُقصّا */
.lart-salle__wall {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 26px, #000 calc(100% - 26px), transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 26px, #000 calc(100% - 26px), transparent 100%);
}