/* ==========================================================================
   الأقصى — رحلة في المكان · الهوية البصرية
   حبر زمردي لليل الساحات، ذهب القبة للتمييز، وحجر مقدسي للنص.
   الخطوط: IBM Plex Sans Arabic للواجهة، والأميري للعناوين الكبرى.
   ========================================================================== */

/* ---------- الخطوط (مستضافة ذاتيًا · رخصة OFL في assets/fonts) ---------- */
@font-face{font-family:Aqsa;src:url('/assets/fonts/plex-arabic-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:Aqsa;src:url('/assets/fonts/plex-arabic-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:Aqsa;src:url('/assets/fonts/plex-arabic-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:Aqsa;src:url('/assets/fonts/plex-arabic-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:Aqsa;src:url('/assets/fonts/plex-latin-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Aqsa;src:url('/assets/fonts/plex-latin-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Aqsa;src:url('/assets/fonts/plex-latin-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Aqsa;src:url('/assets/fonts/plex-latin-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Aqsa Display';src:url('/assets/fonts/amiri-arabic-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Aqsa Display';src:url('/assets/fonts/amiri-latin-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- الرموز التصميمية ---------- */
:root{
 color-scheme:dark;
 /* الحبر: ليل الساحات */
 --ink-950:#081c17;--ink-900:#0c251f;--ink-850:#0f2d26;--ink-800:#143a31;--ink-700:#1b463b;--ink-600:#25574a;--ink-500:#2f6a5a;
 /* الذهب: قبة الصخرة */
 --gold-100:#f8ecce;--gold-200:#f2dfae;--gold-300:#ecd296;--gold-400:#dfbe78;--gold-500:#c9a45e;--gold-600:#a7843f;
 /* الحجر المقدسي: النص */
 --stone-50:#f7f1e3;--stone-100:#ece4d1;--stone-200:#d8d0bb;--stone-300:#bdb8a4;--stone-400:#a3ab98;
 /* القاشاني الفيروزي: الصوت والتسجيلات */
 --tile-300:#8fd3c9;--tile-400:#6cc3b8;--tile-500:#3f9f94;
 --warn:#e7b35f;

 --text:var(--stone-50);--text-2:var(--stone-200);--text-3:var(--stone-400);
 --accent:var(--gold-400);--accent-strong:var(--gold-300);--on-accent:#10261f;
 --surface:rgb(16 46 39 / .86);--surface-solid:var(--ink-850);
 --surface-raised:rgb(255 255 255 / .045);--surface-hover:rgb(255 255 255 / .08);
 --line:rgb(236 222 186 / .12);--line-2:rgb(236 222 186 / .22);--line-3:rgb(236 222 186 / .36);
 --focus:var(--gold-300);

 --font-ui:Aqsa,'IBM Plex Sans Arabic','Segoe UI',Tahoma,sans-serif;
 --font-display:'Aqsa Display',Amiri,'Aqsa',serif;

 --r-xs:6px;--r-sm:10px;--r-md:14px;--r-lg:20px;--r-pill:999px;
 --shadow-1:0 4px 14px rgb(3 14 11 / .28);
 --shadow-2:0 16px 44px rgb(3 14 11 / .38);
 --shadow-3:0 28px 90px rgb(2 10 8 / .6);
 --hl:inset 0 1px 0 rgb(255 255 255 / .06);
 --ease:cubic-bezier(.2,.7,.2,1);--t1:140ms;--t2:220ms;--t3:360ms;

 --pattern:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23ecd296' stroke-width='1'%3E%3Cpath d='M16 16h24v24H16z'/%3E%3Cpath d='M28 11.03 44.97 28 28 44.97 11.03 28z'/%3E%3Cpath d='M28 0v11.03M28 44.97V56M0 28h11.03M44.97 28H56'/%3E%3C/g%3E%3C/svg%3E");
 --chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ecd296' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
 --search:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3ab98' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
 --octagon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Cpath d='M20.52 4.28H43.48L59.72 20.52V43.48L43.48 59.72H20.52L4.28 43.48V20.52Z' stroke='%23ecd296' stroke-opacity='.3' stroke-width='1.5'/%3E%3Cpath d='M20.52 4.28H43.48L59.72 20.52' stroke='%23f2dfae' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
 --i-sun:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4'/%3E%3C/svg%3E");
 --i-moon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 14.5A8 8 0 0 1 9.5 4a8 8 0 1 0 10.5 10.5Z'/%3E%3C/svg%3E");
 --i-play:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5.5v13l10.5-6.5z' fill='black'/%3E%3C/svg%3E");

 font-family:var(--font-ui);
}

/* ---------- الأساس ---------- */
*{box-sizing:border-box}
body{margin:0;background:var(--ink-900);color:var(--text);overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
button,select,input,a{font:inherit}
button{cursor:pointer;border:0;color:inherit}
button:disabled{cursor:not-allowed;opacity:.55}
button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button:focus-visible,select:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
a{color:var(--gold-300);text-underline-offset:3px}
a:hover{color:var(--gold-200)}
svg{width:20px;height:20px;stroke-width:1.7;flex-shrink:0}
option{background:var(--ink-800);color:var(--text)}
::selection{background:rgb(223 190 120 / .35);color:#fff}
#app{height:100dvh;min-height:430px;overflow:hidden;position:relative}
.hidden{display:none!important}

/* ---------- طبقات المشهد ---------- */
.viewport,.vignette,.markers{position:absolute;inset:0}
.viewport{direction:ltr}
.viewport canvas{display:block;width:100%;height:100%;touch-action:none;outline:none}
.vignette{pointer-events:none;background:
 linear-gradient(0deg,rgb(8 28 23 / .9) 0%,rgb(8 28 23 / .42) 13%,transparent 27%,transparent 78%,rgb(8 28 23 / .5) 100%),
 radial-gradient(130% 95% at 50% 45%,transparent 62%,rgb(6 20 17 / .32) 100%);transition:opacity var(--t3)}

/* ---------- الأسطح ---------- */
.glass{background:linear-gradient(180deg,rgb(22 60 51 / .9),rgb(12 38 32 / .93));border:1px solid var(--line);box-shadow:var(--shadow-2),var(--hl);backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15)}

/* ---------- الأزرار ---------- */
.primary,.secondary{min-height:44px;padding:10px 16px;border-radius:var(--r-sm);font-size:14px;font-weight:500;line-height:1.4;text-decoration:none;display:flex;align-items:center;justify-content:center;gap:8px;transition:background var(--t1),border-color var(--t1),color var(--t1),transform var(--t1),box-shadow var(--t2)}
.primary{background:linear-gradient(180deg,var(--gold-300),var(--gold-400));color:var(--on-accent);font-weight:600;box-shadow:0 8px 22px rgb(223 190 120 / .16),inset 0 1px 0 rgb(255 255 255 / .38)}
.primary:hover{background:linear-gradient(180deg,var(--gold-200),var(--gold-300));color:var(--on-accent)}
.primary:active{transform:translateY(1px);box-shadow:0 3px 10px rgb(223 190 120 / .14)}
.secondary{background:var(--surface-raised);color:var(--text);border:1px solid var(--line-2)}
.secondary:hover{background:var(--surface-hover);border-color:var(--line-3);color:var(--text)}
.secondary:active{transform:translateY(1px)}
.primary svg,.secondary svg{width:18px;height:18px}
.icon{width:44px;height:44px;border-radius:50%;color:var(--stone-100);background:var(--surface);border:1px solid var(--line-2);display:inline-grid;place-items:center;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow-1);transition:background var(--t1),border-color var(--t1),color var(--t1),transform var(--t1)}
.icon:hover{background:var(--ink-600);border-color:var(--line-3);color:var(--gold-200)}
.icon:active{transform:scale(.95)}

/* ---------- الشريط العلوي ---------- */
.topbar{position:absolute;top:0;inset-inline:0;height:96px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 30px;z-index:10;pointer-events:none}
.topbar>*{pointer-events:auto}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text);text-shadow:0 2px 14px rgb(6 22 18 / .75)}
.brand>span{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;color:var(--gold-300);background:radial-gradient(circle at 50% 35%,rgb(236 210 150 / .16),rgb(12 37 31 / .72) 70%);border:1px solid rgb(236 210 150 / .38);box-shadow:var(--shadow-1)}
.brand>span svg{width:30px;height:30px;stroke-width:1.35}
.brand strong{display:block;font-family:var(--font-display);font-size:34px;font-weight:700;line-height:1.15;color:var(--gold-200)}
.brand small{display:block;font-size:12.5px;font-weight:500;color:var(--stone-100);margin-top:2px}
.top-actions{display:flex;align-items:center;gap:8px}
.modes{display:flex;padding:4px;border-radius:var(--r-pill);gap:2px}
.modes button{background:transparent;color:var(--stone-200);border-radius:var(--r-pill);min-height:38px;padding:0 16px;display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;transition:background var(--t1),color var(--t1)}
.modes button:hover{color:var(--text);background:rgb(255 255 255 / .06)}
.modes button.active{background:var(--stone-50);color:var(--ink-800);box-shadow:0 2px 10px rgb(0 0 0 / .22)}
.modes svg{width:18px;height:18px}
.quality,.panel-foot select,.catalog-filters select{appearance:none;-webkit-appearance:none;background-image:var(--chevron);background-repeat:no-repeat;background-position:left 12px center;background-size:15px}
.quality{background-color:var(--surface);color:var(--text);border:1px solid var(--line-2);border-radius:var(--r-pill);font-size:14px;font-weight:500;min-height:44px;padding:0 16px 0 36px;max-width:170px;cursor:pointer;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow-1)}
.quality:hover{border-color:var(--line-3)}
.vr-entry{white-space:nowrap}
.top-actions>.vr-entry{border-radius:var(--r-pill);background:var(--surface);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:0 16px;box-shadow:var(--shadow-1);font-weight:500;direction:rtl}
.top-actions>.vr-entry:hover{background:var(--ink-600)}

/* النهار والليل */
.lighting-switch{display:flex;gap:2px;align-items:center;border:1px solid var(--line-2);background:var(--surface);border-radius:var(--r-pill);padding:4px;flex-shrink:0;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow-1)}
.lighting-switch button{min-width:52px;min-height:36px;font-size:14px;font-weight:500;color:var(--stone-200);background:transparent;border-radius:var(--r-pill);padding:0 12px;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:background var(--t1),color var(--t1)}
.lighting-switch button::before{content:'';width:15px;height:15px;background:currentColor;-webkit-mask:var(--i-sun) center/contain no-repeat;mask:var(--i-sun) center/contain no-repeat}
.lighting-switch button[data-lighting=night]::before{-webkit-mask-image:var(--i-moon);mask-image:var(--i-moon)}
.lighting-switch button:hover{color:var(--text);background:rgb(255 255 255 / .06)}
.lighting-switch button[aria-pressed=true]{background:var(--stone-50);color:var(--ink-800)}
[data-lighting=night] .vignette{opacity:.5}

/* ---------- دليل المعالم ---------- */
.panel{position:absolute;right:26px;top:112px;width:319px;max-height:calc(100dvh - 226px);z-index:8;display:flex;flex-direction:column;overflow-x:hidden;overflow-y:auto;border-radius:var(--r-lg);scrollbar-width:thin;scrollbar-color:rgb(236 222 186 / .2) transparent}
.panel-head{position:relative;padding:20px 22px 14px;flex-shrink:0}
.panel-head::after{content:'';position:absolute;inset:0;background:var(--pattern) 0 0/56px 56px;opacity:.07;pointer-events:none;-webkit-mask-image:linear-gradient(to left,#000,transparent 75%);mask-image:linear-gradient(to left,#000,transparent 75%)}
.eyebrow{display:flex;align-items:center;gap:8px;color:var(--gold-300);font-size:12.5px;font-weight:500;line-height:1.5;margin-bottom:6px}
.eyebrow::before{content:'';width:6px;height:6px;flex-shrink:0;background:var(--gold-400);transform:rotate(45deg);opacity:.85}
.panel-head h1{font-family:var(--font-display);font-size:30px;font-weight:700;line-height:1.3;margin:0;color:var(--text)}
.panel-head p{font-size:13.5px;line-height:1.8;color:var(--text-3);margin:6px 0 0}
.intro-open{margin:4px 18px 14px;flex-shrink:0}
.catalog-filters{padding:0 18px 12px;display:grid;gap:8px;flex-shrink:0}
.catalog-filters input,.catalog-filters select{width:100%;min-width:0;min-height:42px;background-color:rgb(255 255 255 / .05);color:var(--text);border:1px solid var(--line-2);border-radius:var(--r-sm);padding:0 12px;font:inherit;font-size:14px;transition:border-color var(--t1),background-color var(--t1)}
.catalog-filters select{padding-left:34px;cursor:pointer}
.catalog-filters input{background-image:var(--search);background-repeat:no-repeat;background-position:right 12px center;background-size:17px;padding-right:38px}
.catalog-filters input::placeholder{color:var(--text-3)}
.catalog-filters input:hover,.catalog-filters select:hover{border-color:var(--line-3)}
.catalog-filters input:focus-visible{outline:2px solid var(--focus);outline-offset:2px;background-color:rgb(255 255 255 / .07)}
.catalog-filters small{font-size:12px;line-height:1.6;color:var(--text-3);padding-inline:2px}
.list{min-height:160px;flex:1;overflow:auto;padding:4px 8px 10px;border-top:1px solid var(--line);scrollbar-width:thin;scrollbar-color:rgb(236 222 186 / .2) transparent}
.panel .list{flex:1;min-height:160px}
.landmark{position:relative;width:100%;background:transparent;color:var(--stone-100);display:flex;align-items:center;gap:12px;padding:9px 12px;margin-block:1px;text-align:right;border-radius:var(--r-sm);transition:background var(--t1)}
.landmark:hover{background:rgb(255 255 255 / .05)}
.landmark.active{background:linear-gradient(270deg,rgb(223 190 120 / .17),rgb(223 190 120 / .04))}
.landmark.active::before{content:'';position:absolute;right:0;top:10px;bottom:10px;width:3px;border-radius:3px;background:var(--gold-400)}
.landmark[hidden]{display:none}
.number{flex-shrink:0;width:34px;height:34px;display:grid;place-items:center;font:600 12.5px/1 var(--font-ui);font-variant-numeric:tabular-nums;color:var(--stone-200);background:rgb(236 222 186 / .09);clip-path:polygon(29.3% 0,70.7% 0,100% 29.3%,100% 70.7%,70.7% 100%,29.3% 100%,0 70.7%,0 29.3%)}
.landmark.active .number{background:var(--gold-400);color:var(--on-accent)}
.landmark>span:nth-child(2){min-width:0}
.landmark strong{font-size:15.5px;line-height:1.55;font-weight:500;display:block}
.landmark small{display:block;font-size:12px;line-height:1.6;color:var(--text-3)}
.landmark>svg{width:16px;height:16px;opacity:.45;margin-inline-start:auto}
.landmark .has-audio{margin-inline-start:auto;display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;flex-shrink:0;color:var(--tile-300);background:rgb(108 195 184 / .13)}
.landmark .has-audio svg{width:13px;height:13px;stroke-width:2}
.landmark .has-audio+svg{margin-inline-start:0}
.panel-foot{padding:14px 18px 16px;border-top:1px solid var(--line);flex-shrink:0}
.panel-foot label{font-size:13px;font-weight:500;color:var(--gold-300);display:block;margin-bottom:8px}
.panel-foot select{width:100%;min-height:44px;background-color:rgb(255 255 255 / .05);color:var(--text);border:1px solid var(--line-2);border-radius:var(--r-sm);padding:0 12px 0 34px;font-size:14px;cursor:pointer}
.panel-foot select:hover{border-color:var(--line-3)}
.vr-panel-entry{margin-top:10px;width:100%}
.panel-links{display:flex;justify-content:space-between;margin-top:10px}
.panel-links button{background:transparent;color:var(--text-3);font-size:12.5px;min-height:32px;padding:0 2px;transition:color var(--t1)}
.panel-links button:hover{color:var(--gold-300)}
.mobile-toggle{display:none}

/* ---------- الأدوات الجانبية ---------- */
.tools{position:absolute;left:27px;top:112px;z-index:7;display:flex;flex-direction:column;align-items:center;gap:10px}
.zoom-group{padding:4px;border-radius:var(--r-pill);display:flex;flex-direction:column;gap:2px}
.zoom-group .icon{background:transparent;border:0;box-shadow:none;width:38px;height:38px;backdrop-filter:none;-webkit-backdrop-filter:none}
.zoom-group .icon:hover{background:rgb(255 255 255 / .08)}
.capture-tool{font-size:12.5px;font-weight:700;color:var(--gold-300);font-variant-numeric:tabular-nums}
.compass{height:62px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;font-size:12px;font-weight:500;color:var(--stone-100);text-shadow:0 1px 6px rgb(6 22 18 / .85)}
.compass svg{width:24px;height:27px;color:var(--gold-300)}
.compass>span{display:block;transition:transform var(--t1) linear}
.caption{position:absolute;left:88px;top:119px;font-size:12.5px;line-height:1.6;color:var(--stone-200);padding:8px 14px;background:rgb(10 32 27 / .6);border:1px solid var(--line);border-radius:var(--r-sm);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.caption strong{display:block;font-size:14px;font-weight:600;color:var(--gold-200)}
.current{position:absolute;top:112px;left:50%;transform:translateX(-50%);z-index:9;padding:8px 8px 8px 18px;padding-inline:18px 8px;border-radius:var(--r-pill);display:flex;gap:14px;align-items:center;font-size:15px;font-weight:500}
.current button{background:rgb(223 190 120 / .12);color:var(--gold-300);font-size:13px;font-weight:500;border-radius:var(--r-pill);padding:0 14px;min-height:34px;transition:background var(--t1)}
.current button:hover{background:rgb(223 190 120 / .22)}

/* ---------- بطاقة المعلم ---------- */
.detail{position:absolute;left:88px;bottom:122px;width:352px;z-index:7;border-radius:var(--r-lg);max-height:calc(100dvh - 230px);overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgb(236 222 186 / .2) transparent}
.detail-photo{height:112px;position:relative;background:var(--ink-700)}
.detail-photo img{width:100%;height:100%;object-fit:cover;filter:brightness(.82);object-position:50% 47%}
.detail-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgb(12 37 31 / .9),transparent)}
.detail-photo span{position:absolute;right:20px;bottom:13px;color:var(--gold-200);font-size:13px;z-index:1}
.detail-close{position:absolute;left:12px;top:12px;z-index:3;width:36px;height:36px;box-shadow:none}
.detail-close::after{content:'';position:absolute;inset:-5px}
.detail-close svg{width:18px;height:18px}
.detail-body{padding:20px 22px 22px}
.detail .eyebrow{padding-left:40px}
.detail h2{margin:2px 0 12px;font-family:var(--font-display);font-weight:700;font-size:29px;line-height:1.4;color:var(--text)}
.detail p{font-size:15px;line-height:1.95;color:var(--text-2);margin:0 0 14px}
.video-supplement{padding:14px 0 12px;border-top:1px solid var(--line)}
.video-supplement:first-of-type{border-top:0;padding-top:2px}
.video-supplement h3{margin:0 0 6px;font-size:16px;font-weight:600;line-height:1.6;color:var(--gold-200)}
.video-supplement p{margin-bottom:10px}
.video-supplement .secondary{width:100%;justify-content:flex-start;margin:4px 0 10px;text-align:right}
.video-supplement a{font-size:13px}
[data-studio-audio]::before{content:'';width:16px;height:16px;flex-shrink:0;background:var(--tile-300);-webkit-mask:var(--i-play) center/contain no-repeat;mask:var(--i-play) center/contain no-repeat}
.audio-pending{display:inline-flex;align-items:center;gap:8px;font-size:12.5px!important;line-height:1.6!important;color:var(--tile-300)!important;background:rgb(108 195 184 / .1);border:1px solid rgb(108 195 184 / .22);border-radius:var(--r-pill);padding:4px 12px;margin:0 0 10px!important}
.audio-pending::before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.8}
.read-detail{display:inline-flex;align-items:center;gap:8px;background:transparent;color:var(--gold-300);padding:6px 0 14px;min-height:36px;font-size:14px;font-weight:500;transition:color var(--t1)}
.read-detail:hover{color:var(--gold-200)}
.read-detail:disabled{color:var(--text-3);opacity:1;cursor:default}
.read-detail svg{width:18px;height:18px}
.detail-actions{display:flex;flex-wrap:wrap;gap:8px}
.detail-actions .primary{flex:1 1 170px}
.detail-actions .secondary{flex:1 1 auto}
.detail .detail-observe{border-right:2px solid rgb(223 190 120 / .5);padding-right:12px;color:var(--gold-200);font-size:13.5px}
.detail .detail-observe:empty{display:none}
.detail-scope{font-size:13px!important;color:var(--text-3)!important}
.reference-note{font-size:12.5px;line-height:1.85;color:var(--text-3)}
.detail p.reference-note{font-size:12.5px;line-height:1.85;color:var(--text-3);margin-bottom:10px}
.location-note{font-size:13px;line-height:1.8;padding:10px 12px;border-inline-start:3px solid var(--stone-400);background:rgb(255 255 255 / .035);border-start-end-radius:var(--r-xs);border-end-end-radius:var(--r-xs)}
.detail p.location-note{font-size:13px;line-height:1.8}
.location-note.estimated{border-color:var(--warn);color:#f0d49a;background:rgb(231 179 95 / .07)}
.detail p.location-note.estimated{color:#f0d49a}
.reference-links{font-size:13px;line-height:2;margin-bottom:12px}
.reference-links a{text-decoration:underline}

/* صور الأوقاف */
.awqaf-photo{margin:18px 0;padding:0}
.awqaf-photo img{width:100%;height:auto;display:block;object-fit:contain;border-radius:var(--r-sm);background:var(--ink-900);border:1px solid var(--line)}
.awqaf-photo figcaption{font-size:13px;line-height:1.85;color:var(--text-2);margin-top:8px}
.awqaf-photo a{color:var(--gold-300)}
.awqaf-photo h3{font-size:16px;font-weight:600;margin:12px 0 6px;color:var(--gold-200)}

/* ---------- العلامات في المشهد ---------- */
.markers{direction:ltr;pointer-events:none;z-index:4;overflow:hidden}
.marker{position:absolute;left:0;top:0;will-change:transform;transform:translate(-50%,-100%);background:transparent;pointer-events:none;white-space:nowrap;display:flex;flex-direction:column;align-items:center;padding:6px 8px 0;direction:rtl}
.marker:hover,.marker:focus-visible,.marker.active{z-index:3}
.marker:focus-visible{outline:none}
.marker-dot{pointer-events:auto;cursor:pointer;width:13px;height:13px;border-radius:50%;background:radial-gradient(circle at 50% 38%,var(--gold-200),var(--gold-500) 75%);border:2px solid rgb(255 248 228 / .95);box-shadow:0 0 0 4px rgb(223 190 120 / .22),0 2px 6px rgb(0 0 0 / .4);transition:transform var(--t1) var(--ease),box-shadow var(--t2)}
.marker::after{content:'';width:1.5px;height:13px;margin-top:1px;background:linear-gradient(rgb(242 223 174 / .95),rgb(242 223 174 / 0))}
.marker-label{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);pointer-events:auto;cursor:pointer;font-size:12.5px;font-weight:500;line-height:1.2;background:rgb(12 37 31 / .9);border:1px solid rgb(236 210 150 / .42);color:var(--text);padding:7px 12px;border-radius:var(--r-pill);box-shadow:var(--shadow-1);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:opacity var(--t2) var(--ease),transform var(--t2) var(--ease),background var(--t1),color var(--t1)}
.marker-label:hover{background:rgb(27 70 59 / .96);border-color:rgb(236 210 150 / .7)}
.marker:not(.labeled) .marker-label{opacity:0;transform:translate(-50%,6px) scale(.96);pointer-events:none}
.marker:not(.labeled):hover .marker-label,.marker:not(.labeled):focus-visible .marker-label{opacity:1;transform:translateX(-50%)}
.marker:not(.labeled):not(.active) .marker-dot{box-shadow:0 0 0 3px rgb(223 190 120 / .2),0 2px 5px rgb(0 0 0 / .4)}
.marker:hover .marker-dot,.marker:focus-visible .marker-dot{transform:scale(1.18)}
.marker:focus-visible .marker-dot{outline:2px solid var(--focus);outline-offset:3px}
.marker.active .marker-label{background:var(--gold-300);color:var(--on-accent);border-color:var(--gold-300);font-weight:600}
.marker.active .marker-dot{box-shadow:0 0 0 7px rgb(223 190 120 / .28),0 2px 6px rgb(0 0 0 / .4)}
.walking .marker-dot{box-shadow:0 0 0 6px rgb(215 182 106 / .18),0 2px 6px rgb(0 0 0 / .4)}

/* ---------- الشريط السفلي والجولة ---------- */
.bottom{position:absolute;bottom:22px;inset-inline:27px;z-index:9;display:flex;align-items:center;justify-content:flex-start;gap:14px}
.bottom>.legend{margin-inline-start:auto}
.tour{display:flex;gap:14px;align-items:center;padding:12px 14px;border-radius:var(--r-lg);position:relative;overflow:hidden;min-width:360px}
.play{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;color:var(--on-accent);background:linear-gradient(180deg,var(--gold-300),var(--gold-400));flex-shrink:0;box-shadow:0 8px 22px rgb(223 190 120 / .24),inset 0 1px 0 rgb(255 255 255 / .4);transition:transform var(--t1) var(--ease)}
.play:hover{transform:scale(1.05)}
.play:active{transform:scale(.97)}
.play svg{width:20px;height:20px;fill:currentColor;stroke-width:1.2}
.tour-copy{min-width:172px}
.tour-copy strong{display:block;font-size:15.5px;font-weight:600;line-height:1.5}
.tour-copy small{display:block;font-size:12.5px;color:var(--text-3);margin-top:2px}
.tour-step{width:40px;height:40px;border-radius:50%;background:transparent;color:var(--stone-100);display:grid;place-items:center;transition:background var(--t1)}
.tour-step:hover{background:rgb(255 255 255 / .08)}
.progress{height:2px;position:absolute;bottom:0;left:0;right:0;background:rgb(255 255 255 / .1)}
.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--gold-500),var(--gold-200));width:0;transition:width .2s linear}
.legend{display:flex;gap:18px;font-size:13px;color:var(--stone-200);text-shadow:0 1px 6px rgb(6 22 18 / .9)}
.legend span{display:flex;align-items:center;gap:7px}
.legend svg{width:16px;height:16px;opacity:.85}
.source-button{background:transparent;border-bottom:1px solid rgb(223 190 120 / .35);color:var(--gold-300);font-size:12.5px;font-weight:500;padding:6px 0;text-shadow:0 1px 6px rgb(6 22 18 / .9);transition:color var(--t1),border-color var(--t1)}
.source-button:hover{color:var(--gold-200);border-color:var(--gold-300)}

/* ---------- التجوّل ---------- */
.walk-tip{position:absolute;top:176px;left:50%;transform:translateX(-50%);z-index:6;padding:10px 18px;border-radius:var(--r-pill);background:rgb(12 37 31 / .88);border:1px solid var(--line-2);font-size:14px;text-align:center;max-width:85vw;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:var(--shadow-1)}
.crosshair{position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;pointer-events:none;border-radius:50%;background:var(--gold-100);box-shadow:0 0 0 2px rgb(12 37 31 / .8)}
.pad{position:absolute;bottom:138px;left:28px;display:grid;grid-template-columns:repeat(3,46px);grid-template-rows:repeat(2,46px);gap:6px;direction:ltr;z-index:12}
.pad button{background:rgb(12 37 31 / .82);border:1px solid var(--line-2);color:var(--stone-50);border-radius:12px;touch-action:none;display:grid;place-items:center;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background var(--t1),color var(--t1)}
.pad button:active{background:var(--gold-400);color:var(--on-accent)}
.pad button:first-child{grid-column:2}
.pad button:nth-child(2){grid-column:1;grid-row:2}
.pad button:nth-child(3){grid-column:2;grid-row:2}
.pad button:nth-child(4){grid-column:3;grid-row:2}
.nearby{position:absolute;z-index:12;left:50%;transform:translateX(-50%);bottom:133px;color:var(--text);display:flex;align-items:center;gap:12px;border-radius:var(--r-md);padding:10px 16px;text-align:right;max-width:calc(100% - 360px);transition:border-color var(--t1)}
.nearby:hover{border-color:var(--line-3)}
.nearby small{display:block;color:var(--text-3);font-size:11.5px}
.nearby strong{display:block;font-size:15px;font-weight:600}
.nearby>span:first-child{color:var(--gold-300)}
.nearby-action{color:var(--gold-300);font-size:13px;font-weight:500;margin-inline-start:14px;white-space:nowrap}
kbd{font-family:inherit;font-size:11px;display:inline-block;border:1px solid rgb(236 210 150 / .4);border-bottom-width:2px;border-radius:5px;min-width:22px;text-align:center;padding:1px 5px;margin-inline-start:5px}
.walking>.panel{opacity:.95}
.detail-open.walking>.pad,.detail-open.walking>.nearby,.detail-open.walking>.crosshair{display:none!important}
.detail-open>.caption{display:none}

/* ---------- التنبيهات ---------- */
.toast{position:absolute;bottom:112px;left:50%;transform:translate(-50%,8px);z-index:40;background:rgb(12 37 31 / .95);color:var(--text);border:1px solid var(--line-2);border-radius:var(--r-pill);padding:10px 20px;font-size:14px;font-weight:500;max-width:85vw;text-align:center;opacity:0;pointer-events:none;box-shadow:var(--shadow-2);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:opacity var(--t2),transform var(--t2) var(--ease)}
.toast.visible{opacity:1;transform:translate(-50%,0)}

/* ---------- المداخل: عبور الأبواب ---------- */
.nearby[data-kind=door]{border-color:rgb(236 210 150 / .5);background:linear-gradient(180deg,rgb(36 76 62 / .94),rgb(14 42 35 / .95))}
.nearby[data-kind=door]>span:first-child{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:rgb(223 190 120 / .16);color:var(--gold-200)}
.door-veil{position:absolute;inset:0;z-index:120;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding:20px;opacity:0;visibility:hidden;pointer-events:none;background:radial-gradient(55% 65% at 50% 44%,#4b5a45 0%,#1a4036 32%,#0e2b24 62%,var(--ink-950));transition:opacity .45s var(--ease),visibility 0s linear .45s}
.door-veil.on{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .42s var(--ease)}
.door-arch{position:relative;width:128px;height:184px;margin-bottom:16px;border-radius:64px 64px 6px 6px;overflow:hidden;border:2px solid rgb(236 210 150 / .8);background:radial-gradient(90% 75% at 50% 62%,#fff6dc,var(--gold-300) 40%,var(--gold-500) 80%);box-shadow:0 0 70px rgb(242 223 174 / .32),inset 0 0 30px rgb(255 255 255 / .35);perspective:520px}
.door-leaf{position:absolute;top:0;bottom:0;width:50%;background:linear-gradient(180deg,#47321d,#2a1b0f);transition:transform .95s var(--ease) .1s}
.door-leaf::after{content:'';position:absolute;inset:10px 8px;border:1px solid rgb(236 210 150 / .4);background:var(--pattern) center/24px 24px;opacity:.35}
.door-leaf:first-child{left:0;transform-origin:left center;border-right:1px solid rgb(0 0 0 / .4)}
.door-leaf:last-child{right:0;transform-origin:right center;border-left:1px solid rgb(236 210 150 / .18)}
.door-veil.open .door-leaf:first-child{transform:rotateY(82deg)}
.door-veil.open .door-leaf:last-child{transform:rotateY(-82deg)}
.door-veil strong{font-family:var(--font-display);font-size:40px;font-weight:700;line-height:1.3;color:var(--gold-100);text-shadow:0 4px 24px rgb(0 0 0 / .4)}
.door-veil small{font-size:14.5px;color:var(--stone-200)}
.door-veil .door-progress{font-size:12.5px;color:var(--text-3);min-height:1.6em}

/* ---------- النوافذ ---------- */
dialog{padding:0;border:1px solid var(--line-2);border-radius:var(--r-lg);background:linear-gradient(180deg,var(--ink-800),var(--ink-850));color:var(--text);width:calc(100vw - 32px);max-width:640px;max-height:88dvh;box-shadow:var(--shadow-3),var(--hl)}
dialog::backdrop{background:rgb(4 15 12 / .72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
dialog[open]{animation:rise var(--t3) var(--ease)}
.dialog-inner{padding:30px;overflow:auto}
.dialog-inner>.icon{float:left;width:40px;height:40px;box-shadow:none}
.dialog-inner h2{font-family:var(--font-display);font-size:32px;line-height:1.35;font-weight:700;margin:2px 0 14px;color:var(--text)}
.dialog-inner p{font-size:15.5px;line-height:1.95;color:var(--text-2)}
.dialog-inner img{width:100%;border-radius:var(--r-sm);border:1px solid var(--line)}
.dialog-inner>.primary{margin-top:18px}
.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
.help-grid>div{border:1px solid var(--line);border-radius:var(--r-md);padding:16px;background:rgb(255 255 255 / .03)}
.help-grid strong{color:var(--gold-300);font-size:16px;font-weight:600;display:block}
.help-grid p{font-size:14px;line-height:1.9;margin:6px 0 0}
.help-grid>div:last-child:nth-child(odd){grid-column:1/-1}
.scene-options{display:flex;flex-direction:column;gap:10px;margin-top:22px}
.scene-options button{display:flex;align-items:center;gap:12px;text-align:right;background:rgb(255 255 255 / .04);border:1px solid var(--line-2);color:var(--text);padding:14px 18px;min-height:58px;border-radius:var(--r-md);font-size:17px;font-weight:500;transition:background var(--t1),border-color var(--t1)}
.scene-options button svg{color:var(--gold-300)}
.scene-options span{flex:1}
.scene-options button:hover{background:rgb(223 190 120 / .1);border-color:rgb(223 190 120 / .45)}
.dialog-quality{display:flex;gap:14px;align-items:center;margin:16px 0;font-size:14px;color:var(--text-2)}
.capture-size{padding:16px 20px;border:1px solid var(--line-2);border-radius:var(--r-md);background:rgb(255 255 255 / .03);font-size:28px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--gold-100);display:flex;align-items:center;gap:14px;justify-content:space-between}
.capture-size span{font-size:13px;font-weight:500;color:var(--text-2)}
.capture-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.capture-actions a{text-decoration:none}
.capture-actions button:disabled{opacity:.6;cursor:wait}
#capture-progress{width:100%;height:8px;accent-color:var(--gold-400)}
#capture-status{min-height:31px}
#capture::backdrop{background:rgb(4 15 12 / .96)}

/* ---------- شاشة التحميل ---------- */
.loading{position:absolute;inset:0;display:grid;place-items:center;z-index:99;text-align:center;background:radial-gradient(120% 90% at 50% 38%,#17463c 0%,var(--ink-900) 55%,var(--ink-950) 100%)}
.loading::before{content:'';position:absolute;inset:0;background:var(--pattern) center/56px 56px;opacity:.07;pointer-events:none;-webkit-mask-image:radial-gradient(55% 55% at 50% 45%,#000,transparent);mask-image:radial-gradient(55% 55% at 50% 45%,#000,transparent)}
.loading>div{position:relative;padding:0 20px;animation:rise .7s var(--ease)}
.loading h2{font-family:var(--font-display);font-size:64px;font-weight:700;line-height:1.25;color:var(--gold-200);margin:0 0 6px;text-shadow:0 6px 30px rgb(223 190 120 / .18)}
.loading p{font-size:14.5px;color:var(--text-2);line-height:1.9;margin:6px 0}
.loading small{font-size:12.5px;color:var(--text-3)}
.loading .primary{margin:20px auto}
.spinner{position:relative;width:72px;height:72px;margin:18px auto 22px}
.spinner::before,.spinner::after{content:'';position:absolute;inset:0;background:var(--octagon) center/contain no-repeat;animation:spin 7s linear infinite}
.spinner::after{inset:15px;opacity:.7;animation-duration:4.5s;animation-direction:reverse}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes rise{from{transform:translateY(10px)}to{transform:none}}

/* ---------- الجولة السينمائية ---------- */
.cinema-overlay{position:absolute;inset:0;z-index:18;pointer-events:none;background:linear-gradient(0deg,rgb(7 24 20 / .97) 0%,rgb(7 24 20 / .86) 18%,transparent 59%,transparent 81%,rgb(7 24 20 / .87) 100%)}
.cinema-shade{position:absolute;inset:0;background:#061410;opacity:0;pointer-events:none;z-index:-1}
.cinema-top{position:absolute;inset-inline:32px;top:22px;display:flex;align-items:center;justify-content:space-between;gap:22px;pointer-events:auto}
.cinema-top>div>strong{display:block;font-family:var(--font-display);font-size:24px;font-weight:700;line-height:1.3}
.cinema-top .eyebrow{font-size:11.5px;margin-bottom:2px}
.cinema-top>.secondary{border-radius:var(--r-pill);background:rgb(12 37 31 / .8);font-size:13px;padding:0 16px;min-height:40px}
.station-nav{display:flex;direction:rtl;gap:7px}
.station-nav button{width:34px;height:34px;border-radius:50%;border:1px solid rgb(236 210 150 / .35);background:rgb(12 37 31 / .82);color:var(--stone-100);font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;transition:background var(--t1),color var(--t1),border-color var(--t1)}
.station-nav button:hover{border-color:var(--gold-300);color:var(--gold-200)}
.station-nav button.active{background:var(--gold-300);color:var(--on-accent);border-color:var(--gold-300)}
.cinema-story{position:absolute;bottom:129px;left:50%;transform:translateX(-50%);width:min(700px,calc(100% - 60px));text-align:center;pointer-events:auto;text-shadow:0 2px 18px rgb(3 16 12 / .9);max-height:calc(100% - 245px);overflow:auto;scrollbar-width:thin}
.cinema-story .eyebrow{justify-content:center}
.cinema-story h2{font-family:var(--font-display);font-size:46px;font-weight:700;line-height:1.35;margin:2px 0 10px;color:var(--gold-100)}
.cinema-story p{font-size:17.5px;line-height:1.95;color:var(--stone-50);margin:0 auto 10px;max-width:640px;max-height:calc(1.95em * 5);overflow:auto;scrollbar-width:thin;scrollbar-color:rgb(236 222 186 / .25) transparent;padding-inline:6px}
.cinema-observe{display:block;color:var(--gold-200);font-size:13.5px;line-height:1.85;transition:opacity .5s}
.cinema-observe.arriving{opacity:.4}
.cinema-actions{display:flex;justify-content:center;gap:9px;margin-top:18px;text-shadow:none}
.cinema-actions button{font-size:13.5px;border-radius:var(--r-pill);padding:0 18px;min-height:42px}
.cinema-actions .secondary{background:rgb(12 37 31 / .78)}
.cinema-actions [aria-pressed=true]{border-color:var(--gold-300);color:var(--gold-200)}
.cinematic>.topbar,.cinematic>.panel,.cinematic>.mobile-toggle,.cinematic>.tools,.cinematic>.caption,.cinematic>.current,.cinematic>.detail,.cinematic>.markers,.cinematic>.walk-tip,.cinematic>.crosshair,.cinematic>.pad,.cinematic>.nearby{display:none!important}
.cinematic>.bottom{z-index:20;inset-inline:auto;left:50%;transform:translateX(-50%);width:min(560px,calc(100% - 38px));bottom:27px}
.cinematic .bottom>.legend,.cinematic .bottom>.source-button,.cinematic .bottom>.walk-entry{display:none}
.cinematic .tour{width:100%;background:rgb(12 37 31 / .86);min-width:0}
.cinematic .tour-copy{flex:1}
.cinematic .toast{z-index:45;bottom:115px}

/* ---------- مسيرة على الأقدام ---------- */
.walk-entry{display:flex;align-items:center;gap:12px;padding:10px 16px 10px 12px;padding-inline:12px 18px;border-radius:var(--r-lg);color:var(--text);text-align:right;min-height:64px;transition:border-color var(--t1),transform var(--t1)}
.walk-entry:hover{border-color:var(--line-3)}
.walk-entry:active{transform:translateY(1px)}
.walk-entry-icon{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;color:var(--tile-300);background:rgb(108 195 184 / .14);border:1px solid rgb(108 195 184 / .3)}
.walk-entry-copy strong{display:block;font-size:15px;font-weight:600;line-height:1.4}
.walk-entry-copy small{display:block;font-size:12.5px;color:var(--text-3)}
.walktour{position:absolute;inset:0;z-index:18;pointer-events:none;background:linear-gradient(0deg,rgb(7 24 20 / .55) 0%,transparent 34%,transparent 84%,rgb(7 24 20 / .6) 100%)}
.walk-fade{position:absolute;inset:0;background:var(--ink-950);opacity:0;pointer-events:none}
.walk-fade.flash{animation:walkflash .75s var(--ease)}
@keyframes walkflash{0%{opacity:.92}30%{opacity:.92}100%{opacity:0}}
.walktour-top{position:absolute;inset-inline:28px;top:20px;display:flex;align-items:center;justify-content:space-between;gap:18px;pointer-events:auto}
.walktour-top>div>strong{display:block;font-family:var(--font-display);font-size:24px;font-weight:700;line-height:1.3;text-shadow:0 2px 12px rgb(3 16 12 / .8)}
.walktour-top .eyebrow{font-size:11.5px;margin-bottom:2px}
.walktour-top>.secondary{border-radius:var(--r-pill);background:rgb(12 37 31 / .8);font-size:13px;padding:0 16px;min-height:40px}
.walktour-nav{flex-wrap:wrap;justify-content:center;max-width:56vw}
.walktour-card{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);width:min(640px,calc(100% - 40px));border-radius:var(--r-lg);padding:16px 20px 18px;pointer-events:auto;overflow:hidden}
.walktour-status{font-size:13px;font-weight:500;color:var(--tile-300);min-height:0}
.walktour-status:empty{display:none}
.walktour-card .eyebrow{margin:4px 0 2px}
.walktour-card h2{margin:0 0 8px;font-family:var(--font-display);font-size:32px;font-weight:700;line-height:1.35;color:var(--gold-100)}
.walktour-text{max-height:min(31vh,250px);overflow:auto;scrollbar-width:thin;scrollbar-color:rgb(236 222 186 / .25) transparent;padding-inline-end:4px}
.walktour-text section+section{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.walktour-text h3{margin:0 0 4px;font-size:15px;font-weight:600;color:var(--gold-200)}
.walktour-text p{margin:0;font-size:15.5px;line-height:1.95;color:var(--text-2)}
.walktour-card.moving .walktour-text{display:none}
.walktour-card.moving h2{font-size:26px;margin-bottom:4px}
.walktour-actions{display:flex;align-items:center;gap:8px;margin-top:14px}
.walktour-actions .play{width:48px;height:48px}
.walktour-actions .secondary{margin-inline-start:auto;border-radius:var(--r-pill);font-size:13px;min-height:40px;padding:0 14px}
.walktour-card .progress{height:3px}
@media(min-width:1100px){.walktour-card{left:28px;transform:none;width:430px;bottom:28px}.walktour-text{max-height:min(34vh,300px)}}
.walktouring>.topbar,.walktouring>.panel,.walktouring>.mobile-toggle,.walktouring>.tools,.walktouring>.caption,.walktouring>.current,.walktouring>.detail,.walktouring>.markers,.walktouring>.walk-tip,.walktouring>.crosshair,.walktouring>.pad,.walktouring>.nearby,.walktouring>.bottom{display:none!important}
.walktouring .toast{z-index:45;bottom:auto;top:84px}

/* ---------- التعريف بالأقصى ---------- */
.intro-tracks{display:grid;gap:8px}
.intro-track{display:flex;align-items:center;gap:12px;text-align:right;padding:12px 14px;min-height:52px;border:1px solid var(--line-2);border-radius:var(--r-md);background:rgb(255 255 255 / .035);color:inherit;font:inherit;cursor:pointer;transition:background var(--t1),border-color var(--t1)}
.intro-track:hover{background:rgb(255 255 255 / .06);border-color:var(--line-3)}
.intro-track strong{flex:1;font-size:15.5px;font-weight:500}
.intro-track>span,.intro-track small{font-size:13px;color:var(--text-3);font-variant-numeric:tabular-nums}
.intro-track>span{color:var(--gold-300);font-weight:600}
.intro-track.active{border-color:var(--gold-400);background:rgb(223 190 120 / .1)}
.intro-continuous{display:flex;align-items:center;gap:10px;margin:18px 0;font-size:15px}
.intro-continuous input{width:18px;height:18px;accent-color:var(--gold-400)}
#intro-audio{width:100%;display:block;color-scheme:dark;border-radius:var(--r-pill)}
#intro-title{margin-bottom:12px;font-weight:600;color:var(--text)}
.intro-sidebar{position:absolute;right:24px;top:110px;bottom:24px;width:350px;z-index:15;overflow:auto;border-radius:var(--r-lg);scrollbar-width:thin;scrollbar-color:rgb(236 222 186 / .2) transparent}
.intro-sidebar .dialog-inner{padding:22px}
.intro-sidebar h2{font-size:28px;line-height:1.45;margin:10px 0}
.intro-sidebar p{font-size:15.5px;line-height:1.85}
.intro-sidebar #intro-close{float:left}
.intro-sidebar #intro-tour{width:100%}
.intro-open-view .viewport,.intro-open-view .markers{right:390px}
.intro-open-view .panel,.intro-open-view .bottom,.intro-open-view .mobile-toggle,.intro-open-view .caption{display:none}
.intro-open-view .markers{visibility:hidden}
.intro-open-view .topbar{right:390px}
.intro-open-view .brand{display:none}

/* ==========================================================================
   الشاشات المختلفة
   ========================================================================== */
@media(min-width:1550px){
 .panel{right:36px;width:335px}
 .detail{left:96px;width:372px}
 .topbar{padding-inline:38px}
 .bottom{inset-inline:36px}
}
@media(max-height:750px) and (min-width:761px){
 .panel{top:100px;max-height:calc(100dvh - 201px)}
 .panel-head{padding:13px 20px 8px}
 .panel-head h1{font-size:25px}
 .panel-head p{display:none}
 .intro-open{min-height:40px;margin-bottom:10px}
 .catalog-filters{grid-template-columns:1fr 1fr;gap:6px}
 .catalog-filters small{grid-column:1/-1}
 .catalog-filters input,.catalog-filters select{min-height:38px;font-size:13px}
 .panel-foot .vr-panel-entry{display:none}
 .landmark{padding:6px 12px}
 .detail-photo{height:78px}
 .detail-body{padding:14px 18px 17px}
 .detail h2{font-size:25px}
 .detail p{font-size:14px;margin-bottom:12px}
 .detail{bottom:112px}
 .panel-foot{padding:11px 18px}
 .tools{top:101px}
 .caption{top:108px}
}
@media(max-width:1060px){
 .panel{width:274px;right:19px}
 .detail{width:300px;left:76px}
 .caption,.legend{display:none}
 .bottom>.source-button{margin-inline-start:auto}
 .topbar{padding:17px 21px}
 .modes button{padding:0 12px}
 .quality{max-width:145px}
 .bottom{inset-inline:19px}
 .tour{min-width:330px}
 .tour-copy{min-width:153px}
}
@media(max-width:760px){
 .walk-entry{padding:0;width:52px;height:52px;min-height:0;border-radius:50%;justify-content:center;flex-shrink:0}
 .walk-entry-copy{display:none}
 .walk-entry-icon{width:50px;height:50px;border:0;background:transparent}
 .walktour-top{inset-inline:14px;top:14px;gap:8px;flex-wrap:wrap}
 .walktour-top>div>strong{font-size:18px}
 .walktour-top>.secondary{font-size:12px;padding:0 12px;min-height:36px}
 .walktour-top .lighting-switch{margin-inline-start:auto}
 .walktour-top .lighting-switch button{min-width:40px;padding:0 8px}
 .walktour-nav{order:3;width:100%;max-width:none;gap:6px;flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scrollbar-width:none;padding:2px 0}
 .walktour-nav button{flex-shrink:0}
 .walktour-nav button{width:28px;height:28px;font-size:11.5px}
 .walktour-card{bottom:12px;width:calc(100% - 20px);padding:12px 14px 14px}
 .walktour-card h2{font-size:25px}
 .walktour-text{max-height:28vh}
 .walktour-text p{font-size:14.5px}
 .walktour-actions .secondary{font-size:12px;padding:0 10px}
 .walktouring .toast{top:120px}
 .topbar{height:79px;padding:13px 15px}
 .brand{gap:8px}
 .brand>span{width:38px;height:38px}
 .brand>span svg{width:24px;height:24px}
 .brand strong{font-size:28px}
 .brand small{display:none}
 .top-actions{gap:6px}
 .top-actions>.quality,.top-help{display:none}
 .top-actions>.icon{width:40px;height:40px}
 .modes{padding:3px}
 .modes button{font-size:13px;min-height:36px;padding:0 10px;gap:5px}
 .modes svg{width:17px;height:17px}
 .panel{top:88px;right:13px;width:calc(100% - 78px);max-width:330px;max-height:calc(100dvh - 220px);transform:translateX(calc(100% + 25px));transition:transform .26s var(--ease)}
 .panel.open{transform:translateX(0)}
 .panel-head{padding:14px 18px 10px}
 .panel-head h1{font-size:25px}
 .panel-head p{font-size:13px;margin-top:4px}
 .landmark{padding:8px 10px}
 .landmark strong{font-size:15px}
 .panel-foot{padding:11px 16px}
 .mobile-toggle{display:flex;align-items:center;gap:7px;position:absolute;right:14px;top:137px;z-index:9;color:var(--text);background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-pill);padding:0 14px;min-height:42px;font-size:14px;font-weight:500;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow-1)}
 .mobile-toggle svg{width:18px;height:18px;color:var(--gold-300)}
 .panel.open~.mobile-toggle{top:auto;bottom:138px}
 .tools{left:14px;top:93px;gap:7px}
 .zoom-group{padding:3px}
 .icon{width:42px;height:42px}
 .current{left:57%;top:137px;width:max-content;max-width:65vw;flex-direction:column;gap:4px;padding:9px 14px;border-radius:var(--r-md);font-size:14px}
 .current button{font-size:12px}
 .detail{left:13px;right:13px;width:auto;bottom:107px;max-height:53dvh}
 .detail-photo{display:none}
 .detail-close{width:38px;height:38px;top:10px;left:10px}
 .detail-body{padding:14px 17px 16px}
 .detail h2{font-size:25px;padding-left:34px;margin-bottom:8px}
 .detail p{font-size:14.5px;line-height:1.9;margin-bottom:12px}
 .detail-actions .primary,.secondary{font-size:13.5px;padding:9px 12px}
 .marker-label{font-size:12px;padding:6px 10px}
 .bottom{inset-inline:13px;bottom:16px;gap:8px}
 .tour{width:100%;min-width:0;padding:10px 12px;gap:10px}
 .tour-copy{flex:1;min-width:0}
 .tour-copy strong{font-size:14.5px}
 .tour-copy small{font-size:12px}
 .play{width:46px;height:46px}
 .bottom>.source-button{display:none}
 .walk-tip{top:217px;left:57%;font-size:12.5px;max-width:67vw;padding:8px 12px;border-radius:var(--r-md)}
 .pad{left:15px;bottom:122px}
 .toast{bottom:98px;max-width:91vw;font-size:13px;width:max-content}
 .help-grid{grid-template-columns:1fr}
 .dialog-inner{padding:22px}
 .dialog-inner h2{font-size:27px}
 .quality{max-width:170px}
 .loading h2{font-size:50px}
 .topbar .lighting-switch{position:absolute;top:83px;left:50%;transform:translateX(-50%)}
 .lighting-switch button{min-width:46px;padding:0 10px}
 /* السينما على الهاتف */
 .cinema-top{inset-inline:16px;top:17px;gap:8px;flex-wrap:wrap}
 .cinema-top>div>strong{font-size:18px}
 .cinema-top>.secondary{font-size:12px;padding:0 12px;min-height:36px}
 .cinema-top .lighting-switch{margin-inline-start:auto}
 .cinema-top .lighting-switch button{min-width:40px;padding:0 8px}
 .station-nav{order:3;width:100%;justify-content:center;gap:8px;margin-top:3px}
 .station-nav button{width:30px;height:30px;font-size:12px}
 .cinema-story{width:calc(100% - 36px);bottom:117px;max-height:calc(100% - 260px)}
 .cinema-story h2{font-size:32px;margin-bottom:6px}
 .cinema-story p{font-size:14.5px;line-height:1.85}
 .cinema-story .eyebrow{font-size:11.5px}
 .cinema-observe{font-size:12.5px}
 .cinema-actions{margin-top:12px;gap:7px}
 .cinema-actions button{font-size:12.5px;padding:0 13px;min-height:40px}
 .cinematic>.bottom{bottom:17px;width:calc(100% - 26px)}
 .cinema-overlay{background:linear-gradient(0deg,rgb(7 24 20 / .98) 0%,rgb(7 24 20 / .85) 34%,transparent 69%,transparent 75%,rgb(7 24 20 / .8) 100%)}
 .nearby{left:auto;right:14px;transform:none;bottom:129px;max-width:calc(100% - 185px);gap:7px;flex-wrap:wrap;padding:10px 12px}
 .nearby strong{font-size:13.5px}
 .nearby-action{width:100%;margin:0;font-size:12px;text-align:left}
 .nearby kbd{display:none}
 .walking>.panel{opacity:1}
 .top-actions>.vr-entry{display:none}
}
@media(max-height:620px) and (min-width:761px){
 .cinema-story{left:auto;right:28px;transform:none;width:42%;bottom:123px;text-align:right;max-height:calc(100% - 213px)}
 .cinema-story .eyebrow{justify-content:flex-start}
 .cinema-story h2{font-size:30px}
 .cinema-story p{font-size:14.5px}
 .cinema-actions{justify-content:flex-start}
 .cinema-top{top:14px}
 .cinema-story .cinema-observe{font-size:12.5px}
 .cinema-overlay{background:linear-gradient(0deg,rgb(7 24 20 / .93),transparent 45%),linear-gradient(270deg,rgb(7 24 20 / .75),transparent 75%)}
}
@media(max-height:540px) and (max-width:760px){
 .cinema-story{bottom:108px;max-height:calc(100% - 232px)}
 .cinema-story h2{font-size:26px}
 .cinema-story p{font-size:13.5px}
 .cinema-actions{position:sticky;bottom:0;background:rgb(10 32 27 / .96);padding:8px 0}
 .cinema-observe{display:none}
}
@media(max-width:900px){
 .intro-sidebar{right:12px;width:290px;top:94px;bottom:12px}
 .intro-open-view .viewport,.intro-open-view .markers,.intro-open-view .topbar{right:314px}
 .intro-sidebar .dialog-inner{padding:16px}
 .intro-track{padding:10px;gap:8px}
}
@media(max-width:600px){
 .intro-sidebar{right:0;top:100px;bottom:0;width:44%;border-radius:0}
 .intro-open-view .viewport,.intro-open-view .markers{right:44%;top:100px}
 .intro-open-view .topbar{right:0}
 .intro-sidebar .dialog-inner{padding:10px}
 .intro-track{flex-wrap:wrap;padding:8px;gap:5px}
 .intro-track strong{font-size:14px;flex-basis:100%}
 .intro-sidebar h2{font-size:21px}
 .intro-sidebar p,.intro-continuous{font-size:14px}
 .intro-open-view .tools{display:none}
}
@media(max-width:480px){
 .capture-size{font-size:23px;flex-direction:column;align-items:flex-start;gap:3px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
 .door-veil.open .door-leaf{opacity:0}
}
/* ---------- رؤية كاملة: إخفاء اللوحات وإظهارها ---------- */
.ui-toggle span{display:none}
.ui-hidden>.topbar,.ui-hidden .cinema-top,.ui-hidden .walktour-top{visibility:hidden}
.ui-hidden .ui-toggle,.ui-hidden #walktour-exit,.ui-hidden #cinema-exit{visibility:visible}
.ui-hidden .ui-toggle{width:auto!important;height:44px!important;padding-inline:14px 16px;border-radius:var(--r-pill);display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;white-space:nowrap;background:rgb(12 37 31 / .82);border-color:rgb(223 190 120 / .45);color:var(--gold-100)}
/* On the open view the button moves to the corner, clear of everything else. */
.ui-hidden>.topbar .ui-toggle{position:fixed;top:24px;left:24px;z-index:30}
@media(max-width:760px){.ui-hidden>.topbar .ui-toggle{top:14px;left:14px}}
.ui-hidden .ui-toggle span{display:inline}
.ui-hidden>.panel,.ui-hidden>.mobile-toggle,.ui-hidden>.tools,.ui-hidden>.caption,.ui-hidden>.current,.ui-hidden>.detail,.ui-hidden>.markers,.ui-hidden>.walk-tip,.ui-hidden>.crosshair,.ui-hidden>.nearby,.ui-hidden>.bottom,.ui-hidden>.intro-sidebar,.ui-hidden .walktour-card,.ui-hidden .cinema-story{display:none!important}
.ui-hidden .walktour,.ui-hidden .cinema-overlay{background:none}
.ui-hidden .cinema-shade{opacity:0}
/* ---------- إعدادات المسيرة: اختيار المحطات ---------- */
.walk-setup{max-width:720px}
.walk-setup-tools{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:6px}
.chip{min-height:38px;padding:0 14px;border-radius:var(--r-pill);border:1px solid var(--line-2);background:rgb(255 255 255 / .04);color:var(--text);font-size:13.5px;font-weight:500;transition:background var(--t1),border-color var(--t1)}
.chip:hover{background:rgb(223 190 120 / .1);border-color:rgb(223 190 120 / .45)}
#walk-summary{margin-inline-start:auto;font-size:13.5px;font-weight:500;color:var(--tile-300)}
.walk-stops{list-style:none;margin:14px 0 10px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.walk-stops label{display:flex;align-items:center;gap:10px;min-height:50px;padding:8px 12px;border:1px solid var(--line-2);border-radius:var(--r-md);background:rgb(255 255 255 / .03);cursor:pointer;transition:background var(--t1),border-color var(--t1)}
.walk-stops label:hover{border-color:var(--line-3)}
.walk-stops label.on{background:rgb(223 190 120 / .08);border-color:rgb(223 190 120 / .42)}
.walk-stops input,.walk-loop input{width:18px;height:18px;flex-shrink:0;accent-color:var(--gold-400);margin:0;cursor:pointer}
.walk-stop-n{width:26px;height:26px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;font-size:12.5px;font-weight:600;background:rgb(223 190 120 / .14);color:var(--gold-200);transition:background var(--t1),color var(--t1)}
.walk-stops label.on .walk-stop-n{background:var(--gold-400);color:var(--on-accent)}
.walk-stop-name{flex:1;min-width:0;font-size:15px;font-weight:500;line-height:1.45;color:var(--text)}
.walk-stops small{font-size:12px;color:var(--text-3);font-variant-numeric:tabular-nums}
.walk-loop{display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--text-2);margin:4px 2px 0;cursor:pointer}
.walk-setup-actions{display:flex;gap:10px;margin-top:18px}
.walk-setup-actions .primary{flex:1}
.walktour-nav button.skip{opacity:.42}
.walktour-nav button.skip.active{opacity:1}
@media(max-width:560px){
 .walk-stops{grid-template-columns:1fr}
 .walk-setup .dialog-inner h2{font-size:26px}
 #walk-summary{margin-inline-start:0;flex-basis:100%}
}
/* ---------- رسوم الشرح المتحركة: أسماء المعالم والجهات، وبطاقة التاريخ ---------- */
.mg-layer{position:absolute;inset:0;z-index:17;pointer-events:none;overflow:hidden}
.mg-label{position:absolute;left:0;top:0;opacity:0;will-change:transform,opacity;transform:translate(-50%,-100%)}
.mg-label span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;padding:7px 14px;border-radius:var(--r-pill);font-size:15px;font-weight:600;line-height:1.3;color:var(--on-accent);background:linear-gradient(180deg,var(--gold-200),var(--gold-400));box-shadow:0 10px 26px rgb(3 16 12 / .45),inset 0 1px 0 rgb(255 255 255 / .45)}
.mg-label span::after{content:'';position:absolute;left:50%;bottom:-6px;width:10px;height:10px;background:var(--gold-400);transform:translateX(-50%) rotate(45deg);z-index:-1}
.mg-label.direction span{color:#062a25;background:linear-gradient(180deg,#bfeee6,var(--tile-300))}
.mg-label.direction span::after{background:var(--tile-300)}
.mg-caption{position:absolute;left:50%;top:92px;transform:translate(-50%,-12px);opacity:0;min-width:180px;text-align:center;padding:12px 24px 14px;border-radius:var(--r-lg);background:rgb(10 32 27 / .84);border:1px solid rgb(223 190 120 / .45);box-shadow:var(--shadow-2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:opacity var(--t3) var(--ease),transform var(--t3) var(--ease)}
.mg-caption.in{opacity:1;transform:translate(-50%,0)}
.mg-caption small{display:block;font-size:12.5px;font-weight:600;color:var(--tile-300);margin-bottom:2px}
.mg-caption small:empty{display:none}
.mg-caption strong{display:block;font-family:var(--font-display);font-size:36px;font-weight:700;line-height:1.25;color:var(--gold-100);white-space:nowrap}
@media(max-width:760px){.mg-caption{top:176px;padding:10px 18px 12px}.mg-caption strong{font-size:27px}.mg-label span{font-size:13px;padding:6px 11px}}
/* بطاقة صورة أو مخطط ترافق الشرح (صورة الرواق، صورة معلم يُذكر، مخطط أروقة الجامع القبلي) */
.mg-card{position:absolute;top:170px;right:28px;width:min(340px,calc(100% - 56px));margin:0;padding:10px 10px 12px;border-radius:var(--r-lg);background:rgb(10 32 27 / .88);border:1px solid rgb(223 190 120 / .42);box-shadow:var(--shadow-2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);opacity:0;transform:translateY(-10px);transition:opacity .45s var(--ease),transform .45s var(--ease);pointer-events:none}
.mg-card.in{opacity:1;transform:none}
.mg-card img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:calc(var(--r-lg) - 6px);background:#12342c}
.mg-card figcaption{display:flex;flex-direction:column;gap:2px;padding:8px 4px 0}
.mg-card figcaption strong{font-family:var(--font-display);font-size:19px;font-weight:700;line-height:1.35;color:var(--gold-100)}
.mg-card figcaption small{font-size:12px;color:var(--text-3)}
.mg-card.diagram figcaption{padding:2px 4px 8px}
.aisles-plan{display:block;width:100%;height:auto;overflow:visible}
.aisles-plan .era{transition:opacity .9s var(--ease)}
.aisles-plan .frame{fill:rgb(143 211 201 / .05);stroke:var(--tile-300);stroke-width:1.6}
.aisles-plan line{stroke:var(--tile-300);stroke-width:1;opacity:.75}
.aisles-plan .era.now{opacity:0}
.aisles-plan .era.now .frame{fill:none;stroke:var(--gold-200);stroke-width:2.2}
.aisles-plan .era.now line{stroke:var(--gold-200);opacity:.9}
.aisles-plan .middle{fill:rgb(236 210 150 / .3)}
.aisles-plan .dome{fill:rgb(236 210 150 / .35);stroke:var(--gold-200);stroke-width:1.5}
.aisles-plan .mihrab,.aisles-plan .qibla{fill:none;stroke:var(--stone-200);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.mg-card.now .aisles-plan .era.old{opacity:.2}
.mg-card.now .aisles-plan .era.now{opacity:1}
.aisles-legend{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:8px 4px 0;font-size:13px;color:var(--text-3)}
.aisles-legend span{transition:color .6s var(--ease)}
.aisles-legend b{font-family:var(--font-display);font-size:22px;font-weight:700;margin-inline-end:4px}
.mg-card:not(.now) .lg-old,.mg-card.now .lg-now{color:var(--gold-100)}
/* علامة صغيرة لمعلم داخل مصلى */
.mg-label.place.small span{font-size:13px;padding:5px 11px}
@media(max-width:760px){.mg-card{top:156px;right:10px;width:min(200px,calc(100% - 20px));padding:7px 7px 9px;border-radius:var(--r-md)}.mg-card img{border-radius:calc(var(--r-md) - 4px)}.mg-card figcaption{padding:6px 2px 0}.mg-card figcaption strong{font-size:15px}.mg-card figcaption small{font-size:11px}.mg-card.diagram figcaption{padding:0 2px 4px}.aisles-legend{flex-direction:column;gap:0;font-size:11.5px;padding-top:4px}.aisles-legend b{font-size:16px}}
@media(prefers-reduced-motion:reduce){.mg-card,.aisles-plan .era,.aisles-legend span{transition:none}}
/* في المسيرة على الشاشات العريضة تكون بطاقة الشرح على اليسار، فتتوسّط بطاقة التاريخ والرقم الجزء الظاهر من المشهد */
@media(min-width:1100px){.walktouring:not(.ui-hidden) .mg-caption{left:calc(50% + 229px)}}