/* =====================================================================
   جولة 84: صندوق الحوار بشكل المنشأة — ينركّب من المحرك (story_cfg.look)
   الإطار (data-f): panel إنتركم · bar ترجمة فيلم · term طرفية خضرا · none نص بس
   المكان (data-pos) · الصورة (data-pic: start/end/off) · تأثير الصورة (data-fx) · الخط (data-font) · الاسم (data-nm)
   الألوان والحجم والشفافية والتشويش: متغيرات --dt --db --da --dsz --dn · لون المتكلم --dc
   ===================================================================== */
.fzdlg { --dt: #e6ece8; --db: rgba(11, 15, 13, .92); --da: #9fe8b0; --dc: #9fe8b0; --dn: .3; --dsz: 1; --dnm: var(--dc);
  position: fixed; z-index: 160; left: 50%; bottom: calc(12vh + 14px); width: min(780px, 92vw); transform: translate(-50%, 8px); opacity: 0;
  transition: opacity .2s ease, transform .2s ease; pointer-events: auto; user-select: none; -webkit-user-select: none; touch-action: manipulation; color: var(--dt);
  font-family: 'Noto Sans Arabic', Tahoma, 'Segoe UI', Arial, sans-serif; }
.fzdlg.on { opacity: 1; transform: translate(-50%, 0); }
.fzdlg[data-pos="top"] { bottom: auto; top: max(14px, env(safe-area-inset-top)); }
.fzdlg.open { bottom: max(18px, env(safe-area-inset-bottom)); top: auto; }
body.touch .fzdlg.open { bottom: auto; top: max(10px, env(safe-area-inset-top)); width: min(640px, 74vw); }   /* المصعد بالجوال: فوق، عشان الجويستيك */
.fzdlg[data-font="mono"] { font-family: 'Courier Prime', 'Courier New', ui-monospace, 'Noto Sans Arabic', monospace; }
.fzdlg[data-font="serif"] { font-family: 'Noto Naskh Arabic', 'Amiri', 'Traditional Arabic', serif; }

/* الاسم كبطاقة صغيرة فوق الصندوق */
.fzdlg-name { display: inline-flex; align-items: center; gap: 8px; margin: 0 14px; padding: 3px 12px 4px; font-size: calc(.9rem * var(--dsz)); font-weight: 700; color: var(--dnm); }
.fzdlg-name[hidden] { display: none; }
.fzdlg-led { width: 7px; height: 7px; border-radius: 50%; background: #e2342e; box-shadow: 0 0 6px #e2342e; flex: 0 0 auto; }
.fzdlg.talk .fzdlg-led { animation: fzdlg-led .7s steps(2) infinite; }
@keyframes fzdlg-led { 50% { opacity: .25; } }

.fzdlg-box { position: relative; display: flex; align-items: flex-start; gap: 14px; min-height: 96px; padding: 14px 18px 18px; overflow: hidden; }
.fzdlg[data-pic="end"] .fzdlg-box { flex-direction: row-reverse; }
.fzdlg[data-pic="off"] .fzdlg-pic { display: none; }
.fzdlg-pic { position: relative; flex: 0 0 auto; width: calc(72px * var(--dsz)); height: calc(72px * var(--dsz)); background: #050706; display: grid; place-items: center; overflow: hidden; }
.fzdlg-pic canvas, .fzdlg-pic img { width: 100%; height: 100%; image-rendering: pixelated; object-fit: cover; }
.fzdlg-pfx { position: absolute; inset: 0; pointer-events: none; }
.fzdlg-txt { position: relative; flex: 1 1 auto; font-size: calc(clamp(1rem, 2.3vw, 1.24rem) * var(--dsz)); line-height: 1.85; white-space: pre-wrap; word-break: normal; text-align: start; min-height: 3.7em; }
.fzdlg-in { color: var(--dnm); font-weight: 700; margin-inline-end: .4em; }
.fzdlg-in:empty { display: none; }
.fzdlg-red { color: #ff3b3b; text-shadow: 0 0 6px #ff000088; }
.fzdlg-shk { display: inline-block; animation: fzdlg-shk .09s steps(2) infinite; }
@keyframes fzdlg-shk { 0% { transform: translate(0, 0); } 25% { transform: translate(-1px, 1px); } 50% { transform: translate(1px, -1px); } 75% { transform: translate(-1px, -1px); } 100% { transform: translate(1px, 1px); } }
.fzdlg-cur { display: none; width: .55em; height: 1.05em; margin-inline-start: 2px; vertical-align: -.15em; background: var(--da); }
.fzdlg[data-cur="1"] .fzdlg-cur { display: inline-block; animation: fzdlg-cur 1s steps(1) infinite; }
@keyframes fzdlg-cur { 50% { opacity: 0; } }
.fzdlg-more { position: absolute; left: 14px; bottom: 7px; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 8px solid var(--da); opacity: 0; }
.fzdlg-more.on { opacity: 1; animation: fzdlg-more .8s ease-in-out infinite; }
@keyframes fzdlg-more { 0%, 100% { transform: translateY(0); opacity: 1; } 50% { transform: translateY(4px); opacity: .5; } }
.fzdlg-noise { position: absolute; inset: 0; pointer-events: none; opacity: var(--dn); mix-blend-mode: overlay;
  background: repeating-linear-gradient(0deg, rgba(255, 255, 255, .09) 0 1px, transparent 1px 3px); }
.fzdlg-fade { animation: fzdlg-fade .5s ease both; }
@keyframes fzdlg-fade { from { opacity: 0; filter: blur(3px); } to { opacity: 1; filter: none; } }

/* ---------- (أ) إنتركم المنشأة: لوح معدني، شبكة سماعة، لمبة بث ---------- */
.fzdlg[data-f="panel"] .fzdlg-box { background: var(--db); border: 1px solid color-mix(in srgb, var(--da) 40%, transparent); border-radius: 2px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), inset 0 0 0 1px rgba(0, 0, 0, .6), 0 12px 32px rgba(0, 0, 0, .55);
  padding-inline-end: 34px; }
.fzdlg[data-f="panel"] .fzdlg-box::after { content: ''; position: absolute; top: 0; inset-inline-start: 0; width: 38%; height: 2px; background: linear-gradient(to left, var(--da), transparent); opacity: .55; }
.fzdlg[data-f="panel"] .fzdlg-box::before { content: ''; position: absolute; inset-inline-end: 10px; top: 14px; bottom: 14px; width: 12px; opacity: .55;
  background: radial-gradient(circle, color-mix(in srgb, var(--da) 70%, #000) 1.3px, transparent 1.6px) 0 0 / 6px 6px; }
.fzdlg[data-f="panel"][data-pic="end"] .fzdlg-box { padding-inline-end: 18px; padding-inline-start: 34px; }
.fzdlg[data-f="panel"][data-pic="end"] .fzdlg-box::before { inset-inline-end: auto; inset-inline-start: 10px; }
.fzdlg[data-f="panel"] .fzdlg-name { background: var(--db); border: 1px solid color-mix(in srgb, var(--da) 40%, transparent); border-bottom: 0; margin-bottom: -1px; position: relative; z-index: 1; }
.fzdlg[data-f="panel"] .fzdlg-pic { border: 1px solid color-mix(in srgb, var(--da) 35%, transparent); box-shadow: inset 0 0 12px #000; }
.fzdlg[data-f="panel"] .fzdlg-txt { text-shadow: 0 1px 0 #000; }

/* ---------- (ب) ترجمة فيلم رعب: بدون صندوق، نص بالنص بظل ثقيل ---------- */
.fzdlg[data-f="bar"] { width: min(980px, 94vw); }
.fzdlg[data-f="bar"] .fzdlg-box { justify-content: center; align-items: center; min-height: 0; padding: 18px 22px 22px;
  background: radial-gradient(ellipse 70% 100% at 50% 60%, var(--db), transparent 72%); }
.fzdlg[data-f="bar"] .fzdlg-txt { flex: 0 1 auto; text-align: center; min-height: 0; text-shadow: 0 2px 2px #000, 0 0 12px #000, 0 0 24px #000; letter-spacing: .01em; }
.fzdlg[data-f="bar"] .fzdlg-name { display: flex; justify-content: center; margin: 0 auto -6px; font-weight: 600; letter-spacing: .04em; text-shadow: 0 1px 2px #000; }
.fzdlg[data-f="bar"] .fzdlg-name .fzdlg-led { display: none; }
.fzdlg[data-f="bar"] .fzdlg-pic { border-radius: 50%; width: calc(54px * var(--dsz)); height: calc(54px * var(--dsz)); box-shadow: 0 0 0 1px rgba(255, 255, 255, .15), 0 0 18px #000; }
.fzdlg[data-f="bar"] .fzdlg-more { left: 50%; margin-left: -6px; bottom: 2px; }
.fzdlg[data-f="bar"] .fzdlg-noise { display: none; }

/* ---------- (ج) محطة طرفية: شاشة خضرا، خط ثابت، مؤشر ---------- */
.fzdlg[data-f="term"] .fzdlg-box { background: var(--db); border: 1px solid var(--da); border-radius: 3px;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, .7), 0 0 22px color-mix(in srgb, var(--da) 22%, transparent), inset 0 0 28px color-mix(in srgb, var(--da) 10%, transparent); }
.fzdlg[data-f="term"] .fzdlg-txt { color: var(--dt); text-shadow: 0 0 6px color-mix(in srgb, var(--dt) 55%, transparent); }
.fzdlg[data-f="term"] .fzdlg-in::before { content: '> '; }
.fzdlg[data-f="term"] .fzdlg-name { padding: 0 2px 4px; color: var(--da); font-weight: 400; letter-spacing: .06em; }
.fzdlg[data-f="term"] .fzdlg-name::before { content: '['; } .fzdlg[data-f="term"] .fzdlg-name::after { content: ']'; }
.fzdlg[data-f="term"] .fzdlg-name .fzdlg-led { border-radius: 0; background: var(--da); box-shadow: 0 0 6px var(--da); }
.fzdlg[data-f="term"] .fzdlg-pic { border: 1px solid color-mix(in srgb, var(--da) 60%, transparent); }
.fzdlg[data-f="term"] .fzdlg-pic canvas, .fzdlg[data-f="term"] .fzdlg-pic img { filter: grayscale(1) sepia(1) hue-rotate(70deg) saturate(2.6) brightness(.95); }
.fzdlg[data-f="term"] .fzdlg-noise { mix-blend-mode: normal; background: repeating-linear-gradient(0deg, rgba(0, 0, 0, .35) 0 1px, transparent 1px 3px); }

/* ---------- نص بس ---------- */
.fzdlg[data-f="none"] .fzdlg-box { background: none; }
.fzdlg[data-f="none"] .fzdlg-txt { text-shadow: 0 2px 2px #000, 0 0 10px #000; }
.fzdlg[data-f="none"] .fzdlg-noise { display: none; }

/* ---------- تأثير الصورة ---------- */
.fzdlg[data-fx="scan"] .fzdlg-pfx { background: repeating-linear-gradient(0deg, rgba(0, 0, 0, .35) 0 1px, transparent 1px 3px), linear-gradient(transparent 0 40%, color-mix(in srgb, var(--da) 22%, transparent) 50%, transparent 60%) 0 0 / 100% 300%;
  animation: fzdlg-scan 3.2s linear infinite; }
@keyframes fzdlg-scan { from { background-position: 0 0, 0 100%; } to { background-position: 0 0, 0 -200%; } }
.fzdlg[data-fx="static"] .fzdlg-pfx { opacity: .28; mix-blend-mode: screen; background-image: repeating-radial-gradient(circle at 17% 32%, #fff 0 .6px, transparent .8px 2.3px), repeating-radial-gradient(circle at 71% 64%, #fff 0 .5px, transparent .7px 1.9px);
  animation: fzdlg-static .18s steps(3) infinite; }
@keyframes fzdlg-static { 0% { background-position: 0 0, 0 0; } 33% { background-position: 3px -2px, -2px 3px; } 66% { background-position: -3px 2px, 2px -1px; } }
.fzdlg[data-fx="glitch"] .fzdlg-pic canvas, .fzdlg[data-fx="glitch"] .fzdlg-pic img { animation: fzdlg-gl 3.6s steps(1) infinite; }
@keyframes fzdlg-gl { 0%, 91%, 100% { transform: none; clip-path: none; } 92% { transform: translateX(-3px); clip-path: inset(18% 0 52% 0); } 94% { transform: translateX(3px); clip-path: inset(56% 0 12% 0); } 96% { transform: translateX(-1px); clip-path: none; } }

/* ---------- وميض خفيف (الكهرباء ضعيفة) ---------- */
.fzdlg[data-flk="1"].on .fzdlg-box { animation: fzdlg-flk 7s steps(1) infinite; }
@keyframes fzdlg-flk { 0%, 61%, 63%, 100% { opacity: 1; } 62% { opacity: .82; } 63.5% { opacity: .94; } }

/* الجوال */
@media (max-width: 560px) { .fzdlg-box { min-height: 80px; padding: 10px 12px 16px; gap: 10px; } .fzdlg-pic { width: calc(54px * var(--dsz)); height: calc(54px * var(--dsz)); } }
@media (pointer: coarse) and (max-height: 500px) { .fzdlg { bottom: calc(9vh + 6px); } .fzdlg-box { min-height: 66px; padding-top: 10px; padding-bottom: 14px; }
  .fzdlg-txt { font-size: calc(.98rem * var(--dsz)); line-height: 1.7; min-height: 3.4em; } .fzdlg-pic { width: calc(48px * var(--dsz)); height: calc(48px * var(--dsz)); } }
@media (prefers-reduced-motion: reduce) { .fzdlg-shk, .fzdlg-more.on, .fzdlg-pfx, .fzdlg-pic canvas, .fzdlg-pic img, .fzdlg .fzdlg-box, .fzdlg-led, .fzdlg-cur { animation: none !important; } }

/* صندوق المشهد يطلع بشاشة اللعب بس (لو الدرس رجع بعد انقطاع والقائمة ظاهرة ما يغطيها) — المصعد (open) بأي مكان · معاينة المحرك (demo) */
body:not([data-scr="scr-game"]) .fzdlg:not(.open):not(.demo) { display: none; }
.fzdlg.demo { position: relative; left: auto; bottom: auto; top: auto; transform: none; width: 100%; z-index: 1; }
.fzdlg.demo.on { transform: none; }

/* جولة 85: سطر «ناعم» وقت اللعب (فصول الدرس) — ما ياخذ اللمس ولا الكيبورد، ويطلع فوق عشان ما يغطي الجويستيك */
.fzdlg.soft { pointer-events: none; }
body.touch .fzdlg.soft { top: auto; bottom: max(8px, env(safe-area-inset-bottom)); width: min(470px, 54vw); --dsz: .84 !important; }
body.touch .fzdlg.soft .fzdlg-box { min-height: 0; padding: 8px 10px 10px; }
body.touch .fzdlg.soft .fzdlg-txt { min-height: 0; }
.fzdlg.soft .fzdlg-more { display: none; }