/* البوصلة السعودية — هوية صاحب المشروع: أخضر داكن فاخر، تركوازي البوصلة، ذهبي الحلقة. الداكن هو الأصل، والفاتح متاح.
   قواعد العربية: Plex Arabic، ارتفاع سطر ≥1.4، بلا تباعد أحرف، بلا إيموجي، الذهبي للبرهان والتقييم الحقيقي فقط. */
@font-face{font-family:"IBM Plex Sans Arabic";src:url("/static/fonts/IBMPlexSansArabic-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url("/static/fonts/IBMPlexSansArabic-Medium.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url("/static/fonts/IBMPlexSansArabic-SemiBold.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url("/static/fonts/IBMPlexSansArabic-Bold.woff2") format("woff2");font-weight:700;font-display:swap}

:root{
  color-scheme:dark;
  --bg-0:#061913; --bg-1:#0B2019; --bg-2:#112A22; --bg-3:#183A2F;
  --surface:#112A22; --surface-2:#16382D; --glass:rgba(6,25,19,.78);
  --border:#1F3D33; --border-strong:#2E5347;
  --ink:#F2F8F4; --muted:#9BB0A7; --faint:#6F877E; --on-accent:#06120E;
  --teal:#65C9A4; --teal-deep:#42AD87; --teal-soft:rgba(101,201,164,.14); --teal-glow:rgba(101,201,164,.35);
  --gold:#E0B962; --gold-light:#F0D48A; --gold-soft:rgba(224,185,98,.14);
  --violet:#B79BFF; --sky:#7FC4F2; --rose:#F29AA6; --amber:#F2C06C;
  --ok:#6FCB9E; --warn:#E5BF6B; --danger:#F08B86; --info:#8FC2D6;
  --shadow:0 12px 32px rgba(0,0,0,.28); --shadow-lg:0 26px 70px rgba(0,0,0,.45);
  --radius-s:12px; --radius:20px; --radius-l:26px; --pill:999px;
  --ease:cubic-bezier(.16,1,.3,1); --dur:220ms; --dur-slow:520ms;
  --font:"IBM Plex Sans Arabic",-apple-system,system-ui,"Segoe UI",Tahoma,sans-serif;
  --tap:44px; --nav-h:74px; --header-h:64px; --content-max:1240px; --rail-w:92px;
  --map-marker:#65C9A4;
}
:root[data-theme="light"]{
  color-scheme:light;
  --bg-0:#F2F1ED; --bg-1:#FFFEFB; --bg-2:#F5F7F4; --bg-3:#E8ECE7;
  --surface:#FFFFFF; --surface-2:#EDF5F0; --glass:rgba(255,254,251,.82);
  --border:#E5E8E4; --border-strong:#CBD3CD;
  --ink:#14251F; --muted:#5E6F68; --faint:#85938C; --on-accent:#FFFFFF;
  --teal:#00684B; --teal-deep:#004C38; --teal-soft:rgba(0,104,75,.10); --teal-glow:rgba(0,104,75,.22);
  --gold:#A97F2B; --gold-light:#C49A43; --gold-soft:rgba(196,154,67,.14);
  --violet:#6D4BD6; --sky:#1E7FBF; --rose:#C3475A; --amber:#B8781C;
  --ok:#1E7A4D; --warn:#8A5A08; --danger:#BA514F; --info:#2A5F78;
  --shadow:0 10px 30px rgba(17,48,37,.08); --shadow-lg:0 22px 60px rgba(14,47,35,.14);
  --map-marker:#00684B;
}

*{box-sizing:border-box}
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;min-block-size:100dvh;background:var(--bg-0);color:var(--ink);font:400 16px/1.65 var(--font);-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(80% 50% at 50% -10%,var(--teal-soft) 0,transparent 60%)}
button,input,textarea,select{font:inherit;color:inherit}
button,a,label,summary{touch-action:manipulation}
a{color:var(--teal);text-decoration:none}
a:hover{text-decoration:none}
img{max-inline-size:100%;display:block}
h1,h2,h3,h4,p{margin-block-start:0}
h1,h2,h3,h4{line-height:1.4;font-weight:700;overflow-wrap:normal}
h1{font-size:clamp(24px,3.4vw,34px)} h2{font-size:clamp(19px,2.4vw,24px)} h3{font-size:17px;font-weight:600} h4{font-size:15px;font-weight:600}
p{margin-block-end:.8em}
.muted{color:var(--muted)} .faint{color:var(--faint)} .gold{color:var(--gold)} .teal{color:var(--teal)}
.ltr{direction:ltr;unicode-bidi:isolate} .num{direction:ltr;unicode-bidi:isolate;font-variant-numeric:tabular-nums}
.sr-only{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:fixed;inset-block-start:8px;inset-inline-start:8px;z-index:1000;transform:translateY(-160%);padding:10px 14px;background:var(--teal);color:var(--on-accent);border-radius:8px;font-weight:600}
.skip-link:focus{transform:none}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important;scroll-behavior:auto !important}}

/* ── القشرة ── */
/* 🪤 أبناء الشبكات min-width:auto افتراضيًّا؛ أي متمرِّر أفقي داخلها يوسّع الصفحة كلها (درس مُدار/حِس) */
.shell>*,.main>*,.screen>*,.stack>*,.card__body>*,.grid-cards>*,.list-item>*{min-inline-size:0}
.shell{min-block-size:100dvh;display:grid;grid-template-rows:auto 1fr auto;inline-size:100%;max-inline-size:100vw;overflow-x:clip}
.screen{min-inline-size:0;max-inline-size:100%;animation:fade var(--dur-slow) var(--ease)}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.header{position:sticky;inset-block-start:0;z-index:40;display:flex;align-items:center;gap:10px;min-block-size:var(--header-h);padding:10px 16px;min-inline-size:0;background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-block-end:1px solid var(--border)}
.header__brand{display:inline-flex;align-items:center;gap:10px;min-inline-size:0;color:var(--ink)}
.header__brand img{inline-size:38px;block-size:38px;filter:drop-shadow(0 0 10px var(--teal-glow))}
.header__brand b{font-size:17px;white-space:nowrap}
.header__search{flex:1;min-inline-size:0;display:flex;align-items:center;gap:10px;min-block-size:46px;padding:0 16px;border-radius:var(--pill);border:1px solid var(--border);background:var(--surface);position:relative}
.header__search input{flex:1;min-inline-size:0;border:0;background:transparent;outline:none;font-size:15px}
.header__search .icon{color:var(--teal)}
.header__actions{display:flex;gap:6px;align-items:center}
.header__actions .btn--icon{border:1px solid var(--border);background:var(--surface)}
.main{inline-size:100%;max-inline-size:var(--content-max);margin-inline:auto;padding:16px 16px calc(var(--nav-h) + 28px + env(safe-area-inset-bottom))}
.bottom-nav{position:fixed;inset-inline:0;inset-block-end:0;z-index:40;display:grid;grid-template-columns:repeat(5,1fr);min-block-size:calc(var(--nav-h) + env(safe-area-inset-bottom));padding-block-end:env(safe-area-inset-bottom);background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-block-start:1px solid var(--border)}
.bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-block-size:var(--nav-h);font-size:11.5px;font-weight:600;color:var(--faint);position:relative}
.bottom-nav a .icon{inline-size:24px;block-size:24px}
.bottom-nav a[aria-current="page"]{color:var(--teal)}
.bottom-nav a[aria-current="page"]::before{content:"";position:absolute;inset-block-start:8px;inline-size:34px;block-size:3px;border-radius:2px;background:var(--teal);box-shadow:0 0 12px var(--teal-glow)}
.powered{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 14px;padding:18px 16px calc(var(--nav-h) + 18px);color:var(--faint);font-size:12.5px}
.powered img{inline-size:20px;block-size:20px;opacity:.75}
@media (min-width:1024px){
  .shell{grid-template-columns:var(--rail-w) 1fr}
  .header{grid-column:1/-1}
  .bottom-nav{position:sticky;inset-block-start:var(--header-h);inset-block-end:auto;grid-row:2;grid-column:1;align-self:start;display:flex;flex-direction:column;gap:6px;padding:16px 10px;min-block-size:0;border:0;border-inline-end:1px solid var(--border);background:transparent;backdrop-filter:none;block-size:calc(100dvh - var(--header-h))}
  .bottom-nav a{min-block-size:66px;border-radius:16px;font-size:11px}
  .bottom-nav a[aria-current="page"]{background:var(--teal-soft)}
  .bottom-nav a[aria-current="page"]::before{display:none}
  .main{grid-column:2;padding:24px 32px 48px}
  .powered{grid-column:1/-1;padding-block-end:18px}
}

/* ── الأزرار ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-block-size:var(--tap);padding:0 18px;border-radius:14px;border:1px solid var(--border-strong);background:var(--surface-2);color:var(--ink);font-weight:600;cursor:pointer;white-space:nowrap;transition:transform var(--dur) var(--ease),background var(--dur) var(--ease),border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.btn:hover{background:var(--bg-3);text-decoration:none}
.btn:active{transform:translateY(1px) scale(.99)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn--primary{background:var(--teal);border-color:var(--teal);color:var(--on-accent);box-shadow:0 8px 24px var(--teal-glow)}
.btn--primary:hover{background:var(--teal-deep);border-color:var(--teal-deep);color:var(--on-accent)}
.btn--ghost{background:transparent;border-color:transparent}
.btn--ghost:hover{background:var(--teal-soft)}
.btn--gold{border-color:var(--gold);color:var(--gold);background:var(--gold-soft)}
.btn--danger{border-color:rgba(240,139,134,.4);color:var(--danger);background:transparent}
.btn--sm{min-block-size:38px;padding:0 12px;font-size:14px;border-radius:11px}
.btn--lg{min-block-size:54px;padding:0 26px;font-size:17px;border-radius:16px}
.btn--icon{inline-size:var(--tap);padding:0;border-radius:50%}
.btn--block{inline-size:100%}
.btn--glass{background:rgba(6,25,19,.55);border-color:rgba(255,255,255,.14);color:#fff;backdrop-filter:blur(10px)}
.btn--fab{position:fixed;inset-inline-end:16px;inset-block-end:calc(var(--nav-h) + 16px + env(safe-area-inset-bottom));z-index:35;box-shadow:var(--shadow-lg)}
@media (min-width:1024px){.btn--fab{inset-block-end:24px}}

/* ── الأيقونات ── */
.icon{inline-size:20px;block-size:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.icon--sm{inline-size:16px;block-size:16px} .icon--lg{inline-size:28px;block-size:28px}
.icon--fill{fill:currentColor;stroke:none}
.bubble-icon{inline-size:46px;block-size:46px;border-radius:14px;display:grid;place-items:center;background:var(--teal-soft);color:var(--teal);flex:0 0 auto}
.bubble-icon .icon{inline-size:24px;block-size:24px}
.bubble-icon--gold{background:var(--gold-soft);color:var(--gold)} .bubble-icon--violet{background:rgba(183,155,255,.16);color:var(--violet)} .bubble-icon--sky{background:rgba(127,196,242,.16);color:var(--sky)} .bubble-icon--rose{background:rgba(242,154,166,.16);color:var(--rose)} .bubble-icon--amber{background:rgba(242,192,108,.16);color:var(--amber)}
.bubble-icon--glow{background:linear-gradient(135deg,var(--teal) 0%,var(--teal-deep) 100%);color:var(--on-accent);border-radius:50%;box-shadow:0 0 22px var(--teal-glow)}

/* ── الرقائق والشارات ── */
.chip{display:inline-flex;align-items:center;gap:6px;min-block-size:36px;padding:0 14px;border-radius:var(--pill);font-size:13.5px;font-weight:600;border:1px solid var(--border);background:var(--surface);color:var(--muted);white-space:nowrap;cursor:pointer;transition:background var(--dur) var(--ease),color var(--dur) var(--ease)}
.chip[aria-pressed="true"],.chip--on{background:var(--teal);border-color:var(--teal);color:var(--on-accent)}
.chip--gold{color:var(--gold);border-color:rgba(224,185,98,.45);background:var(--gold-soft);cursor:default}
.chip--soft{background:var(--teal-soft);border-color:transparent;color:var(--teal);cursor:default}
.chip--static{cursor:default}
.chip--glass{background:rgba(6,25,19,.55);border-color:rgba(255,255,255,.14);color:#fff;backdrop-filter:blur(8px);cursor:default}
.chips{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.chips::-webkit-scrollbar{display:none}
.chips--wrap{flex-wrap:wrap;overflow:visible}
.badge{display:inline-grid;place-items:center;min-inline-size:18px;block-size:18px;padding:0 5px;border-radius:var(--pill);background:var(--gold);color:var(--on-accent);font-size:11px;font-weight:700;position:absolute;inset-inline-end:2px;inset-block-start:2px}
.badge:empty{display:none}
.tag-src{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--faint)}
.rating{display:inline-flex;align-items:center;gap:4px;color:var(--gold);font-weight:700;font-size:13px;font-variant-numeric:tabular-nums}
.rating .icon{inline-size:14px;block-size:14px;fill:currentColor;stroke:none}

/* ── البطاقات ── */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.card--flat{box-shadow:none}
.card__body{padding:16px 18px}
.card__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px 0}
.cover{position:relative;aspect-ratio:4/3;background:var(--bg-2) center/cover no-repeat;overflow:hidden}
.cover img{inline-size:100%;block-size:100%;object-fit:cover;transition:transform var(--dur-slow) var(--ease)}
.cover--sq{aspect-ratio:1} .cover--wide{aspect-ratio:16/9} .cover--tall{aspect-ratio:3/4}
.cover__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,25,19,0) 30%,rgba(6,25,19,.55) 65%,rgba(6,25,19,.92) 100%)}
.cover__title{position:absolute;inset-inline:14px;inset-block-end:12px;color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.45)}
.cover__title b{display:block;font-size:18px;line-height:1.4}
.cover__title span{font-size:12.5px;opacity:.9}
.cover__chip{position:absolute;inset-inline-start:10px;inset-block-start:10px}
.cover__fav{position:absolute;inset-inline-end:10px;inset-block-start:10px;background:rgba(6,25,19,.5);border-color:rgba(255,255,255,.18);color:#fff;backdrop-filter:blur(8px)}
.cover__fav[aria-pressed="true"]{color:#F29AA6;background:rgba(6,25,19,.7)}
.cover--placeholder{display:grid;place-items:center;color:var(--faint);background:linear-gradient(135deg,var(--bg-2),var(--bg-3))}
.cover--placeholder .icon{inline-size:40px;block-size:40px;opacity:.4}
.cover--city img{opacity:.55;filter:saturate(.7)}
.cover__icon{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);inline-size:52px;block-size:52px;border-radius:50%;display:grid;place-items:center;background:rgba(6,25,19,.62);color:var(--teal);border:1px solid rgba(101,201,164,.45);backdrop-filter:blur(6px);box-shadow:0 0 18px var(--teal-glow)}
.cover__icon .icon{inline-size:24px;block-size:24px}
.hero--city img{opacity:.5;filter:saturate(.75)}
.thumb--city{position:relative}
.thumb--city img{opacity:.5;filter:saturate(.7)}
.thumb__icon{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:var(--teal);display:grid;place-items:center;inline-size:34px;block-size:34px;border-radius:50%;background:rgba(6,25,19,.6);border:1px solid rgba(101,201,164,.4)}
.place-card{display:grid;grid-template-rows:auto 1fr;color:inherit;transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.place-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.place-card:hover .cover img{transform:scale(1.05)}
.place-card .card__body{padding:12px 14px 14px;display:grid;gap:4px}
.place-card .title{font-weight:700;line-height:1.5}
.place-card .sub{font-size:13px;color:var(--muted);line-height:1.6}
.place-card--tile .card__body{display:none}
.place-card--tile .cover{aspect-ratio:1}
.grid-cards{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.grid-cards--sm{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.grid-cards--2{grid-template-columns:repeat(2,1fr)}
@media (max-width:640px){.grid-cards{grid-template-columns:repeat(2,1fr);gap:12px}}
.scroller{display:flex;gap:12px;overflow-x:auto;padding:4px 2px 14px;scroll-snap-type:x mandatory;scrollbar-width:none}
.scroller::-webkit-scrollbar{display:none}
.scroller>*{flex:0 0 min(72vw,280px);scroll-snap-align:start}
.scroller--sm>*{flex-basis:min(56vw,210px)}

/* ── الهيرو (دوّار) ── */
.hero{position:relative;border-radius:var(--radius-l);overflow:hidden;min-block-size:260px;background:var(--bg-2);color:#fff;isolation:isolate;box-shadow:var(--shadow-lg)}
.hero img{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;animation:kenburns 14s ease-in-out infinite alternate}
@keyframes kenburns{from{transform:scale(1.02)}to{transform:scale(1.1)}}
.hero__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,25,19,.08) 0%,rgba(6,25,19,.35) 45%,rgba(6,25,19,.9) 100%)}
.hero__body{position:relative;padding:22px 20px;display:grid;gap:8px;align-content:end;min-block-size:260px}
.hero__body h1,.hero__body h2{color:#fff;margin:0;text-shadow:0 2px 14px rgba(0,0,0,.4)}
.hero__body .muted{color:rgba(255,255,255,.86)}
.hero__eyebrow{color:var(--gold-light);font-weight:600;font-size:13px}
.hero__cta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-block-start:6px}
.hero__dots{display:flex;gap:6px}
.hero__dots span{inline-size:8px;block-size:8px;border-radius:4px;background:rgba(255,255,255,.4);transition:inline-size var(--dur) var(--ease),background var(--dur) var(--ease)}
.hero__dots span.on{inline-size:22px;background:var(--teal)}
.hero__slide{position:absolute;inset:0;opacity:0;transition:opacity 700ms ease}
.hero__slide.on{opacity:1}
.hero--full{border-radius:0;margin:-16px -16px 0;min-block-size:340px}
.hero--full .hero__body{min-block-size:340px;padding-block-end:26px}
.hero__topbar{position:absolute;inset-inline:14px;inset-block-start:14px;display:flex;justify-content:space-between;z-index:2}
.hero__topbar .row{gap:8px}
@media (min-width:768px){.hero{min-block-size:360px}.hero__body{min-block-size:360px;padding:30px}.hero--full{border-radius:var(--radius-l);margin:0}}

/* ── بلاطات الخدمات ── */
.tiles{display:grid;gap:12px;grid-template-columns:repeat(3,1fr)}
.tile{display:grid;gap:10px;justify-items:center;text-align:center;padding:18px 10px 16px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--ink);min-block-size:118px;transition:transform var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.tile:hover{transform:translateY(-2px);border-color:var(--border-strong)}
.tile b{font-size:14px;line-height:1.4}
.tile span{font-size:12px;color:var(--muted);line-height:1.5}
@media (min-width:768px){.tiles{grid-template-columns:repeat(6,1fr)}}

/* ── الشرائط (banner) ── */
.banner{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--ink);min-inline-size:0}
.banner .grow{flex:1;min-inline-size:0}
.banner b{display:block;line-height:1.5}
.banner span{display:block;font-size:13px;color:var(--muted);line-height:1.6}
.banner--teal{background:linear-gradient(135deg,rgba(101,201,164,.18) 0%,rgba(66,173,135,.06) 100%);border-color:rgba(101,201,164,.35)}
.banner--gold{background:linear-gradient(135deg,rgba(224,185,98,.16) 0%,rgba(224,185,98,.04) 100%);border-color:rgba(224,185,98,.35)}
.banner--cta{background:linear-gradient(135deg,var(--teal-deep) 0%,#0D4535 100%);border-color:transparent;color:#fff;min-block-size:96px}
.banner--cta span{color:rgba(255,255,255,.82)}
.banner--cta .bubble-icon{background:rgba(255,255,255,.14);color:var(--gold-light);border-radius:50%;box-shadow:inset 0 0 0 1px rgba(224,185,98,.6)}

/* ── الفعاليات ── */
.event-card{position:relative;display:grid;grid-template-rows:auto auto;border-radius:var(--radius);overflow:hidden;background:var(--surface);border:1px solid var(--border);color:inherit}
.event-card .cover{aspect-ratio:16/10}
.event-card__date{position:absolute;inset-inline-start:10px;inset-block-start:10px;display:grid;place-items:center;padding:6px 10px;border-radius:12px;background:rgba(6,25,19,.72);color:#fff;backdrop-filter:blur(8px);line-height:1.2;text-align:center}
.event-card__date b{font-size:18px;font-variant-numeric:tabular-nums}
.event-card__date span{font-size:11px;color:var(--gold-light)}
.event-card .card__body{padding:12px 14px}
.event-card .title{font-weight:700;line-height:1.5}
.event-card .sub{font-size:12.5px;color:var(--muted)}

/* ── القوائم ── */
.section{margin-block:22px 10px}
.section-title{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-block:24px 12px}
.section-title h2{margin:0;display:flex;align-items:center;gap:10px}
.section-title h2 .icon{color:var(--teal)}
.section-title .sub{display:block;font-size:13.5px;color:var(--muted);font-weight:400;margin-block-start:2px}
.section-title a{color:var(--teal);font-weight:600;font-size:14px}
.list{display:grid;gap:10px}
.list-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;border:1px solid var(--border);background:var(--surface);min-inline-size:0;color:inherit;transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.list-item:hover{border-color:var(--border-strong);transform:translateY(-1px)}
.list-item .thumb{inline-size:72px;block-size:72px;border-radius:14px;background:var(--bg-2) center/cover;overflow:hidden;display:grid;place-items:center;color:var(--faint)}
.list-item .thumb img{inline-size:100%;block-size:100%;object-fit:cover}
.list-item .grow{min-inline-size:0}
.list-item .title{font-weight:700;line-height:1.5}
.list-item .sub{font-size:13.5px;color:var(--muted);line-height:1.6}
.list-item .kicker{font-size:12px;color:var(--teal);font-weight:600}
.ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.empty{padding:34px 18px;text-align:center;color:var(--muted);border:1px dashed var(--border-strong);border-radius:var(--radius);display:grid;gap:8px;justify-items:center}
.empty strong{color:var(--ink)}
.stack{display:grid;gap:12px}
.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.row--between{justify-content:space-between}
.kpis{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.kpi{padding:16px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);display:grid;gap:2px}
.kpi__label{font-size:12.5px;color:var(--muted)}
.kpi__value{font-size:30px;font-weight:700;line-height:1.3;font-variant-numeric:tabular-nums}
.kpi__sub{font-size:12px;color:var(--faint)}
.split{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;padding:18px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface)}
.split__divider{inline-size:1px;align-self:stretch;background:var(--border)}
.divider{border:0;border-block-start:1px solid var(--border);margin-block:18px}
.note{padding:12px 14px;border-radius:14px;background:var(--surface-2);border:1px solid var(--border);color:var(--muted);font-size:14px;line-height:1.7}
.note--gold{background:var(--gold-soft);border-color:rgba(224,185,98,.4);color:var(--ink)}
.note--warn{border-color:var(--warn)}
.steps{display:flex;gap:6px;align-items:center;margin-block-end:14px}
.steps span{flex:1;block-size:6px;border-radius:3px;background:var(--bg-3)}
.steps span.on{background:var(--teal);box-shadow:0 0 10px var(--teal-glow)}

/* ── النماذج ── */
.field{display:grid;gap:6px}
.field>span{font-size:13.5px;color:var(--muted);font-weight:500}
.input,select.input,textarea.input{min-block-size:var(--tap);padding:10px 14px;border-radius:14px;border:1px solid var(--border-strong);background:var(--bg-1);color:var(--ink);inline-size:100%}
textarea.input{min-block-size:96px;resize:vertical}
.input:focus{border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-soft)}
.input--code{font-size:28px;letter-spacing:0;text-align:center;font-variant-numeric:tabular-nums;direction:ltr}
.form-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.form-grid .field--full{grid-column:1/-1}
.choice-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.choice{display:grid;gap:4px;padding:14px;border-radius:16px;border:1px solid var(--border);background:var(--surface);cursor:pointer;text-align:start;min-block-size:var(--tap);color:var(--ink);transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease)}
.choice b{font-weight:600}
.choice span{font-size:13px;color:var(--muted)}
.choice[aria-pressed="true"]{border-color:var(--teal);background:var(--teal-soft);box-shadow:0 0 0 1px var(--teal)}
.choice--img{padding:0;overflow:hidden}
.choice--img .cover{aspect-ratio:16/9}
.choice--img b{padding:10px 12px 12px;display:block}
.switch{display:flex;align-items:center;justify-content:space-between;gap:12px;min-block-size:var(--tap);padding:10px 14px;border-radius:14px;border:1px solid var(--border);background:var(--surface);cursor:pointer}
.switch input{inline-size:22px;block-size:22px;accent-color:var(--teal)}
.stars{display:inline-flex;gap:4px}
.stars button{background:none;border:0;padding:4px;cursor:pointer;color:var(--border-strong)}
.stars button[aria-pressed="true"]{color:var(--gold)}
.stars .icon{inline-size:28px;block-size:28px}

/* ── التبويبات ── */
.tabs{display:flex;gap:6px;overflow-x:auto;padding:4px;border-radius:16px;border:1px solid var(--border);background:var(--surface);scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;min-block-size:40px;padding:0 14px;border-radius:12px;border:0;background:transparent;color:var(--muted);font-weight:600;cursor:pointer;white-space:nowrap}
.tab[aria-selected="true"]{background:var(--teal-soft);color:var(--teal)}

/* ── التنبيهات والأوراق ── */
.toast{position:fixed;inset-block-end:calc(var(--nav-h) + 16px + env(safe-area-inset-bottom));inset-inline-start:50%;transform:translateX(-50%);z-index:2000;padding:12px 18px;border-radius:14px;background:var(--bg-3);border:1px solid var(--border-strong);color:var(--ink);box-shadow:var(--shadow);max-inline-size:min(92vw,520px);font-weight:500}
[dir="rtl"] .toast{transform:translateX(50%)}
.toast.ok{border-color:var(--ok)} .toast.err{border-color:var(--danger)}
@media (min-width:1024px){.toast{inset-block-end:24px}}
.sheet{position:fixed;inset:0;z-index:1500;display:grid;place-items:end center;background:rgba(3,12,9,.62);backdrop-filter:blur(8px)}
.sheet__panel{inline-size:min(100%,680px);max-block-size:92dvh;overflow:auto;background:var(--bg-1);border:1px solid var(--border-strong);border-radius:24px 24px 0 0;padding:18px 18px calc(28px + env(safe-area-inset-bottom));animation:rise var(--dur) var(--ease)}
@media (min-width:768px){.sheet{place-items:center;padding:24px}.sheet__panel{border-radius:var(--radius-l)}}
@keyframes rise{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
.sheet__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-block-end:12px}
.update-bar{position:fixed;inset-inline:12px;inset-block-start:calc(var(--header-h) + 8px);z-index:900;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-radius:14px;background:var(--bg-3);border:1px solid var(--border-strong);box-shadow:var(--shadow)}
.network-banner{position:sticky;inset-block-start:var(--header-h);z-index:30;padding:8px 14px;text-align:center;background:var(--warn);color:#06120E;font-size:13.5px;font-weight:600}

/* ── الهياكل أثناء التحميل ── */
.skeleton{position:relative;overflow:hidden;background:var(--bg-2);border-radius:14px;min-block-size:16px}
.skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent);animation:shimmer 1.4s infinite}
:root[data-theme="light"] .skeleton::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent)}
@keyframes shimmer{to{transform:translateX(100%)}}
.skeleton--card{aspect-ratio:4/3;border-radius:var(--radius)}
.skeleton--line{block-size:14px;inline-size:60%}

/* ── الخريطة ── */
.map-wrap{position:relative;border-radius:var(--radius-l);overflow:hidden;border:1px solid var(--border);background:var(--bg-2);min-block-size:min(70dvh,640px);isolation:isolate}
.map-wrap--full{block-size:calc(100dvh - var(--header-h) - var(--nav-h) - 88px);min-block-size:360px}
@media (min-width:1024px){.map-wrap--full{block-size:calc(100dvh - var(--header-h) - 130px)}}
.map-wrap .map-canvas{position:absolute !important;inset:0;inline-size:100%;block-size:100%}
.map-state{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:24px;background:var(--bg-2);z-index:5}
.map-state__box{display:grid;gap:10px;justify-items:center;max-inline-size:360px}
.map-state .spinner{inline-size:34px;block-size:34px;border-radius:50%;border:3px solid var(--border-strong);border-block-start-color:var(--teal);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.map-controls{position:absolute;inset-inline-end:10px;inset-block-start:10px;z-index:6;display:grid;gap:8px}
.map-controls .btn{background:var(--glass);backdrop-filter:blur(8px);border-color:var(--border)}
.map-filters{position:absolute;inset-inline:10px;inset-block-start:10px;z-index:6;inline-size:calc(100% - 76px)}
.map-card{position:absolute;inset-inline:10px;inset-block-end:10px;z-index:6}
.map-marker{position:absolute;left:0;top:0;transform:translate(-50%,-100%);inline-size:34px;block-size:42px;cursor:pointer;line-height:1.5;background:none;border:0;padding:0}
.map-marker svg{inline-size:34px;block-size:42px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.45))}
.map-marker--me{transform:translate(-50%,-50%);inline-size:22px;block-size:22px}
.map-marker--me span{display:block;inline-size:16px;block-size:16px;margin:3px;border-radius:50%;background:#1B8FE8;border:3px solid #fff;box-shadow:0 0 0 6px rgba(27,143,232,.25)}
.maplibregl-ctrl-attrib{font:11px/1.4 var(--font) !important;background:var(--glass) !important;color:var(--muted) !important}
.maplibregl-ctrl-attrib a{color:var(--muted) !important}
.maplibregl-popup-content{font-family:var(--font) !important;border-radius:14px !important;background:var(--bg-1) !important;color:var(--ink) !important;padding:10px 14px !important;box-shadow:var(--shadow) !important}
.maplibregl-popup-tip{border-top-color:var(--bg-1) !important}
.maplibregl-ctrl-group{background:var(--glass) !important;border:1px solid var(--border);border-radius:12px !important;box-shadow:var(--shadow) !important;backdrop-filter:blur(8px)}
.maplibregl-ctrl-group button{inline-size:38px !important;block-size:38px !important}
.maplibregl-ctrl-group button+button{border-top-color:var(--border) !important}
.maplibregl-ctrl button .maplibregl-ctrl-icon{filter:invert(.92)}
:root[data-theme="light"] .maplibregl-ctrl button .maplibregl-ctrl-icon{filter:none}

/* ── العارض ثلاثي الأبعاد (منصة هولوجرام) ── */
.viewer{position:relative;border-radius:var(--radius-l);overflow:hidden;background:#04110D;min-block-size:min(64dvh,600px);isolation:isolate;touch-action:none}
.viewer::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(rgba(101,201,164,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(101,201,164,.09) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.35) 45%,#000 100%);-webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.35) 45%,#000 100%)}
.viewer::after{content:"";position:absolute;inset-inline:18%;inset-block-end:8%;block-size:10%;z-index:0;pointer-events:none;border-radius:50%;background:radial-gradient(ellipse at center,rgba(101,201,164,.55) 0%,rgba(101,201,164,.18) 45%,transparent 72%);filter:blur(6px);animation:pulse 3.2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.7;transform:scaleX(1)}50%{opacity:1;transform:scaleX(1.06)}}
.viewer canvas{position:relative;z-index:1;display:block;inline-size:100%;block-size:100%}
.viewer__scan{position:absolute;inset:0;z-index:2;pointer-events:none;background:repeating-linear-gradient(180deg,rgba(101,201,164,.07) 0 1px,transparent 1px 4px),radial-gradient(70% 60% at 50% 45%,transparent 55%,rgba(4,17,13,.55) 100%);mix-blend-mode:screen;animation:scan 9s linear infinite}
@keyframes scan{from{background-position:0 0,0 0}to{background-position:0 40px,0 0}}
.viewer:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.viewer__ui{position:absolute;inset-inline:10px;inset-block-end:12px;z-index:6;display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.viewer__ui .btn{background:rgba(6,25,19,.7);border-color:rgba(101,201,164,.35);color:#fff;backdrop-filter:blur(8px)}
.viewer__hint{position:absolute;inset-inline:10px;inset-block-start:12px;z-index:6;text-align:center;color:rgba(255,255,255,.85);font-size:12.5px;pointer-events:none;display:flex;justify-content:center;gap:8px;align-items:center}
.viewer__live{position:absolute;inset-inline-end:12px;inset-block-start:12px;z-index:6;display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:rgba(6,25,19,.7);border:1px solid rgba(101,201,164,.35);color:var(--teal);font-size:11.5px;font-weight:600}
.viewer__live i{inline-size:7px;block-size:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 8px var(--teal);animation:pulse 1.8s ease-in-out infinite}
.viewer__hint{inset-block-start:auto;inset-block-end:70px;inset-inline-start:12px;inset-inline-end:12px;justify-content:center;max-inline-size:none}
.viewer__hint::before{content:"";inline-size:8px;block-size:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 10px var(--teal)}
.hotspot{position:absolute;left:0;top:0;transform:translate(-50%,-50%);inline-size:32px;block-size:32px;border-radius:50%;border:2px solid var(--gold-light);background:rgba(6,25,19,.62);color:var(--gold-light);display:grid;place-items:center;font-weight:700;font-size:13px;cursor:pointer;z-index:7;box-shadow:0 0 0 7px rgba(224,185,98,.16),0 0 18px rgba(224,185,98,.4);line-height:1.5;animation:ping 2.6s ease-out infinite}
@keyframes ping{0%{box-shadow:0 0 0 4px rgba(224,185,98,.28),0 0 18px rgba(224,185,98,.4)}70%{box-shadow:0 0 0 14px rgba(224,185,98,0),0 0 18px rgba(224,185,98,.4)}100%{box-shadow:0 0 0 4px rgba(224,185,98,0),0 0 18px rgba(224,185,98,.4)}}
.hotspot[aria-expanded="true"]{background:var(--gold);color:#06120E;animation:none}
.viewer__fallback{position:absolute;inset:0;display:grid;place-items:center;padding:20px;text-align:center;color:#fff;background:rgba(4,17,13,.9);z-index:9}
.holo-story{border:1px solid rgba(101,201,164,.3);background:linear-gradient(180deg,rgba(101,201,164,.08),transparent)}

/* ── المساعد ── */
.chat{display:grid;gap:10px;padding:8px 0 96px}
.bubble{max-inline-size:min(88%,640px);padding:12px 16px;border-radius:20px;line-height:1.75;white-space:pre-wrap;overflow-wrap:break-word}
.bubble--user{justify-self:start;background:var(--teal);color:var(--on-accent);border-end-start-radius:6px}
.bubble--bot{justify-self:end;background:var(--surface);border:1px solid var(--border);border-end-end-radius:6px}
[dir="ltr"] .bubble--user{justify-self:end;border-radius:20px;border-end-end-radius:6px}
[dir="ltr"] .bubble--bot{justify-self:start;border-radius:20px;border-end-start-radius:6px}
.bubble .actions{display:flex;gap:8px;flex-wrap:wrap;margin-block-start:8px}
.bubble--typing span{display:inline-block;inline-size:8px;block-size:8px;margin-inline-end:4px;border-radius:50%;background:var(--faint);animation:blink 1.2s infinite}
.bubble--typing span:nth-child(2){animation-delay:.2s}.bubble--typing span:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,80%,100%{opacity:.3}40%{opacity:1}}
.composer{position:fixed;inset-inline:0;inset-block-end:calc(var(--nav-h) + env(safe-area-inset-bottom));z-index:36;padding:10px 14px;background:var(--glass);backdrop-filter:blur(16px);border-block-start:1px solid var(--border)}
.composer form{display:flex;gap:8px;max-inline-size:var(--content-max);margin-inline:auto}
.composer .input{flex:1;border-radius:var(--pill)}
@media (min-width:1024px){.composer{inset-inline-start:var(--rail-w);inset-block-end:0}}
.assistant-head{display:flex;align-items:center;gap:14px}
.assistant-head .avatar{inline-size:56px;block-size:56px;font-size:22px}

/* ── المخطط والمرشد ── */
.day{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);overflow:hidden}
.day__head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;background:var(--surface-2);font-weight:700}
.stop{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 16px;border-block-start:1px solid var(--border);color:inherit}
.stop__n{inline-size:32px;block-size:32px;border-radius:50%;display:grid;place-items:center;background:var(--teal-soft);color:var(--teal);font-weight:700;font-variant-numeric:tabular-nums}
.stop__n--done{background:var(--ok);color:#06120E}
.stop .title{font-weight:700;line-height:1.5;color:var(--ink)}
.stop .sub{font-size:13px;color:var(--muted);line-height:1.6}
.stop--next{background:var(--teal-soft)}
.eta{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:6px;padding:6px 16px 0;border-block-start:1px dashed var(--border)}
.eta .chip{min-block-size:24px;font-size:11.5px;padding:0 8px}
.progress{block-size:8px;border-radius:4px;background:rgba(255,255,255,.18);overflow:hidden}
.progress span{display:block;block-size:100%;background:var(--gold-light);border-radius:4px;transition:inline-size var(--dur-slow) var(--ease)}
.guide-hero{display:grid;gap:10px;padding:20px;border-radius:var(--radius-l);background:linear-gradient(135deg,var(--teal-deep) 0%,#0D4535 100%);color:#fff;box-shadow:var(--shadow-lg)}
.guide-hero .big{font-size:30px;font-weight:700;line-height:1.3;font-variant-numeric:tabular-nums}
.guide-hero .muted{color:rgba(255,255,255,.85)}

/* ── الترحيب ── */
.welcome{min-block-size:calc(100dvh - var(--header-h) - 80px);display:grid;align-content:center;gap:18px;text-align:center;padding:12px 6px}
.welcome>img{inline-size:min(46vw,200px);margin-inline:auto;filter:drop-shadow(0 0 30px var(--teal-glow))}
.welcome h1{font-size:clamp(30px,6vw,46px);margin:0}
.welcome .lede{font-size:17px;color:var(--muted);max-inline-size:460px;margin-inline:auto}
.interest-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}

/* ── الحساب ── */
.avatar{inline-size:64px;block-size:64px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--teal) 0%,var(--teal-deep) 100%);color:var(--on-accent);font-weight:700;font-size:24px;box-shadow:0 0 20px var(--teal-glow)}
.level{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:var(--pill);border:1px solid var(--gold);color:var(--gold);background:var(--gold-soft);font-weight:600}
.menu{display:grid;gap:8px}
.menu a,.menu button{display:flex;align-items:center;gap:12px;min-block-size:54px;padding:0 14px;border-radius:16px;border:1px solid var(--border);background:var(--surface);color:var(--ink);text-align:start;cursor:pointer}
.menu a:hover,.menu button:hover{border-color:var(--border-strong)}
.menu .grow{flex:1;min-inline-size:0}
.menu .sub{display:block;font-size:13px;color:var(--muted)}

/* ── أدوات بلا inline (CSP) ── */
.main--narrow{max-inline-size:840px}
.mt-14{margin-block-start:14px}
.mt-18{margin-block-start:18px}
.offline-box{margin-block-start:15vh}

/* ── الطباعة ── */
@media print{.header,.bottom-nav,.composer,.btn--fab,.powered{display:none !important}.main{padding:0}}