/* تطبيق كَيْم للموبايل */
body.oa-on { background: var(--oa-bg) !important; }
body.oa-on .ai-orb, body.oa-on .sk-support, body.oa-on .sk-support-pin, body.oa-on .qaym-settings-trigger { display: none !important; }
body.oa-on .ai-hint { left: 12px; right: 12px; width: auto; bottom: calc(96px + env(safe-area-inset-bottom)); border-radius: 18px; }
:root { --oa-bg: #F3F1EA; --oa-card: #FFFFFF; --oa-ink: #173A28; --oa-muted: #6B7A70; --oa-line: rgba(23, 58, 40, .08); --oa-seal: #1F6B43; --oa-deep: #0F3D27; --oa-gold: #C9A55A; --oa-bad: #B4412F; --oa-warn: #B7791F; }
html.qaym-dark { --oa-bg: #0C1512; --oa-card: #15221D; --oa-ink: #E8F0EA; --oa-muted: #9AAAA0; --oa-line: rgba(232, 240, 234, .08); }

.oa { min-height: 100dvh; color: var(--oa-ink); padding: calc(env(safe-area-inset-top) + 10px) 14px calc(110px + env(safe-area-inset-bottom)); max-width: 620px; margin: 0 auto; box-sizing: border-box; }
.oa-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 2px 14px; }
.oa-brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
.oa-brand > div { display: grid; min-width: 0; }
.oa-brand small { color: var(--oa-muted); font-size: .74rem; }
.oa-brand b { font-size: 1.05rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oa-mark { width: 40px; height: 40px; border-radius: 13px; display: grid; place-items: center; color: #F3DFA8; background: linear-gradient(135deg, var(--oa-seal), var(--oa-deep)); box-shadow: 0 8px 18px -8px rgba(15, 61, 39, .6); flex: none; }
.oa-ask { display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: .76rem; font-weight: 600; padding: 8px 12px; border-radius: 999px; border: 1px solid rgba(201, 165, 90, .4); background: rgba(201, 165, 90, .1); color: #9A7B33; flex: none; }
html.qaym-dark .oa-ask { color: #E2C77E; }

.oa-body { display: grid; gap: 14px; }
.oa-hero { position: relative; overflow: hidden; border-radius: 24px; padding: 18px 18px 0; color: #F6F1E4; background: radial-gradient(120% 140% at 100% 0%, #2F8F5B 0%, var(--oa-seal) 35%, var(--oa-deep) 100%); box-shadow: 0 22px 40px -22px rgba(15, 61, 39, .8); }
.oa-hero-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.oa-hero-top small { font-size: .8rem; color: rgba(246, 241, 228, .8); }
.oa-hero-num { display: block; font-size: clamp(1.9rem, 9vw, 2.5rem); font-weight: 800; letter-spacing: -.01em; margin: 6px 0 2px; direction: rtl; }
.oa-hero-sub { display: block; font-size: .78rem; color: rgba(246, 241, 228, .75); }
.oa-chip { font-size: .7rem; font-weight: 700; padding: 4px 9px; border-radius: 999px; background: rgba(255, 255, 255, .14); white-space: nowrap; }
.oa-chip.up { color: #A8F0C4; } .oa-chip.down { color: #FFC2B5; }
.oa-spark { display: block; width: calc(100% + 36px); height: 64px; margin: 10px -18px 0; }
.oa-spark .a { fill: rgba(243, 223, 168, .14); } .oa-spark .l { fill: none; stroke: #F3DFA8; stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; } .oa-spark .d { fill: #F3DFA8; }

.oa-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.oa-tile { background: var(--oa-card); border: 1px solid var(--oa-line); border-radius: 18px; padding: 12px; display: grid; gap: 3px; min-width: 0; }
.oa-tile small { font-size: .7rem; color: var(--oa-muted); }
.oa-tile b { font-size: .92rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oa-tile.good b { color: var(--oa-seal); } .oa-tile.bad b { color: var(--oa-bad); }
html.qaym-dark .oa-tile.good b { color: #7FD8A3; }

.oa-sec { background: var(--oa-card); border: 1px solid var(--oa-line); border-radius: 22px; padding: 14px; display: grid; gap: 4px; }
.oa-sec h2 { font-size: .86rem; margin: 0 0 6px; color: var(--oa-muted); font-weight: 700; }
.oa-row { display: flex; align-items: center; gap: 12px; padding: 10px 4px; border-radius: 14px; color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; }
.oa-row + .oa-row { border-top: 1px solid var(--oa-line); }
.oa-row:active { background: rgba(31, 107, 67, .06); }
.oa-row-ico { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: rgba(31, 107, 67, .1); color: var(--oa-seal); flex: none; }
.oa-row.warn .oa-row-ico { background: rgba(183, 121, 31, .12); color: var(--oa-warn); }
.oa-row.bad .oa-row-ico { background: rgba(180, 65, 47, .1); color: var(--oa-bad); }
.oa-row-txt { flex: 1; min-width: 0; display: grid; gap: 1px; }
.oa-row-txt b { font-size: .86rem; font-weight: 600; }
.oa-row-txt small { font-size: .72rem; color: var(--oa-muted); }
.oa-row-go { color: var(--oa-muted); opacity: .6; }
.oa-calm { display: flex; align-items: center; gap: 10px; padding: 8px 4px; color: var(--oa-seal); font-size: .84rem; }
.oa-top { margin: 0; padding: 0; list-style: none; counter-reset: t; display: grid; }
.oa-top li { counter-increment: t; display: flex; align-items: center; gap: 10px; padding: 9px 2px; font-size: .84rem; }
.oa-top li + li { border-top: 1px solid var(--oa-line); }
.oa-top li::before { content: counter(t); width: 24px; height: 24px; border-radius: 8px; display: grid; place-items: center; font-size: .72rem; font-weight: 700; background: rgba(201, 165, 90, .16); color: #9A7B33; flex: none; }
.oa-top li span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oa-acts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.oa-act { font: inherit; display: grid; justify-items: center; gap: 6px; padding: 12px 4px; border-radius: 16px; border: 1px solid var(--oa-line); background: transparent; color: inherit; -webkit-tap-highlight-color: transparent; }
.oa-act span { width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; background: rgba(31, 107, 67, .1); color: var(--oa-seal); }
html.qaym-dark .oa-act span, html.qaym-dark .oa-row-ico { color: #7FD8A3; }
.oa-act small { font-size: .74rem; font-weight: 600; }
.oa-act:active { transform: scale(.97); }
.oa-install { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 20px; background: linear-gradient(135deg, rgba(201, 165, 90, .16), rgba(201, 165, 90, .06)); border: 1px solid rgba(201, 165, 90, .3); }
.oa-install > div { flex: 1; display: grid; gap: 2px; } .oa-install small { font-size: .72rem; color: var(--oa-muted); }
.oa-install-ico { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: var(--oa-gold); color: #fff; flex: none; }
.oa-err { display: flex; align-items: center; gap: 8px; padding: 12px; border-radius: 16px; background: rgba(180, 65, 47, .08); color: var(--oa-bad); font-size: .82rem; }
.oa-foot { text-align: center; padding: 14px 0 0; } .oa-updated { color: var(--oa-muted); font-size: .7rem; }
.oa-skel { display: grid; gap: 12px; } .oa-skel i { height: 70px; border-radius: 20px; background: linear-gradient(90deg, var(--oa-line), rgba(31, 107, 67, .06), var(--oa-line)); background-size: 200% 100%; animation: oa-sh 1.2s linear infinite; } .oa-skel i.big { height: 170px; }
@keyframes oa-sh { to { background-position: -200% 0; } }
.oa-ptr { position: fixed; top: 0; left: 50%; transform: translate(-50%, -40px); z-index: 50; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--oa-card); color: var(--oa-seal); box-shadow: 0 6px 16px rgba(0, 0, 0, .12); opacity: 0; transition: opacity .2s; }
.oa-ptr.on { opacity: 1; } .oa-ptr.spin { opacity: 1; transform: translate(-50%, 20px); animation: oa-spin .8s linear infinite; }
@keyframes oa-spin { to { transform: translate(-50%, 20px) rotate(360deg); } }

/* شريط التنقل السفلي مع زر المايك بالنص */
.oa-tabs { position: fixed; z-index: 1100; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); max-width: 600px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr auto 1fr 1fr; align-items: center; gap: 2px; padding: 8px 8px; border-radius: 26px; background: color-mix(in srgb, var(--oa-card) 92%, transparent); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid var(--oa-line); box-shadow: 0 18px 40px -18px rgba(15, 40, 28, .45); }
.oa-tab { font: inherit; display: grid; justify-items: center; gap: 3px; padding: 6px 2px; border: 0; background: transparent; color: var(--oa-muted); border-radius: 16px; -webkit-tap-highlight-color: transparent; }
.oa-tab small { font-size: .68rem; font-weight: 600; }
.oa-tab.on { color: var(--oa-seal); } html.qaym-dark .oa-tab.on { color: #7FD8A3; }
.oa-mic { width: 64px; height: 64px; margin: -30px 6px 0; border-radius: 50%; border: 4px solid var(--oa-bg); display: grid; place-items: center; color: #F3DFA8; background: radial-gradient(120% 120% at 30% 20%, #3A9A66 0%, var(--oa-seal) 45%, var(--oa-deep) 100%); box-shadow: 0 14px 28px -10px rgba(15, 61, 39, .75); -webkit-tap-highlight-color: transparent; }
.oa-mic:active { transform: scale(.95); }

/* قائمة المزيد (من الأسفل) */
.oa-sheet { position: fixed; inset: auto 0 0 0; margin: 0 auto; width: 100%; max-width: 620px; border: 0; border-radius: 26px 26px 0 0; padding: 8px 14px calc(18px + env(safe-area-inset-bottom)); background: var(--oa-card); color: var(--oa-ink); box-sizing: border-box; animation: oa-up .28s cubic-bezier(.2, .8, .2, 1); }
.oa-sheet::backdrop { background: rgba(8, 20, 14, .45); }
@keyframes oa-up { from { transform: translateY(40px); opacity: 0; } }
.oa-sheet-grip { width: 40px; height: 5px; border-radius: 3px; background: var(--oa-line); margin: 4px auto 10px; }
.oa-sheet-head { display: grid; padding: 0 6px 10px; } .oa-sheet-head small { color: var(--oa-muted); font-size: .74rem; }
.oa-sheet-item { font: inherit; width: 100%; display: flex; align-items: center; gap: 14px; padding: 13px 8px; border: 0; background: transparent; color: inherit; border-radius: 14px; text-align: start; font-size: .9rem; }
.oa-sheet-item + .oa-sheet-item { border-top: 1px solid var(--oa-line); }
.oa-sheet-item .qi { color: var(--oa-seal); } .oa-sheet-item.bad, .oa-sheet-item.bad .qi { color: var(--oa-bad); }
.oa-back-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .oa-back-card > div { display: grid; }
@media (min-width: 761px) { .oa { padding-top: 24px; } }
@media (prefers-reduced-motion: reduce) { .oa-skel i, .oa-ptr.spin, .oa-sheet { animation: none; } }
/* تصحيح تداخل أنماط عامة */
.oa a.oa-row, .oa a.oa-row * { text-decoration: none !important; }
.oa-sheet .oa-sheet-item { border: 0 !important; border-radius: 14px !important; box-shadow: none !important; background: transparent !important; min-height: 0; justify-content: flex-start; }
.oa-sheet .oa-sheet-item + .oa-sheet-item { box-shadow: inset 0 1px 0 var(--oa-line) !important; border-radius: 0 !important; }
.oa-sheet .oa-sheet-item:active { background: rgba(31, 107, 67, .06) !important; }
.oa .oa-act, .oa .oa-tab, .oa .oa-mic, .oa .oa-ask { min-height: 0; }
.oa .oa-tab, .oa .oa-act { box-shadow: none; }
.oa-row + .oa-row { border-top: 0 !important; box-shadow: inset 0 1px 0 var(--oa-line); border-radius: 0; }
.oa-top li + li { border-top: 0; box-shadow: inset 0 1px 0 var(--oa-line); }
