:root{
  color-scheme:dark;
  --color-bg:#0c0c0e;--color-surface:#18181c;--color-text:#f6f6f7;
  --muted:#aaaab3;--line:#ffffff1f;--red:#ff393f;
  --font-body:'Satoshi',sans-serif;--font-display:'Satoshi',sans-serif;
  --text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.25rem;
  --text-xl:clamp(1.5rem,2.4vw,2.15rem);--text-2xl:clamp(2rem,4vw,3.5rem);
  --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;
  --space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;
  --space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;
}
html[lang=ar]{--font-body:'IBM Plex Sans Arabic',sans-serif;--font-display:'IBM Plex Sans Arabic',sans-serif}
body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);line-height:1.5}
button,input,select{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}button{cursor:pointer;color:inherit}
button:disabled{cursor:not-allowed;opacity:.4}
button{border:0;background:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #bfe9ff;outline-offset:4px}
.skip{position:fixed;inset-block-start:-5rem;inset-inline-start:var(--space-4);z-index:100;background:white;color:black;padding:var(--space-4)}
.skip:focus{inset-block-start:0}
.shell{width:min(1440px,calc(100% - 96px));margin-inline:auto}
#header{height:88px;background:#101012f5;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30;backdrop-filter:blur(20px)}
.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}
.wordmark{font-size:1.75rem;font-weight:900;letter-spacing:-.09em;font-style:oblique;line-height:1;white-space:nowrap}
.wordmark .dot{color:var(--red);font-style:normal}
.header-brand{display:flex;align-items:center;gap:var(--space-3)}
.brand-note{font-size:var(--text-xs);line-height:1.25;border-inline-start:1px solid var(--line);padding-inline-start:var(--space-3);color:var(--muted);max-width:85px}
.nav{display:flex;align-items:center;padding:var(--space-1);border:1px solid #ffffff26;background:#222225;border-radius:99px;gap:var(--space-1)}
.nav a{font-size:var(--text-sm);font-weight:700;padding:var(--space-3) var(--space-5);border-radius:99px;color:#c9c9d0;white-space:nowrap}
.nav a.active{background:#45474c;color:#fff;box-shadow:0 0 26px #96e4e82e,inset 0 0 0 1px #ffffff22}
.header-tools{display:flex;align-items:center;gap:var(--space-2)}
.icon-btn{width:44px;height:44px;display:inline-grid;place-items:center;border-radius:50%}
.icon-btn:hover{background:#ffffff12}
svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.languages{display:flex;align-items:center;gap:var(--space-1);margin-inline-start:var(--space-2)}
.languages a{font-size:var(--text-xs);min-width:34px;min-height:44px;display:grid;place-items:center;color:var(--muted)}
.languages a.active{color:#fff;font-weight:900}
.hero{height:590px;position:relative;overflow:hidden;background:#19222a}
.hero-picture,.hero-picture img{width:100%;height:100%;object-fit:cover}
.hero-picture img{object-position:center 43%}
.hero-shade{position:absolute;inset:0;background:linear-gradient(0deg,#ba071a 0%,#bd0828bb 13%,#0b0c1555 42%,#0b0c1500 76%),linear-gradient(90deg,#07101a66,transparent)}
.hero-content{position:absolute;bottom:var(--space-16);inset-inline:var(--space-6);text-align:center;display:flex;align-items:center;flex-direction:column}
.tag{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);font-weight:700;background:#131319c9;border:1px solid #ffffff25;border-radius:99px;padding:var(--space-2) var(--space-3)}
.red-dot{height:6px;width:6px;display:inline-block;background:var(--red);border-radius:50%}
.hero h1{font-size:var(--text-2xl);font-weight:900;letter-spacing:-.045em;line-height:1.12;max-width:900px;margin-block:var(--space-5) var(--space-4);text-wrap:balance}
.hero-desc{font-size:var(--text-base);color:#f3e8eb;max-width:640px}
.hero-actions{display:flex;gap:var(--space-3);margin-top:var(--space-6)}
.button{display:inline-flex;gap:var(--space-2);align-items:center;justify-content:center;padding:var(--space-3) var(--space-5);min-height:46px;border-radius:99px;font-weight:700;font-size:var(--text-sm);background:white;color:#18181b}
.button.outline{color:white;background:#ffffff0f;border:1px solid #ffffff66}
.hero-bottom{position:absolute;bottom:var(--space-5);inset-inline:var(--space-12);display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}
.hero-dots{display:flex;gap:var(--space-2)}
.hero-dots button{width:38px;height:44px;position:relative}
.hero-dots button:before{content:"";position:absolute;height:3px;inset-inline:0;top:20px;background:#ffffff66}
.hero-dots button.active:before{background:#fff}
.hero-index,.demo-small{font-size:var(--text-xs);color:#fff}
.demo-small{border:1px solid #ffffff55;padding:var(--space-1) var(--space-2);border-radius:4px}
.topic-strip{border-bottom:1px solid var(--line)}
.topics{display:flex;align-items:center;gap:var(--space-6);overflow-x:auto;scrollbar-width:none;min-height:65px}
.topics a{font-size:var(--text-sm);font-weight:700;white-space:nowrap;color:var(--muted);min-height:48px;display:flex;align-items:center}
.topics a:hover,.topics a.selected{color:#fff}
.topics .strip-label{color:#fff;display:flex;align-items:center;gap:var(--space-2);margin-inline-end:var(--space-2);white-space:nowrap;flex-shrink:0}
.section{padding-block:var(--space-12)}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-6)}
.heading-wrap{display:flex;align-items:center;gap:var(--space-3)}
.section-mark{width:4px;height:24px;background:var(--red);border-radius:4px}
.section-head h2{font-size:var(--text-xl);font-weight:900;letter-spacing:-.035em}
.section-head .meta,.section-head>a{font-size:var(--text-xs);color:var(--muted)}
.section-controls{display:flex;align-items:center;gap:var(--space-2)}
.section-controls button{border:1px solid var(--line)}
.shorts-row{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 5 * 16px)/6);gap:var(--space-4);overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory}
.short-card{position:relative;aspect-ratio:9/14;overflow:hidden;border-radius:8px;background:#242429;scroll-snap-align:start;display:block;text-align:start;width:100%}
.short-card>img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.short-card:hover>img,.news-card:hover img{transform:scale(1.035)}
.short-shade{position:absolute;inset:0;background:linear-gradient(0deg,#000e,transparent 75%)}
.short-top{position:absolute;top:var(--space-3);inset-inline:var(--space-3);display:flex;justify-content:space-between;align-items:center}
.short-top .badge{font-size:var(--text-xs);font-weight:700;padding:var(--space-1) var(--space-2);background:#0009;border-radius:4px}
.round-play{background:#ffffff1f;backdrop-filter:blur(8px);border:1px solid #ffffff55;display:grid;place-items:center;border-radius:50%;width:32px;height:32px}
.round-play svg{width:14px;height:14px;fill:white;stroke:white}
.short-copy{position:absolute;bottom:var(--space-4);inset-inline:var(--space-3)}
.short-copy small{color:#ddd;font-size:var(--text-xs)}
.short-copy h3{font-size:var(--text-base);font-weight:900;line-height:1.25;margin-top:var(--space-2)}
.short-copy .short-footer{display:flex;justify-content:space-between;align-items:center;color:#bcbcc5;font-size:var(--text-xs);margin-top:var(--space-3)}
.news-layout{display:grid;grid-template-columns:minmax(0,3.5fr) minmax(235px,1fr);gap:var(--space-10);border-top:1px solid var(--line)}
.news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-6)}
.news-card{min-width:0}
.news-image{aspect-ratio:16/10;border-radius:6px;overflow:hidden;position:relative;background:#25252b;display:block}
.news-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.image-label{position:absolute;bottom:var(--space-2);inset-inline-start:var(--space-2);font-size:var(--text-xs);background:#101014cc;padding:var(--space-1) var(--space-2);border-radius:3px}
.news-card .eyebrow{color:#ff8a8f;font-size:var(--text-xs);display:block;margin-top:var(--space-4)}
.news-card h3{font-size:var(--text-lg);font-weight:900;line-height:1.3;margin-block:var(--space-2) var(--space-3)}
.card-meta{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);font-size:var(--text-xs);color:var(--muted)}
.card-meta button{width:44px;height:44px}
.saved{color:#ff7379}
.feed{border-inline-start:1px solid var(--line);padding-inline-start:var(--space-6);margin-block:var(--space-12)}
.feed-heading{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-lg);font-weight:900;margin-bottom:var(--space-5)}
.feed-item{display:grid;grid-template-columns:30px 1fr;gap:var(--space-3);padding-block:var(--space-4);border-bottom:1px solid var(--line)}
.feed-number{color:#92929f;font-size:var(--text-xs);padding-top:var(--space-1)}
.feed-item small{font-size:var(--text-xs);color:var(--muted)}.feed-item h3{font-size:var(--text-sm);line-height:1.5;margin-top:var(--space-2)}
.feature-band{background:#141418;padding-block:var(--space-12);border-block:1px solid var(--line)}
.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.feature-card{aspect-ratio:16/9;position:relative;overflow:hidden;border-radius:8px;display:block}
.feature-card>img{width:100%;height:100%;object-fit:cover}
.feature-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#03030aeb,transparent)}
.feature-copy{position:absolute;bottom:var(--space-6);inset-inline:var(--space-6);z-index:1}
.feature-copy h3{font-size:var(--text-xl);font-weight:900;line-height:1.2;margin-top:var(--space-3)}
.editorial-note{display:flex;justify-content:space-between;align-items:center;gap:var(--space-8);padding-block:var(--space-10);border-bottom:1px solid var(--line)}
.editorial-note p{max-width:700px;color:var(--muted);font-size:var(--text-sm)}
.editorial-note h2{font-size:var(--text-lg);margin-bottom:var(--space-2)}
.footer-top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);padding-block:var(--space-10)}
.footer-links{display:flex;align-items:center;gap:var(--space-6);flex-wrap:wrap;font-size:var(--text-sm);color:var(--muted)}
.footer-bottom{padding-block:var(--space-5);border-top:1px solid var(--line);color:var(--muted);font-size:var(--text-xs);display:flex;justify-content:space-between;gap:var(--space-4)}
.page-heading{padding-block:var(--space-12) var(--space-8)}
.page-heading h1{font-size:var(--text-2xl);font-weight:900;line-height:1.2}
.page-heading p{font-size:var(--text-base);color:var(--muted);margin-top:var(--space-4);max-width:750px}
.filter-row{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-block:var(--space-6)}
.filter-row button{border:1px solid var(--line);padding:var(--space-3) var(--space-5);border-radius:99px;font-size:var(--text-sm)}
.filter-row button.active{background:white;color:#111}
.archive-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-8) var(--space-5);padding-bottom:var(--space-16)}
.archive-shorts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--space-4);padding-bottom:var(--space-16)}
.empty{padding:var(--space-16) var(--space-4);text-align:center;color:var(--muted);grid-column:1/-1}
.article-wrap{max-width:800px;margin:auto;padding-inline:var(--space-6)}
.article-head{padding-block:var(--space-10)}
.back{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--muted);margin-bottom:var(--space-6)}
.article-head h1{font-size:var(--text-2xl);line-height:1.15;font-weight:900;margin-block:var(--space-4)}
.article-lead{font-size:var(--text-lg);color:#cccdd6;margin-block:var(--space-5)}
.article-cover{max-width:1200px;margin:auto;aspect-ratio:21/9;overflow:hidden}.article-cover img{height:100%;width:100%;object-fit:cover}
.article-body{padding-block:var(--space-10);font-size:1.125rem;line-height:1.9}
.article-body p{margin-bottom:var(--space-6)}
.disclosure{border-inline-start:3px solid var(--red);padding:var(--space-4) var(--space-5);background:#ffffff05;color:var(--muted);font-size:var(--text-sm);line-height:1.7;margin-block:var(--space-6)}
.article-body h2{font-size:var(--text-xl);margin-block:var(--space-8) var(--space-4)}
dialog{color:white;background:#141418;border:1px solid #ffffff28;border-radius:12px;width:min(850px,calc(100% - 32px));max-height:90dvh;padding:0;margin:auto}
dialog::backdrop{background:#000d;backdrop-filter:blur(12px)}
.modal-top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--line)}
.modal-top h2{font-size:var(--text-lg)}
.modal-body{padding:var(--space-6)}
.modal-body p{color:#c4c4ce;margin-bottom:var(--space-5);line-height:1.8}
.modal-body h3{font-size:var(--text-lg);margin-bottom:var(--space-3)}
.player-video{display:block;background:#000;width:100%;max-height:65dvh}
.player-details{padding:var(--space-5)}.player-details h3{font-size:var(--text-lg);margin-bottom:var(--space-3)}
.player-actions{display:flex;gap:var(--space-3);margin-top:var(--space-4);flex-wrap:wrap}
.search-field{width:100%;border:1px solid #ffffff38;background:#242429;border-radius:8px;color:white;font-size:var(--text-lg);padding:var(--space-4)}
.search-field::placeholder{color:var(--muted)}
.search-results{display:grid;gap:var(--space-2);padding-top:var(--space-5)}
.search-result{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3);border-radius:6px}
.search-result:hover{background:#ffffff0b}
.search-result img{width:80px;height:55px;object-fit:cover;border-radius:4px}
.search-result span{display:block;font-size:var(--text-xs);color:var(--muted);margin-bottom:var(--space-1)}
.search-result strong{font-size:var(--text-base)}
#toast{position:fixed;bottom:var(--space-6);inset-inline:var(--space-4);margin:auto;width:fit-content;max-width:calc(100% - 32px);background:white;color:#17171c;padding:var(--space-3) var(--space-5);border-radius:99px;z-index:100;opacity:0;pointer-events:none;font-size:var(--text-sm)}
#toast.show{opacity:1}
html[dir=rtl] .hero h1,html[dir=rtl] h2,html[dir=rtl] h3{letter-spacing:0}
html[dir=rtl] .back svg,html[dir=rtl] .directional{transform:scaleX(-1)}
@media(min-width:1700px){.hero{height:690px}}
@media(max-width:1150px){
 .shell{width:calc(100% - 48px)}.brand-note{display:none}.header-inner{gap:var(--space-3)}
 .nav a{padding-inline:var(--space-4)}.shorts-row{grid-auto-columns:calc((100% - 3 * 16px)/4)}
 .news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.news-card:last-child{display:none}.archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:800px){
 #header{height:auto}.header-inner{flex-wrap:wrap;padding-block:var(--space-4);gap:var(--space-3)}
 .nav{order:3;justify-content:center;width:100%;padding:var(--space-1);overflow:auto}.nav a{flex:1;text-align:center;padding:var(--space-2) var(--space-3);min-height:40px;display:grid;place-items:center}
 .header-brand{margin-inline-end:auto}.hero{height:560px}.hero h1{max-width:620px}
 .hero-content{bottom:var(--space-20)}.hero-bottom{inset-inline:var(--space-6)}
 .news-layout{grid-template-columns:1fr}.feed{border-inline-start:0;border-top:1px solid var(--line);padding:var(--space-8) 0;margin:0}
 .news-card:last-child{display:block}.news-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.archive-shorts{grid-template-columns:repeat(3,minmax(0,1fr))}
 .editorial-note{align-items:start;flex-direction:column;gap:var(--space-5)}
 .brand-note{display:block}.footer-top{align-items:start;flex-direction:column}.feature-copy{inset-inline:var(--space-4);bottom:var(--space-4)}
}
@media(max-width:520px){
 .shell{width:calc(100% - 32px)}.wordmark{font-size:1.5rem}.brand-note{display:none}.header-tools{gap:0}.languages{gap:0;margin-inline-start:0}
 .nav{gap:0}.nav a{padding-inline:var(--space-2);font-size:var(--text-xs)}
 .hero{height:520px}.hero-picture img{object-position:62% center}.hero-content{inset-inline:var(--space-4);bottom:var(--space-20)}
 .hero h1{font-size:2rem;margin-block:var(--space-4)}.hero-desc{font-size:var(--text-sm)}.hero-actions{margin-top:var(--space-5)}
 .hero-bottom{inset-inline:var(--space-4)}.hero-dots button{width:25px}.demo-small{font-size:var(--text-xs)}
 .topics{gap:var(--space-5)}.section{padding-block:var(--space-8)}
 .section-head h2{font-size:1.5rem}.section-head .meta{display:none}.shorts-row{grid-auto-columns:64%;gap:var(--space-3)}
 .short-card{aspect-ratio:9/13}.short-copy h3{font-size:var(--text-lg)}
 .news-grid{grid-template-columns:1fr 1fr;gap:var(--space-5) var(--space-3)}.news-card:last-child{grid-column:1/-1}.news-card:last-child .news-image{aspect-ratio:2/1}
 .news-card h3{font-size:var(--text-base)}.feature-grid{grid-template-columns:1fr}.feature-band{padding-block:var(--space-8)}
 .archive-grid{gap:var(--space-6) var(--space-3)}.archive-shorts{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}
 .archive-shorts .short-copy h3{font-size:var(--text-base)}.footer-bottom{flex-direction:column}
 .article-cover{aspect-ratio:4/3}.article-wrap{padding-inline:var(--space-4)}.article-head h1{font-size:2rem}
 .article-body{font-size:var(--text-base)}.modal-body{padding:var(--space-4)}.section-controls .icon-btn{width:40px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
