/* ═══════════════════════════════════════════════════
   OCTA — التنسيق الكامل (مستخرج من index.html)
   الحجم: 244KB
   ═══════════════════════════════════════════════════ */

/* ═══ CSS block 0 ═══ */
    :root {
      --pri: #0a1929; --pri2: #0d2137; --pri3: #102a43;
      --sec: #16c79a; --sec2: #4dabf7;
      --gold: #d4af37; --gold2: #f4d03f; --gold3: #b8860b;
      --red: #ff5252; --red2: #ff8a80;
      --muted: #8b9eb0; --white: #ffffff; --txt: #e3eaf2;
      --line: rgba(255,255,255,0.08);
    }
    * { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
    /* 🛡️ خلفية الـhtml — لو الـbody اتعطل، الألوان ماتبقاش بيضاء */
    html { background: var(--pri); }
    body.light { background: #f4f6f9; }
    html.light { background: #f4f6f9; }
    body {
      background: radial-gradient(ellipse at top, var(--pri2) 0%, var(--pri) 70%);
      color: var(--txt);
      font-family: 'Cairo', 'Tajawal', system-ui, -apple-system, sans-serif;
      line-height: 1.6; overflow-x: hidden;
      min-height: 100vh;
    }
    button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
    input, select { font-family: inherit; }
    img { max-width: 100%; display: block; }
    a { color: inherit; text-decoration: none; }

    /* ============ HEADER ============ */
    .top-bar {
      position: sticky; top: 0; z-index: 100;
      background: rgba(10,25,41,0.95); backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border-bottom: 1px solid var(--line);
      padding: 12px 16px;
    }
    .top-bar-inner {
      max-width: 1200px; margin: 0 auto;
      display: flex; align-items: center; justify-content: space-between; gap: 12px;
    }
    .logo { display: flex; align-items: center; gap: 10px; font-weight: 900; font-size: 1.4rem; }
    .logo img { width: 38px; height: 38px; border-radius: 50%; }
    .logo-text {
      background: linear-gradient(135deg, #d4af37, #f4d03f, #d4af37);
      -webkit-background-clip: text; background-clip: text; color: transparent;
      letter-spacing: 1px;
    }

    /* ============ NAV ============ */
    .nav {
      background: rgba(10,25,41,0.92);
      backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
      border-bottom: 1px solid var(--line);
      padding: 8px 12px; overflow-x: auto;
      -webkit-overflow-scrolling: touch;
      position: sticky; top: 62px; z-index: 99;
    }
    .nav::-webkit-scrollbar { display: none; }
    .nav-inner { max-width: 1200px; margin: 0 auto; display: flex; gap: 8px; }
    .nav-btn {
      flex-shrink: 0; padding: 10px 16px; border-radius: 100px;
      background: rgba(255,255,255,0.04);
      border: 1px solid var(--line);
      color: var(--muted); font-size: 0.82rem; font-weight: 700;
      transition: all 0.2s; white-space: nowrap;
    }
    .nav-btn.active {
      background: linear-gradient(135deg, rgba(212,175,55,0.2), rgba(244,208,63,0.1));
      border-color: var(--gold); color: var(--gold);
      box-shadow: 0 0 12px rgba(212,175,55,0.2);
    }
    .nav-btn:hover { color: var(--white); }

    /* ============ PAGES ============ */
    .page { display: none; padding: 20px 16px 80px; max-width: 1200px; margin: 0 auto; }
    .page.active { display: block; }
    .page-title {
      font-size: 1.6rem; font-weight: 900; margin-bottom: 8px;
      background: linear-gradient(135deg, #d4af37, #f4d03f);
      -webkit-background-clip: text; background-clip: text; color: transparent;
    }
    .page-subtitle { color: var(--muted); font-size: 0.92rem; margin-bottom: 24px; }

    /* ════════ TICKER BAR (مع زر إيقاف) ════════ */
    .ticker-bar { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; }
    .ticker-bar .ticker-tape { flex: 1; margin-bottom: 0; }
    .ticker-ctl {
      flex-shrink: 0; width: 38px; height: 38px; border-radius: 11px;
      background: rgba(255,255,255,0.06); border: 1px solid var(--line);
      color: var(--gold); font-size: 1rem; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      transition: all 0.2s; font-family: inherit;
    }
    .ticker-ctl:hover { background: rgba(212,175,55,0.15); }
    .ticker-ctl.paused { color: var(--red2); background: rgba(255,82,82,0.12); border-color: rgba(255,82,82,0.3); }
    .ticker-tape.paused .ticker-item { opacity: 0.45; }
    /* ============ TICKER TAPE (شريط متحرك) ============ */
    .ticker-wrap {
      background: linear-gradient(90deg, #1a1a1a 0%, #2a2a2a 100%);
      border: 1px solid var(--line);
      border-radius: 12px;
      padding: 14px 0;
      overflow: hidden;
      margin-bottom: 16px;
      position: relative;
      box-shadow: 0 4px 20px rgba(0,0,0,0.4);
    }
    .ticker-wrap::before, .ticker-wrap::after {
      content: '';
      position: absolute;
      top: 0; bottom: 0; width: 60px;
      z-index: 2; pointer-events: none;
    }
    .ticker-wrap::before { left: 0; background: linear-gradient(90deg, #1a1a1a 70%, transparent); }
    .ticker-wrap::after { right: 0; background: linear-gradient(-90deg, #1a1a1a 70%, transparent); }
    .ticker-tape {
      display: flex;
      gap: 32px;
      white-space: nowrap;
      animation: tickerScroll 14s linear infinite;
    }
    .ticker-asset {
      font-size: 0.7rem;
      color: var(--muted);
      margin: 0 4px;
      font-weight: 600;
    }
    .ticker-item strong {
      color: var(--gold);
      margin: 0 4px;
      font-size: 0.95rem;
    }
    @keyframes tickerScroll {
      0% { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }
    .ticker-item {
      font-size: 0.88rem;
      color: var(--txt);
      font-weight: 700;
      flex-shrink: 0;
    }
    .ticker-item strong {
      color: var(--gold);
      margin: 0 4px;
    }
    .ticker-change {
      padding: 2px 8px;
      border-radius: 100px;
      font-size: 0.75rem;
      background: rgba(22,199,154,0.15);
      color: var(--sec);
      margin-right: 4px;
    }
    .ticker-change.negative {
      background: rgba(255,82,82,0.15);
      color: var(--red2);
    }
    .ticker-sep {
      color: var(--gold);
      font-size: 0.6rem;
    }
    .ticker-tv-widget {
      display: none; /* نخفي الـ widget، بس نقرأ منه السعر */
    }

    /* ============ HOME FEATURES (A → I) ============ */
    .home-feature {
      background: linear-gradient(135deg, var(--pri3), var(--pri2));
      border: 1px solid var(--line);
      border-radius: 16px;
      padding: 16px;
      margin-bottom: 14px;
    }
    .hf-header {
      display: flex; align-items: center; gap: 12px;
      margin-bottom: 8px;
    }
    .hf-icon {
      width: 36px; height: 36px; border-radius: 10px;
      background: linear-gradient(135deg, var(--gold), var(--gold2));
      color: var(--pri); font-weight: 900; font-size: 1rem;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
      box-shadow: 0 2px 8px rgba(212,175,55,0.3);
    }
    .hf-title {
      color: var(--white); font-weight: 800; font-size: 1rem;
    }
    .hf-sub {
      color: var(--muted); font-size: 0.8rem; margin-top: 2px;
    }
    .hf-content { padding: 0 4px; }
    .hf-add-btn {
      width: 100%; padding: 10px;
      background: rgba(212,175,55,0.1);
      border: 1px dashed var(--gold); border-radius: 8px;
      color: var(--gold); font-size: 0.85rem; font-weight: 700;
      cursor: pointer; transition: all 0.2s;
    }
    .hf-add-btn:hover { background: rgba(212,175,55,0.2); }

    /* Top Movers Tabs */
    .top-movers-tabs {
      display: flex; gap: 6px; margin-bottom: 8px;
    }
    .tm-tab {
      flex: 1; padding: 8px;
      background: var(--pri2); border: 1px solid var(--line);
      border-radius: 8px; color: var(--muted);
      font-size: 0.85rem; font-weight: 700; cursor: pointer;
    }
    .tm-tab.active {
      background: linear-gradient(135deg, rgba(22,199,154,0.2), rgba(77,171,247,0.1));
      border-color: var(--sec); color: var(--sec);
    }
    .top-mover-row {
      display: flex; align-items: center; gap: 10px;
      padding: 8px 0; border-bottom: 1px solid var(--line);
    }
    .top-mover-row:last-child { border-bottom: none; }
    .tm-rank {
      width: 24px; height: 24px; border-radius: 50%;
      background: var(--pri2); color: var(--gold);
      font-size: 0.78rem; font-weight: 800;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .tm-info { flex: 1; }
    .tm-code { font-weight: 800; color: var(--white); font-size: 0.92rem; }
    .tm-name { font-size: 0.72rem; color: var(--muted); }
    .tm-change { font-weight: 800; font-size: 0.85rem; color: var(--sec); }

    /* Sector Heatmap (زي رادار) */
    .heatmap-treemap {
      display: grid; gap: 3px; margin-top: 8px;
      grid-template-columns: repeat(8, 1fr);
      grid-auto-rows: 60px;
    }
    .heatmap-cell {
      padding: 8px; border-radius: 6px;
      display: flex; flex-direction: column;
      align-items: center; justify-content: center;
      text-align: center; color: #fff;
      cursor: pointer; transition: transform 0.2s;
      position: relative; overflow: hidden;
      min-height: 50px;
    }
    .heatmap-cell:hover { transform: scale(1.05); z-index: 2; }
    .hm-code { font-weight: 900; font-size: 0.8rem; }
    .hm-change { font-size: 0.7rem; font-weight: 800; }
    .hm-large { grid-column: span 4; grid-row: span 3; }
    .hm-medium { grid-column: span 2; grid-row: span 2; }
    .hm-small { grid-column: span 1; grid-row: span 1; }
    /* legacy */
    .heatmap-grid {
      display: grid; grid-template-columns: repeat(2, 1fr);
      gap: 8px; margin-top: 8px;
    }
    .hm-sector { font-size: 0.7rem; opacity: 0.9; }

    /* Fundamentals Table */
    .home-fundamentals-table {
      width: 100%; border-collapse: collapse; font-size: 0.78rem;
      margin-top: 8px;
    }
    .home-fundamentals-table th, .home-fundamentals-table td {
      padding: 8px 4px; text-align: center;
      border-bottom: 1px solid var(--line);
    }
    .home-fundamentals-table th { color: var(--gold); font-weight: 800; }
    .home-fundamentals-table td { color: var(--txt); }
    .home-fundamentals-table tr:last-child td { border-bottom: none; }

    /* Dividend Calendar */
    .dividend-list { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
    .dividend-item {
      display: grid; grid-template-columns: 2fr 1fr 1.5fr;
      gap: 8px; align-items: center;
      padding: 10px 12px;
      background: var(--pri2); border: 1px solid var(--line);
      border-radius: 8px; font-size: 0.8rem;
    }
    .di-left strong { color: var(--gold); font-size: 0.95rem; }
    .di-left small { color: var(--muted); display: block; font-size: 0.7rem; }
    .di-amount { color: var(--sec); font-weight: 800; }
    .di-yield { color: var(--gold2); font-size: 0.7rem; }
    .di-date { color: var(--muted); font-size: 0.7rem; }

    /* ============ HERO ============ */
    .hero { text-align: center; padding: 24px 16px 32px; position: relative; }
    .hero-logo {
      width: 140px; height: 140px; margin: 0 auto 20px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(212,175,55,0.2) 0%, transparent 70%);
      display: flex; align-items: center; justify-content: center;
      box-shadow: 0 0 60px rgba(212,175,55,0.3);
    }
    .hero-logo img { width: 100%; height: 100%; object-fit: contain; }
    .hero h1 {
      font-size: 2.6rem; font-weight: 900;
      background: linear-gradient(135deg, #d4af37, #f4d03f, #d4af37);
      -webkit-background-clip: text; background-clip: text; color: transparent;
      letter-spacing: 2px; margin-bottom: 6px;
    }
    .hero-tagline { color: var(--muted); font-size: 1rem; margin-bottom: 24px; }
    .pillars {
      display: flex; align-items: center; justify-content: center;
      gap: 14px; flex-wrap: wrap; margin-bottom: 28px;
    }
    .pillar { font-size: 1.1rem; font-weight: 800; color: var(--gold); }
    .pillar.big { font-size: 1.5rem; }
    .pillar.small { font-size: 0.9rem; color: var(--muted); }
    .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gold); display: inline-block; }
    .dot.big { width: 12px; height: 12px; background: var(--sec); }
    .dot.small { width: 5px; height: 5px; }
    .hero-cta {
      display: inline-block;
      background: linear-gradient(135deg, #d4af37, #f4d03f);
      color: var(--pri); padding: 14px 32px; border-radius: 100px;
      font-weight: 900; font-size: 1rem; letter-spacing: 0.5px;
      box-shadow: 0 8px 24px rgba(212,175,55,0.3);
      transition: transform 0.2s; cursor: pointer;
    }
    .hero-cta:hover { transform: translateY(-2px); }

    /* ============ SECTIONS ============ */
    .section {
      background: linear-gradient(135deg, rgba(22,199,154,0.08) 0%, rgba(77,171,247,0.05) 100%);
      border: 1px solid var(--line); border-radius: 20px;
      padding: 24px 20px; margin-bottom: 16px;
      box-shadow: 0 4px 20px rgba(0,0,0,0.3);
    }
    .section-title {
      font-size: 1.2rem; font-weight: 900; color: var(--gold);
      margin-bottom: 16px; display: flex; align-items: center; gap: 8px;
    }

    /* ============ QUICK GRID ============ */
    .quick-grid {
      display: grid; grid-template-columns: repeat(4, 1fr);
      gap: 12px; margin-bottom: 24px;
    }
    @media (max-width: 600px) { .quick-grid { grid-template-columns: repeat(2, 1fr); } }
    .quick-card {
      background: linear-gradient(135deg, rgba(22,199,154,0.08), rgba(77,171,247,0.05));
      border: 1px solid var(--line); border-radius: 16px;
      padding: 18px 12px; text-align: center; cursor: pointer;
      transition: all 0.3s;
    }
    .quick-card:hover {
      transform: translateY(-3px); border-color: var(--gold);
      box-shadow: 0 8px 20px rgba(212,175,55,0.15);
    }
    .quick-icon { font-size: 2rem; margin-bottom: 8px; }
    .quick-name { font-size: 0.82rem; font-weight: 800; color: var(--txt); }
    .quick-desc { font-size: 0.7rem; color: var(--muted); margin-top: 2px; }

    /* ============ STOCK CARDS ============ */
    .stock-row {
      display: grid; grid-template-columns: 40px 1fr auto auto;
      gap: 10px; align-items: center;
      padding: 12px; margin-bottom: 8px;
      background: rgba(255,255,255,0.03);
      border: 1px solid var(--line); border-radius: 12px;
      transition: all 0.2s;
    }
    .stock-row:hover { background: rgba(212,175,55,0.05); border-color: rgba(212,175,55,0.3); }
    .stock-icon {
      width: 40px; height: 40px; border-radius: 10px;
      background: linear-gradient(135deg, #4dabf7, #16c79a);
      display: flex; align-items: center; justify-content: center;
      font-weight: 900; font-size: 0.75rem; color: var(--pri);
    }
    .stock-code { font-weight: 800; font-size: 0.95rem; color: var(--white); }
    .stock-name { font-size: 0.78rem; color: var(--muted); }
    .stock-price { font-weight: 800; font-size: 0.95rem; }
    .stock-change {
      font-weight: 800; font-size: 0.85rem;
      padding: 4px 10px; border-radius: 100px; min-width: 64px; text-align: center;
    }
    .stock-change.up { background: rgba(22,199,154,0.15); color: var(--sec); }
    .stock-change.down { background: rgba(255,82,82,0.15); color: var(--red2); }

    /* ════════ TOP MOVERS v3 — قابل للطي + فلاتر ════════ */
    .tm-toggle {
      display: flex; align-items: center; justify-content: space-between;
      width: 100%; background: none; border: none; cursor: pointer;
      padding: 0; text-align: right; font-family: inherit; color: inherit;
    }
    .tm-toggle .hf-title, .tm-toggle .hf-sub { pointer-events: none; }
    .tm-chevron {
      font-size: 1.3rem; color: var(--gold); font-weight: 900;
      transition: transform 0.3s cubic-bezier(.4,0,.2,1);
      flex-shrink: 0; width: 30px; height: 30px;
      display: flex; align-items: center; justify-content: center;
      border-radius: 9px; background: rgba(212,175,55,0.12);
      border: 1px solid rgba(212,175,55,0.3);
    }
    .tm-toggle[aria-expanded="false"] .tm-chevron { transform: rotate(-90deg); }

    .tm-toolbar {
      display: flex; align-items: center; justify-content: space-between;
      gap: 10px; margin-bottom: 12px; flex-wrap: wrap;
    }
    .tm-periods { display: flex; gap: 5px; overflow-x: auto; padding-bottom: 4px; }
    .tm-periods::-webkit-scrollbar { display: none; }
    .tm-period {
      flex-shrink: 0; padding: 7px 15px; border-radius: 100px;
      background: rgba(255,255,255,0.05); border: 1px solid var(--line);
      color: var(--muted); font-size: 0.78rem; font-weight: 700;
      cursor: pointer; transition: all 0.18s; font-family: inherit; white-space: nowrap;
    }
    .tm-period:hover { color: var(--white); border-color: rgba(212,175,55,0.4); }
    .tm-period.active {
      background: linear-gradient(135deg, rgba(212,175,55,0.28), rgba(212,175,55,0.12));
      border-color: var(--gold); color: var(--gold);
      box-shadow: 0 0 10px rgba(212,175,55,0.18);
    }
    .tm-meta { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
    .tm-phase { font-size: 1rem; line-height: 1; }
    .tm-time {
      font-size: 0.72rem; color: var(--muted); font-weight: 700;
      background: rgba(255,255,255,0.05); padding: 4px 9px; border-radius: 100px;
      border: 1px solid var(--line); white-space: nowrap;
    }

    .tm-split {
      display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
      overflow: hidden; transition: max-height 0.35s ease, opacity 0.25s ease;
      max-height: 1200px; opacity: 1;
    }
    .tm-split.collapsed { max-height: 0; opacity: 0; margin: 0; }

    .tm-half {
      background: rgba(255,255,255,0.03); border: 1px solid var(--line);
      border-radius: 12px; padding: 10px; min-width: 0;
    }
    .tm-half-head {
      font-size: 0.82rem; font-weight: 800; padding: 0 0 9px;
      border-bottom: 1px solid var(--line); margin-bottom: 7px;
      display: flex; align-items: center; gap: 6px;
    }
    .tm-gainers .tm-half-head { color: var(--sec); }
    .tm-losers .tm-half-head { color: var(--red2); }
    .tm-list { display: flex; flex-direction: column; gap: 1px; }
    .tm-item {
      display: flex; align-items: center; gap: 7px; padding: 8px 6px;
      border-radius: 9px; cursor: pointer; transition: background 0.15s;
    }
    .tm-item:hover { background: rgba(255,255,255,0.07); }
    .tm-item:hover .tm-code { color: var(--gold); }
    .tm-rank {
      width: 21px; height: 21px; border-radius: 7px; flex-shrink: 0;
      display: flex; align-items: center; justify-content: center;
      font-size: 0.68rem; font-weight: 900;
    }
    .tm-gainers .tm-rank { background: rgba(22,199,154,0.22); color: var(--sec); }
    .tm-losers .tm-rank { background: rgba(255,82,82,0.22); color: var(--red2); }
    .tm-info { flex: 1; min-width: 0; }
    .tm-code { font-size: 0.84rem; font-weight: 800; color: var(--white); transition: color 0.15s; }
    .tm-name {
      font-size: 0.7rem; color: var(--muted); margin-top: 1px;
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .tm-num { display: flex; flex-direction: column; align-items: flex-end; flex-shrink: 0; }
    .tm-price { font-size: 0.7rem; color: var(--muted); font-weight: 600; }
    .tm-pct { font-size: 0.82rem; font-weight: 800; }
    .tm-gainers .tm-pct { color: var(--sec); }
    .tm-losers .tm-pct { color: var(--red2); }
    .tm-empty {
      text-align: center; color: var(--muted); padding: 26px 12px; font-size: 0.82rem;
    }
    @media (max-width: 700px) {
      .tm-split { grid-template-columns: 1fr; }
      .tm-toolbar { flex-direction: column; align-items: stretch; }
      .tm-meta { justify-content: center; }
    }

    /* ════════ TRADINGVIEW CHART MODAL ════════ */
    .tv-modal-overlay {
      position: fixed; inset: 0; z-index: 9999;
      background: rgba(0,0,0,0.8); backdrop-filter: blur(6px);
      display: flex; align-items: center; justify-content: center; padding: 16px;
      animation: tvFade 0.2s ease;
    }
    @keyframes tvFade { from { opacity: 0; } to { opacity: 1; } }
    .tv-modal-box {
      background: #0a1929; border: 1px solid rgba(212,175,55,0.35);
      border-radius: 16px; width: 100%; max-width: 1000px;
      max-height: 92vh; overflow: hidden; display: flex; flex-direction: column;
      box-shadow: 0 20px 60px rgba(0,0,0,0.6);
    }
    .tv-modal-head {
      display: flex; justify-content: space-between; align-items: center;
      padding: 14px 16px; border-bottom: 1px solid var(--line); gap: 12px;
    }
    .tv-modal-title { font-size: 1.05rem; font-weight: 900; color: var(--gold); }
    .tv-modal-sub { font-size: 0.74rem; color: var(--muted); margin-top: 2px; direction: ltr; text-align: right; }
    .tv-modal-actions { display: flex; gap: 6px; flex-shrink: 0; }
    .tv-btn {
      padding: 7px 13px; border-radius: 100px; font-size: 0.76rem; font-weight: 700;
      background: linear-gradient(135deg, rgba(212,175,55,0.25), rgba(212,175,55,0.1));
      color: var(--gold); border: 1px solid var(--gold);
      cursor: pointer; text-decoration: none; display: inline-block; white-space: nowrap;
    }
    .tv-btn.ghost { background: rgba(255,255,255,0.06); color: var(--muted); border-color: var(--line); }
    .tv-modal-body { overflow: auto; }
    @media (max-width: 640px) {
      .tv-modal-box { max-height: 95vh; }
      .tv-modal-head { flex-wrap: wrap; }
      .tv-modal-title { font-size: 0.92rem; }
    }

    /* ════════ STOCK LOGOS ════════ */
    .stock-logo-box {
      width: 34px; height: 34px; flex-shrink: 0; display: inline-flex;
      align-items: center; justify-content: center; position: relative;
    }
    .stock-logo-box.lg { width: 46px; height: 46px; }
    .stock-logo {
      width: 34px; height: 34px; border-radius: 9px; object-fit: contain;
      background: rgba(255,255,255,0.06); border: 1px solid var(--line);
    }
    .stock-logo.lg { width: 46px; height: 46px; border-radius: 12px; }
    .logo-fallback {
      width: 34px; height: 34px; border-radius: 9px;
      display: flex; align-items: center; justify-content: center;
      font-size: 0.66rem; font-weight: 900; color: var(--gold);
      background: rgba(212,175,55,0.12); border: 1px solid rgba(212,175,55,0.25);
    }
    .logo-fallback.lg { width: 46px; height: 46px; font-size: 0.8rem; border-radius: 12px; }

    .div-company { display: flex; align-items: center; gap: 9px; }
    .div-logo-slot { flex-shrink: 0; width: 34px; height: 34px; }
    .div-company .div-ticker {
      max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    /* ════════ DIVIDENDS PAGE ════════ */
    .div-stats {
      display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
      gap: 10px; margin-bottom: 20px;
    }
    .div-stat {
      background: rgba(255,255,255,0.04); border: 1px solid var(--line);
      border-radius: 12px; padding: 14px;
    }
    .div-stat-lbl { font-size: 0.72rem; color: var(--muted); font-weight: 700; }
    .div-stat-val { font-size: 1.3rem; font-weight: 900; margin-top: 4px; color: var(--gold); }
    .div-stat-sub { font-size: 0.68rem; color: var(--muted); margin-top: 2px; }

    .div-filters {
      background: rgba(255,255,255,0.03); border: 1px solid var(--line);
      border-radius: 14px; padding: 14px; margin-bottom: 18px;
      display: flex; flex-direction: column; gap: 12px;
    }
    .df-group { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
    .df-label {
      font-size: 0.76rem; color: var(--muted); font-weight: 800;
      min-width: 110px;
    }
    .df-chips { display: flex; gap: 5px; flex-wrap: wrap; }
    .df-chip {
      padding: 6px 13px; border-radius: 100px; font-size: 0.75rem; font-weight: 700;
      background: rgba(255,255,255,0.05); border: 1px solid var(--line);
      color: var(--muted); cursor: pointer; transition: all 0.18s; font-family: inherit;
    }
    .df-chip:hover { color: var(--white); }
    .df-chip.active {
      background: linear-gradient(135deg, rgba(212,175,55,0.25), rgba(212,175,55,0.08));
      border-color: var(--gold); color: var(--gold);
    }

    .div-table-wrap {
      overflow-x: auto; border: 1px solid var(--line); border-radius: 14px;
      background: rgba(255,255,255,0.02);
    }
    .div-table { width: 100%; border-collapse: collapse; font-size: 0.84rem; }
    .div-table thead th {
      background: rgba(212,175,55,0.1); color: var(--gold);
      padding: 12px 10px; text-align: right; font-weight: 800; font-size: 0.78rem;
      white-space: nowrap; border-bottom: 1px solid var(--line);
    }
    .div-table tbody td {
      padding: 11px 10px; border-bottom: 1px solid rgba(255,255,255,0.05);
      white-space: nowrap;
    }
    .div-table tbody tr:hover { background: rgba(255,255,255,0.04); }
    .div-badge {
      display: inline-block; padding: 3px 9px; border-radius: 100px;
      font-size: 0.7rem; font-weight: 800;
    }
    .div-badge.cash { background: rgba(22,199,154,0.2); color: var(--sec); }
    .div-badge.stock { background: rgba(77,171,247,0.2); color: var(--sec2); }
    .div-badge.split { background: rgba(255,208,63,0.2); color: var(--gold2); }
    .div-badge.rights { background: rgba(255,149,0,0.2); color: #ffb020; }
    .div-badge.upcoming { background: rgba(22,199,154,0.15); color: var(--sec); }
    .div-badge.recent { background: rgba(255,208,63,0.15); color: var(--gold2); }
    .div-badge.past { background: rgba(255,255,255,0.08); color: var(--muted); }
    .div-ticker { font-weight: 900; color: var(--white); }
    .div-name { font-size: 0.74rem; color: var(--muted); }
    .div-val-cash { color: var(--sec); font-weight: 800; }
    .div-val-stock { color: var(--sec2); font-weight: 800; }
    .div-yield { color: var(--gold); font-weight: 800; }
    .div-last-close { white-space: nowrap; }
    .div-tv-btn {
      padding: 4px 9px; border-radius: 8px; font-size: 0.9rem;
      background: rgba(212,175,55,0.12); border: 1px solid rgba(212,175,55,0.3);
      color: var(--gold); cursor: pointer; transition: all 0.15s;
    }
    .div-tv-btn:hover { background: rgba(212,175,55,0.25); transform: scale(1.08); }
    .div-table td:first-child { white-space: nowrap; }
    .div-table td:first-child .div-ticker { max-width: 180px; overflow: hidden; text-overflow: ellipsis; }
    .div-table td:first-child .div-ticker { font-size: 0.84rem; line-height: 1.4; }
    .div-yield-na { color: var(--muted); }
    @media (max-width: 640px) {
      .df-label { min-width: 100%; }
      .div-table { font-size: 0.78rem; }
    }

    /* ============ ENGINE ============ */
    .engine-card {
      background: linear-gradient(135deg, rgba(77,171,247,0.1), rgba(22,199,154,0.05));
      border: 1px solid rgba(77,171,247,0.3); border-radius: 20px;
      padding: 24px; text-align: center; margin-bottom: 16px;
    }
    .engine-price-box {
      background: linear-gradient(135deg, rgba(212,175,55,0.15), rgba(244,208,63,0.05));
      border: 2px solid var(--gold);
      border-radius: 16px;
      padding: 14px 18px;
      margin-bottom: 12px;
      display: flex; justify-content: space-between; align-items: center;
      gap: 12px; flex-wrap: wrap;
      font-size: 0.9rem;
    }
    .engine-price-box .price-value { font-size: 1.1rem; }
    .price-main { display: flex; flex-direction: column; align-items: flex-start; }
    .price-symbol { font-size: 1.4rem; font-weight: 900; color: var(--gold); }
    .price-name { font-size: 0.78rem; color: var(--muted); margin-top: 2px; }
    .price-meta { display: flex; flex-direction: column; align-items: flex-end; }
    .price-value { font-size: 1.6rem; font-weight: 900; color: var(--white); }
    .price-change {
      font-size: 0.92rem; font-weight: 800; margin-top: 4px;
      padding: 3px 10px; border-radius: 100px;
      background: rgba(255,255,255,0.08); color: var(--muted);
    }
    .price-change.up { background: rgba(22,199,154,0.18); color: var(--sec); }
    .price-change.down { background: rgba(255,82,82,0.18); color: var(--red2); }
    .live-tick {
      display: inline-block; width: 8px; height: 8px; border-radius: 50%;
      background: var(--sec); margin-right: 6px; vertical-align: middle;
      animation: pulse 1.5s ease-in-out infinite;
    }
    .engine-title { font-size: 1.4rem; font-weight: 900; color: var(--sec2); margin-bottom: 4px; }
    .engine-sub { color: var(--muted); font-size: 0.88rem; margin-bottom: 24px; }
    .engine-bars { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; }
    .engine-bar { display: flex; align-items: center; gap: 10px; }
    .engine-bar .lbl {
      width: 130px; font-size: 0.78rem; font-weight: 700;
      color: var(--txt); flex-shrink: 0; text-align: right;
    }
    .engine-bar .bar {
      flex: 1; height: 26px;
      background: rgba(255,255,255,0.05);
      border-radius: 100px; overflow: hidden; border: 1px solid var(--line);
    }
    .engine-bar .fill {
      height: 100%; border-radius: 100px;
      display: flex; align-items: center; justify-content: center;
      font-size: 0.75rem; font-weight: 800; color: var(--pri);
      transition: width 1.5s cubic-bezier(0.4, 0, 0.2, 1);
    }
    /* ============ OCTA AI ANIMATION ============ */
    @keyframes pulse {
      0%, 100% { transform: scale(1); opacity: 1; }
      50% { transform: scale(1.15); opacity: 0.7; }
    }
    .engine-decision {      background: linear-gradient(135deg, rgba(22,199,154,0.15), rgba(22,199,154,0.05));
      border: 1px solid rgba(22,199,154,0.4); border-radius: 16px;
      padding: 20px; text-align: center;
    }
    .verdict { font-size: 1.4rem; font-weight: 900; color: var(--sec); margin-bottom: 6px; }
    .action { font-size: 0.95rem; color: var(--txt); margin-bottom: 12px; }
    .conf { font-size: 0.85rem; color: var(--muted); line-height: 1.8; }

    /* ============ COMPARE ============ */
    .compare-pickers {
      display: grid; grid-template-columns: repeat(3, 1fr);
      gap: 12px; margin-bottom: 20px;
    }
    .compare-picker select {
      width: 100%; padding: 14px 12px; border-radius: 12px;
      background: var(--pri2); border: 2px solid var(--line);
      color: var(--txt); font-size: 0.95rem; font-weight: 700;
      cursor: pointer;
    }
    .compare-picker select:focus { outline: none; border-color: var(--gold); }
    .compare-table {
      width: 100%; border-collapse: collapse; margin-top: 16px;
      background: var(--pri3); border-radius: 16px; overflow: hidden;
      border: 1px solid var(--line);
    }
    .compare-table th, .compare-table td {
      padding: 14px 12px; text-align: center;
      border-bottom: 1px solid var(--line); font-size: 0.95rem;
    }
    .compare-table th {
      background: linear-gradient(135deg, rgba(212,175,55,0.15), rgba(212,175,55,0.05));
      color: var(--gold); font-weight: 800; font-size: 1rem;
    }
    .compare-table th:not(:first-child) { border-right: 1px solid var(--line); }
    .compare-table td:not(:first-child) { border-right: 1px solid var(--line); }
    .compare-table td { color: var(--txt); }
    .compare-table tr:last-child td { border-bottom: none; }
    .compare-table .row-label {
      background: rgba(255,255,255,0.05); color: var(--muted);
      font-weight: 800; text-align: right;
    }
    /* TradingView widgets للمقارنة */
    .compare-tv-section {
      display: grid; grid-template-columns: 1fr 1fr 1fr;
      gap: 12px; margin-bottom: 16px;
    }
    @media (max-width: 700px) {
      .compare-tv-section { grid-template-columns: 1fr; }
    }
    .compare-tv-card {
      background: var(--pri3); border: 1px solid var(--line);
      border-radius: 12px; padding: 12px; min-height: 180px;
    }
    .compare-tv-title { color: var(--gold); font-weight: 800; margin-bottom: 8px; }

    /* ============ CALCS ============ */
    .calc-tabs { display: flex; gap: 6px; margin-bottom: 16px; overflow-x: auto; }
    .calc-tab {
      flex-shrink: 0; padding: 10px 16px; border-radius: 100px;
      background: rgba(255,255,255,0.04); border: 1px solid var(--line);
      color: var(--muted); font-weight: 700; font-size: 0.82rem;
    }
    .calc-tab.active {
      background: linear-gradient(135deg, rgba(212,175,55,0.2), rgba(244,208,63,0.1));
      border-color: var(--gold); color: var(--gold);
    }
    .calc-form { display: flex; flex-direction: column; gap: 12px; }
    .calc-form label { font-size: 0.85rem; font-weight: 700; color: var(--muted); }
    .calc-form input {
      width: 100%; padding: 12px;
      background: var(--pri2); border: 1px solid var(--line);
      border-radius: 10px; color: var(--txt); font-size: 1rem; font-weight: 700;
    }
    .calc-form input:focus { outline: none; border-color: var(--gold); }
    .calc-btn {
      background: linear-gradient(135deg, #d4af37, #f4d03f);
      color: var(--pri); padding: 14px; border-radius: 12px;
      font-weight: 900; font-size: 0.95rem;
    }
    .calc-result {
      background: rgba(22,199,154,0.1);
      border: 1px solid rgba(22,199,154,0.3);
      border-radius: 12px; padding: 16px; margin-top: 12px; text-align: center;
    }
    .calc-result .num { font-size: 1.8rem; font-weight: 900; color: var(--sec); }
    .calc-result .lbl { font-size: 0.8rem; color: var(--muted); }

    /* ============ ARMS ============ */
    .arm-card {
      background: linear-gradient(135deg, rgba(22,199,154,0.05), rgba(77,171,247,0.03));
      border: 1px solid var(--line); border-radius: 16px;
      padding: 18px; margin-bottom: 10px; cursor: pointer;
      display: flex; align-items: center; gap: 14px; transition: all 0.2s;
    }
    .arm-card:hover { border-color: var(--gold); transform: translateX(-3px); }
    .arm-num {
      width: 48px; height: 48px; border-radius: 12px;
      background: linear-gradient(135deg, #d4af37, #f4d03f);
      display: flex; align-items: center; justify-content: center;
      font-weight: 900; color: var(--pri); font-size: 0.95rem; flex-shrink: 0;
    }
    .arm-info { flex: 1; }
    .arm-name { font-weight: 800; font-size: 0.95rem; color: var(--white); margin-bottom: 2px; }
    .arm-desc { font-size: 0.78rem; color: var(--muted); }
    .arm-arrow { color: var(--gold); font-size: 1.2rem; }

    /* ============ MODAL ============ */
    .modal-overlay {
      position: fixed; top: 0; left: 0; right: 0; bottom: 0;
      background: rgba(0,0,0,0.85); z-index: 200;
      display: none; align-items: center; justify-content: center; padding: 16px;
    }
    .modal-overlay.active { display: flex; }
    .modal {
      background: var(--pri); border: 1px solid var(--gold); border-radius: 20px;
      max-width: 600px; width: 100%; max-height: 90vh; overflow-y: auto;
      padding: 24px; box-shadow: 0 8px 40px rgba(0,0,0,0.5);
    }
    .modal-close {
      float: left; background: rgba(255,255,255,0.05);
      width: 32px; height: 32px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.2rem; color: var(--muted);
    }
    .modal h3 { font-size: 1.3rem; font-weight: 900; color: var(--gold); margin-bottom: 4px; }
    .modal .sub { color: var(--muted); font-size: 0.85rem; margin-bottom: 16px; }
    .modal .what { color: var(--txt); font-size: 0.92rem; margin-bottom: 16px; line-height: 1.7; }
    .modal h4 { font-size: 0.95rem; font-weight: 800; color: var(--sec2); margin: 16px 0 8px; }
    .modal ul { list-style: none; padding: 0; margin-bottom: 16px; }
    .modal ul li {
      padding: 8px 12px; margin-bottom: 6px;
      background: rgba(255,255,255,0.03);
      border-right: 3px solid var(--gold); border-radius: 8px; font-size: 0.88rem;
    }
    .modal .example {
      background: linear-gradient(135deg, rgba(244,208,63,0.1), rgba(244,208,63,0.02));
      border: 1px solid rgba(244,208,63,0.3); border-radius: 12px;
      padding: 14px; font-size: 0.88rem; line-height: 1.7;
    }
    .modal .example .lbl { font-weight: 800; color: var(--gold2); display: block; margin-bottom: 6px; }

    /* ============ QUOTE ============ */
    .quote-card {
      background: linear-gradient(135deg, rgba(212,175,55,0.15), rgba(212,175,55,0.05));
      border: 1px solid rgba(212,175,55,0.4); border-radius: 20px;
      padding: 28px 24px; text-align: center; position: relative;
    }
    .quote-mark { font-size: 3rem; color: var(--gold); opacity: 0.3; line-height: 1; }
    .quote-text { font-size: 1.05rem; font-weight: 700; color: var(--white); line-height: 1.8; margin: 12px 0; }
    .quote-author { font-size: 0.85rem; color: var(--gold); font-weight: 800; }

    /* ============ NEWS ============ */
    .news-ticker {
      background: rgba(255,255,255,0.03);
      border: 1px solid var(--line); border-radius: 12px;
      padding: 12px 16px; margin-bottom: 12px;
      display: flex; align-items: center; gap: 12px;
      transition: all 0.2s;
    }
    .news-ticker:hover {
      background: rgba(212,175,55,0.05);
      border-color: rgba(212,175,55,0.3);
    }
    .news-filter-btn {
      flex-shrink: 0;
      padding: 8px 14px; border-radius: 100px;
      background: var(--pri3); border: 1px solid var(--line);
      color: var(--muted); font-size: 0.82rem; font-weight: 700;
      cursor: pointer;
      transition: all 0.2s;
      white-space: nowrap;
    }
    .news-filter-btn.active {
      background: linear-gradient(135deg, rgba(212,175,55,0.2), rgba(244,208,63,0.1));
      border-color: var(--gold);
      color: var(--gold);
    }
    .news-filter-btn:hover { color: var(--white); }
    .news-time { color: var(--gold); font-weight: 800; font-size: 0.85rem; flex-shrink: 0; }
    .news-tag {
      background: rgba(212,175,55,0.15); color: var(--gold);
      padding: 3px 8px; border-radius: 6px;
      font-size: 0.72rem; font-weight: 800; flex-shrink: 0;
    }
    .news-text { font-size: 0.88rem; color: var(--txt); flex: 1; }

    /* ============ LIVE ============ */
    .live-bar {
      background: linear-gradient(135deg, rgba(22,199,154,0.15), rgba(22,199,154,0.05));
      border: 1px solid rgba(22,199,154,0.4); border-radius: 12px;
      padding: 12px 16px; margin-bottom: 16px;
      display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap;
    }
    .live-dot {
      width: 8px; height: 8px; border-radius: 50%;
      background: var(--sec); animation: pulse 1.5s ease-in-out infinite;
    }
    @keyframes pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:0.4; transform:scale(1.3); } }
    .live-text { color: var(--sec); font-weight: 800; font-size: 0.9rem; }
    .live-meta { color: var(--muted); font-size: 0.78rem; }

    /* ============ SEARCH ============ */
    .search-box { position: relative; margin-bottom: 16px; }
    .search-box input {
      width: 100%; padding: 14px 48px 14px 16px;
      background: var(--pri2); border: 1px solid var(--line);
      border-radius: 100px; color: var(--txt); font-size: 0.95rem;
    }
    .search-box input:focus { outline: none; border-color: var(--gold); }
    .search-box .icon {
      position: absolute; right: 16px; top: 50%;
      transform: translateY(-50%); font-size: 1.1rem; color: var(--muted);
    }
    .engine-quick-chip {
      padding: 5px 12px;
      background: var(--pri2);
      border: 1px solid var(--line);
      border-radius: 100px;
      color: var(--gold);
      font-size: 0.78rem; font-weight: 800;
      cursor: pointer;
      transition: all 0.2s;
    }
    .engine-quick-chip:hover {
      background: linear-gradient(135deg, rgba(212,175,55,0.2), rgba(244,208,63,0.1));
      border-color: var(--gold);
      transform: translateY(-2px);
    }

    /* ============ جدول الأسهم الاحترافي (نفس الصور) ============ */
    .engine-stocks-table-wrap {
      background: var(--pri3);
      border: 1px solid var(--line);
      border-radius: 16px;
      padding: 16px;
      margin-bottom: 16px;
    }
    .engine-table-scroll {
      overflow-x: auto;
      border-radius: 12px;
      -webkit-overflow-scrolling: touch;
      scroll-behavior: smooth;
    }
    .engine-table-scroll::-webkit-scrollbar {
      height: 6px;
    }
    .engine-table-scroll::-webkit-scrollbar-track {
      background: var(--pri2);
    }
    .engine-table-scroll::-webkit-scrollbar-thumb {
      background: var(--gold);
      border-radius: 3px;
    }
    .engine-stocks-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 0.85rem;
      min-width: 700px;
    }
    .engine-stocks-table thead th {
      background: var(--pri2);
      color: var(--muted);
      font-weight: 700;
      padding: 10px 8px;
      text-align: right;
      font-size: 0.78rem;
      border-bottom: 2px solid var(--line);
      white-space: nowrap;
    }
    .engine-stocks-table tbody td {
      padding: 12px 8px;
      border-bottom: 1px solid var(--line);
      text-align: right;
      color: var(--txt);
      white-space: nowrap;
    }
    .engine-stocks-table tbody tr {
      transition: all 0.2s;
      cursor: pointer;
    }
    .engine-stocks-table tbody tr:hover {
      background: rgba(212,175,55,0.05);
    }
    .engine-stocks-table tbody tr:last-child td {
      border-bottom: none;
    }
    .th-change, .engine-stocks-table td:nth-child(8) {
      color: var(--sec);
      font-weight: 800;
    }
    .th-code {
      text-align: center !important;
    }
    .engine-stocks-table td:nth-child(9) {
      color: var(--white);
      font-weight: 800;
      font-size: 0.92rem;
    }
    .engine-stocks-table td:nth-child(10) {
      text-align: center;
    }
    .th-action {
      width: 36px;
      padding: 10px 4px !important;
    }
    .engine-stock-row-icon {
      width: 28px; height: 28px; border-radius: 50%;
      display: inline-flex; align-items: center; justify-content: center;
      font-weight: 800; font-size: 0.65rem; color: var(--pri);
      background: var(--grad-blue, linear-gradient(135deg, #16c79a, #4dabf7));
      margin-left: 6px;
      vertical-align: middle;
    }
    .engine-stock-trash {
      color: var(--muted);
      cursor: pointer;
      font-size: 0.95rem;
      opacity: 0.6;
      transition: all 0.2s;
    }
    .engine-stock-trash:hover {
      color: var(--red);
      opacity: 1;
    }
    .engine-stock-code-cell {
      display: flex; align-items: center; gap: 4px;
    }
    .engine-stock-logo {
      width: 22px; height: 22px; border-radius: 50%;
      background: linear-gradient(135deg, #4dabf7, #16c79a);
      color: var(--pri); font-weight: 800; font-size: 0.65rem;
      display: inline-flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .engine-stock-logo-circle {
      width: 26px; height: 26px; border-radius: 50%;
      display: inline-flex; align-items: center; justify-content: center;
      font-size: 0.7rem; font-weight: 800; letter-spacing: -0.5px;
      flex-shrink: 0;
      border: 1.5px solid rgba(255,255,255,0.2);
    }
    .live-price-cell, .live-change-cell {
      font-weight: 800;
      font-size: 0.9rem;
      color: var(--white);
      padding: 4px;
      border-radius: 6px;
      transition: all 0.3s;
    }
    .live-change-cell {
      color: var(--sec);
      font-size: 0.85rem;
    }
    .live-change-cell.negative {
      color: var(--red2);
    }
    .live-price-cell.updating, .live-change-cell.updating {
      background: rgba(212,175,55,0.15);
    }

    /* ============ ACADEMY ============ */
    .book-card {
      background: linear-gradient(135deg, rgba(22,199,154,0.05), rgba(77,171,247,0.03));
      border: 1px solid var(--line); border-radius: 16px;
      padding: 20px; margin-bottom: 12px;
    }
    .book-title { font-size: 1.05rem; font-weight: 800; color: var(--gold); margin-bottom: 4px; }
    .book-author { color: var(--muted); font-size: 0.85rem; margin-bottom: 10px; }
    .book-desc { color: var(--txt); font-size: 0.88rem; line-height: 1.7; }

    /* ============ FOOTER ============ */
    .footer {
      text-align: center; padding: 32px 16px;
      color: var(--muted); font-size: 0.78rem;
      border-top: 1px solid var(--line); margin-top: 40px;
    }
    .footer .brand { color: var(--gold); font-weight: 800; }

    /* ══════════ حقوق الملكية — م/ أحمد عز ══════════ */
    .octa-credit {
      max-width: 1400px; margin: 40px auto 0; padding: 0 16px 34px;
      border-top: 1px solid var(--line);
    }
    .oc-inner { text-align: center; }
    .oc-line { display: flex; align-items: center; justify-content: center; gap: 9px; margin-bottom: 12px; }
    .oc-brand { font-size: 1.15rem; font-weight: 900; letter-spacing: 1.5px;
      background: linear-gradient(135deg,#d4af37,#f4d03f,#d4af37);
      -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
    .oc-dot { color: var(--muted); }
    .oc-sub { font-size: .8rem; color: var(--muted); }
    .oc-own {
      display: inline-flex; align-items: center; gap: 9px; padding: 11px 20px; border-radius: 13px;
      background: linear-gradient(135deg, rgba(212,175,55,.13), rgba(212,175,55,.04));
      border: 1px solid rgba(212,175,55,.4);
      font-size: .92rem; color: var(--txt); font-weight: 700;
    }
    .oc-own b { color: var(--gold2); font-weight: 900; font-size: 1rem; }
    .oc-badge { font-size: .95rem; }
    .oc-warn {
      max-width: 780px; margin: 14px auto 0; font-size: .76rem; line-height: 1.9; color: var(--muted);
      padding: 11px 15px; border-radius: 11px; background: rgba(255,255,255,.028); border: 1px solid var(--line);
    }
    .oc-meta { margin-top: 13px; font-size: .72rem; color: var(--muted); }
    body.light .oc-brand { background: linear-gradient(135deg,#8a6d12,#b8912f,#8a6d12);
      -webkit-background-clip: text; background-clip: text; }
    body.light .oc-own { background: #fffbeb; border-color: rgba(154,123,24,.45); color: var(--txt); }
    body.light .oc-own b { color: #8a6d12; }
    body.light .oc-warn { background: #f7f9fc; border-color: var(--line); }

    /* ══════════════════════════════════════════════════════
       ⚖️ إخلاء المسؤولية
       ══════════════════════════════════════════════════════ */
    .oc-disc {
      margin-top: 14px;
      padding: 14px 16px;
      border: 1px solid var(--line);
      border-right: 3px solid var(--gold);
      border-radius: 10px;
      background: rgba(255, 193, 7, .05);
    }
    body.light .oc-disc { background: #fffdf5; }
    .oc-disc-h {
      font-size: .95rem;
      font-weight: 800;
      color: var(--gold);
      margin-bottom: 9px;
    }
    .oc-disc-l {
      margin: 0;
      padding-right: 18px;
      font-size: .78rem;
      line-height: 2;
      color: var(--muted);
    }
    .oc-disc-l b { color: var(--text); }
    .oc-disc-f {
      margin-top: 10px;
      padding-top: 9px;
      border-top: 1px dashed var(--line);
      font-size: .71rem;
      line-height: 1.8;
      color: var(--muted);
      opacity: .85;
    }
    @media (max-width: 480px) {
      .oc-disc { padding: 12px 13px; }
      .oc-disc-l { font-size: .74rem; line-height: 2.1; }
    }

    /* ============ ANIM ============ */
    @keyframes fadeIn { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
    .page.active { animation: fadeIn 0.4s ease; }

    /* ============ 3 NEW FEATURES (TradingView) ============ */
    .screener-hero {
      text-align: center;
      padding: 32px 20px;
      background: linear-gradient(135deg, rgba(0, 212, 255, 0.08), rgba(139, 92, 246, 0.08));
      border: 1px solid rgba(0, 212, 255, 0.3);
      border-radius: 20px;
      margin-bottom: 24px;
    }
    .screener-hero h2 {
      font-size: 28px; font-weight: 900;
      background: linear-gradient(135deg, #00d4ff, #8b5cf6);
      -webkit-background-clip: text; -webkit-text-fill-color: transparent;
      margin-bottom: 8px;
    }
    .screener-hero p { color: var(--muted); font-size: 14px; }
    .screener-tabs {
      display: flex; gap: 10px; margin-bottom: 20px;
      overflow-x: auto; padding-bottom: 8px;
    }
    .screener-tab {
      display: flex; align-items: center; gap: 8px;
      padding: 12px 20px;
      background: var(--pri3);
      border: 1px solid var(--line);
      border-radius: 12px;
      color: var(--muted); cursor: pointer;
      white-space: nowrap; font-family: inherit;
      font-size: 14px; font-weight: 600;
    }
    .screener-tab.active {
      background: linear-gradient(135deg, #00d4ff, #8b5cf6);
      color: #fff; border-color: transparent;
    }
    .tradingview-widget-container {
      background: var(--pri3);
      border: 1px solid var(--line);
      border-radius: 16px;
      padding: 16px; margin-bottom: 24px; min-height: 580px;
    }
    .search-box {
      background: var(--pri3);
      border: 1px solid var(--line);
      border-radius: 16px; padding: 20px; margin-bottom: 24px;
    }
    .search-input {
      width: 100%; padding: 16px 20px;
      background: var(--pri2);
      border: 2px solid var(--line);
      border-radius: 12px;
      color: var(--txt);
      font-family: inherit; font-size: 15px;
    }
    .search-input:focus { outline: none; border-color: var(--sec2); }
    .quick-picks {
      display: flex; flex-wrap: wrap; gap: 8px;
      margin-top: 12px; padding-top: 12px;
      border-top: 1px solid var(--line);
    }
    .quick-pick-btn {
      padding: 6px 14px;
      background: var(--pri2);
      border: 1px solid var(--line);
      border-radius: 20px;
      color: var(--txt); cursor: pointer;
      font-family: inherit; font-size: 13px; font-weight: 600;
    }
    .quick-pick-btn:hover { border-color: var(--sec2); color: var(--sec2); }
    .search-loading { text-align: center; padding: 40px; color: var(--muted); }
    .spinner {
      width: 32px; height: 32px;
      border: 3px solid var(--line);
      border-top-color: var(--sec2);
      border-radius: 50%;
      margin: 0 auto 12px;
      animation: spin 0.8s linear infinite;
    }
    @keyframes spin { to { transform: rotate(360deg); } }
    .search-result-card {
      background: var(--pri3);
      border: 1px solid var(--line);
      border-radius: 16px;
      padding: 24px; margin-bottom: 24px;
    }
    .result-header {
      margin-bottom: 20px; padding-bottom: 16px;
      border-bottom: 1px solid var(--line);
    }
    .result-title { font-size: 24px; font-weight: 900; margin-bottom: 4px; }
    .result-subtitle { color: var(--muted); font-size: 14px; }
    .result-section { margin-bottom: 24px; }
    .result-section-title { font-size: 16px; font-weight: 700; margin-bottom: 12px; color: var(--sec2); }
    .bestpick-hero {
      text-align: center; padding: 32px 20px;
      background: linear-gradient(135deg, rgba(212,175,55,0.15), rgba(255,82,82,0.05));
      border: 1px solid rgba(212,175,55,0.4);
      border-radius: 20px; margin-bottom: 24px;
    }
    .bestpick-badge {
      display: inline-block; padding: 6px 14px;
      background: var(--gold); color: var(--pri);
      border-radius: 20px;
      font-size: 12px; font-weight: 900; margin-bottom: 12px;
    }
    .bestpick-hero h2 {
      font-size: 28px; font-weight: 900;
      background: linear-gradient(135deg, #fbbf24, #ef4444);
      -webkit-background-clip: text; -webkit-text-fill-color: transparent;
      margin-bottom: 8px;
    }
    .bestpick-hero p { color: var(--muted); font-size: 14px; }
    .symbol-selector {
      background: var(--pri3);
      border: 1px solid var(--line);
      border-radius: 16px; padding: 20px; margin-bottom: 24px;
    }
    .symbol-selector h3 { font-size: 16px; margin-bottom: 14px; }
    .symbol-buttons {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
      gap: 10px;
    }
    .symbol-btn {
      display: flex; flex-direction: column; align-items: flex-start;
      padding: 12px 14px;
      background: var(--pri2);
      border: 1px solid var(--line);
      border-radius: 12px; cursor: pointer;
      font-family: inherit; color: var(--txt);
      transition: all 0.2s;
    }
    .symbol-btn:hover { border-color: var(--sec2); }
    .symbol-btn.active {
      background: linear-gradient(135deg, rgba(77,171,247,0.2), rgba(22,199,154,0.1));
      border-color: var(--sec2);
    }
    .symbol-btn .sym-code { font-weight: 900; font-size: 14px; color: var(--sec2); }
    .symbol-btn .sym-name { font-size: 11px; color: var(--muted); margin-top: 4px; }
    .bestpick-card {
      background: var(--pri3);
      border: 1px solid var(--line);
      border-radius: 16px;
      padding: 20px; margin-bottom: 20px;
    }
    .card-section-title { font-size: 18px; font-weight: 700; margin-bottom: 12px; }

    /* ══════════ PHASE 18: صفحة التحليل الكامل ══════════ */
    .intel-hero {
      background: linear-gradient(135deg, rgba(212,175,55,0.10), rgba(16,42,67,0.6));
      border: 1px solid rgba(212,175,55,0.28);
      border-radius: 20px; padding: 26px; margin-bottom: 22px;
      text-align: center; position: relative; overflow: hidden;
    }
    .intel-hero::before {
      content: ''; position: absolute; top: -50%; right: -10%;
      width: 320px; height: 320px; border-radius: 50%;
      background: radial-gradient(circle, rgba(212,175,55,0.14), transparent 70%);
    }
    .intel-code { font-size: 1.9rem; font-weight: 900; color: var(--gold); letter-spacing: 1px; }
    .intel-name { font-size: 1.05rem; color: var(--txt); margin: 6px 0 14px; }
    .intel-sector {
      display: inline-block; padding: 4px 14px; border-radius: 20px;
      background: rgba(212,175,55,0.12); border: 1px solid rgba(212,175,55,0.3);
      color: var(--gold); font-size: 0.8rem; font-weight: 700; margin-bottom: 18px;
    }
    .intel-price { font-size: 2.3rem; font-weight: 900; color: var(--txt); letter-spacing: -1px; }
    .intel-price .pos { color: var(--sec); } .intel-price .neg { color: var(--red2); }
    .intel-chg {
      display: inline-block; padding: 5px 14px; border-radius: 10px;
      font-weight: 900; font-size: 0.95rem; margin-right: 12px;
    }
    .intel-chg.pos { background: rgba(22,199,154,0.16); color: var(--sec); }
    .intel-chg.neg { background: rgba(255,82,82,0.16); color: var(--red2); }

    .intel-scores { display: flex; gap: 20px; justify-content: center; margin-top: 22px; flex-wrap: wrap; }
    .score-circle {
      width: 122px; height: 122px; border-radius: 50%; display: flex;
      flex-direction: column; align-items: center; justify-content: center;
      border: 3px solid; position: relative;
    }
    .score-circle.gold { border-color: var(--gold); background: rgba(212,175,55,0.08); }
    .score-circle.blue { border-color: var(--sec); background: rgba(22,199,154,0.08); }
    .score-circle .sc-val { font-size: 2rem; font-weight: 900; line-height: 1; }
    .score-circle.gold .sc-val { color: var(--gold); }
    .score-circle.blue .sc-val { color: var(--sec); }
    .score-circle .sc-label { font-size: 0.72rem; color: var(--muted); margin-top: 5px; }

    .intel-decision {
      margin-top: 20px; padding: 14px 22px; border-radius: 14px;
      font-size: 1.15rem; font-weight: 800; display: inline-block;
    }
    .intel-decision.buy, .intel-decision.تجميع { background: rgba(22,199,154,0.16); color: var(--sec); border: 1px solid rgba(22,199,154,0.4); }
    .intel-decision.hold, .intel-decision.احتفظ { background: rgba(212,175,55,0.14); color: var(--gold); border: 1px solid rgba(212,175,55,0.35); }
    .intel-decision.sell, .intel-decision.بيع, .intel-decision.تجنّب { background: rgba(255,82,82,0.16); color: var(--red2); border: 1px solid rgba(255,82,82,0.4); }
    .intel-decision small { display: block; font-size: 0.78rem; font-weight: 500; color: var(--muted); margin-top: 4px; }

    .axis-bars { display: flex; flex-direction: column; gap: 12px; }
    .axis-row-2 { display: grid; grid-template-columns: 90px 1fr 46px 40px; gap: 10px; align-items: center; }
    .axis-name-2 { font-size: 0.86rem; color: var(--txt); font-weight: 700; }
    .axis-track-2 { height: 10px; background: rgba(255,255,255,0.07); border-radius: 5px; overflow: hidden; }
    .axis-fill-2 { height: 100%; border-radius: 5px; transition: width 0.5s ease; }
    .axis-fill-2.good { background: linear-gradient(90deg, #16c79a, #d4af37); }
    .axis-fill-2.mid  { background: linear-gradient(90deg, #ffc107, #d4af37); }
    .axis-fill-2.bad  { background: linear-gradient(90deg, #ff5252, #ff8a65); }
    .axis-num-2 { font-size: 0.86rem; font-weight: 800; color: var(--gold); text-align: left; }
    .axis-weight-2 { font-size: 0.68rem; color: var(--muted); text-align: left; }

    .why-box {
      background: rgba(255,255,255,0.03); border: 1px solid var(--line);
      border-radius: 14px; padding: 16px; margin-top: 12px;
    }
    .why-title { font-size: 0.92rem; font-weight: 800; color: var(--gold); margin-bottom: 10px; }
    .fact-list { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 7px; }
    .fact-list li { font-size: 0.86rem; color: var(--txt); padding-right: 22px; position: relative; line-height: 1.6; }
    .fact-list li.pos::before { content: '✅'; position: absolute; right: 0; }
    .fact-list li.neg::before { content: '❌'; position: absolute; right: 0; }
    .fact-list li.neu::before { content: '⚖️'; position: absolute; right: 0; }

    .fv-box {
      background: linear-gradient(135deg, rgba(212,175,55,0.10), rgba(22,199,154,0.06));
      border: 1px solid rgba(212,175,55,0.25); border-radius: 14px; padding: 18px; text-align: center;
    }
    .fv-box .fv-label { font-size: 0.8rem; color: var(--muted); }
    .fv-box .fv-value { font-size: 2.1rem; font-weight: 900; color: var(--gold); margin: 6px 0; }
    .fv-box .fv-upside { font-size: 1.15rem; font-weight: 800; }
    .fv-box .fv-upside.pos { color: var(--sec); } .fv-box .fv-upside.neg { color: var(--red2); }
    .fv-box .fv-conf { font-size: 0.78rem; color: var(--muted); margin-top: 8px; }

    .risk-badge { display: inline-block; padding: 5px 16px; border-radius: 10px; font-weight: 800; font-size: 0.88rem; }
    .risk-badge.منخفض { background: rgba(22,199,154,0.16); color: var(--sec); }
    .risk-badge.متوسط { background: rgba(212,175,55,0.14); color: var(--gold); }
    .risk-badge.مرتفع { background: rgba(255,152,0,0.16); color: #ff9800; }
    .risk-badge['مرتفع جداً'], .risk-badge.مرتفع_جداً { background: rgba(255,82,82,0.16); color: var(--red2); }

    .intel-loading { padding: 60px; text-align: center; color: var(--muted); }
    .intel-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    @media (max-width: 700px) {
      .intel-grid-2 { grid-template-columns: 1fr; }
      .intel-price { font-size: 1.8rem; }
      .score-circle { width: 100px; height: 100px; }
      .score-circle .sc-val { font-size: 1.6rem; }
    }


    /* ════════ PHASE 13: أفضل الفرص ════════ */
    .opps-head {
      display: flex; align-items: center; justify-content: space-between;
      gap: 12px; margin: 26px 0 14px; flex-wrap: wrap;
    }
    .opps-head h3 { font-size: 1.15rem; color: var(--gold); font-weight: 800; }
    .opps-head .sub { font-size: 0.78rem; color: var(--muted); }
    .opps-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(178px, 1fr)); gap: 10px; }
    .opp-card {
      background: linear-gradient(135deg, rgba(255,255,255,0.055), rgba(255,255,255,0.02));
      border: 1px solid var(--line); border-radius: 14px; padding: 14px;
      cursor: pointer; transition: all .22s; position: relative; overflow: hidden;
    }
    .opp-card:hover { border-color: rgba(212,175,55,0.4); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.35); }
    .opp-rank {
      position: absolute; top: 10px; left: 10px; width: 22px; height: 22px;
      border-radius: 50%; background: rgba(212,175,55,0.15); color: var(--gold);
      font-size: 0.72rem; font-weight: 900; display: flex; align-items: center; justify-content: center;
    }
    .opp-code { font-size: 0.95rem; font-weight: 900; color: var(--txt); margin-right: 26px; }
    .opp-name { font-size: 0.72rem; color: var(--muted); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .opp-score-row { display: flex; align-items: baseline; gap: 8px; margin-top: 10px; }
    .opp-score { font-size: 1.6rem; font-weight: 900; color: var(--gold); line-height: 1; }
    .opp-conf { font-size: 0.7rem; color: var(--sec); font-weight: 700; }
    .opp-meta { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; font-size: 0.76rem; }
    .opp-dec { padding: 2px 8px; border-radius: 6px; font-weight: 800; font-size: 0.7rem; }
    .opp-dec.buy { background: rgba(22,199,154,.16); color: var(--sec); }
    .opp-dec.hold { background: rgba(212,175,55,.14); color: var(--gold); }
    .opp-dec.sell { background: rgba(255,82,82,.16); color: var(--red2); }
    .opp-up { font-weight: 800; }
    .opp-up.pos { color: var(--sec); } .opp-up.neg { color: var(--red2); }
    .opp-bar { height: 4px; background: rgba(255,255,255,.07); border-radius: 2px; margin-top: 9px; overflow: hidden; }
    .opp-bar > i { display: block; height: 100%; background: linear-gradient(90deg, var(--sec), var(--gold)); }
    .opps-loading { padding: 26px; text-align: center; color: var(--muted); }


    /* ════════ PHASE 18: لوحة التحكم ════════ */
    .dash-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px,1fr)); gap: 11px; margin-bottom: 22px; }
    .dash-kpi {
      background: linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.02));
      border: 1px solid var(--line); border-radius: 14px; padding: 15px; text-align: center;
    }
    .dash-kpi .k-val { font-size: 1.8rem; font-weight: 900; color: var(--gold); line-height: 1.1; }
    .dash-kpi .k-label { font-size: .72rem; color: var(--muted); margin-top: 5px; }
    .dash-kpi .k-sub { font-size: .66rem; color: var(--muted); margin-top: 3px; opacity: .8; }
    .dash-kpi.good .k-val { color: var(--sec); }
    .dash-kpi.warn .k-val { color: #ff9800; }
    .dash-kpi.bad .k-val { color: var(--red2); }

    .dash-section { margin-bottom: 26px; }
    .dash-h { font-size: 1.08rem; color: var(--gold); font-weight: 800; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
    .dash-h small { font-size: .72rem; color: var(--muted); font-weight: 500; }

    .axis-bars-dash { display: flex; flex-direction: column; gap: 9px; }
    .ad-row { display: grid; grid-template-columns: 92px 1fr 44px 34px; gap: 9px; align-items: center; }
    .ad-name { font-size: .82rem; color: var(--txt); font-weight: 600; }
    .ad-track { height: 9px; background: rgba(255,255,255,.07); border-radius: 5px; overflow: hidden; }
    .ad-fill { height: 100%; border-radius: 5px; transition: width .5s; }
    .ad-val { font-size: .84rem; font-weight: 800; color: var(--gold); }
    .ad-w { font-size: .68rem; color: var(--muted); text-align: left; }

    .dist-row { display: flex; align-items: center; gap: 10px; margin-bottom: 9px; }
    .dist-label { font-size: .84rem; width: 76px; color: var(--txt); }
    .dist-track { flex: 1; height: 20px; background: rgba(255,255,255,.06); border-radius: 6px; overflow: hidden; }
    .dist-fill { height: 100%; display: flex; align-items: center; padding-left: 8px; font-size: .7rem; font-weight: 800; color: #0a1929; }
    .dist-fill.buy { background: linear-gradient(90deg, #16c79a, #2ee6a8); }
    .dist-fill.hold { background: linear-gradient(90deg, #d4af37, #f0d47a); }
    .dist-fill.sell { background: linear-gradient(90deg, #ff5252, #ff8a65); }
    .dist-fill.low { background: linear-gradient(90deg, #16c79a, #4dd4ac); }
    .dist-fill.mid { background: linear-gradient(90deg, #d4af37, #ffd966); }
    .dist-fill.high { background: linear-gradient(90deg, #ff9800, #ffc107); }
    .dist-fill.vhigh { background: linear-gradient(90deg, #ff5252, #ff7043); }

    .mini-table { width: 100%; border-collapse: collapse; font-size: .82rem; }
    .mini-table th { background: rgba(212,175,55,.07); color: var(--gold); padding: 9px 10px; text-align: right; font-weight: 800; font-size: .78rem; }
    .mini-table td { padding: 9px 10px; border-bottom: 1px solid rgba(255,255,255,.05); }
    .mini-table tbody tr { cursor: pointer; transition: background .15s; }
    .mini-table tbody tr:hover { background: rgba(255,255,255,.04); }

    .stress-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(160px,1fr)); gap: 9px; }
    .stress-card { background: rgba(255,255,255,.035); border: 1px solid var(--line); border-radius: 12px; padding: 12px; }
    .stress-card .sc-n { font-size: .84rem; font-weight: 800; color: var(--txt); }
    .stress-card .sc-a { font-size: 1.3rem; font-weight: 900; margin-top: 5px; }
    .stress-card .sc-r { font-size: .7rem; color: var(--muted); margin-top: 3px; }
    .stress-card.ok .sc-a { color: var(--sec); }
    .stress-card.weak .sc-a { color: #ff9800; }
    .stress-card.bad .sc-a { color: var(--red2); }

    .bench-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.05); }
    .bench-p { font-size: .82rem; width: 70px; color: var(--txt); font-weight: 700; }
    .bench-m, .bench-t { font-size: .84rem; font-weight: 800; }
    .bench-m { color: var(--muted); }
    .bench-t { color: var(--gold); }
    .bench-a { margin-right: auto; font-weight: 900; font-size: .86rem; }
    .bench-a.pos { color: var(--sec); } .bench-a.neg { color: var(--red2); }

    .dash-loading { padding: 40px; text-align: center; color: var(--muted); }

    .opp-dec.unknown { background: rgba(139,158,176,.18); color: #8b9eb0; }
    .intel-decision.unknown { background: rgba(139,158,176,.14); color: #8b9eb0; border: 1px solid rgba(139,158,176,.3); }
    .strat-verdict.unknown { background: rgba(139,158,176,.14); color: #8b9eb0; }
    .dist-fill.unknown { background: linear-gradient(90deg, #8b9eb0, #a8b8c8); }

    /* ════════════════════════════════════════════════════════
       OCTA v3 — EIGHT ARMS ARCHITECTURE
       One Brain. Eight Arms. Infinite Opportunities.
       ════════════════════════════════════════════════════════ */

    /* ── Chapter Head — ترويسة الفصل: الهيدر الرئيسي ── */
    .octa-topbar {
      position: sticky; top: 0; z-index: 60;
      background: linear-gradient(180deg, rgba(10,25,41,.98) 0%, rgba(10,25,41,.94) 100%);
      backdrop-filter: blur(18px);
      border-bottom: 1px solid var(--line);
    }
    .octa-brand {
      display: flex; align-items: center; justify-content: space-between;
      gap: 16px; padding: 14px 22px;
      max-width: 1400px; margin: 0 auto;
    }
    .octa-logo { display: flex; align-items: center; gap: 11px; }
    .octa-mark {
      width: 42px; height: 42px; display: grid; place-items: center;
      font-size: 1.5rem; flex-shrink: 0;
      background: radial-gradient(circle at 35% 30%, rgba(212,175,55,.28), transparent 70%);
      border-radius: 12px;
    }
    .octa-wordmark { display: flex; flex-direction: column; line-height: 1.1; }
    .octa-wordmark .w1 {
      font-size: 1.45rem; font-weight: 900; letter-spacing: 3px;
      background: linear-gradient(135deg, #f5d76e, #d4af37 60%, #b8912f);
      -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    }
    .octa-wordmark .w2 { font-size: .62rem; color: var(--muted); letter-spacing: 1.2px; }
    .octa-brand-right { display: flex; align-items: center; gap: 10px; }
    .octa-clock {
      font-size: .74rem; color: var(--muted); text-align: left;
      padding: 6px 12px; background: rgba(255,255,255,.04);
      border: 1px solid var(--line); border-radius: 9px;
    }
    .octa-clock b { color: var(--gold); display: block; font-size: .82rem; }
    .theme-toggle {
      width: 38px; height: 38px; border-radius: 11px; cursor: pointer;
      background: rgba(255,255,255,.05); border: 1px solid var(--line);
      color: var(--gold); font-size: 1rem; display: grid; place-items: center;
      transition: all .2s;
    }
    .theme-toggle:hover { background: rgba(212,175,55,.16); border-color: rgba(212,175,55,.4); }

    /* ── الأذرع الثمانية ── */
    /* ══════════ الأذرع الثمانية — نظيف وواضح ══════════ */
    .arms-bar {
      max-width: 1400px; margin: 0 auto; padding: 0 16px 12px;
      display: grid; grid-template-columns: repeat(8, 1fr); gap: 8px;
    }
    @media (max-width: 760px) {
      .arms-bar { grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 0 12px 10px; }
    }
    .arm-btn {
      position: relative; display: flex; flex-direction: column; align-items: center;
      gap: 6px; padding: 12px 8px 10px; border-radius: 14px; cursor: pointer;
      background: rgba(255,255,255,.028); border: 1px solid transparent;
      color: var(--muted); font-family: inherit; font-weight: 800;
      transition: all .22s cubic-bezier(.4,0,.2,1); overflow: hidden;
    }
    .arm-btn .a-ico { font-size: 1.35rem; line-height: 1; transition: transform .22s; }
    .arm-btn .a-name { font-size: .82rem; line-height: 1.3; letter-spacing: .1px; white-space: nowrap; }
    .arm-btn .a-num {
      position: absolute; top: 6px; right: 8px;
      min-width: 15px; height: 15px; line-height: 15px; text-align: center;
      border-radius: 8px; font-size: .58rem; font-weight: 900;
      color: var(--gold); background: rgba(212,175,55,.16); opacity: .9;
    }
    .arm-btn:hover {
      background: rgba(212,175,55,.10); color: var(--txt);
      border-color: rgba(212,175,55,.32); transform: translateY(-2px);
    }
    .arm-btn:hover .a-ico { transform: scale(1.16); }
    .arm-btn.active {
      background: linear-gradient(145deg, rgba(212,175,55,.22), rgba(212,175,55,.08));
      border-color: rgba(212,175,55,.55); color: var(--gold2);
      box-shadow: 0 5px 18px rgba(212,175,55,.16), inset 0 1px 0 rgba(255,255,255,.08);
    }
    .arm-btn.active .a-name { color: var(--gold2); font-weight: 900; }
    .arm-btn.active::after {
      content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
      width: 28px; height: 3px; border-radius: 2px 2px 0 0; background: var(--gold);
    }

    /* ── التنبيه التعليمي ── */
    .edu-banner {
      max-width: 1400px; margin: 0 auto 16px; padding: 0 22px;
    }
    .edu-inner {
      display: flex; gap: 12px; align-items: flex-start;
      background: linear-gradient(135deg, rgba(212,175,55,.09), rgba(212,175,55,.03));
      border: 1px solid rgba(212,175,55,.26);
      border-left: 3px solid var(--gold);
      border-radius: 13px; padding: 14px 17px;
    }
    .edu-icon { font-size: 1.25rem; flex-shrink: 0; line-height: 1.35; }
    .edu-text { font-size: .8rem; color: var(--txt); line-height: 1.75; }
    .edu-text b { color: var(--gold); font-weight: 800; }
    .edu-text .edu-h {
      display: block; color: var(--gold); font-weight: 800; font-size: .84rem;
      margin-bottom: 5px; letter-spacing: .3px;
    }
    .edu-toggle {
      background: none; border: none; color: var(--gold); font-size: .74rem;
      cursor: pointer; margin-top: 7px; font-weight: 700; font-family: inherit;
      text-decoration: underline; text-underline-offset: 3px;
    }
    .edu-more { display: none; margin-top: 9px; padding-top: 9px; border-top: 1px solid rgba(212,175,55,.18); }
    .edu-more.open { display: block; }
    .edu-more li { font-size: .78rem; color: var(--muted); margin-bottom: 5px; line-height: 1.7; }

    /* ── Radar للأذرع في الـ Home ── */
    .arms-radar {
      display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;
    }
    .radar-card {
      background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
      border: 1px solid var(--line); border-radius: 15px; padding: 15px;
      cursor: pointer; transition: all .25s cubic-bezier(.4,0,.2,1);
      position: relative; overflow: hidden;
    }
    .radar-card::before {
      content: ''; position: absolute; inset: 0; opacity: 0;
      background: radial-gradient(circle at 85% 12%, rgba(212,175,55,.15), transparent 62%);
      transition: opacity .25s;
    }
    .radar-card:hover { border-color: rgba(212,175,55,.4); transform: translateY(-3px); box-shadow: 0 10px 28px rgba(0,0,0,.35); }
    .radar-card:hover::before { opacity: 1; }
    .radar-card .r-ico { font-size: 1.6rem; margin-bottom: 9px; display: block; }
    .radar-card .r-num {
      position: absolute; top: 12px; left: 14px;
      font-size: 1.5rem; font-weight: 900; color: rgba(212,175,55,.2);
    }
    .radar-card h4 { font-size: .95rem; color: var(--txt); font-weight: 800; margin-bottom: 4px; position: relative; }
    .radar-card p { font-size: .76rem; color: var(--muted); line-height: 1.65; position: relative; }
    .radar-card .r-stat {
      display: flex; gap: 8px; margin-top: 10px; padding-top: 10px;
      border-top: 1px solid rgba(255,255,255,.07); position: relative;
    }
    .radar-card .r-stat span {
      font-size: .7rem; color: var(--muted);
      padding: 3px 8px; background: rgba(255,255,255,.05); border-radius: 6px;
    }

    /* ── Light theme ── */
    /* (كتلة body.light-mode القديمة اتشالت — النظام الموحد body.light في آخر الملف) */


    /* ══════ كل ذراع takes her color ══════ */
    .arm-btn[data-arm="market"]      { --ac: #38bdf8; }
    .arm-btn[data-arm="technical"]   { --ac: #22c55e; }
    .arm-btn[data-arm="fundamental"] { --ac: #d4af37; }
    .arm-btn[data-arm="liquidity"]   { --ac: #06b6d4; }
    .arm-btn[data-arm="news"]        { --ac: #a855f7; }
    .arm-btn[data-arm="risk"]        { --ac: #ef4444; }
    .arm-btn[data-arm="portfolio"]   { --ac: #8b5cf6; }
    .arm-btn[data-arm="opportunity"] { --ac: #f59e0b; }
    .arm-btn.active {
      background: color-mix(in srgb, var(--ac) 16%, transparent);
      border-color: color-mix(in srgb, var(--ac) 55%, transparent);
      color: var(--ac);
      box-shadow: 0 5px 18px color-mix(in srgb, var(--ac) 16%, transparent);
    }
    .arm-btn.active::after { background: var(--ac); }
    .arm-btn:hover { border-color: color-mix(in srgb, var(--ac) 35%, transparent); }
    .arm-btn .a-ico { filter: grayscale(.4); transition: filter .22s, transform .22s; }
    .arm-btn.active .a-ico { filter: none; transform: scale(1.12); }
    .arm-btn:hover .a-ico { filter: none; }

    /* ── شاشة الذراع ── */
    .arm-view { max-width: 1400px; margin: 0 auto; padding: 0 22px 40px; }
    .arm-hero {
      border-radius: 18px; padding: 26px; margin-bottom: 22px;
      border: 1px solid var(--line); position: relative; overflow: hidden;
      background: linear-gradient(135deg, color-mix(in srgb, var(--ac) 12%, transparent), transparent 70%);
    }
    .arm-hero .ah-q {
      font-size: 1.6rem; font-weight: 900; color: var(--ac); margin-bottom: 8px;
      line-height: 1.35; position: relative;
    }
    .arm-hero .ah-lead { font-size: .84rem; color: var(--muted); position: relative; }
    .arm-hero .ah-ico {
      position: absolute; top: -18px; left: -14px; font-size: 7rem;
      opacity: .06; pointer-events: none;
    }
    .arm-stats {
      display: grid; grid-template-columns: repeat(auto-fit, minmax(135px,1fr));
      gap: 10px; margin-bottom: 22px;
    }
    .arm-stat {
      background: rgba(255,255,255,.04); border: 1px solid var(--line);
      border-radius: 13px; padding: 13px; text-align: center;
    }
    .arm-stat .as-v { font-size: 1.5rem; font-weight: 900; color: var(--ac); line-height: 1.15; }
    .arm-stat .as-l { font-size: .7rem; color: var(--muted); margin-top: 4px; }
    .arm-sect { margin-bottom: 24px; }
    .arm-sect-h {
      display: flex; align-items: center; gap: 9px; margin-bottom: 13px;
      font-size: 1rem; font-weight: 800; color: var(--ac);
    }
    .arm-sect-h small { font-size: .74rem; color: var(--muted); font-weight: 500; }


    /* ══════ STOCK INTELLIGENCE PAGE ══════ */
    .si-wrap { max-width: 1400px; margin: 0 auto; padding: 0 22px 50px; }
    .si-wrap.active { display: block !important; }

    /* Hero */
    .si-hero {
      border-radius: 20px; padding: 24px; margin-bottom: 18px;
      border: 1px solid var(--line); position: relative; overflow: hidden;
      background: linear-gradient(135deg, rgba(212,175,55,.11), rgba(16,42,67,.35));
    }
    .si-hero::before {
      content: ''; position: absolute; top: -60%; right: -8%;
      width: 380px; height: 380px; border-radius: 50%;
      background: radial-gradient(circle, rgba(212,175,55,.12), transparent 68%);
    }
    .si-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; flex-wrap: wrap; position: relative; }
    .si-id { display: flex; align-items: center; gap: 13px; }
    .si-badge {
      width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center;
      font-size: 1.6rem; font-weight: 900; color: var(--gold);
      background: rgba(212,175,55,.13); border: 1px solid rgba(212,175,55,.3);
    }
    .si-code { font-size: 1.7rem; font-weight: 900; color: var(--txt); letter-spacing: 1px; line-height: 1.1; }
    .si-name { font-size: .96rem; color: var(--txt); margin-top: 3px; }
    .si-tags { display: flex; gap: 6px; margin-top: 7px; flex-wrap: wrap; }
    .si-tag {
      font-size: .68rem; padding: 3px 10px; border-radius: 7px; font-weight: 700;
      background: rgba(255,255,255,.055); border: 1px solid var(--line); color: var(--muted);
    }
    .si-tag.sector { background: rgba(212,175,55,.13); border-color: rgba(212,175,55,.3); color: var(--gold); }

    .si-price-box { text-align: left; }
    .si-price { font-size: 2.6rem; font-weight: 900; line-height: 1.05; letter-spacing: -1.2px; }
    .si-price.pos { color: var(--sec); } .si-price.neg { color: var(--red2); }
    .si-chg {
      display: inline-flex; align-items: center; gap: 5px; margin-top: 6px;
      padding: 5px 13px; border-radius: 9px; font-weight: 800; font-size: .9rem;
    }
    .si-chg.pos { background: rgba(22,199,154,.15); color: var(--sec); }
    .si-chg.neg { background: rgba(255,82,82,.15); color: var(--red2); }

    /* 3 score cards */
    .si-scores { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap: 12px; margin: 20px 0; position: relative; }
    .si-score {
      text-align: center; padding: 17px; border-radius: 15px;
      border: 1px solid var(--line); background: rgba(255,255,255,.04);
    }
    .si-score .sv { font-size: 2.2rem; font-weight: 900; line-height: 1; }
    .si-score .sl { font-size: .74rem; color: var(--muted); margin-top: 6px; }
    .si-score.final  { border-color: rgba(212,175,55,.34); }
    .si-score.final .sv { color: var(--gold); }
    .si-score.conf   { border-color: rgba(22,199,154,.3); }
    .si-score.conf .sv { color: var(--sec); }
    .si-score.dec    { border-color: rgba(139,158,176,.3); }
    .si-score.dec .sv { font-size: 1.3rem; padding: .45rem 0; }
    .si-score.dec.buy .sv { color: var(--sec); }
    .si-score.dec.hold .sv { color: var(--gold); }
    .si-score.dec.sell .sv { color: var(--red2); }
    .si-score.dec.unknown .sv { color: var(--muted); }

    /* Tabs */
    .si-tabs { display: flex; gap: 5px; margin-bottom: 18px; flex-wrap: wrap; border-bottom: 1px solid var(--line); padding-bottom: 0; }
    .si-tab {
      padding: 10px 18px; background: none; border: none; cursor: pointer;
      color: var(--muted); font-family: inherit; font-weight: 700; font-size: .86rem;
      border-bottom: 2.5px solid transparent; transition: all .2s;
    }
    .si-tab:hover { color: var(--txt); }
    .si-tab.active { color: var(--gold); border-bottom-color: var(--gold); }
    .si-panel { display: none; }
    .si-panel.active { display: block; }

    /* Chart */
    .si-chart-box {
      background: rgba(255,255,255,.03); border: 1px solid var(--line);
      border-radius: 15px; padding: 16px; margin-bottom: 16px;
    }
    .si-tf { display: flex; gap: 5px; margin-bottom: 13px; flex-wrap: wrap; }
    .si-tf button {
      padding: 6px 13px; background: rgba(255,255,255,.045); border: 1px solid var(--line);
      border-radius: 8px; color: var(--muted); font-family: inherit; font-size: .76rem;
      cursor: pointer; font-weight: 700; transition: all .18s;
    }
    .si-tf button.on { background: var(--gold); color: #0a1929; border-color: var(--gold); }
    .si-chart-sym { font-size: 1.5rem; font-weight: 900; color: var(--txt); }

    /* Sections */
    .si-sect { margin-bottom: 18px; }
    .si-sect-h {
      display: flex; align-items: center; gap: 8px; margin-bottom: 12px;
      font-size: .98rem; font-weight: 800; color: var(--gold);
    }
    .si-sect-h small { font-size: .74rem; color: var(--muted); font-weight: 500; }

    /* Axis grid */
    .si-axes { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 10px; }
    .si-axis {
      background: rgba(255,255,255,.035); border: 1px solid var(--line);
      border-radius: 13px; padding: 14px; cursor: pointer; transition: all .2s;
    }
    .si-axis:hover { border-color: rgba(212,175,55,.35); }
    .si-axis .ax-n { font-size: .76rem; color: var(--muted); margin-bottom: 7px; }
    .si-axis .ax-v { font-size: 1.5rem; font-weight: 900; color: var(--gold); line-height: 1; }
    .si-axis .ax-b { height: 5px; background: rgba(255,255,255,.07); border-radius: 3px; margin-top: 9px; overflow: hidden; }
    .si-axis .ax-b i { display: block; height: 100%; background: linear-gradient(90deg,var(--sec),var(--gold)); }
    .si-axis.na { opacity: .55; }
    .si-axis.na .ax-v { color: var(--muted); }

    /* Why box */
    .si-why {
      background: linear-gradient(135deg, rgba(212,175,55,.07), transparent);
      border: 1px solid rgba(212,175,55,.24); border-radius: 14px; padding: 17px;
    }
    .si-why-h { font-size: .95rem; font-weight: 800; color: var(--gold); margin-bottom: 11px; }
    .si-facts { display: flex; flex-direction: column; gap: 8px; }
    .si-fact {
      display: flex; gap: 9px; font-size: .84rem; line-height: 1.65; color: var(--txt);
      padding: 8px 11px; background: rgba(255,255,255,.03); border-radius: 9px;
    }
    .si-fact.pos { border-right: 2.5px solid var(--sec); }
    .si-fact.neg { border-right: 2.5px solid var(--red2); }
    .si-fact.neu { border-right: 2.5px solid var(--muted); }
    .si-fact .fi { flex-shrink: 0; }
    .si-src { font-size: .66rem; color: var(--muted); opacity: .75; }

    /* News */
    .si-news { display: flex; flex-direction: column; gap: 10px; }
    .si-news-item {
      background: rgba(255,255,255,.035); border: 1px solid var(--line);
      border-radius: 12px; padding: 14px; border-right: 3px solid var(--gold);
    }
    .si-news-item.upcoming { border-right-color: var(--sec); }
    .si-news-date { font-size: .72rem; color: var(--gold); font-weight: 800; }
    .si-news-title { font-size: .88rem; color: var(--txt); margin-top: 5px; font-weight: 700; }
    .si-news-meta { font-size: .74rem; color: var(--muted); margin-top: 6px; display: flex; gap: 10px; flex-wrap: wrap; }
    .si-news-src { color: var(--muted); }

    /* Empty / loading */
    .si-empty { padding: 30px; text-align: center; color: var(--muted); font-size: .88rem; }
    .si-load { padding: 60px; text-align: center; color: var(--muted); }

    @media (max-width: 640px) {
      .si-hero { padding: 18px; }
      .si-price { font-size: 2rem; }
      .si-code { font-size: 1.35rem; }
      .si-tab { padding: 8px 12px; font-size: .78rem; }
    }


    /* ══════ REDUNDANCY AUDIT PAGE ══════ */
    .aud-wrap { max-width: 1400px; margin: 0 auto; padding: 0 22px 50px; }
    .aud-hero {
      border-radius: 18px; padding: 24px; margin-bottom: 20px;
      border: 1px solid rgba(255,82,82,.3);
      background: linear-gradient(135deg, rgba(255,82,82,.1), transparent 70%);
    }
    .aud-hero h2 { color: var(--red2); font-size: 1.4rem; margin-bottom: 8px; }
    .aud-hero p { color: var(--muted); font-size: .86rem; }

    .aud-sect { margin-bottom: 24px; }
    .aud-h {
      font-size: 1rem; font-weight: 800; color: var(--gold);
      margin-bottom: 12px; padding-bottom: 8px;
      border-bottom: 1px solid var(--line);
    }
    .aud-item {
      background: rgba(255,255,255,.035); border: 1px solid var(--line);
      border-radius: 13px; padding: 15px; margin-bottom: 10px;
      border-right: 3px solid var(--muted);
    }
    .aud-item.high { border-right-color: var(--red2); }
    .aud-item.medium { border-right-color: #ff9800; }
    .aud-item.low { border-right-color: var(--sec); }
    .aud-item-t { font-size: .94rem; font-weight: 800; color: var(--txt); margin-bottom: 7px; }
    .aud-locs { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 8px; }
    .aud-loc {
      font-size: .68rem; padding: 2px 8px; border-radius: 5px;
      background: rgba(255,255,255,.06); color: var(--muted);
      font-family: 'Courier New', monospace;
    }
    .aud-fix { font-size: .82rem; color: var(--sec); }
    .aud-sev {
      display: inline-block; padding: 2px 9px; border-radius: 6px;
      font-size: .66rem; font-weight: 800; margin-left: 7px;
    }
    .aud-sev.high { background: rgba(255,82,82,.2); color: var(--red2); }
    .aud-sev.medium { background: rgba(255,152,0,.2); color: #ff9800; }
    .aud-sev.low { background: rgba(22,199,154,.2); color: var(--sec); }

    .aud-bar-row { display: grid; grid-template-columns: 140px 1fr 60px; gap: 10px; align-items: center; margin-bottom: 8px; }
    .aud-bar-l { font-size: .8rem; color: var(--txt); }
    .aud-bar-t { height: 8px; background: rgba(255,255,255,.07); border-radius: 4px; overflow: hidden; }
    .aud-bar-f { height: 100%; background: linear-gradient(90deg, var(--sec), var(--gold)); }
    .aud-bar-v { font-size: .8rem; color: var(--gold); font-weight: 800; }


    /* ══════ SMART SEARCH ══════ */
    .smart-search { position: relative; margin-bottom: 22px; max-width: 720px; }
    .ss-input-wrap {
      display: flex; align-items: center; gap: 11px;
      background: rgba(255,255,255,.05); border: 1px solid var(--line);
      border-radius: 15px; padding: 14px 18px; transition: all .2s;
    }
    .ss-input-wrap:focus-within {
      border-color: var(--gold); background: rgba(212,175,55,.06);
      box-shadow: 0 0 0 3px rgba(212,175,55,.09);
    }
    .ss-ico { font-size: 1.2rem; }
    .ss-input {
      flex: 1; background: none; border: none; outline: none;
      color: var(--txt); font-size: 1rem; font-family: inherit;
    }
    .ss-input::placeholder { color: var(--muted); }
    .ss-hint { font-size: .7rem; color: var(--muted); }
    .ss-results {
      position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 50;
      background: var(--pri2, #102a43); border: 1px solid var(--line);
      border-radius: 14px; overflow: hidden; display: none;
      box-shadow: 0 14px 40px rgba(0,0,0,.5); max-height: 380px; overflow-y: auto;
    }
    .ss-results.open { display: block; }
    .ss-row {
      display: flex; align-items: center; gap: 11px; padding: 11px 15px;
      cursor: pointer; border-bottom: 1px solid rgba(255,255,255,.05);
      transition: background .12s;
    }
    .ss-row:hover, .ss-row.sel { background: rgba(212,175,55,.1); }
    .ss-badge {
      width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center;
      font-size: .72rem; font-weight: 900; color: var(--gold);
      background: rgba(212,175,55,.13); border: 1px solid rgba(212,175,55,.28); flex-shrink: 0;
    }
    .ss-info { flex: 1; min-width: 0; }
    .ss-code { font-size: .88rem; font-weight: 800; color: var(--txt); }
    .ss-name { font-size: .74rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .ss-price { text-align: left; }
    .ss-p { font-size: .88rem; font-weight: 800; }
    .ss-c { font-size: .7rem; font-weight: 700; }
    .ss-empty { padding: 18px; text-align: center; color: var(--muted); font-size: .84rem; }


    /* 📰 أخبار حية + المعادلة + المساهمات */
    .si-live { display: flex; flex-direction: column; gap: 8px; }
    .si-nws-item { display: block; padding: 12px 14px; border-radius: 12px; text-decoration: none;
      background: rgba(255,255,255,.03); border: 1px solid var(--line); transition: all .18s; }
    .si-nws-item:hover { background: rgba(212,175,55,.1); border-color: rgba(212,175,55,.4); transform: translateX(-3px); }
    .si-nws-t { font-size: .86rem; color: var(--txt); font-weight: 700; line-height: 1.65; }
    .si-nws-m { font-size: .68rem; color: var(--muted); margin-top: 5px; }
    .si-nws-h { font-size: .78rem; font-weight: 900; color: var(--gold); margin: 4px 0 10px;
      padding-bottom: 6px; border-bottom: 1px solid var(--line); }
    .si-load2 { padding: 26px; text-align: center; color: var(--muted); font-size: .84rem; }
    .si-formula { background: rgba(0,0,0,.28); border: 1px solid var(--line); border-radius: 12px;
      padding: 14px 16px; direction: ltr; text-align: center; }
    .si-formula code { font-size: 1.02rem; color: var(--gold2); font-weight: 900; letter-spacing: .5px;
      font-family: 'SF Mono', Consolas, monospace; }
    body.light .si-formula { background:#f7f9fc; }
    .si-stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin-top: 11px; }
    .si-stats > div { background: rgba(255,255,255,.03); border: 1px solid var(--line); border-radius: 11px;
      padding: 11px 8px; text-align: center; }
    .si-stats span { display: block; font-size: .65rem; color: var(--muted); margin-bottom: 5px; }
    .si-stats b { font-size: 1.05rem; font-weight: 900; color: var(--txt); }
    @media (max-width:560px){ .si-stats { grid-template-columns: repeat(2,1fr); } }
    .si-contrib { display: flex; flex-direction: column; gap: 9px; }
    .si-c-row { display: grid; grid-template-columns: 92px 1fr 34px; gap: 9px; align-items: center;
      border-bottom: 1px solid var(--line); padding-bottom: 8px; margin-bottom: 4px; }
    .si-c-n { font-size: .78rem; font-weight: 700; color: var(--txt); }
    .si-c-t { height: 8px; background: rgba(255,255,255,.06); border-radius: 4px; overflow: hidden; }
    .si-c-t i { display: block; height: 100%; border-radius: 4px; }
    .si-c-v { font-size: .78rem; font-weight: 900; text-align: center; }
    .si-c-w { grid-column: 1 / -1; font-size: .66rem; color: var(--muted); margin-top: -4px; }
    body.light .si-stats > div, body.light .si-c-t, body.light .si-nws-item, body.light .si-load2 { background:#f7f9fc; }

    /* ══════════ 📊 عمق السوق + التنفيذات ══════════ */
    .ob-key {
      display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
      background: rgba(255,255,255,.035); border: 1px solid var(--line);
      border-radius: 13px; padding: 12px 14px; margin-bottom: 14px;
    }
    .ob-key input { flex: 1; min-width: 190px; padding: 11px 14px; border-radius: 11px;
      background: rgba(0,0,0,.25); border: 1px solid var(--line); color: var(--txt);
      font-family: inherit; font-size: .86rem; outline: none; direction: ltr; text-align: left; }
    .ob-key input:focus { border-color: var(--gold); }
    .ob-key button { padding: 11px 20px; border-radius: 11px; font-family: inherit; font-size: .84rem;
      font-weight: 800; cursor: pointer; border: none;
      background: linear-gradient(135deg,#d4af37,#f4d03f); color: #0a1929; }
    .ob-key .ob-demo { background: rgba(255,255,255,.07); border: 1px solid var(--line); color: var(--txt); }
    body.light .ob-key input { background:#fff; }

    .ob-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    @media (max-width:760px){ .ob-wrap { grid-template-columns: 1fr; } }

    .ob-totals { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; }
    .ob-tot { border-radius: 13px; padding: 13px; text-align: center; border: 1px solid var(--line); }
    .ob-tot.ask { background: rgba(255,82,82,.10); border-color: rgba(255,82,82,.28); }
    .ob-tot.bid { background: rgba(22,199,154,.10); border-color: rgba(22,199,154,.28); }
    .ob-tot-v { font-size: 1.35rem; font-weight: 900; line-height: 1.1; }
    .ob-tot.ask .ob-tot-v { color: var(--red2); }
    .ob-tot.bid .ob-tot-v { color: var(--sec); }
    .ob-tot-l { font-size: .7rem; color: var(--muted); margin-top: 4px; }

    .ob-book { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
    .ob-row {
      display: grid; grid-template-columns: 34px 1fr 66px 1fr 66px 34px;
      align-items: center; font-size: .76rem; border-bottom: 1px solid var(--line);
      min-height: 34px; position: relative; direction: ltr;   /* العروض شمال · الطلبات جنوب زي صورة AMOC */
    }
    .ob-row > .cell { direction: rtl; }
    .ob-row:last-child { border-bottom: none; }
    .ob-row.hdr { background: rgba(255,255,255,.03); font-size: .64rem; color: var(--muted); font-weight: 800; }
    .ob-row .cell { padding: 7px 6px; text-align: center; }
    .ob-n { font-size: .68rem; color: var(--muted); font-weight: 700; }
    .ob-q { font-size: .74rem; color: var(--txt); font-weight: 700; }
    .ob-p { font-size: .86rem; font-weight: 900; }
    .ob-p.ask { color: var(--red2); }
    .ob-p.bid { color: var(--sec); }
    .ob-bar { position: absolute; top: 0; bottom: 0; z-index: 0; opacity: .16; }
    .ob-bar.ask { background: linear-gradient(90deg, rgba(255,82,82,.7), rgba(255,82,82,.15)); }
    .ob-bar.bid { background: linear-gradient(270deg, rgba(22,199,154,.7), rgba(22,199,154,.15)); }
    .ob-row > .cell { position: relative; z-index: 1; }
    .ob-mid { display: flex; align-items: center; justify-content: center; gap: 9px;
      padding: 9px; margin: 8px 0; border-radius: 11px; background: rgba(212,175,55,.10);
      border: 1px solid rgba(212,175,55,.3); font-size: .8rem; flex-wrap: wrap; }
    .ob-mid b { font-size: 1.05rem; color: var(--gold2); font-weight: 900; }
    .ob-signal { display: flex; align-items: center; gap: 11px; padding: 13px; border-radius: 13px;
      margin-bottom: 12px; font-size: .84rem; line-height: 1.7; }
    .ob-signal.buy  { background: rgba(22,199,154,.11); border: 1px solid rgba(22,199,154,.32); }
    .ob-signal.sell { background: rgba(255,82,82,.11); border: 1px solid rgba(255,82,82,.32); }
    .ob-signal.neu  { background: rgba(255,255,255,.035); border: 1px solid var(--line); }
    .ob-signal-ico { font-size: 1.5rem; flex-shrink: 0; }
    .ob-trades { border: 1px solid var(--line); border-radius: 13px; overflow: hidden;
      max-height: 380px; overflow-y: auto; }
    .ob-tr { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; padding: 8px 12px;
      font-size: .76rem; border-bottom: 1px solid var(--line); align-items: center; }
    .ob-tr:last-child { border-bottom: none; }
    .ob-tr .up { color: var(--red2); font-weight: 800; }
    .ob-tr .dn { color: var(--sec); font-weight: 800; }
    .ob-tr-t { color: var(--muted); font-size: .66rem; }
    .ob-live { display: inline-flex; align-items: center; gap: 5px; font-size: .64rem; color: var(--muted); }
    .ob-live i { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); display: block; }
    .ob-live.on i { background: var(--sec); animation: obpulse 1s infinite; }
    @keyframes obpulse { 0%,100%{ opacity:1 } 50%{ opacity:.25 } }
    .ob-empty { padding: 26px 16px; text-align: center; color: var(--muted); font-size: .84rem; line-height: 1.9; }
    body.light .ob-row.hdr, body.light .ob-signal.neu { background:#f7f9fc; }
    body.light .ob-bar.ask { background: linear-gradient(90deg, rgba(220,38,38,.5), rgba(220,38,38,.1)); }
    body.light .ob-bar.bid { background: linear-gradient(270deg, rgba(5,150,105,.5), rgba(5,150,105,.1)); }
    body.light .ob-mid { background:#fffbeb; border-color:rgba(154,123,24,.35); }


    /* ══════════════════════════════════════════════════════════════
       📱 الموبايل — تصميم مختلف تماماً
       الهيدر كان بياخد 36% من الشاشة → ضغطناه لـ ~150px + إخفاء تلقائي
       ══════════════════════════════════════════════════════════════ */
    @media (max-width: 760px) {

      /* ① الهيدر — سياسات أفقية — صف واحد */
      .octa-brand { padding: 7px 12px; gap: 8px; }
      .octa-logo { gap: 6px !important; }
      .octa-logo .octa-mark { width: 30px !important; height: 30px !important; font-size: 1rem !important;
        border-radius: 9px !important; line-height: 1; }
      .octa-logo:hover .octa-mark { transform: none; }
      .octa-wordmark .w1 { font-size: 1.05rem; }
      .octa-wordmark .w2 { display: none; }          /* الوصف الإنجليزي */
      .octa-clock { display: none; }                  /* كارت الساعة */
      .theme-toggle { width: 34px; height: 34px; font-size: .92rem; }
      .top-bar { display: none !important; }          /* الشريط القديم المكرر */

      /* ② الأذرع — صف أفقي واحد قابل للسحب */
      .arms-bar {
        display: flex !important; gap: 6px; padding: 4px 12px 6px !important;
        overflow-x: auto; scroll-snap-type: x proximity;
        scrollbar-width: none; -ms-overflow-style: none;
      }
      .arms-bar::-webkit-scrollbar { display: none; }
      .arm-btn {
        flex: 0 0 auto; scroll-snap-align: start;
        flex-direction: row; gap: 6px; padding: 7px 11px; min-width: 0;
        border-radius: 11px;
      }
      .arm-btn .a-ico { font-size: 1.02rem; }
      .arm-btn .a-name { font-size: .72rem; }
      .arm-btn .a-num {
        position: static; min-width: 14px; height: 14px; line-height: 14px;
        font-size: .52rem; background: rgba(212,175,55,.16);
      }
      .arm-btn:hover { transform: none; }

      /* ③ شريط الأدوات — ينطوي ورا زرار */
      .toolbar-wrap {
        padding: 0; border-top: 1px solid var(--line); position: relative;
        display: flex; flex-direction: column;   /* عمودي عشان الزرار مغطيّش الأزرار */
      }
      .m-tools-btn { display: grid !important; position: static; order: 1;
        width: auto; margin: 6px 12px; height: 30px; }
      .toolbar {
        max-height: 0; overflow: hidden; padding: 0 !important; order: 2;
        transition: max-height .28s cubic-bezier(.4,0,.2,1);
      }
      body.m-tools-open .toolbar {
        max-height: 140px; overflow-x: auto; overflow-y: auto; padding: 2px 12px 8px !important;
      }
      .tool-cfg { display: none !important; }
      .tool-btn { padding: 7px 12px; font-size: .76rem; }

      /* ④ إخفاء تلقائي عند النزول */
      .octa-topbar.hide-top { transform: translateY(-100%); }
      .octa-topbar { transition: transform .25s cubic-bezier(.4,0,.2,1); }
      .m-scrim { display: none; position: fixed; inset: 0; background: rgba(4,10,18,.5); z-index: 55; }
      .m-scrim.on { display: block; }

      /* ⑤ البطاقات — مساحات أوسع */
      .uc-body { padding: 0 13px 13px; }
      .uc { margin-bottom: 9px; }
      .os-top { grid-template-columns: repeat(auto-fill, minmax(142px,1fr)); gap: 9px; }
      .os-card { padding: 12px 10px; }
      .pt-hero { padding: 16px 14px 14px; }
      .pt-ico { font-size: 1.9rem; }
      .pt-t { font-size: 1.2rem; }
      .pt-s { font-size: .74rem; }
      .si-tabs { overflow-x: auto; scrollbar-width: none; }
      .si-tabs::-webkit-scrollbar { display: none; }
      .si-tab { flex: 0 0 auto; font-size: .74rem; padding: 9px 12px; }
      .ob-row { font-size: .7rem; grid-template-columns: 26px 1fr 56px 1fr 56px 26px; min-height: 30px; }
      .edu-banner { padding: 0 12px; }
      .octa-credit { padding: 0 12px 26px; }
      .oc-own { font-size: .8rem; padding: 9px 14px; }
      .oc-warn { font-size: .68rem; }
    }

    /* زرار فتح شريط الأدوات — مخفي على الديسكتوب */
    .m-tools-btn {
      display: none; width: 100%; height: 30px; border-radius: 9px; cursor: pointer;
      background: rgba(255,255,255,.05); border: 1px solid var(--line);
      color: var(--muted); place-items: center; font-size: .72rem;
    }
    .m-tools-btn::before { content: '🧰 الأدوات والفلاتر'; }
    body.m-tools-open .m-tools-btn::before { content: '✕ إغلاق'; }


    /* ══════════ 📊 صفحة الأسهم — كل البورصة ══════════ */
    .sp-bar { display: flex; gap: 9px; margin-bottom: 12px; align-items: stretch; }
    .sp-search {
      flex: 1; display: flex; align-items: center; gap: 10px;
      background: rgba(255,255,255,.05); border: 1px solid var(--line);
      border-radius: 14px; padding: 4px 16px; transition: all .2s;
    }
    .sp-search:focus-within { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(212,175,55,.1); }
    .sp-search input { flex: 1; background: none; border: none; outline: none; color: var(--txt);
      font-family: inherit; font-size: .94rem; padding: 12px 0; min-width: 0; }
    .sp-search input::placeholder { color: var(--muted); }
    .sp-select {
      padding: 0 12px; border-radius: 14px; background: rgba(255,255,255,.05);
      border: 1px solid var(--line); color: var(--txt); font-family: inherit;
      font-size: .84rem; font-weight: 700; outline: none; cursor: pointer;
    }
    .sp-select option { background: var(--pri2); color: var(--txt); }

    .sp-chips { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 10px; margin-bottom: 6px;
      scrollbar-width: none; -ms-overflow-style: none; }
    .sp-chips::-webkit-scrollbar { display: none; }
    .sp-chip {
      flex: 0 0 auto; padding: 8px 14px; border-radius: 11px; font-family: inherit;
      font-size: .8rem; font-weight: 800; cursor: pointer; white-space: nowrap;
      background: rgba(255,255,255,.05); border: 1px solid var(--line); color: var(--muted);
      transition: all .18s;
    }
    .sp-chip.on { background: linear-gradient(135deg,#d4af37,#f4d03f); color: #0a1929; border-color: #d4af37; }
    .sp-count { font-size: .78rem; color: var(--muted); margin-bottom: 12px; display: flex;
      justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }

    .sp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(268px,1fr)); gap: 10px; }
    .sp-card {
      background: rgba(255,255,255,.032); border: 1px solid var(--line); border-radius: 15px;
      padding: 14px; cursor: pointer; transition: all .2s cubic-bezier(.4,0,.2,1); position: relative; overflow: hidden;
    }
    .sp-card:hover { border-color: rgba(212,175,55,.45); transform: translateY(-2px);
      box-shadow: 0 8px 24px rgba(212,175,55,.12); }
    .sp-r1 { display: flex; align-items: flex-start; gap: 11px; }
    .sp-badge { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center;
      font-size: .74rem; font-weight: 900; color: var(--gold); flex-shrink: 0;
      background: rgba(212,175,55,.13); border: 1px solid rgba(212,175,55,.28); }
    .sp-id { flex: 1; min-width: 0; }
    .sp-code { font-size: .98rem; font-weight: 900; color: var(--txt); letter-spacing: .3px; }
    .sp-name { font-size: .72rem; color: var(--muted); white-space: nowrap; overflow: hidden;
      text-overflow: ellipsis; margin-top: 2px; }
    .sp-sect { display: inline-block; font-size: .62rem; color: var(--gold); margin-top: 5px;
      background: rgba(212,175,55,.11); border-radius: 6px; padding: 2px 8px; }
    .sp-px { text-align: left; flex-shrink: 0; }
    .sp-p { font-size: 1.05rem; font-weight: 900; color: var(--txt); line-height: 1.1; }
    .sp-c { font-size: .74rem; font-weight: 800; margin-top: 3px; }
    .sp-c.up { color: var(--sec); } .sp-c.down { color: var(--red2); }
    .sp-r2 { display: flex; gap: 6px; margin-top: 11px; flex-wrap: wrap; }
    .sp-m { font-size: .64rem; color: var(--muted); background: rgba(255,255,255,.04);
      border-radius: 7px; padding: 4px 8px; white-space: nowrap; }
    .sp-m b { color: var(--txt); font-weight: 800; }
    .sp-m.calc { color: var(--gold); }
    .sp-r3 { display: flex; align-items: center; gap: 8px; margin-top: 11px;
      border-top: 1px solid var(--line); padding-top: 10px; }
    .sp-sc { font-size: 1.25rem; font-weight: 900; line-height: 1; min-width: 34px; }
    .sp-dec { font-size: .68rem; font-weight: 800; padding: 4px 10px; border-radius: 8px; }
    .sp-bar2 { flex: 1; height: 6px; background: rgba(255,255,255,.06); border-radius: 3px; overflow: hidden; }
    .sp-bar2 i { display: block; height: 100%; border-radius: 3px; }
    .sp-empty { grid-column: 1/-1; padding: 44px 16px; text-align: center; color: var(--muted);
      font-size: .88rem; line-height: 1.9; }
    .sp-load { grid-column: 1/-1; padding: 40px; text-align: center; color: var(--muted); }
    body.light .sp-card, body.light .sp-search, body.light .sp-select,
    body.light .sp-chip, body.light .sp-m { background:#fff; border-color:var(--line); }
    body.light .sp-bar2 { background:#eef2f7; }
    body.light .sp-card:hover { border-color:#d4af37; box-shadow:0 6px 20px rgba(154,123,24,.14); }
    body.light .sp-chip.on { background:linear-gradient(135deg,#b8912f,#d4af37); color:#fff; }
    @media (max-width:760px){
      .sp-bar { flex-wrap: wrap; }
      .sp-search { flex: 1 1 100%; }
      .sp-select { flex: 1; padding: 11px 10px; }
      .sp-grid { grid-template-columns: 1fr; }
      .sp-card { padding: 12px; }
    }




    /* ═══تحسين الأخضر على الداكن — تباين مريح للعين ═══ */
    :root, body.dark { --secTxt:#3fe0b0; }
    body.light { --secTxt:#046b4e; }
    .dv-kpi.dv-good .dv-kpi-v { color: var(--secTxt); }
    .dv-tag.up { background: rgba(63,224,176,.16); color: var(--secTxt); border-color: rgba(63,224,176,.3); }
    .dv-badge.up { background: rgba(63,224,176,.16); color: var(--secTxt); border-color: rgba(63,224,176,.3); }
    .dv-kpi.dv-good { border-color: rgba(63,224,176,.28); }

    /* ═══ ⚡ الكارت المختصر + السيرش ═══ */
    .dv-quik { display:flex; gap:11px; align-items:center; flex-wrap:wrap; margin-bottom:13px; }
    .dv-quik-l { flex:1 1 178px; min-width:0; background:rgba(63,224,176,.09);
      border:1px solid rgba(63,224,176,.3); border-radius:12px; padding:10px 13px; }
    .dv-quik-t { display:block; font-size:.64rem; color:#6ef0c6; font-weight:800; margin-bottom:3px; }
    body.light .dv-quik-t { color:#046b4e; }
    .dv-quik-l b { font-family:ui-monospace,monospace; font-size:.95rem; color:var(--gold);
      display:inline-block; margin-inline-end:6px; }
    .dv-quik-l > span:not(.dv-quik-t) { font-size:.76rem; color:#cfe0ee; }
    body.light .dv-quik-l > span:not(.dv-quik-t) { color:#2a4a60; }
    .dv-quik-l em { display:block; font-style:normal; font-size:.72rem; color:#6ef0c6; margin-top:3px; font-weight:700; }
    body.light .dv-quik-l em { color:#046b4e; }
    .dv-search { position:relative; flex:1 1 190px; }
    .dv-search input { width:100%; padding:11px 36px 11px 14px; border-radius:11px;
      background:rgba(255,255,255,.05); border:1px solid var(--line); color:var(--txt);
      font-family:inherit; font-size:.84rem; }
    .dv-search input::placeholder { color:var(--muted); }
    .dv-search input:focus { outline:none; border-color:var(--gold); }
    .dv-clear { position:absolute; inset-inline-end:8px; top:50%; transform:translateY(-50%);
      background:none; border:none; color:var(--muted); font-size:.9rem; cursor:pointer; padding:3px 6px; }
    .dv-sr { font-size:.76rem; color:var(--gold); margin:0 0 10px; }
    .dv-item.near { background:rgba(63,224,176,.075); border-color:rgba(63,224,176,.3); }
    /* ═══ 📡 الأرقام الحقيقية ═══ */
    .vtech { display:grid; grid-template-columns:repeat(auto-fit,minmax(158px,1fr)); gap:10px; }
    .vtech-i { background:rgba(255,255,255,.04); border:1px solid var(--line);
      border-radius:12px; padding:11px 12px; }
    .vtech-i.good { background:rgba(63,224,176,.09); border-color:rgba(63,224,176,.32); }
    .vtech-i.bad  { background:rgba(255,82,82,.08);  border-color:rgba(255,82,82,.3); }
    .vtech-k { font-size:.66rem; color:var(--muted); }
    .vtech-v { font-size:1.22rem; font-weight:900; color:var(--gold); margin:2px 0 6px; }
    .vtech-i.good .vtech-v { color:#6ef0c6; }
    .vtech-i.bad  .vtech-v { color:var(--red2); }
    .vtech-t { font-size:.73rem; font-weight:800; color:#cfe0ee; line-height:1.7; }
    .vtech-s { font-size:.67rem; color:var(--muted); line-height:1.75; margin-top:4px; }
    body.light .vtech-t { color:#12344b; }
    /* 🆕 شارات الأرقام الحقيقية في كارت السهم */
    .sp-m.ok  { background:rgba(63,224,176,.14); border-color:rgba(63,224,176,.34); color:#6ef0c6; }
    .sp-m.bad { background:rgba(255,82,82,.12);  border-color:rgba(255,82,82,.3);   color:var(--red2); }
    .sp-sep { display:inline-block; width:1px; height:20px; background:var(--line); margin:0 4px; vertical-align:middle; }
    body.light .sp-m.ok  { background:rgba(5,150,105,.12); color:#046b4e; }
    body.light .sp-m.bad { background:rgba(220,38,38,.10); color:#b91c1c; }
    /* ══════════ ⚖️ OCTA Compare ══════════ */
    .cmp-empty { text-align:center; color:var(--muted); padding:44px 16px; font-size:.92rem; }
    .cmp-picks { display:grid; grid-template-columns:repeat(auto-fit,minmax(184px,1fr)); gap:9px; }
    .cmp-slot { position:relative; display:flex; align-items:center; gap:7px; padding:7px 9px;
      background:rgba(255,255,255,.04); border:1px solid var(--line); border-radius:11px; }
    .cmp-slot.on { border-color:var(--slot); }
    .cmp-slot-n { width:20px; height:20px; border-radius:6px; color:#08131f; font-size:.68rem;
      font-weight:900; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .cmp-sel { flex:1; min-width:0; background:transparent; border:none; color:var(--txt);
      font-family:inherit; font-size:.8rem; padding:3px; }
    .cmp-sel option { background:#0d1b2a; color:#e3eaf2; }
    body.light .cmp-sel option { background:#fff; color:#0f1b2b; }
    .cmp-x { background:none; border:none; color:var(--muted); font-size:.85rem; cursor:pointer; padding:2px 4px; }
    .cmp-quick { display:flex; gap:7px; flex-wrap:wrap; margin-top:11px; }
    .cmp-quick .dv-tab { text-decoration:none; }
    .cmp-verdict { background:linear-gradient(135deg, rgba(22,199,154,.14), rgba(212,175,55,.09));
      border:1px solid rgba(212,175,55,.34); border-radius:15px; padding:16px; margin-bottom:18px; }
    .cmp-vtitle { font-size:1.12rem; font-weight:900; color:var(--gold); }
    .cmp-vsub { font-size:.86rem; color:#cfe0ee; margin-top:6px; }
    body.light .cmp-vsub { color:#12344b; }
    .cmp-vnote { font-size:.74rem; color:var(--muted); line-height:1.9; margin-top:9px; }
    .cmp-sec-h { font-size:.92rem; font-weight:900; color:var(--gold); margin:20px 0 10px; }
    .cmp-ranks { display:grid; gap:8px; }
    .cmp-rank { display:grid; grid-template-columns:26px 52px minmax(70px,1.1fr) minmax(60px,1.4fr) 42px 42px;
      gap:7px; align-items:center; padding:9px 11px; border-radius:11px; cursor:pointer;
      background:rgba(255,255,255,.035); border:1px solid var(--line); }
    .cmp-rank.top { border-color:var(--slot); }
    .cmp-rank-n { font-size:1rem; text-align:center; }
    .cmp-rank-c { font-family:ui-monospace,monospace; font-weight:900; font-size:.8rem; color:var(--slot); }
    .cmp-rank-m { font-size:.75rem; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .cmp-rank-b { height:7px; background:rgba(255,255,255,.08); border-radius:4px; overflow:hidden; }
    .cmp-rank-b i { display:block; height:100%; border-radius:4px; }
    .cmp-rank-p { font-size:.77rem; font-weight:900; text-align:center; }
    .cmp-rank-w { font-size:.66rem; text-align:center; color:var(--gold); font-weight:800; }
    .cmp-radarwrap { background:rgba(255,255,255,.03); border:1px solid var(--line); border-radius:14px; padding:12px; }
    .cmp-radar { width:100%; max-width:380px; margin:0 auto; display:block; }
    .cmp-legend { display:flex; gap:12px; flex-wrap:wrap; justify-content:center; margin-top:8px; }
    .cmp-legend span { display:flex; align-items:center; gap:5px; font-size:.75rem; font-weight:800; color:var(--muted); }
    .cmp-legend i { width:10px; height:10px; border-radius:3px; background:var(--slot); }
    .cmp-wgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(128px,1fr)); gap:9px; }
    .cmp-wcell { background:rgba(255,255,255,.04); border:1px solid var(--line); border-left:3px solid var(--slot);
      border-radius:10px; padding:9px 11px; cursor:pointer; display:grid; gap:2px; }
    .cmp-wcell-m { font-size:.66rem; color:var(--muted); }
    .cmp-wcell-c { font-family:ui-monospace,monospace; font-size:.88rem; font-weight:900; color:var(--slot); }
    .cmp-wcell-v { font-size:.78rem; font-weight:800; }
    .cmp-tablewrap { overflow-x:auto; border:1px solid var(--line); border-radius:13px; }
    .cmp-table { width:100%; border-collapse:collapse; font-size:.79rem; min-width:440px; }
    .cmp-table th, .cmp-table td { padding:8px 10px; text-align:center; border-bottom:1px solid var(--line); }
    .cmp-table thead th { background:rgba(255,255,255,.05); font-weight:900; font-size:.76rem; color:var(--slot); }
    .cmp-th { text-align:right !important; font-weight:800; }
    .cmp-th small { display:block; font-size:.61rem; color:var(--muted); font-weight:600; }
    .cmp-table td.win { background:rgba(63,224,176,.13); font-weight:900; }
    body.light .cmp-table td.win { background:rgba(5,150,105,.12); }
    .cmp-table td.na { color:var(--muted); opacity:.5; }
    .cmp-w { font-size:.78rem; }
    .cmp-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:11px; }
    .cmp-card { background:rgba(255,255,255,.04); border:1px solid var(--line);
      border-top:3px solid var(--slot); border-radius:13px; padding:13px; cursor:pointer; }
    .cmp-card:hover { transform:translateY(-2px); border-color:var(--slot); }
    .cmp-card-hd { display:flex; align-items:center; justify-content:space-between; }
    .cmp-card-c { font-family:ui-monospace,monospace; font-size:.95rem; font-weight:900; color:var(--slot); }
    .cmp-card-dot { width:9px; height:9px; border-radius:50%; background:var(--slot); }
    .cmp-card-n { font-size:.8rem; color:var(--txt); margin-top:5px; line-height:1.6; }
    .cmp-card-s { font-size:.67rem; color:var(--muted); margin-top:2px; }
    .cmp-card-pr { display:flex; align-items:baseline; gap:7px; margin-top:9px; }
    .cmp-card-pr b { font-size:1.2rem; font-weight:900; color:var(--gold); }
    .cmp-card-cg { font-size:.75rem; font-weight:800; }
    .cmp-card-cg.up { color:#6ef0c6; } .cmp-card-cg.down { color:var(--red2); }
    body.light .cmp-card-cg.up { color:#046b4e; }
    .cmp-card-d { display:inline-block; font-size:.7rem; font-weight:800; padding:3px 9px; border-radius:7px; margin-top:8px; }
    .cmp-card-prof { display:flex; flex-direction:column; gap:5px; margin-top:10px; }
    .cmp-tag { font-size:.67rem; line-height:1.7; padding:5px 8px; border-radius:8px;
      background:rgba(255,255,255,.045); color:var(--muted); }
    .cmp-tag.good { background:rgba(63,224,176,.12); color:#6ef0c6; }
    .cmp-tag.bad  { background:rgba(255,82,82,.11); color:var(--red2); }
    body.light .cmp-tag.good { background:rgba(5,150,105,.11); color:#046b4e; }
    body.light .cmp-card { background:#fff; }
    body.light .cmp-card-n { color:#0f1b2b; }

    /* ══════════ ⭐ صندوق المرشحين ══════════ */
    .pick-box { background:rgba(255,255,255,.04); border:1px solid var(--line);
      border-radius:15px; padding:14px; margin-bottom:18px; }
    .pick-inputrow { display:flex; align-items:center; gap:9px; }
    .pick-inputrow > span:first-child { font-size:1.05rem; }
    .pick-inputrow input { flex:1; padding:12px 14px; border-radius:11px;
      background:rgba(255,255,255,.06); border:1px solid var(--line); color:var(--txt);
      font-family:inherit; font-size:.95rem; }
    .pick-inputrow input::placeholder { color:var(--muted); }
    .pick-inputrow input:focus { outline:none; border-color:var(--gold);
      box-shadow:0 0 0 3px rgba(212,175,55,.13); }
    .pick-count { font-size:.75rem; font-weight:900; color:var(--gold);
      background:rgba(212,175,55,.15); padding:5px 10px; border-radius:8px; white-space:nowrap; }
    .pick-suggest { display:grid; grid-template-columns:repeat(auto-fit,minmax(168px,1fr));
      gap:8px; margin-top:12px; }
    .pick-sg { display:grid; grid-template-columns:auto 1fr auto; grid-template-rows:auto auto;
      gap:2px 8px; align-items:center; text-align:right; padding:9px 11px; border-radius:11px;
      background:rgba(255,255,255,.04); border:1px solid var(--line); cursor:pointer;
      font-family:inherit; transition:.16s; }
    .pick-sg:hover { border-color:var(--slot); background:color-mix(in srgb, var(--slot) 9%, transparent); }
    .pick-sg.on { border-color:var(--slot); }
    .pick-sg b { grid-row:1/3; font-family:ui-monospace,monospace; font-size:.9rem;
      font-weight:900; color:var(--slot); }
    .pick-sg span { font-size:.74rem; color:var(--muted); overflow:hidden;
      text-overflow:ellipsis; white-space:nowrap; }
    .pick-sg em { font-style:normal; font-size:.72rem; font-weight:900; color:var(--gold); }
    .pick-sg i { grid-column:3; grid-row:2; font-style:normal; font-size:.9rem; color:var(--slot); }
    .pick-none { text-align:center; color:var(--muted); padding:18px; font-size:.85rem; }
    .pick-tools { display:flex; gap:8px; flex-wrap:wrap; margin-top:11px; }
    .pick-tools .dv-tab { text-decoration:none; }
    .pick-empty { text-align:center; color:var(--muted); padding:52px 18px; font-size:.98rem; line-height:2; }
    .pick-empty-sub { display:block; font-size:.78rem; opacity:.75; }

    .pick-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(238px,1fr)); gap:12px; }
    .pick-card { background:rgba(255,255,255,.045); border:1px solid var(--line);
      border-top:3px solid var(--slot); border-radius:14px; padding:13px;
      display:flex; flex-direction:column; gap:5px; }
    .pick-card-hd { display:flex; align-items:center; gap:8px; }
    .pick-n { width:20px; height:20px; border-radius:6px; background:var(--slot); color:#08131f;
      font-size:.68rem; font-weight:900; display:flex; align-items:center; justify-content:center; }
    .pick-code { font-family:ui-monospace,monospace; font-size:1rem; font-weight:900; color:var(--slot); }
        .pick-name { font-size:.85rem; font-weight:800; color:var(--txt); line-height:1.6; }
    body.light .pick-name { color:#0f1b2b; }
    .pick-sect { font-size:.68rem; color:var(--muted); }
    .pick-px { display:flex; align-items:baseline; gap:8px; font-size:1.05rem;
      font-weight:900; color:var(--gold); margin-top:4px; }
    .pick-cg { font-size:.74rem; font-weight:800; }
    .pick-cg.up { color:#6ef0c6; } .pick-cg.down { color:var(--red2); }
    body.light .pick-cg.up { color:#046b4e; }
    .pick-ring { width:62px; height:62px; border-radius:50%; margin:10px auto 6px;
      background:conic-gradient(var(--slot) calc(var(--pct)*1%), rgba(255,255,255,.09) 0);
      display:flex; flex-direction:column; align-items:center; justify-content:center;
      position:relative; }
    .pick-ring::after { content:''; position:absolute; inset:6px; border-radius:50%;
      background:var(--bg-card,#0e2033); }
    body.light .pick-ring::after { background:#fff; }
    .pick-ring b { position:relative; z-index:1; font-size:1.18rem; font-weight:900; color:var(--slot); }
    .pick-ring small { position:relative; z-index:1; font-size:.55rem; color:var(--muted); }
    .pick-dec { text-align:center; font-size:.74rem; font-weight:900; padding:5px;
      border-radius:8px; background:rgba(255,255,255,.06); color:var(--muted); }
    .pick-dec.good { background:rgba(63,224,176,.14); color:#6ef0c6; }
    .pick-dec.bad  { background:rgba(255,82,82,.12);  color:var(--red2); }
    .pick-dec.warn { background:rgba(212,175,55,.14); color:var(--gold); }
    body.light .pick-dec.good { background:rgba(5,150,105,.12); color:#046b4e; }
    body.light .pick-dec.bad  { background:rgba(220,38,38,.1);  color:#b91c1c; }
    body.light .pick-dec.warn { background:rgba(212,175,55,.16); color:#8a6a12; }
    .pick-mets { display:flex; flex-wrap:wrap; gap:5px; margin-top:9px; }
    .pm { font-size:.65rem; padding:4px 7px; border-radius:7px;
      background:rgba(255,255,255,.05); color:var(--muted); }
    .pm b { font-weight:900; color:var(--txt); }
    body.light .pm b { color:#0f1b2b; }
    .pm.ok  { background:rgba(63,224,176,.13); } .pm.ok b  { color:#6ef0c6; }
    .pm.bad { background:rgba(255,82,82,.12); }  .pm.bad b { color:var(--red2); }
    body.light .pm.ok b { color:#046b4e; } body.light .pm.bad b { color:#b91c1c; }
    .pick-why { margin-top:9px; display:flex; flex-direction:column; gap:5px; }
    .pw { font-size:.7rem; line-height:1.75; padding:6px 9px; border-radius:8px;
      background:rgba(255,255,255,.045); color:var(--muted); }
    .pw.good { background:rgba(63,224,176,.1); color:#6ef0c6; }
    .pw.bad  { background:rgba(255,82,82,.1);  color:var(--red2); }
    body.light .pw.good { background:rgba(5,150,105,.1); color:#046b4e; }
    body.light .pw.bad  { background:rgba(220,38,38,.09); color:#b91c1c; }
    .pick-foot { display:flex; align-items:center; gap:9px; margin-top:11px;
      padding-top:9px; border-top:1px dashed var(--line); }
    .pick-foot .dv-tab { text-decoration:none; }
    .pick-when { font-size:.65rem; color:var(--muted); margin-inline-start:auto; }

    .pick-sum { margin-top:20px; background:linear-gradient(135deg, rgba(22,199,154,.12), rgba(212,175,55,.08));
      border:1px solid rgba(212,175,55,.32); border-radius:15px; padding:16px; }
    .pick-sum-h { font-size:1.05rem; font-weight:900; color:var(--gold); margin-bottom:12px; }
    .pick-sum-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px; }
    .psg { background:rgba(255,255,255,.05); border:1px solid var(--line); border-radius:11px;
      padding:11px; cursor:pointer; display:grid; gap:2px; }
    .psg.best { border-color:rgba(63,224,176,.45); background:rgba(63,224,176,.09); }
    .psg span { font-size:.67rem; color:var(--muted); }
    .psg b { font-family:ui-monospace,monospace; font-size:1rem; font-weight:900; color:var(--gold); }
    .psg em { font-style:normal; font-size:.68rem; color:var(--muted); }
    .pick-alloc-h { font-size:.78rem; font-weight:800; color:var(--muted); margin:15px 0 9px; }
    .pick-alloc { display:grid; grid-template-columns:repeat(auto-fit,minmax(112px,1fr)); gap:9px; }
    .pa { background:rgba(255,255,255,.05); border:1px solid var(--line);
      border-left:3px solid var(--slot); border-radius:10px; padding:9px 11px; position:relative; overflow:hidden; }
    .pa span { font-family:ui-monospace,monospace; font-size:.79rem; font-weight:900; color:var(--slot); }
    .pa b { display:block; font-size:1.05rem; font-weight:900; color:var(--gold); margin:2px 0 5px; }
    .pa i { display:block; height:5px; border-radius:3px; background:var(--slot); }
    .pa em { display:block; font-style:normal; font-size:.62rem; color:var(--muted); margin-top:5px; line-height:1.6; }
    .pick-sum-n { font-size:.73rem; color:var(--muted); line-height:1.9; margin-top:13px; }



    /* ➕ جوّه السيرش — زر كبير يتوهّج لما يكون فيه نتيجة */



    /* ═══ 🗂️ صفحة الفلاتر — تبويبات ═══ */
    .fz-wrap { margin-bottom:8px; }
    .fz-tabs { position:sticky; top:0; z-index:20; transition:top .2s; background:var(--bg,#0a1929);
      display:flex; gap:5px; overflow-x:auto; padding-bottom:9px; padding-top:6px;
      border-bottom:2px solid var(--line); margin-bottom:16px;
      scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
    .fz-tabs::-webkit-scrollbar { height:4px; }
    .fz-tabs::-webkit-scrollbar-thumb { background:var(--line); border-radius:4px; }
    .fz-tab { flex-shrink:0; display:flex; align-items:center; gap:8px;
      padding:11px 16px; border-radius:12px 12px 0 0; cursor:pointer;
      font-family:inherit; font-size:.92rem; font-weight:700; white-space:nowrap;
      color:var(--muted); background:transparent; border:0;
      border-bottom:2px solid transparent; margin-bottom:-2px; transition:.15s; }
    .fz-tab:hover { color:var(--txt); background:rgba(255,255,255,.045); }
    .fz-tab.on { color:var(--gold); border-bottom-color:var(--gold);
      background:rgba(212,175,55,.09); }
    /* ⭐ النجمة —.dshتAlways مميزة حتى وهي نشطة */
    .fz-tab.star.on { color:var(--gold); border-bottom-color:var(--gold);
      background:linear-gradient(135deg, rgba(212,175,55,.34), rgba(212,175,55,.12));
      box-shadow:inset 0 1px 0 rgba(212,175,55,.3); font-weight:800; }
    .fz-tab.star.on:hover {
      background:linear-gradient(135deg, rgba(212,175,55,.45), rgba(212,175,55,.16)); }
    body.light .fz-tab.star.on { color:#8a6d12; border-bottom-color:#d4af37;
      background:linear-gradient(135deg,#fffbeb,#fef3c7); }
    .fz-tab-i { font-size:1.15rem; }
    .fz-tab-n { font-variant-numeric:tabular-nums; font-size:.72rem; font-weight:700;
      padding:2px 8px; border-radius:20px; background:rgba(255,255,255,.09); }
    .fz-tab.on .fz-tab-n { background:rgba(212,175,55,.2); }
    .fz-tab.soon { opacity:.5; cursor:default; }
    .fz-tab.soon:hover { background:transparent; color:var(--muted); }
    /* الفاتح */
    body.light .fz-tabs { background:#f4f6f9; }
    body.light .fz-tab:hover { background:#f3f4f6; color:#111827; }
    body.light .fz-tab.on { color:#8a6d12; background:#fffbeb; }
    body.light .fz-tab-n { background:#f3f4f6; }
    body.light .fz-tab.on .fz-tab-n { background:#fef3c7; }



    /* ═══ ⭐ الهيرو — بطاقة بارزة فوق الفلاتر ═══ */
    .fz-hero { margin-bottom:26px; position:relative; }
    .fz-hero-in { position:relative; display:grid; grid-template-columns:1.15fr 1fr; gap:22px;
      padding:24px; border-radius:20px; overflow:hidden;
      background:
        radial-gradient(1000px 400px at 90% -20%, rgba(212,175,55,.16), transparent 65%),
        linear-gradient(135deg, rgba(212,175,55,.10), rgba(255,255,255,.02));
      border:1px solid rgba(212,175,55,.38);
      box-shadow:0 10px 40px -10px rgba(212,175,55,.22); }
    .fz-hero::before { content:''; position:absolute; top:0; right:0; left:0; height:3px;
      background:linear-gradient(90deg, transparent, var(--gold), transparent); }
    @media (max-width:900px){ .fz-hero-in { grid-template-columns:1fr; gap:18px; padding:18px; } }
    .fz-hero-badge { display:inline-flex; align-items:center; gap:6px; font-size:.68rem;
      font-weight:800; padding:4px 11px; border-radius:20px; margin-bottom:11px;
      background:rgba(212,175,55,.18); color:var(--gold); letter-spacing:.03em; }
    .fz-hero-l h2 { margin:0 0 8px; font-size:1.65rem; color:var(--gold); font-weight:800;
      letter-spacing:-.01em; }
    .fz-hero-p { margin:0 0 16px; font-size:.87rem; line-height:1.8; color:var(--muted); max-width:420px; }
    .fz-hero-p b { color:var(--gold); }
    .fz-hero-stats { display:flex; gap:10px; margin-bottom:16px; flex-wrap:wrap; }
    .fz-hero-stats > div { flex:1; min-width:88px; padding:11px 13px; border-radius:12px;
      background:rgba(0,0,0,.16); border:1px solid rgba(212,175,55,.2); }
    .fz-hero-stats b { display:block; font-size:1.42rem; color:var(--gold); font-weight:900; }
    .fz-hero-stats span { font-size:.66rem; color:var(--muted); }
    .fz-hero-btn { display:inline-flex; align-items:center; gap:9px; padding:12px 20px;
      border-radius:12px; cursor:pointer; font-family:inherit; font-size:.85rem; font-weight:800;
      background:linear-gradient(135deg,var(--gold),#b8912f); color:#0a1929; border:0;
      box-shadow:0 4px 14px rgba(212,175,55,.28); transition:.18s; }
    .fz-hero-btn:hover { transform:translateY(-1px);
      box-shadow:0 7px 20px rgba(212,175,55,.4); }
    .fz-hero-btn span { font-size:1.05rem; }
    /* أحسن 3 */
    .fz-hero-r { display:flex; flex-direction:column; gap:8px; }
    .fz-hero-t { font-size:.7rem; font-weight:800; color:var(--gold); margin-bottom:2px;
      letter-spacing:.02em; }
    .fz-hc { display:flex; align-items:center; gap:11px; width:100%; text-align:right;
      padding:10px 13px; border-radius:12px; cursor:pointer; font-family:inherit;
      background:rgba(255,255,255,.045); border:1px solid var(--line); transition:.16s; }
    .fz-hc:hover { background:rgba(212,175,55,.12); border-color:rgba(212,175,55,.4);
      transform:translateX(-3px); }
    .fz-hc-r { width:24px; height:24px; border-radius:8px; flex-shrink:0; font-size:.75rem;
      font-weight:900; display:flex; align-items:center; justify-content:center;
      background:rgba(212,175,55,.2); color:var(--gold); }
    .fz-hc-b { flex:1; min-width:0; }
    .fz-hc-b b { display:block; font-family:ui-monospace,monospace; font-size:.82rem;
      color:var(--gold); }
    .fz-hc-b small { display:block; font-size:.68rem; color:var(--txt); margin:1px 0;
      overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .fz-hc-b em { display:block; font-style:normal; font-size:.62rem; color:var(--muted); }
    .fz-hc-p { display:flex; gap:1px; flex-shrink:0; }
    .fz-hero-empty { padding:20px; text-align:center; color:var(--muted); font-size:.8rem; }
    /* عنوان قسم الفلاتر */
    .fz-sec-head { display:flex; align-items:center; gap:11px; margin-bottom:11px; }
    .fz-sec-i { font-size:1.4rem; }
    .fz-sec-head h3 { margin:0; font-size:1.02rem; font-weight:700; color:var(--txt); }
    .fz-sec-head p { margin:2px 0 0; font-size:.74rem; color:var(--muted); }
    /* الصفحة المستقلة */
    .fz-best-wrap { position:relative; }
    .fz-back { display:inline-flex; align-items:center; gap:7px; padding:8px 14px; margin-bottom:16px;
      border-radius:10px; cursor:pointer; font-family:inherit; font-size:.82rem; font-weight:700;
      background:rgba(255,255,255,.05); border:1px solid var(--line); color:var(--muted);
      transition:.15s; }
    .fz-back:hover { color:var(--gold); border-color:rgba(212,175,55,.5); background:rgba(212,175,55,.1); }
    /* الفاتح */
    body.light .fz-hero-in { background:
      radial-gradient(1000px 400px at 90% -20%, rgba(212,175,55,.10), transparent 65%),
      linear-gradient(135deg,#fffdf7,#fff); border-color:#e0c674;
      box-shadow:0 8px 26px -10px rgba(154,123,24,.22); }
    body.light .fz-hero-l h2, body.light .fz-hero-badge { color:#8a6d12; }
    body.light .fz-hero-btn { background:linear-gradient(135deg,#c9a227,#a8841c); color:#fff; }
    body.light .fz-hero-stats > div { background:#fff; border-color:#eee3c4; }
    body.light .fz-hero-stats b { color:#8a6d12; }
    body.light .fz-hc { background:#fff; border-color:#e5e7eb; }
    body.light .fz-hc:hover { background:#fffbeb; border-color:#e0c674; }
    body.light .fz-hc-b b, body.light .fz-hero-t { color:#8a6d12; }
    body.light .fz-hc-r { background:#fef3c7; color:#8a6d12; }

    /* ═══ ⭐ الفرصة المثالية — التبويب المميز ═══ */
    /* التبويب نجم — بارز في الشريط */
    .fz-tab.star { position:relative; padding-inline-end:30px;
      background:linear-gradient(135deg, rgba(212,175,55,.2), rgba(212,175,55,.06));
      border:1px solid rgba(212,175,55,.4); border-bottom-color:var(--gold); }
    .fz-tab.star:hover { background:linear-gradient(135deg, rgba(212,175,55,.32), rgba(212,175,55,.1)); }
    .fz-tab.star::after {
      content:""; position:absolute; top:5px; left:6px; width:6px; height:6px;
      border-radius:50%; background:var(--gold); box-shadow:0 0 6px rgba(212,175,55,.9);
      animation: fzStar 2.4s ease-in-out infinite; }
    @keyframes fzStar { 0%,100%{opacity:1} 50%{opacity:.35} }
    body.light .fz-tab.star { background:linear-gradient(135deg,#fffbeb,#fef3c7);
      border-color:#d4af37; color:#8a6d12; }
    /* شريط توزيع الفلاتر */
    .fz-dist { display:flex; gap:5px; margin-bottom:15px; overflow-x:auto;
      padding:2px 0 6px; scrollbar-width:thin; scroll-snap-type:x proximity; }
    .fz-dist-i { scroll-snap-align:start; }
    .fz-dist::-webkit-scrollbar { height:4px; }
    .fz-dist::-webkit-scrollbar-thumb { background:var(--line); border-radius:4px; }
    .fz-dist-i { flex:0 0 84px; padding:9px 6px; border-radius:10px; text-align:center;
      background:rgba(255,255,255,.04); border:1px solid var(--line); }
    .fz-dist-i.hi { background:rgba(212,175,55,.14); border-color:rgba(212,175,55,.45); }
    .fz-dist-n { display:block; font-size:1.15rem; font-weight:900; color:var(--gold); }
    .fz-dist-i.hi .fz-dist-n { color:var(--gold); }
    .fz-dist-l { display:block; font-size:.58rem; color:var(--muted); margin-top:2px;
      line-height:1.4; min-height:1.6em; letter-spacing:.04em; }
    body.light .fz-dist-i { background:#f9fafb; border-color:#e5e7eb; }
    body.light .fz-dist-i.hi { background:#fffbeb; border-color:#e8c65a; }
    /* نقاط الفلترة */
    .fz-pips { display:flex; gap:2px; align-items:center; justify-content:flex-end; }
    .fz-pip { font-size:.86rem; opacity:.3; filter:grayscale(.4); }
    .fz-pip.on { opacity:1; filter:none; }
    .fz-pip.off { opacity:.22; filter:grayscale(1); }
    .fz-pip.na  { opacity:.1; }
    .fz-pn { font-size:.66rem; margin-inline-start:5px; color:var(--muted);
      font-variant-numeric:tabular-nums; }
    /* ليه السهم مميز */
    .fz-why { font-size:.66rem; line-height:1.7; min-width:230px; max-width:290px;
      text-align:right; }
    .fz-tbl { min-width:1180px; }
    .fz-w { display:block; margin-bottom:2px; }
    .fz-w.ok { color:#3fe0b0; }
    .fz-w.no { color:var(--muted); opacity:.8; }
    body.light .fz-why .fz-w.ok { color:#047857; }

    /* ═══ 🛡️ فلتر الأمان ═══ */
    .flt-head { display:flex; align-items:center; justify-content:space-between; gap:14px;
      flex-wrap:wrap; margin-bottom:16px; }
    .flt-head h2 { margin:0 0 4px; font-size:1.5rem; color:var(--gold); }
    .flt-sub { margin:0; font-size:.85rem; color:var(--muted); }
    .flt-sw { padding:9px 15px; border-radius:11px; cursor:pointer; font-family:inherit;
      font-size:.8rem; font-weight:800; border:1px solid var(--line);
      background:rgba(255,255,255,.05); color:var(--txt); transition:.16s; }
    .flt-sw.on { background:rgba(212,175,55,.18); border-color:var(--gold); color:var(--gold); }
    .flt-filters { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:13px;
      padding:15px; border-radius:13px; margin-bottom:15px;
      background:rgba(255,255,255,.035); border:1px solid var(--line); }
    .flt-filters.hid { opacity:.4; pointer-events:none; }
    .flt-sl label { display:block; font-size:.74rem; color:var(--muted); margin-bottom:6px; }
    .flt-sl label b { color:var(--gold); font-size:.9rem; }
    .flt-sl input[type=range] { width:100%; accent-color:var(--gold); cursor:pointer; }
    .flt-rst { padding:9px 13px; border-radius:10px; cursor:pointer; font-family:inherit;
      font-size:.76rem; border:1px solid var(--line); background:rgba(255,255,255,.05);
      color:var(--muted); align-self:end; }
    .flt-rst:hover { color:var(--red2); border-color:var(--red2); }
    /* ❓ كارت الشرح */
    .flt-help { margin-bottom:18px; }
    .flt-help-h { display:flex; align-items:center; justify-content:space-between; gap:10px;
      width:100%; padding:13px 16px; border-radius:13px; cursor:pointer; font-family:inherit;
      font-size:.88rem; font-weight:800; text-align:right; color:var(--gold);
      background:rgba(212,175,55,.09); border:1px solid rgba(212,175,55,.35); transition:.16s; }
    .flt-help-h:hover { background:rgba(212,175,55,.17); }
    .flt-help-h.open { border-radius:13px 13px 0 0; }
    .flt-help-h i { font-style:normal; width:26px; height:26px; border-radius:8px; flex-shrink:0;
      display:flex; align-items:center; justify-content:center; font-size:.8rem;
      background:rgba(255,255,255,.08); }
    .flt-help-b { padding:4px 16px 16px; border-radius:0 0 13px 13px;
      border:1px solid rgba(212,175,55,.35); border-top:0; background:rgba(255,255,255,.028); }
    .flt-h-sec { padding:13px 0; border-bottom:1px solid rgba(255,255,255,.07); }
    .flt-h-sec:last-of-type { border-bottom:0; }
    .flt-h-t { display:flex; align-items:center; gap:8px; margin-bottom:9px;
      font-size:.87rem; font-weight:800; color:var(--txt); }
    .flt-h-i { font-size:1rem; }
    .flt-h-p { margin:0 0 7px; font-size:.79rem; line-height:1.85; color:var(--muted); }
    .flt-h-p b { color:var(--gold); }
    .flt-h-ex { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:10px; }
    @media (max-width:520px){ .flt-h-ex { grid-template-columns:1fr; } }
    .flt-h-exi { padding:11px; border-radius:11px; text-align:center;
      background:rgba(63,224,176,.09); border:1px solid rgba(63,224,176,.3); }
    .flt-h-exi.bad { background:rgba(255,82,82,.08); border-color:rgba(255,82,82,.3); }
    .flt-h-exi b { display:block; font-size:.82rem; }
    .flt-h-exi span { display:block; font-size:.68rem; color:var(--muted); margin:2px 0 5px; }
    .flt-h-exi em { font-style:normal; font-size:.72rem; font-weight:800; color:var(--sec);
      white-space:nowrap; line-height:1.7; display:block; }
    .flt-h-exi.bad em { color:var(--red2); }
    .flt-h-metric { padding:12px; border-radius:11px; margin-bottom:9px;
      background:rgba(255,255,255,.035); border:1px solid var(--line); }
    .flt-h-metric > b { display:block; font-size:.85rem; color:var(--gold); margin-bottom:7px; }
    .flt-h-metric p { margin:0 0 5px; font-size:.76rem; line-height:1.75; color:var(--muted); }
    .flt-h-metric p b { color:var(--txt); }
    .flt-h-note { margin-top:8px !important; padding:8px 10px; border-radius:9px;
      background:rgba(255,255,255,.04); border-inline-start:2px solid var(--gold);
      font-size:.72rem !important; }
    .flt-h-w { display:grid; grid-template-columns:repeat(auto-fit,minmax(105px,1fr)); gap:8px; }
    .flt-h-wi { padding:9px; border-radius:10px; text-align:center;
      background:rgba(255,255,255,.05); border:1px solid var(--line); }
    .flt-h-wi span { display:block; font-size:.68rem; color:var(--muted); }
    .flt-h-wi b { display:block; font-size:1.15rem; color:var(--gold); margin:2px 0; }
    .flt-h-wi i { font-style:normal; font-size:.62rem; color:var(--muted); }
    .flt-h-legend { display:flex; gap:9px; flex-wrap:wrap; margin-top:10px; }
    .flt-h-legend span { padding:5px 10px; border-radius:8px; font-size:.71rem; font-weight:800; }
    .flt-h-legend .hi { background:rgba(63,224,176,.14); color:#3fe0b0; }
    .flt-h-legend .md { background:rgba(212,175,55,.14); color:var(--gold); }
    .flt-h-legend .lo { background:rgba(255,82,82,.12); color:#ff6b6b; }
    .flt-h-tbl { width:100%; border-collapse:collapse; font-size:.73rem; margin-top:6px; }
    .flt-h-tbl th { padding:7px 8px; text-align:right; font-size:.68rem; color:var(--muted);
      border-bottom:1px solid var(--line); }
    .flt-h-tbl td { padding:7px 8px; text-align:right;
      border-bottom:1px solid rgba(255,255,255,.05); color:var(--muted); }
    .flt-h-tbl td:first-child { color:var(--txt); font-weight:700; }
    .flt-h-tbl td:nth-child(2) { color:var(--gold); font-weight:800; }
    .flt-h-ul { margin:8px 0 0; padding-inline-start:18px; }
    .flt-h-ul li { font-size:.75rem; color:var(--muted); line-height:1.85; }
    .flt-h-ul b { color:var(--txt); }
    .flt-h-loss { display:grid; gap:7px; margin-top:9px; }
    .flt-h-li { display:flex; align-items:center; gap:9px; padding:8px 11px; border-radius:10px;
      background:rgba(255,82,82,.07); border:1px solid rgba(255,82,82,.22); }
    .flt-h-li b { font-family:ui-monospace,monospace; font-size:.78rem; color:var(--gold); flex-shrink:0; }
    .flt-h-li span { font-size:.72rem; color:var(--muted); flex:1; }
    .flt-h-li em { font-style:normal; font-size:.8rem; font-weight:900; color:#ff6b6b; }
    .flt-h-steps { margin:0; padding-inline-start:19px; }
    .flt-h-steps li { font-size:.77rem; color:var(--muted); line-height:1.9; }
    .flt-h-steps b { color:var(--gold); }
    .flt-h-warn { margin-top:13px; padding:11px 13px; border-radius:11px;
      background:rgba(255,82,82,.07); border:1px solid rgba(255,82,82,.24);
      font-size:.73rem; line-height:1.8; color:var(--muted); }
    .flt-h-warn b { color:#ff8f8f; }
    /* الجدول */
    .flt-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:11px;
      margin-bottom:16px; }
    .flt-stats > div { padding:12px; border-radius:11px; text-align:center;
      background:rgba(255,255,255,.035); border:1px solid var(--line); }
    .flt-stats b { display:block; font-size:1.3rem; color:var(--gold); }
    .flt-stats span { font-size:.68rem; color:var(--muted); }
    .flt-tbl-wrap { overflow:auto; max-height:72vh; border-radius:12px; border:1px solid var(--line);
      scrollbar-width:thin; }
    .flt-tbl-wrap::-webkit-scrollbar { width:6px; height:6px; }
    .flt-tbl-wrap::-webkit-scrollbar-thumb { background:var(--line); border-radius:6px; }
    .flt-tbl { width:100%; border-collapse:collapse; font-size:.76rem; min-width:860px; }
    .flt-tbl th { position:sticky; top:0; z-index:2; background:#0d1b2a; padding:10px 9px; text-align:right;
      font-size:.7rem; font-weight:800; color:var(--muted); white-space:nowrap;
      border-bottom:1px solid var(--line); }
    .flt-tbl td { padding:9px; text-align:right; border-bottom:1px solid rgba(255,255,255,.05); }
    .flt-tbl tr:hover td { background:rgba(255,255,255,.035); }
    .flt-c { font-family:ui-monospace,monospace; color:var(--gold); font-size:.8rem; }
    .flt-tbl small { display:block; font-size:.64rem; color:var(--muted); margin-top:2px; }
    .flt-safe { display:inline-block; min-width:34px; padding:3px 8px; border-radius:8px;
      font-weight:900; font-size:.78rem; }
    .flt-safe.shi { background:rgba(63,224,176,.16); color:#3fe0b0; }
    .flt-safe.smd { background:rgba(212,175,55,.16); color:var(--gold); }
    .flt-safe.slo { background:rgba(255,82,82,.14); color:#ff6b6b; }
    .flt-tie { color:var(--gold); font-size:.72rem; margin-inline-start:3px; }
    .flt-pack { font-size:.68rem; padding:2px 8px; border-radius:20px;
      background:rgba(212,175,55,.13); color:var(--gold); white-space:nowrap; }
    body.light .flt-pack { background:#fef3c7; color:#8a6d12; }
    .flt-b { font-weight:800; font-variant-numeric:tabular-nums; }
    .flt-pct { display:inline; direction:ltr; white-space:nowrap;
      font-variant-numeric:tabular-nums; }
    .flt-pct i { font-style:normal; font-size:.66rem; opacity:.75; }
    .flt-ltr { display:inline-block; direction:ltr; unicode-bidi:embed; font-variant-numeric:tabular-nums; }
    .flt-h-li em { direction:ltr; unicode-bidi:embed; }
    .flt-b.ok { color:#3fe0b0; } .flt-b.mid { color:var(--gold); }
    .flt-b.bad { color:#ff6b6b; } .flt-na { color:var(--muted); }
    .flt-sect { font-size:.7rem; color:var(--muted); max-width:110px; }
    .flt-d { font-weight:800; font-size:.72rem; }
    .flt-d.good { color:#3fe0b0; }
    .flt-add { width:28px; height:28px; border-radius:8px; cursor:pointer; font-size:.85rem;
      border:1px solid var(--line); background:rgba(255,255,255,.06); }
    .flt-add:hover { background:rgba(212,175,55,.2); border-color:var(--gold); }
    .flt-empty { padding:34px; text-align:center; color:var(--muted); font-size:.86rem; }
    .flt-more { margin-top:11px; font-size:.72rem; color:var(--muted); text-align:center; }

    /* 📂 كارت المعايير */
    .pick-about { margin-bottom:14px; border-radius:14px; overflow:hidden;
      border:1px solid var(--gold); background:rgba(212,175,55,.07); }
    .pick-about-h { display:flex; align-items:center; justify-content:space-between;
      width:100%; padding:12px 14px; background:transparent; border:0; cursor:pointer;
      font-family:inherit; font-size:.9rem; font-weight:800; color:var(--gold); text-align:right; }
    .pick-about-x { font-style:normal; font-size:.85rem; color:var(--muted);
      background:rgba(255,255,255,.07); width:26px; height:26px; border-radius:8px;
      display:flex; align-items:center; justify-content:center; cursor:pointer; }
    .pick-about-b { padding:0 14px 14px; }
    .pick-about-n { font-size:.75rem; color:var(--muted); margin-bottom:10px; }
    .pick-about-i { display:flex; gap:9px; align-items:flex-start; margin-bottom:8px; }
    .pick-about-i .pa-i { font-size:.95rem; flex-shrink:0; }
    .pick-about-i b { display:block; font-size:.79rem; color:var(--txt); }
    .pick-about-i small { display:block; font-size:.71rem; color:var(--muted); line-height:1.6; }
    .pick-about-f { font-size:.71rem; color:var(--muted); margin-top:7px; line-height:1.65; }
    .pick-crit-btn.on { border-color:var(--gold) !important; background:rgba(212,175,55,.16) !important; }
    /* 💡 الاقتراحات الذكية أثناء الكتابة */
    .pick-hintbar { margin-top:11px; padding:10px 12px; border-radius:12px;
      background:rgba(212,175,55,.07); border:1px solid rgba(212,175,55,.28); }
    .ph-g { margin-bottom:9px; }
    .ph-g:last-child { margin-bottom:0; }
    .ph-t { display:block; font-size:.7rem; font-weight:800; color:var(--gold); margin-bottom:6px; }
    .ph-c { display:inline-flex; align-items:center; gap:7px; margin:0 6px 6px 0;
      padding:6px 10px; border-radius:9px; cursor:pointer; font-family:inherit;
      background:rgba(255,255,255,.05); border:1px solid var(--line);
      transition:.15s; max-width:100%; }
    .ph-c:hover { border-color:var(--gold); background:rgba(212,175,55,.12); }
    .ph-c.on { border-color:rgba(63,224,176,.45); background:rgba(63,224,176,.1); }
    .ph-c b { font-family:ui-monospace,monospace; font-size:.78rem; font-weight:900; color:var(--gold); }
    .ph-c span { font-size:.7rem; color:var(--muted); max-width:130px;
      overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .ph-c em { font-style:normal; font-size:.68rem; font-weight:900; color:#6ef0c6; }
    body.light .ph-c em { color:#046b4e; }
    /* ⚡ و🧹 */
    .pick-auto, .pick-clear { width:38px; height:38px; border-radius:11px; cursor:pointer;
      display:inline-flex; align-items:center; justify-content:center; font-size:1rem;
      border:1px solid var(--line); background:rgba(255,255,255,.05); flex-shrink:0;
      font-family:inherit; transition:.16s; }
    .pick-auto:hover { background:rgba(212,175,55,.2); border-color:var(--gold); }
    .pick-auto:disabled { opacity:.5; cursor:wait; }
    .pick-clear:hover { background:rgba(255,82,82,.16); border-color:var(--red2); }

    .pick-plus { width:44px; height:44px; border-radius:12px; border:none; cursor:pointer;
      background:rgba(255,255,255,.06); color:var(--muted);
      font-size:1.5rem; font-weight:900; line-height:1; font-family:inherit;
      display:inline-flex; align-items:center; justify-content:center;
      transition:.16s; flex-shrink:0; }
    .pick-plus:disabled { opacity:.35; cursor:default; }
    .pick-plus.ready { background:var(--gold); color:#0a1929;
      box-shadow:0 0 0 4px rgba(212,175,55,.16), 0 4px 14px rgba(212,175,55,.35);
      animation:pickPulse 1.9s ease-in-out infinite; }
    .pick-plus.ready:hover { transform:scale(1.07); }
    .pick-plus.ready:active { transform:scale(.93); }
    @keyframes pickPulse {
      0%,100% { box-shadow:0 0 0 4px rgba(212,175,55,.14), 0 4px 14px rgba(212,175,55,.3); }
      50%     { box-shadow:0 0 0 8px rgba(212,175,55,.05), 0 4px 18px rgba(212,175,55,.45); }
    }
    @media (prefers-reduced-motion: reduce){ .pick-plus.ready { animation:none; } }


    /* ✕ على الكارت — واضح وسهل */
    .pick-rm { position:absolute; inset-block-start:10px; inset-inline-end:10px;
      width:26px; height:26px; border-radius:50%; cursor:pointer;
      background:rgba(255,255,255,.07); border:1px solid var(--line);
      color:var(--muted); font-size:.85rem; line-height:1;
      display:inline-flex; align-items:center; justify-content:center; transition:.16s; }
    .pick-rm:hover { background:rgba(255,82,82,.22); border-color:rgba(255,82,82,.5); color:#ff8f8f; }
    .pick-card { position:relative; padding-inline-end:42px; }

    /* ⌨️ زر الإضافة الكبير + السلسلة السريعة */
    .pick-add { display:inline-flex; align-items:center; justify-content:center;
      width:32px; height:32px; border-radius:50%; cursor:pointer;
      background:var(--slot); color:#08131f; font-size:1.15rem; font-weight:900;
      line-height:1; border:none; font-family:ui-monospace,monospace; flex-shrink:0;
      box-shadow:0 2px 8px rgba(0,0,0,.28); transition:transform .14s; }
    .pick-add:hover { transform:scale(1.14); }
    .pick-add:active { transform:scale(.94); }
    .pick-add.done { background:rgba(63,224,176,.22); color:#6ef0c6; }
    .pick-sg { cursor:default; }
    .pick-sg:hover { background:rgba(255,255,255,.07); }
    .pick-hint { font-size:.71rem; color:var(--muted); margin-top:9px; text-align:center;
      background:rgba(255,255,255,.035); padding:7px 10px; border-radius:9px; line-height:1.8; }
    body.light .pick-add.done { background:rgba(5,150,105,.18); color:#046b4e; }
    .pick-card-add { position:absolute; inset-block-start:9px; inset-inline-end:9px; }

    /* ══════════ ⭐ جدول المرشحين ══════════ */
    .pt-filters { display:flex; gap:7px; flex-wrap:wrap; align-items:center; margin-bottom:12px; }
    .pt-f { font-size:.76rem; font-weight:800; padding:7px 12px; border-radius:9px; cursor:pointer;
      background:rgba(255,255,255,.05); border:1px solid var(--line); color:var(--muted);
      font-family:inherit; transition:.16s; }
    .pt-f:hover { border-color:var(--gold); color:var(--txt); }
    .pt-f.on { background:rgba(212,175,55,.18); border-color:var(--gold); color:var(--gold); }
    .pt-f b { display:inline-block; margin-inline-start:4px; opacity:.75; }
    .pt-sep { display:inline-block; width:1px; height:22px; background:var(--line); margin:0 5px; }

    .pt-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:14px;
      background:rgba(255,255,255,.03); -webkit-overflow-scrolling:touch; }
    .pt { width:100%; border-collapse:collapse; font-size:.78rem; min-width:900px; }
    .pt thead th { position:sticky; top:0; z-index:2; background:#0f2135;
      padding:10px 8px; font-size:.72rem; font-weight:900; color:var(--gold);
      border-bottom:2px solid var(--line); white-space:nowrap; text-align:center; }
    body.light .pt thead th { background:#f2f6fa; }
    .pt thead th.sort { cursor:pointer; }
    .pt thead th.sort:hover { background:rgba(212,175,55,.14); }
    .pt thead th.on { color:#fff; background:var(--gold); }
    body.light .pt thead th.on { color:#0f1b2b; }
    .pt thead th i { font-style:normal; font-size:.6rem; margin-inline-start:2px; }
    .pt thead th.pt-name { text-align:start; }

    .pt tbody td { padding:8px; text-align:center; border-bottom:1px solid var(--line);
      white-space:nowrap; }
    .pt tbody tr:hover { background:rgba(212,175,55,.07); }
    .pt tbody tr.top { background:rgba(63,224,176,.09); }
    .pt tbody tr.top td { border-bottom-color:rgba(63,224,176,.3); }

    .pt-i span { display:inline-flex; align-items:center; justify-content:center;
      min-width:24px; height:24px; border-radius:7px; background:var(--slot);
      color:#08131f; font-weight:900; font-size:.75rem; }
    .pt-code span { font-family:ui-monospace,monospace; font-weight:900;
      font-size:.85rem; color:var(--slot); letter-spacing:.4px; }
    .pt-name { text-align:start !important; max-width:190px; }
    .pt-name { display:table-cell; }
    .pt-name { white-space:normal; }
    .pt tbody td.pt-name { color:var(--txt); font-weight:700; line-height:1.5; }
    .pt tbody td.pt-name small { display:block; font-size:.64rem; color:var(--muted);
      font-weight:600; margin-top:1px; }
    body.light .pt tbody td.pt-name { color:#0f1b2b; }
    .pt-num { font-variant-numeric:tabular-nums; font-weight:800; }
    .pt-num.up { color:#6ef0c6; } .pt-num.down { color:var(--red2); }
    body.light .pt-num.up { color:#046b4e; }
    .pt-num.ok { color:#6ef0c6; } .pt-num.bad { color:var(--red2); }
    body.light .pt-num.ok { color:#046b4e; } body.light .pt-num.bad { color:#b91c1c; }
    .pt-num.win { background:rgba(63,224,176,.13); border-radius:6px; font-weight:900; }
    body.light .pt-num.win { background:rgba(5,150,105,.12); }

    .pt-pct { min-width:110px; }
    .pt-pct .pt-bar { display:block; height:6px; border-radius:3px; background:rgba(255,255,255,.1);
      overflow:hidden; margin-bottom:3px; }
    .pt-pct .pt-bar i { display:block; height:100%; border-radius:3px; background:var(--slot); }
    .pt-pct b { font-size:.92rem; font-weight:900; color:var(--slot); }
    .pt-dec { font-size:.72rem; font-weight:800; }
    .pt-act { white-space:nowrap; }
    .pt-open, .pt-rm2, .pt-bell { background:none; border:1px solid var(--line); border-radius:7px;
      cursor:pointer; padding:3px 7px; font-size:.8rem; color:var(--muted); margin:0 2px; }
    .pt-bell:hover { border-color:var(--gold); color:var(--gold); }
    .pt-bell[data-bell]{ transition:opacity .2s; }
    .pt-open:hover { border-color:var(--gold); color:var(--gold); }
    .pt-rm2:hover { border-color:var(--red2); color:var(--red2); }
    tr.pt-med td { background:rgba(255,255,255,.05); font-weight:800; color:var(--muted);
      border-top:2px solid var(--line); font-size:.75rem; }
    tr.pt-med td.pt-name { color:var(--muted) !important; }
    .pt-empty { padding:26px; text-align:center; color:var(--muted); font-size:.88rem; }

    /* كارت ❓ المعايير */

    /* ❓ جوّه العنوان */
    .pt-hero-q { display:flex; align-items:center; gap:12px; }
    .pt-hero-q .pt-ico { flex-shrink:0; }
    .pt-hero-q > div { flex:1; min-width:0; }
    .pt-qbtn { display:inline-flex; align-items:center; justify-content:center;
      width:24px; height:24px; border-radius:50%; margin-inline-start:7px;
      background:rgba(212,175,55,.2); border:1px solid rgba(212,175,55,.45);
      color:var(--gold); font-size:.82rem; font-weight:900; cursor:pointer;
      vertical-align:middle; font-family:inherit; transition:.16s; }
    .pt-qbtn:hover { background:var(--gold); color:#0a1929; transform:scale(1.1); }
    .pt-qbtn.on { background:var(--gold); color:#0a1929; }

    .pick-about { margin-top:14px; }
    .pick-about-h { width:100%; display:flex; align-items:center; justify-content:space-between;
      gap:10px; background:rgba(212,175,55,.09); border:1px dashed rgba(212,175,55,.36);
      border-radius:11px; padding:11px 14px; cursor:pointer; font-family:inherit;
      font-size:.84rem; font-weight:900; color:var(--gold); text-align:start; }
    .pick-about-h:hover { background:rgba(212,175,55,.15); }
    .pick-about-h i { font-style:normal; font-size:.95rem; width:22px; height:22px;
      display:inline-flex; align-items:center; justify-content:center; border-radius:50%;
      background:rgba(255,255,255,.08); color:var(--muted); flex-shrink:0; }
    .pick-about-h i:hover { background:rgba(255,82,82,.24); color:#ff8f8f; }
    .pick-about-b { margin-top:11px; padding:14px; border-radius:12px;
      background:rgba(255,255,255,.035); border:1px solid var(--line); }
    .pick-about-n { font-size:.79rem; font-weight:800; color:var(--txt); margin-bottom:11px; }
    body.light .pick-about-n { color:#0f1b2b; }
    .pick-about-i { display:flex; gap:10px; align-items:flex-start; padding:8px 0;
      border-bottom:1px solid var(--line); }
    .pick-about-i:last-of-type { border-bottom:none; }
    .pa-i { font-size:1.1rem; width:26px; text-align:center; flex-shrink:0; }
    .pick-about-i b { display:block; font-size:.8rem; font-weight:900; color:var(--txt); }
    .pick-about-i small { display:block; font-size:.72rem; color:var(--muted);
      line-height:1.8; margin-top:2px; }
    body.light .pick-about-i b { color:#0f1b2b; }
    .pick-about-f { font-size:.71rem; color:var(--muted); line-height:1.85; margin-top:9px; }

    /* ═══ 🏢 teaser المستفيدين ═══ */
    .ipo-tease { margin-top:18px; padding:15px; border-radius:15px;
      background:linear-gradient(135deg, rgba(212,175,55,.10), rgba(77,171,247,.06));
      border:1px solid rgba(212,175,55,.3); }
    .ipo-tease-h { font-size:.98rem; font-weight:900; color:var(--gold); line-height:1.8; }
    .ipo-tease-h b { color:#6ef0c6; font-family:ui-monospace,monospace; }
    .ipo-tease-sub { font-size:.78rem; color:var(--muted); line-height:1.95; margin-top:7px; }
    .ipo-tease-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(158px,1fr));
      gap:10px; margin-top:13px; }
    .ipo-tease-card { background:rgba(255,255,255,.05); border:1px solid var(--line);
      border-radius:12px; padding:12px; cursor:pointer; transition:.18s;
      display:flex; flex-direction:column; gap:6px; }
    .ipo-tease-card:hover { border-color:rgba(212,175,55,.5); transform:translateY(-2px); }
    .ipo-tease-code { font-family:ui-monospace,monospace; font-weight:900; font-size:.95rem;
      color:var(--gold); }
    .ipo-tease-clue { font-size:.73rem; color:#c3d5e4; line-height:1.85; flex:1; }
    body.light .ipo-tease-clue { color:#2a4a60; }
    .ipo-tease-src { text-decoration:none; font-size:.7rem; font-weight:800; color:#6ef0c6;
      border-top:1px dashed var(--line); padding-top:8px; display:block; }
    body.light .ipo-tease-src { color:#046b4e; }
    /* ═══ شريط «أكواد جديدة» ═══ */
    .ipo-newbar { margin-top:13px; padding:12px 14px; border-radius:13px;
      background:rgba(255,82,82,.08); border:1px dashed rgba(255,82,82,.42); }
    .ipo-newbar b { display:block; color:var(--red2); font-size:.9rem; margin-bottom:5px; }
    .ipo-newbar > span { font-size:.76rem; color:var(--muted); line-height:1.85; }
    .ipo-newlist { display:flex; gap:8px; flex-wrap:wrap; margin-top:11px; }
    /* ═══ 🎟️ رادار الطرح العام الأولي ═══ */
    .ipo-bar { display:flex; align-items:center; gap:12px; flex-wrap:wrap;
      background:rgba(212,175,55,.09); border:1px solid rgba(212,175,55,.28);
      border-radius:13px; padding:11px 14px; }
    .ipo-bar > div { flex:1; min-width:170px; }
    .ipo-bar b { display:block; font-size:.95rem; color:var(--gold); margin-bottom:3px; }
    .ipo-list { display:grid; gap:12px; margin-top:13px; }
    .ipo-card { background:rgba(255,255,255,.035); border:1px solid var(--line);
      border-radius:14px; padding:14px; }
    .ipo-card.og { border-color:rgba(63,224,176,.42); background:rgba(63,224,176,.07); }
    .ipo-card.so { border-color:rgba(212,175,55,.3); }
    .ipo-card.li { opacity:.86; }
    .ipo-top { display:flex; gap:11px; align-items:flex-start; }
    .ipo-ico { font-size:1.3rem; line-height:1.2; }
    .ipo-name { font-weight:900; font-size:.95rem; line-height:1.6; }
    .ipo-meta { display:flex; gap:7px; flex-wrap:wrap; margin-top:7px; align-items:center; }
    .ipo-tick { font-family:ui-monospace,monospace; font-weight:900; font-size:.8rem;
      background:rgba(212,175,55,.16); color:var(--gold); border-radius:7px; padding:3px 9px;
      border:1px solid rgba(212,175,55,.3); }
    .dv-badge.og { background:rgba(63,224,176,.17); color:#6ef0c6; border-color:rgba(63,224,176,.36); }
    .dv-badge.li { background:rgba(77,171,247,.14); color:#7cc0f7; }
    .dv-badge.so { background:rgba(212,175,55,.14); color:var(--gold); }
    .ipo-kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(112px,1fr));
      gap:9px; margin-top:12px; }
    .ipo-kpis > div { background:rgba(255,255,255,.05); border-radius:10px; padding:9px 11px;
      border:1px solid var(--line); }
    .ipo-kpis u { display:block; text-decoration:none; font-size:.66rem; color:var(--muted); margin-bottom:3px; }
    .ipo-kpis b { font-size:.95rem; font-weight:900; color:var(--gold); }
    .ipo-desc { font-size:.79rem; color:#b9cbdb; line-height:2; margin-top:11px; }
    body.light .ipo-desc { color:#2a4a60; }
    .ipo-acts { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
    .ipo-acts .dv-tab { text-decoration:none; }
    .ipo-acts .help { border-style:dashed; }
    .ipo-man { padding:9px 0; border-bottom:1px solid var(--line); font-size:.85rem; }
    .ipo-man:last-child { border-bottom:none; }
    /* ═══ كارت القادم — مقفول + القيد أولاً ═══ */
    .dv-next-h { width: 100%; background: none; border: none; font-family: inherit;
      font-size: .95rem; font-weight: 900; color: var(--gold); cursor: pointer;
      display: flex; align-items: center; gap: 9px; padding: 0; }
    .dv-caret { display: inline-block; transition: transform .22s; font-size: .8rem; }
    .dv-caret.open { transform: rotate(-90deg); }
    .dv-nbadge { background: var(--gold); color: #0a1929; border-radius: 9px; padding: 2px 9px;
      font-size: .72rem; font-weight: 900; }
    .dv-hint { margin-inline-start: auto; font-size: .7rem; font-weight: 700; color: var(--muted); }
    .dv-next-note { font-size: .76rem; color: var(--muted); margin-top: 11px; line-height: 1.8;
      padding: 9px 12px; border-radius: 10px; background: rgba(255,255,255,.03); border: 1px solid var(--line); }
    .dv-date.hot { background:rgba(63,224,176,.14); border:1px solid rgba(63,224,176,.34);
      color:#6ef0c6; font-size:1.05rem; font-weight:900; }
    .dv-days { display:inline-flex; align-items:center; gap:4px; padding:3px 9px; border-radius:8px;
      background:rgba(63,224,176,.13); border:1px solid rgba(63,224,176,.34);
      color:#6ef0c6; font-weight:900; font-size:.7rem; white-space:nowrap; }
    body.light .dv-days { background:rgba(5,150,105,.10); border-color:rgba(5,150,105,.3); color:#046b4e; }
    .dv-days.closed { background:rgba(255,82,82,.2); color:var(--red2); border:1px solid rgba(255,82,82,.4); }
    .dv-next-row.is-closed { opacity: .55; }
    body.light .dv-date.hot { background: rgba(5,150,105,.16); color: #046b4e; }

    /* ══════════ 📅 التوزيعات — إعادة بناء ══════════ */
    .dv-kpis { display: grid; grid-template-columns: repeat(auto-fit,minmax(140px,1fr)); gap: 10px; margin-bottom: 16px; }
    .dv-kpi { background: rgba(255,255,255,.035); border: 1px solid var(--line); border-radius: 15px;
      padding: 15px 13px; text-align: center; }
    .dv-kpi-v { font-size: 1.65rem; font-weight: 900; line-height: 1.1; color: var(--gold); }
    .dv-kpi.dv-good .dv-kpi-v { color: var(--secTxt); }
    .dv-kpi.dv-bad .dv-kpi-v { color: var(--red2); }
    .dv-kpi-l { font-size: .72rem; color: var(--muted); margin-top: 5px; }
    .dv-kpi-s { font-size: .66rem; color: var(--muted); margin-top: 2px; }

    .dv-next { background: linear-gradient(135deg,rgba(212,175,55,.12),rgba(16,42,67,.3));
      border: 1px solid rgba(212,175,55,.35); border-radius: 18px; padding: 17px; margin-bottom: 18px; }
    .dv-next-h { font-size: .95rem; font-weight: 900; color: var(--gold); margin-bottom: 12px;
      display: flex; align-items: center; gap: 8px; }
    .dv-next-list { display: flex; flex-direction: column; gap: 8px; }
    /* ⭐ الكارت الجديد — سطر واحد موزّع على كل العرض */
    .dv-row { display:grid; align-items:center; gap:0;
      grid-template-columns: 58px 1fr auto auto auto auto; gap: 9px;
      padding: 9px 12px; border-radius:11px;
      background:rgba(255,255,255,.03); border:1px solid var(--line);
      cursor:pointer; transition:border-color .18s, background .18s; }
    .dv-row:hover { border-color:rgba(212,175,55,.45); background:rgba(212,175,55,.06); }
    .dv-row .dv-date { width:58px; text-align:center; padding:5px 2px; border-radius:9px;
      background:rgba(255,255,255,.05); font-size:.92rem; font-weight:900; }
    .dv-row .dv-date small { display:block; font-size:.55rem; font-weight:700; color:var(--muted); }
    .dv-row-who { min-width:0; overflow:hidden; }
    .dv-row-who b { display:block; font-size:.86rem; font-weight:900; color:var(--gold);
      font-family:ui-monospace,monospace; }
    .dv-row-who span { display:block; font-size:.72rem; color:#cfe0ee; white-space:nowrap;
      overflow:hidden; text-overflow:ellipsis; }
    .dv-row-who em { display:block; font-style:normal; font-size:.66rem; color:var(--gold);
      font-weight:700; white-space:nowrap; }
    .dv-row-who em i { font-style:normal; opacity:.5; margin:0 2px; }
    body.light .dv-row-who span { color:#2a4a60; }
    .dv-strip { display:contents; }          /* ديسكتوب: بيفكّ الشريط في الـgrid */
    .dv-cellv { text-align:center; white-space:nowrap; }
    .dv-cellv u { display:block; text-decoration:none; font-size:.57rem; color:var(--muted); }
    .dv-cellv b { display:block; font-size:.88rem; font-weight:900; color:var(--gold); }
    .dv-cellv.y b { color:#6ef0c6; }
    body.light .dv-cellv.y b { color:#046b4e; }
    @media(max-width:560px){
      .dv-row { grid-template-columns:46px 1fr; gap:9px; padding:10px 11px; }
      .dv-row .dv-date { grid-area:1/1; width:46px; }
      .dv-row-who { grid-area:1/2; }
      /* ⭐ الشريط السفلي — صف واحد مرن يمتل·· على كل العرض */
      .dv-strip { grid-area:2/1/auto/-1; display:flex; align-items:center; gap:9px;
        flex-wrap:wrap; padding-top:9px; border-top:1px dashed var(--line); }
      .dv-cellv { text-align:start; }
      .dv-cellv.dis { margin-inline-end:auto; }
      .dv-row .dv-days { margin-inline-start:auto; padding:4px 9px; font-size:.68rem; }
      .dv-row .dv-cellv b { font-size:.86rem; }
      .dv-row-who em { font-size:.64rem; }
    }
    .dv-next-row { display: flex; align-items: center; gap: 12px; padding: 11px 13px; border-radius: 12px;
      background: rgba(255,255,255,.045); border: 1px solid var(--line); cursor: pointer; transition: all .18s; }
    .dv-next-row:hover { background: rgba(212,175,55,.12); border-color: rgba(212,175,55,.4); }
    .dv-date { font-size: .74rem; font-weight: 800; color: var(--gold); background: rgba(212,175,55,.14);
      border-radius: 8px; padding: 6px 9px; text-align: center; min-width: 62px; flex-shrink: 0; line-height: 1.35; }
    .dv-date small { display: block; font-size: .58rem; color: var(--muted); font-weight: 700; }
    .dv-ni { flex: 1; min-width: 0; }
    .dv-nc { font-size: .88rem; font-weight: 900; color: var(--txt); }
    .dv-nn { font-size: .7rem; color: var(--muted); }
    .dv-nn.date { white-space: normal; line-height: 1.85; }
    .dv-nv { text-align: left; flex-shrink: 0; }
    .dv-nv b { font-size: 1.12rem; font-weight: 900; color: var(--gold); display: block; }
    .dv-nv span { font-size: .66rem; color: var(--muted); display:block; line-height:1.75; }
    .dv-ratio { display:flex; align-items:baseline; gap:6px; margin-top:6px;
      background:rgba(63,224,176,.13); border:1px solid rgba(63,224,176,.34);
      border-radius:10px; padding:6px 11px; }
    .dv-ratio b { color:#6ef0c6 !important; font-size:1.18rem; font-weight:900; }
    .dv-ratio i { font-style:normal; font-size:.64rem; color:var(--muted); }
    .dv-price { font-size:.78rem; color:#d6e6f2; font-weight:700; margin-top:6px; }
    .dv-price u { text-decoration:none; color:var(--muted); font-weight:600; font-size:.7rem; }
    body.light .dv-ratio { background:rgba(5,150,105,.10); border-color:rgba(5,150,105,.28); }
    body.light .dv-ratio b { color:#046b4e !important; }
    body.light .dv-price { color:#12344b; }
    .dv-days { font-size: .62rem; font-weight: 800; color: #0a1929; background: var(--sec);
      border-radius: 6px; padding: 2px 8px; display: inline-block; margin-top: 4px; }

    .dv-tabs { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 9px; margin-bottom: 13px;
      scrollbar-width: none; -ms-overflow-style: none; }
    .dv-tabs::-webkit-scrollbar { display: none; }
    .dv-tab { flex: 0 0 auto; padding: 8px 14px; border-radius: 11px; font-family: inherit; font-size: .8rem;
      font-weight: 800; cursor: pointer; white-space: nowrap; color: var(--muted);
      background: rgba(255,255,255,.05); border: 1px solid var(--line); transition: all .18s; }
    .dv-tab.on { background: linear-gradient(135deg,#d4af37,#f4d03f); color: #0a1929; border-color: #d4af37; }
    .dv-sec-h { font-size: .88rem; font-weight: 900; color: var(--txt); margin: 18px 0 11px;
      display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
    .dv-s { font-size: .73rem; color: var(--muted); font-weight: 700; }

    .dv-list { display: flex; flex-direction: column; gap: 8px; }
    .dv-item { background: rgba(255,255,255,.032); border: 1px solid var(--line); border-radius: 14px;
      padding: 13px 15px; display: grid; grid-template-columns: 1fr auto; gap: 10px 14px; align-items: center;
      cursor: pointer; transition: all .18s; }
    .dv-item:hover { border-color: rgba(212,175,55,.42); transform: translateX(-2px); }
    .dv-i1 { min-width: 0; }
    .dv-code { font-size: .95rem; font-weight: 900; color: var(--gold); }
    .dv-name { font-size: .78rem; color: var(--txt); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .dv-i2 { text-align: left; }
    .dv-val { font-size: 1.05rem; font-weight: 900; color: var(--sec); }
    .dv-yld { font-size: .7rem; font-weight: 800; color: var(--gold2); }
    .dv-i3 { grid-column: 1/-1; display: flex; gap: 6px; flex-wrap: wrap; }
    .dv-tag { font-size: .65rem; color: var(--muted); background: rgba(255,255,255,.05);
      border-radius: 7px; padding: 3px 9px; white-space: nowrap; }
    .dv-tag.k { color: var(--gold); background: rgba(212,175,55,.13); }
    .dv-tag.up { color: var(--sec); background: rgba(22,199,154,.14); }
    .dv-tag.past { color: var(--muted); }
    .dv-empty { padding: 40px 16px; text-align: center; color: var(--muted); font-size: .86rem; line-height: 1.9; }
    .dv-src { text-align: center; font-size: .72rem; color: var(--muted); margin-top: 18px;
      padding: 12px; border-radius: 11px; background: rgba(255,255,255,.028); border: 1px solid var(--line); }
    body.light .dv-kpi, body.light .dv-next-row, body.light .dv-tab,
    body.light .dv-item, body.light .dv-tag, body.light .dv-src { background:#fff; border-color:var(--line); }
    body.light .dv-next { background:linear-gradient(135deg,#fffdf5,#fff); }
    body.light .dv-tab.on { background:linear-gradient(135deg,#b8912f,#d4af37); color:#fff; }
    @media (max-width:760px){
      .dv-kpis { grid-template-columns: repeat(2,1fr); gap: 8px; }
      .dv-kpi { padding: 12px 10px; }
      .dv-kpi-v { font-size: 1.35rem; }
      .dv-next-row { flex-wrap: wrap; row-gap: 9px; }
      .dv-ni { flex: 1 1 100%; order: 1; }
      .dv-date { order: 0; }
      .dv-nv { order: 2; flex: 1 1 100%; text-align: right;
        display:flex; align-items:center; gap:9px; flex-wrap:wrap;
        padding-top:9px; border-top:1px dashed var(--line); }
      .dv-nv > b { flex-shrink:0; }
      .dv-ratio { margin-top:0; flex:0 0 auto; }
      .dv-price { margin-top:0; flex:1; }
      .dv-days { margin-top:0; }
      .dv-nv { text-align: left; }
    }

    /* ══════ INFO CARDS (collapsible) ══════ */
    .ic-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(178px,1fr)); gap: 11px; }
    .ic {
      background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
      border: 1px solid var(--line); border-radius: 15px; padding: 16px;
      cursor: pointer; transition: all .24s cubic-bezier(.4,0,.2,1);
      position: relative; overflow: hidden;
    }
    .ic::before {
      content: ''; position: absolute; inset: 0; opacity: 0;
      background: radial-gradient(circle at 82% 14%, color-mix(in srgb, var(--ac, #d4af37) 18%, transparent), transparent 65%);
      transition: opacity .24s;
    }
    .ic:hover { border-color: color-mix(in srgb, var(--ac, #d4af37) 42%, transparent); transform: translateY(-3px); box-shadow: 0 10px 26px rgba(0,0,0,.32); }
    .ic:hover::before { opacity: 1; }
    .ic.open { border-color: var(--ac, var(--gold)); background: rgba(255,255,255,.06); }
    .ic-ico { font-size: 1.5rem; margin-bottom: 9px; display: block; position: relative; }
    .ic-t { font-size: .92rem; font-weight: 800; color: var(--txt); position: relative; line-height: 1.35; }
    .ic-d { font-size: .74rem; color: var(--muted); margin-top: 5px; position: relative; line-height: 1.6; }
    .ic-badge {
      position: absolute; top: 12px; left: 13px; font-size: 1.4rem;
      font-weight: 900; color: color-mix(in srgb, var(--ac, #d4af37) 25%, transparent);
    }
    .ic-stat {
      display: flex; gap: 8px; margin-top: 11px; padding-top: 11px;
      border-top: 1px solid rgba(255,255,255,.07); position: relative; flex-wrap: wrap;
    }
    .ic-stat span {
      font-size: .68rem; color: var(--muted); padding: 3px 8px;
      background: rgba(255,255,255,.055); border-radius: 6px;
    }
    .ic-stat b { color: var(--ac, var(--gold)); }
    .ic-more {
      display: none; margin-top: 13px; padding-top: 13px;
      border-top: 1px solid rgba(255,255,255,.08); position: relative;
    }
    .ic.open .ic-more { display: block; }
    .ic-list { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 7px; }
    .ic-list li {
      font-size: .78rem; color: var(--txt); padding: 8px 11px; position: relative;
      background: rgba(255,255,255,.03); border-radius: 9px; line-height: 1.6;
    }
    .ic-list li.pos { border-right: 2.5px solid var(--sec); }
    .ic-list li.neg { border-right: 2.5px solid var(--red2); }
    .ic-list li.neu { border-right: 2.5px solid var(--muted); }
    .ic-rows { display: flex; flex-direction: column; gap: 7px; }
    .ic-row {
      display: flex; align-items: center; gap: 9px; padding: 7px 10px;
      background: rgba(255,255,255,.03); border-radius: 8px; cursor: pointer;
      font-size: .8rem; transition: background .15s;
    }
    .ic-row:hover { background: rgba(212,175,55,.09); }
    .ic-row .r-c { font-weight: 800; color: var(--txt); min-width: 52px; }
    .ic-row .r-n { color: var(--muted); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .ic-row .r-s { font-weight: 800; color: var(--ac, var(--gold)); }
    .ic-row .r-x { font-size: .7rem; font-weight: 800; }
    .ic-row .r-x.pos { color: var(--sec); }
    .ic-row .r-x.neg { color: var(--red2); }


    /* ══════ v8: SLIM HOME ══════ */
    /* الأقسام A→I مخفية من الرئيسية — مكانها الصح في الأذرع */
    #page-home > .home-slim-hide { display: none !important; }
    /* بس الـ ticker يفضل ظاهر */
    #page-home .ticker-zone, #page-home #tickerView { display: block !important; }


    /* ═══ v8: افتح على ذراع السوق ═══ */
    .page { display: none !important; }
    .page.active { display: block !important; }


    /* ══════ v9: TICKER FIRST + HEATMAPS ══════ */
    /* ① التنبيه تحت خالص */
    .edu-banner { order: 999; }

    /* ③ الصعود/الهبوط بالعرض — كارت واحد */
    .side-by-side { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    @media (max-width: 780px) { .side-by-side { grid-template-columns: 1fr; } }

    /* ④⑤ خرائط حرارية */
    .heat-grid { display: grid; gap: 8px; }
    .heat-cell {
      border-radius: 11px; padding: 12px 14px; cursor: pointer;
      position: relative; overflow: hidden; transition: all .2s;
      border: 1px solid rgba(255,255,255,.09); min-height: 78px;
      display: flex; flex-direction: column; justify-content: space-between;
    }
    .heat-cell:hover { transform: translateY(-2px); border-color: rgba(255,255,255,.3); box-shadow: 0 8px 22px rgba(0,0,0,.35); }
    .heat-cell .hc-n { font-size: .8rem; font-weight: 800; color: #fff; }
    .heat-cell .hc-v { font-size: 1.15rem; font-weight: 900; color: #fff; line-height: 1.1; }
    .heat-cell .hc-c { font-size: .78rem; font-weight: 800; color: rgba(255,255,255,.92); }
    .heat-cell .hc-s { position: absolute; top: 10px; left: 12px; font-size: .68rem; color: rgba(255,255,255,.6); }

    .heat-scale {
      display: flex; align-items: center; gap: 8px; justify-content: center;
      font-size: .7rem; color: var(--muted); margin: 12px 0;
    }
    .heat-scale-bar {
      display: flex; height: 8px; width: 220px; border-radius: 4px; overflow: hidden;
    }
    .heat-scale-bar i { flex: 1; }

    /* مقالة القراءة */
    .read-box {
      background: linear-gradient(135deg, rgba(212,175,55,.06), transparent);
      border: 1px solid rgba(212,175,55,.2); border-radius: 14px;
      padding: 18px 20px; margin-top: 14px;
    }
    .read-h { font-size: .98rem; font-weight: 800; color: var(--gold); margin-bottom: 10px; }
    .read-p { font-size: .86rem; line-height: 1.9; color: var(--txt); }
    .read-p b { color: var(--gold); }
    .read-rel {
      display: flex; align-items: center; gap: 8px; padding: 9px 12px;
      background: rgba(255,255,255,.035); border-radius: 10px; margin-top: 9px;
      font-size: .82rem; border-right: 2.5px solid var(--muted);
    }
    .read-rel.up { border-right-color: var(--sec); }
    .read-rel.down { border-right-color: var(--red2); }
    .read-rel .rr-a { font-weight: 800; }
    .read-rel .rr-t { color: var(--muted); }


    /* ══════ TICKER ROW — 6 كروت ثابتة ══════ */
    .ticker-row { margin: 16px 0; }
    .ticker-row-scroll {
      display: grid; grid-template-columns: repeat(6, 1fr); gap: 9px;
    }
    @media (max-width: 900px) { .ticker-row-scroll { grid-template-columns: repeat(3, 1fr); } }
    @media (max-width: 500px) { .ticker-row-scroll { grid-template-columns: repeat(2, 1fr); } }
    .tk-mini {
      background: linear-gradient(145deg, color-mix(in srgb, var(--tc) 12%, transparent), rgba(255,255,255,.02));
      border: 1px solid color-mix(in srgb, var(--tc) 32%, transparent);
      border-radius: 13px; padding: 13px 11px; text-align: center;
    }
    .tk-mini .tkm-n { font-size: .7rem; color: var(--muted); margin-bottom: 6px; font-weight: 700; }
    .tk-mini .tkm-v { font-size: 1.15rem; font-weight: 900; color: var(--tc); line-height: 1.15; }
    .tk-mini .tkm-c { font-size: .76rem; font-weight: 800; margin-top: 3px; }


    /* ══════ BULL vs BEAR CARD ══════ */
    .bb-card {
      display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center;
      background: linear-gradient(120deg, rgba(34,197,94,.11) 0%, rgba(16,42,67,.4) 48%, rgba(239,68,68,.11) 100%);
      border: 1px solid var(--line); border-radius: 20px; padding: 22px 24px; margin: 16px 0;
      position: relative; overflow: hidden;
    }
    .bb-card::after {
      content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 1px;
      background: linear-gradient(180deg, transparent, var(--line), transparent);
      transform: translateX(-50%);
    }
    .bb-side { text-align: center; z-index: 1; }
    .bb-animal { font-size: 2.6rem; line-height: 1; display: block; transition: transform .3s; }
    .bb-label { font-size: .68rem; font-weight: 800; margin-top: 6px; letter-spacing: 1px; }
    .bb-side.bull .bb-animal { filter: drop-shadow(0 0 14px rgba(34,197,94,.5)); }
    .bb-side.bear .bb-animal { filter: drop-shadow(0 0 14px rgba(239,68,68,.5)); }
    .bb-side.bull .bb-label { color: #22c55e; }
    .bb-side.bear .bb-label { color: #ef4444; }
    .bb-side.dim .bb-animal { opacity: .3; filter: grayscale(1); }
    .bb-side.dim .bb-label { color: var(--muted); opacity: .6; }

    .bb-center { text-align: center; z-index: 1; }
    .bb-gauge {
      width: 128px; height: 128px; border-radius: 50%; margin: 0 auto 12px;
      display: flex; flex-direction: column; align-items: center; justify-content: center;
      border: 4px solid; position: relative;
    }
    .bb-gauge.bull { border-color: #22c55e; background: rgba(34,197,94,.1); box-shadow: 0 0 30px rgba(34,197,94,.18); }
    .bb-gauge.bear { border-color: #ef4444; background: rgba(239,68,68,.1); box-shadow: 0 0 30px rgba(239,68,68,.18); }
    .bb-gauge.neutral { border-color: var(--gold); background: rgba(212,175,55,.1); }
    .bb-gauge .g-v { font-size: 2.9rem; font-weight: 900; line-height: 1; }
    .bb-gauge.bull .g-v { color: #22c55e; }
    .bb-gauge.bear .g-v { color: #ef4444; }
    .bb-gauge.neutral .g-v { color: var(--gold); }
    .bb-gauge .g-l { font-size: .66rem; color: var(--muted); margin-top: 5px; }

    .bb-verdict { font-size: 1.05rem; font-weight: 900; letter-spacing: .3px; }
    .bb-verdict.bull { color: #22c55e; }
    .bb-verdict.bear { color: #ef4444; }
    .bb-verdict.neutral { color: var(--gold); }
    .bb-sub { font-size: .74rem; color: var(--muted); margin-top: 5px; }
    .bb-factors { display: flex; gap: 6px; justify-content: center; margin-top: 11px; flex-wrap: wrap; }
    .bb-factors span {
      font-size: .68rem; padding: 3px 9px; border-radius: 6px;
      background: rgba(255,255,255,.05); color: var(--muted);
    }
    .bb-factors span b.pos { color: #22c55e; }
    .bb-factors span b.neg { color: #ef4444; }

    /* Global asset cards — SIMPLE colors only */
    .ga-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
    @media (max-width: 800px) { .ga-grid { grid-template-columns: repeat(2, 1fr); } }
    .ga {
      background: rgba(255,255,255,.035);
      border: 1px solid var(--line); border-radius: 14px;
      padding: 16px 14px; text-align: center;
      transition: all .22s;
    }
    .ga:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.3); }
    .ga .ga-n { font-size: .74rem; color: var(--muted); font-weight: 700; margin-bottom: 7px; }
    .ga .ga-v { font-size: 1.4rem; font-weight: 900; line-height: 1.15; }
    .ga .ga-c { font-size: .82rem; font-weight: 800; margin-top: 4px; }
    .ga.up  { border-color: rgba(34,197,94,.3); }
    .ga.down{ border-color: rgba(239,68,68,.3); }
    .ga.up   .ga-v, .ga.up   .ga-c { color: #22c55e; }
    .ga.down .ga-v, .ga.down .ga-c { color: #ef4444; }
    .ga.flat .ga-v, .ga.flat .ga-c { color: var(--muted); }


    /* ═══ BULL/BEAR — نفس حجم كارت التيكر ═══ */
    .bb-strip {
      display: grid; grid-template-columns: 62px 1fr 62px;
      align-items: center; gap: 14px;
      background: linear-gradient(100deg, rgba(34,197,94,.10), rgba(16,42,67,.35) 50%, rgba(239,68,68,.10));
      border: 1px solid var(--line); border-radius: 14px;
      padding: 12px 16px; margin: 12px 0;
    }
    .bbs-animal { font-size: 2rem; text-align: center; line-height: 1; }
    .bbs-side.bear .bbs-animal { filter: drop-shadow(0 0 10px rgba(239,68,68,.45)); }
    .bbs-side.bull .bbs-animal { filter: drop-shadow(0 0 10px rgba(34,197,94,.45)); }
    .bbs-side.dim .bbs-animal { opacity: .28; filter: grayscale(1); }
    .bbs-txt { font-size: .62rem; font-weight: 900; letter-spacing: 1.4px; text-align: center; margin-top: 2px; }
    .bbs-side.bear .bbs-txt { color: #ef4444; }
    .bbs-side.bull .bbs-txt { color: #22c55e; }
    .bbs-side.dim .bbs-txt { color: var(--muted); opacity: .6; }

    .bbs-mid { text-align: center; }
    .bbs-row { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; }
    .bbs-gauge {
      width: 54px; height: 54px; border-radius: 50%; flex-shrink: 0;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.25rem; font-weight: 900; border: 2.5px solid;
    }
    .bbs-gauge.bull { border-color: #22c55e; color: #22c55e; background: rgba(34,197,94,.1); }
    .bbs-gauge.bear { border-color: #ef4444; color: #ef4444; background: rgba(239,68,68,.1); }
    .bbs-gauge.neutral { border-color: var(--gold); color: var(--gold); background: rgba(212,175,55,.1); }
    .bbs-info { text-align: right; }
    .bbs-v { font-size: .95rem; font-weight: 900; }
    .bbs-v.bull { color: #22c55e; }
    .bbs-v.bear { color: #ef4444; }
    .bbs-v.neutral { color: var(--gold); }
    .bbs-s { font-size: .68rem; color: var(--muted); margin-top: 1px; }


    /* ══════ MARKETS PAGE ══════ */

:root{
  --pri:#0a1929; --pri2:#0d2137; --pri3:#102a43;
  --sec:#16c79a; --sec2:#4dabf7;
  --gold:#d4af37; --gold2:#f4d03f;
  --red:#ff5252; --red2:#ff8a80;
  --muted:#8b9eb0; --txt:#e3eaf2; --line:rgba(255,255,255,.08);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{margin:0;padding:0 10px 50px;
  background:radial-gradient(1200px 600px at 50% -10%,#12283f 0%,var(--pri) 55%);
  color:var(--txt);font-family:"Tajawal","Cairo",system-ui,sans-serif;min-height:100vh}
.wrap{max-width:760px;margin:0 auto}

/* ===== HEADER ===== */
.hd{padding:14px 4px 8px}
.hd h1{margin:0;font-size:1.12rem;color:var(--gold);font-weight:900;display:flex;align-items:center;gap:8px}
.hd .sub{font-size:.7rem;color:var(--muted);margin-top:3px}

/* ===== شريط حالة السوق الحيّ ===== */
.mktbar{display:flex;gap:7px;overflow-x:auto;padding:4px 0 10px;scrollbar-width:none}
.mktbar::-webkit-scrollbar{display:none}
.mbar{flex:1 1 0;min-width:150px;background:rgba(255,255,255,.04);border:1px solid var(--line);
  border-radius:13px;padding:9px 11px}
.mbar .nm{font-size:.68rem;color:var(--muted);font-weight:700;margin-bottom:3px}
.mbar .vl{font-size:1.02rem;font-weight:900;line-height:1}
.mbar .ch{font-size:.7rem;font-weight:800;margin-top:3px;display:block}
.ph{display:inline-block;padding:3px 8px;border-radius:6px;font-size:.62rem;font-weight:800}
.ph-open{background:rgba(22,199,154,.16);color:var(--sec)}
.ph-closed{background:rgba(139,158,176,.12);color:var(--muted)}
.ph-pre{background:rgba(212,175,55,.15);color:var(--gold2)}

/* ===== التابات ===== */
.tabs{display:flex;gap:6px;background:rgba(0,0,0,.28);padding:4px;border-radius:13px;margin-bottom:13px}
.tab{flex:1;padding:10px 6px;border-radius:10px;border:none;background:transparent;color:var(--muted);
  font-family:inherit;font-size:.81rem;font-weight:800;cursor:pointer;transition:.2s;
  display:flex;align-items:center;justify-content:center;gap:5px}
.tab.active{background:linear-gradient(135deg,var(--gold),#b8860b);color:var(--pri)}
.tab .ic{font-size:.95rem}

/* ===== الفلتر فوق السيرش ===== */
.filters{display:flex;gap:5px;margin-bottom:10px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.filters::-webkit-scrollbar{display:none}
.fbtn{flex:0 0 auto;padding:6px 11px;border-radius:9px;background:rgba(255,255,255,.05);border:1px solid var(--line);
  color:var(--muted);font-family:inherit;font-size:.73rem;font-weight:700;cursor:pointer;transition:.18s}
.fbtn.on{background:rgba(212,175,55,.16);border-color:var(--gold);color:var(--gold2)}

/* ===== السيرش ===== */
.srch{display:flex;gap:7px;margin-bottom:13px}
.srch input{flex:1;min-width:0;padding:11px 14px;border-radius:11px;background:var(--pri2);
  border:1px solid var(--line);color:var(--txt);font-family:inherit;font-size:.9rem;font-weight:700;outline:none}
.srch input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,175,55,.1)}

/* ===== بطاقة المؤشر ===== */
.idx{background:linear-gradient(135deg,var(--pri2),var(--pri));border:1px solid var(--line);
  border-radius:16px;padding:14px;margin-bottom:12px;position:relative;overflow:hidden}
.idx::before{content:'';position:absolute;inset:0 0 auto 0;height:3px;
  background:linear-gradient(90deg,var(--gold),var(--sec))}
.idx .in{font-size:.76rem;color:var(--muted);font-weight:700}
.idx .iv{font-size:1.7rem;font-weight:900;color:#fff;line-height:1.15;margin:3px 0}
.idx .ic{font-size:.88rem;font-weight:800}
.up{color:var(--sec)}.down{color:var(--red2)}
.idx .im{margin-top:9px;padding-top:9px;border-top:1px solid var(--line);
  display:flex;gap:14px;flex-wrap:wrap;font-size:.71rem;color:var(--muted)}
.idx .im b{color:var(--txt);font-weight:800}

/* ===== كروت الأسهم ===== */
.grid{display:grid;gap:9px}
.scard{background:linear-gradient(160deg,var(--pri2),var(--pri));border:1px solid var(--line);
  border-radius:14px;padding:12px;cursor:pointer;transition:.18s;position:relative;overflow:hidden}
.scard:active{transform:scale(.985)}
.scard::before{content:'';position:absolute;inset:0 auto 0 0;width:3px;background:var(--muted)}
.scard.up::before{background:var(--sec)}
.scard.down::before{background:var(--red2)}
.sh{display:flex;justify-content:space-between;align-items:flex-start;gap:9px;margin-bottom:8px}
.scd{font-size:.9rem;font-weight:900;color:#fff;display:flex;align-items:center;gap:6px}
.snm{font-size:.7rem;color:var(--muted);font-weight:600;margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}
.spx{text-align:left;white-space:nowrap}
.spx b{font-size:1rem;font-weight:900;color:#fff}
.spx span{font-size:.74rem;font-weight:800;display:block;margin-top:1px}

/* شريط النتيجة */
.sbar{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.sbar .tk{flex:1;height:7px;border-radius:5px;background:rgba(255,255,255,.07);overflow:hidden}
.sbar .fl{height:100%;border-radius:5px;transition:width .8s cubic-bezier(.4,0,.2,1)}
.sbar .nv{font-size:.78rem;font-weight:900;width:26px;text-align:left}
.g{background:linear-gradient(90deg,#0e9e7d,var(--sec))}
.m{background:linear-gradient(90deg,#b8860b,var(--gold2))}
.b{background:linear-gradient(90deg,#c0392b,var(--red2))}

/* شارات */
.bdg{display:inline-block;padding:2px 7px;border-radius:5px;font-size:.62rem;font-weight:800}
.b-buy{background:rgba(22,199,154,.16);color:var(--sec)}
.b-hold{background:rgba(212,175,55,.15);color:var(--gold2)}
.b-sell{background:rgba(255,82,82,.15);color:var(--red2)}
.b-otc{background:rgba(255,82,82,.14);color:var(--red2)}

.rmet{display:flex;gap:9px;flex-wrap:wrap;font-size:.66rem;color:var(--muted);margin-top:6px}
.rmet span b{color:var(--txt);font-weight:800}

.load{padding:40px;text-align:center;color:var(--muted);font-size:.86rem}
.spin{display:inline-block;width:15px;height:15px;border:2px solid rgba(212,175,55,.25);
  border-top-color:var(--gold);border-radius:50%;animation:sp .7s linear infinite;vertical-align:-2px;margin-left:7px}
@keyframes sp{to{transform:rotate(360deg)}}
.err{padding:22px;text-align:center;color:var(--red2);font-size:.84rem;line-height:1.8}
.count{font-size:.71rem;color:var(--muted);margin-bottom:8px;padding:0 3px}
.empty{padding:34px;text-align:center;color:var(--muted);font-size:.84rem}

/* ══════ كارت القرار (Modal) ══════ */
.mlay{position:fixed;inset:0;background:rgba(2,8,16,.94);z-index:100;
  display:none;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0}
.mlay.on{display:block}
.mbox{max-width:760px;margin:0 auto;min-height:100%;padding:0 10px 40px;
  background:radial-gradient(900px 500px at 50% 0,#12283f 0%,transparent 70%)}
.mbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:9px;
  padding:12px 4px;background:rgba(10,25,41,.96);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line)}
.mbar .ttl{flex:1;font-size:.88rem;font-weight:900;color:var(--gold);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mbtn{padding:8px 13px;border-radius:9px;border:1px solid var(--line);
  background:rgba(255,255,255,.05);color:var(--muted);font-family:inherit;
  font-size:.76rem;font-weight:800;cursor:pointer;white-space:nowrap}
.mbtn:hover{border-color:var(--gold);color:var(--gold2)}
.mbtn.tv{border-color:rgba(77,171,247,.4);color:var(--sec2)}
.mcard{background:linear-gradient(160deg,var(--pri2),var(--pri));border:1px solid var(--line);
  border-radius:16px;padding:14px;margin-bottom:11px}
.msec{font-size:.75rem;font-weight:900;color:var(--gold);margin:0 0 9px;
  padding-bottom:5px;border-bottom:1px solid var(--line)}
.marm{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.marm .nm2{width:62px;flex-shrink:0;font-size:.72rem;font-weight:700}
.marm .tk2{flex:1;height:7px;border-radius:5px;background:rgba(255,255,255,.07);overflow:hidden}
.marm .fl2{height:100%;border-radius:5px;transition:width .7s}
.marm .nv2{width:26px;text-align:left;font-size:.74rem;font-weight:900}
.mbig{text-align:center;padding:6px 0 2px}
.mring{position:relative;width:118px;height:118px;margin:0 auto 8px}
.mring .v{position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center}
.mring .v b{font-size:1.9rem;font-weight:900;color:#fff;line-height:1}
.mring .v span{font-size:.6rem;color:var(--muted);font-weight:700}
.mflag{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;border-radius:10px;
  background:rgba(255,255,255,.035);border-right:3px solid var(--line);
  font-size:.76rem;line-height:1.6;margin-bottom:5px}
.mflag.red{border-right-color:var(--red2)}
.mflag.gold{border-right-color:var(--gold2)}
.mflag.grn{border-right-color:var(--sec)}
.mflag b{color:#fff}

.foot{text-align:center;font-size:.68rem;color:var(--muted);line-height:1.8;padding:14px 8px 0}


    /* ═══ كارت القرار Modal ═══ */
    @keyframes omIn { from { opacity:0; transform:scale(.97) translateY(8px);} to { opacity:1; transform:none;} }
    @keyframes omInB { from { opacity:0; transform:translateY(12px);} to { opacity:1; transform:none;} }
    .omb{max-width:820px;margin:0 auto;min-height:100%;padding:0 12px 60px}
    .ombar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:9px;
      padding:13px 4px;background:rgba(10,25,41,.97);backdrop-filter:blur(10px);
      border-bottom:1px solid rgba(255,255,255,.08)}
    .omttl{flex:1;font-size:.98rem;font-weight:900;color:#d4af37;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .omb2,.omfull,.omback{padding:8px 12px;border-radius:9px;border:1px solid rgba(255,255,255,.1);
      background:rgba(255,255,255,.05);color:#8b9eb0;font-family:inherit;font-size:.76rem;
      font-weight:700;cursor:pointer;white-space:nowrap}
    .omfull{border-color:rgba(212,175,55,.4);background:rgba(212,175,55,.12);color:#d4af37}
    .omfull:hover{background:rgba(212,175,55,.22)}
    .omback:hover{background:rgba(255,255,255,.12);color:#e3eaf2}
    .omx{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.1);
      background:rgba(255,255,255,.06);color:#e3eaf2;font-size:1.2rem;cursor:pointer;
      display:grid;place-items:center;flex-shrink:0;font-family:inherit}
    .omx:hover{background:rgba(255,82,82,.18);color:#ff8a80}

    .dc-result{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:15px;padding:18px}
    .dcr-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
    .dcr-code{font-size:1.5rem;font-weight:900;color:var(--gold)}
    .dcr-name{font-size:.92rem;color:var(--txt);margin-top:2px}
    .dcr-sect{font-size:.72rem;color:var(--muted);margin-top:3px}
    .dcr-price{text-align:left}
    .dcr-p{font-size:1.8rem;font-weight:900;color:var(--txt);line-height:1.1}
    .dcr-c{font-size:.86rem;font-weight:800;margin-top:2px}
    .dcr-c.pos{color:var(--sec)} .dcr-c.neg{color:var(--red2)}
    .dcr-scores{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:9px;margin-top:16px}
    .dcr-score{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:11px;padding:12px;text-align:center}
    .ds-v{font-size:1.5rem;font-weight:900;line-height:1.15}
    .ds-l{font-size:.68rem;color:var(--muted);margin-top:3px}
    .dc-axes{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px}
    .dc-axis{background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:11px;padding:11px;text-align:center}
    .da-n{font-size:.7rem;color:var(--muted)}
    .da-v{font-size:1.3rem;font-weight:900;line-height:1.2;margin:4px 0 6px}
    .da-bar{height:4px;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden}
    .da-bar i{display:block;height:100%}
    .dc-fv{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;
      padding:12px 15px;background:rgba(212,175,55,.08);border:1px solid rgba(212,175,55,.25);
      border-radius:11px;font-size:.86rem;flex-wrap:wrap}
    .dc-fv b{color:var(--gold);font-size:1rem}
    .dc-facts{display:flex;flex-direction:column;gap:7px}
    .dc-fact{font-size:.82rem;padding:9px 12px;border-radius:9px;background:rgba(255,255,255,.035);line-height:1.6}
    .dc-fact.pos{border-right:2.5px solid var(--sec)}
    .dc-fact.neg{border-right:2.5px solid var(--red2)}
    .dc-fact.inv{border-right:2.5px solid var(--gold);background:rgba(212,175,55,.07)}
    .dc-sect-h{display:flex;align-items:center;gap:8px;font-size:.92rem;font-weight:800;
      color:var(--gold);margin:20px 0 12px}
    .dc-sect-h small{font-size:.7rem;color:var(--muted);font-weight:500}

    /* ═══ لايت مود ═══ */
    body.light{
      --pri:#fff; --pri2:#fff; --pri3:#f9fafb;
      --txt:#111827; --muted:#6b7280; --line:#e5e7eb;
      --gold:#b8860b; --gold2:#d4af37; --sec:#059669; --sec2:#0284c7;
      --red:#dc2626; --red2:#dc2626; --white:#fff;
      background:#fff!important; background-image:none!important; color:#111827!important;
    }
    body.light .octa-topbar{background:#fff;border-bottom-color:#e5e7eb}
    body.light .arm-btn{background:#f9fafb;border-color:#e5e7eb;color:#6b7280}
    body.light .arm-btn.active{background:#fffbeb;border-color:#b8860b;color:#92400e}
    body.light .dc-result,body.light .dcr-score,body.light .dc-axis,body.light .dc-fact,
    body.light .da-bar,body.light .dc-stock,body.light .bb-strip,body.light .tk-mini,
    body.light .ic,body.light .ic-row,body.light .ic-list li,body.light .arm-stat,
    body.light .arm-hero,body.light .si-score,body.light .dash-kpi,body.light .why-box,
    body.light .smart-search,body.light .ss-results,body.light .stress-card,
    body.light .dc-bigbtn,body.light .opp-card{background:#f9fafb!important;border-color:#e5e7eb!important}
    body.light .dc-fact.pos{background:#ecfdf5!important}
    body.light .dc-fact.neg{background:#fef2f2!important}
    body.light .dc-fact.inv,body.light .dc-fv{background:#fffbeb!important}
    body.light .dcr-code,body.light .ds-code,body.light .ic-t,body.light .dcr-p{color:#111827!important}
    body.light .dc-sect-h,body.light .ds-score,body.light .da-v{color:#b8860b!important}
    body.light .dc-s,body.light .dc-loading{color:#6b7280!important}
    body.light .ombar{background:rgba(255,255,255,.97);border-bottom-color:#e5e7eb}
    body.light .omttl{color:#b8860b}
    body.light .omx,body.light .omb2,body.light .omback{background:#f9fafb;border-color:#e5e7eb;color:#111827}

    /* ═══ التنبيه التعليمي — سطر واحد ═══ */
    .edu-banner{max-width:1400px;margin:0 auto 12px;padding:0 22px}
    .edu-inner{display:flex;gap:10px;align-items:flex-start;
      background:linear-gradient(135deg,rgba(212,175,55,.06),rgba(212,175,55,.02));
      border:1px solid rgba(212,175,55,.18);border-radius:12px;padding:9px 13px}
    .edu-icon{font-size:.95rem;flex-shrink:0;line-height:1.6}
    .edu-text{font-size:.74rem;color:var(--muted);line-height:1.65}
    .edu-text .edu-h{display:inline;color:var(--gold);font-weight:800;font-size:.76rem;margin-right:4px}
    .edu-toggle{background:none;border:none;color:var(--gold);font-size:.7rem;cursor:pointer;
      font-weight:700;font-family:inherit;text-decoration:underline;text-underline-offset:2px;margin-right:4px}
    .edu-more{display:none;margin-top:7px;padding-top:7px;border-top:1px solid rgba(212,175,55,.15)}
    .edu-more.open{display:block}
    .edu-more li{font-size:.72rem;color:var(--muted);margin-bottom:2px;line-height:1.6}
    body.light .edu-inner{background:#fffbeb;border-color:#fde68a}
    body.light .edu-text{color:#78716c}

    /* ═══ كارت القرار في ذراع السوق ═══ */
    .dc-card{background:linear-gradient(140deg,rgba(212,175,55,.07),rgba(16,42,67,.35));
      border:1px solid rgba(212,175,55,.28);border-radius:20px;padding:22px;margin-bottom:22px}
    .dc-head{margin-bottom:14px}
    .dc-t{font-size:1.2rem;font-weight:900;color:var(--gold)}
    .dc-s{font-size:.8rem;color:var(--muted);margin-top:2px}
    .dc-grid{min-height:90px;display:flex;align-items:center;justify-content:center}
    .dc-loading{color:var(--muted);font-size:.86rem}
    .dc-stocks{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:9px}
    .dc-stock{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:13px;
      padding:13px 10px;text-align:center;cursor:pointer;transition:all .2s}
    .dc-stock:hover{border-color:rgba(212,175,55,.45);transform:translateY(-2px)}
    .ds-code{font-size:.88rem;font-weight:900;color:var(--txt)}
    .ds-name{font-size:.66rem;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .ds-score{font-size:1.45rem;font-weight:900;line-height:1.15;margin-top:6px}
    .ds-chg{font-size:.74rem;font-weight:800;margin-top:2px}
    .ds-chg.pos{color:var(--sec)} .ds-chg.neg{color:var(--red2)}
    .dc-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    @media(max-width:700px){.dc-cols{grid-template-columns:1fr}}
    .dc-col-h{font-size:.86rem;font-weight:900;margin-bottom:9px}
    .dc-col-h.up{color:var(--sec)} .dc-col-h.down{color:var(--red2)}
    .dc-bigbtn{display:flex;align-items:center;gap:14px;width:100%;
      background:linear-gradient(135deg,rgba(56,189,248,.12),rgba(255,255,255,.02));
      border:1px solid rgba(56,189,248,.32);border-radius:16px;padding:18px 20px;
      cursor:pointer;transition:all .22s;text-align:right;font-family:inherit;color:var(--txt)}
    .dc-bigbtn:hover{transform:translateY(-2px);border-color:rgba(56,189,248,.55)}
    .dc-bigbtn>span{font-size:2rem}
    .dc-bigbtn b{display:block;font-size:1rem;color:#38bdf8;font-weight:900}
    .dc-bigbtn small{font-size:.76rem;color:var(--muted)}
    body.light .dc-bigbtn{background:#f0f9ff!important;border-color:#bae6fd!important}


    /* ═══ شريط نسبة الصعود/الهبوط ═══ */
    .bar-stock {
      background: rgba(255,255,255,.035); border: 1px solid var(--line);
      border-radius: 12px; padding: 11px 13px; margin-bottom: 8px;
      display: grid; grid-template-columns: 1fr auto; gap: 8px;
      align-items: center; cursor: pointer; transition: all .2s;
    }
    .bar-stock:hover { border-color: rgba(212,175,55,.4); background: rgba(212,175,55,.05); }
    .bs-l { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
    .bs-t { display: flex; align-items: center; gap: 8px; }
    .bs-code { font-size: .84rem; font-weight: 900; color: var(--txt); }
    .bs-name { font-size: .7rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .bs-track {
      height: 9px; background: rgba(255,255,255,.07); border-radius: 5px;
      overflow: hidden; position: relative;
    }
    .bs-fill { height: 100%; border-radius: 5px; transition: width .5s ease; }
    .bs-fill.up { background: linear-gradient(90deg, #059669, #16c79a); }
    .bs-fill.down { background: linear-gradient(90deg, #dc2626, #ff5252); }
    .bs-val { font-size: .8rem; font-weight: 900; min-width: 54px; text-align: left; }
    .bs-val.up { color: var(--sec); } .bs-val.down { color: var(--red2); }

    /* ═══ كارت البحث البسيط ═══ */
    .srch-card {
      background: rgba(255,255,255,.035); border: 1px solid var(--line);
      border-radius: 16px; padding: 20px; margin-bottom: 20px;
    }
    .srch-h { font-size: 1.05rem; font-weight: 900; color: var(--gold); margin-bottom: 3px; }
    .srch-s { font-size: .8rem; color: var(--muted); }

    body.light .bar-stock, body.light .srch-card { background:#f9fafb!important; border-color:#e5e7eb!important; }
    body.light .bs-code { color:#111827!important; }
    body.light .bs-track { background:#e5e7eb!important; }


    /* ═══ لوحة السهم — فوق الفلتح، تحت النافبار ═══ */
    #stockPanelHost { position: relative; z-index: 70; }
    #stockPanel { animation: spIn .3s cubic-bezier(.4,0,.2,1); }
    .octa-topbar { z-index: 160; }

    /* ══════════ كروت موحّدة ══════════ */
    .uc { background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: 15px; margin-bottom: 11px; overflow: hidden; }
    .uc:hover { border-color: rgba(212,175,55,.3); }
    .uc-head { display: flex; align-items: center; gap: 11px; padding: 13px 15px; cursor: pointer; user-select: none; }
    .uc-ico { font-size: 1.3rem; flex-shrink: 0; line-height: 1; }
    .uc-txt { flex: 1; min-width: 0; }
    .uc-title { font-size: .93rem; font-weight: 800; color: var(--txt); line-height: 1.3; }
    .uc-sub { font-size: .71rem; color: var(--muted); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .uc-arrow { font-size: .8rem; color: var(--muted); flex-shrink: 0; }
    .uc-body { display: none; padding: 0 15px 15px; }
    .uc.open .uc-body { display: block; }

    .uc-tabs { display: flex; gap: 5px; margin-bottom: 11px; flex-wrap: wrap; }
    .uc-tab { padding: 6px 12px; border-radius: 8px; font-size: .75rem; font-weight: 700;
      background: rgba(255,255,255,.05); border: 1px solid var(--line); color: var(--muted);
      cursor: pointer; font-family: inherit; }
    .uc-tab.on { background: var(--gold); color: #0a1929; border-color: var(--gold); }

    .bar-stock { background: rgba(255,255,255,.025); border: 1px solid rgba(255,255,255,.06);
      border-radius: 10px; padding: 9px 12px; margin-bottom: 6px;
      display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; cursor: pointer; }
    .bar-stock:hover { background: rgba(255,255,255,.06); }
    .bs-l { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
    .bs-t { display: flex; align-items: center; gap: 7px; }
    .bs-code { font-size: .8rem; font-weight: 900; color: var(--txt); }
    .bs-name { font-size: .67rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .bs-track { height: 7px; background: rgba(255,255,255,.055); border-radius: 4px; overflow: hidden; }
    .bs-fill { height: 100%; border-radius: 4px; }
    .bs-fill.up { background: linear-gradient(90deg, rgba(22,199,154,.4), rgba(22,199,154,.7)); }
    .bs-fill.down { background: linear-gradient(90deg, rgba(255,82,82,.35), rgba(255,82,82,.6)); }
    .bs-val { font-size: .77rem; font-weight: 900; min-width: 50px; text-align: left; }
    .bs-val.up { color: var(--sec); } .bs-val.down { color: var(--red2); }

    /* ══════════ شريط الأدوات والفلاتر ══════════ */
    .toolbar-wrap { padding: 7px 0 9px; border-top: 1px solid var(--line); background: var(--pri2); }
    .toolbar {
      display: flex; gap: 7px; overflow-x: auto; padding: 0 12px 2px;
      scrollbar-width: none; -ms-overflow-style: none; scroll-behavior: smooth;
    }
    .toolbar::-webkit-scrollbar { display: none; }
    .tool-btn {
      flex: 0 0 auto; display: flex; align-items: center; gap: 6px;
      padding: 8px 13px; border-radius: 11px; white-space: nowrap;
      background: rgba(255,255,255,.05); border: 1px solid var(--line);
      color: var(--txt); font-family: inherit; font-size: .8rem; font-weight: 700;
      cursor: pointer; transition: background .16s, border-color .16s, transform .16s;
    }
    .tool-btn:hover { background: rgba(212,175,55,.16); border-color: rgba(212,175,55,.45); transform: translateY(-1px); }
    .tool-btn.active { background: var(--gold); color: #0a1929; border-color: var(--gold); box-shadow: 0 3px 12px rgba(212,175,55,.3); }
    .tool-btn .tb-i { font-size: .95rem; line-height: 1; }

    /* زر الترتيب */
    .toolbar-wrap { position: relative; }
    .tool-cfg {
      position: absolute; top: 50%; inset-inline-start: 8px; transform: translateY(-50%);
      width: 34px; height: 34px; border-radius: 10px; cursor: pointer; font-size: .95rem;
      background: rgba(212,175,55,.14); border: 1px solid rgba(212,175,55,.4); color: var(--gold);
      display: grid; place-items: center; z-index: 5; transition: all .18s;
    }
    .tool-cfg:hover { background: rgba(212,175,55,.28); transform: translateY(-50%) scale(1.08); }
    .toolbar { padding-inline-start: 46px !important; }
    body.light .tool-cfg { background:#fffbeb; border-color:rgba(154,123,24,.5); color:#8a6d12; }

    /* ═══ لوحة ترتيب الفلاتر ═══ */
    .te-overlay {
      position: fixed; inset: 0; z-index: 3000; background: rgba(4,10,18,.78);
      backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
      display: flex; align-items: flex-end; justify-content: center; padding: 14px;
    }
    @media (min-width: 700px) { .te-overlay { align-items: center; } }
    .te-panel {
      width: 100%; max-width: 460px; max-height: 88vh; overflow-y: auto;
      background: var(--pri2, #0d2137); border: 1px solid var(--line);
      border-radius: 22px; padding: 20px; box-shadow: 0 30px 70px rgba(0,0,0,.6);
    }
    .te-h { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 6px; }
    .te-t { font-size: 1.1rem; font-weight: 900; color: var(--gold); }
    .te-s { font-size: .76rem; color: var(--muted); margin-bottom: 16px; line-height: 1.7; }
    .te-row {
      display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 13px; margin-bottom: 7px;
      background: rgba(255,255,255,.035); border: 1px solid var(--line);
    }
    .te-row.off { opacity: .42; }
    .te-ico { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; flex-shrink: 0;
      background: rgba(212,175,55,.13); border: 1px solid rgba(212,175,55,.3); font-size: 1rem; }
    .te-nm { flex: 1; min-width: 0; }
    .te-nm b { display: block; font-size: .92rem; color: var(--txt); font-weight: 800; }
    .te-nm span { font-size: .68rem; color: var(--muted); }
    .te-mv { display: flex; flex-direction: column; gap: 3px; }
    .te-btn {
      width: 30px; height: 24px; border-radius: 7px; cursor: pointer; font-size: .7rem;
      background: rgba(255,255,255,.06); border: 1px solid var(--line); color: var(--txt);
      display: grid; place-items: center; line-height: 1;
    }
    .te-btn:disabled { opacity: .28; cursor: default; }
    .te-eye { width: 34px; height: 34px; border-radius: 9px; cursor: pointer; font-size: .9rem; flex-shrink: 0;
      background: rgba(255,255,255,.06); border: 1px solid var(--line); }
    .te-eye.on { background: rgba(212,175,55,.2); border-color: rgba(212,175,55,.5); color: var(--gold); }
    .te-actions { display: flex; gap: 9px; margin-top: 16px; }
    .te-actions button { flex: 1; padding: 13px; border-radius: 12px; font-family: inherit;
      font-size: .86rem; font-weight: 800; cursor: pointer; border: 1px solid var(--line);
      background: rgba(255,255,255,.06); color: var(--txt); }
    .te-actions .done { background: linear-gradient(135deg,#d4af37,#f4d03f); color: #0a1929; border: none; }
    .te-badge { display: inline-block; font-size: .64rem; color: var(--sec); background: rgba(22,199,154,.14);
      border-radius: 6px; padding: 2px 8px; margin-top: 9px; }
    body.light .te-panel { background:#fff; box-shadow:0 20px 60px rgba(15,27,43,.25); }
    body.light .te-row { background:#f7f9fc; }
    body.light .te-btn, body.light .te-eye { background:#fff; }

    /* ══════════ هيرو الصفحات الجديدة ══════════ */
    .pt-hero {
      text-align: center; padding: 22px 18px 18px; margin-bottom: 18px;
      background: linear-gradient(135deg, rgba(212,175,55,.10), rgba(16,42,67,.35));
      border: 1px solid rgba(212,175,55,.28); border-radius: 20px;
    }
    .pt-ico { font-size: 2.4rem; line-height: 1; margin-bottom: 8px; }
    .pt-t { font-size: 1.45rem; font-weight: 900; margin: 0;
      background: linear-gradient(135deg,#d4af37,#f4d03f); -webkit-background-clip: text;
      background-clip: text; -webkit-text-fill-color: transparent; }
    .pt-s { font-size: .82rem; color: var(--muted); margin-top: 7px; line-height: 1.75; max-width: 640px; margin-inline: auto; }
    .pt-quick { margin-top: 22px; }
    .pt-quick-h { font-size: .78rem; font-weight: 800; color: var(--muted); margin-bottom: 10px; }
    .pt-quick .pt-chip {
      display: inline-flex; margin: 0 6px 8px 0; padding: 8px 15px; border-radius: 10px;
      background: rgba(255,255,255,.05); border: 1px solid var(--line); color: var(--txt);
      font-family: inherit; font-size: .8rem; font-weight: 800; cursor: pointer;
    }
    .pt-quick .pt-chip:hover { background: rgba(212,175,55,.16); border-color: rgba(212,175,55,.45); }

    /* ══════════ 🔍 بحث OCTA — تجربة بحث كاملة ══════════ */
    #page-octasearch { max-width: 980px; }
    .os-bar { position: relative; margin-bottom: 26px; }
    .os-input-wrap {
      display: flex; align-items: center; gap: 13px; padding: 6px 8px 6px 20px;
      background: rgba(255,255,255,.05); border: 1.5px solid var(--line);
      border-radius: 18px; transition: all .22s cubic-bezier(.4,0,.2,1);
    }
    .os-input-wrap:focus-within {
      border-color: var(--gold); background: rgba(212,175,55,.07);
      box-shadow: 0 0 0 4px rgba(212,175,55,.10), 0 10px 30px rgba(0,0,0,.18);
    }
    .os-ico { font-size: 1.35rem; flex-shrink: 0; line-height: 1; }
    .os-input {
      flex: 1; min-width: 0; background: none; border: none; outline: none;
      color: var(--txt); font-size: 1.05rem; font-family: inherit; font-weight: 600;
      padding: 16px 0;
    }
    .os-input::placeholder { color: var(--muted); font-weight: 500; }
    .os-clear {
      width: 38px; height: 38px; border-radius: 11px; flex-shrink: 0; cursor: pointer;
      background: rgba(255,255,255,.06); border: 1px solid var(--line);
      color: var(--muted); font-size: .95rem; display: none; place-items: center;
    }
    .os-clear.on { display: grid; }
    .os-hint { font-size: .76rem; color: var(--muted); margin-top: 9px; padding-inline-start: 8px; }
    .os-hint b { color: var(--gold); }
    .os-results {
      position: absolute; top: calc(100% - 22px); inset-inline: 0; z-index: 900;
      background: var(--pri2, #102a43); border: 1px solid var(--line);
      border-radius: 16px; overflow: hidden; display: none;
      box-shadow: 0 20px 55px rgba(0,0,0,.62), 0 0 0 1px rgba(255,255,255,.04);
      max-height: min(62vh, 460px); overflow-y: auto; -webkit-overflow-scrolling: touch;
    }
    .os-results.open { display: block; }
    .os-row {
      display: flex; align-items: center; gap: 13px; padding: 13px 16px;
      cursor: pointer; border-bottom: 1px solid var(--line); transition: background .12s;
    }
    .os-row:last-child { border-bottom: none; }
    .os-row:hover, .os-row.sel { background: rgba(212,175,55,.13); }
    .os-badge {
      width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; flex-shrink: 0;
      font-size: .76rem; font-weight: 900; color: var(--gold);
      background: rgba(212,175,55,.14); border: 1px solid rgba(212,175,55,.32);
    }
    .os-info { flex: 1; min-width: 0; }
    .os-code { font-size: .95rem; font-weight: 900; color: var(--txt); letter-spacing: .3px; }
    .os-name { font-size: .76rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; }
    .os-sect { display: inline-block; font-size: .64rem; color: var(--gold); margin-top: 4px;
      background: rgba(212,175,55,.12); border-radius: 6px; padding: 1px 7px; }
    .os-pr { text-align: left; flex-shrink: 0; }
    .os-p { font-size: .95rem; font-weight: 900; }
    .os-c { font-size: .74rem; font-weight: 800; margin-top: 1px; }
    .os-empty { padding: 26px 16px; text-align: center; color: var(--muted); font-size: .86rem; line-height: 1.9; }

    .os-sec { margin-bottom: 26px; }
    .os-sec-h { font-size: .92rem; font-weight: 900; color: var(--txt); margin-bottom: 12px;
      display: flex; align-items: center; gap: 9px; }
    .os-sec-s { font-size: .72rem; font-weight: 700; color: var(--muted); }
    .os-chips { display: flex; flex-wrap: wrap; gap: 8px; }
    .os-chip {
      padding: 10px 17px; border-radius: 12px; font-family: inherit; font-size: .84rem; font-weight: 800;
      cursor: pointer; color: var(--txt); background: rgba(255,255,255,.05);
      border: 1px solid var(--line); transition: all .18s;
    }
    .os-chip:hover { background: rgba(212,175,55,.16); border-color: rgba(212,175,55,.45); transform: translateY(-2px); }
    .os-chip.on { background: linear-gradient(135deg,#d4af37,#f4d03f); color: #0a1929; border-color: #d4af37; }

    .os-top { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px,1fr)); gap: 11px; }
    .os-card {
      background: rgba(255,255,255,.035); border: 1px solid var(--line); border-radius: 16px;
      padding: 15px 14px; cursor: pointer; transition: all .2s cubic-bezier(.4,0,.2,1); text-align: center;
    }
    .os-card:hover { border-color: rgba(212,175,55,.5); transform: translateY(-3px);
      box-shadow: 0 10px 26px rgba(212,175,55,.14); }
    .os-c-code { font-size: 1rem; font-weight: 900; color: var(--gold); letter-spacing: .4px; }
    .os-c-name { font-size: .68rem; color: var(--muted); white-space: nowrap; overflow: hidden;
      text-overflow: ellipsis; margin-top: 3px; }
    .os-c-score { font-size: 1.55rem; font-weight: 900; margin: 9px 0 3px; line-height: 1; }
    .os-c-dec { display: inline-block; font-size: .68rem; font-weight: 800; padding: 3px 10px; border-radius: 8px; }
    .os-c-fund { margin-top: 9px; font-size: .64rem; color: var(--muted); line-height: 1.9; display: flex; flex-wrap: wrap; gap: 5px; justify-content: center; }
    .os-sep { opacity: .45; }
    .os-calc { font-style: normal; color: var(--gold); font-size: .58rem; }
    .os-none { opacity: .6; font-style: italic; }
    body.light .os-calc { color:#8a6d12; }
    .os-load { grid-column: 1/-1; display: flex; align-items: center; gap: 11px; justify-content: center;
      padding: 36px; color: var(--muted); font-size: .88rem; }

    /* اللايت مود — البحث */
    body.light .os-input-wrap { background:#fff; border-color:var(--line); box-shadow:0 2px 8px rgba(15,27,43,.05); }
    body.light .os-results { background:#fff; box-shadow: 0 20px 55px rgba(15,27,43,.18), 0 0 0 1px var(--line); }
    body.light .os-row:hover, body.light .os-row.sel { background:#fffbeb; }
    body.light .os-row { border-bottom-color: var(--line); }
    body.light .os-code { color: var(--txt); } body.light .os-name { color: var(--muted); }
    body.light .os-chip { background:#fff; border-color:var(--line); color:var(--txt); box-shadow:0 1px 3px rgba(15,27,43,.05); }
    body.light .os-chip:hover { background:#fffbeb; border-color:rgba(154,123,24,.5); }
    body.light .os-card { background:#fff; border-color:var(--line); box-shadow:0 1px 4px rgba(15,27,43,.06); }
    body.light .os-card:hover { border-color:#d4af37; box-shadow:0 8px 22px rgba(154,123,24,.18); }
    body.light .os-c-code { color:#8a6d12; }
    body.light .os-clear { background:#f1f4f8; border-color:var(--line); color:var(--muted); }
    body.light .os-hint b { color:#8a6d12; }

    /* ══════════ 🃏 كارت القرار ══════════ */
    #page-verdict { --vring-track: rgba(255,255,255,.07); }
    .vtop { display: flex; justify-content: flex-start; margin-bottom: 12px; }
    .vphase {
      display: inline-flex; align-items: center; gap: 7px; padding: 7px 14px; border-radius: 20px;
      background: rgba(255,255,255,.05); border: 1px solid var(--line);
      font-size: .78rem; font-weight: 800; color: var(--muted);
    }
    .vphase .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--muted); flex-shrink: 0; }
    .vphase.open { color: var(--sec); border-color: rgba(22,199,154,.45); }
    .vphase.open .dot { background: var(--sec); box-shadow: 0 0 8px var(--sec); }
    .vphase.pre { color: var(--gold2); border-color: rgba(244,208,63,.45); }
    .vphase.pre .dot { background: var(--gold2); }
    .vphase.closed { color: var(--red2); border-color: rgba(255,138,128,.4); }
    .vphase.closed .dot { background: var(--red2); }
    .vpicker { display: flex; gap: 9px; margin-bottom: 12px; }
    .vpicker input {
      flex: 1; padding: 14px 16px; border-radius: 13px; font-family: inherit; font-size: .95rem;
      background: rgba(255,255,255,.05); border: 1px solid var(--line); color: var(--txt); outline: none;
    }
    .vpicker input:focus { border-color: var(--gold); }
    .vpicker button {
      padding: 14px 26px; border-radius: 13px; font-family: inherit; font-size: .92rem; font-weight: 800; cursor: pointer;
      background: linear-gradient(135deg,#d4af37,#f4d03f); color: #0a1929; border: none;
    }
    .vquick { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
    .vquick button {
      padding: 7px 13px; border-radius: 9px; font-family: inherit; font-size: .76rem; font-weight: 800; cursor: pointer;
      background: rgba(255,255,255,.05); border: 1px solid var(--line); color: var(--txt);
    }
    .vquick button:hover { background: rgba(212,175,55,.16); border-color: rgba(212,175,55,.45); }
    .vload { display: flex; align-items: center; gap: 11px; justify-content: center; padding: 50px 16px;
      color: var(--muted); font-size: .88rem; }
    .vspin { width: 18px; height: 18px; border-radius: 50%; border: 2.5px solid rgba(255,255,255,.14);
      border-top-color: var(--gold); animation: vsp 1s linear infinite; }
    @keyframes vsp { to { transform: rotate(360deg); } }
    .vcard {
      background: rgba(255,255,255,.032); border: 1px solid var(--line);
      border-radius: 18px; padding: 18px; margin-bottom: 14px; position: relative; overflow: hidden;
    }
    .vcard::before { content:''; position:absolute; top:0; right:0; left:0; height:3px;
      background: linear-gradient(90deg, rgba(212,175,55,0), rgba(212,175,55,.75), rgba(22,199,154,.6), rgba(212,175,55,0)); }
    .vcard.verr { color: var(--red2); }
    .vsec-h { font-size: .93rem; font-weight: 900; color: var(--gold); margin-bottom: 13px; }
    .vfresh { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap;
      font-size: .71rem; color: var(--muted); margin-bottom: 13px; }
    .vfresh.stale { color: var(--red2); font-weight: 800; }
    .vcard-hd { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; margin-bottom: 16px; }
    .vasset-name { font-size: 1.12rem; font-weight: 900; color: var(--txt); line-height: 1.35; }
    .vasset-code { display: inline-block; font-size: .82rem; font-weight: 900; color: var(--gold);
      background: rgba(212,175,55,.14); border: 1px solid rgba(212,175,55,.35);
      border-radius: 8px; padding: 2px 10px; margin: 6px 0; }
    .vasset-sect { font-size: .74rem; color: var(--muted); line-height: 1.65; }
    .vprice-box { text-align: left; flex-shrink: 0; }
    .vprice-val { display: block; font-size: 1.5rem; font-weight: 900; color: var(--txt); line-height: 1.15; }
    .vprice-chg { display: block; font-size: .82rem; font-weight: 900; margin-top: 4px; }
    .vprice-chg.up { color: var(--sec); } .vprice-chg.down { color: var(--red2); }
    .vring { display: flex; justify-content: center; margin: 4px 0 14px; position: relative; }
    .vring svg { display: block; }
    .vval { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
    .vval b { font-size: 1.9rem; font-weight: 900; color: var(--txt); line-height: 1; }
    .vval span { font-size: .6rem; color: var(--muted); margin-top: 3px; }
    .vverdict { font-size: 1.5rem; font-weight: 900; margin-bottom: 8px; }
    .vverdict.v-buy { color: var(--sec); } .vverdict.v-hold { color: var(--gold2); } .vverdict.v-sell { color: var(--red2); }
    .vverdict-note { font-size: .78rem; color: var(--muted); line-height: 1.8; }
    .vrf { width: 100%; margin-top: 15px; padding: 12px; border-radius: 12px; font-family: inherit;
      font-size: .85rem; font-weight: 800; cursor: pointer; color: var(--txt);
      background: rgba(255,255,255,.05); border: 1px solid var(--line); }
    .vrf:hover { background: rgba(212,175,55,.14); border-color: rgba(212,175,55,.4); }
    .varms { display: grid; grid-template-columns: 62px 40px 1fr 34px; gap: 9px; align-items: center; margin-bottom: 9px; }
    .varms-n { font-size: .78rem; font-weight: 700; color: var(--txt); }
    .varms-w { font-size: .68rem; color: var(--muted); text-align: center;
      background: rgba(255,255,255,.05); border-radius: 6px; padding: 2px 0; }
    .varms-t { height: 8px; background: rgba(255,255,255,.06); border-radius: 4px; overflow: hidden; }
    .varms-f { display: block; height: 100%; border-radius: 4px; transition: width .6s ease; }
    .varms-f.g { background: linear-gradient(90deg,#16c79a,#4dabf7); }
    .varms-f.m { background: linear-gradient(90deg,#ffc107,#d4af37); }
    .varms-f.b { background: linear-gradient(90deg,#ff5252,#ff8a65); }
    .varms-v { font-size: .78rem; font-weight: 900; text-align: center; border-radius: 7px; padding: 3px 0; min-width: 34px; }
    .varms-v.g { color: var(--sec);   background: rgba(22,199,154,.14); }
    .varms-v.m { color: var(--gold2); background: rgba(244,208,63,.14); }
    .varms-v.b { color: var(--red2);  background: rgba(255,82,82,.14); }
    .vwhy { display: flex; flex-direction: column; gap: 7px; }
    .vwhy-i { display: flex; gap: 9px; font-size: .8rem; color: var(--txt); line-height: 1.75;
      padding: 9px 11px; border-radius: 10px; background: rgba(255,255,255,.03); }
    .vwhy-i .ic { flex-shrink: 0; }
    .vwhy-i.pos { border-right: 3px solid var(--sec); }
    .vwhy-i.neg { border-right: 3px solid var(--red2); }
    .vwhy-i .src { display: block; font-size: .68rem; color: var(--muted); margin-top: 4px; }
    .vtable-wrap { overflow-x: auto; }
    .vtable { width: 100%; border-collapse: collapse; font-size: .8rem; }
    .vtable th { text-align: right; padding: 8px 10px; color: var(--muted); font-weight: 800;
      border-bottom: 1px solid var(--line); font-size: .74rem; }
    .vtable td { padding: 10px; border-bottom: 1px solid var(--line); color: var(--txt); }
    .vtable td b { color: var(--gold2); font-weight: 900; }
    .vpill { display: inline-block; padding: 3px 10px; border-radius: 8px; font-size: .72rem; font-weight: 800; }
    .vpill.p-go { background: rgba(22,199,154,.16); color: var(--sec); }
    .vpill.p-wait { background: rgba(244,208,63,.14); color: var(--gold2); }
    .vpill.p-no { background: rgba(255,82,82,.16); color: var(--red2); }
    .vnote { font-size: .72rem; color: var(--muted); margin-top: 11px; line-height: 1.8; }
    .vab-row { display: grid; grid-template-columns: 1.1fr .7fr .8fr .9fr; gap: 7px; padding: 9px 11px;
      border-radius: 9px; margin-bottom: 5px; background: rgba(255,255,255,.028); font-size: .78rem; align-items: center; }
    .vab-row.head { background: none; color: var(--muted); font-size: .72rem; font-weight: 800; }
    .vab-n { font-weight: 700; color: var(--txt); }
    .vab-c { text-align: center; color: var(--muted); font-weight: 700; }
    .vab-c.win { color: var(--gold2); font-weight: 900; }
    .vab-tot { border-top: 1px solid var(--line); margin-top: 8px; }
    .vfoot { font-size: .72rem; color: var(--muted); text-align: center; line-height: 1.9; padding: 14px 0 4px; }
    .vfoot b { color: var(--gold); }

    /* ══════════ الوضع النهاري — نظيف وواضح ══════════ */
    body.light {
      --pri:#f4f6f9; --pri2:#ffffff; --pri3:#ffffff;
      --txt:#0f1b2b; --muted:#55657a;
      --line:rgba(15,27,43,.11);
      --gold:#9a7b18; --gold2:#8a6d12; --gold3:#7a5f0e;
      --sec:#04855f; --sec2:#0369a1;
      --red:#c62828; --red2:#c62828; --red:#d32f2f;
      --white:#fff; --vring-track: rgba(15,27,43,.08);
      background: #f4f6f9 !important; background-image: none !important; color: var(--txt) !important;
    }
    body.light .octa-topbar { background: rgba(255,255,255,.97); border-bottom-color: var(--line);
      box-shadow: 0 2px 14px rgba(15,27,43,.06); }
    body.light .toolbar-wrap { background: #fff; border-top-color: var(--line); }
    body.light .tool-btn { background: #fff; border-color: var(--line); color: var(--txt); box-shadow: 0 1px 3px rgba(15,27,43,.05); }
    body.light .tool-btn:hover { background: #fffbeb; border-color: rgba(154,123,24,.5); }
    body.light .tool-btn.active { background: linear-gradient(135deg,#b8912f,#d4af37); color: #fff; border-color: #b8912f; }

    body.light .arm-btn { background:#fff; border-color:var(--line); color:#46586c; box-shadow:0 1px 3px rgba(15,27,43,.05); }
    body.light .arm-btn:hover { background:#fffbeb; border-color:rgba(154,123,24,.35); }
    body.light .arm-btn.active { background:linear-gradient(145deg,#fffbeb,#fff); border-color:#d4af37; color:#7a5f0e; box-shadow:0 2px 10px rgba(212,175,55,.2); }
    body.light .arm-btn.active .a-num { background:#d4af37; color:#fff; }
    body.light .octa-clock { background:#fff; border-color:var(--line); color:var(--muted); }
    body.light .octa-clock b { color:#8a6d12; }
    body.light .theme-toggle { background:#fff; border-color:var(--line); color:#8a6d12; }
    body.light .octa-wordmark .w2 { color:#6b7c90 !important; }
    body.light .arm-hero .ah-q { color:#0f1b2b !important; }
    body.light .arm-hero .ah-lead { color:#55657a !important; }
    body.light .arm-hero { background: linear-gradient(135deg, rgba(212,175,55,.10), #fff 70%) !important; }
    body.light .arm-hero .ah-ico { opacity:.08; }

    /* الشريط العلوي القديم */
    body.light .top-bar { background: rgba(255,255,255,.96) !important; border-bottom-color: var(--line) !important; }
    body.light .logo-text { background: linear-gradient(135deg,#8a6d12,#b8912f,#8a6d12);
      -webkit-background-clip: text; background-clip: text; }

    body.light .arm-hero, body.light .uc, body.light .arm-stats,
    body.light .vcard, body.light .pt-hero, body.light .edu-inner,
    body.light .dc-card, body.light .dc-stock, body.light .dc-fact,
    body.light .dc-result, body.light .dc-axis, body.light .why-box,
    body.light .smart-search, body.light .ss-results, body.light .stress-card,
    body.light .dc-bigbtn, body.light .opp-card, body.light .tk-mini,
    body.light .ic, body.light .ic-row, body.light .ic-list li,
    body.light .ombar, body.light .omx, body.light .omb2, body.light .omback {
      background:#fff !important; border-color:var(--line) !important;
      box-shadow: 0 1px 4px rgba(15,27,43,.06);
    }
    body.light .uc.open { box-shadow: 0 4px 18px rgba(15,27,43,.09); }
    body.light .pt-hero { background: linear-gradient(135deg,#fffdf5,#fff) !important; border-color:rgba(154,123,24,.28) !important; }
    body.light .pt-t { background: linear-gradient(135deg,#8a6d12,#b8912f); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
    body.light .uc-title, body.light .uc-sub, body.light .arm-q, body.light .dc-t { color: var(--txt) !important; }
    body.light .uc-sub, body.light .arm-lead, body.light .dc-s { color: var(--muted) !important; }
    body.light .uc-head { border-bottom: 1px solid var(--line); }

    body.light .vcard::before { background: linear-gradient(90deg, rgba(154,123,24,0), rgba(154,123,24,.7), rgba(4,133,95,.55), rgba(154,123,24,0)); }
    body.light .vsec-h, body.light .vasset-code, body.light .vnote b { color: var(--gold) !important; }
    body.light .vwhy-i, body.light .vab-row:not(.head) { background: #f7f9fc; }
    body.light .varms-t, body.light .vphase { background: #f1f4f8; }
    body.light .vtable th { color: var(--muted); }
    body.light .vpicker input { background:#fff; border-color:var(--line); color:var(--txt); }
    body.light .vpicker input::placeholder { color:#93a2b4; }
    body.light .vquick button, body.light .pt-quick .pt-chip { background:#fff; border-color:var(--line); color:var(--txt); }
    body.light .vrf { background:#f7f9fc; border-color:var(--line); color:var(--txt); }
    body.light .vval b, body.light .vasset-name { color: var(--txt); }
    body.light .vtable td { color: var(--txt); }

    body.light .dc-fact.pos { background:#ecfdf5 !important; } body.light .dc-fact.neg { background:#fef2f2 !important; }
    body.light .dc-fact.inv, body.light .dc-fv { background:#fffbeb !important; }
    body.light .ad-track, body.light .dist-track, body.light .comp-track, body.light .da-bar { background: rgba(15,27,43,.09) !important; }
    body.light .dash-kpi .k-val { color:#8a6d12 !important; }
    body.light .edu-inner { background:#fffbeb !important; border-color:#fde68a !important; }
    body.light .edu-text { color:#57534e !important; }
    body.light .screener-tab { background:#fff; border-color:var(--line); color:#46586c; }
    body.light .page-title { background: linear-gradient(135deg,#8a6d12,#b8912f); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
    body.light .quick-card, body.light .opps-loading { color: var(--muted); }


    /* ══════════ كارت قرار OCTA ══════════ */
    .vc-top { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
    .vc-ring { width: 74px; height: 74px; flex-shrink: 0; position: relative; }
    .vc-ring svg { transform: rotate(-90deg); }
    .vc-ring .vc-pct {
      position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
      font-size: 1.05rem; font-weight: 900; color: var(--gold);
    }
    .vc-meta { flex: 1; min-width: 0; }
    .vc-verdict { font-size: 1.15rem; font-weight: 900; line-height: 1.3; }
    .vc-sub { font-size: .74rem; color: var(--muted); margin-top: 4px; line-height: 1.5; }
    .vc-dist { display: flex; height: 9px; border-radius: 5px; overflow: hidden; margin: 12px 0 6px; background: rgba(255,255,255,.06); }
    .vc-dist i { display: block; height: 100%; }
    .vc-legend { display: flex; flex-wrap: wrap; gap: 10px; font-size: .7rem; color: var(--muted); }
    .vc-legend b { font-weight: 900; }
    .vc-axes { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
    .vc-ax { display: grid; grid-template-columns: 68px 1fr 34px; gap: 8px; align-items: center; }
    .vc-ax-n { font-size: .72rem; color: var(--muted); font-weight: 700; }
    .vc-ax-t { height: 7px; background: rgba(255,255,255,.06); border-radius: 4px; overflow: hidden; }
    .vc-ax-f { height: 100%; border-radius: 4px; }
    .vc-ax-v { font-size: .72rem; font-weight: 900; text-align: left; }
    .vc-pick {
      display: flex; align-items: center; gap: 10px; padding: 9px 11px; border-radius: 10px;
      background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.06);
      margin-bottom: 6px; cursor: pointer;
    }
    .vc-pick:hover { background: rgba(255,255,255,.07); }
    .vc-p-code { font-size: .8rem; font-weight: 900; color: var(--gold); min-width: 52px; }
    .vc-p-name { flex: 1; font-size: .73rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .vc-p-dec { font-size: .7rem; font-weight: 800; padding: 3px 8px; border-radius: 7px; }
    .vc-p-sc { font-size: .78rem; font-weight: 900; min-width: 38px; text-align: left; }

    .mini-row { display: grid; gap: 7px; }
    .mini-row.c4 { grid-template-columns: repeat(4,1fr); }
    .mini-row.c6 { grid-template-columns: repeat(6,1fr); }
    @media (max-width:900px){ .mini-row.c6{grid-template-columns:repeat(3,1fr)} }
    @media (max-width:560px){ .mini-row.c4,.mini-row.c6{grid-template-columns:repeat(2,1fr)} }
    .mini { background: rgba(255,255,255,.035); border: 1px solid var(--line); border-radius: 10px; padding: 9px 5px; text-align: center; }
    .mini-n { font-size: .62rem; color: var(--muted); font-weight: 700; }
    .mini-v { font-size: .92rem; font-weight: 900; margin: 4px 0 3px; color: var(--txt); }
    .mini-c { font-size: .71rem; font-weight: 800; }
    .mini-c.up { color: var(--sec); } .mini-c.down { color: var(--red2); }
    .mini-note { font-size: .68rem; color: var(--muted); margin-top: 11px; line-height: 1.75;
      padding: 8px 11px; border-radius: 9px; background: rgba(255,255,255,.028); border: 1px solid var(--line); }
    body.light .mini-note { background:#f7f9fc; border-color:var(--line); }

    .sec-cell { background: rgba(255,255,255,.035); border: 1px solid var(--line); border-radius: 10px;
      padding: 10px 9px; text-align: center; cursor: pointer; transition: all .2s; }
    .sec-cell:hover { transform: translateY(-2px); border-color: rgba(212,175,55,.4); }
    .sec-n { font-size: .76rem; font-weight: 800; color: var(--txt); }
    .sec-v { font-size: 1.05rem; font-weight: 900; margin: 4px 0 2px; }
    .sec-c { font-size: .65rem; color: var(--muted); }
    .sec-cell.up { border-color: rgba(22,199,154,.26); }
    .sec-cell.down { border-color: rgba(255,82,82,.26); }

    .srch-card { background: rgba(255,255,255,.035); border: 1px solid var(--line); border-radius: 15px; padding: 18px; margin-bottom: 18px; }
    .srch-h { font-size: 1rem; font-weight: 900; color: var(--gold); }
    .srch-s { font-size: .78rem; color: var(--muted); margin-top: 2px; }

    body.light .uc, body.light .bar-stock, body.light .mini, body.light .sec-cell, body.light .srch-card
      { background:#f9fafb!important; border-color:#e5e7eb!important; }
    body.light .uc-title, body.light .bs-code, body.light .mini-v, body.light .sec-n { color:#111827!important; }
    body.light .bs-track { background:#e5e7eb!important; }


    /* ══════════ أدوات الأذرع السبع ══════════ */
    .tools-hub { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); gap: 11px; }
    .tool-card {
      background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
      border: 1px solid var(--line); border-radius: 15px; padding: 18px 16px;
      cursor: pointer; transition: all .24s cubic-bezier(.4,0,.2,1); position: relative; overflow: hidden;
    }
    .tool-card::before {
      content:''; position:absolute; inset:0; opacity:0;
      background: radial-gradient(circle at 85% 12%, rgba(212,175,55,.15), transparent 62%);
      transition: opacity .24s;
    }
    .tool-card:hover { border-color: rgba(212,175,55,.42); transform: translateY(-3px); box-shadow: 0 12px 30px rgba(0,0,0,.35); }
    .tool-card:hover::before { opacity: 1; }
    .tool-num {
      position: absolute; top: 12px; left: 14px; font-size: 1.5rem; font-weight: 900;
      color: rgba(212,175,55,.22); line-height: 1;
    }
    .tool-ico { font-size: 1.5rem; margin-bottom: 10px; display: block; position: relative; }
    .tool-name { font-size: .95rem; font-weight: 800; color: var(--txt); position: relative; line-height: 1.3; }
    .tool-desc { font-size: .75rem; color: var(--muted); margin-top: 5px; position: relative; line-height: 1.6; }
    .tool-tags { display: flex; gap: 5px; margin-top: 11px; flex-wrap: wrap; position: relative; }
    .tool-tags span {
      font-size: .65rem; padding: 2px 8px; border-radius: 5px;
      background: rgba(255,255,255,.05); color: var(--muted);
    }

    /* ══════════ الأكاديمية — مميزة ══════════ */
    .acad-card {
      background: linear-gradient(135deg, rgba(168,85,247,.16), rgba(139,92,246,.06) 45%, rgba(255,255,255,.02));
      border: 1px solid rgba(168,85,247,.4); border-radius: 20px; padding: 26px;
      cursor: pointer; transition: all .28s cubic-bezier(.4,0,.2,1); position: relative; overflow: hidden;
    }
    .acad-card::before {
      content:''; position:absolute; top:-40%; left:-10%; width: 340px; height: 340px; border-radius: 50%;
      background: radial-gradient(circle, rgba(168,85,247,.2), transparent 68%);
      transition: transform .4s;
    }
    .acad-card:hover { border-color: rgba(168,85,247,.7); transform: translateY(-4px); box-shadow: 0 18px 44px rgba(139,92,246,.24); }
    .acad-card:hover::before { transform: scale(1.2); }
    .acad-badge {
      display: inline-block; padding: 4px 12px; border-radius: 20px; font-size: .7rem;
      background: rgba(168,85,247,.2); border: 1px solid rgba(168,85,247,.4);
      color: #d8b4fe; font-weight: 800; margin-bottom: 13px; position: relative;
    }
    .acad-name { font-size: 1.35rem; font-weight: 900; color: #e9d5ff; position: relative; line-height: 1.3; }
    .acad-desc { font-size: .84rem; color: var(--muted); margin-top: 8px; line-height: 1.7; position: relative; }
    .acad-items { display: flex; gap: 7px; margin-top: 16px; flex-wrap: wrap; position: relative; }
    .acad-items span {
      font-size: .72rem; padding: 5px 12px; border-radius: 8px;
      background: rgba(168,85,247,.12); border: 1px solid rgba(168,85,247,.25); color: #c4b5fd;
    }

    body.light .tool-card, body.light .acad-card { background:#faf5ff!important; border-color:#e9d5ff!important; }
    body.light .acad-name { color:#6b21a8!important; }
    body.light .tool-name { color:#111827!important; }


    /* ══════ بحثين جنب بعض ══════ */
    .dual-search { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    @media (max-width: 800px) { .dual-search { grid-template-columns: 1fr; } }
    .ds-box {
      background: rgba(255,255,255,.025); border: 1px solid var(--line);
      border-radius: 13px; padding: 14px; position: relative;
    }
    .ds-box.octa { background: rgba(212,175,55,.05); border-color: rgba(212,175,55,.25); }
    .ds-label { font-size: .74rem; color: var(--muted); font-weight: 700; margin-bottom: 10px; }
    .ds-box.octa .ds-label { color: var(--gold); }
    .ds-input {
      width: 100%; padding: 12px 15px; background: rgba(255,255,255,.05);
      border: 1px solid var(--line); border-radius: 11px; color: var(--txt);
      font-size: .9rem; font-family: inherit; outline: none; transition: all .2s;
    }
    .ds-input:focus { border-color: var(--gold); background: rgba(212,175,55,.06); }
    .ds-input::placeholder { color: var(--muted); }
    .ds-results { margin-top: 10px; max-height: 320px; overflow-y: auto; }
    .ds-row {
      display: flex; align-items: center; gap: 10px; padding: 10px 12px;
      border-radius: 10px; cursor: pointer; transition: background .15s;
      border-bottom: 1px solid rgba(255,255,255,.04);
    }
    .ds-row:hover { background: rgba(212,175,55,.1); }
    .ds-badge {
      width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center;
      font-size: .66rem; font-weight: 900; color: var(--gold);
      background: rgba(212,175,55,.13); border: 1px solid rgba(212,175,55,.25); flex-shrink: 0;
    }
    .ds-info { flex: 1; min-width: 0; }
    .ds-code { font-size: .82rem; font-weight: 800; color: var(--txt); }
    .ds-name { font-size: .68rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .ds-price { text-align: left; }
    .ds-p { font-size: .82rem; font-weight: 800; }
    .ds-c { font-size: .68rem; font-weight: 700; }
    .ds-c.pos { color: var(--sec); } .ds-c.neg { color: var(--red2); }
    .ds-empty { padding: 20px; text-align: center; color: var(--muted); font-size: .84rem; }
    body.light .ds-box { background:#f9fafb!important; border-color:#e5e7eb!important; }
    body.light .ds-box.octa { background:#fffbeb!important; border-color:#fde68a!important; }
    body.light .ds-input { background:#fff!important; border-color:#e5e7eb!important; }
    body.light .ds-row:hover { background:#fffbeb!important; }


    /* ═══ 💰 فلتر التوزيعات ═══ */
    .fli-sel { width:100%; padding:7px 9px; border-radius:9px; font-family:inherit;
      font-size:.78rem; background:var(--bg,#0a1929); color:var(--txt);
      border:1px solid var(--line); }
    .fli-check { display:flex; align-items:center; gap:7px; font-size:.76rem;
      color:var(--muted); align-self:end; padding-bottom:9px; cursor:pointer; }
    .fli-check input { accent-color:var(--gold); width:15px; height:15px; cursor:pointer; }
    .flt-dy { font-weight:900; font-size:.86rem; }
    .flt-dy i { font-style:normal; font-size:.66rem; opacity:.75; margin-inline-start:1px; }
    .flt-dy.ok  { color:#3fe0b0; }
    .flt-dy.mid { color:var(--gold); }
    .flt-dy.hi  { color:#ff8f4d; }
    .flt-inc { font-weight:800; color:#3fe0b0; font-size:.8rem;
      direction:ltr; unicode-bidi:embed; }
    .flt-warn { font-size:.65rem; color:#ff9a6b; line-height:1.55; min-width:190px;
      max-width:250px; text-align:right; white-space:normal; }
    .flt-ok { color:#3fe0b0; font-size:.7rem; }
    .flt-sweet { color:var(--sec); font-style:normal; font-size:.7rem; }
    .flt-more-w { display:inline-block; margin-top:3px; font-size:.62rem;
      color:var(--muted); cursor:help; }
    body.light .flt-more-w { color:#6b7280; }
    /* الفاتح */
    body.light .fli-sel { background:#fff; border-color:#e5e7eb; color:#111827; }
    body.light .fli-check { color:#55657a; }
    body.light .flt-dy.ok { color:#047857; }
    body.light .flt-dy.mid { color:#8a6d12; }
    body.light .flt-dy.hi { color:#c2410c; }
    body.light .flt-inc { color:#047857; }
    body.light .flt-warn { color:#c2410c; }
    body.light .flt-ok { color:#047857; }


    /* ═══ ⚡ فلتر الزخم ═══ */
    .flt-pu { display:inline; font-size:.62rem; font-weight:400; opacity:.7;
      margin-inline-start:1px; white-space:nowrap; vertical-align:baseline; }
    .flt-pct.up { color:#3fe0b0; font-weight:800; }
    .flt-pct.dn { color:#ff6b6b; font-weight:800; }
    .flt-alert { margin-bottom:15px; padding:11px 14px; border-radius:11px;
      background:rgba(212,175,55,.09); border:1px solid rgba(212,175,55,.32);
      font-size:.77rem; color:var(--muted); line-height:1.75; }
    .flt-alert b { color:var(--gold); }
    .flt-alert-s { font-size:.7rem; opacity:.85; }
    body.light .flt-alert { background:#fffbeb; border-color:#e8c65a; color:#6b5a1f; }
    body.light .flt-alert b { color:#8a6d12; }
    body.light .flt-pct.up { color:#047857; }
    body.light .flt-pct.dn { color:#b91c1c; }

    /* ══════ 🛡️ فلتر الأمان — النسخة الفاتحة ══════ */
    body.light .flt-head h2 { color:#8a6d12; }
    body.light .flt-sw { background:#fff; border-color:#e5e7eb; color:#111827; }
    body.light .flt-sw.on { background:#fffbeb; border-color:#d4af37; color:#8a6d12; }
    body.light .flt-filters { background:#f9fafb; border-color:#e5e7eb; }
    body.light .flt-sl label { color:#55657a; }
    body.light .flt-sl label b { color:#8a6d12; }
    body.light .flt-rst { background:#fff; border-color:#e5e7eb; color:#55657a; }
    /* كارت الشرح */
    body.light .flt-help-h { background:#fffbeb; border-color:#e8c65a; color:#8a6d12; }
    body.light .flt-help-h:hover { background:#fef3c7; }
    body.light .flt-help-h i { background:rgba(154,123,24,.13); }
    body.light .flt-help-b { background:#fcfcfd; border-color:#e8c65a; }
    body.light .flt-h-sec { border-bottom-color:#eef1f5; }
    body.light .flt-h-t { color:#111827; }
    body.light .flt-h-p { color:#55657a; }
    body.light .flt-h-p b { color:#8a6d12; }
    body.light .flt-h-exi { background:#ecfdf5; border-color:#6ee7b7; }
    body.light .flt-h-exi.bad { background:#fef2f2; border-color:#fca5a5; }
    body.light .flt-h-exi span { color:#55657a; }
    body.light .flt-h-exi em { color:#047857; }
    body.light .flt-h-exi.bad em { color:#b91c1c; }
    body.light .flt-h-metric { background:#fff; border-color:#e5e7eb; }
    body.light .flt-h-metric > b { color:#8a6d12; }
    body.light .flt-h-metric p { color:#55657a; }
    body.light .flt-h-metric p b { color:#111827; }
    body.light .flt-h-note { background:#f9fafb; border-inline-start-color:#d4af37; color:#55657a; }
    body.light .flt-h-wi { background:#f9fafb; border-color:#e5e7eb; }
    body.light .flt-h-wi span, body.light .flt-h-wi i { color:#55657a; }
    body.light .flt-h-wi b { color:#8a6d12; }
    body.light .flt-h-legend .hi { background:#d1fae5; color:#047857; }
    body.light .flt-h-legend .md { background:#fef3c7; color:#8a6d12; }
    body.light .flt-h-legend .lo { background:#fee2e2; color:#b91c1c; }
    body.light .flt-h-tbl th { color:#55657a; border-bottom-color:#e5e7eb; }
    body.light .flt-h-tbl td { color:#55657a; border-bottom-color:#f1f5f9; }
    body.light .flt-h-tbl td:first-child { color:#111827; }
    body.light .flt-h-tbl td:nth-child(2) { color:#8a6d12; }
    body.light .flt-h-li { background:#fef2f2; border-color:#fca5a5; }
    body.light .flt-h-li b { color:#8a6d12; }
    body.light .flt-h-li span { color:#55657a; }
    body.light .flt-h-li em { color:#b91c1c; }
    body.light .flt-h-steps li { color:#55657a; }
    body.light .flt-h-steps b { color:#8a6d12; }
    body.light .flt-h-warn { background:#fef2f2; border-color:#fca5a5; color:#6b2020; }
    body.light .flt-h-warn b { color:#b91c1c; }
    /* الجدول */
    body.light .flt-stats > div { background:#fff; border-color:#e5e7eb; }
    body.light .flt-stats b { color:#8a6d12; }
    body.light .flt-stats span { color:#55657a; }
    body.light .flt-tbl-wrap { border-color:#e5e7eb; background:#fff; }
    body.light .flt-tbl th { background:#f3f4f6; color:#55657a; border-bottom-color:#e5e7eb; }
    body.light .flt-tbl-wrap { max-height:none; }
    body.light .flt-tbl td { border-bottom-color:#f1f5f9; }
    body.light .flt-tbl tr:hover td { background:#f9fafb; }
    body.light .flt-c { color:#8a6d12; }
    body.light .flt-tbl small { color:#6b7280; }
    body.light .flt-safe.shi { background:#d1fae5; color:#047857; }
    body.light .flt-safe.smd { background:#fef3c7; color:#8a6d12; }
    body.light .flt-safe.slo { background:#fee2e2; color:#b91c1c; }
    body.light .flt-tie { color:#b8912f; }
    body.light .flt-b.ok { color:#047857; }
    body.light .flt-b.mid { color:#8a6d12; }
    body.light .flt-b.bad { color:#b91c1c; }
    body.light .flt-sect { color:#55657a; }
    body.light .flt-d.good { color:#047857; }
    body.light .flt-add { background:#fff; border-color:#e5e7eb; }
    body.light .flt-add:hover { background:#fef3c7; border-color:#d4af37; }
    body.light .flt-empty, body.light .flt-more { color:#55657a; }

  

/* ═══ CSS block 1 ═══ */
#minimax-floating-ball {
  position: fixed;
  bottom: 20px;
  right: 20px;
  padding: 10px 12px;
  background: #222222;
  border-radius: 12px;
  display: flex;
  align-items: center;
  color: #F8F8F8;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  z-index: 9999;
  transition: all 0.3s ease;
  overflow: hidden;
  cursor: pointer;
}

#minimax-floating-ball:hover {
  transform: translateY(-2px);
  background: #383838;
}
.minimax-ball-content {
  display: flex;
  align-items: center;
  gap: 8px;
}

.minimax-logo-wave {
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2256%22%20height%3D%2256%22%20viewBox%3D%220%200%2056%2056%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M28.3348%207.91943C32.873%207.91949%2037.04%209.39135%2040.3124%2011.8472C40.5409%2012.0124%2040.7654%2012.1824%2040.9852%2012.3579C42.1524%2011.7112%2044.304%2010.9991%2046.5702%2012.6655C48.3992%2014.0113%2047.1291%2015.8086%2045.7957%2015.3159C45.0606%2015.0442%2044.1229%2014.5753%2043.3602%2014.6538C45.8851%2017.6085%2047.4032%2021.4033%2047.4032%2025.5415C47.4031%2029.2918%2046.153%2032.7573%2044.0399%2035.5737C43.9544%2035.689%2043.8675%2035.8033%2043.7791%2035.9165C43.7734%2035.9238%2043.7683%2035.9317%2043.7625%2035.939L44.1258%2036.2153L44.1229%2036.2163C46.3725%2037.9282%2046.7697%2041.0832%2045.0116%2043.272C43.2563%2045.4561%2040.0071%2045.8422%2037.7606%2044.1333L35.2606%2042.231C34.9961%2042.0299%2034.6857%2041.9712%2034.4002%2042.022C34.3457%2042.0362%2034.2909%2042.0502%2034.2362%2042.064C33.8268%2042.2022%2033.5038%2042.5721%2033.5038%2043.061C33.5067%2045.8275%2031.1993%2048.0717%2028.3514%2048.0806H28.326C25.4779%2048.0719%2023.1698%2045.8277%2023.1727%2043.061C23.1726%2042.5624%2022.8367%2042.1879%2022.4159%2042.0562C22.3774%2042.0464%2022.339%2042.0368%2022.3006%2042.0269C22.0086%2041.9683%2021.6878%2042.0237%2021.4159%2042.231L18.9159%2044.1333C16.6692%2045.8408%2013.4201%2045.4559%2011.6649%2043.27C9.90673%2041.0826%2010.3049%2037.9282%2012.5545%2036.2163L12.911%2035.9438C10.9449%2033.4341%209.67323%2030.4271%209.3602%2027.1636L9.34555%2026.9937C9.33836%2026.9108%209.33199%2026.8278%209.32602%2026.7446C9.32228%2026.6913%209.31852%2026.6379%209.31528%2026.5845C9.30641%2026.4417%209.30001%2026.2985%209.29477%2026.1548C9.29374%2026.1249%209.29272%2026.0949%209.29184%2026.0649C9.28644%2025.8911%209.28306%2025.7166%209.28305%2025.5415C9.28306%2021.4826%2010.7431%2017.7541%2013.1815%2014.8247C12.367%2014.3304%2011.1334%2014.9767%2010.2157%2015.3159C8.8822%2015.8087%207.58607%2013.9754%209.44223%2012.6655C12.3677%2010.6014%2014.5614%2011.8145%2015.4706%2012.5444C15.5911%2012.4448%2015.7134%2012.347%2015.8368%2012.2505C19.182%209.55277%2023.5528%207.91943%2028.3348%207.91943Z%22%20fill%3D%22%23EDEDED%22%20style%3D%22fill%3A%23EDEDED%3Bfill%3Acolor%28display-p3%200.9278%200.9278%200.9278%29%3Bfill-opacity%3A1%3B%22%2F%3E%0A%3C%2Fsvg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-color: transparent;
  border-radius: 0;
}

.minimax-ball-text {
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}

.minimax-close-icon {
  margin-left: 8px;
  font-size: 16px;
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  cursor: pointer;
  opacity: 0.7;
  transition: opacity 0.2s ease;
}

.minimax-close-icon:hover {
  opacity: 1;
}

/* ══════════════════════════════════════════════════════════════
   📊 لوحة الإحصائيات
   ══════════════════════════════════════════════════════════════ */
.st-card {
  margin-bottom: 14px;
  padding: 15px 17px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgba(255, 255, 255, .022);
}
.st-card h3 {
  margin: 0 0 13px;
  font-size: 1rem;
  font-weight: 800;
  color: var(--gold);
}
.st-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 9px;
  margin-bottom: 14px;
}
.st-kpis > div {
  padding: 11px 9px;
  text-align: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, .028);
}
.st-kpis b {
  display: block;
  font-size: 1.22rem;
  font-weight: 800;
  color: var(--text);
  line-height: 1.35;
}
.st-kpis span {
  display: block;
  font-size: .71rem;
  color: var(--muted);
  margin-top: 3px;
}
.st-sub {
  font-size: .78rem;
  font-weight: 700;
  color: var(--muted);
  margin: 13px 0 7px;
}
.st-row {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 6px;
}
.st-k {
  flex: 0 0 96px;
  font-size: .76rem;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.st-bar {
  flex: 1;
  height: 8px;
  border-radius: 5px;
  background: rgba(255, 255, 255, .06);
  overflow: hidden;
}
.st-bar i {
  display: block;
  height: 100%;
  border-radius: 5px;
  background: linear-gradient(90deg, var(--gold), #ff9800);
}
.st-v {
  flex: 0 0 46px;
  text-align: left;
  font-size: .76rem;
  font-weight: 700;
  color: var(--muted);
}
@media (max-width: 480px) {
  .st-kpis { grid-template-columns: repeat(2, 1fr); }
  .st-k { flex-basis: 74px; font-size: .72rem; }
  .st-v { flex-basis: 38px; font-size: .72rem; }
}

/* ══════════════════════════════════════════════════════════════
   👤 الحسابات
   ══════════════════════════════════════════════════════════════ */
.au-bar {
  position: fixed;
  top: 10px;
  left: 12px;
  z-index: 9990;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  font-size: .76rem;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(20, 24, 33, .93);
  backdrop-filter: blur(9px);
  color: var(--muted);
  box-shadow: 0 3px 16px rgba(0, 0, 0, .28);
}
.au-bar a { color: var(--gold); text-decoration: none; font-weight: 600; }
.au-bar a:hover { text-decoration: underline; }
.au-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 7px #22c55e;
}
.au-dot.off {
  background: #94a3b8;
  box-shadow: none;
}
.au-box {
  position: relative;
  width: 100%;
  max-width: 400px;
  padding: 26px 22px 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--card, #141821);
  box-shadow: 0 18px 60px rgba(0, 0, 0, .48);
}
.au-x {
  position: absolute;
  top: 13px; right: 13px;
  width: 30px; height: 30px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-size: .9rem;
}
.au-h { margin: 0 0 6px; font-size: 1.12rem; font-weight: 800; }
.au-sub { margin: 0 0 15px; font-size: .78rem; color: var(--muted); line-height: 1.75; }
.au-in {
  display: block;
  width: 100%;
  margin-bottom: 10px;
  padding: 11px 13px;
  font-size: .88rem;
  font-family: inherit;
  color: var(--text);
  background: rgba(255, 255, 255, .04);
  border: 1px solid var(--line);
  border-radius: 10px;
  outline: none;
}
.au-in:focus { border-color: var(--gold); }
.au-go {
  width: 100%;
  margin-top: 7px;
  padding: 12px;
  font-size: .92rem;
  font-weight: 700;
  font-family: inherit;
  color: #0d1117;
  background: var(--gold);
  border: none;
  border-radius: 10px;
  cursor: pointer;
}
.au-go:disabled { opacity: .55; cursor: wait; }
.au-alt { margin-top: 13px; text-align: center; font-size: .76rem; color: var(--muted); line-height: 1.9; }
.au-alt a { color: var(--gold); text-decoration: none; }
.au-note {
  margin-top: 13px;
  padding-top: 11px;
  border-top: 1px dashed var(--line);
  text-align: center;
  font-size: .69rem;
  color: var(--muted);
  opacity: .8;
}
@media (max-width: 480px) {
  .au-bar { font-size: .7rem; padding: 5px 10px; top: 8px; left: 8px; }
  .au-box { padding: 22px 16px 18px; }
}

/* ══════════════════════════════════════════════════════════════
   🚪 بوابة الدخول
   ══════════════════════════════════════════════════════════════ */
#gate {
  background: var(--bg, #0b0e14) !important;
}
.gt-box {
  width: 100%;
  max-width: 400px;
  padding: 30px 26px 24px;
  text-align: center;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: var(--card, #141821);
  box-shadow: 0 20px 70px rgba(0, 0, 0, .5);
}
.gt-logo {
  font-size: 3.2rem;
  line-height: 1;
  margin-bottom: 12px;
}
.gt-h {
  margin: 0 0 5px;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: -.4px;
}
.gt-sub {
  margin: 0 0 22px;
  font-size: .85rem;
  color: var(--muted);
}
.gt-in {
  display: block;
  width: 100%;
  margin-bottom: 10px;
  padding: 12px 14px;
  font-size: .9rem;
  font-family: inherit;
  color: var(--text);
  background: rgba(255, 255, 255, .04);
  border: 1px solid var(--line);
  border-radius: 11px;
  outline: none;
  text-align: right;
}
.gt-in:focus { border-color: var(--gold); }
.gt-txt {
  margin: 0 0 13px;
  font-size: .82rem;
  color: var(--muted);
  line-height: 1.75;
}
.gt-msg {
  min-height: 1.4em;
  margin: 9px 0;
  font-size: .79rem;
  line-height: 1.7;
}
.gt-go {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 13px;
  font-size: .93rem;
  font-weight: 700;
  font-family: inherit;
  color: #0d1117;
  background: var(--gold);
  border: none;
  border-radius: 11px;
  cursor: pointer;
}
.gt-go:disabled { opacity: .55; cursor: wait; }
.gt-go.alt {
  margin-top: 9px;
  color: var(--text);
  background: transparent;
  border: 1px solid var(--line);
  font-weight: 600;
}
.gt-back {
  display: block;
  width: 100%;
  margin-top: 8px;
  padding: 9px;
  font-size: .78rem;
  font-family: inherit;
  color: var(--muted);
  background: transparent;
  border: none;
  cursor: pointer;
}
.gt-back:hover { color: var(--gold); }
.gt-note {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px dashed var(--line);
  font-size: .71rem;
  color: var(--muted);
  opacity: .85;
  line-height: 1.8;
}
@media (max-width: 480px) {
  .gt-box { padding: 24px 18px 20px; }
  .gt-h { font-size: 1.3rem; }
  .gt-logo { font-size: 2.7rem; }
}