:root{
  --n-bg:#07111f;--n-bg2:#0b1f3a;--n-card:#101c2e;--n-card2:#15263d;--n-line:#22324a;
  --n-gold:#d4a017;--n-gold2:#f2c94c;--n-green:#16a34a;--n-teal:#00796b;
  --n-text:#f8fafc;--n-text2:#cbd5e1;--n-muted:#94a3b8;--n-red:#dc2626;
  --n-radius:22px;--n-shadow:0 24px 70px rgba(0,0,0,.32);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:radial-gradient(circle at 76% 0%,rgba(212,160,23,.13),transparent 28%),radial-gradient(circle at 18% 8%,rgba(0,121,107,.15),transparent 30%),var(--n-bg)!important;color:var(--n-text)!important;font-family:Cairo,"IBM Plex Sans Arabic",Tahoma,Arial,sans-serif!important;line-height:1.7}.wrap{max-width:1540px!important;width:100%;padding:24px!important;margin:0 auto!important}.site-header{position:sticky!important;top:0;z-index:1000;background:rgba(7,17,31,.82)!important;border-bottom:1px solid rgba(34,50,74,.72)!important;backdrop-filter:blur(18px);padding:0!important}.header-inner{height:76px;display:flex;align-items:center;gap:22px;max-width:1540px;margin:auto;padding:0 24px}.brand{display:flex!important;align-items:center;gap:10px;color:var(--n-gold2)!important;text-decoration:none!important;margin-inline-start:auto}.brand-logo{width:var(--logo-width)!important;height:var(--logo-height)!important;object-fit:contain}.brand-mark{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:12px;background:linear-gradient(135deg,var(--n-gold2),var(--n-gold));color:#07111f;font-weight:900}.brand-text span{display:block;font-size:24px;font-weight:900;line-height:1;color:var(--n-gold2)}.brand-text small{display:block;color:var(--n-text2);font-size:11px;margin-top:4px}.main-nav{display:flex;align-items:center;gap:6px}.main-nav a{color:var(--n-text2)!important;text-decoration:none;padding:10px 13px;border-radius:999px;font-weight:700;font-size:14px}.main-nav a:hover,.main-nav a:first-child{color:var(--n-gold2)!important;background:rgba(212,160,23,.09)}.nav-new{background:#8b1e1e;color:#fff;border-radius:999px;padding:2px 7px;margin-inline-end:4px;font-size:11px}.header-search{flex:1;max-width:540px;display:flex;align-items:center;background:linear-gradient(180deg,rgba(16,28,46,.98),rgba(9,20,36,.98));border:1px solid var(--n-line);border-radius:999px;padding:6px;margin:0 auto;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}.header-search input{border:0!important;background:transparent!important;color:var(--n-text)!important;padding:9px 18px!important;height:44px}.header-search button{margin:0!important;width:42px;height:42px;border-radius:999px!important;background:transparent!important;color:var(--n-text)!important;border:0!important;font-size:25px!important;padding:0!important}.theme-toggle,.menu-toggle,.icon-btn{background:transparent!important;color:var(--n-text)!important;border:1px solid transparent!important;border-radius:999px!important;width:42px;height:42px;margin:0!important;font-size:20px}.theme-toggle:hover,.menu-toggle:hover,.icon-btn:hover{border-color:var(--n-line)!important;background:rgba(255,255,255,.04)!important}
/* premium hero */
.namaa-hero{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;margin:18px 0 22px}.namaa-hero-main{position:relative;min-height:520px;border:1px solid var(--n-line);border-radius:var(--n-radius);overflow:hidden;padding:58px 54px;display:flex;flex-direction:column;justify-content:center;box-shadow:var(--n-shadow);background:linear-gradient(90deg,rgba(7,17,31,.98) 0%,rgba(7,17,31,.78) 42%,rgba(7,17,31,.12) 100%),linear-gradient(0deg,rgba(7,17,31,.88),rgba(7,17,31,.05)),var(--hero-img) center/cover no-repeat}.namaa-hero-main:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 67% 50%,rgba(212,160,23,.22),transparent 25%);pointer-events:none}.namaa-hero-main>*{position:relative;z-index:1}.hero-badge{align-self:flex-start;border:1px solid rgba(212,160,23,.85);background:rgba(7,17,31,.45);color:var(--n-gold2);border-radius:999px;padding:8px 22px;font-size:14px;font-weight:900;margin-bottom:28px}.namaa-hero h1{font-size:clamp(34px,4.2vw,68px);max-width:650px;line-height:1.12;margin:0 0 18px;color:#fff;text-shadow:0 4px 26px rgba(0,0,0,.65)}.namaa-hero h1::first-letter{color:var(--n-gold2)}.namaa-hero-main p{max-width:600px;color:var(--n-text2);font-size:19px;margin:0 0 20px}.hero-meta{display:flex;gap:18px;flex-wrap:wrap;align-items:center;color:var(--n-text2);margin:8px 0 28px}.hero-meta span{display:inline-flex;align-items:center;gap:5px}.hero-meta strong{background:rgba(22,163,74,.22);color:#86efac;border:1px solid rgba(22,163,74,.45);border-radius:999px;padding:7px 14px}.hero-actions{display:flex;gap:14px;flex-wrap:wrap}.primary-btn,.secondary-btn,.full-summary,.watch-btn,.save-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none!important;border-radius:999px!important;font-weight:900!important;min-height:46px;padding:11px 24px!important;cursor:pointer}.primary-btn{background:linear-gradient(135deg,var(--n-gold2),var(--n-gold))!important;color:#07111f!important;border:0!important;box-shadow:0 12px 34px rgba(212,160,23,.22)}.secondary-btn{background:rgba(7,17,31,.45)!important;border:1px solid var(--n-gold)!important;color:var(--n-gold2)!important}.hero-dots{position:absolute;bottom:20px;left:50%;display:flex;gap:10px}.hero-dots i{width:10px;height:10px;background:#64748b;border-radius:50%}.hero-dots i:first-child{background:var(--n-gold)}.hero-ai-panel{background:linear-gradient(180deg,rgba(16,28,46,.94),rgba(8,18,32,.94));border:1px solid var(--n-line);border-radius:var(--n-radius);padding:24px;box-shadow:var(--n-shadow);display:flex;flex-direction:column;gap:12px}.hero-ai-panel h3{color:var(--n-gold2);font-size:21px;margin:0 0 8px}.ai-row{border-top:1px solid rgba(34,50,74,.75);padding:15px 0;display:grid;gap:4px}.ai-row span{color:var(--n-muted);font-size:13px}.ai-row b{color:var(--n-text);font-size:15px}.ai-row b.green{color:#86efac}.ai-row b.gold{color:var(--n-gold2)}.full-summary{margin-top:auto;background:transparent;color:var(--n-gold2)!important;border:1px solid var(--n-gold)!important;width:100%}.namaa-command-bar{display:grid;grid-template-columns:minmax(260px,480px) 1fr;gap:16px;align-items:center;margin:12px 0 14px}.hero-search{display:flex;background:rgba(16,28,46,.88);border:1px solid var(--n-line);border-radius:999px;padding:6px}.hero-search input{background:transparent!important;border:0!important;color:var(--n-text)!important;padding:12px 18px!important}.hero-search button{margin:0!important;border-radius:999px!important;background:var(--n-teal)!important;color:#fff!important}.stats-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.stat{background:rgba(16,28,46,.86)!important;border:1px solid var(--n-line)!important;border-radius:18px!important;padding:13px 16px!important;box-shadow:0 12px 30px rgba(0,0,0,.18)}.stat strong{display:block;color:#fff;font-size:22px}.stat span{color:var(--n-muted);font-size:12px}.trending-chips{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 22px}.trending-chips a,.quick-tags a{background:rgba(0,121,107,.14)!important;border:1px solid rgba(0,121,107,.35)!important;color:#a7f3d0!important;border-radius:999px!important;text-decoration:none!important;padding:7px 13px!important;font-weight:800;font-size:13px}
/* rows */
.content-row{margin:30px 0}.row-head,.section-head{display:flex;align-items:flex-end;justify-content:space-between;margin:0 0 14px}.row-head h2,.section-head h2{margin:0;color:#fff;font-size:25px;letter-spacing:-.3px}.section-head p,.row-head p{color:var(--n-muted);margin:4px 0 0}.row-controls{display:flex;gap:8px}.row-controls button{margin:0!important;width:38px;height:38px;border-radius:50%!important;background:rgba(16,28,46,.9)!important;color:#fff!important;border:1px solid var(--n-line)!important;font-size:25px;padding:0!important}.row-scroller{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(240px,1fr);gap:14px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:inline mandatory;padding:2px 0 12px;scrollbar-width:thin;scrollbar-color:var(--n-gold) transparent}.row-scroller .video-tile{scroll-snap-align:start;width:100%}.video-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))!important;gap:16px!important}.video-tile{background:linear-gradient(180deg,rgba(16,28,46,.96),rgba(10,22,39,.96))!important;border:1px solid var(--n-line)!important;border-radius:18px!important;overflow:hidden!important;box-shadow:0 16px 40px rgba(0,0,0,.23)!important;padding:0!important;margin:0!important;display:flex!important;flex-direction:column!important;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.video-tile:hover{transform:translateY(-5px);border-color:rgba(212,160,23,.5)!important;box-shadow:0 22px 70px rgba(0,0,0,.42)!important}.tile-media{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#000}.tile-media img{width:100%!important;height:100%!important;object-fit:cover!important;border-radius:0!important;display:block;transition:transform .35s ease}.video-tile:hover .tile-media img{transform:scale(1.06)}.media-gradient{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.62),transparent 46%)}.duration{position:absolute;bottom:10px;right:10px;background:rgba(0,0,0,.72);color:#fff;border-radius:8px;padding:3px 8px;font-size:12px;z-index:2}.fomo{position:absolute;top:10px;right:10px;background:rgba(212,160,23,.18);border:1px solid rgba(212,160,23,.55);color:var(--n-gold2);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:900;z-index:2}.play-overlay{position:absolute;inset:auto auto 12px 12px;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(212,160,23,.9);color:#07111f;font-size:13px;z-index:2;opacity:.95}.tile-body{padding:14px 14px 13px!important;display:flex;flex-direction:column;gap:8px;flex:1}.tile-topline{display:flex;justify-content:space-between;gap:8px;align-items:center}.badge{display:inline-flex!important;align-items:center;color:var(--n-gold2)!important;background:rgba(212,160,23,.1)!important;border:1px solid rgba(212,160,23,.28);border-radius:999px;text-decoration:none!important;padding:4px 9px;font-size:11px;font-weight:900;white-space:nowrap;max-width:62%;overflow:hidden;text-overflow:ellipsis}.ai-pill{color:#86efac;background:rgba(22,163,74,.14);border:1px solid rgba(22,163,74,.36);border-radius:999px;padding:3px 8px;font-size:12px;font-weight:900}.video-tile h3{font-size:15px!important;line-height:1.55!important;margin:0!important;min-height:47px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.video-tile h3 a{color:#fff!important;text-decoration:none!important}.meta{color:var(--n-muted)!important;font-size:12px!important;margin:0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tile-preview{color:var(--n-text2)!important;font-size:12px!important;line-height:1.55;margin:0!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:38px}.progress-line{height:4px;background:rgba(148,163,184,.18);border-radius:999px;overflow:hidden;margin-top:auto}.progress-line span{display:block;height:100%;background:linear-gradient(90deg,var(--n-gold),var(--n-gold2));border-radius:999px}.tile-footer{display:flex!important;gap:8px!important;align-items:center!important;justify-content:space-between!important;margin-top:2px!important}.save-btn,.watch-btn{min-height:34px!important;padding:6px 12px!important;font-size:12px!important;border-radius:999px!important}.save-btn{background:rgba(255,255,255,.04)!important;border:1px solid var(--n-line)!important;color:var(--n-text2)!important;margin:0!important}.watch-btn{background:var(--n-teal)!important;color:#fff!important;border:0!important}.category-grid,.playlist-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important;gap:14px!important}.category-card,.playlist-card{background:linear-gradient(180deg,rgba(16,28,46,.94),rgba(8,18,32,.94))!important;border:1px solid var(--n-line)!important;border-radius:18px!important;padding:18px!important;text-decoration:none!important;color:var(--n-text)!important;box-shadow:0 14px 35px rgba(0,0,0,.22)}.category-card strong,.playlist-card strong{display:block;font-size:17px;color:#fff}.category-card span,.playlist-card em{display:block;color:var(--n-muted);font-style:normal;margin-top:6px}.playlist-card span{color:var(--n-gold2);font-weight:900;font-size:24px}.site-footer{max-width:1540px!important;border-top:1px solid var(--n-line)!important;color:var(--n-muted)!important}.search-overlay,.saved-drawer{position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:2000;display:grid;place-items:start center;padding-top:90px}.search-dialog,.saved-panel{width:min(760px,92vw);background:var(--n-card);border:1px solid var(--n-line);border-radius:24px;padding:24px;box-shadow:var(--n-shadow)}.close-btn{float:left;background:rgba(255,255,255,.05)!important;color:#fff!important;border:1px solid var(--n-line)!important;border-radius:50%!important;width:38px;height:38px;margin:0!important;padding:0!important}.bottom-nav{display:none}.empty-state{color:var(--n-muted);background:var(--n-card);border:1px solid var(--n-line);border-radius:18px;padding:20px}
/* watch page graceful upgrade */
.video-layout{display:grid!important;grid-template-columns:minmax(0,1fr) 360px!important;gap:18px!important}.panel,.card{background:linear-gradient(180deg,rgba(16,28,46,.96),rgba(8,18,32,.96))!important;border:1px solid var(--n-line)!important;border-radius:20px!important;box-shadow:0 16px 45px rgba(0,0,0,.22)!important}.embed{border-radius:22px!important;border:1px solid var(--n-line)!important;box-shadow:var(--n-shadow)}.scores .score{background:rgba(7,17,31,.65)!important;border:1px solid var(--n-line)!important;border-radius:999px!important;color:var(--n-text2)!important}.strip{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}.mini-card{display:grid!important;grid-template-columns:130px 1fr;gap:10px;align-items:center;background:rgba(16,28,46,.65);border:1px solid var(--n-line);border-radius:14px;padding:8px!important;color:#fff!important;text-decoration:none!important}.mini-card img{margin:0!important;border-radius:10px!important}.mini-card span{color:var(--n-text2)!important}
@media (min-width:1100px){.row-scroller{grid-auto-columns:calc((100% - 56px)/5)}}
@media (max-width:1050px){.namaa-hero{grid-template-columns:1fr}.hero-ai-panel{display:grid;grid-template-columns:repeat(2,1fr)}.full-summary{grid-column:1/-1}.namaa-command-bar{grid-template-columns:1fr}.main-nav{display:none}.header-search{max-width:none}.video-layout{grid-template-columns:1fr!important}}
@media (max-width:760px){body{padding-bottom:74px}.wrap{padding:14px!important}.header-inner{height:62px;padding:0 14px}.brand-text span{font-size:18px}.brand-text small{display:none}.brand-mark{width:30px;height:30px}.header-search,.theme-toggle{display:none!important}.menu-toggle,.search-open{display:inline-grid!important}.namaa-hero{display:block;margin-top:8px}.namaa-hero-main{min-height:420px;padding:28px 22px;background:linear-gradient(0deg,rgba(7,17,31,.95) 0%,rgba(7,17,31,.62) 58%,rgba(7,17,31,.15) 100%),var(--hero-img) center/cover no-repeat}.namaa-hero h1{font-size:31px}.namaa-hero-main p{font-size:15px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.hero-meta{gap:10px;font-size:12px}.hero-ai-panel{display:none}.hero-actions{gap:10px}.primary-btn,.secondary-btn{min-height:42px;padding:8px 15px!important;font-size:13px}.namaa-command-bar{display:block}.namaa-command-bar .hero-search{display:none}.stats-grid{grid-template-columns:repeat(4,1fr);gap:7px;margin:10px 0}.stat{padding:9px 7px!important;text-align:center}.stat strong{font-size:16px}.stat span{font-size:10px}.trending-chips{overflow-x:auto;flex-wrap:nowrap;padding-bottom:6px}.trending-chips a{white-space:nowrap}.row-head h2,.section-head h2{font-size:20px}.row-controls{display:none}.row-scroller{grid-auto-columns:72%;gap:10px}.video-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}.video-tile h3{font-size:12px!important;min-height:40px}.tile-preview{display:none}.tile-body{padding:10px!important}.meta{font-size:10px!important}.badge{font-size:10px;padding:3px 7px}.ai-pill{font-size:10px}.fomo{font-size:10px;padding:3px 7px}.duration{font-size:10px}.bottom-nav{position:fixed;display:grid!important;grid-template-columns:repeat(5,1fr);bottom:0;right:0;left:0;height:66px;background:rgba(7,17,31,.94);border-top:1px solid var(--n-line);z-index:1100;backdrop-filter:blur(16px);padding:6px 4px}.bottom-nav a,.bottom-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--n-text2)!important;background:transparent!important;border:0!important;text-decoration:none!important;margin:0!important;padding:0!important;font-size:11px!important}.bottom-nav span{font-size:18px;color:var(--n-gold2)}.category-grid,.playlist-grid{grid-template-columns:1fr 1fr!important;gap:10px!important}.category-card,.playlist-card{padding:14px!important}.video-layout{grid-template-columns:1fr!important}.mini-card{grid-template-columns:110px 1fr!important}.hero-dots{display:none}}
@media (max-width:430px){.video-grid{grid-template-columns:1fr!important}.row-scroller{grid-auto-columns:82%}.category-grid,.playlist-grid{grid-template-columns:1fr!important}}

/* =========================
   Namaa Premium Watch Page v3
   ========================= */
.premium-watch-page{position:relative;display:block;margin-top:16px}.watch-breadcrumbs{display:flex;align-items:center;gap:10px;color:var(--n-muted);font-size:13px;margin:4px 0 16px}.watch-breadcrumbs a{color:var(--n-text2)!important;text-decoration:none!important}.watch-breadcrumbs strong{color:var(--n-gold2);font-weight:900}.watch-hero-shell{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;margin-bottom:18px}.watch-hero-bg{position:absolute;inset:-22px -28px auto -28px;height:460px;background:linear-gradient(180deg,rgba(7,17,31,.54),var(--n-bg) 88%),linear-gradient(90deg,rgba(7,17,31,.72),rgba(7,17,31,.25)),var(--watch-bg) center/cover no-repeat;filter:blur(22px) saturate(1.12);opacity:.55;z-index:-1}.watch-player-column{min-width:0}.premium-player{position:relative;aspect-ratio:16/9;background:#000;border-radius:26px;overflow:hidden;border:1px solid rgba(212,160,23,.22);box-shadow:0 30px 90px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.04)}.premium-player:before{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);pointer-events:none;z-index:2}.premium-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.premium-auto-next,.premium-continue{margin-top:12px;background:rgba(16,28,46,.88);border:1px solid var(--n-line);border-radius:16px;padding:12px 14px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:10px;box-shadow:0 12px 36px rgba(0,0,0,.22)}.premium-auto-next a,.premium-continue button{background:var(--n-gold)!important;color:#07111f!important;border:0!important;border-radius:999px!important;padding:8px 13px!important;font-weight:900!important;text-decoration:none!important}.premium-auto-next button{background:transparent!important;border:1px solid var(--n-line)!important;color:var(--n-text2)!important;border-radius:999px!important;padding:8px 13px!important}.watch-ai-card{background:linear-gradient(180deg,rgba(16,28,46,.92),rgba(7,17,31,.92));border:1px solid rgba(212,160,23,.2);border-radius:26px;padding:22px;box-shadow:0 24px 70px rgba(0,0,0,.34);align-self:stretch;display:flex;flex-direction:column;gap:15px}.watch-ai-card h2{margin:0;color:#fff;font-size:22px}.watch-ai-card p{margin:0;color:var(--n-text2);line-height:1.85;font-size:14px}.watch-score-list{display:grid;gap:10px;margin-top:auto}.watch-score-list div{display:flex;justify-content:space-between;align-items:center;gap:12px;background:rgba(7,17,31,.55);border:1px solid var(--n-line);border-radius:16px;padding:12px}.watch-score-list span{color:var(--n-muted);font-size:13px}.watch-score-list b{font-weight:950}.watch-score-list .green{color:#86efac}.watch-score-list .gold{color:var(--n-gold2)}.watch-title-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:end;margin:18px 0 20px;padding:20px;border:1px solid var(--n-line);border-radius:24px;background:linear-gradient(180deg,rgba(16,28,46,.72),rgba(8,18,32,.72));box-shadow:0 18px 50px rgba(0,0,0,.22)}.watch-badges-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}.duration-soft{background:rgba(255,255,255,.06);border:1px solid var(--n-line);color:var(--n-text2);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:900}.watch-title-copy h1{margin:0 0 10px;font-size:clamp(25px,3vw,42px);line-height:1.35;color:#fff;letter-spacing:-.6px}.premium-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.premium-actions .primary-btn,.premium-actions .secondary-btn{margin:0!important;white-space:nowrap}.premium-watch-layout{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:18px;align-items:start}.watch-content-column,.watch-side-column{display:grid;gap:16px;min-width:0}.watch-side-column{position:sticky;top:92px}.premium-panel{background:linear-gradient(180deg,rgba(16,28,46,.96),rgba(8,18,32,.96))!important;border:1px solid var(--n-line)!important;border-radius:24px!important;box-shadow:0 18px 50px rgba(0,0,0,.24)!important;padding:22px!important;overflow:hidden}.section-head.compact{margin-bottom:14px}.section-head.compact h2{font-size:21px}.summary-lead{color:var(--n-text2);font-size:16px;line-height:2;margin:0 0 18px}.summary-cards-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.summary-card{background:rgba(7,17,31,.6);border:1px solid var(--n-line);border-radius:18px;padding:16px;min-height:110px}.summary-card span{display:block;color:var(--n-muted);font-size:12px;margin-bottom:8px}.summary-card strong{display:block;color:#fff;font-size:15px;line-height:1.65}.premium-key-points{counter-reset:item;display:grid;gap:10px;margin:0;padding:0;list-style:none}.premium-key-points li{position:relative;background:rgba(7,17,31,.58);border:1px solid var(--n-line);border-radius:16px;padding:14px 48px 14px 14px;color:var(--n-text2);line-height:1.75}.premium-key-points li:before{counter-increment:item;content:counter(item);position:absolute;right:14px;top:14px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--n-gold),var(--n-gold2));color:#07111f;font-size:12px;font-weight:950}.premium-chapter-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.premium-chapter-list button{display:flex!important;align-items:center!important;gap:10px!important;text-align:right!important;background:rgba(7,17,31,.6)!important;border:1px solid var(--n-line)!important;border-radius:16px!important;padding:12px!important;color:#fff!important;margin:0!important}.premium-chapter-list span{color:var(--n-gold2);font-weight:950;background:rgba(212,160,23,.12);padding:4px 8px;border-radius:999px}.premium-chapter-list strong{font-size:13px;line-height:1.55}.premium-tags{display:flex;gap:8px;flex-wrap:wrap}.premium-tags a{background:rgba(212,160,23,.09)!important;border:1px solid rgba(212,160,23,.28)!important;color:var(--n-gold2)!important;border-radius:999px!important;text-decoration:none!important;padding:8px 12px!important;font-weight:800!important;font-size:13px}.warning-panel{background:linear-gradient(180deg,rgba(59,31,31,.7),rgba(16,28,46,.92))!important;border-color:rgba(249,115,22,.22)!important}.warning-panel h2{color:#fed7aa;margin-top:0}.warning-panel p{color:#ffedd5;line-height:1.8;margin-bottom:0}.premium-side-tile{box-shadow:none!important}.next-premium-card .video-tile{width:100%!important}.next-premium-card .tile-preview{display:none}.next-premium-card .row-scroller{display:block!important}.radial-score{width:142px;height:142px;margin:6px auto 18px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at center,var(--n-card) 56%,transparent 57%),conic-gradient(var(--n-gold) calc(var(--score,82)*1%),rgba(148,163,184,.14) 0);border:1px solid rgba(212,160,23,.22);box-shadow:inset 0 0 35px rgba(212,160,23,.08)}.radial-score strong{display:block;color:#fff;font-size:38px;line-height:1;text-align:center}.radial-score span{display:block;color:var(--n-muted);font-size:12px;text-align:center;margin-top:-44px}.premium-scores{display:grid!important;gap:8px!important}.premium-scores .score{display:flex!important;justify-content:space-between!important;align-items:center!important;padding:10px 12px!important;border-radius:14px!important;background:rgba(7,17,31,.62)!important}.premium-queue-list{display:grid;gap:10px}.premium-queue-item{display:grid;grid-template-columns:112px minmax(0,1fr) auto;gap:10px;align-items:center;background:rgba(7,17,31,.55);border:1px solid var(--n-line);border-radius:16px;padding:8px;text-decoration:none!important;color:#fff!important;transition:transform .18s ease,border-color .18s ease}.premium-queue-item:hover{transform:translateX(-3px);border-color:rgba(212,160,23,.45)}.premium-queue-item img{width:112px;height:63px;object-fit:cover;border-radius:12px}.premium-queue-item span{font-size:13px;line-height:1.55;color:var(--n-text2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.premium-queue-item em{font-style:normal;color:#86efac;background:rgba(22,163,74,.14);border:1px solid rgba(22,163,74,.32);padding:4px 7px;border-radius:999px;font-size:11px;font-weight:950}.watch-empty{text-align:center;padding:60px!important}
@media (max-width:1150px){.watch-hero-shell,.premium-watch-layout{grid-template-columns:1fr}.watch-side-column{position:static;grid-template-columns:repeat(2,1fr)}.premium-queue-panel{grid-column:1/-1}.summary-cards-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.premium-watch-page{margin-top:4px}.watch-breadcrumbs{display:none}.watch-hero-shell{display:block;margin-left:-14px;margin-right:-14px}.watch-hero-bg{display:none}.premium-player{border-radius:0;border-left:0;border-right:0;box-shadow:0 16px 40px rgba(0,0,0,.35)}.watch-ai-card{margin:12px 14px 0;border-radius:20px;padding:16px}.watch-ai-card h2{font-size:18px}.watch-ai-card p{font-size:13px;line-height:1.75}.watch-score-list{grid-template-columns:repeat(2,1fr);gap:8px}.watch-score-list div{display:block;padding:10px}.watch-score-list span{display:block;margin-bottom:4px;font-size:11px}.watch-title-bar{display:block;margin:14px 0;padding:16px;border-radius:20px}.watch-title-copy h1{font-size:22px;line-height:1.55}.premium-actions{justify-content:stretch;margin-top:14px}.premium-actions .primary-btn,.premium-actions .secondary-btn{flex:1;min-width:0;padding:9px 10px!important;font-size:12px!important}.premium-watch-layout{display:block}.watch-content-column,.watch-side-column{display:grid;gap:12px}.watch-side-column{margin-top:12px;grid-template-columns:1fr}.premium-panel{border-radius:20px!important;padding:16px!important}.summary-lead{font-size:14px;line-height:1.9}.summary-cards-grid{grid-template-columns:1fr 1fr;gap:8px}.summary-card{padding:12px;min-height:96px}.summary-card strong{font-size:13px}.premium-chapter-list{grid-template-columns:1fr}.premium-queue-item{grid-template-columns:104px minmax(0,1fr);position:relative}.premium-queue-item img{width:104px;height:59px}.premium-queue-item em{position:absolute;left:8px;bottom:8px}.radial-score{width:120px;height:120px}.radial-score strong{font-size:31px}.radial-score span{margin-top:-36px}.premium-auto-next,.premium-continue{margin:10px 14px;border-radius:14px;font-size:12px}.content-row{margin-top:20px!important}}
@media (max-width:430px){.watch-score-list,.summary-cards-grid{grid-template-columns:1fr}.premium-actions{display:grid;grid-template-columns:1fr 1fr}.premium-actions .primary-btn{grid-column:1/-1}.watch-badges-row{gap:6px}.premium-key-points li{padding-left:12px}.premium-queue-item span{font-size:12px}}

/* =========================================================
   Namaa TV Mobile App Experience v4
   Turns the mobile website into a premium dark Arabic app UI
   ========================================================= */
@media (max-width: 760px){
  :root{
    --mobile-pad:16px;
    --mobile-bottom:84px;
    --mobile-card:#0d1a2b;
    --mobile-card2:#111f33;
  }
  html,body{max-width:100%;overflow-x:hidden;background:#06101d!important;color:#f8fafc!important}
  body{padding-bottom:calc(var(--mobile-bottom) + env(safe-area-inset-bottom,0px))!important;background:
    radial-gradient(circle at 50% -8%,rgba(212,160,23,.16),transparent 24%),
    radial-gradient(circle at 0% 10%,rgba(0,121,107,.18),transparent 34%),
    linear-gradient(180deg,#06101d 0%,#07111f 42%,#050b14 100%)!important;
  }
  .wrap{padding:12px var(--mobile-pad) 18px!important;max-width:100%!important}

  /* top mobile bar */
  .site-header{background:rgba(6,16,29,.82)!important;backdrop-filter:blur(20px);border-bottom:1px solid rgba(34,50,74,.58)!important;box-shadow:0 16px 45px rgba(0,0,0,.28)}
  .header-inner{height:66px!important;padding:0 14px!important;gap:10px!important;display:grid!important;grid-template-columns:42px 1fr 42px!important;align-items:center!important}
  .brand{margin:0!important;justify-self:center;gap:7px!important;min-width:0}
  .brand-logo{max-width:88px!important;max-height:34px!important;object-fit:contain!important}
  .brand-mark{width:28px!important;height:28px!important;border-radius:10px!important;font-size:14px!important;display:none!important}
  .brand-text span{font-size:20px!important;color:var(--n-gold2)!important;white-space:nowrap}
  .brand-text small{font-size:9px!important;text-align:center;color:#94a3b8!important}
  .header-search,.main-nav,.theme-toggle{display:none!important}
  .search-open{display:grid!important;grid-column:3!important;justify-self:end;width:40px!important;height:40px!important;border:1px solid rgba(255,255,255,.08)!important;background:rgba(16,28,46,.65)!important;color:#fff!important;font-size:22px!important}
  .menu-toggle{display:grid!important;grid-column:1!important;grid-row:1!important;justify-self:start;width:40px!important;height:40px!important;border:1px solid rgba(255,255,255,.08)!important;background:rgba(16,28,46,.65)!important;color:#fff!important;font-size:20px!important}

  /* bottom app navigation */
  .bottom-nav{position:fixed!important;right:10px!important;left:10px!important;bottom:10px!important;z-index:2000;height:66px!important;padding:7px 8px calc(7px + env(safe-area-inset-bottom,0px))!important;background:rgba(6,16,29,.93)!important;border:1px solid rgba(34,50,74,.9)!important;border-radius:26px!important;box-shadow:0 18px 60px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.05)!important;backdrop-filter:blur(22px);display:grid!important;grid-template-columns:repeat(5,1fr)!important;gap:2px!important}
  .bottom-nav a,.bottom-nav button{height:52px!important;border:0!important;background:transparent!important;color:#cbd5e1!important;text-decoration:none!important;font-size:10px!important;font-weight:800!important;border-radius:18px!important;display:flex!important;align-items:center!important;justify-content:center!important;flex-direction:column!important;gap:2px!important;padding:0!important;margin:0!important;line-height:1.1!important}
  .bottom-nav a:first-child,.bottom-nav a:hover,.bottom-nav button:hover{color:var(--n-gold2)!important;background:rgba(212,160,23,.10)!important}
  .bottom-nav span{font-size:20px!important;line-height:1!important;display:block!important}

  /* home hero exactly like app mockup */
  .namaa-hero{display:block!important;margin:10px 0 18px!important}
  .namaa-hero-main{min-height:420px!important;border-radius:28px!important;padding:26px 18px 22px!important;justify-content:flex-end!important;box-shadow:0 24px 70px rgba(0,0,0,.48)!important;border:1px solid rgba(34,50,74,.9)!important;background:
    linear-gradient(0deg,rgba(6,16,29,.98) 0%,rgba(6,16,29,.78) 36%,rgba(6,16,29,.1) 74%),
    linear-gradient(90deg,rgba(6,16,29,.35),rgba(6,16,29,.05)),
    var(--hero-img) center/cover no-repeat!important;
  }
  .namaa-hero-main:before{background:radial-gradient(circle at 72% 42%,rgba(212,160,23,.22),transparent 28%)!important}
  .hero-badge{font-size:12px!important;padding:6px 13px!important;margin-bottom:14px!important;background:rgba(7,17,31,.55)!important;border-color:rgba(212,160,23,.65)!important}
  .namaa-hero h1{font-size:31px!important;line-height:1.25!important;margin-bottom:10px!important;max-width:310px!important;text-shadow:0 8px 24px rgba(0,0,0,.7)!important}
  .namaa-hero-main p{font-size:13px!important;line-height:1.8!important;margin-bottom:14px!important;max-width:300px!important;color:#dbeafe!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .hero-meta{font-size:11px!important;gap:7px!important;margin:0 0 16px!important;color:#b6c3d5!important}
  .hero-meta span:nth-child(n+3){display:none!important}
  .hero-meta strong{font-size:11px!important;padding:4px 9px!important;background:rgba(22,163,74,.22)!important;color:#86efac!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important}
  .hero-actions .primary-btn,.hero-actions .secondary-btn{min-height:44px!important;padding:10px 12px!important;font-size:13px!important;margin:0!important}
  .hero-actions button.secondary-btn{grid-column:1/-1!important;min-height:40px!important;background:rgba(7,17,31,.56)!important}
  .hero-dots{bottom:12px!important;left:50%!important;transform:translateX(-50%)!important;gap:7px!important}
  .hero-dots i{width:7px!important;height:7px!important}
  .hero-ai-panel{display:none!important}

  /* command bar disappears on mobile to reduce clutter */
  .namaa-command-bar{display:none!important}
  .trending-chips{overflow-x:auto;flex-wrap:nowrap;margin:10px -16px 16px!important;padding:0 16px 4px!important;scrollbar-width:none}
  .trending-chips::-webkit-scrollbar{display:none}
  .trending-chips a{white-space:nowrap;font-size:12px!important;padding:7px 12px!important;background:rgba(16,28,46,.8)!important;border-color:rgba(34,50,74,.9)!important;color:#dbeafe!important}
  .trending-chips a:first-child{background:linear-gradient(135deg,var(--n-gold2),var(--n-gold))!important;color:#07111f!important;border-color:transparent!important}

  /* rows like native mobile app */
  .content-row{margin:22px 0 26px!important}
  .row-head,.section-head{align-items:center!important;margin-bottom:10px!important}
  .row-head h2,.section-head h2{font-size:18px!important;letter-spacing:0!important}
  .row-head h2:before,.section-head h2:before{content:'✦';color:var(--n-gold2);font-size:14px;margin-left:6px}
  .row-head p,.section-head p{display:none!important}
  .row-controls{display:none!important}
  .row-head:after{content:'عرض الكل';font-size:12px;color:var(--n-gold2);font-weight:900}
  .row-scroller{display:grid!important;grid-auto-flow:column!important;grid-auto-columns:calc((100vw - 48px)/2)!important;gap:10px!important;margin:0 -16px!important;padding:0 16px 10px!important;overflow-x:auto!important;scrollbar-width:none!important;scroll-snap-type:x mandatory!important}
  .row-scroller::-webkit-scrollbar{display:none}

  /* mobile cards two-column feel */
  .video-tile{border-radius:18px!important;background:linear-gradient(180deg,rgba(16,28,46,.96),rgba(8,18,32,.98))!important;box-shadow:0 14px 34px rgba(0,0,0,.36)!important;border-color:rgba(34,50,74,.78)!important;scroll-snap-align:start!important;min-width:0!important}
  .video-tile:hover{transform:none!important}
  .tile-media{aspect-ratio:16/10!important;border-radius:0!important}
  .duration{right:8px!important;bottom:7px!important;font-size:10px!important;padding:2px 6px!important;border-radius:7px!important}
  .fomo{top:7px!important;right:7px!important;font-size:9px!important;padding:3px 7px!important;max-width:82px!important;overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;background:rgba(212,160,23,.22)!important}
  .play-overlay{width:27px!important;height:27px!important;left:8px!important;bottom:8px!important;font-size:10px!important}
  .tile-body{padding:10px 10px 11px!important;gap:6px!important}
  .tile-topline{gap:4px!important}
  .badge{font-size:9px!important;padding:3px 7px!important;max-width:82px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  .ai-pill{font-size:9px!important;padding:3px 7px!important;color:#86efac!important;background:rgba(22,163,74,.13)!important;border-color:rgba(22,163,74,.35)!important}
  .tile-body h3{font-size:13px!important;line-height:1.55!important;margin:0!important;min-height:42px!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
  .tile-body h3 a{color:#fff!important;text-decoration:none!important}
  .meta{font-size:10px!important;color:#94a3b8!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;margin:0!important}
  .tile-preview{display:none!important}
  .progress-line{height:3px!important;background:rgba(255,255,255,.08)!important;border-radius:999px!important;margin-top:2px!important}
  .progress-line span{height:100%!important;border-radius:999px!important;background:linear-gradient(90deg,var(--n-gold),var(--n-gold2))!important;display:block!important}
  .tile-footer{display:none!important}

  /* any normal grid becomes app cards */
  .video-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .video-grid-section{margin-top:12px!important}

  /* categories screen like the mockup */
  .search-results-hero,.account-hero{margin:8px 0 16px!important;padding:20px!important;border:1px solid rgba(34,50,74,.9)!important;border-radius:24px!important;background:linear-gradient(180deg,rgba(16,28,46,.88),rgba(8,18,32,.92))!important;box-shadow:0 16px 42px rgba(0,0,0,.3)!important}
  .search-results-hero h1,.account-hero h1{font-size:23px!important;line-height:1.35!important;margin:6px 0!important;color:#fff!important}
  .search-results-hero p,.account-hero p{font-size:13px!important;color:#94a3b8!important;margin:0!important}
  .eyebrow{color:var(--n-gold2)!important;font-weight:950!important;font-size:12px!important}
  .category-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .category-card{min-height:122px!important;border-radius:20px!important;background:linear-gradient(180deg,rgba(16,28,46,.96),rgba(8,18,32,.98))!important;border:1px solid rgba(34,50,74,.9)!important;box-shadow:0 14px 34px rgba(0,0,0,.28)!important;text-decoration:none!important;color:#fff!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;padding:16px 10px!important;gap:8px!important;position:relative!important;overflow:hidden!important}
  .category-card:before{content:'▰';font-size:31px;color:var(--n-gold2);line-height:1;filter:drop-shadow(0 8px 18px rgba(212,160,23,.22))}
  .category-card:nth-child(2n):before{content:'↗';color:#22c55e}
  .category-card:nth-child(3n):before{content:'◎';color:#38bdf8}
  .category-card strong{font-size:15px!important;line-height:1.5!important;color:#fff!important}
  .category-card span{font-size:11px!important;color:#94a3b8!important}

  /* watch page mobile like second phone */
  .premium-watch-page{margin:0!important}
  .watch-hero-shell{margin:0 -16px 0!important;border-radius:0!important;background:transparent!important}
  .premium-player{border-radius:0 0 24px 24px!important;border-top:0!important;box-shadow:0 20px 60px rgba(0,0,0,.52)!important;position:sticky;top:66px;z-index:20}
  .watch-ai-card{margin:12px 0 0!important;border-radius:22px!important;background:linear-gradient(180deg,rgba(16,28,46,.98),rgba(8,18,32,.98))!important;border-color:rgba(34,50,74,.9)!important;box-shadow:0 16px 42px rgba(0,0,0,.32)!important}
  .watch-ai-card .hero-badge{margin-bottom:4px!important;padding:5px 10px!important}
  .watch-score-list{grid-template-columns:repeat(2,1fr)!important}
  .watch-title-bar{margin:12px 0!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
  .watch-title-copy h1{font-size:21px!important;line-height:1.55!important;color:#fff!important;margin-bottom:8px!important}
  .watch-badges-row{margin-bottom:8px!important}
  .premium-actions{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:8px!important;margin-top:12px!important}
  .premium-actions .primary-btn,.premium-actions .secondary-btn{min-height:52px!important;border-radius:18px!important;font-size:11px!important;padding:8px 6px!important;background:linear-gradient(180deg,rgba(16,28,46,.9),rgba(8,18,32,.9))!important;border:1px solid rgba(34,50,74,.9)!important;color:#dbeafe!important;box-shadow:none!important}
  .premium-actions .primary-btn{background:rgba(212,160,23,.13)!important;color:var(--n-gold2)!important;border-color:rgba(212,160,23,.35)!important;grid-column:auto!important}
  .premium-panel{border-radius:22px!important;background:linear-gradient(180deg,rgba(16,28,46,.96),rgba(8,18,32,.98))!important;border-color:rgba(34,50,74,.88)!important;box-shadow:0 16px 40px rgba(0,0,0,.3)!important;margin-bottom:12px!important}
  .summary-cards-grid{grid-template-columns:repeat(2,1fr)!important}
  .premium-key-points li{font-size:13px!important;border-radius:16px!important;background:rgba(6,16,29,.65)!important}
  .premium-queue-item{border-radius:18px!important;background:rgba(6,16,29,.62)!important;grid-template-columns:118px minmax(0,1fr)!important}
  .premium-queue-item img{width:118px!important;height:66px!important;border-radius:14px!important}

  /* search overlay as full mobile search */
  .search-overlay{position:fixed!important;inset:0!important;z-index:3000!important;background:rgba(3,8,15,.84)!important;backdrop-filter:blur(18px)!important;padding:76px 14px 14px!important}
  .search-dialog{border-radius:26px!important;background:linear-gradient(180deg,rgba(16,28,46,.98),rgba(8,18,32,.98))!important;border:1px solid rgba(34,50,74,.9)!important;box-shadow:0 24px 70px rgba(0,0,0,.55)!important;padding:16px!important}
  .search-dialog form{display:grid!important;grid-template-columns:1fr auto!important;gap:8px!important;background:rgba(6,16,29,.72)!important;border:1px solid rgba(34,50,74,.9)!important;border-radius:18px!important;padding:7px!important}
  .search-dialog input{height:44px!important;border:0!important;background:transparent!important;color:#fff!important;padding:0 10px!important}
  .search-dialog button[type=submit]{height:44px!important;border-radius:14px!important;background:var(--n-gold)!important;color:#07111f!important;border:0!important;font-weight:950!important;padding:0 18px!important}
  .close-btn{background:rgba(255,255,255,.06)!important;border:1px solid rgba(34,50,74,.9)!important;color:#fff!important;border-radius:50%!important;width:38px!important;height:38px!important}

  /* account page like profile screen */
  .auth-grid,.account-grid{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}
  .account-card,.notice{border-radius:22px!important;background:linear-gradient(180deg,rgba(16,28,46,.96),rgba(8,18,32,.98))!important;border:1px solid rgba(34,50,74,.88)!important;box-shadow:0 16px 40px rgba(0,0,0,.3)!important;padding:18px!important;color:#fff!important}
  .account-card input,.account-card textarea,.account-card select{background:rgba(6,16,29,.72)!important;border:1px solid rgba(34,50,74,.9)!important;color:#fff!important;border-radius:14px!important;min-height:44px!important;padding:10px 12px!important;width:100%!important}
  .account-card label{font-size:12px!important;color:#cbd5e1!important;font-weight:800!important}
  .account-form{display:grid!important;gap:10px!important}
  .notice.ok{border-color:rgba(22,163,74,.35)!important;color:#bbf7d0!important}.notice.bad{border-color:rgba(220,38,38,.35)!important;color:#fecaca!important}

  /* footer */
  .site-footer{padding:24px 16px 96px!important;color:#64748b!important;text-align:center!important;font-size:11px!important;border-top:1px solid rgba(34,50,74,.5)!important;margin-top:24px!important}
}

@media (max-width: 390px){
  .row-scroller{grid-auto-columns:calc((100vw - 42px)/2)!important;gap:9px!important}
  .namaa-hero-main{min-height:390px!important;padding:22px 16px 20px!important}
  .namaa-hero h1{font-size:28px!important}
  .tile-body h3{font-size:12px!important}
  .bottom-nav{right:7px!important;left:7px!important;border-radius:23px!important}
  .bottom-nav a,.bottom-nav button{font-size:9px!important}
}