/* «ميزون وشجرة اللبان» — أساس مشترك. خطوط محلية OFL، لا موارد خارجية. */
@font-face { font-family: "Reem Kufi"; src: url(/fonts/reem-kufi-arabic-600-normal.woff2) format("woff2"); font-weight: 600; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E, U+0020-0040; }
@font-face { font-family: "Reem Kufi"; src: url(/fonts/reem-kufi-arabic-400-normal.woff2) format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E, U+0020-0040; }
@font-face { font-family: "Amiri"; src: url(/fonts/amiri-arabic-400-normal.woff2) format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E; }
@font-face { font-family: "Amiri"; src: url(/fonts/amiri-arabic-700-normal.woff2) format("woff2"); font-weight: 700; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E; }
@font-face { font-family: "Noto Sans Arabic"; src: url(/fonts/noto-sans-arabic-arabic-400-normal.woff2) format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E; }
@font-face { font-family: "Noto Sans Arabic"; src: url(/fonts/noto-sans-arabic-arabic-600-normal.woff2) format("woff2"); font-weight: 600; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E; }

:root {
  --plum: #1E0F2A; --maroon: #5B1220; --gold: #E8B04A; --leaf: #6FA043; --glow: #C9F07A;
  --paper: #F4EAD5; --ink: #2A1A24; --muted: #CDBFA8;
  --r: 14px; --btn-h: 52px;
  --f-head: "Reem Kufi", "Noto Sans Arabic", system-ui, sans-serif;
  --f-body: "Noto Sans Arabic", system-ui, sans-serif;
  --f-msg: "Amiri", "Noto Sans Arabic", serif;
  color-scheme: dark;
}
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { background: var(--plum); color: var(--paper); font-family: var(--f-body); font-size: 17px; line-height: 1.6; -webkit-text-size-adjust: 100%; overflow-x: hidden; }
button, input, textarea { font: inherit; color: inherit; }
a { color: var(--gold); }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
[hidden] { display: none !important; }

.btn { min-height: var(--btn-h); min-width: 44px; padding: 0 26px; border-radius: var(--r); border: 0; cursor: pointer;
  font-family: var(--f-head); font-weight: 600; font-size: 20px; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  text-decoration: none; touch-action: manipulation; transition: transform .15s ease, background-color .15s ease; }
.btn:active { transform: scale(.97); }
.btn:focus-visible, .icon-btn:focus-visible, textarea:focus-visible, input:focus-visible { outline: 3px solid var(--glow); outline-offset: 3px; }
.btn-primary { background: var(--gold); color: var(--ink); }
.btn-primary:hover { background: #F0C068; }
.btn-primary[disabled] { background: #8E7A55; color: #2A1A24; cursor: progress; }
.btn-ghost { background: transparent; color: var(--paper); border: 2px solid rgba(244, 234, 213, .55); }
.btn-ghost:hover { border-color: var(--paper); }
.btn-small { min-height: 44px; font-size: 16px; padding: 0 16px; }
.icon-btn { width: 48px; height: 48px; border-radius: 50%; border: 0; display: inline-grid; place-items: center; cursor: pointer;
  background: rgba(30, 15, 42, .72); color: var(--paper); }
.icon-btn svg { width: 24px; height: 24px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}
