:root{font-family:Inter,Arial,sans-serif;color:#19233b;background:#f5f7fb}*{box-sizing:border-box}body{margin:0}header{background:#fff;border-bottom:1px solid #e8eaf0}.nav{max-width:1080px;margin:auto;min-height:74px;display:flex;justify-content:space-between;align-items:center;padding:0 22px}.brand{font-size:23px;font-weight:850;letter-spacing:-.7px}.brand span{color:#6959ec}.nav small{color:#6e7690}main{max-width:1080px;margin:auto;padding:25px 20px 75px}.hero{background:linear-gradient(135deg,#111d42,#452f9a 63%,#be387e);color:white;border-radius:27px;padding:52px 24px 56px;text-align:center;box-shadow:0 18px 45px #342f811c}.hero h1{font-size:clamp(30px,5vw,46px);margin:0 0 12px;letter-spacing:-1px}.hero p{color:#dfdafc;margin:0 auto 26px;line-height:1.6}.tabs{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin:0 0 22px}.tab{border:1px solid #ffffff50;background:#ffffff15;color:white;border-radius:99px;padding:10px 19px;cursor:pointer;font-weight:700}.tab.active{background:white;color:#31247c}.entry{display:flex;gap:10px;background:white;border-radius:15px;padding:8px;max-width:790px;margin:0 auto;box-shadow:0 10px 25px #090b2226}.entry input{flex:1;min-width:80px;border:0;outline:0;font-size:16px;padding:14px;color:#26304b}.btn{border:0;border-radius:10px;padding:14px 24px;background:#7154f3;color:white;font-weight:800;cursor:pointer;font-size:15px}.btn:hover{filter:brightness(1.1)}.btn:disabled{opacity:.55;cursor:wait}.hint{font-size:12px!important;margin-top:14px!important}.status{max-width:790px;margin:17px auto 0;padding:14px 18px;border-radius:12px;text-align:left;display:none}.status.show{display:block}.status.error{background:#fff1f3;color:#a31e37}.status.ok{background:#e8fff1;color:#185c3a}.results{background:white;max-width:790px;margin:14px auto 0;border-radius:15px;padding:16px;text-align:left;color:#172444;display:none}.results.show{display:block}.result-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.result-head h3{margin:0 0 7px}.result-head p{margin:0 0 12px;color:#65708a}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}.card{background:#fff;padding:24px;border:1px solid #ebedf3;border-radius:18px;box-shadow:0 6px 30px #171b3310}.card h3{margin:8px 0;font-size:19px}.card p{line-height:1.65;color:#667188;margin:0}.emoji{font-size:26px}.section-title{text-align:center;margin:46px 0 18px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.step{background:white;text-align:center;padding:24px 14px;border-radius:16px;border:1px solid #e7e9f0}.step b{display:inline-flex;border-radius:50%;background:#eceaff;color:#5e48c9;width:35px;height:35px;align-items:center;justify-content:center}.step p{color:#667188}.test{text-align:center;margin-top:38px}.test a{color:#594ad5}footer{text-align:center;color:#7c8499;padding:26px} @media(max-width:690px){.features,.steps{grid-template-columns:1fr}.hero{padding:38px 17px}.entry{flex-direction:column}.entry input{width:100%}.nav small{display:none}.btn{width:100%}.result-head{flex-direction:column;align-items:stretch}}
/* v1.2 gallery */
.results{max-width:none;margin:25px 0 0;padding:24px;border:1px solid #e7eaf4;box-shadow:0 12px 35px #0b17420a}.results .result-head h2{margin:0 0 9px}.results .result-head p{margin:0;color:#68748c}.results .result-head{margin-bottom:22px}.all-btn{text-decoration:none;display:inline-block;white-space:nowrap;background:#2168e8}.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.media-card{border-radius:14px;overflow:hidden;background:#f7f9fe;display:flex;flex-direction:column;border:1px solid #e2e8f3}.media-card img{width:100%;height:260px;object-fit:cover;display:block;background:#d9e1ef}.media-meta{color:#66728d;text-align:center;padding:13px 9px;font-size:13px}.download-single{margin:0 12px 12px;text-align:center;display:block;text-decoration:none;background:#2874ee}.video-placeholder{height:260px;background:linear-gradient(145deg,#111a38,#403a91);display:flex;align-items:center;justify-content:center;color:white;font-size:30px}.features{grid-template-columns:repeat(4,minmax(0,1fr))}@media(max-width:760px){.gallery,.features{grid-template-columns:repeat(2,minmax(0,1fr))}.media-card img,.video-placeholder{height:210px}.all-btn{white-space:normal}}@media(max-width:520px){.gallery,.features{grid-template-columns:1fr}.media-card img,.video-placeholder{height:310px}.results{padding:14px}}

/* v1.5 shared media-mode selector */
.mode-panel{border:1px solid #ffffff55;border-radius:17px;padding:17px 15px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:790px;margin:0 auto 16px;text-align:left}.mode-panel legend{font-weight:800;text-align:center;padding:0 8px}.mode-choice{display:flex;align-items:flex-start;gap:9px;padding:12px 10px;border-radius:12px;background:#ffffff12;cursor:pointer;border:1px solid #ffffff35}.mode-choice:has(input:checked){background:#ffffff30;border-color:#ffffffdf}.mode-choice input{accent-color:#fff;margin:3px 0 0;flex-shrink:0}.mode-choice span{display:flex;flex-direction:column;gap:6px}.mode-choice strong{font-size:13px;line-height:1.4}.mode-choice small{font-size:11px;color:#e3dffa;line-height:1.5}@media(max-width:690px){.mode-panel{grid-template-columns:1fr}.mode-choice{padding:10px}}

/* v1.6 language dropdown and Arabic RTL */
.nav-right{display:flex;align-items:center;gap:18px}
.lang-wrap{display:inline-flex;align-items:center;gap:6px;border:1px solid #e4e6f2;border-radius:12px;padding:6px 9px;background:white;color:#24304b}
.lang-wrap select{font-size:13px;font-weight:650;background:transparent;color:#202942;outline:none;border:0;max-width:168px;cursor:pointer}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
[dir="rtl"] body{text-align:right}
[dir="rtl"] .nav,[dir="rtl"] .result-head{direction:rtl}
[dir="rtl"] .entry{direction:ltr}
[dir="rtl"] .entry input{text-align:left}
[dir="rtl"] .mode-panel,[dir="rtl"] .mode-choice,[dir="rtl"] .card,[dir="rtl"] .status,[dir="rtl"] .results{direction:rtl;text-align:right}
[dir="rtl"] .mode-choice input{margin-inline-end:4px}
[dir="rtl"] .media-meta,[dir="rtl"] .download-single{text-align:center}
@media(max-width:690px){.nav-right{gap:6px}.lang-wrap select{max-width:135px}.nav{padding:0 13px}}