/* عارضُ المجسّم الفرديّ للعقار (١٠ أكتوبر ٢٠٢٦) — ملفٌّ ثابت خارج الحزم (لا يمرّ على rtlcss).
   الاتجاهُ بخاصية dir في العناصر، والخصائصُ منطقية (inline-start/end)، ولا إزاحةَ أفقية للإظهار والإخفاء. */
.sg-p3d { margin: 12px 0; border-radius: 18px; overflow: hidden; background: #F4F1EA; position: relative;
          box-shadow: 0 16px 34px -24px rgba(16, 21, 58, .6); }
.sg-p3d .p3-stage { block-size: 420px; position: relative; }
.sg-p3d .p3-stage canvas { display: block; }
.sg-p3d .p3-fallback { inline-size: 100%; block-size: 100%; display: grid; place-items: center; background: #EAF4FA; }
.sg-p3d .p3-fallback img, .sg-p3d .p3-fallback video { inline-size: 100%; block-size: 100%; object-fit: contain; display: block; }
.sg-p3d .p3-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 12px 0; background: #fff; }
.sg-p3d .p3-chips:empty { display: none; }
.sg-p3d .p3-chip { display: inline-flex; align-items: baseline; gap: 4px; padding: 3px 10px; border-radius: 999px;
                   background: #EAF4FA; color: #10153A; border: 1px solid #B9DDEE; font-size: .78rem; line-height: 1.5; }
.sg-p3d .p3-chip b { font-weight: 700; }
.sg-p3d .p3-chip i { font-style: normal; color: #0B6E93; }
.sg-p3d .p3-chip-ok { background: #EAF7EF; border-color: #A8D9B8; }
.sg-p3d .p3-chip-est { background: #FFF8E8; border: 1px dashed #10153A; }
.sg-p3d .p3-cap { margin: 0; padding: 8px 14px 10px; background: #fff; color: #5B6781; font-size: .82rem; line-height: 1.6; }
.sg-p3d .p3-est { display: inline-block; margin-inline-start: 8px; padding: 0 8px; border: 1px dashed #10153A;
                  border-radius: 6px; color: #10153A; font-weight: 700; font-size: .75rem; }
.sg-p3d .p3-toyed, .sg-p3d .p3-note { display: block; color: #8A5A00; font-size: .76rem; }
.sg-p3d .p3-ui { position: absolute; inset-block-end: 10px; inset-inline-start: 10px; z-index: 4; display: flex; flex-wrap: wrap;
                 gap: 6px; max-inline-size: calc(100% - 20px); pointer-events: auto; }
.sg-p3d .p3-ui-h { background: #FFF8E8; color: #10153A; border: 1px dashed #10153A; border-radius: 10px; padding: 4px 10px; font-size: .74rem; font-weight: 700; }
.sg-p3d .p3-ctl { background: rgba(16, 21, 58, .85); color: #fff; border-radius: 12px; padding: 5px 10px; font-size: .78rem;
                  display: flex; align-items: center; gap: 6px; margin: 0; }
.sg-p3d .p3-ctl b { color: #E4C784; min-inline-size: 1.4em; text-align: center; }
.sg-p3d .p3-ctl input[type=range] { inline-size: 84px; accent-color: #0DA4DB; }
@media (max-width: 600px) {
    .sg-p3d .p3-stage { block-size: 340px; }
    .sg-p3d .p3-ui { inset-block-end: 6px; inset-inline-start: 6px; }
}