body { font-family: 'Cairo', 'Segoe UI', Tahoma, 'Noto Sans Arabic', 'Noto Naskh Arabic', 'Geeza Pro', Arial, sans-serif; overflow-x: hidden; }
    [lang="en"] body, [lang="fr"] body { font-family: 'Inter', 'Segoe UI', Roboto, Arial, 'Noto Sans Arabic', Tahoma, sans-serif; }

    /* ========== SPACE & ELEMENTARY SCHOOL DESIGN SYSTEM ========== */
    :root {
      --cosmic-deep: #0b0e1a;
      --nebula-purple: #6d28d9;
      --nebula-pink: #db2777;
      --aurora-cyan: #22d3ee;
      --star-gold: #fbbf24;
      --warm-cream: #fff8f0;
      --playful-coral: #fb7185;
      --sky-blue: #38bdf8;
      --soft-lavender: #a78bfa;
      --mint: #34d399;
    }

    /* --- Floating space decorations --- */
    .space-layer {
      position: fixed; inset: 0; pointer-events: none; z-index: 0; overflow: hidden;
    }
    .star-field span {
      position: absolute; width: 3px; height: 3px; background: #fff;
      border-radius: 50%; opacity: 0.7;
      box-shadow: 0 0 6px 1px rgba(255,255,255,0.8);
      animation: twinkle var(--dur, 3s) ease-in-out infinite alternate;
    }
    @keyframes twinkle {
      0% { opacity: 0.2; transform: scale(0.6); }
      100% { opacity: 1; transform: scale(1.3); }
    }
    .orbit-planet {
      position: absolute; border-radius: 50%;
      filter: blur(0.5px);
      animation: floatOrbit var(--orb-dur, 18s) ease-in-out infinite;
      opacity: 0.55;
    }
    @keyframes floatOrbit {
      0%, 100% { transform: translate(0,0) scale(1); }
      33% { transform: translate(12px, -18px) scale(1.05); }
      66% { transform: translate(-10px, 8px) scale(0.95); }
    }
    .shooting-star {
      position: absolute; width: 80px; height: 2px;
      background: linear-gradient(90deg, transparent, #fff, transparent);
      border-radius: 2px; opacity: 0;
      animation: shoot 6s linear infinite;
    }
    @keyframes shoot {
      0% { opacity: 0; transform: translateX(0) translateY(0) rotate(-35deg); }
      5% { opacity: 1; }
      30% { opacity: 0; transform: translateX(280px) translateY(160px) rotate(-35deg); }
      100% { opacity: 0; }
    }

    /* --- 3D Portal cards --- */
    .portal-square {
      aspect-ratio: 1 / 1;
      transition: transform 0.45s cubic-bezier(0.34, 1.56, 0.64, 1),
                  box-shadow 0.4s ease, background 0.3s;
      cursor: pointer;
      transform-style: preserve-3d;
      perspective: 800px;
      position: relative;
      overflow: hidden;
    }
    .portal-square::before {
      content: '';
      position: absolute; inset: -40%;
      background: radial-gradient(circle at 30% 20%, rgba(251,191,36,0.25), transparent 50%),
                  radial-gradient(circle at 80% 70%, rgba(109,40,217,0.18), transparent 45%);
      opacity: 0; transition: opacity 0.4s; pointer-events: none;
      z-index: 0;
    }
    .portal-square:hover::before { opacity: 1; }
    .portal-square > * { position: relative; z-index: 1; }
    .portal-square:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible {
      outline: 3px solid #fbbf24; outline-offset: 3px;
    }
    .portal-square[role=button] { cursor: pointer; }
    .portal-square:hover {
      transform: translateY(-10px) scale(1.04) rotateX(4deg) rotateY(-3deg);
      box-shadow: 0 20px 40px -12px rgba(109,40,217,0.35),
                  0 0 0 1px rgba(251,191,36,0.4),
                  0 0 30px rgba(251,191,36,0.15);
    }
    .portal-square:active, .portal-square.active-glow {
      transform: scale(0.97) translateY(-2px);
      box-shadow: 0 0 0 3px rgba(251,191,36,0.45);
    }

    /* Icon bounce on hover */
    .portal-square:hover .icon-badge,
    .portal-square:hover .portal-icon {
      animation: iconBounce 0.6s ease;
    }
    @keyframes iconBounce {
      0%, 100% { transform: translateY(0) scale(1); }
      40% { transform: translateY(-8px) scale(1.12); }
      70% { transform: translateY(-3px) scale(1.05); }
    }

    html { scroll-behavior: auto; }
    .panel-enter { animation: softFade 0.35s ease-out forwards; }
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
      }
      .space-layer { display: none !important; }
    }

    @keyframes softFade {
      from { opacity: 0; transform: translateY(12px); }
      to { opacity: 1; transform: translateY(0); }
    }
    @keyframes slideUp {
      from { opacity: 0; transform: translateY(20px); }
      to { opacity: 1; transform: translateY(0); }
    }
    @keyframes pulseGlow {
      0%, 100% { box-shadow: 0 0 12px rgba(251,191,36,0.3); }
      50% { box-shadow: 0 0 28px rgba(251,191,36,0.55); }
    }
    @keyframes floatY {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-8px); }
    }

    .glow-card {
      background: linear-gradient(145deg, rgba(255,252,247,0.95) 0%, rgba(250,240,220,0.92) 100%);
      border: 1px solid rgba(180,140,80,0.28);
      box-shadow: 0 8px 28px -8px rgba(61,43,31,0.12);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }
    .luxury-panel {
      background: linear-gradient(160deg, #0f1225 0%, #1e1b4b 50%, #2e1065 100%);
      color: #f5e6d3;
      border-bottom: 1px solid rgba(251,191,36,0.25);
    }
    .luxury-gold {
      background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 40%, #d97706 100%);
    }
    .icon-badge {
      width: 56px; height: 56px;
      border-radius: 18px;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.7rem;
      box-shadow: 0 10px 24px -6px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.4);
      transition: transform 0.3s;
    }
    .section-chip {
      display: inline-flex; align-items: center; gap: 6px;
      padding: 6px 14px; border-radius: 999px;
      font-size: 0.8rem; font-weight: 600;
    }
    .stat-pill {
      background: linear-gradient(145deg, rgba(255,252,247,0.96), rgba(245,235,216,0.94));
      border-radius: 22px;
      padding: 14px 22px;
      box-shadow: 0 6px 20px rgba(61,43,31,0.1), 0 0 0 1px rgba(251,191,36,0.2);
      border: 1px solid rgba(180,140,80,0.25);
      transition: transform 0.35s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.3s;
      animation: floatY 4s ease-in-out infinite;
    }
    .stat-pill:nth-child(2) { animation-delay: 0.4s; }
    .stat-pill:nth-child(3) { animation-delay: 0.8s; }
    .stat-pill:nth-child(4) { animation-delay: 1.2s; }
    .stat-pill:hover {
      transform: translateY(-6px) scale(1.06);
      box-shadow: 0 12px 28px rgba(109,40,217,0.2), 0 0 0 1px rgba(251,191,36,0.4);
    }
    .tab-btn.active { border-bottom: 3px solid #f59e0b; color: #b45309; font-weight: 700; }
    .paid { background: #ecfdf5; border-color: #6ee7b7; }
    .unpaid { background: #fff7ed; border-color: #fdba74; }

    .ticker {
      background: linear-gradient(90deg, #1e1b4b, #4c1d95, #1e1b4b);
      color: #fef3c7;
    }
    .ticker-btn {
      background: rgba(255,255,255,0.12);
      border-radius: 999px;
      transition: background 0.2s;
    }
    .ticker-btn:hover { background: rgba(255,255,255,0.25); }

    /* Video background */
    #bgVideo {
      position: fixed; inset: 0; width: 100%; height: 100%;
      object-fit: cover; z-index: -2; pointer-events: none;
    }
    .bg-overlay {
      position: fixed; inset: 0; z-index: -1; pointer-events: none;
      background: linear-gradient(
        180deg,
        rgba(11, 14, 26, 0.55) 0%,
        rgba(30, 27, 75, 0.35) 35%,
        rgba(109, 40, 217, 0.18) 55%,
        rgba(251, 191, 36, 0.12) 78%,
        rgba(252, 247, 238, 0.75) 100%
      );
    }
    body.has-video-bg {
      background: transparent !important;
      color: #1c1917;
    }
    body.has-video-bg #homeView .text-center.mb-10 h1,
    body.has-video-bg #homeView [data-i18n="school_name"] {
      color: #fff8e7 !important;
      text-shadow: 0 2px 16px rgba(0,0,0,0.6), 0 0 40px rgba(251,191,36,0.45), 0 0 80px rgba(109,40,217,0.3);
      letter-spacing: -0.02em;
    }
    body.has-video-bg #homeView .text-center.mb-10 p,
    body.has-video-bg #homeView [data-i18n="school_tagline"],
    body.has-video-bg #homeView [data-i18n="stats_note"],
    body.has-video-bg #homeView [data-i18n="welcome_desc"] {
      color: #fde9b8 !important;
      text-shadow: 0 1px 10px rgba(0,0,0,0.5);
    }
    body.has-video-bg #homeView .text-center.mb-10 .inline-flex {
      background: rgba(255, 248, 230, 0.9) !important;
      border-color: rgba(251, 191, 36, 0.6) !important;
      color: #92400e !important;
      box-shadow: 0 4px 20px rgba(0,0,0,0.25), 0 0 20px rgba(251,191,36,0.2);
      animation: pulseGlow 3s ease-in-out infinite;
    }
    body.has-video-bg .glow-card,
    body.has-video-bg .portal-square,
    body.has-video-bg .stat-pill {
      background: linear-gradient(145deg, rgba(255,252,247,0.93) 0%, rgba(250,240,220,0.9) 100%) !important;
      backdrop-filter: blur(14px) saturate(1.2);
      -webkit-backdrop-filter: blur(14px) saturate(1.2);
      border-color: rgba(212, 175, 55, 0.4) !important;
      box-shadow: 0 10px 32px -8px rgba(0,0,0,0.3), 0 0 0 1px rgba(255,255,255,0.45) inset;
    }
    body.has-video-bg .portal-square h3 { color: #1c1917 !important; font-weight: 800 !important; letter-spacing: -0.01em; }
    body.has-video-bg .portal-square p { color: #44403c !important; font-weight: 600 !important; font-size: 0.8rem !important; opacity: 1 !important; }

    /* ===== Clarity & contrast improvements (all platforms) ===== */
    body {
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      text-rendering: optimizeLegibility;
    }
    /* Footer high-contrast on video background */
    body.has-video-bg footer,
    footer {
      color: #fef3c7 !important;
    }
    body.has-video-bg footer p,
    body.has-video-bg footer a {
      text-shadow: 0 1px 6px rgba(0,0,0,0.65);
    }
    /* Portal card titles & descriptions sharper */
    .portal-square h3 {
      font-weight: 800 !important;
      color: #1c1917 !important;
      line-height: 1.25;
    }
    .portal-square p {
      font-weight: 600 !important;
      color: #44403c !important;
      opacity: 1 !important;
      line-height: 1.35;
    }
    /* Secondary text more readable (slate-400/500 → stronger) */
    .text-slate-400, .text-stone-400 {
      color: #78716c !important;
    }
    .text-slate-500, .text-stone-500 {
      color: #57534e !important;
    }
    /* Small helper texts */
    .text-\[10px\], .text-\[11px\] {
      font-weight: 600 !important;
      letter-spacing: 0.01em;
    }
    /* Contact / footer links */
    footer a {
      text-decoration-thickness: 1.5px;
    }

    /* ===== Side menu ===== */
    #sideMenuPanel {
      right: 0; left: auto;
      transform: translateX(110%);
      visibility: hidden;
      transition: transform .3s ease-out, visibility 0s linear .3s !important;
    }
    #sideMenuPanel.open {
      transform: translateX(0) !important;
      visibility: visible;
      transition: transform .3s ease-out, visibility 0s !important;
    }
    html[dir="ltr"] #sideMenuPanel {
      right: auto; left: 0;
      inset-inline-end: auto;
      inset-inline-start: 0;
      transform: translateX(-110%);
      border-s: none;
      border-inline-end: 1px solid rgba(180, 83, 9, 0.3);
    }
    html[dir="ltr"] #sideMenuPanel.open {
      transform: translateX(0) !important;
    }
    #sideMenuOverlay.open {
      display: block !important;
      opacity: 1 !important;
    }
    body.side-menu-open {
      overflow: hidden;
    }

    /* ===== Mobile / Phone fixes ===== */
    html, body {
      max-width: 100vw;
      overflow-x: hidden;
    }
    * {
      box-sizing: border-box;
    }
    /* Header: compact on small screens so nothing is cut off */
    @media (max-width: 640px) {
      header .max-w-5xl {
        padding-left: 0.6rem !important;
        padding-right: 0.6rem !important;
        gap: 0.35rem;
      }
      header #logoArea img {
        width: 2.25rem !important;
        height: 2.25rem !important;
        min-width: 2.25rem;
      }
      header #logoArea .font-extrabold,
      header #logoArea [data-i18n="school_name"] {
        font-size: 0.8rem !important;
        line-height: 1.2 !important;
        max-width: 42vw;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      header #logoArea .text-xs,
      header #logoArea [data-i18n="school_tagline"] {
        font-size: 0.65rem !important;
        max-width: 42vw;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      #langSwitcher {
        padding: 0.4rem 0.5rem !important;
        font-size: 0.75rem !important;
        max-width: 5.5rem;
      }
      #sideMenuBtn {
        width: 2.25rem !important;
        height: 2.25rem !important;
        min-width: 2.25rem;
      }
      #globalSearchInput {
        display: none !important;
      }
      /* Home hero */
      #homeView {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
        padding-top: 1rem !important;
        padding-bottom: 1.5rem !important;
      }
      #homeView h1,
      #homeView [data-i18n="school_name"].text-3xl {
        font-size: 1.45rem !important;
        line-height: 1.3 !important;
        word-break: break-word;
      }
      #homeView .text-lg {
        font-size: 0.95rem !important;
      }
      /* Portal grid: always 2 cols, comfortable gaps, no overflow */
      #homeView .grid.grid-cols-2 {
        gap: 0.65rem !important;
        max-width: 100% !important;
        padding: 0 !important;
      }
      .portal-square {
        min-height: 0 !important;
        aspect-ratio: 1 / 1 !important;
        padding: 0.65rem !important;
        overflow: hidden !important;
      }
      .portal-square h3 {
        font-size: 0.95rem !important;
        line-height: 1.25 !important;
        font-weight: 800 !important;
        margin-bottom: 0.15rem !important;
      }
      .portal-square p {
        font-size: 0.78rem !important;
        line-height: 1.3 !important;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
      }
      .portal-square .icon-badge {
        width: 2.4rem !important;
        height: 2.4rem !important;
        margin-bottom: 0.4rem !important;
      }
      .portal-square .icon-badge svg {
        width: 1.15rem !important;
        height: 1.15rem !important;
      }
      /* Stats pills */
      .stat-pill {
        min-width: 70px !important;
        padding: 0.4rem 0.5rem !important;
      }
      .stat-pill .text-2xl {
        font-size: 1.15rem !important;
      }
      /* Contact / CTA button */
      #homeView a[href^="tel"],
      #homeView button,
      .contact-cta,
      a.inline-flex {
        max-width: 100%;
      }
      /* Footer readable and not cut */
      footer {
        padding: 1.5rem 0.75rem !important;
        word-break: break-word;
      }
      footer p {
        font-size: 0.85rem !important;
      }
      footer .text-sm {
        font-size: 0.8rem !important;
      }
      footer .text-xs {
        font-size: 0.7rem !important;
      }
      /* Side menu full usable height on phone */
      #sideMenuPanel {
        width: min(300px, 88vw) !important;
        padding-bottom: env(safe-area-inset-bottom, 0);
      }
      /* Parent / staff views */
      #parentView, #staffView, #portalView {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
      }
      /* Tables / wide content scroll instead of page break */
      table {
        display: block;
        max-width: 100%;
        overflow-x: auto;
      }
      /* Modals fit phone */
      #financeEditModal > div,
      #addChildModal > div {
        max-height: 92vh !important;
        margin: 0.5rem !important;
        border-radius: 1.25rem !important;
      }
    }

    /* Very small phones */
    @media (max-width: 380px) {
      .portal-square h3 { font-size: 0.88rem !important; }
      .portal-square p { font-size: 0.72rem !important; }
      header #logoArea [data-i18n="school_name"] { max-width: 36vw; }
    }

    /* Prevent accidental horizontal scroll from any absolute/wide element */
    .glow-card, .portal-square, .stat-pill {
      max-width: 100%;
    }

    /* Font scale root */

    html {
      font-size: 16px;
    }
    html.font-scale-90 { font-size: 14.4px; }
    html.font-scale-100 { font-size: 16px; }
    html.font-scale-110 { font-size: 17.6px; }
    html.font-scale-120 { font-size: 19.2px; }
    html.font-scale-130 { font-size: 20.8px; }

    body.has-video-bg .stat-pill .text-2xl { text-shadow: none; }
    body.has-video-bg #portalView .glow-card,
    body.has-video-bg #staffView .bg-\[\#fffcf7\],
    body.has-video-bg #parentView .bg-\[\#fffcf7\] {
      background: rgba(255, 252, 247, 0.97) !important;
    }

    /* Hero decorative rings */
    .hero-ring {
      position: absolute; border-radius: 50%;
      border: 1.5px solid rgba(251,191,36,0.25);
      pointer-events: none;
      animation: ringPulse 8s ease-in-out infinite;
    }
    @keyframes ringPulse {
      0%, 100% { transform: scale(1); opacity: 0.4; }
      50% { transform: scale(1.08); opacity: 0.7; }
    }

    /* Colored portal accents */
    .portal-square[data-portal="about"] .icon-badge { background: linear-gradient(135deg,#fbbf24,#f59e0b); color:#fff; }
    .portal-square[data-portal="register"] .icon-badge { background: linear-gradient(135deg,#38bdf8,#0ea5e9); color:#fff; }
    .portal-square[data-portal="news"] .icon-badge { background: linear-gradient(135deg,#a78bfa,#7c3aed); color:#fff; }
    .portal-square[data-portal="competitions"] .icon-badge { background: linear-gradient(135deg,#fb7185,#e11d48); color:#fff; }
    .portal-square[data-portal="schedules"] .icon-badge { background: linear-gradient(135deg,#34d399,#059669); color:#fff; }
    .portal-square[data-portal="activities"] .icon-badge { background: linear-gradient(135deg,#f472b6,#db2777); color:#fff; }
    .portal-square[data-portal="library"] .icon-badge { background: linear-gradient(135deg,#60a5fa,#2563eb); color:#fff; }
    .portal-square[data-portal="parents"] .icon-badge { background: linear-gradient(135deg,#fbbf24,#d97706); color:#fff; }
    .portal-square[data-portal="contact"] .icon-badge { background: linear-gradient(135deg,#22d3ee,#0891b2); color:#fff; }
    .portal-square[data-portal="videos"] .icon-badge { background: linear-gradient(135deg,#c084fc,#9333ea); color:#fff; }


    @media (prefers-reduced-motion: reduce) {
      #bgVideo { display: none; }
      body.has-video-bg { background: #f5f0e8 !important; }
      .bg-overlay { display: none; }
    }

    @media print {
      header, footer, .ticker, #langSwitcher, button, .no-print, #staffView header button, #bgVideo, .bg-overlay, .space-layer { display: none !important; }
      body { background: #fff !important; }
      .glow-card, .portal-square { box-shadow: none !important; border: 1px solid #ccc !important; }
    }

    /* ===== منع الانزياح الأفقي على الهواتف ===== */
    html { overflow-x: hidden; }
    body { overflow-x: clip; max-width: 100vw; }
    /* ===== فضاء ولي الأمر: صفحة هادئة بلا فيديو ولا زخرفة ===== */
    body.parent-mode { background: #f6f3ee !important; }
    body.parent-mode #bgVideo, body.parent-mode .space-layer, body.parent-mode .bg-overlay,
    body.parent-mode .ticker-bar, body.parent-mode footer, body.parent-mode #homeView { display: none !important; }
    body.parent-mode div:has(> .ticker-bar) { display: none !important; }
    body.parent-mode #parentView { color: #1c1917; }
    body.parent-mode #parentView .portal-square, body.parent-mode #parentView .glow-card {
      background: #fff !important; box-shadow: 0 2px 10px rgba(0,0,0,.06) !important; border: 1px solid #e7e5e4 !important;
      animation: none !important; transform: none !important;
    }
    body.parent-mode #parentView .portal-square::before { display: none !important; }
    body.parent-mode #parentView .portal-square h3, body.parent-mode #parentView .font-bold { color: #1c1917 !important; }
    .pw-card { background: #fff; border: 1px solid #e7e5e4; border-radius: 24px; }
    .child-tile { background: #fff; border: 2px solid #e7e5e4; border-radius: 24px; transition: border-color .15s, box-shadow .15s; }
    .child-tile:hover, .child-tile:focus-visible { border-color: #d97706; box-shadow: 0 6px 18px rgba(217,119,6,.15); outline: none; }
    .child-tile:active { transform: scale(.98); }

    /* ===== جدول أولياء الأمور كبطاقات على الهاتف ===== */
    @media (max-width: 640px) {
      table.resp-parents thead { display: none; }
      table.resp-parents, table.resp-parents tbody { display: block; width: 100%; }
      table.resp-parents tr { display: grid; grid-template-columns: auto 1fr; gap: 6px 10px; align-items: center;
        background: #fff; border: 1px solid #e7e5e4; border-radius: 16px; padding: 12px; margin-bottom: 10px; }
      table.resp-parents td { display: block; padding: 0 !important; border: 0; }
      table.resp-parents td.pt-num { grid-column: 1; color: #a8a29e; font-weight: 700; }
      table.resp-parents td.pt-name { grid-column: 2; font-size: 1.05rem; font-weight: 800; }
      table.resp-parents td[data-label] { grid-column: 1 / -1; font-size: .85rem; }
      table.resp-parents td[data-label]::before { content: attr(data-label); display: inline-block; min-width: 88px; color: #78716c; font-weight: 600; font-size: .75rem; }
      table.resp-parents td.pt-actions { grid-column: 1 / -1; white-space: normal !important; display: flex; flex-wrap: wrap; gap: 6px; padding-top: 6px !important; border-top: 1px dashed #e7e5e4; }
      table.resp-parents td.pt-actions button { padding: 8px 12px !important; font-size: .8rem !important; }
    }
    /* المبالغ لا تنكسر على سطرين في جداول المحاسبة */
    #tab-accounting td, #tab-accounting th { white-space: nowrap; }

    /* ===== وضوح اسم المدرسة والنص فوق الفيديو — بلا بطاقة، بظل داكن حول الحروف ===== */
    body.has-video-bg:not(.ap-on) #homeView [data-i18n="school_name"],
    body.ap-video #homeView#homeView [data-i18n="school_name"] {
      text-shadow: 0 2px 4px rgba(0,0,0,.85), 0 0 18px rgba(0,0,0,.55), 0 0 40px rgba(30,27,75,.6) !important;
    }
    body.has-video-bg:not(.ap-on) #homeView [data-i18n="school_tagline"],
    body.has-video-bg:not(.ap-on) #homeView [data-i18n="welcome_desc"],
    body.has-video-bg:not(.ap-on) #homeView [data-i18n="stats_note"],
    body.ap-video #homeView#homeView [data-i18n="school_tagline"],
    body.ap-video #homeView#homeView [data-i18n="welcome_desc"],
    body.ap-video #homeView#homeView [data-i18n="stats_note"] {
      text-shadow: 0 1px 3px rgba(0,0,0,.95), 0 0 12px rgba(0,0,0,.7) !important;
      font-weight: 700;
    }
    body.has-video-bg:not(.ap-on) #homeView [data-i18n="welcome_desc"],
    body.ap-video #homeView [data-i18n="welcome_desc"] { font-size: .95rem; line-height: 1.75; }

    /* ===== صلاحيات الموظفين ===== */
    body.no-perm-finance .perm-finance, body.no-perm-codes .perm-codes, body.not-director .director-only { display: none !important; }
    .perm-chip { display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:700; padding:3px 8px; border-radius:999px; background:#fef3c7; color:#78350f; border:1px solid #fde68a; }