/* عن الشركة المطورة (/settings/about) — نسخة من قسم #sys_about-tab بـdashboard.html (Legacy): بطاقة glass-panel وسط اللوحة.
   Legacy مكتوب بفئات Tailwind (p-16 rounded-3xl border-t-4 border-t-indigo-500 max-w-2xl ...) + .glass-panel من styles.css؛
   القيم هنا هي القيم المحسوبة فعليًا بالمتصفح من Legacy نفسه (getComputedStyle بـChromium) للوضعين — بما فيها أن وضع
   الإضاءة بالـLegacy يلغي لون الحد العلوي البنفسجي (قاعدة [data-theme=light] .glass-panel تغيّر border-color). */
.content-area:has(.ab-root) { height: calc(100 * var(--vh)); overflow: hidden; padding: 0; display: flex; flex-direction: column; }
@media (max-width: 480px) { .content-area:has(.ab-root) { padding-top: 60px; } }
.ab-root { flex: 1; min-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; direction: rtl; font-family: 'Cairo', sans-serif; padding: 0 16px; }
.ab-root .ab-card {
    width: 100%; max-width: 672px; padding: 64px; border-radius: 24px; text-align: center;
    background: rgba(var(--th-n-900-rgb), 0.52); border: 1px solid rgba(var(--th-d-0-rgb), 0.25); border-top: 4px solid rgb(var(--th-accent-500-rgb));
    backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
    box-shadow: rgba(255, 255, 255, 0.04) 0 0 0 1px inset, rgba(0, 0, 0, 0.3) 0 10px 30px 0, rgba(255, 255, 255, 0.06) 0 1px 0 0 inset;
    transition: background .4s ease, border-color .4s ease, box-shadow .4s ease;
}
.ab-root .ab-card:hover { background: rgba(255, 255, 255, 0.04); border-color: rgba(255, 255, 255, 0.08); border-top-color: rgb(var(--th-accent-500-rgb)); }
.ab-root .ab-icon { width: 80px; height: 80px; border-radius: 9999px; background: rgba(var(--th-accent-500-rgb), 0.1); display: flex; align-items: center; justify-content: center; margin: 0 auto 24px; }
.ab-root .ab-icon svg { width: 40px; height: 40px; color: rgb(var(--th-accent-400-rgb)); }
.ab-root h3 { font-size: 24px; line-height: 32px; font-weight: 900; color: #fff; margin: 0 0 8px; }
.ab-root .ab-by { font-size: 16px; line-height: 24px; color: rgb(var(--th-n-400-rgb)); margin: 0 0 16px; }
.ab-root .ab-by span { color: rgb(var(--th-accent-400-rgb)); font-weight: 900; }
.ab-root .ab-copy { font-size: 14px; line-height: 20px; color: rgb(var(--th-n-500-rgb)); margin: 0; }
[data-theme="light"] .ab-root .ab-card {
    background: rgba(255, 255, 255, 0.8); border-color: rgba(var(--th-l-1-rgb), 0.4);
    box-shadow: rgba(30, 60, 120, 0.07) 0 4px 24px 0, rgba(255, 255, 255, 0.9) 0 1px 0 0 inset;
}
[data-theme="light"] .ab-root .ab-card:hover { background: rgba(255, 255, 255, 0.62); border-color: rgba(var(--th-n-900-rgb), 0.11); }
[data-theme="light"] .ab-root h3 { color: rgb(var(--th-n-900-rgb)); }
[data-theme="light"] .ab-root .ab-by { color: rgb(var(--th-n-500-rgb)); }
[data-theme="light"] .ab-root .ab-copy { color: rgb(var(--th-n-400-rgb)); }
/* Legacy موبايل (styles.css ≤640): .glass-panel { border-radius:12px; padding:12px } */
@media (max-width: 640px) { .ab-root .ab-card { border-radius: 12px; padding: 12px; } }