/* =====================================================================
   جولة 66: صندوق البلاغات — النموذج، قائمة الإيقاف، الإشعارات، وأزرار «بلّغ عن خطأ».
   نفس الإطار الموحّد (fz-frame في frame.css): لوح معدني، شريط تحذير، مسامير.
   الأزرار مخفية لين السيرفر يقول الصندوق مفتوح لك (html.fzbug-on).
   ===================================================================== */
html:not(.fzbug-on) .fzbug-btn { display: none !important }
.fzbug-btn svg { width: 18px; height: 18px; flex: none }
/* القطار: يلبس tr-btn نفسه · المخطّط (mk-hr / mk-tb / lv-bar) يلبس btn sm أو mkb */
.mk-hr .fzbug-btn.mkb { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 10px; cursor: pointer; color: var(--text); background: #0b0c11aa; border: 1px solid var(--line); border-radius: var(--radius); font: inherit; font-size: .82rem }
.mk-hr .fzbug-btn.mkb:hover { border-color: #ff6b6b88; color: #ffb3b3 }

/* ---------- الخلفية والنافذة ---------- */
.fzbug-back { position: fixed; inset: 0; z-index: 210; display: grid; place-items: center; padding: max(10px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
  background: radial-gradient(ellipse at 50% 40%, #000000a6, #000000e6); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); opacity: 0; transition: opacity .16s }
.fzbug-back.on { opacity: 1 } .fzbug-back.off { opacity: 0; pointer-events: none }
/* أثناء المباراة: بدون عتمة كاملة، والنافذة بالوسط فوق — الجويستيك وزر الفعل يبقون حرّين */
.fzbug-back.ingame { background: none; -webkit-backdrop-filter: none; backdrop-filter: none; pointer-events: none; place-items: start center; padding-top: max(8px, env(safe-area-inset-top)) }
.fzbug-back.ingame .fzbug-box { pointer-events: auto; width: min(460px, 52vw); max-height: calc(100dvh - 16px); box-shadow: 0 18px 50px #000c !important }
.fzbug-box { position: relative; width: min(520px, 100%); max-height: calc(100dvh - 20px); display: flex; flex-direction: column; color: var(--text); font-family: var(--font);
  padding: 21px 16px 14px; border-radius: 4px; transform: translateY(8px) scale(.98); transition: transform .2s cubic-bezier(.2, .9, .3, 1.15) }
.fzbug-back.on .fzbug-box { transform: none }
.fzbug-h { display: flex; align-items: center; gap: 10px; padding-bottom: 10px; border-bottom: 1px dashed #ffffff1c; flex: none }
.fzbug-h h3 { margin: 0; font-size: 1.1rem; font-weight: 900 }
.fzbug-hic { width: 32px; height: 32px; display: grid; place-items: center; flex: none; color: #ff6b6b; background: #0a0b10; border: 1px solid #ff6b6b88;
  clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px) }
.fzbug-hic svg { width: 19px; height: 19px }
.fzbug-x { width: 36px; height: 36px; display: grid; place-items: center; flex: none; margin-inline-start: auto; cursor: pointer; color: #e8e6df;
  background: linear-gradient(180deg, #262a35, #12141a); border: 1px solid #ffffff26; clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px) }
.fzbug-x:hover { background: linear-gradient(180deg, #b7101a, #5a070c) } .fzbug-x svg { width: 16px; height: 16px }
.fzbug-body { overflow-y: auto; overscroll-behavior: contain; padding: 4px 2px 2px; flex: 1 1 auto; min-height: 0 }
.fzbug-live { display: inline-flex; align-items: center; gap: 6px; margin: 8px 0 0; padding: 3px 10px; font-size: .78rem; color: #9be15d; background: #1f3e2a66; border: 1px solid #9be15d44; border-radius: 99px }
.fzbug-live svg { width: 12px; height: 12px }
.fzbug-q { margin: 12px 0 7px; font-weight: 800; font-size: .95rem }
.fzbug-chips { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px }
.fzbug-chip { min-height: 42px; padding: 6px 8px; cursor: pointer; font: inherit; font-size: .86rem; font-weight: 700; color: #d9d7cf; line-height: 1.25;
  background: linear-gradient(180deg, #1c1f28, #12141a); border: 1px solid #ffffff1f; border-radius: 3px; transition: border-color .12s, background .12s, color .12s }
.fzbug-chip:hover { border-color: #ffffff44; color: #fff }
.fzbug-chip.on { color: #fff; background: linear-gradient(180deg, #2d6b55, #18402f); border-color: var(--accent2); box-shadow: inset 0 0 0 1px #4db38f55 }
.fzbug-chip.red { color: #ffb3b3; border-color: #ff3b4766 }
.fzbug-chip.red.on { background: linear-gradient(180deg, #8c1620, #4a070c); border-color: #ff3b47; color: #fff }
.fzbug-chip:focus-visible, .fzbug-btnx:focus-visible, .fzbug-pb:focus-visible, .fzbug-x:focus-visible { outline: 2px solid #ffd166; outline-offset: 2px }
.fzbug-more { margin-top: 10px; padding: 6px 2px; min-height: 40px; background: none; border: 0; color: #9fd8e8; cursor: pointer; font: inherit; font-size: .86rem; font-weight: 700 }
.fzbug-desc { margin-top: 10px; position: relative }
.fzbug-desc textarea { width: 100%; box-sizing: border-box; resize: vertical; min-height: 70px; padding: 9px 10px; font: inherit; font-size: .9rem; color: #fff; background: #0a0b10; border: 1px solid #ffffff2a; border-radius: 3px }
.fzbug-desc textarea:focus { outline: none; border-color: var(--accent2) }
.fzbug-cnt { display: block; text-align: end; font-size: .72rem; color: #8b8a85; margin-top: 3px }
.fzbug-shot { margin-top: 12px }
.fzbug-chk { display: flex; align-items: center; gap: 8px; cursor: pointer; font-weight: 700; font-size: .9rem; min-height: 32px }
.fzbug-chk input { width: 19px; height: 19px; accent-color: var(--accent2) }
.fzbug-chk span { display: inline-flex; align-items: center; gap: 6px } .fzbug-chk svg { width: 16px; height: 16px }
.fzbug-prev { display: flex; align-items: center; gap: 10px; margin-top: 6px }
.fzbug-prev img { width: 132px; aspect-ratio: 16 / 9; object-fit: cover; border: 1px solid #ffffff2a; border-radius: 3px; background: #000; transition: opacity .15s, filter .15s }
.fzbug-prev.off img { opacity: .3; filter: grayscale(1) }
.fzbug-rm { padding: 7px 10px; min-height: 36px; background: none; border: 1px solid #ffffff26; color: #d9d7cf; border-radius: 3px; cursor: pointer; font: inherit; font-size: .8rem }
.fzbug-rm:hover { border-color: #ff6b6b; color: #ffb3b3 }
.fzbug-noshot { display: flex; align-items: center; gap: 6px; margin: 0; font-size: .8rem; color: #8b8a85 } .fzbug-noshot svg { width: 15px; height: 15px; flex: none }
.fzbug-what { margin-top: 8px; font-size: .78rem; color: #8b8a85 } .fzbug-what summary { cursor: pointer; padding: 10px 0; min-height: 20px }
.fzbug-what p { margin: 4px 0 0; line-height: 1.6 }
.fzbug-err { margin: 8px 0 0; min-height: 1em; color: #ff8a91; font-size: .84rem; font-weight: 700 }
.fzbug-f { display: flex; gap: 10px; justify-content: flex-end; padding-top: 10px; border-top: 1px dashed #ffffff14; flex: none }
.fzbug-btnx { min-height: 44px; min-width: 96px; padding: 0 18px; cursor: pointer; font: inherit; font-weight: 800; font-size: .95rem; border-radius: 3px; border: 1px solid #ffffff26; color: #e8e6df; background: linear-gradient(180deg, #262a35, #12141a) }
.fzbug-btnx.go { color: #fff; background: linear-gradient(180deg, #c8141f, #7a0a12); border-color: #ff3b4788 }
.fzbug-btnx.go:hover:not(:disabled) { filter: brightness(1.12) }
.fzbug-btnx:disabled { opacity: .45; cursor: not-allowed }
.fzbug-done { text-align: center; padding: 22px 8px 10px }
.fzbug-done b { display: block; font-size: 1.15rem; margin-top: 10px } .fzbug-done p { margin: 6px 0 0; color: #b9b7af }
.fzbug-okic { width: 54px; height: 54px; display: inline-grid; place-items: center; color: #9be15d; border: 2px solid #9be15d; border-radius: 50%; background: #1f3e2a66 }
.fzbug-okic svg { width: 28px; height: 28px }

/* ---------- «نلتقط صورة…» ---------- */
.fzbug-busy { position: fixed; top: max(14px, env(safe-area-inset-top)); left: 50%; transform: translateX(-50%); z-index: 211; display: flex; align-items: center; gap: 8px; padding: 8px 14px; background: #000d; color: #fff; border-inline-start: 4px solid var(--accent2); font-size: .86rem }
.fzbug-busy span { width: 14px; height: 14px; border: 2px solid #ffffff44; border-top-color: #fff; border-radius: 50%; animation: fzbugSpin .7s linear infinite }
@keyframes fzbugSpin { to { transform: rotate(360deg) } }

/* ---------- قائمة الإيقاف (المطاردة) ---------- */
.fzbug-pause { position: fixed; top: max(70px, calc(env(safe-area-inset-top) + 62px)); left: 50%; transform: translateX(-50%) translateY(-6px); z-index: 209; opacity: 0; transition: opacity .15s, transform .15s; pointer-events: none }
.fzbug-pause.on { opacity: 1; transform: translateX(-50%); pointer-events: auto }
.fzbug-pbox { display: flex; flex-direction: column; gap: 7px; width: min(300px, 46vw); padding: 19px 12px 12px; border-radius: 4px }
.fzbug-pbox .fzbug-live { margin: 0 auto 2px }
.fzbug-pb { display: flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 12px; cursor: pointer; font: inherit; font-weight: 800; color: #e8e6df; background: linear-gradient(180deg, #1c1f28, #12141a); border: 1px solid #ffffff1f; border-radius: 3px; text-align: start }
.fzbug-pb:hover { border-color: #ffffff55 } .fzbug-pb svg { width: 18px; height: 18px; flex: none } .fzbug-pb span { flex: 1 }
.fzbug-pb.go { border-color: #4db38f88 } .fzbug-pb kbd { font: 700 .7rem/1 var(--font); padding: 3px 6px; border: 1px solid #ffffff2a; border-radius: 3px; color: #8b8a85 }
body.touch .fzbug-pb kbd { display: none }

/* ---------- الإشعار (انصلح بلاغك / رد) ---------- */
.fzbug-note { position: fixed; top: max(12px, env(safe-area-inset-top)); left: 50%; transform: translate(-50%, -12px); z-index: 205; opacity: 0; transition: opacity .2s, transform .2s; width: min(460px, calc(100vw - 24px)) }
.fzbug-note.on { opacity: 1; transform: translate(-50%, 0) }
.fzbug-nbox { display: flex; align-items: center; gap: 12px; padding: 19px 14px 12px; border-radius: 4px }
.fzbug-nic { width: 40px; height: 40px; display: grid; place-items: center; flex: none; color: #9fd8e8; border: 1px solid #9fd8e866; border-radius: 50% }
.fzbug-nic.ok { color: #9be15d; border-color: #9be15d88 } .fzbug-nic svg { width: 20px; height: 20px }
.fzbug-ntx { flex: 1; min-width: 0 } .fzbug-ntx b { display: block } .fzbug-ntx p { margin: 3px 0 0; font-size: .86rem; color: #c9c7bf; line-height: 1.55; word-wrap: break-word }
.fzbug-nbox .fzbug-btnx { min-width: 70px }

/* ---------- الجوال ---------- */
@media (max-width: 560px) {
  .fzbug-chips { grid-template-columns: repeat(2, minmax(0, 1fr)) }
  .fzbug-box { padding: 20px 12px 12px }
  .fzbug-btnx { flex: 1 }
}
/* جوال بالعرض (ارتفاع قليل): نضغط المسافات عشان النافذة كلها تبان */
@media (max-height: 520px) and (orientation: landscape) {
  .fzbug-box { max-height: calc(100dvh - 12px); padding-top: 17px }
  .fzbug-h { padding-bottom: 6px } .fzbug-h h3 { font-size: 1rem } .fzbug-hic { width: 28px; height: 28px }
  .fzbug-q { margin: 8px 0 5px; font-size: .88rem }
  .fzbug-chips { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px }
  .fzbug-chip { min-height: 40px; font-size: .8rem; padding: 4px 6px }
  .fzbug-prev img { width: 104px }
  .fzbug-btnx { min-height: 42px }
  .fzbug-back.ingame .fzbug-box { width: min(440px, 50vw) }
  .fzbug-back.ingame .fzbug-chips { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px }
  .fzbug-back.ingame .fzbug-chip { font-size: .74rem; padding: 3px 4px; min-height: 40px }
  .fzbug-back.ingame .fzbug-live { margin-top: 4px }
  .fzbug-pause { top: max(8px, env(safe-area-inset-top)) }
}
@media (prefers-reduced-motion: reduce) { .fzbug-back, .fzbug-box, .fzbug-pause, .fzbug-note { transition: none } .fzbug-busy span { animation: none } }
/* جولة 67: سطر «رسائل المنشأة» في قائمة الإيقاف — للعلم بس (ما يفتح شي أثناء المباراة) */
.fzbug-pb.ib-pnote { cursor: default; opacity: .9; position: relative; min-height: 50px }
.fzbug-pb.ib-pnote small { display: block; font-weight: 600; font-size: .72rem; color: #9fa6b5; margin-top: 1px }
.fzbug-pb.ib-pnote .ib-pdot { position: absolute; top: 8px; inset-inline-end: 10px; width: 9px; height: 9px; border-radius: 50%; background: #d4141f; box-shadow: 0 0 6px #ff3b47 }

/* ---------- جولة 68: صف هادئ تحت النتيجة (بدل أزرار شاشة اللعب) ---------- */
.fzbug-endrow { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 12px; padding-top: 10px; border-top: 1px dashed #ffffff1a }
.fzbug-eb { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; cursor: pointer; font: inherit; font-size: .84rem; font-weight: 700; color: #a9a7a0; background: none; border: 1px solid #ffffff1f; border-radius: 3px }
.fzbug-eb svg { width: 16px; height: 16px; flex: none; opacity: .8 }
.fzbug-eb:hover, .fzbug-eb:focus-visible { color: #e8e6df; border-color: #ffffff40; outline: none }
.fzbug-pnote { display: flex; align-items: center; gap: 6px; margin: 2px 0 6px; font-size: .78rem; color: #ffd27a } .fzbug-pnote svg { width: 14px; height: 14px; flex: none }
.fzbug-alt { display: inline-flex; align-items: center; gap: 6px; margin: 2px 0 8px; min-height: 36px; padding: 0 10px; cursor: pointer; font: inherit; font-size: .78rem; color: #ffd27a; background: #ffd1660d; border: 1px dashed #ffd16655; border-radius: 3px }
.fzbug-alt svg { width: 14px; height: 14px; flex: none }
@media (max-height:520px) and (orientation:landscape) {
  .fzbug-endrow { margin-top:2px; padding-top:6px; gap:6px }
  .fzbug-eb { min-height:34px; padding:0 10px; font-size:.78rem }
  .le-card .fzbug-endrow { position:absolute; top:6px; inset-inline-start:8px; margin:0; padding:0; border:0; width:auto; z-index:3; animation:none }   /* بنهاية المرحلة بالجوال: بزاوية الكرت — ما ياخذ مكان */
  .le-card .fzbug-eb { min-height:30px; padding:0 8px; font-size:.72rem; background:#0008 }
}