:root{--bg-color:#0b0c10;--surface-color:#1f2833b3;--glass-border:#ffffff0d;--primary-color:#c5a880;--primary-hover:#e2cda6;--text-main:#e0e6ed;--text-muted:#8a96a3;--accent-color:#45a29e;--shadow-color:#00000080}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);direction:rtl;background-image:radial-gradient(circle at 15%,#45a29e0d,#0000 25%),radial-gradient(circle at 85% 30%,#c5a8800d,#0000 25%);background-attachment:fixed;font-family:Cairo,sans-serif;line-height:1.6;overflow-x:hidden}@media (width>=768px){::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--bg-color)}::-webkit-scrollbar-thumb{border:1px solid var(--glass-border);background:#1f2833;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--primary-color)}}.library-container{max-width:1400px;margin:0 auto;padding:2rem}.glass-panel{background:var(--surface-color);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);box-shadow:0 8px 32px 0 var(--shadow-color)}header{text-align:center;border-radius:20px;margin-bottom:3rem;padding:3rem 1rem;position:relative;overflow:hidden}header h1{color:var(--primary-color);text-shadow:0 0 20px #c5a8804d;letter-spacing:1px;margin-bottom:1rem;font-size:3.5rem;font-weight:800}header p{color:var(--text-muted);font-size:1.2rem}.search-container{justify-content:center;margin-top:2rem;display:flex}.search-input{border:1px solid var(--glass-border);width:100%;max-width:600px;color:var(--text-main);background:#0b0c1099;border-radius:50px;padding:1rem 1.5rem;font-family:inherit;font-size:1.1rem;transition:all .3s;box-shadow:inset 0 2px 5px #00000080}.search-input:focus{border-color:var(--primary-color);outline:none;box-shadow:0 0 15px #c5a88033,inset 0 2px 5px #00000080}.categories{flex-wrap:wrap;justify-content:center;gap:1rem;margin-bottom:3rem;display:flex}.category-btn{background:var(--surface-color);border:1px solid var(--glass-border);color:var(--text-main);cursor:pointer;border-radius:30px;align-items:center;gap:.5rem;padding:.8rem 1.5rem;font-family:inherit;font-size:1rem;font-weight:600;transition:all .3s;display:flex}.category-btn:hover{border-color:var(--primary-color);background:#c5a8801a;transform:translateY(-2px);box-shadow:0 5px 15px #c5a88026}.category-btn.active{background:var(--primary-color);color:#000;border-color:var(--primary-color);box-shadow:0 0 20px #c5a88066}.book-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:2.5rem;padding:1rem;display:grid}.book-card{cursor:pointer;text-align:center;border-radius:15px;flex-direction:column;align-items:center;padding:1rem;transition:all .4s cubic-bezier(.175,.885,.32,1.275);display:flex;position:relative;overflow:hidden}.book-card:before{content:"";opacity:0;background:linear-gradient(#ffffff08 0%,#fff0 100%);height:100%;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.book-card:hover{border-color:var(--primary-color);transform:translateY(-10px)scale(1.02);box-shadow:0 15px 30px #0009,0 0 15px #c5a88033}.book-card:hover:before{opacity:1}.book-cover{aspect-ratio:2/3;border-left:3px solid #fff3;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;width:100%;margin-bottom:1.5rem;padding:1.5rem;display:flex;position:relative;overflow:hidden;box-shadow:5px 5px 15px #0009,inset 2px 0 5px #ffffff1a}.embossed-text{text-shadow:-1px -1px 1px #ffffff1a,1px 1px 2px #000c,0 2px 4px #0009;letter-spacing:1px;z-index:2;text-align:center;font-family:Aref Ruqaa,serif;font-weight:700;line-height:1.4}.embossed-text.english-title{text-shadow:-1px -1px 1px #ffffff1a,1px 1px 2px #0009;font-family:Cinzel,serif;font-weight:600}.book-author{color:var(--text-muted);z-index:2;margin-top:1rem;font-size:.9rem;font-weight:600}.loading{text-align:center;color:var(--primary-color);padding:3rem;font-size:1.5rem;animation:1.5s infinite pulse}.pagination{justify-content:center;align-items:center;gap:1.5rem;margin-top:4rem;display:flex}.page-btn{background:var(--primary-color);color:#000;cursor:pointer;border:none;border-radius:30px;padding:.8rem 2rem;font-family:inherit;font-size:1rem;font-weight:700;transition:all .3s;box-shadow:0 4px 15px #c5a8804d}.page-btn:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-2px);box-shadow:0 6px 20px #c5a88080}.page-btn:disabled{background:var(--surface-color);color:var(--text-muted);cursor:not-allowed;box-shadow:none;border:1px solid var(--glass-border)}.page-info{color:var(--text-main);background:var(--surface-color);border:1px solid var(--glass-border);border-radius:20px;padding:.5rem 1.5rem;font-weight:600}.reader-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:1000;background:#0b0c10f2;flex-direction:column;display:flex;position:fixed;inset:0}.reader-header{background:var(--surface-color);border-bottom:1px solid var(--glass-border);justify-content:space-between;align-items:center;padding:1rem 2rem;display:flex}.reader-header h2{color:var(--primary-color);white-space:nowrap;text-overflow:ellipsis;max-width:60%;font-size:1.2rem;overflow:hidden}.close-btn{border:1px solid var(--glass-border);color:#fff;cursor:pointer;background:#ffffff1a;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.5rem;transition:all .3s;display:flex}.close-btn:hover{background:#ff4d4d;transform:rotate(90deg)}.flipbook-container{flex:1;justify-content:center;align-items:center;padding:2rem;display:flex}.page{position:relative;overflow:hidden;box-shadow:inset 0 0 30px #0000001a;color:#2c241b!important;background-color:#f4e9d8!important;padding:2.5rem 2.5rem 3.5rem!important}.page-back-copy{background:linear-gradient(135deg,#efe4cf 0%,#e0ceb0 50%,#cfb792 100%)!important;padding:0!important;box-shadow:inset 0 0 35px #3c230f38!important}.page-content{text-align:justify;font-size:1.05rem;line-height:1.7}.page-content .chapter-title{color:#2b1408;margin:0 0 5px;font-size:1.5rem;line-height:1.2}.page-content .paragraph{margin:0 0 8px}.page-number{text-align:center;color:#8c7b65;font-size:.9rem;font-weight:700;position:absolute;bottom:1.5rem;left:0;right:0}.reader-controls{background:var(--surface-color);border-top:1px solid var(--glass-border);justify-content:center;gap:2rem;padding:1rem 2rem;display:flex}@keyframes pulse{0%{opacity:.6}50%{opacity:1}to{opacity:.6}}@media (width<=768px){header h1{font-size:2.5rem}.book-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1.5rem}.page{padding:1.5rem!important}.page-content{font-size:1.1rem}.library-container{padding:1rem}.glass-header{justify-content:space-between;gap:10px;padding:.9rem 1rem}.header-title-container{flex:1;order:1;min-width:0}.nav-actions{flex-wrap:nowrap;flex-shrink:0;order:2;justify-content:flex-end;width:auto!important}.library-search-box{order:3;flex:100%!important;width:100%!important;margin:2px 0 0!important}.nav-btn{justify-content:center}}.swipe-indicator{color:var(--primary-color);z-index:50;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);white-space:nowrap;background:#0f0805d9;border:1px solid #c5a88073;border-radius:30px;align-items:center;padding:8px 18px;display:flex;position:absolute;bottom:26px;left:50%;transform:translate(-50%);box-shadow:0 4px 12px #0009}.swipe-chevron{animation:1.5s ease-in-out infinite swipeArrow}.swipe-chevron:first-child{animation-delay:0s}.swipe-chevron:nth-child(2){animation-delay:.2s}.swipe-chevron:nth-child(3){animation-delay:.4s}@keyframes swipeArrow{0%{opacity:.2;transform:translate(0)}50%{opacity:1;transform:translate(-5px)}to{opacity:.2;transform:translate(0)}}.reader-top-bar .back-btn,.glass-header .back-btn{border-radius:50%!important;width:42px!important;min-width:42px!important;height:42px!important;padding:0!important;position:relative!important;top:auto!important;left:auto!important;right:auto!important}@media (width<=768px){.book-3d-wrapper{filter:none!important;box-sizing:border-box!important;justify-content:center!important;align-items:center!important;width:100vw!important;height:100dvh!important;margin:0!important;padding:64px 12px 16px!important;display:flex!important;transform:none!important}.stf__wrapper.--portrait{border-radius:6px;box-shadow:0 18px 45px #000000d9}}@keyframes float{0%,to{transform:translate(0)scale(1)}33%{transform:translate(30px,-50px)scale(1.1)}66%{transform:translate(-20px,20px)scale(.9)}}@keyframes spin{to{transform:rotate(360deg)}}.modern-library-scene{min-height:100vh;position:relative;overflow:hidden}.glass-header{background:var(--surface-color);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-bottom:1px solid var(--glass-border);z-index:10;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:1.25rem 2rem;display:flex;position:sticky;top:0;box-shadow:0 5px 20px #00000080}.library-search-box{flex:0 320px;margin:0 12px}.nav-actions{flex-shrink:0;align-items:center;gap:.75rem;width:auto;display:flex}.nav-btn{color:var(--text-main);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:20px;align-items:center;gap:.5rem;padding:.6rem 1.2rem;transition:all .3s;display:flex}.nav-btn:hover,.nav-btn.active{border-color:var(--primary-color);color:var(--primary-color);background:#c5a88026}.books-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:2.5rem;max-width:1400px;margin:0 auto;padding:3rem 2rem;display:grid}.modern-book-card{cursor:pointer;perspective:1000px;border-radius:15px;transition:all .5s;position:relative}.modern-book-card:hover{transform:translateY(-10px)}.card-glass-bg{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);z-index:0;background:#1f283366;border-radius:15px;transition:all .3s;position:absolute;inset:0;box-shadow:0 8px 32px #0000004d}.modern-book-card:hover .card-glass-bg{border-color:#c5a88066;box-shadow:0 15px 40px #0009,0 0 15px #c5a8801a}.book-cover-3d{z-index:1;transform-style:preserve-3d;padding:1.5rem 1.5rem 0;transition:transform .5s;position:relative}.modern-book-card:hover .book-cover-3d{transform:rotateY(10deg)translateZ(10px)}.cover-image{aspect-ratio:2/3;border-left:3px solid #ffffff4d;border-radius:5px 15px 15px 5px;justify-content:center;align-items:center;width:100%;padding:1rem;display:flex;position:relative;box-shadow:-5px 5px 15px #00000080,inset 4px 0 10px #fff3}.cover-glare{pointer-events:none;background:linear-gradient(105deg,#fff0 30%,#fff3 40%,#fff0 50%);position:absolute;inset:0}.cover-title-preview{color:#ffffffe6;text-shadow:1px 1px 2px #000c,-1px -1px 1px #fff3,0 0 15px #00000080;text-align:center;font-family:Cairo,serif;font-size:1.2rem;font-weight:800;line-height:1.4}.card-info{z-index:1;text-align:right;padding:1.5rem;position:relative}.book-title{color:var(--primary-color);white-space:nowrap;text-overflow:ellipsis;margin-bottom:.5rem;font-size:1.1rem;overflow:hidden}.book-author{color:var(--text-muted);margin-bottom:1rem;font-size:.9rem}.book-meta{justify-content:space-between;align-items:center;display:flex}.genre-tag{color:var(--primary-color);white-space:nowrap;text-overflow:ellipsis;background:#c5a8801a;border:1px solid #c5a8804d;border-radius:12px;max-width:62%;padding:.28rem .75rem;font-size:.78rem;overflow:hidden}.read-btn{color:var(--text-main);cursor:pointer;background:0 0;border:none;align-items:center;gap:.4rem;font-family:inherit;font-weight:600;transition:color .3s;display:flex}.modern-book-card:hover .read-btn{color:var(--primary-color)}.categories-portal{min-height:100vh;padding:4rem 2rem;position:relative;overflow:hidden}.mesh-bg{z-index:-1;background:var(--bg-color);position:absolute;inset:0;overflow:hidden}.mesh-blob{filter:blur(100px);opacity:.5;border-radius:50%;animation:20s ease-in-out infinite float;position:absolute}.blob-1{background:#45a29e4d;width:50vw;height:50vw;top:-10%;left:-10%}.blob-2{background:#c5a88033;width:60vw;height:60vw;animation-delay:-5s;bottom:-20%;right:-10%}.blob-3{background:#1f2833cc;width:40vw;height:40vw;animation-delay:-10s;top:40%;left:50%}.portal-container{z-index:1;max-width:1200px;margin:0 auto;position:relative}.portal-header{text-align:center;margin-bottom:4rem}.header-logo{justify-content:center;align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.logo-icon{color:var(--primary-color);animation:20s linear infinite spin}.portal-subtitle{color:var(--text-muted);margin-bottom:2rem;font-size:1.2rem}.search-wrapper{max-width:600px;margin:0 auto;position:relative}.search-icon{color:var(--primary-color);position:absolute;top:50%;right:1.5rem;transform:translateY(-50%)}.glass-search-input{border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);width:100%;color:var(--text-main);background:#1f283399;border-radius:50px;padding:1.2rem 3rem 1.2rem 1.5rem;font-family:inherit;font-size:1.1rem;transition:all .3s;box-shadow:inset 0 2px 10px #00000080,0 5px 15px #0000004d}.glass-search-input:focus{border-color:var(--primary-color);background:#1f2833cc;outline:none;box-shadow:0 0 20px #c5a88033,inset 0 2px 10px #00000080}.categories-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:2rem;display:grid}.category-card{cursor:pointer;border:1px solid var(--glass-border);background:var(--surface-color);border-radius:20px;transition:all .4s cubic-bezier(.175,.885,.32,1.275);position:relative;overflow:hidden;box-shadow:0 10px 30px #00000080}.category-card:hover{border-color:var(--primary-color);transform:translateY(-10px)scale(1.02);box-shadow:0 15px 40px #000000b3,0 0 20px #c5a88033}.cat-glass-bg{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:0;position:absolute;inset:0}.cat-content{z-index:1;text-align:center;flex-direction:column;align-items:center;gap:1rem;padding:2.5rem 1.5rem;display:flex;position:relative}.cat-icon{filter:drop-shadow(0 2px 10px #c5a88080);font-size:3rem;transition:transform .3s}.category-card:hover .cat-icon{transform:scale(1.1)}.cat-name{color:var(--text-main);text-shadow:0 2px 5px #00000080;font-size:1.4rem;font-weight:700}.no-results{text-align:center;color:var(--text-muted);flex-direction:column;grid-column:1/-1;align-items:center;gap:1rem;padding:5rem;font-size:1.5rem;display:flex}.cinematic-scene{background-color:#050505;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.photorealistic-bg{z-index:1;filter:brightness()contrast(1.1);pointer-events:none;background-image:url(/cinematic_desk.png);background-position:50%;background-size:cover;transition:all .5s;position:absolute;inset:-5%}.lights-out .photorealistic-bg{filter:brightness(.2)contrast(1.2)saturate(.5)hue-rotate(180deg)}.rain-container{z-index:2;pointer-events:none;mix-blend-mode:screen;height:48%;position:absolute;top:0;left:30%;right:34%;overflow:hidden;-webkit-mask-image:linear-gradient(#000 40%,#0000 85%);mask-image:linear-gradient(#000 40%,#0000 85%)}.rain-drop{will-change:transform;background:linear-gradient(#fff0,#ffffff40);width:1px;height:60px;animation:linear infinite fall;position:absolute;top:-100px;transform:rotate(18deg)}@keyframes fall{to{transform:translateY(60vh)translate(-15vh)rotate(18deg)}}.lightning-flash{display:none}.back-btn{-webkit-backdrop-filter:blur(12px);color:#d4af37;cursor:pointer;background:linear-gradient(135deg,#191919e6,#0a0a0af2);border:1px solid #d4af374d;border-top-color:#d4af3799;border-radius:25px;justify-content:center;align-items:center;gap:8px;width:auto;min-width:45px;height:45px;padding:0 15px;transition:all .4s cubic-bezier(.175,.885,.32,1.275);display:flex;top:1.5rem;left:1.5rem;box-shadow:0 8px 25px #000c,inset 0 2px 5px #ffffff0d;z-index:99999!important;position:fixed!important;right:auto!important}.back-btn:hover{color:#050505;background:linear-gradient(135deg,#d4af37e6,#c5a880f2);border:1px solid #ffffff80;transform:translate(-5px)scale(1.05);box-shadow:0 10px 30px #d4af3766,inset 0 2px 5px #fff3}.lamp-click-zone{z-index:100;cursor:pointer;justify-content:center;align-items:center;width:100px;height:100px;display:flex;position:absolute;top:10%;left:10%}.lamp-hint-glow{background:#c5a88033;border-radius:50%;padding:1rem;animation:2s infinite pulse}.book-3d-wrapper{z-index:10;filter:drop-shadow(0 20px 50px #000000e6);position:relative;transform:scale(.9)}.cover-front,.cover-back{box-shadow:inset 0 0 50px #00000080}.cover-front-bg,.cover-back-bg{opacity:.4;z-index:0;background-position:50%;background-size:cover;position:absolute;inset:0}.cover-decoration{z-index:1;border:2px solid #fff3;position:absolute;inset:20px}.cover-decoration-inner{border:1px solid #ffffff1a;position:absolute;inset:10px}.cover-inner{background:#2b1408!important}.cover-title-preview{text-align:center;width:85%;color:var(--gold);text-shadow:2px 2px 4px #000c;opacity:.9;word-wrap:break-word;-webkit-line-clamp:4;-webkit-box-orient:vertical;font-family:Amiri,serif;font-size:1.1rem;font-weight:700;display:-webkit-box;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.book-title{word-wrap:break-word;-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;position:relative;overflow:hidden}.cover-inner-bg{opacity:.1;background-position:50%;background-size:cover;position:absolute;inset:0}.page-border{box-sizing:border-box;border:1px solid #0000000d;height:100%;padding:1rem;position:relative;overflow:hidden;container-type:size}.page-border p{margin-bottom:2.5cqw;font-size:4.4cqw;font-weight:600;line-height:6.5cqw}.author-textarea{resize:none;color:#2b1408;background:0 0;border:none;outline:none;flex:1;width:100%;font-family:Aref Ruqaa,serif;font-size:1.5rem;line-height:2}.translate-widget-container{z-index:9999;border:1px solid var(--primary-color);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#1f2833cc;border-radius:20px;padding:5px 10px;position:fixed;top:10px;right:10px;box-shadow:0 0 15px #00000080}.translate-widget-container select{color:var(--primary-color);cursor:pointer;background:0 0;border:none;outline:none;font-family:Amiri,serif;font-size:1rem}.translate-widget-container select option{color:var(--primary-color);background:#1f2833}.goog-logo-link{display:none!important}.goog-te-gadget{color:#0000!important;font-size:0!important}.goog-te-gadget .goog-te-combo{margin:0;padding:5px;color:var(--primary-color)!important;font-size:1rem!important}.authoring-paper-editable p,.authoring-paper-editable div{margin:0;padding:0}@keyframes elegantPulse{0%,to{opacity:.3;transform:translate(0)}50%{opacity:1;transform:translate(-10px)}}.professional-hint{-webkit-backdrop-filter:blur(8px);color:#fffc;pointer-events:none;z-index:50;background:#ffffff0d;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;transition:opacity .3s;animation:2.5s cubic-bezier(.4,0,.2,1) infinite elegantPulse;display:flex;position:absolute;top:20px;right:20px;box-shadow:0 8px 32px #00000026,inset 0 0 0 1px #ffffff0d}.professional-hint svg{filter:drop-shadow(0 2px 4px #00000080);margin-right:2px}@media (width<=768px){.glass-search-input{padding:.8rem 2.5rem .8rem 1rem!important;font-size:.9rem!important}}a.category-card,a.modern-book-card{color:inherit!important;text-decoration:none!important}@keyframes skeletonPulse{0%{opacity:.35;background-position:150% 0}50%{opacity:.7}to{opacity:.35;background-position:-150% 0}}.skeleton-card{pointer-events:none;flex-direction:column;min-height:380px;padding:1.5rem;display:flex}.skeleton-cover{aspect-ratio:2/3;background:linear-gradient(90deg,#ffffff08 25%,#d4b64b1f 50%,#ffffff08 75%) 0 0/200% 100%;border-radius:12px;width:100%;margin-bottom:1.2rem;animation:1.8s ease-in-out infinite skeletonPulse;box-shadow:0 4px 20px #0000004d}.skeleton-line{background:linear-gradient(90deg,#ffffff08 25%,#d4b64b1a 50%,#ffffff08 75%) 0 0/200% 100%;border-radius:6px;margin-bottom:.6rem;animation:1.8s ease-in-out infinite skeletonPulse}.skeleton-title{width:85%;height:20px}.skeleton-author{width:55%;height:14px}.skeleton-badge{width:35%;height:14px;margin-top:.5rem}.blog-page-container,.blog-post-page{color:#f8fafc;background:#0f172a;min-height:100vh;padding-bottom:60px;font-family:Cairo,Tajawal,sans-serif}.blog-hero-section{text-align:center;background:radial-gradient(circle at 50% 20%,#6366f126 0%,#0f172a 70%),linear-gradient(#1e1b4b 0%,#0f172a 100%);border-bottom:1px solid #ffffff14;padding:60px 20px 40px}.blog-hero-content{max-width:800px;margin:0 auto}.blog-badge{color:#a5b4fc;background:#6366f133;border:1px solid #6366f166;border-radius:20px;align-items:center;gap:6px;margin-bottom:16px;padding:6px 14px;font-size:.85rem;font-weight:600;display:inline-flex}.sparkle-icon{color:#fbbf24}.blog-hero-title{color:#fff;text-shadow:0 2px 10px #00000080;margin-bottom:12px;font-size:2.5rem;font-weight:800}.blog-hero-subtitle{color:#94a3b8;margin-bottom:28px;font-size:1.1rem;line-height:1.7}.blog-search-wrapper{max-width:600px;margin:0 auto;position:relative}.blog-search-icon{color:#64748b;pointer-events:none;position:absolute;top:50%;right:18px;transform:translateY(-50%)}.blog-search-input{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#1e293bd9;border:1px solid #334155;border-radius:12px;width:100%;padding:14px 48px 14px 40px;font-family:inherit;font-size:1rem;transition:all .2s}.blog-search-input:focus{background:#1e293b;border-color:#6366f1;outline:none;box-shadow:0 0 0 3px #6366f140}.blog-search-clear{color:#94a3b8;cursor:pointer;background:0 0;border:none;font-size:1rem;position:absolute;top:50%;left:14px;transform:translateY(-50%)}.blog-categories-bar{z-index:10;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0f172af2;border-bottom:1px solid #ffffff0f;padding:12px 20px;position:sticky;top:0}.blog-categories-inner{gap:10px;max-width:1100px;margin:0 auto;padding-bottom:4px;display:flex;overflow-x:auto}.blog-categories-inner::-webkit-scrollbar{height:4px}.blog-categories-inner::-webkit-scrollbar-thumb{background:#334155;border-radius:4px}.blog-cat-btn{color:#94a3b8;cursor:pointer;white-space:nowrap;background:#1e293bb3;border:1px solid #334155;border-radius:20px;align-items:center;padding:8px 16px;font-size:.9rem;font-weight:600;transition:all .2s;display:flex}.blog-cat-btn:hover{color:#fff;background:#1e293b;border-color:#475569}.blog-cat-btn.active{color:#fff;background:#6366f1;border-color:#6366f1;box-shadow:0 4px 12px #6366f159}.blog-main-content{max-width:1100px;margin:30px auto 0;padding:0 20px}.blog-featured-card{background:linear-gradient(135deg,#1e293be6 0%,#0f172af2 100%);border:1px solid #334155;border-radius:16px;margin-bottom:40px;padding:30px;position:relative;overflow:hidden;box-shadow:0 10px 30px #0000004d}.blog-featured-card:before{content:"";background:linear-gradient(#6366f1,#a855f7);width:4px;height:100%;position:absolute;top:0;left:0}.featured-badge{color:#fbbf24;background:#f59e0b33;border:1px solid #f59e0b66;border-radius:12px;margin-bottom:12px;padding:4px 12px;font-size:.8rem;font-weight:700;display:inline-block}.featured-cat{color:#818cf8;margin-bottom:6px;font-size:.9rem;font-weight:600;display:block}.featured-title{margin-bottom:14px;font-size:1.8rem;font-weight:800;line-height:1.4}.featured-title a{color:#fff;text-decoration:none;transition:color .2s}.featured-title a:hover{color:#a5b4fc}.featured-desc{color:#cbd5e1;margin-bottom:20px;font-size:1.05rem;line-height:1.7}.featured-meta{color:#94a3b8;flex-wrap:wrap;gap:20px;margin-bottom:22px;font-size:.88rem;display:flex}.featured-meta span{align-items:center;gap:6px;display:flex}.featured-btn{color:#fff;background:#6366f1;border-radius:8px;align-items:center;gap:8px;padding:10px 22px;font-weight:700;text-decoration:none;transition:all .2s;display:inline-flex}.featured-btn:hover{background:#4f46e5;transform:translate(-4px);box-shadow:0 4px 14px #6366f166}.blog-grid-header{border-bottom:1px solid #ffffff14;margin-bottom:24px;padding-bottom:12px}.section-title{color:#f1f5f9;align-items:center;gap:10px;font-size:1.35rem;font-weight:700;display:flex}.section-icon{color:#6366f1}.blog-cards-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px;display:grid}.blog-card{background:#1e293bb3;border:1px solid #334155;border-radius:14px;flex-direction:column;padding:24px;transition:all .25s;display:flex;box-shadow:0 4px 12px #00000026}.blog-card:hover{background:#1e293bf2;border-color:#6366f1;transform:translateY(-4px);box-shadow:0 8px 24px #6366f126}.blog-card-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.card-category{color:#818cf8;background:#6366f11f;border-radius:6px;padding:4px 10px;font-size:.82rem;font-weight:700}.card-read-time{color:#94a3b8;align-items:center;gap:4px;font-size:.8rem;display:flex}.blog-card-title{margin-bottom:12px;font-size:1.25rem;font-weight:700;line-height:1.5}.blog-card-title a{color:#fff;text-decoration:none;transition:color .2s}.blog-card-title a:hover{color:#a5b4fc}.blog-card-desc{color:#94a3b8;flex-grow:1;margin-bottom:16px;font-size:.95rem;line-height:1.6}.blog-card-tags{flex-wrap:wrap;gap:6px;margin-bottom:18px;display:flex}.card-tag{color:#64748b;background:#0f172a99;border-radius:4px;padding:2px 8px;font-size:.78rem}.blog-card-footer{border-top:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding-top:14px;font-size:.85rem;display:flex}.card-author-info{color:#64748b;align-items:center;gap:6px;display:flex}.read-more-link{color:#818cf8;align-items:center;gap:4px;font-weight:700;text-decoration:none;transition:all .2s;display:flex}.read-more-link:hover{color:#fff;transform:translate(-3px)}.reading-progress-bar{z-index:9999;background:linear-gradient(90deg,#6366f1,#ec4899);height:4px;transition:width .1s ease-out;position:fixed;top:0;left:0}.blog-breadcrumb-wrapper{background:#0f172ae6;border-bottom:1px solid #ffffff0f;padding:14px 20px}.blog-breadcrumbs{color:#64748b;align-items:center;gap:8px;max-width:860px;margin:0 auto;font-size:.88rem;display:flex}.blog-breadcrumbs a{color:#94a3b8;text-decoration:none;transition:color .2s}.blog-breadcrumbs a:hover{color:#818cf8}.current-crumb{color:#cbd5e1;font-weight:600}.blog-post-container{max-width:860px;margin:40px auto 0;padding:0 20px}.article-header{text-align:right;margin-bottom:35px}.article-category-badge{color:#a5b4fc;background:#6366f12e;border:1px solid #6366f159;border-radius:12px;margin-bottom:16px;padding:4px 14px;font-size:.88rem;font-weight:700;display:inline-block}.article-main-title{color:#fff;margin-bottom:20px;font-size:2.3rem;font-weight:800;line-height:1.4}.article-meta-row{color:#94a3b8;border-bottom:1px solid #ffffff14;flex-wrap:wrap;gap:20px;margin-bottom:24px;padding-bottom:20px;font-size:.92rem;display:flex}.meta-item{align-items:center;gap:6px;display:flex}.article-intro-summary{color:#cbd5e1;background:#1e293b99;border-right:4px solid #6366f1;border-radius:0 8px 8px 0;margin-bottom:30px;padding:16px 20px;font-size:1.15rem;line-height:1.8}.article-body-content{color:#e2e8f0;font-size:1.18rem;line-height:2.1}.article-body-content p{text-align:justify;margin-bottom:24px}.article-h2{color:#fff;border-bottom:1px solid #6366f140;align-items:center;margin:40px 0 18px;padding-bottom:10px;font-size:1.7rem;font-weight:800;display:flex}.article-h3{color:#a5b4fc;margin:28px 0 14px;font-size:1.35rem;font-weight:700}.article-blockquote{color:#e0e7ff;background:#6366f114;border-right:4px solid #818cf8;border-radius:0 10px 10px 0;margin:28px 0;padding:20px 24px;font-size:1.2rem;font-style:italic;line-height:1.9}.article-bullet-item{margin-bottom:12px;padding-right:12px;list-style:none;position:relative}.article-bullet-item:before{content:"✦";color:#6366f1;font-size:.9rem;position:absolute;right:-10px}.article-divider{background:linear-gradient(90deg,#0000,#ffffff26,#0000);border:0;height:1px;margin:36px 0}.adsense-blog-slot,.adsense-article-slot{text-align:center;background:#0f172a66;border:1px dashed #ffffff14;border-radius:8px;min-height:90px;margin:30px auto;padding:10px}.article-tags-section{border-top:1px solid #ffffff14;flex-wrap:wrap;align-items:center;gap:12px;margin:35px 0 25px;padding-top:20px;display:flex}.tags-label{color:#94a3b8;align-items:center;gap:6px;font-size:.95rem;font-weight:600;display:flex}.tags-list{flex-wrap:wrap;gap:8px;display:flex}.post-tag{color:#818cf8;background:#1e293b;border:1px solid #334155;border-radius:6px;padding:4px 12px;font-size:.85rem;font-weight:600}.article-share-bar{background:#1e293b;border:1px solid #334155;border-radius:12px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:15px;margin:30px 0;padding:18px 24px;display:flex}.share-title{color:#f1f5f9;align-items:center;gap:8px;font-weight:700;display:flex}.share-buttons{flex-wrap:wrap;gap:10px;display:flex}.share-btn{cursor:pointer;border:none;border-radius:8px;align-items:center;gap:6px;padding:8px 16px;font-size:.88rem;font-weight:700;text-decoration:none;transition:opacity .2s;display:inline-flex}.share-btn.whatsapp{color:#fff;background:#25d366}.share-btn.twitter{color:#fff;background:#000;border:1px solid #333}.share-btn.facebook{color:#fff;background:#1877f2}.share-btn.copy{color:#fff;background:#475569}.share-btn:hover{opacity:.9}.author-bio-card{background:#1e293bb3;border:1px solid #334155;border-radius:12px;align-items:center;gap:20px;margin:35px 0;padding:24px;display:flex}.author-avatar-circle{color:#fff;background:#6366f1;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:64px;height:64px;display:flex}.author-name{color:#fff;margin-bottom:6px;font-size:1.15rem;font-weight:700}.author-desc{color:#94a3b8;font-size:.92rem;line-height:1.6}.related-articles-section{margin:45px 0 30px}.related-title{color:#fff;border-bottom:1px solid #ffffff14;margin-bottom:20px;padding-bottom:10px;font-size:1.35rem;font-weight:700}.related-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;display:grid}.related-card{background:#1e293b;border:1px solid #334155;border-radius:10px;flex-direction:column;padding:18px;display:flex}.related-cat{color:#818cf8;margin-bottom:6px;font-size:.78rem;font-weight:700}.related-card-title{margin-bottom:8px;font-size:1.05rem;font-weight:700;line-height:1.4}.related-card-title a{color:#fff;text-decoration:none}.related-card-desc{color:#94a3b8;flex-grow:1;margin-bottom:14px;font-size:.85rem;line-height:1.5}.related-read-link{color:#818cf8;align-items:center;gap:4px;font-size:.85rem;font-weight:700;text-decoration:none;display:inline-flex}.back-to-blog-footer{text-align:center;margin-top:40px}.back-btn{color:#fff;background:#334155;border-radius:8px;align-items:center;gap:8px;padding:12px 28px;font-weight:700;text-decoration:none;transition:all .2s;display:inline-flex}.back-btn:hover{background:#475569;transform:translate(-4px)}@media (width<=768px){.blog-hero-title{font-size:1.9rem}.article-main-title{font-size:1.7rem}.article-body-content{font-size:1.08rem;line-height:1.95}.article-share-bar{flex-direction:column;align-items:stretch}.share-buttons{justify-content:stretch}.share-btn{flex:1;justify-content:center}.author-bio-card{text-align:center;flex-direction:column}}.legal-page{max-width:900px;min-height:60vh;margin:0 auto;padding:4rem 2rem}.legal-container{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1a1a2ecc;border:1px solid #ffffff1a;border-radius:12px;padding:3rem;box-shadow:0 8px 32px #0000004d}.legal-container h1{text-align:center;color:#c9a56c;border-bottom:1px solid #c9a56c4d;margin-bottom:2rem;padding-bottom:1rem;font-family:Amiri,serif;font-size:2.5rem}.legal-content{color:#e2e8f0;font-size:1.1rem;line-height:1.8}.legal-content h2{color:#c9a56c;align-items:center;margin-top:2.2rem;margin-bottom:1rem;font-family:Amiri,serif;font-size:1.8rem;display:flex}.legal-content h3{color:#fff;margin-top:2rem;margin-bottom:1rem;font-family:Amiri,serif;font-size:1.5rem}.legal-content p{margin-bottom:1.2rem}.legal-content ul{margin-bottom:1.5rem;margin-right:2rem;list-style-type:disc}.legal-content li{margin-bottom:.5rem}.text-center{text-align:center}.contact-info{background:#0003;border-radius:8px;margin-top:2.5rem;padding:1.5rem}.contact-info h3{color:#c9a56c;margin-top:0}.email-link{color:#c9a56c;background:#c9a56c1a;border:1px solid #c9a56c80;border-radius:4px;padding:.5rem 1rem;font-size:1.4rem;font-weight:700;text-decoration:none;transition:all .3s;display:inline-block}.email-link:hover{color:#fff;background:#c9a56c33;transform:translateY(-2px)}@media (width<=768px){.legal-container{padding:1.5rem}.legal-container h1{font-size:2rem}.legal-content{font-size:1rem}}.site-footer{color:#fff;direction:rtl;background:linear-gradient(135deg,#0f172a,#1e3a8a);border-top:3px solid #fcd34d;margin-top:4rem;padding:3rem 2rem 1rem;box-shadow:0 -10px 25px #0000001a}.footer-content{flex-wrap:wrap;justify-content:space-between;gap:2rem;max-width:1200px;margin:0 auto;display:flex}.footer-brand{flex:1;min-width:250px}.footer-brand h3{color:#fcd34d;margin:1rem 0 .5rem;font-family:Amiri,serif;font-size:2rem}.footer-brand p{color:#cbd5e1;font-size:1rem}.footer-links,.footer-legal{flex:1;min-width:200px}.footer-links h4,.footer-legal h4{color:#fcd34d;border-bottom:2px solid #fcd34d4d;margin-bottom:1rem;padding-bottom:.5rem;font-size:1.2rem;display:inline-block}.footer-links ul,.footer-legal ul{margin:0;padding:0;list-style:none}.footer-links li,.footer-legal li{margin-bottom:.8rem}.footer-links a,.footer-legal a{color:#cbd5e1;text-decoration:none;transition:color .3s,padding-right .3s}.footer-links a:hover,.footer-legal a:hover{color:#fcd34d;padding-right:5px}.footer-bottom{text-align:center;color:#94a3b8;border-top:1px solid #ffffff1a;margin-top:3rem;padding-top:1.5rem;font-size:.9rem}@media (width<=768px){.footer-content{text-align:center;flex-direction:column}.footer-links h4,.footer-legal h4{margin:0 auto 1rem}}.counter{color:var(--accent);background:var(--accent-bg);border:2px solid #0000;border-radius:5px;margin-bottom:24px;padding:5px 10px;font-size:16px;transition:border-color .3s}.counter:hover{border-color:var(--accent-border)}.counter:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hero{position:relative}.hero .base,.hero .framework,.hero .vite{margin:0 auto;inset-inline:0}.hero .base{z-index:0;width:170px;position:relative}.hero .framework,.hero .vite{position:absolute}.hero .framework{z-index:1;height:28px;top:34px;transform:perspective(2000px)rotate(300deg)rotateX(44deg)rotateY(39deg)scale(1.4)}.hero .vite{z-index:0;width:auto;height:26px;top:107px;transform:perspective(2000px)rotate(300deg)rotateX(40deg)rotateY(39deg)scale(.8)}#center{flex-direction:column;flex-grow:1;place-content:center;place-items:center;gap:25px;display:flex}@media (width<=1024px){#center{gap:18px;padding:32px 20px 24px}}#next-steps{border-top:1px solid var(--border);text-align:left;display:flex}#next-steps>div{flex:1 1 0;padding:32px}@media (width<=1024px){#next-steps>div{padding:24px 20px}}#next-steps .icon{width:22px;height:22px;margin-bottom:16px}@media (width<=1024px){#next-steps{text-align:center;flex-direction:column}}#docs{border-right:1px solid var(--border)}@media (width<=1024px){#docs{border-right:none;border-bottom:1px solid var(--border)}}#next-steps ul{gap:8px;margin:32px 0 0;padding:0;list-style:none;display:flex}#next-steps ul .logo{height:18px}#next-steps ul a{color:var(--text-h);background:var(--social-bg);border-radius:6px;align-items:center;gap:8px;padding:6px 12px;font-size:16px;text-decoration:none;transition:box-shadow .3s;display:flex}#next-steps ul a:hover{box-shadow:var(--shadow)}#next-steps ul a .button-icon{width:18px;height:18px}@media (width<=1024px){#next-steps ul{flex-wrap:wrap;justify-content:center;margin-top:20px}#next-steps ul li{flex:calc(50% - 8px)}#next-steps ul a{box-sizing:border-box;justify-content:center;width:100%}}#spacer{border-top:1px solid var(--border);height:88px}@media (width<=1024px){#spacer{height:48px}}.ticks{width:100%;position:relative}.ticks:before,.ticks:after{content:"";border:5px solid #0000;position:absolute;top:-4.5px}.ticks:before{border-left-color:var(--border);left:0}.ticks:after{border-right-color:var(--border);right:0}