/* ══════════════════════════════════════════════════════════════════════════
   سوق هب — القوقعة

   حلّ هذا الملفُّ محلَّ الورقتين القديمتين `souqhb-theme.css` و
   `souqhb-app.css` (٢٥ سبتمبر). فيه **ما يستعمله الوسمُ فعلاً** منهما لا
   غير: القاعدةُ بقيت إن طابق محدِّدُها عنصراً في صفحةٍ مقيسة (٤٢ صفحةً ×
   ٨ حالات، وصفحتا الاشتراك)، أو كانت أصنافُها كلُّها في جرد الوسم
   والسكربتات (حالاتٌ يضيفها سكربت، وصفحاتٌ لا تُفتح بلا دفع). وسقط
   الباقي: ٢٥ قاعدةً من الثيم و٤١٤ من التطبيق لا يستعملها شيء.

   ويُحمَّل في موضع الثيم نفسِه — بعد `setup.css` وقبل `souqhb-root.css` —
   والثيمُ هنا قبل التطبيق كما كانا يُحمَّلان، فترتيبُ الحسم لم يتغيّر.
   ومحدِّداتُ الثيم حرفاً. ومحدِّداتُ التطبيق محصورةٌ في غلاف اللياوت:
   يُلصق `:where(.store-setup, .store-setup *)` بأوّل جزءٍ منها — صفرُ
   خصوصيّة، ويطابق الغلافَ نفسَه (عليه `rail-open` و`rail-collapsed`) — لأنّ صفحاتِ التسجيل تحمّل
   هذا الملفَّ ولم تكن تحمّل ورقةَ التطبيق. وقواعدُ الجذر (`:root` ·
   `html` · `body`) بـ`:where(:has(.store-setup))` للسبب نفسِه.

   ⚠ هذه مرحلةُ النقل. والتنظيفُ على أصول البناء (توكِناتٌ بدل الألوان
   الخامّة، ولا `!important`) يجري بعدها، ويُقاس كلُّ خطوةٍ بالمرجع.
   ══════════════════════════════════════════════════════════════════════════ */

/* ═══════════════ ⓪ توكِناتُ القوقعة ═══════════════
   كانت ألواناً خامّةً في القواعد، فصارت أسماءً بمعناها — بالقيمة نفسِها حرفاً.  */
:root {
  --on-accent:      #FFFFFF;   /* نصٌّ وأيقونةٌ فوق لون العلامة وفوق الألوان المشبعة */
  --on-accent-82:   rgba(255, 255, 255, 0.82);   /* نصٌّ ثانويٌّ فوق لون العلامة */
  --on-accent-75:   rgba(255, 255, 255, 0.75);   /* مقبضُ المفتاح المشغَّل */
  --on-accent-22:   rgba(255, 255, 255, 0.22);   /* عدّادٌ فوق زرٍّ مختار */
  --brand-glow:     #F2A46B;   /* الطرفُ الفاتحُ لتدرّج العلامة */
  --brand-lift-85:  rgba(216, 100, 42, 0.85);   /* ظلُّ الزرّ الأساسيّ — بلون العلامة */
  --brand-lift-90:  rgba(216, 100, 42, 0.9);   /* ظلُّ رابط الرفِّ النشط */
  --viz-halo:       rgba(216, 100, 42, 0.28);   /* هالةُ اللوحة التعريفيّة — فاتح */
  --viz-halo-dark:  rgba(240, 121, 61, 0.3);   /* هالةُ اللوحة التعريفيّة — داكن */
  --viz-shade:      rgba(27, 19, 16, 0.1);   /* ظلُّ الركن في اللوحة التعريفيّة */
  --viz-deep-1:     #211610;   /* أرضيّةُ اللوحة التعريفيّة الداكنة — أعلاها */
  --viz-deep-2:     #17100D;   /* أرضيّةُ اللوحة التعريفيّة الداكنة — أسفلُها */
  --viz-light-1:    #FFF8F4;   /* أرضيّةُ اللوحة التعريفيّة الفاتحة — أعلاها */
  --viz-light-2:    #FBEEE6;   /* أرضيّةُ اللوحة التعريفيّة الفاتحة — أسفلُها */
  --band-deep:      #1B1310;   /* شريطُ «مباشر» — طرفُه الداكن */
  --band-mid:       #2E1D12;   /* شريطُ «مباشر» — وسطُه */
  --page-light:     var(--g-50);   /* أرضيّةُ الصفحة — فاتح */
  --page-dark:      #1C1F24;   /* أرضيّةُ الصفحة — داكن */
  --warn-soft:      #FFF8EE;   /* أرضيّةُ التنبيه — فاتح */
  --warn-line:      #F2DFC2;   /* حدُّ التنبيه — فاتح */
  --warn-soft-dark: #2A1F10;   /* أرضيّةُ التنبيه — داكن */
  --warn-line-dark: #4A3718;   /* حدُّ التنبيه — داكن */
  --gold:           #C9911F;   /* التاجُ وحدُّ التصنيف الموقوف */
  --veil:           rgba(16, 24, 40, 0.42);   /* حجابُ الدرج والنافذة */
  --knob-shadow:    rgba(0, 0, 0, 0.25);   /* ظلُّ مقبض المفتاح */
  --knob-shadow-2:  rgba(0, 0, 0, 0.28);   /* ظلُّ مقبض المفتاح — الثاني */
  --hairline:       rgba(0, 0, 0, 0.08);   /* إطارُ العَلَم الرفيع */
  --seo-link:       #1A73C8;   /* رابطُ معاينة نتيجة البحث */
  --mask-solid:     #000000;   /* قناعٌ يقرأ الشفافيّةَ وحدَها لا اللون */
  --select-arrow:   url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235B6472' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");   /* سهمُ القائمة المنسدلة — لونُه لونُ --ink-3 الفاتح، ولا يقرأ var() داخل صورة */
}

/* ═══════════════ ① من souqhb-theme.css ═══════════════ */

:root { --brand: var(--o-500); --brand-hi: var(--o-600); --brand-soft: var(--o-50); --ink: var(--g-900); --ink-2: var(--g-700); --ink-3: var(--g-600); --navy: #111827; --paper: var(--g-0); --rail-bg: #FFFFFF; --panel: var(--g-50); --panel-2: var(--g-100); --line: var(--g-200); --line-2: var(--g-300); --ok: #0E9E6B; --amber: #E0A81C; --crit: #D14343; --sc-l: #0159D3; --sc-d: #6AA8FF; --sc: var(--sc-l); --sc-soft: color-mix(in srgb, var(--sc) 9%, #FFFFFF); --pv: #D8642A; --pv-soft: #FDF1EA; --viz-base: #FBEEE6; --form-base: #FFFFFF; --sh-sm: 0 1px 2px rgba(16,24,40,.06); --sh-md: 0 1px 2px rgba(16,24,40,.06); --sh-lg: 0 8px 24px -8px rgba(16,24,40,.18); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --brand: var(--o-500); --brand-hi: var(--o-600); --brand-soft: var(--o-50); --ink: var(--g-900); --ink-2: var(--g-700); --ink-3: var(--g-600); --navy: #101215; --paper: var(--g-0); --rail-bg: #16181C; --panel: var(--g-50); --panel-2: var(--g-100); --line: var(--g-200); --line-2: var(--g-300); --ok: #2CC38C; --amber: #F0C23F; --crit: #EC6A6A; --sc: var(--sc-d); --sc-soft: color-mix(in srgb, var(--sc) 19%, #16181C); --pv: #F0793D; --pv-soft: #3A1D0E; --viz-base: #202328; --form-base: #16181C; --sh-sm: 0 1px 2px rgba(0,0,0,.4); --sh-md: 0 1px 2px rgba(0,0,0,.4); --sh-lg: 0 8px 24px -8px rgba(0,0,0,.7); }
}
:root[data-theme="dark"] { --brand: var(--o-500); --brand-hi: var(--o-600); --brand-soft: var(--o-50); --ink: var(--g-900); --ink-2: var(--g-700); --ink-3: var(--g-600); --navy: #101215; --paper: var(--g-0); --rail-bg: #16181C; --panel: var(--g-50); --panel-2: var(--g-100); --line: var(--g-200); --line-2: var(--g-300); --ok: #2CC38C; --amber: #F0C23F; --crit: #EC6A6A; --sc: var(--sc-d); --sc-soft: color-mix(in srgb, var(--sc) 19%, #16181C); --pv: #F0793D; --pv-soft: #3A1D0E; --viz-base: #202328; --form-base: #16181C; --sh-sm: 0 1px 2px rgba(0,0,0,.4); --sh-md: 0 1px 2px rgba(0,0,0,.4); --sh-lg: 0 8px 24px -8px rgba(0,0,0,.7); }
.store-setup { --brand: var(--o-500); --brand-hi: var(--o-600); --brand-soft: var(--o-50); --ink: var(--g-900); --ink-2: var(--g-700); --ink-3: var(--g-600); --navy: #111827; --paper: var(--g-0); --rail-bg: #FFFFFF; --panel: var(--g-50); --panel-2: var(--g-100); --line: var(--g-200); --line-2: var(--g-300); --ok: #0E9E6B; --amber: #E0A81C; --crit: #D14343; --pv: #D8642A; --pv-soft: #FDF1EA; --viz-base: #FBEEE6; --form-base: #FFFFFF; --sh-sm: 0 1px 2px rgba(16,24,40,.06); --sh-md: 0 1px 2px rgba(16,24,40,.06); --sh-lg: 0 8px 24px -8px rgba(16,24,40,.18); }
.store-setup:not([data-theme="light"]),
.store-setup[data-theme="dark"],
[data-theme="dark"] .store-setup { --brand: var(--o-500); --brand-hi: var(--o-600); --brand-soft: var(--o-50); --ink: var(--g-900); --ink-2: var(--g-700); --ink-3: var(--g-600); --navy: #101215; --paper: var(--g-0); --rail-bg: #16181C; --panel: var(--g-50); --panel-2: var(--g-100); --line: var(--g-200); --line-2: var(--g-300); --ok: #2CC38C; --amber: #F0C23F; --crit: #EC6A6A; --pv: #F0793D; --pv-soft: #3A1D0E; --viz-base: #202328; --form-base: #16181C; --sh-sm: 0 1px 2px rgba(0,0,0,.4); --sh-md: 0 1px 2px rgba(0,0,0,.4); --sh-lg: 0 8px 24px -8px rgba(0,0,0,.7); }
.store-setup[data-theme="light"] { --brand: var(--o-500); --brand-hi: var(--o-600); --brand-soft: var(--o-50); --ink: var(--g-900); --ink-2: var(--g-700); --ink-3: var(--g-600); --navy: #111827; --paper: var(--g-0); --rail-bg: #FFFFFF; --panel: var(--g-50); --panel-2: var(--g-100); --line: var(--g-200); --line-2: var(--g-300); --ok: #0E9E6B; --amber: #E0A81C; --crit: #D14343; --pv: #D8642A; --pv-soft: #FDF1EA; --viz-base: #FBEEE6; --form-base: #FFFFFF; --sh-sm: 0 1px 2px rgba(16,24,40,.06); --sh-md: 0 1px 2px rgba(16,24,40,.06); --sh-lg: 0 8px 24px -8px rgba(16,24,40,.18); }
.p-register .prog-track i,
.p-register .load-bar i,
.p-register .launch-bar i,
.store-setup .prog-track i,
.store-setup .load-bar i,
.store-setup .launch-bar i,
.store-setup .ready-tr > i { background: linear-gradient(90deg, var(--brand), var(--brand-glow)); }
.store-setup .map-me { color: var(--ink); }
.store-setup .map-me:hover { background: var(--panel-2); }
.p-register .avatar,
.store-setup .avatar { background: linear-gradient(145deg, var(--brand), var(--brand-glow)); }
.p-register .live-band,
.store-setup .live-band { background: linear-gradient(120deg, var(--band-deep), var(--band-mid) 55%, var(--brand)); }
.p-register .viz.rich,
.store-setup .viz.rich { background: radial-gradient(720px 500px at 80% 2%, var(--viz-halo), transparent 66%), radial-gradient(620px 460px at 4% 100%, var(--viz-shade), transparent 64%), linear-gradient(158deg, var(--viz-light-1) 0%, var(--viz-light-2) 100%); }
:root.p-register:not([data-theme="light"]) .viz.rich,
:root.p-register[data-theme="dark"] .viz.rich,
.store-setup:not([data-theme="light"]) .viz.rich,
.store-setup[data-theme="dark"] .viz.rich { background: radial-gradient(760px 520px at 80% 2%, var(--viz-halo-dark), transparent 66%), linear-gradient(158deg, var(--viz-deep-1), var(--viz-deep-2)); }
.store-setup .pbox,
.store-setup .result-box,
.store-setup .mock,
.store-setup .lp-card,
.store-setup .pane,
.store-setup .card { border-radius: 8px; }
.store-setup .notice,
.store-setup .drop,
.store-setup .viz,
.store-setup .result-ok,
.store-setup .hexbox { border-radius: 14px 14px 14px 4px; }
.store-setup .btn,
.store-setup .inp,
.store-setup .otp-b,
.store-setup textarea.inp,
.store-setup select.inp { border-radius: 11px 11px 11px 3px; }
.store-setup .cc { border-radius: 0px 11px 11px 0px; }
.store-setup .cc + .inp,
.store-setup .inp + .cc { border-radius: 11px 0px 0px 3px; }
.store-setup .tag,
.store-setup .plan-pill,
.store-setup .ok-pill,
.store-setup .badge { border-radius: 9px 9px 9px 3px; }
.store-setup .pick-r { border-radius: 13px 13px 13px 4px; }
.store-setup .sw { border-radius: 8px 8px 8px 2px; }
.store-setup .sw::after,
.store-setup .sw > i,
.store-setup .sw > span { border-radius: 5px 5px 5px 1px; }
.store-setup .ws > .ws-kick,
.store-setup .ws > .head2 { position: relative; background: var(--paper); border-inline: 1px solid var(--line); padding-inline: 32px 20px; }
.store-setup .ws > .ws-kick { border-top: 1px solid var(--line); border-radius: 16px 16px 0px 0px; padding-top: 16px; padding-bottom: 2px; margin-bottom: 0px; }
.store-setup .ws > .ws-kick::before,
.store-setup .ws > .head2::before { content: ""; position: absolute; inset-inline-start: 0px; width: 3px; background: var(--brand); }
.store-setup .ws > .ws-kick::before { top: 16px; bottom: 0px; }
.store-setup .pick-r:hover { border-color: var(--brand); }
.p-register .sb-br { border-radius: 8px; }
.p-register .sb-head,
.p-register .plan-card,
.p-register .pc { border-radius: 8px; }
.p-register .sb-br-up,
.p-register .btn,
.p-register .tbtn { border-radius: 11px 11px 11px 3px; }
.p-register .sb-tag,
.p-register .tag,
.p-register .pill { border-radius: 9px 9px 9px 3px; }
.p-register .inp,
.p-register input[type="text"],
.p-register input[type="email"],
.p-register input[type="tel"],
.p-register select,
.p-register textarea { border-radius: 11px 11px 11px 3px; }
.p-register .sb-br:hover { border-color: var(--line-2); }
[dir="rtl"] .store-setup .affix .pre + .inp,
[dir="rtl"] .store-setup .phone .inp { border-radius: 11px 0px 0px 3px; }
[dir="ltr"] .store-setup .affix .pre + .inp,
[dir="ltr"] .store-setup .phone .inp { border-radius: 0px 11px 3px 0px; }
[dir="rtl"] .store-setup .affix .pre,
[dir="rtl"] .store-setup .phone .cc { border-radius: 0px 11px 3px 0px; }
[dir="ltr"] .store-setup .affix .pre,
[dir="ltr"] .store-setup .phone .cc { border-radius: 11px 0px 0px 3px; }
.store-setup select.inp,
.store-setup select { appearance: none; background-image: var(--select-arrow); background-repeat: no-repeat; background-size: 14px 14px; padding-inline-end: 38px; }
[dir="rtl"] .store-setup select { background-position: left 14px center; }
[dir="ltr"] .store-setup select { background-position: right 14px center; }
.store-setup select:focus { outline: 2px solid var(--brand); outline-offset: 1px; }
.store-setup .dash-top { background: var(--paper); color: var(--ink); border-bottom: 1px solid var(--line); box-shadow: none; }
.store-setup .dash-top .brand img { filter: none; }
@media (prefers-color-scheme: dark) {
  .store-setup:not([data-theme="light"]) .dash-top .brand img { filter: brightness(0) invert(1); }
}
.store-setup[data-theme="dark"] .dash-top .brand img,
[data-theme="dark"] .store-setup .dash-top .brand img { filter: brightness(0) invert(1); }
.store-setup .dash-top .plan-pill { background: var(--paper); color: var(--ink-2); border: 1px solid var(--line-2); border-radius: 10px 10px 10px 3px; transition: border-color 0.15s, color 0.15s, background 0.15s; }
.store-setup .dash-top .plan-pill:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.store-setup .dash-top .plan-pill svg { opacity: 0.9; }
.store-setup .dash-top a[href*="subscription"] { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.store-setup .dash-top a[href*="subscription"]:hover { background: var(--brand); color: var(--on-accent); border-color: var(--brand); }
.store-setup .dash-top .ready { color: var(--ink-3); }
.store-setup .dash-top .ready b { color: var(--ink-2); }
.store-setup { font-family: "Readex Pro", "IBM Plex Sans Arabic", system-ui, sans-serif; background: var(--panel); color: var(--ink); }
.store-setup .dash { background: var(--panel); }
.store-setup .mono { font-family: "IBM Plex Mono", ui-monospace, monospace; font-variant-numeric: tabular-nums; }
.store-setup h1 { font-size: 24px; font-weight: 600; line-height: 1.3; color: var(--ink); }
.store-setup h2 { font-size: 17px; font-weight: 600; color: var(--ink); }
.store-setup .ws-kick { font-size: 12px; font-weight: 600; color: var(--brand); letter-spacing: 0.2px; }
.store-setup .lede,
.store-setup .pbox-lede { font-size: 13.4px; color: var(--ink-3); line-height: 1.8; }
.store-setup .pbox,
.store-setup .stepcard,
.store-setup .result-box,
.store-setup .quotecard { border: 1px solid var(--line); background: var(--paper); box-shadow: var(--sh-sm); }
.store-setup .pbox-h { font-size: 15.5px; font-weight: 600; color: var(--ink); }
.store-setup .notice { position: relative; border: 1px solid var(--line); background: var(--paper); box-shadow: var(--sh-sm); padding-inline-start: 18px; overflow: hidden; }
.store-setup .notice::before { content: ""; position: absolute; inset-inline-start: 0px; top: 0px; bottom: 0px; width: 4px; background: var(--amber); }
.store-setup .drop { border: 1.5px dashed var(--line-2); background: var(--panel); color: var(--ink-3); transition: border-color 0.15s, background 0.15s; }
.store-setup .drop:hover { border-color: var(--brand); background: var(--brand-soft); }
.store-setup .f > label,
.store-setup .f > .lbl { font-size: 13px; font-weight: 600; color: var(--ink); }
.store-setup .inp { border: 1px solid var(--line-2); background: var(--paper); color: var(--ink); font-family: inherit; font-size: 13.4px; transition: border-color 0.15s, box-shadow 0.15s; }
.store-setup .inp::placeholder { color: var(--ink-3); opacity: 0.75; }
.store-setup .inp:hover { border-color: var(--ink-3); }
.store-setup .inp:focus { border-color: var(--brand); outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 14%, transparent); }
.store-setup .affix .pre,
.store-setup .phone .cc { background: var(--panel-2); color: var(--ink-2); border: 1px solid var(--line-2); font-size: 12.8px; }
.store-setup .fine { font-size: 11.8px; color: var(--ink-3); line-height: 1.7; }
.store-setup .req { color: var(--crit); }
.store-setup .btn { font-family: inherit; font-size: 13.4px; font-weight: 600; border: 1px solid transparent; transition: 0.16s; box-shadow: none; }
.store-setup .btn-p { background: var(--brand); color: var(--on-accent); box-shadow: var(--brand-lift-85) 0px 8px 20px -10px; }
.store-setup .btn-p:hover { background: var(--brand-hi); }
.store-setup .btn-g { background: var(--paper); color: var(--ink-2); border-color: var(--line-2); }
.store-setup .btn-g:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.store-setup .btn:disabled,
.store-setup .btn[disabled] { opacity: 0.5; cursor: not-allowed; box-shadow: none; }
.store-setup .tag,
.store-setup .ok-pill { font-size: 11.6px; font-weight: 600; border: 1px solid var(--line); background: var(--panel-2); color: var(--ink-2); }
.store-setup .ok-pill { border-color: color-mix(in srgb, var(--ok) 38%, transparent); background: color-mix(in srgb, var(--ok) 9%, var(--paper)); color: var(--ok); }
.store-setup .chip { border: 1px solid var(--line-2); background: var(--paper); color: var(--ink-2); font-size: 12.4px; font-weight: 600; border-radius: 9px 9px 9px 3px; transition: 0.15s; }
.store-setup .chip:hover { border-color: var(--brand); color: var(--brand); }
.store-setup .chip.on,
.store-setup .chip[aria-pressed="true"] { border-color: var(--brand); background: var(--brand-soft); color: var(--brand); }
.store-setup .pick-r { border: 1px solid var(--line); background: var(--paper); transition: border-color 0.15s, background 0.15s, box-shadow 0.15s; }
.store-setup .pick-r:hover { border-color: var(--line-2); box-shadow: var(--sh-sm); }
.store-setup .pick-r.on,
.store-setup .pick-r[aria-checked="true"] { border-color: var(--brand); background: var(--brand-soft); }
.store-setup .pick-t { font-size: 13.4px; font-weight: 600; color: var(--ink); }
.store-setup .pick-s { font-size: 11.8px; color: var(--ink-3); }
.store-setup .otp-b { border: 1px solid var(--line-2); background: var(--paper); font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 19px; font-weight: 600; color: var(--ink); }
.store-setup .otp-b:focus { border-color: var(--brand); outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 14%, transparent); }
.store-setup .ws-acts { border: 1px solid var(--line); background: var(--paper); border-radius: 16px 16px 16px 5px; box-shadow: var(--sh-md); }
.store-setup .ws-acts.sticky { position: sticky; bottom: 12px; z-index: 20; }
.store-setup .lnk,
.store-setup .linkbtn { color: var(--brand); font-weight: 600; }
.store-setup .lnk:hover,
.store-setup .linkbtn:hover { color: var(--brand-hi); }
.store-setup .field-err,
.store-setup .otp-err { color: var(--crit); font-size: 11.8px; font-weight: 600; }
.store-setup .inp.err,
.store-setup .inp[aria-invalid="true"] { border-color: var(--crit); }
.store-setup .ws-acts { display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-end; gap: 10px; padding: 13px 16px; }
.store-setup .ws-acts .why { order: -1; flex: 1 1 auto; min-width: 0px; font-size: 11.8px; color: var(--ink-3); line-height: 1.6; }
.store-setup .ws-acts .btn { flex: 0 0 auto; white-space: nowrap; }
.store-setup .ws { padding-bottom: 18px; }
.store-setup .ws-acts.sticky { bottom: 14px; margin-top: 16px; }
@media (max-width: 640px) {
  .store-setup .ws-acts { flex-wrap: wrap; justify-content: stretch; }
  .store-setup .ws-acts .why { order: 0; flex: 1 0 100%; }
  .store-setup .ws-acts .btn { flex: 1 1 auto; }
}
.store-setup .rail { position: fixed; inset-block: 0px; inset-inline-start: 0px; width: 220px; z-index: 40; display: flex; flex-direction: column; overflow-y: auto; overscroll-behavior: contain; padding: 14px 10px 20px; background: var(--rail-bg); border-inline-end: 1px solid var(--line); transition: width 0.18s cubic-bezier(0.3, 0.85, 0.3, 1); }
.store-setup .rail::-webkit-scrollbar { width: 8px; }
.store-setup .rail::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: 99px; }
.store-setup .shell { padding-inline-start: 220px; transition: padding 0.18s cubic-bezier(0.3, 0.85, 0.3, 1); }
.store-setup.rail-collapsed .rail { width: 64px; }
.store-setup.rail-collapsed .shell { padding-inline-start: 64px; }
.store-setup.rail-collapsed .rail .cap,
.store-setup.rail-collapsed .rail .gh > span,
.store-setup.rail-collapsed .rail .cv,
.store-setup.rail-collapsed .rail .sub { display: none; }
.store-setup.rail-collapsed .rail .gh { justify-content: center; padding-inline: 0px; }
.store-setup .rail .cap { padding: 14px 12px 6px; font-size: 10.8px; font-weight: 600; letter-spacing: 0.4px; color: var(--ink-3); text-transform: none; }
.store-setup .rail .grp { margin-bottom: 1px; }
.store-setup .rail .gh { width: 100%; display: flex; align-items: center; gap: 10px; padding: 9px 12px; border: 0px; background: none; cursor: pointer; font-family: inherit; font-size: 13.4px; font-weight: 600; color: var(--ink-2); border-radius: 10px 10px 10px 3px; text-align: start; transition: background 0.14s, color 0.14s; }
.store-setup .rail .gh:hover { background: var(--panel); color: var(--ink); }
.store-setup .rail .gh.act { background: var(--brand-soft); color: var(--brand-ink); }
.store-setup .rail .gh svg { width: 18px; height: 18px; flex: 0 0 auto; }
.store-setup .rail .gh > span { flex: 1 1 0%; min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.store-setup .rail .gh .cv { flex: 0 0 auto; transition: transform 0.18s; }
.store-setup .rail .grp.open .gh .cv { transform: rotate(180deg); }
.store-setup .rail .sub { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.2s cubic-bezier(0.3, 0.85, 0.3, 1); }
.store-setup .rail .grp.open .sub { grid-template-rows: 1fr; }
.store-setup .rail .sub > div { overflow: hidden; }
.store-setup .rail .kids { display: flex; flex-direction: column; gap: 1px; padding: 3px 0px 5px; margin-inline-start: 18px; border-inline-start: 1px solid var(--line); }
.store-setup .rail .kid { padding: 7px 12px; font-size: 12.6px; color: var(--ink-3); border-radius: 8px 8px 8px 2px; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: background 0.14s, color 0.14s; }
.store-setup .rail .kid:hover { background: var(--panel); color: var(--ink-2); }
.store-setup .rail .kid.on { background: transparent; color: var(--brand-ink); font-weight: 500; }
/* ٩٢٠ لا ٩٠٠: نقطةُ ظهور شريط الجوّال وإزاحةِ الرفّ (القسم ② أدناه) هي ٩٢٠،
   فكانت ٩٠١–٩٢٠ ترفع الرفَّ وتُبقي مكانَه ٢٥٢px فارغاً. رصده فحصُ المقاسات،
   ٢٦ سبتمبر — والتعارضُ موروثٌ من الورقتين القديمتين. */
@media (max-width: 920px) {
  .store-setup .shell { padding-inline-start: 0px; }
  .store-setup .rail { transform: translateX(calc(var(--dir,-1) * 100%)); box-shadow: var(--sh-lg); }
  [dir="rtl"] .store-setup .rail { --dir: 1; }
  .store-setup.rail-open .rail { transform: translateX(0px); }
  .store-setup.rail-collapsed .shell { padding-inline-start: 0px; }
}
.store-setup .dash-top { position: sticky; top: 0px; z-index: 35; }
.store-setup .dash-nav { display: flex; align-items: center; gap: 12px; max-width: none; height: 56px; padding-inline: 18px; }
.store-setup .burger { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 10px 10px 10px 3px; background: var(--paper); color: var(--ink-2); cursor: pointer; transition: border-color 0.15s, color 0.15s; }
.store-setup .burger:hover { border-color: var(--brand); color: var(--brand); }
/* الاسمُ ينكمش ويُختصَر، والبحثُ لا ينزل تحت ١٢٠px — كان عند ٩٢١ بالإنجليزيّة
   يضيق إلى ٢٧px ثمّ تتجاوز الترويسةُ الشاشة. رصده فحصُ المقاسات، ٢٦ سبتمبر. */
.store-setup .crumb { display: flex; align-items: center; gap: 9px; flex: 0 1 auto; min-width: 0px; font-size: 13.6px; font-weight: 600; color: var(--ink); max-width: 230px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.store-setup .crumb::before { content: ""; width: 3px; height: 17px; border-radius: 99px; background: var(--brand); flex: 0 0 auto; }
.store-setup .crumb b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.store-setup .find { flex: 1 1 0%; min-width: 120px; display: flex; align-items: center; gap: 9px; height: 36px; padding-inline: 13px; border: 1px solid var(--line); border-radius: 11px 11px 11px 3px; background: var(--panel); color: var(--ink-3); transition: border-color 0.15s, background 0.15s; }
.store-setup .find:focus-within { border-color: var(--brand); background: var(--paper); }
.store-setup .find input { flex: 1 1 0%; min-width: 0px; border: 0px; background: none; outline: none; font-family: inherit; font-size: 13px; color: var(--ink); }
.store-setup .find input::placeholder { color: var(--ink-3); }
.store-setup .find kbd { flex: 0 0 auto; padding: 3px 7px; border: 1px solid var(--line-2); border-radius: 7px 7px 7px 2px; background: var(--paper); font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 10.5px; color: var(--ink-3); }
.store-setup .bar-r { display: flex; align-items: center; gap: 7px; flex: 0 0 auto; }
.store-setup .bar-r .ic { position: relative; display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 10px 10px 10px 3px; background: var(--paper); color: var(--ink-2); cursor: pointer; text-decoration: none; transition: border-color 0.15s, color 0.15s, background 0.15s; }
.store-setup .bar-r .ic:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.store-setup .bar-r .ic-sub { width: auto; gap: 7px; padding-inline: 11px; grid-auto-flow: column; align-items: center; border-color: var(--brand); color: var(--brand); background: var(--brand-soft); font-size: 12.8px; font-weight: 600; white-space: nowrap; }
.store-setup .bar-r .ic-sub:hover { background: var(--brand); color: var(--on-accent); }
.store-setup .bar-r .ic-ready::after { content: ""; position: absolute; inset: -1px; border-radius: inherit; background: conic-gradient(var(--brand) calc(var(--pct,0) * 1%), transparent 0); mask: linear-gradient(var(--mask-solid) 0px, var(--mask-solid) 0px) content-box exclude, linear-gradient(var(--mask-solid) 0px, var(--mask-solid) 0px); padding: 2px; pointer-events: none; }
/* 1108 — شارةُ «متجر موثَّق ✓» مكانَ حلقة الجاهزيّة: خضراءُ بختمٍ ولمعةٍ مرّتين عند الفتح */
.store-setup .bar-r .ic-verified { position: relative; overflow: hidden; display: inline-flex; align-items: center; gap: 6px; height: 36px; padding-inline: 11px 13px; border-radius: 999px; white-space: nowrap; font-size: 12.8px; font-weight: 600; color: var(--ok, #12805c); background: color-mix(in srgb, var(--ok, #12805c) 12%, var(--paper, #fff)); border: 1px solid color-mix(in srgb, var(--ok, #12805c) 38%, transparent); box-shadow: 0 0 0 0 color-mix(in srgb, var(--ok, #12805c) 35%, transparent); animation: vfGlow 1.6s ease-out 2; }
.store-setup .bar-r .ic-verified svg { flex: 0 0 auto; color: var(--ok, #12805c); }
.store-setup .bar-r .ic-verified::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%); transform: translateX(-120%); animation: vfShine 1.6s ease-out .3s 2; pointer-events: none; }
@keyframes vfGlow { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--ok, #12805c) 40%, transparent); } 100% { box-shadow: 0 0 0 8px transparent; } }
@keyframes vfShine { to { transform: translateX(120%); } }
@media (max-width: 560px) { .store-setup .bar-r .ic-verified span { display: none; } .store-setup .bar-r .ic-verified { padding-inline: 9px; } }
@media (prefers-reduced-motion: reduce) { .store-setup .bar-r .ic-verified, .store-setup .bar-r .ic-verified::after { animation: none; } }
.store-setup .rail-top { display: flex; align-items: center; height: 56px; padding-inline: 10px; margin-bottom: 6px; }
.store-setup .rail-top .mark { display: flex; align-items: center; width: 100%; padding: 5px 8px; border-radius: 11px 11px 11px 3px; transition: background 0.15s; }
.store-setup .rail-top .mark:hover { background: var(--panel); }
.store-setup .rail-top img { height: 34px; width: auto; filter: none; }
.store-setup.rail-collapsed .rail-top img { height: 26px; }
@media (prefers-color-scheme: dark) {
  .store-setup:not([data-theme="light"]) .rail-top img { filter: brightness(0) invert(1); }
}
.store-setup[data-theme="dark"] .rail-top img,
[data-theme="dark"] .store-setup .rail-top img { filter: brightness(0) invert(1); }
@media (max-width: 860px) {
  .store-setup .crumb { display: none; }
  .store-setup .bar-r .ic-sub span { display: none; }
  .store-setup .bar-r .ic-sub { width: 34px; padding-inline: 0px; }
  .store-setup .find kbd { display: none; }
}
.store-setup .ws > .grp-t,
.store-setup .ws > .grid2,
.store-setup .ws > .grid3,
.store-setup .ws > .f,
.store-setup .ws > .pbox,
.store-setup .ws > .picks,
.store-setup .ws > .subs { background: var(--paper); border-inline: 1px solid var(--line); border-radius: 0px; margin: 0px; box-shadow: none; padding: 12px 22px; }
.store-setup .ws > .grp-t { padding-top: 22px; padding-bottom: 4px; }
.store-setup .ws > .grp-t b { display: block; font-size: 16.5px; font-weight: 600; color: var(--ink); }
.store-setup .ws > .grp-t span { display: block; margin-top: 4px; font-size: 12.6px; color: var(--ink-3); }
.store-setup .ws > .grp-t:not(:first-of-type) { border-top: 1px solid var(--line); margin-top: 10px; }
.store-setup .ws > .grp-t:first-of-type { border-top: 1px solid var(--line); border-radius: 16px 16px 0px 0px; }
.store-setup .ws > .f:last-of-type,
.store-setup .ws > .pbox:last-of-type { border-bottom: 1px solid var(--line); border-radius: 0px 0px 16px 5px; padding-bottom: 22px; margin-bottom: 20px; box-shadow: var(--sh-sm); }
.store-setup .ws > .pbox:not(:last-of-type) { padding-block: 16px; }
.store-setup .f { display: flex; flex-direction: column; gap: 7px; }
.store-setup .f > * { order: 2; }
.store-setup .f > label { order: 1; margin: 0px; }
.store-setup .f > .sub { order: 3; margin: 0px; font-size: 11.8px; color: var(--ink-3); line-height: 1.7; }
.store-setup .grid2,
.store-setup .grid3 { grid-template-columns: 1fr; gap: 14px; }
.store-setup .ws > .ws-kick { padding-bottom: 4px; }
.store-setup .ws-acts { border-color: var(--brand); }
.store-setup .ws-acts .why { color: var(--brand); }
.store-setup .drop { padding: 22px 18px; }
.store-setup .tabbar,
.store-setup #souqTabbar { background: var(--paper); color: var(--ink-2); border-top: 1px solid var(--line); }
.store-setup .tabbar .tb { color: var(--ink-3); }
.store-setup .tabbar .tb:hover,
.store-setup .tabbar .tb.on { color: var(--brand); }
.store-setup .rail-foot { margin-top: auto; padding: 10px 6px 4px; border-top: 1px solid var(--line); }
.store-setup .rail-foot .user { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 9px; border-radius: 11px 11px 11px 3px; background: var(--panel); margin-bottom: 8px; }
.store-setup .rail-foot .av { display: grid; place-items: center; width: 32px; height: 32px; flex: 0 0 auto; border-radius: 10px 10px 10px 3px; background: linear-gradient(145deg,var(--brand),var(--brand-glow)); color: var(--on-accent); font-weight: 600; font-size: 14px; }
.store-setup .rail-foot .t { display: flex; flex-direction: column; min-width: 0px; line-height: 1.35; }
.store-setup .rail-foot .t b { font-size: 12.6px; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.store-setup .rail-foot .t span { font-size: 11px; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.store-setup .rail-foot .langbtn { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; padding: 8px 10px; border: 1px solid var(--line-2); border-radius: 10px 10px 10px 3px; background: var(--paper); color: var(--ink-2); font-size: 12.4px; font-weight: 600; text-decoration: none; transition: border-color 0.15s, color 0.15s, background 0.15s; }
.store-setup .rail-foot .langbtn:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.store-setup.rail-collapsed .rail-foot .t,
.store-setup.rail-collapsed .rail-foot .langbtn { font-size: 0px; gap: 0px; }
.store-setup.rail-collapsed .rail-foot .langbtn svg { width: 16px; height: 16px; }
.store-setup.rail-collapsed .rail-foot .user { justify-content: center; padding-inline: 0px; }
.store-setup .ws > .mapbox,
.store-setup .ws > .addr,
.store-setup .ws > .tabwrap { background: var(--paper); border-inline: 1px solid var(--line); border-radius: 0px; margin: 0px; box-shadow: none; padding: 14px 22px; }
.store-setup .addr > .f,
.store-setup .addr > .grid2,
.store-setup .addr > .grid3,
.store-setup .tabwrap > .f,
.store-setup .tabwrap > .grid2 { background: none; border: 0px; border-radius: 0px; padding: 0px; margin: 0px 0px 14px; box-shadow: none; }
.store-setup .addr > :last-child,
.store-setup .tabwrap > :last-child { margin-bottom: 0px; }
.store-setup .ws > .addr:last-of-type,
.store-setup .ws > .mapbox:last-of-type,
.store-setup .ws > .picks:last-of-type,
.store-setup .ws > .subs:last-of-type,
.store-setup .ws > .grid2:last-of-type { border-bottom: 1px solid var(--line); border-radius: 0px 0px 16px 5px; padding-bottom: 20px; margin-bottom: 20px; box-shadow: var(--sh-sm); }
.store-setup #map,
.store-setup .mapbox #map { border-radius: 12px 12px 12px 4px; overflow: hidden; }
.store-setup .mapw-read { margin-top: 10px; font-size: 12px; color: var(--ink-3); text-align: center; }
.store-setup .ws > .subs { border-top: 1px solid var(--line); border-radius: 16px 16px 0px 0px; padding: 16px 22px 12px; }
.store-setup .ws > .v-step { background: var(--paper); border: 1px solid var(--line); border-top: 0; border-radius: 0 0 16px 5px; padding: 18px 22px 22px; margin-bottom: 20px; box-shadow: var(--sh-sm); }
.store-setup .v-step > .f,
.store-setup .v-step > .grid2,
.store-setup .v-step > .grid3 { background: none; border: 0px; border-radius: 0px; padding: 0px; margin: 0px 0px 14px; box-shadow: none; }
.store-setup .v-step > :last-child { margin-bottom: 0px; }
.store-setup .v-step .grp-t { padding-inline: 0px; border: 0px; background: none; }
.store-setup .v-step .grp-t:not(:first-child) { border-top: 1px solid var(--line); padding-top: 18px; margin-top: 16px; }
html:not([data-theme="dark"]) body { background: radial-gradient(900px 520px at 100% 0, color-mix(in srgb, var(--brand) 1%, transparent), transparent 72%), var(--page-light); }
html[data-theme="dark"] body { background: radial-gradient(900px 520px at 100% 0, color-mix(in srgb, var(--brand) 3%, transparent), transparent 72%), var(--page-dark); }
.store-setup { min-height: 100dvh; }
.store-setup .scrollx { scrollbar-width: thin; scrollbar-color: var(--line-2) var(--panel-2); padding-bottom: 2px; }
.store-setup .scrollx::-webkit-scrollbar { height: 10px; }
.store-setup .scrollx::-webkit-scrollbar-track { background: var(--panel-2); border-radius: 8px; }
.store-setup .scrollx::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: 8px; border: 2px solid var(--panel-2); }
.store-setup .scrollx::-webkit-scrollbar-thumb:hover { background: var(--ink-3); }
.store-setup .rail,
.store-setup #souqRail { overflow-x: hidden; }
.store-setup .hi { display: block; margin-bottom: 20px; }
.store-setup .hi > div { max-width: 70ch; }
.store-setup .hi .ws-kick { display: block; font-size: 12.5px; font-weight: 600; color: var(--brand); margin-bottom: 7px; }
.store-setup .hi h1 { font-size: 25px; margin-bottom: 8px; }
.store-setup .hi p { font-size: 13.8px; color: var(--ink-2); line-height: 1.85; margin: 0px; }
.store-setup .stepcard { background: var(--paper); border: 1px solid var(--line); border-radius: 20px 20px 20px 6px; box-shadow: var(--sh-sm); overflow: hidden; }
.store-setup .grp-sec { padding: 20px 22px; }
.store-setup .grp-sec + .grp-sec { border-top: 1px solid var(--line); }
.store-setup .grp-h { margin-bottom: 16px; }
.store-setup .grp-h b { font-family: "Readex Pro", "IBM Plex Sans Arabic", system-ui, sans-serif; font-size: 15px; font-weight: 600; display: block; color: var(--ink); }
.store-setup .grp-h span { font-size: 12.6px; color: var(--ink-3); display: block; margin-top: 2px; }
.store-setup .grp-note { font-size: 12.4px; color: var(--ink-2); background: var(--panel); border: 1px solid var(--line); border-radius: 11px 11px 11px 3px; padding: 11px 14px; margin-top: 16px; line-height: 1.75; }
@media (max-width: 700px) {
  .store-setup .grp-sec { padding: 16px 14px; }
}
.store-setup .form.plain { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 18px; padding: 0px; background: none; border: 0px; }
.store-setup .form.plain .fld.full { grid-column: 1 / -1; }
.store-setup .fld { display: block; }
.store-setup .fld label { display: block; font-size: 13px; font-weight: 600; margin: 0px 0px 7px; color: var(--ink); }
.store-setup .fld .req { color: var(--crit); font-style: normal; font-weight: 600; }
.store-setup .fld .opt { font-style: normal; font-size: 11px; font-weight: 500; color: var(--ink-3); padding: 1px 7px; border-radius: 99px; background: var(--panel-2); margin-inline-start: 5px; }
.store-setup .fld .fh { font-size: 11.8px; color: var(--ink-3); margin: 6px 0px 0px; line-height: 1.55; }
.store-setup .fld.full .inp:not(textarea),
.store-setup .fld.full .in:not(textarea) { max-width: 520px; }
.store-setup .fld.full textarea { max-width: 660px; }
@media (max-width: 700px) {
  .store-setup .form.plain { grid-template-columns: 1fr; }
  .store-setup .fld.full .inp:not(textarea),
  .store-setup .fld.full .in:not(textarea),
  .store-setup .fld.full textarea { max-width: 100%; }
}
.store-setup .savebar { position: sticky; bottom: 0px; z-index: 15; display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding: 13px 18px; margin-top: 14px; background: var(--paper); border: 1px solid var(--line); border-radius: 14px 14px 14px 4px; box-shadow: var(--sh-md); font-size: 13px; }
.store-setup .savebar.on { border-color: var(--brand); }
.store-setup .savebar .selN { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--brand); }
.store-setup .savebar .sb-acts { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
@media (max-width: 640px) {
  .store-setup .savebar { flex-direction: column; align-items: stretch; gap: 10px; }
  .store-setup .savebar .sb-acts { justify-content: stretch; }
  .store-setup .savebar .sb-acts > * { flex: 1 1 0%; }
}
.store-setup .fld label .opt,
.store-setup .fld label .req { display: inline-block; width: auto; vertical-align: middle; }
.store-setup .fld label .opt { font-style: normal; font-size: 11px; font-weight: 500; color: var(--ink-3); padding: 1px 8px; border-radius: 99px; background: var(--panel-2); margin-inline-start: 5px; }
.store-setup .ws.sc-body { padding-bottom: 18px; }
.store-setup .stepcard .grp-sec:last-child { padding-bottom: 24px; }
.store-setup .ws { max-width: none; margin-inline: 0px; padding-inline: 0px; }
.store-setup .fld.full .inp:not(textarea),
.store-setup .fld.full .in:not(textarea),
.store-setup .fld.full textarea { max-width: none; }
.store-setup .stepcard .fld.full .inp,
.store-setup .stepcard .fld.full .in,
.store-setup .stepcard .fld.full textarea,
.store-setup .stepcard .fld .inp,
.store-setup .stepcard .fld .in { max-width: none; width: 100%; }


/* ═══════════════ ② من souqhb-app.css ═══════════════ */

:root:where(:has(.store-setup)) { --brand: var(--o-500); --brand-hi: var(--o-600); --brand-soft: var(--o-50); --or-08: rgba(216,100,42,.08); --or-24: rgba(216,100,42,.24); --or-dp: #A84E1F; --ink: var(--g-900); --ink-2: var(--g-700); --ink-3: var(--g-600); --paper: var(--g-0); --panel: var(--g-50); --panel-2: var(--g-100); --sunk: #F1F3F4; --in: inset 0 1px 3px rgba(16,24,40,.07); --line: var(--g-200); --line-2: var(--g-300); --ok: #0E9E6B; --ok-08: rgba(14,158,107,.10); --amber: #E0A81C; --crit: #D14343; --rail: 220px; --r: 14px; --r-lg: 20px; --sh1: 0 1px 2px rgba(16,24,40,.05),0 2px 8px rgba(16,24,40,.04); --sh2: 0 14px 36px -18px rgba(16,24,40,.22),0 2px 8px rgba(16,24,40,.05); --sh3: 0 2px 4px rgba(16,24,40,.06),0 12px 24px -8px rgba(16,24,40,.17),0 34px 64px -28px rgba(16,24,40,.32); --fd: "Readex Pro","IBM Plex Sans Arabic",system-ui,sans-serif; --fb: "IBM Plex Sans Arabic","Readex Pro",system-ui,sans-serif; --fm: "IBM Plex Mono",ui-monospace,monospace; --ease: cubic-bezier(.3,.85,.3,1); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):where(:has(.store-setup)) { --brand: var(--o-500); --brand-hi: var(--o-600); --brand-soft: var(--o-50); --or-08: rgba(240,121,61,.12); --or-24: rgba(240,121,61,.28); --or-dp: #FFA470; --ink: var(--g-900); --ink-2: var(--g-700); --ink-3: var(--g-600); --paper: var(--g-0); --panel: var(--g-50); --panel-2: var(--g-100); --sunk: #101215; --in: inset 0 1px 3px rgba(0,0,0,.5); --line: var(--g-200); --line-2: var(--g-300); --ok-08: rgba(44,195,140,.14); --ok: #2CC38C; --sh1: 0 1px 2px rgba(0,0,0,.5); --sh2: 0 14px 38px -18px rgba(0,0,0,.8); --sh3: 0 2px 4px rgba(0,0,0,.6),0 12px 26px -8px rgba(0,0,0,.72),0 34px 64px -28px rgba(0,0,0,.9); }
}
:root[data-theme="dark"]:where(:has(.store-setup)) { --brand: var(--o-500); --brand-hi: var(--o-600); --brand-soft: var(--o-50); --or-08: rgba(240,121,61,.12); --or-24: rgba(240,121,61,.28); --or-dp: #FFA470; --ink: var(--g-900); --ink-2: var(--g-700); --ink-3: var(--g-600); --paper: var(--g-0); --panel: var(--g-50); --panel-2: var(--g-100); --sunk: #101215; --in: inset 0 1px 3px rgba(0,0,0,.5); --line: var(--g-200); --line-2: var(--g-300); --ok-08: rgba(44,195,140,.14); --ok: #2CC38C; --sh1: 0 1px 2px rgba(0,0,0,.5); --sh2: 0 14px 38px -18px rgba(0,0,0,.8); --sh3: 0 2px 4px rgba(0,0,0,.6),0 12px 26px -8px rgba(0,0,0,.72),0 34px 64px -28px rgba(0,0,0,.9); }
.av:where(.store-setup, .store-setup *) { width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(145deg,var(--brand),var(--brand-glow)); display: grid; place-items: center; font-family: var(--fd); font-weight: 600; font-size: 14px; color: var(--on-accent); flex: 0 0 auto; }
.user:where(.store-setup, .store-setup *) .t { min-width: 0px; display: flex; flex-direction: column; line-height: 1.3; }
.user:where(.store-setup, .store-setup *) .t b { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user:where(.store-setup, .store-setup *) .t span { font-size: 11px; color: var(--ink-3); }
.plan:where(.store-setup, .store-setup *) { margin-inline-start: auto; font-size: 10.4px; font-family: var(--fm); padding: 2px 8px; border-radius: 99px; background: var(--or-08); color: var(--or-dp); flex: 0 0 auto; }
.tog:where(.store-setup, .store-setup *) { display: flex; gap: 6px; margin-top: 6px; }
.tog:where(.store-setup, .store-setup *) button { flex: 1 1 0%; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 8px; border-radius: 10px; border: 1px solid var(--line); font-size: 12px; font-weight: 500; color: var(--ink-2); transition: 0.15s; background: var(--paper); }
.tog:where(.store-setup, .store-setup *) button:hover { border-color: var(--brand); color: var(--brand); }
*:where(.store-setup, .store-setup *),
:where(.store-setup, .store-setup *)::before,
:where(.store-setup, .store-setup *)::after { box-sizing: border-box; }
html:where(:has(.store-setup)),
body:where(:has(.store-setup)) { margin: 0px; padding: 0px; height: 100%; }
body:where(:has(.store-setup)) { background: var(--panel); color: var(--ink); font-family: var(--fb); font-size: 15px; line-height: 1.7; -webkit-font-smoothing: antialiased; }
h1:where(.store-setup, .store-setup *),
h2:where(.store-setup, .store-setup *),
h3:where(.store-setup, .store-setup *) { font-family: var(--fd); font-weight: 600; margin: 0px; line-height: 1.25; text-wrap: balance; }
p:where(.store-setup, .store-setup *) { margin: 0px; }
button:where(.store-setup, .store-setup *),
a:where(.store-setup, .store-setup *) { font-family: inherit; cursor: pointer; border: 0px; background: none; color: inherit; text-decoration: none; }
svg:where(.store-setup, .store-setup *) { display: block; }
:focus-visible:where(.store-setup, .store-setup *) { outline: 2.5px solid var(--brand); outline-offset: 3px; border-radius: 6px; }
[hidden]:where(.store-setup, .store-setup *) { display: none !important; }
.rail:where(.store-setup, .store-setup *) { grid-column: 1; background: var(--paper); border-inline-start: 1px solid var(--line); display: flex; flex-direction: column; height: 100dvh; position: sticky; top: 0px; min-height: 0px; z-index: 40; }
.rail-top:where(.store-setup, .store-setup *) { padding: 18px 14px 14px; flex: 0 0 auto; border-bottom: 1px solid var(--line); min-height: 76px; }
.mark:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 4px; border-radius: 12px; transition: background 0.16s; }
.mark:hover:where(.store-setup, .store-setup *) { background: var(--panel); }
.mark:where(.store-setup, .store-setup *) img { height: 42px; width: auto; flex: 0 0 auto; }
.grp:where(.store-setup, .store-setup *) { border-radius: 13px; margin-bottom: 2px; transition: background .18s var(--ease); }
.grp.open:where(.store-setup, .store-setup *) { background: var(--panel); box-shadow: var(--sh1); }
.gh:where(.store-setup, .store-setup *) { width: 100%; display: flex; align-items: center; gap: 10px; padding: 10px 11px; border-radius: 13px; font-size: 13.8px; font-weight: 500; color: var(--ink-2); transition: color 0.15s, background 0.15s; text-align: start; }
.gh:hover:where(.store-setup, .store-setup *) { color: var(--ink); background: var(--panel-2); }
.grp.open:where(.store-setup, .store-setup *) .gh { color: var(--ink); font-weight: 600; }
.gh:where(.store-setup, .store-setup *) > svg:not(.cv) { width: 18px; height: 18px; flex: 0 0 auto; color: var(--ink-3); }
.grp.open:where(.store-setup, .store-setup *) .gh > svg:not(.cv) { color: var(--brand); }
.gh:where(.store-setup, .store-setup *) .cv { margin-inline-start: auto; transition: transform .22s var(--ease); opacity: 0.55; }
.grp.open:where(.store-setup, .store-setup *) .gh .cv { transform: rotate(180deg); opacity: 1; }
.gh.act:where(.store-setup, .store-setup *) { background: var(--or-08); color: var(--or-dp); font-weight: 600; box-shadow: inset 0 0 0 1px var(--or-24); }
.gh.act:where(.store-setup, .store-setup *) > svg:not(.cv) { color: var(--brand); }
.sub:where(.store-setup, .store-setup *) { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .24s var(--ease); }
.grp.open:where(.store-setup, .store-setup *) .sub { grid-template-rows: 1fr; }
.sub:where(.store-setup, .store-setup *) > div { overflow: hidden; min-height: 0px; }
.kids:where(.store-setup, .store-setup *) { margin: 0px 9px 9px; padding: 7px 8px; border-radius: 10px; background: var(--sunk); box-shadow: var(--in); display: flex; flex-direction: column; gap: 1px; position: relative; }
.kids:where(.store-setup, .store-setup *)::before { content: ""; position: absolute; inset-block: 13px; inset-inline-end: 15px; width: 1.5px; background: var(--line-2); border-radius: 2px; }
.kid:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 8px; padding: 7px 27px 7px 10px; border-radius: 8px; font-size: 12.6px; color: var(--ink-2); transition: 0.14s; position: relative; text-align: start; }
.kid:where(.store-setup, .store-setup *)::after { content: ""; position: absolute; inset-inline-end: 15px; top: 50%; width: 9px; height: 1.5px; background: var(--line-2); transform: translateY(-50%); transition: background 0.14s; }
.kid:hover:where(.store-setup, .store-setup *) { background: var(--paper); color: var(--ink); }
.kid:hover:where(.store-setup, .store-setup *)::after { background: var(--ink-3); }
.kid.on:where(.store-setup, .store-setup *) { background: var(--brand); color: var(--on-accent); font-weight: 600; box-shadow: var(--brand-lift-90) 0px 4px 12px -6px; }
.kid.on:where(.store-setup, .store-setup *)::after { background: var(--brand); }
.kid:where(.store-setup, .store-setup *) .n { margin-inline-start: auto; font-family: var(--fm); font-size: 10.6px; color: var(--ink-3); }
.kid.on:where(.store-setup, .store-setup *) .n { color: var(--on-accent-82); }
.dot:where(.store-setup, .store-setup *) { width: 6px; height: 6px; border-radius: 50%; background: var(--brand); flex: 0 0 auto; }
.cap:where(.store-setup, .store-setup *) { font-family: var(--fd); font-size: 11.6px; font-weight: 600; color: var(--ink-2); letter-spacing: 0px; padding: 16px 13px 6px; user-select: none; display: flex; align-items: center; gap: 8px; }
.cap:where(.store-setup, .store-setup *)::after { content: ""; flex: 1 1 0%; height: 1px; background: var(--line); }
.rail-foot:where(.store-setup, .store-setup *) { flex: 0 0 auto; padding: 10px; border-top: 1px solid var(--line); }
.user:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px; border-radius: 12px; transition: background 0.16s; text-align: start; }
.user:hover:where(.store-setup, .store-setup *) { background: var(--panel); }
.av:where(.store-setup, .store-setup *) { width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(145deg,var(--brand),var(--brand-glow)); display: grid; place-items: center; font-family: var(--fd); font-weight: 600; font-size: 14px; color: var(--on-accent); flex: 0 0 auto; }
.user:where(.store-setup, .store-setup *) .t { min-width: 0px; display: flex; flex-direction: column; line-height: 1.3; }
.user:where(.store-setup, .store-setup *) .t b { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user:where(.store-setup, .store-setup *) .t span { font-size: 11px; color: var(--ink-3); }
.plan:where(.store-setup, .store-setup *) { margin-inline-start: auto; font-size: 10.4px; font-family: var(--fm); padding: 2px 8px; border-radius: 99px; background: var(--or-08); color: var(--or-dp); flex: 0 0 auto; }
.tog:where(.store-setup, .store-setup *) { display: flex; gap: 6px; margin-top: 6px; }
.tog:where(.store-setup, .store-setup *) button { flex: 1 1 0%; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 8px; border-radius: 10px; border: 1px solid var(--line); font-size: 12px; font-weight: 500; color: var(--ink-2); transition: 0.15s; background: var(--paper); }
.tog:where(.store-setup, .store-setup *) button:hover { border-color: var(--brand); color: var(--brand); }
.bar-in:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 12px; padding: 11px 24px; max-width: 1500px; margin-inline: auto; }
.burger:where(.store-setup, .store-setup *) { display: none; width: 38px; height: 38px; border-radius: 11px; place-items: center; color: var(--ink-2); border: 1px solid var(--line); background: var(--panel); }
.crumb:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; padding: 7px 14px 7px 11px; border-radius: 12px; background: var(--panel); border: 1px solid var(--line); }
.crumb:where(.store-setup, .store-setup *)::before { content: ""; width: 4px; height: 20px; border-radius: 99px; background: var(--brand); flex: 0 0 auto; }
.crumb:where(.store-setup, .store-setup *) b { font-family: var(--fd); font-size: 14.6px; font-weight: 600; color: var(--ink); white-space: nowrap; }
.find:where(.store-setup, .store-setup *) { flex: 1 1 0%; min-width: 0px; margin-inline-end: 4px; display: flex; align-items: center; gap: 11px; padding: 10px 16px; border-radius: 11px; background: var(--paper); border: 1px solid var(--line-2); box-shadow: var(--sh1); color: var(--ink-3); font-size: 13.4px; transition: border-color 0.16s, box-shadow 0.16s; }
.find:hover:where(.store-setup, .store-setup *) { border-color: var(--ink-3); }
.find:focus-within:where(.store-setup, .store-setup *) { border-color: var(--brand); box-shadow: 0 0 0 4px var(--or-08); }
.find:where(.store-setup, .store-setup *) > svg { flex: 0 0 auto; }
.find:where(.store-setup, .store-setup *) input { flex: 1 1 0%; min-width: 0px; border: 0px; background: none; outline: none; font-family: inherit; font-size: 13.2px; color: var(--ink); text-overflow: ellipsis; }
.find:where(.store-setup, .store-setup *) kbd { font-family: var(--fm); font-size: 10.2px; border: 1px solid var(--line-2); border-bottom-width: 2px; border-radius: 5px; padding: 1px 6px; color: var(--ink-3); flex: none; white-space: nowrap; }
.bar-r:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 2px; flex: 0 0 auto; padding: 3px; border-radius: 13px; background: var(--panel); border: 1px solid var(--line); }
.ic:where(.store-setup, .store-setup *) { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; color: var(--ink-2); border: 1px solid transparent; transition: 0.15s; position: relative; }
.ic:hover:where(.store-setup, .store-setup *) { background: var(--paper); border-color: var(--line); color: var(--ink); }
.hi:where(.store-setup, .store-setup *) { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin-bottom: 20px; }
.hi:where(.store-setup, .store-setup *) h1 { font-size: 25px; }
.hi:where(.store-setup, .store-setup *) p { font-size: 13.6px; color: var(--ink-3); margin-top: 3px; }
.btn:where(.store-setup, .store-setup *) { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 17px; border-radius: 11px; font-size: 13.6px; font-weight: 600; transition: 0.16s; border: 1px solid transparent; white-space: nowrap; }
.btn.acc:where(.store-setup, .store-setup *) { background: var(--brand); color: var(--on-accent); box-shadow: var(--brand-lift-85) 0px 8px 20px -10px; }
.btn.acc:hover:where(.store-setup, .store-setup *) { background: var(--brand-hi); }
.btn.gho:where(.store-setup, .store-setup *) { border-color: var(--line-2); color: var(--ink-2); background: var(--paper); }
.btn.gho:hover:where(.store-setup, .store-setup *) { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.btn.sm:where(.store-setup, .store-setup *) { padding: 7px 13px; font-size: 12.6px; border-radius: 9px; }
.note:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; background: var(--paper); border: 1px solid var(--line); border-inline-start: 3px solid var(--amber); border-radius: var(--r); padding: 15px 18px; margin-bottom: 20px; box-shadow: var(--sh1); }
.note:where(.store-setup, .store-setup *) b { font-family: var(--fd); font-size: 14.4px; display: block; }
.note:where(.store-setup, .store-setup *) p { font-size: 13.2px; color: var(--ink-2); margin-top: 1px; }
.trip:where(.store-setup, .store-setup *) { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 20px 22px 8px; box-shadow: var(--sh1); margin-bottom: 18px; overflow: hidden; }
.trip-h:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 20px; flex-wrap: wrap; }
.trip-h:where(.store-setup, .store-setup *) h2 { font-size: 17px; }
.trip-h:where(.store-setup, .store-setup *) .sub { font-size: 13px; color: var(--ink-3); margin-top: 2px; }
.road:where(.store-setup, .store-setup *) { display: flex; gap: 0px; position: relative; padding-bottom: 10px; overflow-x: auto; scrollbar-width: none; }
.road:where(.store-setup, .store-setup *)::-webkit-scrollbar { display: none; }
.stop:where(.store-setup, .store-setup *) { flex: 1 1 0%; min-width: 132px; position: relative; display: flex; flex-direction: column; align-items: center; gap: 9px; padding: 0px 6px; text-align: center; background: none; }
.stop:where(.store-setup, .store-setup *)::before { content: ""; position: absolute; top: 17px; inset-inline-start: 50%; width: 100%; height: 2.5px; background: var(--line); border-radius: 2px; }
.stop:last-child:where(.store-setup, .store-setup *)::before { display: none; }
.stop.done:where(.store-setup, .store-setup *)::before { background: var(--ok); }
.stop:where(.store-setup, .store-setup *) .pin { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto; z-index: 1; border: 2.5px solid var(--line); background: var(--paper); font-family: var(--fm); font-size: 12.6px; color: var(--ink-3); transition: .2s var(--ease); }
.stop.done:where(.store-setup, .store-setup *) .pin { background: var(--ok); border-color: var(--ok); color: var(--on-accent); }
.stop.now:where(.store-setup, .store-setup *) .pin { border-color: var(--brand); color: var(--brand); box-shadow: 0 0 0 5px var(--or-08); }
.stop:where(.store-setup, .store-setup *) .nm { font-size: 12.8px; font-weight: 600; color: var(--ink-2); line-height: 1.35; }
.stop.now:where(.store-setup, .store-setup *) .nm { color: var(--brand); }
.stop.done:where(.store-setup, .store-setup *) .nm { color: var(--ink-3); }
.stop:hover:where(.store-setup, .store-setup *) .pin { transform: translateY(-2px); }
/* 1105 — الدائرةُ «الآن» بحلقتها (5px) وارتفاعِ الوقوف (2px) كانت تُقصّ أعلاها لأنّ الشريطَ يمرّر أفقيّاً (overflow) ⇐ مساحةٌ أعلاه تُعوَّض بهامشٍ سالب */
.road:where(.store-setup, .store-setup *) { padding-top: 8px; margin-top: -8px; }
.trip-f:where(.store-setup, .store-setup *) { border-top: 1px solid var(--line); margin: 14px -22px 0px; padding: 14px 22px; display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; background: var(--panel); }
.trip-f:where(.store-setup, .store-setup *) .l { display: flex; align-items: center; gap: 10px; }
.trip-f:where(.store-setup, .store-setup *) .l b { font-family: var(--fd); font-size: 14.2px; }
.trip-f:where(.store-setup, .store-setup *) .l p { font-size: 12.8px; color: var(--ink-3); }
.card:where(.store-setup, .store-setup *) { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r); padding: 17px 18px; box-shadow: var(--sh1); transition: .18s var(--ease); }
.card:hover:where(.store-setup, .store-setup *) { transform: translateY(-2px); box-shadow: var(--sh2); border-color: var(--line-2); }
.card:where(.store-setup, .store-setup *) .k { font-size: 12.6px; color: var(--ink-3); display: flex; align-items: center; gap: 8px; }
.card:where(.store-setup, .store-setup *) .k svg { width: 15px; height: 15px; color: var(--brand); }
.card:where(.store-setup, .store-setup *) .v { font-family: var(--fd); font-weight: 600; font-size: 26px; margin-top: 8px; font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: 6px; }
.card:where(.store-setup, .store-setup *) .v i { font-style: normal; font-size: 12.6px; font-weight: 500; color: var(--ink-3); }
.spark:where(.store-setup, .store-setup *) { display: flex; align-items: flex-end; gap: 3px; height: 30px; margin-top: 11px; }
.spark:where(.store-setup, .store-setup *) i { flex: 1 1 0%; background: var(--or-08); border-radius: 2px 2px 0px 0px; transition: background 0.16s; }
.card:hover:where(.store-setup, .store-setup *) .spark i { background: var(--or-24); }
.spark:where(.store-setup, .store-setup *) i.hi { background: var(--brand); }
.card:hover:where(.store-setup, .store-setup *) .spark i.hi { background: var(--brand); }
.trend:where(.store-setup, .store-setup *) { font-size: 11.6px; font-weight: 600; padding: 2px 7px; border-radius: 99px; margin-inline-start: auto; }
.trend.up:where(.store-setup, .store-setup *) { background: var(--ok-08); color: var(--ok); }
.quick:where(.store-setup, .store-setup *) { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 18px 20px; box-shadow: var(--sh1); }
.quick:where(.store-setup, .store-setup *) h3 { font-size: 15px; margin-bottom: 3px; }
.quick:where(.store-setup, .store-setup *) p { font-size: 12.8px; color: var(--ink-3); margin-bottom: 14px; }
.chips:where(.store-setup, .store-setup *) { display: flex; flex-wrap: wrap; gap: 8px; }
.chip:where(.store-setup, .store-setup *) { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 99px; background: var(--panel); border: 1px solid var(--line); font-size: 13px; font-weight: 500; color: var(--ink-2); transition: 0.15s; }
.chip:hover:where(.store-setup, .store-setup *) { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); transform: translateY(-1px); }
.chip:where(.store-setup, .store-setup *) svg { width: 15px; height: 15px; color: var(--ink-3); }
.chip:hover:where(.store-setup, .store-setup *) svg { color: var(--brand); }
.scrim:where(.store-setup, .store-setup *) { position: fixed; inset: 0px; background: var(--veil); backdrop-filter: blur(2px); z-index: 70; display: none; }
.scrim.on:where(.store-setup, .store-setup *) { display: block; }
.tabbar:where(.store-setup, .store-setup *) { display: none; position: fixed; inset-inline: 0px; bottom: 0px; z-index: 50; background: var(--paper); border-top: 1px solid var(--line); padding: 5px 4px calc(5px + env(safe-area-inset-bottom,0px)); }
.tb:where(.store-setup, .store-setup *) { flex: 1 1 0%; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 6px 2px 4px; color: var(--ink-3); font-size: 10.6px; font-weight: 500; border-radius: 11px; position: relative; }
.tb.on:where(.store-setup, .store-setup *) { color: var(--or-dp); }
.tb.on:where(.store-setup, .store-setup *)::before { content: ""; position: absolute; top: 0px; width: 22px; height: 2.5px; border-radius: 0px 0px 3px 3px; background: var(--brand); }
.tb:where(.store-setup, .store-setup *) svg { width: 21px; height: 21px; }
@media (max-width: 1080px) {
  :root:where(:has(.store-setup)) { --rail: 222px; }
  .wrap:where(.store-setup, .store-setup *),
  .bar-in:where(.store-setup, .store-setup *) { padding-inline: 16px; }
}
@media (max-width: 920px) {
  .main:where(.store-setup, .store-setup *),
  .rail:where(.store-setup, .store-setup *) { grid-column: 1; }
  .rail:where(.store-setup, .store-setup *) { position: fixed; inset-block: 0px; inset-inline-start: 0px; width: min(288px, 86vw); z-index: 80; transform: translateX(100%); transition: transform .28s var(--ease); box-shadow: var(--sh3); }
  [dir="ltr"] .rail:where(.store-setup, .store-setup *) { transform: translateX(-100%); }
  .rail.on:where(.store-setup, .store-setup *) { transform: none; }
  .burger:where(.store-setup, .store-setup *) { display: grid; }
  .find:where(.store-setup, .store-setup *) { max-width: none; }
  .crumb:where(.store-setup, .store-setup *) b { font-size: 14px; }
  .tabbar:where(.store-setup, .store-setup *) { display: flex; }
  .trip-f:where(.store-setup, .store-setup *) { margin-inline: -16px; padding-inline: 16px; }
}
@media (max-width: 640px) {
  .wrap:where(.store-setup, .store-setup *),
  .bar-in:where(.store-setup, .store-setup *) { padding-inline: 12px; }
  .crumb:where(.store-setup, .store-setup *) { display: none; }
  .hi:where(.store-setup, .store-setup *) h1 { font-size: 21px; }
  .trip:where(.store-setup, .store-setup *) { padding: 16px 14px 6px; }
  .trip-f:where(.store-setup, .store-setup *) { margin-inline: -14px; padding-inline: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  *:where(.store-setup, .store-setup *) { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
.stop:where(.store-setup, .store-setup *) { min-width: 148px; }
.stop:where(.store-setup, .store-setup *) .nm { text-wrap: balance; min-height: 2.7em; display: flex; align-items: flex-start; justify-content: center; }
.pinico:where(.store-setup, .store-setup *) { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto; background: var(--or-08); color: var(--brand); box-shadow: inset 0 0 0 1px var(--or-24); }
.card:where(.store-setup, .store-setup *) { display: block; position: relative; }
.card:where(.store-setup, .store-setup *) .k { position: relative; padding-inline-end: 20px; }
.card:where(.store-setup, .store-setup *) .go { position: absolute; inset-inline-end: 0px; top: 50%; transform: translateY(-50%) translateX(4px); opacity: 0; color: var(--brand); transition: opacity 0.16s, transform 0.16s; }
.card:hover:where(.store-setup, .store-setup *) .go { opacity: 1; transform: translateY(-50%); }
.card:where(.store-setup, .store-setup *) .none { font-size: 12.2px; color: var(--ink-3); margin-top: 9px; padding-bottom: 4px; }
.spark:where(.store-setup, .store-setup *) { display: flex; align-items: flex-end; gap: 4px; height: 30px; margin-top: 11px; }
.spark:where(.store-setup, .store-setup *) i { flex: 1 1 0%; background: var(--or-08); border-radius: 3px 3px 0px 0px; transition: background 0.16s; }
.spark:where(.store-setup, .store-setup *) i.hi { background: var(--brand); }
.card:hover:where(.store-setup, .store-setup *) .spark i { background: var(--or-24); }
.card:hover:where(.store-setup, .store-setup *) .spark i.hi { background: var(--brand); }
.quick:where(.store-setup, .store-setup *) { position: relative; }
.quick:where(.store-setup, .store-setup *) .edit { position: absolute; inset-inline-start: 18px; top: 16px; }
@media (max-width: 640px) {
  .stop:where(.store-setup, .store-setup *) { min-width: 126px; }
  .quick:where(.store-setup, .store-setup *) .edit { inset-inline-start: 14px; top: 13px; }
}
.cap:where(.store-setup, .store-setup *) { font-family: var(--fd); font-size: 11.6px; font-weight: 600; color: var(--ink-2); letter-spacing: 0px; padding: 16px 13px 6px; user-select: none; display: flex; align-items: center; gap: 8px; }
.cap:where(.store-setup, .store-setup *)::after { content: ""; flex: 1 1 0%; height: 1px; background: var(--line); }
.latest:where(.store-setup, .store-setup *) { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--sh1); margin-bottom: 18px; overflow: hidden; }
.latest:where(.store-setup, .store-setup *) .lh { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 18px 20px 14px; border-bottom: 1px solid var(--line); }
.latest:where(.store-setup, .store-setup *) .lh h3 { font-size: 16px; }
.latest:where(.store-setup, .store-setup *) .lh p { font-size: 12.8px; color: var(--ink-3); margin-top: 2px; }
.lrow:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 14px; padding: 13px 20px; border-bottom: 1px solid var(--line); transition: background 0.14s; }
.lrow:last-child:where(.store-setup, .store-setup *) { border-bottom: 0px; }
.lrow:hover:where(.store-setup, .store-setup *) { background: var(--panel); }
.lrow:where(.store-setup, .store-setup *) .no { font-family: var(--fm); font-size: 12.4px; color: var(--ink-3); flex: 0 0 auto; }
.lrow:where(.store-setup, .store-setup *) .who { font-weight: 600; font-size: 13.6px; min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lrow:where(.store-setup, .store-setup *) .amt { margin-inline-start: auto; font-family: var(--fd); font-weight: 600; font-size: 14px; font-variant-numeric: tabular-nums; flex: 0 0 auto; }
.acts:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 7px; flex: 0 0 auto; }
.x:where(.store-setup, .store-setup *) { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; flex: 0 0 auto; color: var(--ink-3); border: 1px solid transparent; transition: 0.15s; }
.x:hover:where(.store-setup, .store-setup *) { background: var(--panel-2); border-color: var(--line); color: var(--ink); }
.note:where(.store-setup, .store-setup *) .acts { margin-inline-start: auto; }
.back:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; background: var(--panel-2); border: 1px dashed var(--line-2); border-radius: var(--r); padding: 11px 16px; margin-bottom: 16px; font-size: 13px; color: var(--ink-2); }
.ptabs:where(.store-setup, .store-setup *) { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin-bottom: 14px; padding-bottom: 2px; }
.ptabs:where(.store-setup, .store-setup *)::-webkit-scrollbar { display: none; }
.pt:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 7px; padding: 8px 15px; border-radius: 99px; white-space: nowrap; font-size: 13px; font-weight: 500; color: var(--ink-2); background: var(--paper); border: 1px solid var(--line); transition: 0.15s; }
.pt:hover:where(.store-setup, .store-setup *) { border-color: var(--line-2); color: var(--ink); }
.pt.on:where(.store-setup, .store-setup *) { background: var(--brand); border-color: var(--brand); color: var(--on-accent); font-weight: 600; }
.pt:where(.store-setup, .store-setup *) .c { font-family: var(--fm); font-size: 11px; padding: 1px 7px; border-radius: 99px; background: var(--panel-2); color: var(--ink-3); }
.pt.on:where(.store-setup, .store-setup *) .c { background: var(--on-accent-22); color: var(--on-accent); }
.sheet:where(.store-setup, .store-setup *) { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--sh1); overflow: hidden; }
.tfind:where(.store-setup, .store-setup *) { flex: 1 1 0%; min-width: 190px; display: flex; align-items: center; gap: 9px; padding: 8px 13px; border-radius: 10px; background: var(--panel); border: 1px solid var(--line); color: var(--ink-3); }
.tfind:where(.store-setup, .store-setup *) input { flex: 1 1 0%; min-width: 0px; border: 0px; background: none; outline: none; font-family: inherit; font-size: 13px; color: var(--ink); }
.tnote:where(.store-setup, .store-setup *) { font-size: 12.8px; color: var(--ink-2); background: var(--panel); padding: 11px 16px; border-bottom: 1px solid var(--line); }
.scrollx:where(.store-setup, .store-setup *) { overflow-x: auto; }
.sheet:where(.store-setup, .store-setup *) table { width: 100%; border-collapse: collapse; min-width: 640px; }
.sheet:where(.store-setup, .store-setup *) th { text-align: start; font-size: 11.8px; font-weight: 600; color: var(--ink-3); padding: 11px 16px; border-bottom: 1px solid var(--line); white-space: nowrap; background: var(--panel); }
.sheet:where(.store-setup, .store-setup *) td { padding: 13px 16px; border-bottom: 1px solid var(--line); font-size: 13.4px; white-space: nowrap; }
.sheet:where(.store-setup, .store-setup *) tbody tr:last-child td { border-bottom: 0px; }
.sheet:where(.store-setup, .store-setup *) tbody tr:hover { background: var(--panel); }
.sheet:where(.store-setup, .store-setup *) td:first-child { font-weight: 600; }
.emp:where(.store-setup, .store-setup *) { padding: 52px 24px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.emp:where(.store-setup, .store-setup *) b { font-family: var(--fd); font-size: 16px; font-weight: 600; }
.emp:where(.store-setup, .store-setup *) p { font-size: 13.2px; color: var(--ink-3); margin-top: 5px; max-width: 42ch; }
.ws:where(.store-setup, .store-setup *) { max-width: none; margin: 20px 0px 0px; padding: 0px; }
.ws-kick:where(.store-setup, .store-setup *) { font-size: 12.5px; color: var(--brand); margin-bottom: 7px; font-weight: 600; }
.ws:where(.store-setup, .store-setup *) h1 { font-size: 25px; margin-bottom: 8px; }
.ws-lede:where(.store-setup, .store-setup *) { font-size: 13.8px; color: var(--ink-2); line-height: 1.85; margin-bottom: 22px; max-width: 62ch; }
.form.plain:where(.store-setup, .store-setup *) { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 18px; padding: 0px; }
.form.plain:where(.store-setup, .store-setup *) .fld.full { grid-column: 1 / -1; }
.fld:where(.store-setup, .store-setup *) .opt { font-style: normal; font-size: 11px; font-weight: 500; color: var(--ink-3); padding: 1px 7px; border-radius: 99px; background: var(--panel-2); margin-inline-start: 5px; }
.ws-acts:where(.store-setup, .store-setup *) { position: sticky; bottom: 0; margin-top: 26px; display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding: 14px 18px; border-radius: var(--r) var(--r) 0 0; background: var(--paper); border: 1px solid var(--line); border-bottom: 0; box-shadow: var(--sh2); }
@media (max-width: 920px) {
  .ws-acts:where(.store-setup, .store-setup *) { bottom: calc(62px + env(safe-area-inset-bottom,0px)); }
}
@media (max-width: 700px) {
  .form.plain:where(.store-setup, .store-setup *) { grid-template-columns: 1fr; }
  .ws:where(.store-setup, .store-setup *) { margin-top: 14px; }
  .ws:where(.store-setup, .store-setup *) h1 { font-size: 21px; }
  .ws-acts:where(.store-setup, .store-setup *) { flex-direction: column; align-items: stretch; }
}
@media (max-width: 640px) {
  .emp:where(.store-setup, .store-setup *) { padding: 38px 16px; }
}
.back-link:where(.store-setup, .store-setup *) { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: var(--ink-3); margin-bottom: 12px; transition: color 0.15s; }
.back-link:hover:where(.store-setup, .store-setup *) { color: var(--brand); }
.warn:where(.store-setup, .store-setup *) { background: var(--warn-soft); border: 1px solid var(--warn-line); border-inline-start: 3px solid var(--amber); border-radius: var(--r); padding: 14px 17px; margin-bottom: 16px; }
:root[data-theme="dark"] .warn:where(.store-setup, .store-setup *) { background: var(--warn-soft-dark); border-color: var(--warn-line-dark); }
.warn:where(.store-setup, .store-setup *) b { font-family: var(--fd); font-size: 14px; display: block; }
.warn:where(.store-setup, .store-setup *) p { font-size: 12.8px; color: var(--ink-2); margin-top: 3px; }
.mono:where(.store-setup, .store-setup *) { font-family: var(--fm); font-size: 0.92em; }
.form:where(.store-setup, .store-setup *) { padding: 20px 22px; display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 16px; }
.fld.full:where(.store-setup, .store-setup *) { grid-column: 1 / -1; }
.fld:where(.store-setup, .store-setup *) label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 7px; }
.fld:where(.store-setup, .store-setup *) .req { color: var(--crit); font-style: normal; }
.fld:where(.store-setup, .store-setup *) .fh { font-size: 11.8px; color: var(--ink-3); margin-top: 6px; line-height: 1.55; }
.in:where(.store-setup, .store-setup *) { width: 100%; padding: 11px 14px; border-radius: 11px; border: 1px solid var(--line-2); background: var(--paper); color: var(--ink); font-family: inherit; font-size: 13.6px; outline: none; transition: border-color 0.16s, box-shadow 0.16s; }
.in:focus:where(.store-setup, .store-setup *) { border-color: var(--brand); box-shadow: 0 0 0 4px var(--or-08); }
textarea.in:where(.store-setup, .store-setup *) { resize: vertical; line-height: 1.7; }
.in.mono:where(.store-setup, .store-setup *) { font-family: var(--fm); }
.unitw:where(.store-setup, .store-setup *) { position: relative; display: flex; align-items: center; }
.unit:where(.store-setup, .store-setup *) { position: absolute; inset-inline-start: 14px; font-size: 12.4px; color: var(--ink-3); pointer-events: none; }
.unitw:where(.store-setup, .store-setup *) .in { padding-inline-start: 46px; }
.slug:where(.store-setup, .store-setup *) { display: flex; align-items: stretch; }
.slug:where(.store-setup, .store-setup *) .pre { display: flex; align-items: center; padding: 0px 13px; border: 1px solid var(--line-2); border-inline-end: 0px; border-start-start-radius: 11px; border-end-start-radius: 11px; background: var(--panel); color: var(--ink-3); font-family: var(--fm); font-size: 12.6px; white-space: nowrap; }
.slug:where(.store-setup, .store-setup *) .in { border-start-start-radius: 0px; border-end-start-radius: 0px; }
.drop:where(.store-setup, .store-setup *) { width: 100%; padding: 24px; border-radius: 12px; border: 1.6px dashed var(--line-2); background: var(--panel); display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--ink-3); transition: 0.16s; }
.drop:hover:where(.store-setup, .store-setup *) { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.drop:where(.store-setup, .store-setup *) b { font-family: var(--fd); font-size: 13.6px; color: var(--ink); }
.drop:hover:where(.store-setup, .store-setup *) b { color: var(--brand); }
.drop:where(.store-setup, .store-setup *) span { font-size: 11.8px; text-align: center; max-width: 46ch; }
.mapbox:where(.store-setup, .store-setup *) { height: 180px; border-radius: 12px; border: 1px solid var(--line-2); background: repeating-linear-gradient(45deg,var(--panel),var(--panel) 12px,var(--panel-2) 12px,var(--panel-2) 24px); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; color: var(--ink-3); }
.mapbox:where(.store-setup, .store-setup *) b { font-family: var(--fd); font-size: 14px; color: var(--ink); }
.mapbox:where(.store-setup, .store-setup *) span { font-size: 12px; }
.note-sm:where(.store-setup, .store-setup *) { font-size: 12.4px; color: var(--ink-3); }
.toast:where(.store-setup, .store-setup *) { position: fixed; inset-inline-start: 22px; bottom: 22px; z-index: 95; background: var(--ink); color: var(--paper); padding: 12px 18px; border-radius: 12px; box-shadow: var(--sh3); font-size: 13.4px; font-weight: 500; transform: translateY(160%); transition: transform .26s var(--ease); visibility: hidden; pointer-events: none; }
.toast.on:where(.store-setup, .store-setup *) { transform: none; visibility: visible; }
@media (max-width: 920px) {
  .toast:where(.store-setup, .store-setup *) { bottom: calc(74px + env(safe-area-inset-bottom,0px)); }
}
@media (max-width: 700px) {
  .form:where(.store-setup, .store-setup *) { grid-template-columns: 1fr; }
}
.stepcard:where(.store-setup, .store-setup *) { background: var(--paper); border: 1px solid var(--line); border-radius: 20px; box-shadow: var(--sh2); overflow: hidden; }
.grp-sec:where(.store-setup, .store-setup *) { padding: 20px 22px; }
.grp-sec:where(.store-setup, .store-setup *) + .grp-sec { border-top: 1px solid var(--line); }
.grp-h:where(.store-setup, .store-setup *) { margin-bottom: 16px; }
.grp-h:where(.store-setup, .store-setup *) b { font-family: var(--fd); font-size: 15px; font-weight: 600; display: block; }
.grp-h:where(.store-setup, .store-setup *) span { font-size: 12.6px; color: var(--ink-3); display: block; margin-top: 2px; }
.grp-note:where(.store-setup, .store-setup *) { font-size: 12.4px; color: var(--ink-2); background: var(--panel); border: 1px solid var(--line); border-radius: 11px; padding: 11px 14px; margin-top: 16px; line-height: 1.75; }
@media (max-width: 700px) {
  .grp-sec:where(.store-setup, .store-setup *) { padding: 16px 14px; }
}
.rail-top:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 8px; }
.rail-top:where(.store-setup, .store-setup *) .mark { flex: 1 1 0%; min-width: 0px; justify-content: flex-start; }
.fld.full:where(.store-setup, .store-setup *) .in:not(textarea):not(.mono) { max-width: 520px; }
.fld.full:where(.store-setup, .store-setup *) textarea.in { max-width: 660px; }
.form.plain:where(.store-setup, .store-setup *) .fld .in { max-width: 100%; }
.ws:where(.store-setup, .store-setup *) .stepcard { margin-bottom: 8px; }
.ws-acts:where(.store-setup, .store-setup *) { margin-top: 14px; }
.side-n:where(.store-setup, .store-setup *) { font-size: 12.6px; color: var(--ink-3); margin-bottom: 14px; line-height: 1.7; }
.swlist:where(.store-setup, .store-setup *) { display: flex; flex-direction: column; gap: 2px; }
.swrow:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border-radius: 10px; font-size: 13.4px; transition: background 0.14s; cursor: pointer; }
.swrow:hover:where(.store-setup, .store-setup *) { background: var(--panel); }
.btn:where(.store-setup, .store-setup *) .b { font-family: var(--fm); font-size: 10.6px; padding: 1px 6px; border-radius: 99px; background: var(--brand); color: var(--on-accent); margin-inline-start: 5px; }
.fmenu:where(.store-setup, .store-setup *) { position: fixed; z-index: 94; width: 214px; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--sh3); padding: 6px; display: none; }
.fmenu.on:where(.store-setup, .store-setup *) { display: block; }
.pcard:where(.store-setup, .store-setup *) { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--sh1); overflow: hidden; transition: border-color 0.16s; }
.pcard.open:where(.store-setup, .store-setup *) { border-color: var(--line-2); }
.pcard-h:where(.store-setup, .store-setup *) { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; text-align: start; transition: background 0.15s; }
.pcard-h:hover:where(.store-setup, .store-setup *) { background: var(--panel); }
.pcard:where(.store-setup, .store-setup *) .tx b { font-family: var(--fd); font-size: 15px; font-weight: 600; display: block; color: var(--brand); }
.pcard:where(.store-setup, .store-setup *) .tx span { font-size: 12.4px; color: var(--ink-3); display: block; margin-top: 2px; }
.pcard:where(.store-setup, .store-setup *) .cvx { width: 32px; height: 32px; border-radius: 50%; border: 1px solid transparent; background: var(--panel); display: grid; place-items: center; flex: 0 0 auto; color: var(--ink-2); transition: transform .22s var(--ease); }
.pcard-h:hover:where(.store-setup, .store-setup *) .cvx { background: var(--brand-soft); color: var(--brand); }
.pcard.open:where(.store-setup, .store-setup *) .cvx { transform: rotate(180deg); background: var(--brand-soft); border-color: var(--brand); color: var(--brand); }
.pcard-b:where(.store-setup, .store-setup *) { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .26s var(--ease); min-width: 0px; }
.pcard.open:where(.store-setup, .store-setup *) .pcard-b { grid-template-rows: 1fr; }
.pcard-b:where(.store-setup, .store-setup *) > div { overflow: hidden; min-width: 0px; }
.pcard-in:where(.store-setup, .store-setup *) { padding: 4px 20px 20px; border-top: 1px solid var(--line); min-width: 0px; }
.rte:where(.store-setup, .store-setup *) { border: 1px solid var(--line-2); border-radius: 11px; overflow: hidden; }
.rte-bar:where(.store-setup, .store-setup *) { display: flex; flex-wrap: wrap; gap: 1px; padding: 6px; background: var(--panel); border-bottom: 1px solid var(--line); }
.rte-bar:where(.store-setup, .store-setup *) button { min-width: 28px; height: 28px; border-radius: 7px; font-size: 12px; color: var(--ink-2); transition: 0.14s; }
.rte-bar:where(.store-setup, .store-setup *) button:hover { background: var(--paper); color: var(--brand); }
.chips:where(.store-setup, .store-setup *) .chip.on { background: var(--brand); border-color: var(--brand); color: var(--on-accent); }
.pprev-card:where(.store-setup, .store-setup *) { padding: 16px; }
.pprev-img:where(.store-setup, .store-setup *) { height: 170px; border-radius: 12px; background: var(--panel); display: grid; place-items: center; font-size: 56px; border: 1px solid var(--line); }
.pprev-b:where(.store-setup, .store-setup *) { padding-top: 13px; }
.pprev-b:where(.store-setup, .store-setup *) .c { font-size: 11.6px; color: var(--ink-3); }
.pprev-b:where(.store-setup, .store-setup *) b { font-family: var(--fd); font-size: 17px; display: block; margin-top: 3px; }
.pprev-b:where(.store-setup, .store-setup *) .pr { font-family: var(--fd); font-size: 20px; font-weight: 600; color: var(--brand); display: block; margin-top: 6px; }
.rsn:where(.store-setup, .store-setup *) { font-size: 12.4px; color: var(--ink-2); max-width: 280px; white-space: normal; line-height: 1.55; }
.rlist:where(.store-setup, .store-setup *) { margin: 0px; padding-inline-start: 20px; display: flex; flex-direction: column; gap: 6px; font-size: 12.6px; color: var(--ink-2); line-height: 1.6; }
.rlist:where(.store-setup, .store-setup *) li::marker { color: var(--ink-3); font-family: var(--fm); font-size: 11px; }
.tgl:where(.store-setup, .store-setup *) { width: 44px; height: 25px; border-radius: 99px; background: var(--line-2); position: relative; flex: 0 0 auto; transition: background .18s var(--ease); border: 0px; }
.tgl:where(.store-setup, .store-setup *) i { position: absolute; top: 3px; inset-inline-start: 3px; width: 19px; height: 19px; border-radius: 50%; background: var(--on-accent); box-shadow: var(--knob-shadow) 0px 1px 3px; transition: inset-inline-start .18s var(--ease); }
.tgl.on:where(.store-setup, .store-setup *) { background: var(--brand); }
.tgl.on:where(.store-setup, .store-setup *) i { inset-inline-start: 22px; }
.olist:where(.store-setup, .store-setup *) { margin: 0px; padding: 0px; list-style: none; display: flex; flex-direction: column; gap: 6px; min-width: 250px; }
.olist:where(.store-setup, .store-setup *) li { display: flex; align-items: center; gap: 10px; padding: 10px 13px; border-radius: 10px; background: var(--panel); border: 1px solid var(--line); font-size: 13px; cursor: grab; }
.olist:where(.store-setup, .store-setup *) li:hover { border-color: var(--brand); }
.olist:where(.store-setup, .store-setup *) .gr { color: var(--ink-3); font-size: 14px; }
@media (max-width: 640px) {
  .olist:where(.store-setup, .store-setup *) { min-width: 0px; }
  .rsn:where(.store-setup, .store-setup *) { max-width: none; }
}
.btn.dgr:where(.store-setup, .store-setup *) { background: var(--crit); border-color: var(--crit); color: var(--on-accent); }
.btn.dgr:hover:where(.store-setup, .store-setup *) { filter: brightness(0.93); }
.mgrid:where(.store-setup, .store-setup *) { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.mtile:where(.store-setup, .store-setup *) { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 16px 10px; background: var(--panel); border: 1px solid var(--line); border-radius: 14px; cursor: pointer; transition: border-color .15s var(--ease),transform .15s var(--ease); min-width: 0px; }
.mtile:hover:where(.store-setup, .store-setup *) { border-color: var(--brand); transform: translateY(-1px); }
.mth:where(.store-setup, .store-setup *) { font-size: 34px; line-height: 1; }
.mnm:where(.store-setup, .store-setup *) { font-size: 12.4px; font-weight: 600; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mmeta:where(.store-setup, .store-setup *) { font-size: 11px; color: var(--ink-3); }
.inf:where(.store-setup, .store-setup *) { border: 0px; background: none; color: var(--ink-3); font-size: 12px; cursor: help; padding: 0px 2px; line-height: 1; }
.inf:hover:where(.store-setup, .store-setup *) { color: var(--brand); }
.lnk:where(.store-setup, .store-setup *) { border: 0px; background: none; color: var(--brand); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 12.6px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; padding: 0px; }
.lnk:hover:where(.store-setup, .store-setup *) { opacity: 0.8; }
.toks:where(.store-setup, .store-setup *) { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.tok:where(.store-setup, .store-setup *) { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 99px; border: 1px solid var(--line); background: var(--panel); cursor: pointer; font-size: 11.4px; }
.tok:hover:where(.store-setup, .store-setup *) { border-color: var(--brand); }
.tk-n:where(.store-setup, .store-setup *) { color: var(--ink-3); }
.tk-v:where(.store-setup, .store-setup *) { font-family: var(--fm); color: var(--brand); }
.msrow:where(.store-setup, .store-setup *) { display: flex; gap: 8px; align-items: flex-start; }
.msrow:where(.store-setup, .store-setup *) .msel { flex: 1 1 0%; min-width: 0px; }
.btn.sq:where(.store-setup, .store-setup *) { width: 40px; height: 40px; padding: 0px; justify-content: center; align-items: center; flex: 0 0 auto; }
.msrow:where(.store-setup, .store-setup *) .btn.sq { margin-top: 0px; }
.msel:where(.store-setup, .store-setup *) { position: relative; }
.ms-box:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 8px; min-height: 40px; padding: 5px 11px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); cursor: pointer; }
.ms-box:hover:where(.store-setup, .store-setup *) { border-color: var(--line-2); }
.ms-chips:where(.store-setup, .store-setup *) { display: flex; flex-wrap: wrap; gap: 6px; flex: 1 1 0%; min-width: 0px; }
.ms-chip:where(.store-setup, .store-setup *) { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 99px; background: var(--brand-08); color: var(--brand); font-size: 12px; border: 1px solid transparent; }
.ms-chip:where(.store-setup, .store-setup *) i { font-style: normal; cursor: pointer; opacity: 0.7; font-size: 10px; }
.ms-chip:where(.store-setup, .store-setup *) i:hover { opacity: 1; }
.ms-ph:where(.store-setup, .store-setup *) { color: var(--ink-3); font-size: 13px; }
.ms-x:where(.store-setup, .store-setup *) { color: var(--crit); font-size: 11px; cursor: pointer; opacity: 0.75; flex: 0 0 auto; }
.ms-x:hover:where(.store-setup, .store-setup *) { opacity: 1; }
.ms-cv:where(.store-setup, .store-setup *) { color: var(--ink-3); flex: 0 0 auto; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; }
.ms-box:hover:where(.store-setup, .store-setup *) .ms-cv { color: var(--brand); background: var(--brand-soft); }
.mdrop:where(.store-setup, .store-setup *) { position: absolute; inset-inline: 0px; top: calc(100% + 5px); z-index: 40; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--sh3); overflow: hidden; max-height: 290px; display: none; }
.mdrop.on:where(.store-setup, .store-setup *) { display: block; }
.md-find:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-bottom: 1px solid var(--line); }
.md-find:where(.store-setup, .store-setup *) span { color: var(--ink-3); font-size: 12px; }
.md-find:where(.store-setup, .store-setup *) input { flex: 1 1 0%; min-width: 0px; border: 0px; background: none; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13px; color: var(--ink); outline: none; }
.md-list:where(.store-setup, .store-setup *) { max-height: 225px; overflow-y: auto; }
.md-row:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 12px; border: 0px; background: none; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13px; color: var(--ink); cursor: pointer; text-align: start; }
.md-row:hover:where(.store-setup, .store-setup *) { background: var(--panel); }
.md-row.on:where(.store-setup, .store-setup *) { background: var(--brand-08); }
.md-box:where(.store-setup, .store-setup *) { width: 19px; height: 19px; border-radius: 5px; border: 1.5px solid var(--line-2); display: grid; place-items: center; font-size: 11px; color: var(--on-accent); flex: 0 0 auto; }
.md-row.on:where(.store-setup, .store-setup *) .md-box { background: var(--brand); border-color: var(--brand); }
.langw:where(.store-setup, .store-setup *) { display: flex; gap: 8px; }
.langw:where(.store-setup, .store-setup *) .in { flex: 1 1 0%; min-width: 0px; }
.seoprev:where(.store-setup, .store-setup *) { padding: 13px 15px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.seoprev:where(.store-setup, .store-setup *) b { display: block; font-size: 14.4px; color: var(--ink); }
.seoprev:where(.store-setup, .store-setup *) .u { display: block; font-family: var(--fm); font-size: 11.6px; color: var(--seo-link); margin: 3px 0px; word-break: break-all; }
.seoprev:where(.store-setup, .store-setup *) .d { display: block; font-size: 12.4px; color: var(--ink-3); line-height: 1.6; }
.opt-top:where(.store-setup, .store-setup *) { display: flex; justify-content: flex-start; margin-bottom: 12px; }
.optrow:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 12px; padding: 13px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); margin-bottom: 9px; }
.optrow.open:where(.store-setup, .store-setup *) { border-color: var(--brand); border-end-start-radius: 0px; border-end-end-radius: 0px; margin-bottom: 0px; }
.optrow:where(.store-setup, .store-setup *) .gr { color: var(--ink-3); cursor: grab; flex: 0 0 auto; }
.optrow:where(.store-setup, .store-setup *) .ot { flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; }
.optrow:where(.store-setup, .store-setup *) .ot b { font-size: 13.6px; font-weight: 600; }
.optrow:where(.store-setup, .store-setup *) .ot span { font-size: 11.8px; color: var(--ink-3); }
.optrow:where(.store-setup, .store-setup *) .oa { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.ic-sm:where(.store-setup, .store-setup *) { width: 30px; height: 30px; border-radius: 8px; border: 1px solid var(--line); background: var(--paper); color: var(--ink-2); cursor: pointer; display: grid; place-items: center; font-size: 13px; }
.ic-sm:hover:where(.store-setup, .store-setup *) { border-color: var(--brand); color: var(--brand); }
.grp-t:where(.store-setup, .store-setup *) { display: block; font-family: var(--fd); font-size: 13.4px; margin: 4px 0px 10px; }
.rad:where(.store-setup, .store-setup *) { width: 21px; height: 21px; border-radius: 50%; border: 1.6px solid var(--line-2); background: var(--paper); cursor: pointer; flex: 0 0 auto; position: relative; }
.rad.on:where(.store-setup, .store-setup *) { border-color: var(--brand); }
.rad.on:where(.store-setup, .store-setup *)::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--brand); }
.btn[disabled]:where(.store-setup, .store-setup *) { opacity: 0.45; pointer-events: none; }
.qlink:where(.store-setup, .store-setup *) { margin-top: 14px; display: inline-block; }
.corow:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); margin-bottom: 8px; font-size: 13.2px; }
@media (max-width: 640px) {
  .langw:where(.store-setup, .store-setup *) { flex-direction: column; }
}
.pfull:where(.store-setup, .store-setup *) { max-width: none; display: flex; flex-direction: column; gap: 12px; }
.pslist:where(.store-setup, .store-setup *) { padding-block: 4px; }
.psrow:where(.store-setup, .store-setup *) { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 14px 0px; border-bottom: 1px solid var(--line); width: 100%; text-align: start; background: none; border-inline: 0px; border-top: 0px; color: var(--ink); font: inherit; }
.psrow:last-child:where(.store-setup, .store-setup *) { border-bottom: 0px; }
.psrow.nav:where(.store-setup, .store-setup *) { cursor: pointer; align-items: center; }
.psrow.nav:hover:where(.store-setup, .store-setup *) { background: var(--panel); }
.psrow:where(.store-setup, .store-setup *) .l { min-width: 0px; flex: 1 1 0%; display: flex; flex-direction: column; gap: 3px; }
.psrow:where(.store-setup, .store-setup *) .l b { font-size: 13.6px; font-weight: 600; line-height: 1.5; }
.psrow:where(.store-setup, .store-setup *) .l span { font-size: 11.8px; color: var(--ink-3); line-height: 1.65; }
.psrow:where(.store-setup, .store-setup *) .cv { color: var(--ink-3); font-size: 17px; flex: 0 0 auto; line-height: 1; }
.psrow:where(.store-setup, .store-setup *) .tgl { margin-top: 2px; }
.nb:where(.store-setup, .store-setup *),
.psrow:where(.store-setup, .store-setup *) .l b .nb { display: inline-block; padding: 1px 7px; border-radius: 99px; background: var(--crit); color: var(--on-accent); font-size: 10.5px; font-weight: 600; vertical-align: middle; }
.unitw.wsm:where(.store-setup, .store-setup *) { width: 150px; flex: 0 0 auto; }
.addrow:where(.store-setup, .store-setup *) { display: flex; gap: 9px; align-items: center; margin-top: 10px; }
.addrow:where(.store-setup, .store-setup *) .in { flex: 1 1 0%; min-width: 0px; }
.msgprev:where(.store-setup, .store-setup *) { padding: 13px 15px; border-radius: 14px; background: var(--brand-08); color: var(--ink); font-size: 13px; line-height: 1.85; white-space: pre-wrap; }
button.back-link:where(.store-setup, .store-setup *) { background: none; border: 0px; cursor: pointer; font: inherit; }
@media (max-width: 640px) {
  .psrow:where(.store-setup, .store-setup *) { flex-direction: column; align-items: stretch; gap: 9px; }
  .psrow.nav:where(.store-setup, .store-setup *) { flex-direction: row; align-items: center; }
  .unitw.wsm:where(.store-setup, .store-setup *) { width: 100%; }
}
.edhead:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.edhead:where(.store-setup, .store-setup *) b { font-family: var(--fd); font-size: 14.4px; }
.cbx:where(.store-setup, .store-setup *) { width: 21px; height: 21px; border-radius: 6px; border: 1.6px solid var(--line-2); background: var(--paper); color: var(--on-accent); font-size: 12px; cursor: pointer; display: inline-grid; place-items: center; flex: 0 0 auto; line-height: 1; }
.cbx.on:where(.store-setup, .store-setup *) { background: var(--ink); border-color: var(--ink); }
.perpage:where(.store-setup, .store-setup *) { display: inline-flex; align-items: center; gap: 8px; font-size: 11.8px; color: var(--ink-3); }
.perpage:where(.store-setup, .store-setup *) .in { width: 72px; padding: 5px 8px; }
.savebar:where(.store-setup, .store-setup *) { position: sticky; bottom: 0px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 18px; margin-top: 14px; background: var(--paper); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--sh2); font-size: 13px; }
.savebar.on:where(.store-setup, .store-setup *) { border-color: var(--brand); }
.collist:where(.store-setup, .store-setup *) { display: flex; flex-direction: column; gap: 2px; }
.colrow:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 9px; }
.colrow:hover:where(.store-setup, .store-setup *) { background: var(--panel); }
.colrow:where(.store-setup, .store-setup *) .cn { flex: 1 1 0%; min-width: 0px; font-size: 12.8px; }
.colrow:where(.store-setup, .store-setup *) .gr { color: var(--ink-3); cursor: grab; letter-spacing: -2px; }
@media (max-width: 640px) {
  .savebar:where(.store-setup, .store-setup *) { flex-direction: column; align-items: stretch; gap: 10px; }
  .savebar:where(.store-setup, .store-setup *) span { justify-content: stretch; }
}
.pbar:where(.store-setup, .store-setup *) { display: flex; gap: 9px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.pbar:where(.store-setup, .store-setup *) .tfind { flex: 1 1 0%; min-width: 190px; }
.modes:where(.store-setup, .store-setup *) { display: inline-flex; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.mode:where(.store-setup, .store-setup *) { width: 36px; height: 36px; border: 0px; background: var(--paper); color: var(--ink-3); cursor: pointer; font-size: 14px; }
.mode:where(.store-setup, .store-setup *) + .mode { border-inline-start: 1px solid var(--line); }
.mode.on:where(.store-setup, .store-setup *) { background: var(--brand-08); color: var(--brand); }
.pgrid:where(.store-setup, .store-setup *) { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; padding: 16px; }
.pcx-b:where(.store-setup, .store-setup *) { padding: 11px; display: flex; flex-direction: column; gap: 9px; }
.pcx-r:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 11px; border: 1px solid var(--line); border-radius: 10px; font-size: 12.8px; }
.pcx-p:where(.store-setup, .store-setup *) { font-family: var(--fm); font-weight: 600; }
.pcx-p:where(.store-setup, .store-setup *) i { font-style: normal; color: var(--ink-3); font-size: 11px; }
.pcx-c:where(.store-setup, .store-setup *) { display: flex; gap: 7px; align-items: center; }
.catsel:where(.store-setup, .store-setup *) { flex: 1 1 0%; min-width: 0px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 5px 9px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); cursor: pointer; }
.plist:where(.store-setup, .store-setup *) { display: flex; flex-direction: column; }
.prow:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-block-start: 0; border-inline: 0; border-image: none; border-bottom: 1px solid var(--line); background: none; width: 100%; text-align: start; cursor: pointer; font: inherit; color: var(--ink); }
.prow:hover:where(.store-setup, .store-setup *) { background: var(--panel); }
.prow:where(.store-setup, .store-setup *) .th { font-size: 24px; }
.pr-t:where(.store-setup, .store-setup *) { flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; gap: 2px; }
.pr-t:where(.store-setup, .store-setup *) b { font-size: 13.4px; }
.pr-m:where(.store-setup, .store-setup *) { font-size: 11.6px; color: var(--ink-3); }
.pr-p:where(.store-setup, .store-setup *) { font-family: var(--fm); font-size: 13px; font-weight: 600; }
.dd:where(.store-setup, .store-setup *) { position: relative; }
.ddbtn:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; cursor: pointer; text-align: start; background: var(--paper); }
.ddbtn:hover:where(.store-setup, .store-setup *) { border-color: var(--line-2); }
.ddbtn[aria-expanded="true"]:where(.store-setup, .store-setup *) { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-08); }
.ddv:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 9px; min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ddph:where(.store-setup, .store-setup *) { color: var(--ink-3); }
.ddc:where(.store-setup, .store-setup *) { color: var(--ink-3); flex: 0 0 auto; display: grid; place-items: center; transition: transform .18s var(--ease); }
.ddbtn[aria-expanded="true"]:where(.store-setup, .store-setup *) .ddc { transform: rotate(180deg); }
.ddm:where(.store-setup, .store-setup *) { display: none; position: absolute; inset-inline: 0px; top: calc(100% + 6px); z-index: 60; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--sh3); overflow: hidden; }
.ddm.on:where(.store-setup, .store-setup *) { display: block; }
.ddm.up:where(.store-setup, .store-setup *) { top: auto; bottom: calc(100% + 6px); }
.ddf:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 9px; padding: 10px 12px; border-bottom: 1px solid var(--line); color: var(--ink-3); }
.ddf:where(.store-setup, .store-setup *) input { flex: 1 1 0%; min-width: 0px; border: 0px; background: none; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13px; color: var(--ink); outline: none; }
.ddl:where(.store-setup, .store-setup *) { max-height: 250px; overflow-y: auto; padding: 5px; }
.ddi:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 11px; border: 0px; border-radius: 9px; background: none; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13px; color: var(--ink); cursor: pointer; text-align: start; }
.ddi:hover:where(.store-setup, .store-setup *) { background: var(--panel); }
.ddi.on:where(.store-setup, .store-setup *) { background: var(--brand-08); color: var(--brand); font-weight: 600; }
.ddi:where(.store-setup, .store-setup *) svg { width: 22px; height: 15px; border-radius: 2px; flex: 0 0 auto; box-shadow: 0 0 0 1px var(--line); }
.ddv:where(.store-setup, .store-setup *) svg { width: 22px; height: 15px; border-radius: 2px; flex: 0 0 auto; box-shadow: 0 0 0 1px var(--line); }
.cbrow:where(.store-setup, .store-setup *) { display: flex; align-items: flex-start; gap: 11px; padding: 10px 0px; cursor: pointer; }
.cbrow:where(.store-setup, .store-setup *) .cbx { margin-top: 1px; }
.cbt:where(.store-setup, .store-setup *) { min-width: 0px; display: flex; flex-direction: column; gap: 3px; }
.cbt:where(.store-setup, .store-setup *) b { font-size: 13.2px; font-weight: 500; }
.cbt:where(.store-setup, .store-setup *) span { font-size: 11.6px; color: var(--ink-3); line-height: 1.6; }
.cbx.on:where(.store-setup, .store-setup *) { background: var(--brand); border-color: var(--brand); }
input[type="checkbox"]:where(.store-setup, .store-setup *),
input[type="radio"]:where(.store-setup, .store-setup *) { accent-color: var(--brand); width: 17px; height: 17px; }
.gr:where(.store-setup, .store-setup *) { display: grid; place-items: center; width: 22px; height: 26px; color: var(--ink-3); cursor: grab; border-radius: 6px; flex: 0 0 auto; touch-action: none; }
.gr:hover:where(.store-setup, .store-setup *) { color: var(--brand); background: var(--brand-soft); }
.gr:active:where(.store-setup, .store-setup *) { cursor: grabbing; }
.optrow[draggable="true"]:where(.store-setup, .store-setup *),
.valrow[draggable="true"]:where(.store-setup, .store-setup *) { transition: box-shadow 0.15s, opacity 0.15s, transform 0.15s; }
.dragging:where(.store-setup, .store-setup *) { opacity: 0.45; }
.dragover:where(.store-setup, .store-setup *) { box-shadow: 0 -2px 0 0 var(--brand) inset,0 2px 0 0 var(--brand) inset; }
.swpop:where(.store-setup, .store-setup *) { display: none; position: absolute; z-index: 60; width: 222px; padding: 10px; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--sh3); }
.swpop.on:where(.store-setup, .store-setup *) { display: block; }
.swg:where(.store-setup, .store-setup *) { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; }
.sw:where(.store-setup, .store-setup *) { width: 100%; aspect-ratio: 1 / 1; border-radius: 7px; cursor: pointer; border: 1px solid var(--line-2); background: var(--sw); }
.sw:hover:where(.store-setup, .store-setup *) { transform: scale(1.08); }
.sw.on:where(.store-setup, .store-setup *) { outline: 2px solid var(--brand); outline-offset: 2px; }
.swx:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 9px; padding-top: 9px; border-top: 1px solid var(--line); font-size: 12.4px; color: var(--ink-2); cursor: pointer; }
.swx:where(.store-setup, .store-setup *) input[type="color"] { width: 34px; height: 26px; border: 1px solid var(--line-2); border-radius: 7px; background: none; padding: 2px; cursor: pointer; }
.in.bad:where(.store-setup, .store-setup *) { border-color: var(--crit); }
.flg:where(.store-setup, .store-setup *) { display: inline-flex; width: 20px; height: 14px; border-radius: 2px; overflow: hidden; flex: 0 0 auto; box-shadow: var(--hairline) 0px 0px 0px 1px; }
.flg:where(.store-setup, .store-setup *) svg { width: 100%; height: 100%; display: block; }
.ddempty:where(.store-setup, .store-setup *) { margin: 0px; padding: 14px 12px; font-size: 12.4px; color: var(--ink-3); text-align: center; line-height: 1.7; }
.catbrand:where(.store-setup, .store-setup *) { display: flex; gap: 14px; align-items: flex-start; }
.catbrand:where(.store-setup, .store-setup *) .cb-a { flex: 2 1 0%; min-width: 0px; }
.catbrand:where(.store-setup, .store-setup *) .cb-b { flex: 1 1 0%; min-width: 0px; }
@media (max-width: 760px) {
  .catbrand:where(.store-setup, .store-setup *) { flex-direction: column; }
  .catbrand:where(.store-setup, .store-setup *) .cb-a,
  .catbrand:where(.store-setup, .store-setup *) .cb-b { width: 100%; }
}
.lcat-off:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; cursor: pointer; background: var(--panel); color: var(--ink-3); }
.lcat-off:hover:where(.store-setup, .store-setup *) { border-color: var(--warn,var(--gold)); }
.crown:where(.store-setup, .store-setup *) { display: grid; place-items: center; color: var(--gold); flex: 0 0 auto; }
.in[disabled]:where(.store-setup, .store-setup *) { background: var(--panel); color: var(--ink-3); cursor: not-allowed; }
.prices3:where(.store-setup, .store-setup *) { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
@media (max-width: 760px) {
  .prices3:where(.store-setup, .store-setup *) { grid-template-columns: 1fr; }
}
.perpage:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 9px; font-size: 12.4px; color: var(--ink-2); }
.perpage:where(.store-setup, .store-setup *) .dd { width: 86px; }
.thb:where(.store-setup, .store-setup *) { display: grid; place-items: center; width: 100%; height: 100%; min-width: 32px; min-height: 32px; border-radius: 8px; font-weight: 600; font-size: 15px; line-height: 1; }
.pcx-img:where(.store-setup, .store-setup *) .thb,
.pprev-img:where(.store-setup, .store-setup *) .thb { border-radius: 0px; font-size: 38px; }
.th:where(.store-setup, .store-setup *) { display: inline-grid; place-items: center; width: 34px; height: 34px; flex: 0 0 auto; }
.prow:where(.store-setup, .store-setup *) .th { width: 38px; height: 38px; font-size: inherit; }
.prow:where(.store-setup, .store-setup *) .th .thb { width: 38px; height: 38px; font-size: 15px; }
.pcx-img:where(.store-setup, .store-setup *),
.pprev-img:where(.store-setup, .store-setup *) { overflow: hidden; }
.pcx-img:where(.store-setup, .store-setup *) .thb,
.pprev-img:where(.store-setup, .store-setup *) .thb { width: 100%; height: 100%; }
.qbadge:where(.store-setup, .store-setup *) svg,
.pcx-n:where(.store-setup, .store-setup *) i svg,
.pr-m:where(.store-setup, .store-setup *) svg { width: 13px; height: 13px; vertical-align: -2px; }
.ic-sm:where(.store-setup, .store-setup *) svg { width: 14px; height: 14px; display: block; }
.ic-sm:where(.store-setup, .store-setup *) { display: inline-grid; place-items: center; }
.metrics:where(.store-setup, .store-setup *) { display: flex; gap: 10px; flex-wrap: wrap; margin: 14px 0px 12px; }
td.ok:where(.store-setup, .store-setup *) { color: var(--ok); }
td.no:where(.store-setup, .store-setup *) { color: var(--crit); }
.drop:where(.store-setup, .store-setup *) { display: grid; place-items: center; gap: 7px; padding: 26px 18px; text-align: center; border: 1.5px dashed var(--line-2); border-radius: 14px; background: var(--panel); cursor: pointer; }
.drop:hover:where(.store-setup, .store-setup *) { border-color: var(--brand); background: var(--brand-soft); }
.drop:where(.store-setup, .store-setup *) b { font-size: 13.4px; font-weight: 600; }
.drop:where(.store-setup, .store-setup *) p { margin: 0px; font-size: 11.6px; color: var(--ink-3); line-height: 1.7; max-width: 330px; }
.btn.dgr:where(.store-setup, .store-setup *) { border-color: var(--crit); color: var(--crit); background: var(--paper); }
.btn.dgr:hover:where(.store-setup, .store-setup *) { background: var(--crit); color: var(--on-accent); }
.racts:where(.store-setup, .store-setup *) button svg,
.racts:where(.store-setup, .store-setup *) a svg { width: 14px; height: 14px; display: block; }
.racts:where(.store-setup, .store-setup *) button,
.racts:where(.store-setup, .store-setup *) a { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; color: var(--ink-3); }
.racts:where(.store-setup, .store-setup *) button:hover,
.racts:where(.store-setup, .store-setup *) a:hover { color: var(--brand); background: var(--brand-soft); }
.mapbox:where(.store-setup, .store-setup *) { position: relative; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: var(--panel); }
.mapbox:where(.store-setup, .store-setup *) .tfind { position: absolute; top: 10px; inset-inline: 10px; z-index: 2; background: var(--paper); border-radius: 10px; }
.mapgrid:where(.store-setup, .store-setup *) { height: 180px; display: grid; place-items: center; background-image: linear-gradient(var(--line) 1px,transparent 1px),
                   linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size: 26px 26px; }
.days:where(.store-setup, .store-setup *) { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.dayrow:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dayrow:where(.store-setup, .store-setup *) .dn { min-width: 70px; font-size: 12.8px; font-weight: 600; }
.dayrow:where(.store-setup, .store-setup *) .dt { display: flex; gap: 7px; align-items: center; flex: 1 1 0%; min-width: 0px; }
.dayrow:where(.store-setup, .store-setup *) .dt .in { width: 92px; }
.is-off:where(.store-setup, .store-setup *) { opacity: 0.45; pointer-events: none; }
.cbrow.off:where(.store-setup, .store-setup *) { opacity: 0.55; }
.rad:where(.store-setup, .store-setup *) { width: 20px; height: 20px; border-radius: 50%; border: 1.8px solid var(--line-2); background: var(--paper); flex: 0 0 auto; cursor: pointer; position: relative; display: inline-block; }
.rad:hover:where(.store-setup, .store-setup *) { border-color: var(--brand); }
.rad.on:where(.store-setup, .store-setup *) { border-color: var(--brand); }
.rad.on:where(.store-setup, .store-setup *)::after { content: ""; position: absolute; inset: 3.4px; border-radius: 50%; background: var(--brand); }
.rad[disabled]:where(.store-setup, .store-setup *) { cursor: not-allowed; opacity: 0.6; }
.brorder:where(.store-setup, .store-setup *) { list-style: none; margin: 14px 0px 0px; padding: 0px; display: flex; flex-direction: column; gap: 8px; }
.brorder:where(.store-setup, .store-setup *) li { display: flex; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 11px; background: var(--paper); font-size: 13px; font-weight: 600; cursor: grab; }
.brorder:where(.store-setup, .store-setup *) li:hover { border-color: var(--brand); }
.whenc:where(.store-setup, .store-setup *) { display: flex; width: 100%; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 12px 13px; margin-top: 10px; text-align: start; cursor: pointer; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); }
.whenc:hover:where(.store-setup, .store-setup *) { border-color: var(--line-2); }
.whenc.on:where(.store-setup, .store-setup *) { border-color: var(--brand); background: var(--brand-soft); }
.whenc:where(.store-setup, .store-setup *) .wt b { display: block; font-size: 13px; font-weight: 600; }
.whenc:where(.store-setup, .store-setup *) .wt span { display: block; font-size: 11.6px; color: var(--ink-3); line-height: 1.6; margin-top: 3px; }
.whenc:where(.store-setup, .store-setup *) .wk { display: grid; place-items: center; width: 18px; height: 18px; color: var(--brand); flex: 0 0 auto; }
.back-link:where(.store-setup, .store-setup *) { display: inline-flex; align-items: center; gap: 6px; }
.back-link:where(.store-setup, .store-setup *) svg { width: 14px; height: 14px; }
.pgrid:where(.store-setup, .store-setup *) { display: grid; gap: 14px; padding: 14px; grid-template-columns: repeat(auto-fill, minmax(224px, 1fr)); }
.pcx:where(.store-setup, .store-setup *) { position: relative; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 18px 18px 18px 6px; background: var(--paper); box-shadow: var(--sh1); overflow: hidden; transition: border-color 0.16s, box-shadow 0.16s, transform 0.16s; }
.pcx:hover:where(.store-setup, .store-setup *) { border-color: var(--line-2); box-shadow: var(--sh2); transform: translateY(-2px); }
.pcx[data-st="out"]:where(.store-setup, .store-setup *) { --stc: var(--crit); }
.pcx[data-st="low"]:where(.store-setup, .store-setup *) { --stc: var(--amber); }
.pcx[data-st="sale"]:where(.store-setup, .store-setup *) { --stc: var(--ok); }
.pcx[data-st="hid"]:where(.store-setup, .store-setup *) { --stc: var(--ink-3); }
.pcx-st:where(.store-setup, .store-setup *) { position: absolute; top: 10px; inset-inline-end: 10px; z-index: 3; padding: 2px 9px; border-radius: 99px; font-size: 10.6px; font-weight: 600; color: var(--on-accent); background: var(--stc,var(--brand)); box-shadow: var(--sh1); }
.pcx-media:where(.store-setup, .store-setup *) { position: relative; margin: 12px 12px 0px; border-radius: 16px 16px 16px 4px; overflow: hidden; aspect-ratio: 4 / 3; background: var(--panel); }
.pcx-ph:where(.store-setup, .store-setup *) { position: absolute; inset: 0px; display: grid; place-items: center; }
.pcx-ph:where(.store-setup, .store-setup *) .thb { width: 100%; height: 100%; border-radius: 0px; font-size: 44px; box-shadow: none; }
.pcx-rail:where(.store-setup, .store-setup *) { position: absolute; top: 10px; inset-inline-start: 10px; z-index: 3; display: flex; flex-direction: column; gap: 1px; padding: 3px; border-radius: 99px; background: var(--paper); box-shadow: var(--sh2); opacity: 0; transform: translateX(calc(var(--dirs,-1) * 8px)); transition: opacity .16s var(--ease),transform .16s var(--ease); }
[dir="rtl"] .pcx-rail:where(.store-setup, .store-setup *) { --dirs: 1; }
.pcx:hover:where(.store-setup, .store-setup *) .pcx-rail,
.pcx:focus-within:where(.store-setup, .store-setup *) .pcx-rail { opacity: 1; transform: translateX(0px); }
.pcx-rail:where(.store-setup, .store-setup *) button,
.pcx-rail:where(.store-setup, .store-setup *) a { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; color: var(--ink-2); }
.pcx-rail:where(.store-setup, .store-setup *) button:hover,
.pcx-rail:where(.store-setup, .store-setup *) a:hover { color: var(--brand); background: var(--brand-soft); }
.pcx-rail:where(.store-setup, .store-setup *) svg { width: 14px; height: 14px; display: block; }
.pcx-b:where(.store-setup, .store-setup *) { display: flex; flex-direction: column; gap: 9px; padding: 12px; }
.pcx-h:where(.store-setup, .store-setup *) b { display: block; font-size: 13.6px; font-weight: 600; line-height: 1.45; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pcx-h:where(.store-setup, .store-setup *) span { display: block; font-size: 10.8px; color: var(--ink-3); margin-top: 1px; }
.pcx-r:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.pcx-p:where(.store-setup, .store-setup *) { display: flex; align-items: baseline; gap: 3px; color: var(--ink); }
.pcx-p:where(.store-setup, .store-setup *) b { font-size: 19px; font-weight: 600; line-height: 1; }
.pcx-p:where(.store-setup, .store-setup *) i { font-style: normal; font-size: 11px; color: var(--ink-3); }
.pcx-qty:where(.store-setup, .store-setup *) { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 99px; border: 1px solid var(--line); background: var(--panel); font-size: 11.6px; color: var(--ink-2); cursor: pointer; }
.pcx-qty:hover:where(.store-setup, .store-setup *) { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.pcx-qty:where(.store-setup, .store-setup *) svg { width: 12px; height: 12px; }
.pcx-c:where(.store-setup, .store-setup *) { display: flex; align-items: center; gap: 6px; padding-top: 9px; border-top: 1px solid var(--line); }
.pcx-c:where(.store-setup, .store-setup *) .catsel { flex: 1 1 0%; min-width: 0px; display: flex; align-items: center; justify-content: space-between; gap: 6px; cursor: pointer; color: var(--ink-3); }
.pcx-c:where(.store-setup, .store-setup *) .catsel svg { width: 12px; height: 12px; flex: 0 0 auto; }
.pcx-c:where(.store-setup, .store-setup *) .ic-sm { width: 26px; height: 26px; border-radius: 8px; border: 1px dashed var(--line-2); color: var(--ink-3); }
.pcx-c:where(.store-setup, .store-setup *) .ic-sm:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.pcx-c:where(.store-setup, .store-setup *) .ic-sm svg { width: 13px; height: 13px; }
/*  لونُ المصغّرة يُحسب من رقمِ صبغةٍ لكلِّ منتج (`--h`، من الخادم). وكان
    التشبّعُ والإضاءةُ أرقاماً مكتوبةً في ثلاث قواعد، فصارت أسماءً تُعرَّف هنا
    مرّةً وتقلبها السمةُ الداكنة — والصيغةُ واحدة (٢٦ سبتمبر).  */
.thb:where(.store-setup, .store-setup *) {
  --thb-ink-s: 55%;  --thb-ink-l: 34%;
  --thb-bg-s: 62%;   --thb-bg-l: var(--l, 90%);
  --thb-edge-s: 45%; --thb-edge-l: calc(var(--l, 90%) - 7%);
  color: hsl(var(--h) var(--thb-ink-s) var(--thb-ink-l));
  background: hsl(var(--h) var(--thb-bg-s) var(--thb-bg-l));
  box-shadow: inset 0 0 0 1px hsl(var(--h) var(--thb-edge-s) var(--thb-edge-l));
}
:root[data-theme="dark"] .thb:where(.store-setup, .store-setup *) {
  --thb-ink-s: 72%; --thb-ink-l: 72%; --thb-bg-s: 26%; --thb-bg-l: 20%; --thb-edge-s: 22%; --thb-edge-l: 27%;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .thb:where(.store-setup, .store-setup *) {
    --thb-ink-s: 72%; --thb-ink-l: 72%; --thb-bg-s: 26%; --thb-bg-l: 20%; --thb-edge-s: 22%; --thb-edge-l: 27%;
  }
}
.fmenu:where(.store-setup, .store-setup *) { border-radius: 16px; padding: 7px; box-shadow: var(--sh3); border: 1px solid var(--line); }
.pcx-st:where(.store-setup, .store-setup *) { top: auto; bottom: 30px; inset-inline: 10px auto; }
.pcx-media:where(.store-setup, .store-setup *) .pcx-st { position: absolute; z-index: 3; bottom: 32px; inset-inline: 10px auto; top: auto; }
.pcx-ph:where(.store-setup, .store-setup *) .thb { border-radius: 0px; }
.pcx-rail:where(.store-setup, .store-setup *) { opacity: 0.55; transform: none; backdrop-filter: blur(3px); }
.pcx:hover:where(.store-setup, .store-setup *) .pcx-rail,
.pcx:focus-within:where(.store-setup, .store-setup *) .pcx-rail { opacity: 1; }
@media (hover: none), (pointer: coarse) {
  .pcx-rail:where(.store-setup, .store-setup *) { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .pcx-rail:where(.store-setup, .store-setup *) { transition: none; }
}
.sheet:where(.store-setup, .store-setup *) { border-radius: 8px; }
.pcard:where(.store-setup, .store-setup *) { border-radius: 16px 16px 16px 5px; }
.colpop:where(.store-setup, .store-setup *),
.swpop:where(.store-setup, .store-setup *) { border-radius: 16px 16px 16px 5px; }
.emp:where(.store-setup, .store-setup *) { border-radius: 14px 14px 14px 4px; }
.edhead:where(.store-setup, .store-setup *),
.pcard-h:where(.store-setup, .store-setup *),
.cefh:where(.store-setup, .store-setup *),
.side-h:where(.store-setup, .store-setup *) { position: relative; }
.edhead:where(.store-setup, .store-setup *)::before,
.side-h:where(.store-setup, .store-setup *)::before { content: ""; position: absolute; inset-inline-start: 0px; top: 50%; transform: translateY(-50%); width: 3px; height: 16px; border-radius: 99px; background: var(--brand); }
.edhead:where(.store-setup, .store-setup *) { padding-inline-start: 14px; }
.edtab:where(.store-setup, .store-setup *) tbody tr,
.sheet:where(.store-setup, .store-setup *) table tbody tr { position: relative; transition: background 0.13s; }
.edtab:where(.store-setup, .store-setup *) tbody tr::after,
.sheet:where(.store-setup, .store-setup *) table tbody tr::after { content: ""; position: absolute; inset-block: 0px; inset-inline-start: 0px; width: 0px; background: var(--brand); transition: width .14s var(--ease); }
.edtab:where(.store-setup, .store-setup *) tbody tr:hover::after,
.sheet:where(.store-setup, .store-setup *) table tbody tr:hover::after { width: 3px; }
.edtab:where(.store-setup, .store-setup *) tbody tr:hover,
.sheet:where(.store-setup, .store-setup *) table tbody tr:hover { background: var(--panel); }
.edtab:where(.store-setup, .store-setup *) thead th,
.sheet:where(.store-setup, .store-setup *) table thead th { font-size: 11.6px; font-weight: 600; color: var(--ink-3); letter-spacing: normal; border-bottom: 2px solid var(--line); }
.pbar:where(.store-setup, .store-setup *),
.edbar:where(.store-setup, .store-setup *) { gap: 9px; }
.pbar:where(.store-setup, .store-setup *) .tfind,
.edbar:where(.store-setup, .store-setup *) .tfind { border-radius: 12px 12px 12px 4px; }
.pbar:where(.store-setup, .store-setup *) .btn.gho,
.edbar:where(.store-setup, .store-setup *) .btn.gho { border-radius: 11px 11px 11px 3px; }
.btn:where(.store-setup, .store-setup *) { border-radius: 11px 11px 11px 3px; }
.btn.sq:where(.store-setup, .store-setup *) { border-radius: 11px 11px 11px 3px; }
.chip:where(.store-setup, .store-setup *) { border-radius: 99px; }
.in:where(.store-setup, .store-setup *),
.ddbtn:where(.store-setup, .store-setup *) { border-radius: 11px 11px 11px 3px; }
.ddm:where(.store-setup, .store-setup *) { border-radius: 13px 13px 13px 4px; }
.mdrop:where(.store-setup, .store-setup *) { border-radius: 13px 13px 13px 4px; }
.tgl:where(.store-setup, .store-setup *) { width: 46px; height: 24px; border-radius: 8px 8px 8px 2px; background: var(--line-2); border: 1px solid transparent; position: relative; flex: 0 0 auto; transition: background .18s var(--ease),border-color .18s; }
.tgl:where(.store-setup, .store-setup *) i { position: absolute; top: 3px; inset-inline-start: 3px; width: 16px; height: 16px; border-radius: 5px 5px 5px 1px; background: var(--paper); box-shadow: var(--knob-shadow-2) 0px 1px 3px; transition: inset-inline-start .18s var(--ease); }
.tgl.on:where(.store-setup, .store-setup *) { background: var(--brand); border-color: var(--brand); }
.tgl.on:where(.store-setup, .store-setup *) i { inset-inline-start: 25px; }
.tgl.on:where(.store-setup, .store-setup *)::after { content: ""; position: absolute; top: 50%; inset-inline-start: 9px; transform: translateY(-50%); width: 7px; height: 2px; border-radius: 99px; background: var(--on-accent-75); }
.tgl:hover:where(.store-setup, .store-setup *) { border-color: var(--brand); }
.cbx:where(.store-setup, .store-setup *) { width: 20px; height: 20px; border-radius: 6px 6px 6px 1px; border: 1.7px solid var(--line-2); background: var(--paper); flex: 0 0 auto; cursor: pointer; display: grid; place-items: center; font-size: 12px; color: transparent; transition: background 0.14s, border-color 0.14s; }
.cbx:hover:where(.store-setup, .store-setup *) { border-color: var(--brand); }
.cbx.on:where(.store-setup, .store-setup *) { background: var(--brand); border-color: var(--brand); color: var(--on-accent); }
.rad:where(.store-setup, .store-setup *) { width: 20px; height: 20px; border-radius: 50%; border: 1.8px solid var(--line-2); background: var(--paper); flex: 0 0 auto; cursor: pointer; position: relative; }
.rad:hover:where(.store-setup, .store-setup *) { border-color: var(--brand); }
.rad.on:where(.store-setup, .store-setup *) { border-color: var(--brand); }
.rad.on:where(.store-setup, .store-setup *)::after { content: ""; position: absolute; inset: 3.6px; border-radius: 4px 4px 4px 1px; background: var(--brand); }
.psrow:where(.store-setup, .store-setup *) { position: relative; transition: background 0.13s; }
.psrow:where(.store-setup, .store-setup *)::after { content: ""; position: absolute; inset-block: 0px; inset-inline-start: 0px; width: 0px; background: var(--brand); transition: width .14s var(--ease); border-radius: 99px; }
.psrow:hover:where(.store-setup, .store-setup *)::after { width: 3px; }
.psrow.nav:hover:where(.store-setup, .store-setup *) { background: var(--panel); }
.pslist:where(.store-setup, .store-setup *) { padding-inline-start: 4px; }
.tgl.on:where(.store-setup, .store-setup *)::after { display: none; }
.tgl:where(.store-setup, .store-setup *) { width: 44px; height: 25px; }
.tgl:where(.store-setup, .store-setup *) i { width: 17px; height: 17px; top: 3px; }
.tgl.on:where(.store-setup, .store-setup *) i { inset-inline-start: 23px; }
.hi:where(.store-setup, .store-setup *) { position: static; align-items: center; gap: 14px; margin: 0px 0px 16px; padding: 14px 18px; border: 1px solid var(--line); border-radius: 16px 16px 16px 5px; background: var(--paper); box-shadow: var(--sh1); }
.hi:where(.store-setup, .store-setup *)::before { content: ""; position: absolute; inset-inline-start: 0px; top: 14px; bottom: 14px; width: 3px; border-radius: 99px; background: var(--brand); }
.hi:where(.store-setup, .store-setup *) > div:first-child { padding-inline-start: 12px; min-width: 0px; }
.hi:where(.store-setup, .store-setup *) h1 { font-size: 22px; line-height: 1.3; }
.hi:where(.store-setup, .store-setup *) p { font-size: 13px; margin-top: 2px; }
@media (max-width: 640px) {
  .hi:where(.store-setup, .store-setup *) { padding: 12px 14px; }
  .hi:where(.store-setup, .store-setup *) h1 { font-size: 19px; }
}
.back-link:where(.store-setup, .store-setup *) { margin-bottom: 10px; }
.pbar:where(.store-setup, .store-setup *),
.edbar:where(.store-setup, .store-setup *) { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 0px 0px 14px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 14px 14px 14px 4px; background: var(--paper); box-shadow: var(--sh1); }
.pbar:where(.store-setup, .store-setup *) .tfind,
.edbar:where(.store-setup, .store-setup *) .tfind { flex: 1 1 220px; min-width: 0px; border-radius: 10px 10px 10px 3px; background: var(--panel); border-color: transparent; }
.pbar:where(.store-setup, .store-setup *) .tfind:focus-within,
.edbar:where(.store-setup, .store-setup *) .tfind:focus-within { border-color: var(--brand); background: var(--paper); }
.pbar:where(.store-setup, .store-setup *) .btn.gho:first-of-type,
.edbar:where(.store-setup, .store-setup *) .btn.gho:first-of-type { margin-inline-start: 2px; }
.pbar:where(.store-setup, .store-setup *) .dd,
.edbar:where(.store-setup, .store-setup *) .dd { width: auto; min-width: 150px; }
.modes:where(.store-setup, .store-setup *) { border-radius: 10px 10px 10px 3px; }
@media (max-width: 760px) {
  .pbar:where(.store-setup, .store-setup *),
  .edbar:where(.store-setup, .store-setup *) { padding: 10px; }
  .pbar:where(.store-setup, .store-setup *) .tfind,
  .edbar:where(.store-setup, .store-setup *) .tfind { flex: 1 1 100%; }
  .pbar:where(.store-setup, .store-setup *) > .btn,
  .edbar:where(.store-setup, .store-setup *) > .btn,
  .pbar:where(.store-setup, .store-setup *) > .dd,
  .edbar:where(.store-setup, .store-setup *) > .dd,
  .pbar:where(.store-setup, .store-setup *) > .ic-sm { flex: 0 1 auto; }
  .pbar:where(.store-setup, .store-setup *) > .btn,
  .edbar:where(.store-setup, .store-setup *) > .btn { padding-inline: 13px; }
  .pbar:where(.store-setup, .store-setup *) .dd,
  .edbar:where(.store-setup, .store-setup *) .dd { min-width: 132px; }
}
.pbar:where(.store-setup, .store-setup *),
.edbar:where(.store-setup, .store-setup *) { flex-direction: row; align-items: center; justify-content: flex-start; }
.pbar:where(.store-setup, .store-setup *) .tfind,
.edbar:where(.store-setup, .store-setup *) .tfind { flex: 1 1 200px; order: 1; }
.pbar:where(.store-setup, .store-setup *) > .ic-sm { order: 2; margin-inline-end: auto; }
.pbar:where(.store-setup, .store-setup *) > .btn,
.edbar:where(.store-setup, .store-setup *) > .btn { order: 3; }
.pbar:where(.store-setup, .store-setup *) > .dd,
.edbar:where(.store-setup, .store-setup *) > .dd { order: 3; }
.pbar:where(.store-setup, .store-setup *) .modes { order: 4; margin-inline-start: 4px; position: relative; padding-inline-start: 10px; }
.pbar:where(.store-setup, .store-setup *) .modes::before { content: ""; position: absolute; inset-inline-start: 0px; top: 6px; bottom: 6px; width: 1px; background: var(--line); }
.modes:where(.store-setup, .store-setup *) { border: 1px solid var(--line); background: var(--panel); padding: 2px; gap: 2px; display: inline-flex; overflow: visible; }
.mode:where(.store-setup, .store-setup *) { width: 32px; height: 30px; border-radius: 8px 8px 8px 2px; background: transparent; }
.mode.on:where(.store-setup, .store-setup *) { background: var(--paper); color: var(--brand); box-shadow: var(--sh1); }
.mode:where(.store-setup, .store-setup *) svg { width: 15px; height: 15px; }
@media (max-width: 760px) {
  .pbar:where(.store-setup, .store-setup *),
  .edbar:where(.store-setup, .store-setup *) { justify-content: flex-start; }
  .pbar:where(.store-setup, .store-setup *) .tfind,
  .edbar:where(.store-setup, .store-setup *) .tfind { flex: 1 1 100%; }
  .pbar:where(.store-setup, .store-setup *) > .ic-sm { margin-inline-end: 0px; }
  .pbar:where(.store-setup, .store-setup *) .modes { margin-inline-start: auto; padding-inline-start: 0px; }
  .pbar:where(.store-setup, .store-setup *) .modes::before { display: none; }
}
.metrics:where(.store-setup, .store-setup *) { display: grid; gap: 10px; margin: 0px 0px 14px; grid-template-columns: repeat(auto-fit, minmax(148px, 1fr)); }
.mode:where(.store-setup, .store-setup *) { display: inline-flex; align-items: center; gap: 6px; width: auto; min-width: 32px; padding: 0px 8px; height: 30px; font-size: 12.2px; font-weight: 600; white-space: nowrap; }
.mode:where(.store-setup, .store-setup *) .ml { max-width: 0px; overflow: hidden; opacity: 0; transition: max-width .18s var(--ease),opacity .14s,margin .18s; }
.mode.on:where(.store-setup, .store-setup *) .ml { max-width: 72px; opacity: 1; margin-inline-start: 1px; }
@media (hover: hover) {
  .mode:hover:where(.store-setup, .store-setup *) .ml,
  .mode:focus-visible:where(.store-setup, .store-setup *) .ml { max-width: 72px; opacity: 1; margin-inline-start: 1px; }
}
.mode:where(.store-setup, .store-setup *) svg { flex: 0 0 auto; }
.racts:where(.store-setup, .store-setup *) button,
.racts:where(.store-setup, .store-setup *) a,
.pcx-rail:where(.store-setup, .store-setup *) button,
.pcx-rail:where(.store-setup, .store-setup *) a { position: relative; }
.racts:where(.store-setup, .store-setup *) button::after,
.racts:where(.store-setup, .store-setup *) a::after,
.pcx-rail:where(.store-setup, .store-setup *) button::after,
.pcx-rail:where(.store-setup, .store-setup *) a::after { content: attr(title); position: absolute; bottom: calc(100% + 7px); inset-inline-start: 50%; transform: translateX(50%) translateY(3px); padding: 4px 9px; border-radius: 8px 8px 8px 2px; background: var(--ink); color: var(--paper); font-size: 11px; font-weight: 600; white-space: nowrap; pointer-events: none; opacity: 0; z-index: 40; box-shadow: var(--sh2); transition: opacity .13s,transform .13s var(--ease); }
[dir="ltr"] .racts:where(.store-setup, .store-setup *) button::after,
[dir="ltr"] .racts:where(.store-setup, .store-setup *) a::after,
[dir="ltr"] .pcx-rail:where(.store-setup, .store-setup *) button::after,
[dir="ltr"] .pcx-rail:where(.store-setup, .store-setup *) a::after { transform: translateX(-50%) translateY(3px); }
@media (hover: hover) {
  .racts:where(.store-setup, .store-setup *) button:hover::after,
  .racts:where(.store-setup, .store-setup *) a:hover::after,
  .racts:where(.store-setup, .store-setup *) button:focus-visible::after,
  .racts:where(.store-setup, .store-setup *) a:focus-visible::after,
  .pcx-rail:where(.store-setup, .store-setup *) button:hover::after,
  .pcx-rail:where(.store-setup, .store-setup *) a:hover::after,
  .pcx-rail:where(.store-setup, .store-setup *) button:focus-visible::after,
  .pcx-rail:where(.store-setup, .store-setup *) a:focus-visible::after { opacity: 1; transform: translateX(50%) translateY(0px); }
  [dir="ltr"] .racts:where(.store-setup, .store-setup *) button:hover::after,
  [dir="ltr"] .racts:where(.store-setup, .store-setup *) a:hover::after,
  [dir="ltr"] .pcx-rail:where(.store-setup, .store-setup *) button:hover::after,
  [dir="ltr"] .pcx-rail:where(.store-setup, .store-setup *) a:hover::after { transform: translateX(-50%) translateY(0px); }
}
.sheet:where(.store-setup, .store-setup *) table tbody tr:first-child .racts button::after,
.sheet:where(.store-setup, .store-setup *) table tbody tr:first-child .racts a::after { bottom: auto; top: calc(100% + 7px); }
@media (hover: none), (pointer: coarse) {
  .racts:where(.store-setup, .store-setup *) button::after,
  .racts:where(.store-setup, .store-setup *) a::after,
  .pcx-rail:where(.store-setup, .store-setup *) button::after,
  .pcx-rail:where(.store-setup, .store-setup *) a::after { position: static; opacity: 1; transform: none; z-index: auto; background: transparent; color: inherit; box-shadow: none; padding: 0px; font-size: 10.5px; font-weight: 600; letter-spacing: -0.1px; }
  .racts:where(.store-setup, .store-setup *) button,
  .racts:where(.store-setup, .store-setup *) a { width: auto; min-width: 28px; height: 28px; grid-auto-flow: column; gap: 5px; padding-inline: 9px; border: 1px solid var(--line); border-radius: 9px 9px 9px 3px; }
  .pcx-rail:where(.store-setup, .store-setup *) { flex-direction: row; gap: 2px; border-radius: 12px 12px 12px 4px; }
  .pcx-rail:where(.store-setup, .store-setup *) button,
  .pcx-rail:where(.store-setup, .store-setup *) a { width: auto; height: auto; min-width: 27px; grid-auto-flow: row; gap: 2px; padding: 4px 7px; border-radius: 9px 9px 9px 3px; }
}
.tfoot:where(.store-setup, .store-setup *) { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 11px 16px; border-top: 1px solid var(--line); background: var(--panel); font-size: 12px; color: var(--ink-3); }
.tfoot:where(.store-setup, .store-setup *) .note-sm { color: var(--ink-3); font-size: 11.6px; }
.tfoot:where(.store-setup, .store-setup *) b,
.tfoot:where(.store-setup, .store-setup *) .mono { color: var(--ink-2); font-variant-numeric: tabular-nums; }
.metrics:where(.store-setup, .store-setup *) { display: flex; flex-wrap: nowrap; gap: 10px; margin: 0px 0px 14px; overflow: auto hidden; scrollbar-width: thin; padding-block: 2px 4px; }
.ddm:where(.store-setup, .store-setup *) { border-color: var(--line-2); }
.pfull:where(.store-setup, .store-setup *) { max-width: none; }
.savebar:where(.store-setup, .store-setup *) .selN { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--brand); }
.savebar:where(.store-setup, .store-setup *) .selN b { font-variant-numeric: tabular-nums; }
.store-setup .shell,
.store-setup .dash { max-width: 100%; min-width: 0px; }
.store-setup .dash { padding-inline: 20px; }

/* ١٥ أكتوبر (مصطفى): طبقةُ الدفع على الصفحة كلّها (mf-embed.js S.payVeil) — كصفحة الدفع في الموقع */
.pay-veil { position: fixed; inset: 0; z-index: 9999; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 24px; text-align: center; background: color-mix(in srgb, var(--paper) 88%, transparent); backdrop-filter: blur(2px); }
.pay-veil p { margin: 0; font-weight: 600; color: var(--ink); max-width: 340px; line-height: 1.6; }
.pay-veil-spin { width: 44px; height: 44px; border-radius: 50%; border: 4px solid var(--line); border-top-color: var(--brand); animation: payVeilSpin .8s linear infinite; }
@keyframes payVeilSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .pay-veil-spin { animation-duration: 2.4s; } }
body.is-paying { overflow: hidden; }