/* ===== مؤثرات | Effects (يُحمَّل أخيراً) ===== */
#fx-canvas{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.9}
.fx-off #fx-canvas{display:none}
.fx-off .b,.fx-off .wv,.fx-off .l-swirl,.fx-off .l-particles{animation:none!important}
.confetti{position:fixed;inset:0;z-index:300;pointer-events:none}
.ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.4);transform:scale(0);animation:ripple .65s ease-out forwards;pointer-events:none}
@keyframes ripple{to{transform:scale(1);opacity:0}}

/* إضاءة تتبع المؤشر */
.tile,.quick a,.l-card,.tm-card,.theme-card,.hello{--mx:50%;--my:-50%;background-image:radial-gradient(circle 170px at var(--mx) var(--my),rgba(var(--fxrgb),.16),transparent 70%)}
.tile,.quick a,.tm-card,.theme-card{animation-fill-mode:backwards;transition:transform .25s var(--ease),box-shadow .3s}
.l-card:hover{background-image:none}

/* حدود متدرّجة دوّارة */
@property --ang{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes spinAng{to{--ang:360deg}}
.hello,.tm-card.founder,.savebar.dirty-on,.theme-card.on{border:2px solid transparent!important;
  background:linear-gradient(var(--glass),var(--glass)) padding-box,conic-gradient(from var(--ang),transparent 0 55%,var(--accent),var(--n3),transparent 90%) border-box!important;animation:rise .5s var(--ease) both,spinAng 4.5s linear infinite}
.hello,.tm-card.founder{background:linear-gradient(var(--card),var(--card)) padding-box,conic-gradient(from var(--ang),transparent 0 55%,var(--accent),var(--n3),transparent 90%) border-box!important}

/* عناوين الأقسام */
.ph h1,.hello h1{animation:blurIn .9s var(--ease) both .15s}
@keyframes blurIn{from{filter:blur(14px);opacity:0;letter-spacing:.12em}to{filter:none;opacity:1}}
.ph .pi svg.i{animation:iconPulse 3.2s ease-in-out infinite}
@keyframes iconPulse{50%{transform:scale(1.12) rotate(-6deg)}}

/* شاشة الافتتاح */
#splash{position:fixed;inset:0;z-index:500;display:grid;place-items:center;background:radial-gradient(circle at 50% 40%,var(--g2),var(--g0));color:#fff;transition:opacity .8s,transform .9s var(--ease)}
#splash.out{opacity:0;transform:scale(1.08);pointer-events:none}
.sp-in{display:flex;flex-direction:column;align-items:center;gap:14px}
.sp-in svg{width:120px;height:110px;animation:spEmblem 1.3s var(--ease) both}
@keyframes spEmblem{from{transform:scale(.3) rotate(-30deg);opacity:0;filter:blur(10px)}}
.sp-in b{font-family:'Lalezar','Readex Pro',sans-serif;font-weight:400;font-size:54px;letter-spacing:2px;animation:spText 1.1s var(--ease) .3s both}
@keyframes spText{from{transform:translateY(24px);opacity:0;filter:blur(8px)}}
.sp-bar{width:180px;height:3px;border-radius:3px;background:rgba(255,255,255,.18);overflow:hidden}
.sp-bar i{display:block;height:100%;background:#fff;transform-origin:left;animation:spBar 1.4s var(--ease) both}
@keyframes spBar{from{transform:scaleX(0)}}
body.splashing{overflow:hidden}

/* قائمة الثيمات (popover) */
.theme-pop{position:fixed;z-index:400;min-width:230px;padding:12px;border-radius:18px;background:var(--card);border:1px solid var(--bd);box-shadow:0 20px 60px rgba(0,0,0,.35);animation:popIn .3s var(--ease) both}
@keyframes popIn{from{opacity:0;transform:translateY(8px) scale(.94)}}
.theme-pop h4{margin:2px 6px 10px;font-size:13px;color:var(--muted)}
.theme-pop button{display:flex;align-items:center;gap:12px;width:100%;padding:8px 10px;border:0;border-radius:12px;background:transparent;color:var(--tx);font:inherit;cursor:pointer;transition:background .2s,transform .2s}
.theme-pop button:hover{background:var(--soft2);transform:translateX(calc(3px * var(--dir)))}
.theme-pop button.on{background:var(--soft2);font-weight:700}
.sw-dots{display:inline-flex}
.sw-dots i{width:18px;height:18px;border-radius:50%;border:2px solid var(--card);margin-inline-end:-6px;box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.theme-btn{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--bd2);background:var(--glass);color:var(--tx);cursor:pointer;backdrop-filter:blur(8px);transition:transform .35s var(--ease),background .2s,color .2s}
.theme-btn:hover{background:var(--n);color:#fff;transform:rotate(25deg) scale(1.1)}
aside .theme-btn{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);color:#fff;width:auto;border-radius:30px;padding:0 14px;flex:none}
aside .theme-btn:hover{background:#fff;color:#0b1d3f}

/* صفحة الثيمات */
.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin-bottom:22px}
.theme-card{position:relative;padding:12px;border-radius:22px;background-color:var(--card);border:2px solid var(--bd);cursor:pointer;text-align:start;color:var(--tx);font:inherit;animation:rise .5s var(--ease) both;animation-delay:calc(var(--i,0) * 60ms)}
.theme-card:hover{transform:translateY(-6px) rotate(-.6deg);box-shadow:0 20px 44px rgba(0,0,0,.22)}
.theme-card.on{box-shadow:0 14px 40px rgba(var(--fxrgb),.35)}
.tc-prev{display:flex;gap:6px;height:112px;padding:8px;border-radius:14px;overflow:hidden;background:radial-gradient(ellipse at 50% 30%,var(--bg-a),var(--bg-b));margin-bottom:12px;pointer-events:none}
.tc-prev .s{width:26%;border-radius:9px;background:linear-gradient(160deg,var(--g1),var(--g2),var(--g3))}
.tc-prev .m{flex:1;display:flex;flex-direction:column;gap:6px}
.tc-prev .h{height:26px;border-radius:9px;background:linear-gradient(160deg,var(--g1),var(--g3))}
.tc-prev .c{flex:1;border-radius:9px;background:var(--card);border-top:3px solid var(--n);display:flex;gap:5px;padding:6px}
.tc-prev .c i{flex:1;border-radius:6px;background:var(--soft2)}.tc-prev .c i:first-child{background:var(--accent)}
.tc-name{display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:700}
.tc-name .ok{display:none;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--n3);color:#fff}
.theme-card.on .ok{display:grid;animation:pop .45s var(--ease)}
.fx-row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.fx-row p{margin:4px 0 0;color:var(--muted);font-size:13.5px}

/* فريق */
@media(prefers-reduced-motion:reduce){#splash{display:none}}