@font-face{font-family:"Cordale";src:url(/fonts/Cordale-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Cordale";src:url(/fonts/Cordale-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Kookies";src:url(/fonts/Kookies-Light.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Kookies";src:url(/fonts/Kookies-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Kookies";src:url(/fonts/Kookies-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Hail";src:url(/fonts/Hail-Light.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"KOMedia";src:url(/fonts/KOMedia-Black.woff2) format("woff2");font-weight:900;font-display:swap}

:root{
  --navy:#22364a; --gold:#8a7660;
  --navy-d:color-mix(in srgb,var(--navy) 62%,#000);
  --navy-dd:color-mix(in srgb,var(--navy) 38%,#000);
  --navy-l:color-mix(in srgb,var(--navy) 82%,#fff);
  --navy-ll:color-mix(in srgb,var(--navy) 10%,#fff);
  --gold-l:color-mix(in srgb,var(--gold) 62%,#fff);
  --gold-ll:color-mix(in srgb,var(--gold) 22%,#fff);
  --gold-pale:color-mix(in srgb,var(--gold) 10%,#fff);
  --gold-d:color-mix(in srgb,var(--gold) 78%,#000);
  --cream:#f8f5ef; --paper:#fffdfa; --white:#fff;
  --ink:#1d2733; --ink2:#3d4958; --muted:#6c7785; --faint:#98a1ad;
  --line:#e7e1d5; --line2:#efeadf;
  --ok:#2c7a58; --ok-bg:#e7f3ec; --warn:#a96d12; --warn-bg:#fbf1dc; --bad:#b0413a; --bad-bg:#fae8e6; --info:#2a6a97; --info-bg:#e6f0f8;
  --f-body:"Cordale","Tahoma","Segoe UI",system-ui,sans-serif;
  --f-ui:"Kookies","Cordale","Tahoma",system-ui,sans-serif;
  --f-lead:"Hail","Kookies","Cordale",system-ui,sans-serif;
  --f-num:"KOMedia","Kookies","Cordale",sans-serif;
  --r-s:8px; --r:14px; --r-l:22px;
  --sh-s:0 1px 2px rgba(34,54,74,.06),0 2px 8px rgba(34,54,74,.05);
  --sh:0 4px 12px rgba(34,54,74,.07),0 14px 34px rgba(34,54,74,.09);
  --sh-l:0 10px 28px rgba(20,33,46,.14),0 32px 70px rgba(20,33,46,.16);
  --ease:cubic-bezier(.22,.8,.26,1);
  --hdr:78px;
  --head:var(--navy); --surface:#fff;
  color-scheme:light;
}
[data-theme=dark]{
  color-scheme:dark;
  --cream:#0c151e; --paper:#101a25; --surface:#15212e; --white:#15212e;
  --line:#26374a; --line2:#1d2c3b; --ink:#e7ecf1; --ink2:#c2ccd7; --muted:#92a1b1; --faint:#6b7a8a;
  --head:#f2e8d3; --navy-ll:#1b2b3c; --gold-pale:color-mix(in srgb,var(--gold) 16%,#15212e);
  --ok-bg:#12332a; --warn-bg:#3a2e12; --bad-bg:#3a1c1a; --info-bg:#14293a;
  --sh-s:0 1px 2px rgba(0,0,0,.3),0 2px 8px rgba(0,0,0,.25); --sh:0 6px 18px rgba(0,0,0,.35),0 18px 40px rgba(0,0,0,.3);
}
[data-theme=dark] .wm:not(.w){background-image:url(/img/wordmark-white.png)}
[data-theme=dark] .btn.out{--fg:var(--head);--bd:rgba(255,255,255,.22)}
[data-theme=dark] .btn.out:hover{background:var(--gold);border-color:var(--gold)}
[data-theme=dark] .btn.soft{--bg:#1f3145;--fg:#e8dcc4}
[data-theme=dark] .btn:not(.gold):not(.out):not(.soft):not(.ghost):not(.ok):not(.bad):not(.warn):not(.out-w){--bg:#2a4560}
[data-theme=dark] .alert.info{background:var(--info-bg);border-color:#254a66;color:#a9d0ea}[data-theme=dark] .alert.warn{border-color:#5c4a1c;color:#ecc983}
[data-theme=dark] .alert.bad{border-color:#6a2d29;color:#f0aaa4}[data-theme=dark] .alert.ok{border-color:#245c47;color:#9fdcbf}[data-theme=dark] .alert.gold{border-color:#4a4132;color:#dcc9a3}
[data-theme=dark] .sticky-note{background:#2d2813;border-color:#54491f;color:#ecdfb0}
[data-theme=dark] .badge.neutral{background:#243344;color:#c2ccd7}[data-theme=dark] .badge.progress{background:#222f55;color:#aab6f0}
[data-theme=dark] .modal-f,[data-theme=dark] .filters{background:var(--paper)}
[data-theme=dark] .inp[disabled],[data-theme=dark] .sel[disabled],[data-theme=dark] .txa[disabled]{background:#1a2735}
[data-theme=dark] .print-doc{background:var(--surface)}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;font-family:var(--f-body);font-size:16.5px;line-height:1.85;color:var(--ink);background:var(--cream);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
img,video{max-width:100%;display:block}
svg{width:1.25em;height:1.25em;flex:none;display:inline-block;vertical-align:-.22em;max-width:none}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3,h4{font-family:var(--f-ui);font-weight:700;line-height:1.4;margin:0 0 .5em;color:var(--head)}
h1{font-size:clamp(2rem,4.6vw,3.4rem)} h2{font-size:clamp(1.6rem,3vw,2.3rem)} h3{font-size:1.3rem} h4{font-size:1.08rem}
p{margin:0 0 1em}
::selection{background:var(--gold-l);color:var(--navy-dd)}
:focus-visible{outline:3px solid color-mix(in srgb,var(--gold) 55%,transparent);outline-offset:2px;border-radius:6px}
.skip{position:absolute;inset-inline-start:12px;top:-60px;background:var(--navy);color:#fff;padding:.5rem 1rem;border-radius:8px;z-index:999;font-family:var(--f-ui)}
.skip:focus{top:10px}
.num{font-feature-settings:"tnum";direction:ltr;unicode-bidi:isolate;display:inline-block}
.ltr{direction:ltr;unicode-bidi:isolate;text-align:left}
.muted{color:var(--muted)} .small{font-size:.9rem} .tiny{font-size:.8rem}
.ui{font-family:var(--f-ui)} .lead{font-family:var(--f-body);font-size:1.18rem;line-height:2;color:var(--ink2)}
.hide{display:none!important} .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap} .col{display:flex;flex-direction:column;gap:.75rem}
.grow{flex:1 1 auto} .between{justify-content:space-between} .center{justify-content:center;text-align:center}
.wrap{width:min(1200px,100% - 2.5rem);margin-inline:auto}
.gap-s{gap:.4rem} .gap-l{gap:1.5rem}
.mt{margin-top:1rem} .mt-l{margin-top:2rem} .mb{margin-bottom:1rem} .mb-0{margin-bottom:0}

/* ───── شعار الوقف: علامة بارزة بتدرّج ذهبي وحفر وبريق خفيف ───── */
.mark{--s:120px;position:relative;width:var(--s);aspect-ratio:1275/1804;flex:none;display:block}
.mark>i{position:absolute;inset:0;display:block;-webkit-mask:url(/img/mark-ink.png) center/contain no-repeat;mask:url(/img/mark-ink.png) center/contain no-repeat}
.mark .m-sh{background:#000;opacity:.5;transform:translate(calc(var(--s)*.022),calc(var(--s)*.03));filter:blur(calc(var(--s)*.018))}
.mark .m-hi{background:var(--surface);opacity:.55;transform:translate(calc(var(--s)*-.008),calc(var(--s)*-.01))}
.mark .m-base{background:linear-gradient(150deg,#f3e6c8 0%,#d1b98d 28%,#a58d6a 58%,#7d6a52 100%)}
.mark .m-shine{background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.75) 50%,transparent 62%);background-size:300% 100%;background-position:130% 0;animation:shine 6.5s var(--ease) infinite;mix-blend-mode:soft-light}
.mark.flat .m-base{background:var(--gold)} .mark.flat .m-sh,.mark.flat .m-hi,.mark.flat .m-shine{display:none}
.mark.flat-w .m-base{background:var(--surface)} .mark.flat-w .m-sh,.mark.flat-w .m-hi,.mark.flat-w .m-shine{display:none}
@keyframes shine{0%,55%{background-position:130% 0}100%{background-position:-30% 0}}
.wm{display:block;height:var(--h,42px);aspect-ratio:1574/530;background:no-repeat center/contain url(/img/wordmark-navy.png)}
.wm.w{background-image:url(/img/wordmark-white.png)}
.brand{display:flex;align-items:center;gap:.8rem}
.stage{position:relative;display:grid;place-items:center;aspect-ratio:1;isolation:isolate}
.stage::before{content:"";position:absolute;inset:6%;border-radius:38%;transform:rotate(45deg);background:radial-gradient(circle at 35% 30%,#2f4964 0%,#192a3b 55%,#101c28 100%);box-shadow:inset 0 0 0 1px rgba(184,162,131,.35),inset 0 0 60px rgba(0,0,0,.45),0 30px 70px rgba(5,12,20,.55);z-index:-2}
.stage::after{content:"";position:absolute;inset:-4%;border-radius:44%;transform:rotate(45deg);border:1px solid rgba(184,162,131,.22);z-index:-3}
.stage .glow{position:absolute;inset:18%;border-radius:50%;background:radial-gradient(circle,rgba(209,185,141,.28),transparent 68%);filter:blur(18px);z-index:-1;animation:pulse 5s ease-in-out infinite}
@keyframes pulse{50%{opacity:.55;transform:scale(1.08)}}

/* ───── شاشة التحميل ───── */
.boot{position:fixed;inset:0;display:grid;place-items:center;background:var(--navy-d)}
.boot-mark{width:74px;aspect-ratio:1275/1804;background:linear-gradient(150deg,#f3e6c8,#a58d6a);-webkit-mask:url(/img/mark-ink.png) center/contain no-repeat;mask:url(/img/mark-ink.png) center/contain no-repeat;animation:pulse 1.6s ease-in-out infinite}

/* ───── حركة الظهور ───── */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}
.page-in{animation:pageIn .5s var(--ease) both}
@keyframes pageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.rv{opacity:1;transform:none}}
@media print{.no-print{display:none!important}body{background:var(--surface)}}

#sprog{position:fixed;top:0;inset-inline:0;height:3px;z-index:500;transform-origin:right;transform:scaleX(0);background:linear-gradient(90deg,var(--gold),#e9d6ad);pointer-events:none}
.theme-tog .i-sun{display:none}[data-theme=dark] .theme-tog .i-sun{display:inline}[data-theme=dark] .theme-tog .i-moon{display:none}
.brand-panel{position:relative;aspect-ratio:1;border-radius:36px;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 25% 15%,color-mix(in srgb,var(--gold) 40%,transparent),transparent 55%),linear-gradient(160deg,#1d3248,#0b1521);box-shadow:var(--sh-l);isolation:isolate}
.brand-panel::before{content:"";position:absolute;inset:14%;border-radius:50%;background:radial-gradient(circle,rgba(233,214,173,.22),transparent 68%);filter:blur(10px);z-index:-1;animation:pulse 5s ease-in-out infinite}
.brand-panel .mark{--s:46%;width:46%}
@media print{#sprog{display:none}}