/* =====================================================================
   جولة 67: «رسائل المنشأة» — جهاز إنتركم داخل المنشأة.
   نفس الإطار الموحّد (fz-frame) + سمّاعة وضوء حالة، وشاشة قراءة بلمسة فوسفور خفيفة. بدون مبالغة.
   الكمبيوتر: القائمة يمين والرسالة يسار (RTL). الجوال: شاشة وحدة وزر رجوع.
   ===================================================================== */
#btnInbox { position: relative }
#btnInbox svg { width: 19px; height: 19px }
#btnInbox .ib-badge { position: absolute; top: -6px; inset-inline-start: -6px; min-width: 18px; height: 18px; padding: 0 5px; box-sizing: border-box; border-radius: 9px; background: #d4141f;
  color: #fff; font: 800 .68rem/18px var(--font); text-align: center; box-shadow: 0 0 0 2px #07080c, 0 0 10px #ff3b4788; font-style: normal }
#btnInbox .ib-badge[hidden] { display: none }
#btnInbox.has-rw::after { content: ''; position: absolute; bottom: -3px; inset-inline-end: -3px; width: 9px; height: 9px; border-radius: 2px; background: #ffd166; box-shadow: 0 0 0 2px #07080c }

.ib-back { position: fixed; inset: 0; z-index: 206; display: grid; grid-template-columns: minmax(0, 1fr); 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 }
.ib-back.on { opacity: 1 }
.ib-box { --ib-amb: #ffb84d; --ib-ph: #cfe9c8; position: relative; width: min(1040px, 100%); height: min(680px, calc(100dvh - 20px)); display: flex; flex-direction: column; color: var(--text);
  font-family: var(--font); padding: 20px 14px 12px; border-radius: 4px; transform: translateY(8px) scale(.985); transition: transform .2s cubic-bezier(.2, .9, .3, 1.15) }
.ib-back.on .ib-box { transform: none }
/* الرأس: سمّاعة + ضوء + العنوان */
.ib-h { display: flex; align-items: center; gap: 12px; padding: 0 2px 10px; border-bottom: 1px dashed #ffffff1c; flex: none }
.ib-grille { display: grid; grid-template-columns: repeat(3, 6px); gap: 4px; padding: 6px; background: #07080b; border: 1px solid #ffffff1a; border-radius: 3px; box-shadow: inset 0 0 8px #000 }
.ib-grille i { width: 6px; height: 6px; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #3a3f4c, #0b0c10) }
.ib-led { width: 9px; height: 9px; border-radius: 50%; background: #3fd39a; box-shadow: 0 0 8px #3fd39a; animation: ibLed 2.4s steps(2) infinite; flex: none }
@keyframes ibLed { 50% { opacity: .35 } }
.ib-ht h3 { margin: 0; font-size: 1.15rem; font-weight: 900; letter-spacing: .2px } .ib-ht small { display: block; color: #8b8a85; font-size: .74rem; margin-top: 1px }
.ib-x { width: 36px; height: 36px; display: grid; place-items: center; 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); flex: none }
.ib-x:hover { background: linear-gradient(180deg, #b7101a, #5a070c) } .ib-x svg { width: 16px; height: 16px }
/* التبويبات والأدوات */
.ib-tabs { display: flex; gap: 6px; padding: 10px 0 6px; flex: none; overflow-x: auto; scrollbar-width: none }
.ib-tabs button { position: relative; min-height: 38px; padding: 0 14px; cursor: pointer; font: inherit; font-weight: 800; font-size: .88rem; color: #b9b7af; background: #0f1117; border: 1px solid #ffffff1a; border-radius: 3px; white-space: nowrap }
.ib-tabs button.on { color: #fff; border-color: var(--ib-amb); box-shadow: inset 0 -2px 0 var(--ib-amb); background: #17140d }
.ib-tn { display: inline-block; margin-inline-start: 6px; min-width: 17px; padding: 0 4px; border-radius: 9px; background: #d4141f; color: #fff; font: 800 .66rem/17px var(--font); font-style: normal }
.ib-tn[hidden], .ib-tn:empty { display: none }
.ib-tools { display: flex; gap: 8px; justify-content: flex-end; padding-bottom: 8px; flex: none }
.ib-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; padding: 0 14px; cursor: pointer; font: inherit; font-weight: 800; font-size: .88rem; border-radius: 3px;
  color: #e8e6df; background: linear-gradient(180deg, #262a35, #12141a); border: 1px solid #ffffff26 }
.ib-btn svg { width: 16px; height: 16px } .ib-btn.sm { min-height: 36px; font-size: .8rem; padding: 0 11px }
.ib-btn.go { color: #1a1206; background: linear-gradient(180deg, #ffd27a, #e09a1e); border-color: #ffd27a } .ib-btn.go:hover:not(:disabled) { filter: brightness(1.08) }
.ib-btn.ghost { background: none } .ib-btn.big { min-height: 46px; min-width: 150px; font-size: 1rem } .ib-btn:disabled { opacity: .45; cursor: default }
.ib-btn[hidden] { display: none }
/* القائمة يمين والقراءة يسار */
.ib-main { display: grid; grid-template-columns: minmax(270px, 36%) 1fr; gap: 12px; flex: 1 1 auto; min-height: 0 }
.ib-list { overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 6px; padding: 2px; min-height: 0 }
.ib-it { position: relative; display: grid; grid-template-columns: 10px 30px 1fr auto; align-items: center; gap: 8px; width: 100%; padding: 10px 10px 10px 8px; text-align: start; cursor: pointer; font: inherit; color: var(--text);
  background: linear-gradient(180deg, #161922, #10121a); border: 1px solid #ffffff14; border-radius: 3px; transition: border-color .12s, background .12s }
.ib-it:hover { border-color: #ffffff38 } .ib-it.sel { border-color: var(--ib-amb); background: linear-gradient(180deg, #1d1a12, #13110c) }
.ib-it.pinned { border-inline-start: 3px solid var(--ib-amb) }
.ib-dot { width: 8px; height: 8px; border-radius: 50%; background: transparent } .ib-it.new .ib-dot { background: #3fd39a; box-shadow: 0 0 6px #3fd39a }
.ib-tic { width: 30px; height: 30px; display: grid; place-items: center; color: var(--ib-amb); background: #0a0b10; border: 1px solid #ffffff1a; border-radius: 3px }
.ib-tic svg { width: 16px; height: 16px }
.ib-tx { min-width: 0 } .ib-tx b { display: block; font-size: .92rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis } .ib-it:not(.new) .ib-tx b { font-weight: 600; color: #cfcdc6 }
.ib-tx small { display: block; color: #8b8a85; font-size: .76rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px }
.ib-meta { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; font-style: normal; font-size: .7rem }
.ib-ty { color: #8b8a85 } .ib-left { color: #9fa6b5 } .ib-left.soon { color: #ffb84d; font-weight: 800 } .ib-left.pin, .ib-pin { color: var(--ib-amb); display: inline-flex; align-items: center; gap: 3px }
.ib-pin svg, .ib-left svg { width: 11px; height: 11px }
.ib-urg { color: #ff6b6b; font-weight: 900; border: 1px solid #ff3b4766; padding: 0 5px; border-radius: 2px }
.ib-rwic { width: 30px; height: 30px; display: grid; place-items: center; color: #ffd166; border: 1px dashed #ffd16688; border-radius: 3px }
.ib-rwic svg { width: 17px; height: 17px } .ib-rwic.done { color: #3fd39a; border-color: #3fd39a66; border-style: solid } .ib-rwic.warn { color: #ff8a3d; border-color: #ff8a3d; animation: ibPulse 1.4s ease-in-out infinite }
@keyframes ibPulse { 50% { box-shadow: 0 0 0 4px #ff8a3d22 } }
/* شاشة القراءة */
.ib-read { position: relative; overflow-y: auto; overscroll-behavior: contain; min-height: 0; padding: 16px 18px; border-radius: 3px; border: 1px solid #ffffff14;
  background: repeating-linear-gradient(0deg, #ffffff04 0 1px, transparent 1px 3px), radial-gradient(ellipse at 50% 0%, #121a14, #090b0a 70%) }
.ib-back-btn { display: none; align-items: center; gap: 6px; min-height: 40px; padding: 0 12px 0 6px; margin: -4px 0 8px; cursor: pointer; font: inherit; font-weight: 800; color: #e8e6df; background: none; border: 1px solid #ffffff26; border-radius: 3px }
.ib-back-btn svg { width: 16px; height: 16px }
.ib-msg { position: relative }
.ib-mh { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; font-size: .78rem; color: #8b8a85 }
.ib-mh .ib-ty { display: inline-flex; align-items: center; gap: 5px; color: var(--ib-amb); font-weight: 800 } .ib-mh .ib-ty svg { width: 14px; height: 14px }
.ib-msg h2 { margin: 8px 0 10px; font-size: 1.3rem; font-weight: 900; color: #f3efe2; line-height: 1.45; padding-inline-end: 70px }
.ib-body { color: var(--ib-ph); line-height: 1.85; font-size: .97rem } .ib-body p { margin: 0 } .ib-body .ib-sp { height: .7em }
.ib-body ul { margin: 4px 0; padding-inline-start: 22px } .ib-body li { margin: 2px 0 } .ib-body li::marker { color: var(--ib-amb) }
.ib-body b { color: #fff } .ib-lk { color: #ffd27a; text-decoration: underline; text-underline-offset: 3px } .ib-lk.ext::after { content: ' ↗'; font-size: .8em }
.ib-fig { margin: 10px 0 } .ib-fig img { display: block; max-width: 100%; max-height: 300px; border: 1px solid #ffffff1f; border-radius: 3px; background: #000 } .ib-fig.hero img { width: 100%; object-fit: cover }
/* ختم «عاجل» */
.ib-stamp { position: absolute; top: 2px; inset-inline-end: 0; padding: 3px 10px; color: #ff3b47; border: 2px solid #ff3b47; border-radius: 3px; font-weight: 900; font-size: .95rem; letter-spacing: 1px;
  transform: rotate(-8deg); opacity: .9; box-shadow: inset 0 0 0 2px #ff3b4722; background: #ff3b470d; text-shadow: 0 0 6px #ff3b4755 }
.ib-rf { display: flex; justify-content: flex-end; margin-top: 14px }
/* صندوق الإمدادات */
.ib-rw { display: flex; gap: 16px; align-items: center; margin-top: 16px; padding: 14px; border: 1px solid #ffd16655; border-radius: 3px; background: linear-gradient(135deg, #1d170b, #0e0c08) }
.ib-rw.warn { border-color: #ff8a3d } .ib-rw.claimed { border-color: #3fd39a55; background: linear-gradient(135deg, #0f1a14, #0a0e0c) }
.ib-rwt { flex: 1; min-width: 0 } .ib-rwt b { color: #ffd27a } .ib-rw.claimed .ib-rwt b { color: #9be15d }
.ib-items { list-style: none; margin: 8px 0 10px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px }
.ib-items li { display: inline-flex; align-items: center; gap: 7px; padding: 4px 10px 4px 6px; background: #0a0b10; border: 1px solid #ffffff1f; border-radius: 3px; font-size: .86rem; font-weight: 700 }
.ib-art { width: 26px; height: 26px; display: grid; place-items: center; overflow: hidden } .ib-art img, .ib-art svg { max-width: 26px; max-height: 26px; width: 22px; height: 22px; object-fit: contain }
.ib-art .tt-host { transform: scale(.6) }
.ib-warn { margin: 0 0 8px; color: #ff9c5a; font-weight: 800; font-size: .84rem } .ib-claimmsg { margin: 6px 0 0; font-size: .84rem; color: #9be15d; min-height: 1em }
.ib-crate { position: relative; width: 74px; height: 64px; flex: none; perspective: 200px }
.ib-crate .box { position: absolute; left: 4px; right: 4px; bottom: 0; height: 42px; background: repeating-linear-gradient(90deg, #6a4a24 0 10px, #5c3f1e 10px 12px); border: 2px solid #2a1a0a; border-radius: 2px; box-shadow: inset 0 0 0 3px #00000033 }
.ib-crate .lid { position: absolute; left: 0; right: 0; top: 10px; height: 14px; background: linear-gradient(180deg, #8a6230, #5c3f1e); border: 2px solid #2a1a0a; border-radius: 2px; transform-origin: 85% 100%; transition: transform .45s cubic-bezier(.3, 1.6, .5, 1); z-index: 2 }
.ib-crate .strap { position: absolute; bottom: 0; width: 7px; height: 56px; background: #2f3542; border-inline: 1px solid #000; z-index: 3 } .ib-crate .strap.a { left: 18px } .ib-crate .strap.b { right: 18px }
.ib-crate .glow { position: absolute; left: 10px; right: 10px; top: 18px; height: 14px; border-radius: 50%; background: radial-gradient(#ffe39a, transparent 70%); opacity: 0; transition: opacity .35s .15s; z-index: 1 }
.ib-crate.open .lid { transform: rotate(-24deg) translate(-4px, -10px) } .ib-crate.open .strap { opacity: .25; transition: opacity .2s } .ib-crate.open .glow { opacity: 1 }
/* فاضي */
.ib-empty { margin: auto; padding: 30px 10px; text-align: center; color: #8b8a85; display: flex; flex-direction: column; align-items: center; gap: 6px }
.ib-empty b { color: #cfcdc6 } .ib-empty.sm { padding: 12px; margin: 0 }
.ib-static { width: 64px; height: 40px; border-radius: 3px; border: 1px solid #ffffff1f; background: repeating-linear-gradient(0deg, #ffffff10 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg, #ffffff08 0 2px, transparent 2px 5px); animation: ibStatic .25s steps(3) infinite }
@keyframes ibStatic { 50% { background-position: 0 1px, 2px 0 } }
/* سجل بلاغاتي */
.ib-mine { margin-top: 6px; padding: 10px; border: 1px dashed #ffffff22; border-radius: 3px } .ib-mine h4 { margin: 0 0 8px; font-size: .9rem; color: var(--ib-amb) }
.ib-mine ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px }
.ib-mine li { display: grid; gap: 2px; padding: 8px 10px; background: #0d0f14; border-inline-start: 3px solid #5a6170; border-radius: 2px; font-size: .82rem }
.ib-mine li span { color: #9fa6b5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .ib-mine li em { font-style: normal; color: #cfcdc6; font-size: .76rem }
.ib-mine li.st-fixed, .ib-mine li.st-action { border-color: #3fd39a } .ib-mine li.st-checking { border-color: #ffb84d } .ib-mine li.st-new { border-color: #5aa9ff }
/* المنبثقة */
.ib-popbox { width: min(560px, 100%); height: auto; max-height: calc(100dvh - 20px) } .ib-popbox .ib-read { flex: 1 1 auto; max-height: 62dvh }
.ib-popf { display: flex; gap: 10px; justify-content: flex-end; padding-top: 10px; flex: none } .ib-popf .ib-btn { min-width: 110px }
.ib-pop .ib-back-btn { display: none !important }
/* المعاينة في المحرك */
.ib-prev { position: absolute; inset: 0 } .ib-prev .ib-box { height: 100% }
/* جوال: شاشة وحدة */
@media (max-width: 759px) {
  .ib-box { height: calc(100dvh - 20px); padding: 18px 10px 10px }
  .ib-main { grid-template-columns: minmax(0, 1fr) }
  .ib-box .ib-read { display: none } .ib-box.reading .ib-read { display: block } .ib-box.reading .ib-list, .ib-box.reading .ib-tools { display: none }
  .ib-back-btn { display: inline-flex } .ib-read { padding: 12px }
  .ib-msg h2 { font-size: 1.12rem } .ib-tools { justify-content: flex-start; flex-wrap: wrap }
  .ib-rw { flex-direction: column; align-items: stretch; text-align: start } .ib-crate { align-self: center }
  .ib-popbox .ib-read { display: block }
}
@media (max-height: 520px) and (orientation: landscape) {
  .ib-box { height: calc(100dvh - 12px); padding-top: 16px }
  .ib-h { padding-bottom: 6px } .ib-grille { display: none } .ib-ht small { display: none }
  .ib-tabs { padding: 6px 0 4px } .ib-tabs button { min-height: 36px }
  .ib-tools { padding-bottom: 4px } .ib-msg h2 { font-size: 1.05rem; margin: 4px 0 6px }
}
@media (max-height: 520px) and (orientation: landscape) and (min-width: 760px) { .ib-main { grid-template-columns: minmax(240px, 40%) 1fr } }
@media (prefers-reduced-motion: reduce) {
  .ib-back, .ib-box, .ib-crate .lid, .ib-crate .glow { transition: none } .ib-led, .ib-static, .ib-rwic.warn { animation: none }
  .ib-crate.open .lid { transform: none; opacity: .35 }
}
