/* ============================================
   وادي التراجمة - ملف التصميم الرئيسي
   ============================================ */

@import url("https://fonts.googleapis.com/css2?family=Changa:wght@500;600;700;800&family=IBM+Plex+Sans+Arabic:wght@300;400;500;600;700&display=swap");

/* ===== المتغيرات ===== */
:root{
  --bg:#FFFFFF;--bg-soft:#F4F7F4;--srf:#FFFFFF;--srf-2:#F1F4F1;--srf-3:#E4EBE5;
  --txt:#101815;--muted:#57665E;--dim:#8A978F;
  --line:rgba(16,24,21,.14);--line2:rgba(16,24,21,.07);
  --gold:#F2B84B;--gold2:#FFD98A;--gold-ink:#9A6E00;--goldD:#B57E1F;
  --blue:#2E5BFF;--blue-ink:#1D4ED8;--blue2:#7C9BFF;
  --green:#1F8A4C;--red:#C2410C;--amber:#B45309;--ink-fixed:#0B0F0D;
  --topbar:rgba(255,255,255,.88);--dockbg:rgba(255,255,255,.92);--drawer:#FFFFFF;
  --shadow:0 16px 44px rgba(16,24,21,.10);--shadow2:0 24px 60px rgba(16,24,21,.16);
  --df:"Changa",sans-serif;--bf:"IBM Plex Sans Arabic",sans-serif;
  --nav:70px;--dockh:70px;--r:20px;
  --kit:linear-gradient(90deg,var(--gold) 0 33%,var(--blue) 33% 66%,var(--gold) 66% 100%);
  color-scheme:light;
}

html[data-theme="dark"]{
  --bg:#050D0A;--bg-soft:#071510;--srf:#0A1A14;--srf-2:#0F241B;--srf-3:#123024;
  --txt:#F4F1E8;--muted:#93A69B;--dim:#6B8078;
  --line:rgba(242,184,75,.16);--line2:rgba(244,241,232,.08);
  --gold-ink:#FFD98A;--blue-ink:#7C9BFF;--green:#35E08D;--red:#FF5C5C;--amber:#FFB020;
  --topbar:rgba(5,13,10,.85);--dockbg:rgba(5,13,10,.94);--drawer:#0A1A14;
  --shadow:0 24px 60px rgba(0,0,0,.45);--shadow2:0 30px 80px rgba(0,0,0,.55);
  color-scheme:dark;
}

/* ===== إعادة الضبط ===== */
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{width:100%;overflow-x:hidden;overflow-x:clip;scroll-behavior:smooth}
body{width:100%;max-width:100vw;overflow-x:hidden;overflow-x:clip;background:var(--bg);color:var(--txt);font-family:var(--bf);line-height:1.8;min-height:100vh}
body.pub{padding-top:var(--nav);padding-bottom:calc(var(--dockh) + env(safe-area-inset-bottom))}
body.lock{overflow:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:none}
h1,h2,h3,h4,.df{font-family:var(--df)}
::selection{background:var(--gold);color:var(--ink-fixed)}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:var(--bg-soft)}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--gold),var(--goldD));border:3px solid var(--bg-soft);border-radius:20px}
*{scrollbar-color:var(--gold) var(--bg-soft);scrollbar-width:thin}
p,li{text-wrap:pretty}
h1,h2,h3{text-wrap:balance}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:6px}

/* ===== التخطيط العام ===== */
.wrap{width:100%;max-width:1220px;margin-inline:auto;padding-inline:clamp(16px,4vw,28px)}
main{min-height:calc(100svh - var(--nav))}
body,.topbar,.card,.sec.alt,.drawer,.dock,.phero,.searchbar,.fab-theme{transition:background-color .3s,color .3s,border-color .3s}
.view{animation:viewIn .5s cubic-bezier(.2,.8,.2,1)}
@keyframes viewIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ===== الخلفية ===== */
.bg{position:fixed;inset:0;z-index:-2;background:
  radial-gradient(760px 520px at 90% -8%,rgba(242,184,75,.14),transparent 62%),
  radial-gradient(680px 480px at 5% 18%,rgba(46,91,255,.10),transparent 60%),
  radial-gradient(600px 440px at 80% 96%,rgba(31,138,76,.08),transparent 62%),var(--bg);animation:bgShift 18s ease-in-out infinite alternate}
html[data-theme="dark"] .bg{background:
  radial-gradient(760px 520px at 90% -8%,rgba(242,184,75,.16),transparent 62%),
  radial-gradient(680px 480px at 5% 18%,rgba(46,91,255,.15),transparent 60%),
  radial-gradient(600px 440px at 80% 96%,rgba(53,224,141,.08),transparent 62%),var(--bg)}
@keyframes bgShift{to{filter:hue-rotate(9deg) brightness(1.04)}}
.grain{position:fixed;inset:0;z-index:95;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ===== الهيدر ===== */
.topbar{position:fixed;top:0;left:0;right:0;z-index:80;background:var(--topbar);backdrop-filter:blur(18px) saturate(1.3);border-bottom:1px solid var(--line2)}
.topbar::after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--kit);opacity:.9}
.topbar-in{width:100%;max-width:1300px;margin:auto;min-height:var(--nav);display:flex;align-items:center;gap:12px;padding-inline:clamp(12px,3vw,24px)}
.burger{width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:var(--srf);display:grid;place-items:center;gap:5px;padding:11px;flex-shrink:0}
.burger:hover{border-color:var(--gold)}
.burger i{display:block;width:20px;height:2px;background:var(--txt);border-radius:2px;transition:.3s}
.burger.on i:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.on i:nth-child(2){opacity:0}
.burger.on i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.lock{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
.lock svg{flex-shrink:0}
.lock-t b{display:block;font-family:var(--df);font-weight:800;font-size:clamp(.98rem,3.5vw,1.18rem);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lock-t small{display:flex;align-items:center;gap:6px;color:var(--gold-ink);font-size:.68rem;font-weight:700}
.lock-t small::before{content:"";width:14px;height:2px;background:var(--blue-ink);border-radius:2px}
.qnav{display:none;align-items:center;gap:2px}
.qnav a{position:relative;padding:9px 11px;border-radius:10px;font-size:.85rem;font-weight:600;color:var(--muted);transition:.22s}
.qnav a:hover{color:var(--txt);background:var(--line2)}
.qnav a.on{color:var(--gold-ink)}
.qnav a.on::after{content:"";position:absolute;bottom:4px;left:11px;right:11px;height:2px;background:var(--kit);border-radius:2px}
.qnav a.go{background:linear-gradient(135deg,var(--gold),var(--goldD));color:var(--ink-fixed);font-weight:700;padding-inline:15px;margin-inline-start:6px}
@media(min-width:1024px){.qnav{display:flex}}

/* ===== زر الوضع العائم ===== */
.fab-theme{position:fixed;left:16px;bottom:24px;z-index:130;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,var(--gold),var(--goldD));color:#08130d;box-shadow:0 12px 30px rgba(242,184,75,.42),0 0 0 4px rgba(242,184,75,.16);transition:.3s;border:none}
.fab-theme:hover{transform:translateY(-3px) scale(1.06)}
.fab-theme:active{transform:scale(.94)}
.fab-theme .moon{display:none}
html[data-theme="dark"] .fab-theme{background:linear-gradient(145deg,#1d3a5f,#0f241b);color:var(--gold2);box-shadow:0 12px 30px rgba(0,0,0,.55),0 0 0 4px rgba(124,155,255,.18)}
html[data-theme="dark"] .fab-theme .sun{display:none}
html[data-theme="dark"] .fab-theme .moon{display:block}
@media(max-width:1023px){body.pub .fab-theme{bottom:calc(var(--dockh) + 14px + env(safe-area-inset-bottom))}}

/* ===== القائمة الجانبية ===== */
.scrim{position:fixed;inset:0;z-index:110;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:.3s}
.scrim.on{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;bottom:0;right:0;z-index:120;width:min(87vw,360px);background:var(--drawer);border-left:1px solid var(--line);box-shadow:var(--shadow2);transform:translateX(105%);transition:transform .4s cubic-bezier(.2,.85,.25,1);display:flex;flex-direction:column;overflow-y:auto}
.drawer.on{transform:none}
.drawer::before{content:"";height:3px;background:var(--kit)}
.dhead{display:flex;align-items:center;gap:12px;padding:22px 20px;border-bottom:1px solid var(--line2)}
.dhead>div{flex:1;min-width:0}
.dhead b{display:block;font-family:var(--df);font-size:1.1rem}
.dhead small{display:block;color:var(--gold-ink);font-size:.7rem;font-weight:600}
.dclose{width:38px;height:38px;border-radius:11px;border:1px solid var(--line);background:var(--srf-2);color:var(--muted);flex-shrink:0}
.dnav{display:flex;flex-direction:column;gap:3px;padding:15px 13px;flex:1}
.dnav a{display:flex;align-items:center;gap:12px;padding:13px 15px;border-radius:13px;color:var(--muted);font-weight:600;font-size:.94rem;border:1px solid transparent;transition:.2s}
.dnav a:hover{background:var(--srf-2);color:var(--txt)}
.dnav a i{font-style:normal;width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:rgba(46,91,255,.12);font-size:.9rem}
.dnav a.on{background:linear-gradient(120deg,rgba(242,184,75,.18),rgba(46,91,255,.12));color:var(--gold-ink);border-color:var(--line)}
.dfoot{padding:16px 20px;border-top:1px solid var(--line2);font-size:.78rem;display:grid;grid-template-columns:auto 1fr;gap:5px 12px}
.dfoot b{color:var(--gold-ink);font-family:var(--df)}
.dfoot span{color:var(--dim)}

/* ===== الأزرار ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:linear-gradient(135deg,var(--gold),var(--goldD));color:var(--ink-fixed);border-radius:13px;padding:13px 24px;font-family:var(--df);font-weight:700;font-size:.95rem;min-height:48px;transition:.25s;box-shadow:0 10px 26px rgba(242,184,75,.28);border:none}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(242,184,75,.36);filter:brightness(1.05)}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--txt);box-shadow:none}
.btn.ghost:hover{background:rgba(242,184,75,.12);border-color:var(--gold)}
.btn.on-dark{background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff;box-shadow:none}
.btn.on-dark:hover{background:rgba(255,255,255,.12)}
.btn.full{width:100%}
.btn.sm{padding:9px 16px;font-size:.85rem;min-height:40px;border-radius:10px}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}

/* ===== الهيرو ===== */
.hero{position:relative;overflow:hidden;color:#fff;padding:30px 0 64px;background:
  radial-gradient(900px 520px at 88% -12%,rgba(242,184,75,.26),transparent 60%),
  radial-gradient(720px 480px at 8% 112%,rgba(46,91,255,.24),transparent 62%),
  repeating-linear-gradient(-45deg,rgba(255,255,255,.035) 0 2px,transparent 2px 26px),
  linear-gradient(160deg,#123024,#050d0a 72%)}
.hero::before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:6px;background:var(--kit)}
.hero-mark{position:absolute;font-family:var(--df);font-weight:800;font-size:clamp(5rem,24vw,15rem);line-height:.8;bottom:-.14em;left:-.03em;color:transparent;-webkit-text-stroke:1px rgba(242,184,75,.12);pointer-events:none}
.hero-grid{position:relative;z-index:2;display:grid;gap:30px;align-items:center;width:100%}
.badge{display:inline-flex;align-items:center;gap:9px;background:rgba(53,224,141,.14);border:1px solid rgba(53,224,141,.3);color:#35E08D;padding:7px 15px;border-radius:100px;font-size:.78rem;font-weight:700}
.badge i{width:7px;height:7px;border-radius:50%;background:#35E08D;animation:blip 1.6s infinite}
@keyframes blip{0%,100%{box-shadow:0 0 0 0 rgba(53,224,141,.5)}55%{box-shadow:0 0 0 8px rgba(53,224,141,0)}}
.hero h1{font-size:clamp(2.3rem,9.5vw,4.4rem);font-weight:800;line-height:1.12;margin:14px 0 6px}
.hero h1 em{font-style:normal;background:linear-gradient(100deg,var(--gold),var(--gold2));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero h1 span{display:block;font-size:.38em;color:#8FB0FF;font-weight:700;margin-top:6px}
.lead{font-size:clamp(.98rem,3.5vw,1.16rem);color:rgba(255,255,255,.85);max-width:42ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.hero-cta .btn{flex:1;min-width:140px}

/* ===== لوحة المباراة القادمة ===== */
.board{position:relative;overflow:hidden;background:linear-gradient(150deg,rgba(18,48,36,.94),rgba(5,13,10,.96));border:1px solid rgba(242,184,75,.3);border-radius:24px;padding:clamp(18px,4vw,26px);box-shadow:var(--shadow2);backdrop-filter:blur(10px);color:#F4F1E8}
.board::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--kit)}
.bhead{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-bottom:12px;margin-bottom:16px;border-bottom:1px dashed rgba(242,184,75,.3);font-size:.78rem;color:rgba(244,241,232,.6)}
.bhead b{color:var(--gold2);font-family:var(--df);display:flex;align-items:center;gap:8px;font-size:.86rem}
.bhead b i{width:7px;height:7px;border-radius:50%;background:#ff5c5c;animation:blip 1.5s infinite}
.vs{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;text-align:center}
.vs svg{margin:0 auto 8px}
.vs .nm{display:block;font-family:var(--df);font-weight:700;font-size:clamp(.85rem,3vw,1rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vs small{color:rgba(244,241,232,.5);font-size:.66rem}
.vs strong{font-family:var(--df);font-weight:800;color:var(--gold);font-size:1.2rem;padding:6px 10px;border-radius:10px;background:rgba(242,184,75,.1);border:1px solid rgba(242,184,75,.3)}
.opc{width:50px;height:58px;margin:0 auto 8px;display:grid;place-items:center;border:1.5px dashed rgba(124,155,255,.4);border-radius:13px 13px 24px 24px;font-family:var(--df);font-size:1.3rem;color:var(--blue2);background:rgba(46,91,255,.08)}
.bmeta{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 14px;font-size:.76rem;color:rgba(244,241,232,.8);margin:15px 0}
.cd{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;direction:ltr}
.cd>div{background:rgba(0,0,0,.32);border:1px solid rgba(242,184,75,.28);border-radius:12px;padding:10px 2px;text-align:center}
.cd b{display:block;font-family:var(--df);font-weight:800;font-size:clamp(1.15rem,5vw,1.8rem);color:var(--gold2);line-height:1;font-variant-numeric:tabular-nums}
.cd span{font-size:.62rem;color:rgba(244,241,232,.6)}
.board .btn{margin-top:15px}

/* ===== رأس الصفحات ===== */
.phero{position:relative;padding:44px 0 38px;overflow:hidden;background:linear-gradient(160deg,var(--srf-2),var(--bg) 72%)}
.phero::before{content:attr(data-wm);position:absolute;font-family:var(--df);font-weight:800;font-size:20vw;line-height:.8;bottom:-.14em;left:-.03em;color:transparent;-webkit-text-stroke:1px var(--line);pointer-events:none;opacity:.55}
.phero .wrap{position:relative}
.phero h1{font-size:clamp(1.9rem,7.6vw,3.2rem);font-weight:800}
.phero h1 em{font-style:normal;background:linear-gradient(100deg,var(--gold-ink),var(--goldD));-webkit-background-clip:text;background-clip:text;color:transparent}
html[data-theme="dark"] .phero h1 em{background:linear-gradient(100deg,var(--gold2),var(--gold));-webkit-background-clip:text;background-clip:text}
.phero p{color:var(--muted);max-width:60ch;margin-top:10px}
.phero .rule{width:64px;height:4px;background:var(--kit);border-radius:2px;margin-top:14px}

/* ===== البحث ===== */
.searchbar{display:flex;align-items:center;gap:10px;background:var(--srf);border:1.5px solid var(--line);border-radius:100px;padding:6px 8px 6px 18px;box-shadow:var(--shadow);margin:0 0 22px;transition:.25s}
.searchbar:focus-within{border-color:var(--gold);box-shadow:0 0 0 4px rgba(242,184,75,.16)}
.searchbar .s-ico{font-size:1rem;opacity:.75}
.searchbar input{flex:1;border:none;background:transparent;outline:none;font-size:.95rem;padding:10px 0;color:var(--txt);min-width:0}
.searchbar .s-clear{width:34px;height:34px;border-radius:50%;background:var(--srf-2);color:var(--muted);display:none;place-items:center;flex-shrink:0}
.searchbar.has .s-clear{display:grid}
.searchbar .s-count{font-size:.7rem;font-weight:800;color:var(--gold-ink);background:rgba(242,184,75,.16);padding:5px 11px;border-radius:100px;white-space:nowrap}

/* ===== بطاقات الوصول ===== */
.qcards{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.qcard{position:relative;display:flex;align-items:center;gap:12px;padding:16px;border-radius:18px;background:var(--srf);border:1px solid var(--line2);box-shadow:var(--shadow);overflow:hidden;transition:.3s}
.qcard::before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;background:var(--kit)}
.qcard:hover{transform:translateY(-5px);box-shadow:var(--shadow2);border-color:var(--gold)}
.q-ico{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;font-size:1.4rem;background:linear-gradient(135deg,rgba(242,184,75,.18),rgba(46,91,255,.14));flex-shrink:0}
.qcard b{display:block;font-family:var(--df);font-size:1rem}
.qcard small{color:var(--muted);font-size:.74rem}
.q-num{margin-inline-start:auto;font-family:var(--df);font-weight:800;font-size:1.15rem;color:var(--gold-ink);background:rgba(242,184,75,.14);padding:4px 11px;border-radius:100px}

/* ===== الأقسام ===== */
.sec{padding:clamp(28px,6vw,52px) 0}
.sec.alt{background:var(--bg-soft)}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px}
.sec-head h2{font-size:clamp(1.4rem,5vw,2.1rem);font-weight:800;line-height:1.15}
.kick{display:inline-block;font-family:var(--df);font-weight:800;font-size:.82rem;color:var(--gold-ink);letter-spacing:.5px;padding:4px 12px;background:rgba(242,184,75,.12);border-radius:100px;margin-bottom:8px}

/* ===== التمرير الأفقي ===== */
.hscroll{display:flex;gap:18px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory;scrollbar-width:none}
.hscroll::-webkit-scrollbar{display:none}
.hscroll .match{flex:0 0 min(320px,85vw);scroll-snap-align:start}

/* ===== البطاقات ===== */
.card{background:var(--srf);border:1px solid var(--line2);border-radius:var(--r);padding:18px;box-shadow:var(--shadow);overflow:hidden;transition:.3s}
.card:hover{box-shadow:var(--shadow2);border-color:var(--line)}
.card.rv{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.card.rv.on{opacity:1;transform:none}

.empty{text-align:center;padding:50px 20px;color:var(--muted)}
.empty i{font-size:3rem;display:block;margin-bottom:14px;opacity:.7}
.empty h3{font-family:var(--df);font-size:1.2rem;color:var(--txt);margin-bottom:8px}
.empty p{font-size:.9rem;max-width:40ch;margin:0 auto}

/* ===== بطاقات المباريات ===== */
.match{position:relative;display:grid;grid-template-columns:72px 1fr;gap:14px;align-items:start}
.mdate{display:grid;place-items:center;background:var(--srf-2);border-radius:13px;padding:8px 4px;font-family:var(--df);text-align:center}
.mdate b{display:block;font-size:1.7rem;font-weight:800;color:var(--gold-ink);line-height:1}
.mdate small{font-size:.7rem;color:var(--muted);margin-top:2px;font-weight:700}
.minfo{min-width:0}
.minfo b{font-family:var(--df);font-size:1.02rem;display:block;margin-bottom:3px}
.minfo em{display:block;font-style:normal;font-size:.78rem;color:var(--muted);margin-bottom:6px}
.minfo small{font-size:.74rem;color:var(--dim)}
.score{font-family:var(--df);font-weight:800;font-size:1.3rem;color:var(--gold-ink);background:rgba(242,184,75,.12);padding:8px 14px;border-radius:11px;text-align:center;margin-top:10px;grid-column:1 / -1}
.mtags{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px;grid-column:1 / -1}
.tag{font-size:.7rem;font-weight:700;padding:4px 11px;border-radius:100px;border:1px solid var(--line2);color:var(--muted)}
.tag.w{background:rgba(31,138,76,.14);border-color:rgba(31,138,76,.35);color:var(--green)}
.tag.d{background:rgba(180,83,9,.14);border-color:rgba(180,83,9,.35);color:var(--amber)}
.tag.l{background:rgba(194,65,12,.14);border-color:rgba(194,65,12,.35);color:var(--red)}
.tag.u{background:rgba(46,91,255,.12);border-color:rgba(46,91,255,.3);color:var(--blue-ink)}
.tag.g{background:var(--srf-2);color:var(--txt)}

/* ===== بطاقات اللاعبين ===== */
.player{display:flex;gap:14px;align-items:center}
.pph{width:78px;height:78px;flex-shrink:0;border-radius:16px;background:linear-gradient(135deg,var(--gold),var(--goldD));display:grid;place-items:center;font-family:var(--df);font-weight:800;font-size:1.6rem;color:var(--ink-fixed);overflow:hidden}
.pph img{width:100%;height:100%;object-fit:cover}
.pbd b{font-family:var(--df);font-size:1.05rem;display:block;margin-bottom:4px}
.pbd div{display:flex;gap:8px;flex-wrap:wrap;font-size:.76rem;color:var(--muted)}
.pbd span.pos{color:var(--gold-ink);font-weight:700}

.players{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}

/* ===== بطاقات الأخبار ===== */
.news-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.ncard{display:flex;flex-direction:column;gap:12px}
.nph{aspect-ratio:16/10;border-radius:14px;background:var(--srf-2);overflow:hidden}
.nph img{width:100%;height:100%;object-fit:cover;transition:.5s}
.ncard:hover .nph img{transform:scale(1.06)}
.nbd time{font-size:.75rem;color:var(--muted);font-weight:600}
.nbd h3{font-family:var(--df);font-size:1.05rem;line-height:1.35;margin:4px 0 6px}
.nbd p{font-size:.88rem;color:var(--muted)}

/* ===== التبويبات ===== */
.tabs{display:flex;gap:6px;margin-bottom:18px;border-bottom:1px solid var(--line2);padding-bottom:6px;overflow-x:auto}
.tabs button{padding:10px 18px;border-radius:10px 10px 4px 4px;font-size:.88rem;font-weight:700;color:var(--muted);border:none;background:transparent;cursor:pointer;font-family:var(--df);white-space:nowrap}
.tabs button.on{color:var(--gold-ink);background:rgba(242,184,75,.1);position:relative}
.tabs button.on::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:2px;background:var(--kit)}

/* ===== الفلاتر ===== */
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}
.chips button{padding:7px 14px;border-radius:100px;border:1px solid var(--line);background:var(--srf);color:var(--muted);font-size:.82rem;font-weight:600;cursor:pointer;transition:.2s;font-family:var(--df)}
.chips button.on{background:linear-gradient(135deg,var(--gold),var(--goldD));color:var(--ink-fixed);border-color:transparent}
.chips button:hover{border-color:var(--gold)}

/* ===== سجل الشرف ===== */
.hgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.hcard{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}
.hi{font-size:2rem;grid-row:span 3}
.hs{font-size:.72rem;color:var(--muted);font-weight:700}
.hcard b{font-family:var(--df);font-size:1rem;display:block;margin:2px 0}
.hh{font-size:.78rem;color:var(--gold-ink);font-weight:600}
.hcard p{font-size:.82rem;color:var(--muted);margin-top:4px}

/* ===== الإدارة ===== */
.bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.bcard{text-align:center;padding:22px 16px}
.bph{width:92px;height:92px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--goldD));color:var(--ink-fixed);font-family:var(--df);font-weight:800;font-size:1.8rem;margin:0 auto 12px;display:grid;place-items:center;overflow:hidden}
.bph img{width:100%;height:100%;object-fit:cover}
.bcard b{font-family:var(--df);display:block;font-size:1.05rem}
.bcard .role{display:block;color:var(--gold-ink);font-size:.82rem;font-weight:700;margin:4px 0 10px}
.bcard .tel{font-size:.8rem;color:var(--muted);display:inline-block;padding:4px 10px;border-radius:100px;background:var(--srf-2)}

/* ===== عن النادي ===== */
.about-g{display:grid;grid-template-columns:1fr;gap:30px;align-items:start}
@media(min-width:900px){.about-g{grid-template-columns:1.3fr 1fr}}
.about-c h2{font-size:clamp(1.6rem,6vw,2.4rem);line-height:1.2;margin-bottom:14px}
.about-c p{color:var(--muted);margin-bottom:18px}
.facts{padding:22px;margin-top:20px}
.facts h3{font-family:var(--df);font-size:1.1rem;margin-bottom:12px;color:var(--gold-ink)}
.frow{display:grid;grid-template-columns:auto 1fr;gap:10px;padding:9px 0;border-bottom:1px dashed var(--line2);font-size:.9rem}
.frow:last-child{border:none}
.frow b{color:var(--muted);font-weight:600}

/* ===== الخط الزمني ===== */
.tline{display:grid;gap:14px}
.titem{padding:18px 20px;position:relative;overflow:hidden}
.titem::before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;background:var(--kit)}
.titem b{display:block;font-family:var(--df);font-size:1.5rem;color:var(--gold-ink);font-weight:800;margin-bottom:4px}
.titem h3{font-family:var(--df);font-size:1.05rem;margin-bottom:4px}
.titem p{font-size:.88rem;color:var(--muted)}

/* ===== التواصل ===== */
.contact-g{display:grid;grid-template-columns:1fr;gap:22px}
@media(min-width:900px){.contact-g{grid-template-columns:1.2fr 1fr}}
.form label{display:block;margin-bottom:14px;font-size:.88rem;color:var(--muted);font-weight:600}
.form input,.form select,.form textarea{width:100%;margin-top:6px;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;background:var(--bg);color:var(--txt);font-size:.95rem;transition:.2s;font-family:var(--bf)}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 4px rgba(242,184,75,.12)}
.form textarea{resize:vertical;min-height:120px}
.info ul{list-style:none}
.info li{display:grid;grid-template-columns:auto 1fr;gap:12px;padding:11px 0;border-bottom:1px dashed var(--line2);font-size:.9rem}
.info li:last-child{border:none}
.info li b{color:var(--muted);font-weight:600;white-space:nowrap}

/* ===== الميدانان ===== */
.fields-mini{background:var(--srf);border:1px solid var(--line2);border-radius:var(--r);padding:22px;margin-bottom:20px;box-shadow:var(--shadow)}
.mini-lbl{display:block;font-family:var(--df);font-weight:700;font-size:1rem;margin-bottom:12px}
.fbtns{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fbtn{display:flex;align-items:center;gap:10px;padding:14px;border-radius:13px;background:var(--srf-2);border:1px solid var(--line2);font-weight:600;font-size:.88rem;transition:.2s}
.fbtn:hover{border-color:var(--gold);background:rgba(242,184,75,.08)}
.fbtn em{margin-inline-start:auto;color:var(--gold-ink)}

/* ===== شريط الدعوة ===== */
.cta-band{background:linear-gradient(135deg,var(--gold),var(--goldD));color:var(--ink-fixed);border-radius:var(--r);padding:clamp(22px,5vw,36px);text-align:center;margin-top:24px;box-shadow:0 16px 44px rgba(242,184,75,.32)}
.cta-band h3{font-family:var(--df);font-size:clamp(1.4rem,5vw,1.9rem);margin-bottom:8px}
.cta-band p{opacity:.88;margin-bottom:18px;font-size:.95rem}
.cta-band .btn{background:var(--ink-fixed);color:var(--gold);box-shadow:0 10px 24px rgba(0,0,0,.2)}
.cta-band .btn:hover{filter:brightness(1.1)}

/* ===== شريط التنقل السفلي ===== */
.dock{position:fixed;left:50%;bottom:12px;transform:translateX(-50%);z-index:70;background:var(--dockbg);backdrop-filter:blur(18px) saturate(1.3);border:1px solid var(--line2);border-radius:100px;padding:8px;display:flex;gap:4px;box-shadow:var(--shadow2)}
@media(min-width:1024px){.dock{display:none}}
.dock a{position:relative;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;color:var(--muted);font-size:1.1rem;transition:.2s}
.dock a span{position:absolute;bottom:-22px;font-size:.62rem;font-weight:700;white-space:nowrap;opacity:0;transition:.2s;pointer-events:none;color:var(--gold-ink)}
.dock a:hover span,.dock a.on span{opacity:1}
.dock a.on{background:linear-gradient(135deg,var(--gold),var(--goldD));color:var(--ink-fixed)}

/* ===== زر البحث العائم ===== */
.fab-search{position:fixed;right:16px;bottom:24px;z-index:130;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,var(--blue),var(--blue-ink));color:#fff;box-shadow:0 12px 30px rgba(46,91,255,.42),0 0 0 4px rgba(46,91,255,.16);transition:.3s;border:none;font-size:1.3rem}
.fab-search:hover{transform:translateY(-3px) scale(1.06)}
@media(max-width:1023px){body.pub .fab-search{bottom:calc(var(--dockh) + 14px + env(safe-area-inset-bottom))}}

/* ===== البحث الشامل ===== */
.gsearch-modal{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.7);backdrop-filter:blur(10px);display:none;align-items:flex-start;justify-content:center;padding:10vh 16px;overflow-y:auto}
.gsearch-modal.on{display:flex;animation:fadeIn .3s}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.gsearch-box{width:100%;max-width:680px;background:var(--srf);border-radius:var(--r);border:1px solid var(--line);box-shadow:var(--shadow2);overflow:hidden}
.gsearch-in{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line2)}
.gsearch-in input{flex:1;border:none;background:transparent;outline:none;font-size:1.05rem;color:var(--txt);padding:8px 0;font-family:var(--bf)}
.gsearch-in button{color:var(--muted);font-size:1.2rem}
.gsearch-results{max-height:60vh;overflow-y:auto;padding:8px}
.gs-item{display:flex;gap:12px;padding:12px;border-radius:12px;transition:.2s;align-items:center}
.gs-item:hover{background:var(--srf-2)}
.gs-ico{width:40px;height:40px;border-radius:10px;background:rgba(242,184,75,.12);display:grid;place-items:center;font-size:1.1rem;flex-shrink:0}
.gs-bd b{display:block;font-family:var(--df);font-size:.95rem}
.gs-bd small{color:var(--muted);font-size:.76rem}

/* ===== جدول الترتيب ===== */
.standings-tbl{width:100%;border-collapse:collapse;background:var(--srf);border:1px solid var(--line2);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.standings-tbl th,.standings-tbl td{padding:12px 14px;text-align:center;border-bottom:1px solid var(--line2);font-size:.88rem}
.standings-tbl th{background:linear-gradient(135deg,#123024,#050d0a);color:var(--gold2);font-family:var(--df);font-weight:700;font-size:.82rem}
.standings-tbl tr:last-child td{border:none}
.standings-tbl tr.my-team{background:rgba(242,184,75,.14);font-weight:700}
.standings-tbl tr.my-team td:first-child{position:relative}
.standings-tbl tr.my-team td:first-child::before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;background:var(--kit)}
.standings-tbl .team-cell{text-align:start;font-weight:600}
.standings-tbl .pos{font-family:var(--df);font-weight:800;color:var(--gold-ink)}
@media(max-width:640px){.standings-tbl th,.standings-tbl td{padding:8px 6px;font-size:.78rem}}

/* ===== معرض الصور ===== */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.gal-item{aspect-ratio:1/1;border-radius:16px;overflow:hidden;background:var(--srf-2);cursor:pointer;transition:.3s;position:relative}
.gal-item:hover{transform:scale(1.03);box-shadow:var(--shadow2)}
.gal-item img{width:100%;height:100%;object-fit:cover}
.gal-item .gal-cap{position:absolute;bottom:8px;inset-inline-start:8px;background:rgba(0,0,0,.7);color:#fff;font-size:.72rem;padding:4px 10px;border-radius:100px;backdrop-filter:blur(8px);max-width:80%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gal-empty{display:grid;place-items:center;color:var(--muted);font-size:3rem;opacity:.4}

/* ===== عارض الصور ===== */
.lightbox{position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.95);display:none;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(12px)}
.lightbox.on{display:flex;animation:fadeIn .3s}
.lightbox img{max-width:95vw;max-height:85vh;border-radius:12px;box-shadow:0 0 0 1px rgba(255,255,255,.1)}
.lb-meta{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.7);color:#fff;padding:8px 18px;border-radius:100px;backdrop-filter:blur(8px);font-size:.88rem;max-width:90%;text-align:center}
.lb-x{position:absolute;top:20px;inset-inline-end:20px;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;display:grid;place-items:center;font-size:1.4rem;cursor:pointer;border:none;backdrop-filter:blur(8px)}
.lb-x:hover{background:rgba(255,255,255,.3)}

/* ===== الإحصائيات ===== */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:24px}
.stat-card{background:var(--srf);border:1px solid var(--line2);border-radius:var(--r);padding:18px;text-align:center;position:relative;overflow:hidden}
.stat-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--kit)}
.stat-val{font-family:var(--df);font-size:2rem;font-weight:800;color:var(--gold-ink);line-height:1}
.stat-lbl{font-size:.78rem;color:var(--muted);margin-top:4px}

/* ===== الإشعارات ===== */
.toast{position:fixed;top:20px;left:50%;transform:translateX(-50%) translateY(-120%);background:var(--ink-fixed);color:var(--gold);padding:12px 22px;border-radius:100px;font-weight:700;font-size:.88rem;box-shadow:var(--shadow2);z-index:400;transition:transform .4s cubic-bezier(.2,.8,.2,1);font-family:var(--df);border:1px solid var(--gold)}
.toast.on{transform:translateX(-50%) translateY(0)}

/* ===== وسائل التواصل ===== */
.soc{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.soc-a{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;background:var(--srf-2);border:1px solid var(--line2);border-radius:100px;font-size:.82rem;font-weight:600;transition:.2s}
.soc-a:hover{border-color:var(--gold);color:var(--gold-ink)}
.soc-a svg{width:16px;height:16px}

/* ===== الفوتر ===== */
.foot{background:linear-gradient(160deg,var(--srf-2),var(--bg));border-top:1px solid var(--line2);padding:36px 0 24px;font-size:.85rem;color:var(--muted)}
.foot-g{display:grid;grid-template-columns:1fr;gap:22px;margin-bottom:22px}
@media(min-width:760px){.foot-g{grid-template-columns:repeat(3,1fr)}}
.foot h4{font-family:var(--df);color:var(--txt);font-size:1rem;margin-bottom:10px}
.foot a{display:block;padding:4px 0;color:var(--muted);transition:.2s}
.foot a:hover{color:var(--gold-ink)}
.foot-btm{border-top:1px dashed var(--line2);padding-top:16px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.78rem}
.foot-btm b{color:var(--gold-ink);font-family:var(--df)}

/* ===== تحسينات الأداء ===== */
img[loading="lazy"]{opacity:0;transition:opacity .4s ease}
img[loading="lazy"].loaded{opacity:1}
.card.skeleton{background:linear-gradient(90deg,var(--srf-2) 25%,var(--srf-3) 50%,var(--srf-2) 75%);background-size:200% 100%;animation:skel 1.5s infinite}
@keyframes skel{0%{background-position:200% 0}100%{background-position:-200% 0}}
[data-img]{cursor:pointer;transition:transform .3s ease}

/* ===== الطباعة ===== */
@media print{
  .topbar,.fab-theme,.fab-search,.dock,.drawer,.scrim,.hero-cta,.btn,.foot{display:none!important}
  body{padding:0!important;background:#fff!important;color:#000!important}
  .card{box-shadow:none!important;border:1px solid #ccc!important;page-break-inside:avoid}
}