:root {
  --bg-deep: #101e22;
  --bg-deep-2: #152d33;
  --bg-deep-3: #1b3940;
  --paper: #f6efdd;
  --paper-soft: #fbf8ef;
  --amber: #f2a93b;
  --amber-soft: #f7c878;
  --coral: #e1613f;
  --teal: #4fb3a0;
  --teal-soft: #7fd1c1;
  --ink: #12242a;
  --muted: #617178;
  --line: #dce6e1;
  --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 12% -5%, rgba(45, 103, 108, .82) 0, transparent 30rem),
    radial-gradient(circle at 88% 18%, rgba(242, 169, 59, .08), transparent 26rem),
    var(--bg-deep);
  color: var(--paper);
  font-family: Vazirmatn, Tahoma, sans-serif;
}
body:has(dialog[open]) { overflow: hidden; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
[hidden] { display: none !important; }

.topbar {
  position: sticky;
  top: 0;
  z-index: 40;
  height: 72px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 max(20px, calc((100% - 1240px) / 2));
  gap: 14px;
  background: rgba(16, 30, 34, .92);
  border-bottom: 1px solid rgba(127, 209, 193, .18);
  backdrop-filter: blur(14px);
}
.brand {
  display: flex;
  align-items: center;
  justify-self: center;
  gap: 10px;
}
.brand > img {
  width: 48px;
  height: 48px;
  object-fit: contain;
  filter: drop-shadow(0 6px 12px #0007);
}
.brand > span, .brand > div { display: grid; min-width: 0; gap: 1px; }
.brand strong, .brand b { color: var(--paper); font-size: 15px; white-space: nowrap; }
.brand strong i { color: var(--amber-soft); font-style: normal; padding-inline: 3px; }
.brand small { color: var(--teal-soft); font-size: 10px; }
.superapp-return {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-self: start;
  gap: 8px;
  padding: 0 14px;
  border: 1px solid rgba(127, 209, 193, .55);
  border-radius: 12px;
  background: linear-gradient(145deg, #1d5352, #173b41);
  color: #dff7f0;
  font-weight: 900;
  box-shadow: 0 8px 20px rgba(17, 59, 62, .28);
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.superapp-return > span:first-child { font-family: Arial, sans-serif; font-size: 19px; line-height: 1; }
.superapp-return:hover { transform: translateY(-1px); border-color: var(--amber); background: linear-gradient(145deg, #22615d, #19454a); }
.superapp-back-icon { width: 20px; height: 20px; display: grid; place-items: center; color: var(--amber-soft); }
.superapp-back-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.topbar-action { justify-self: end; min-height: 44px !important; padding-inline: 16px !important; }

.primary, .secondary, .button, .mini {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 18px;
  border: 0;
  border-radius: 14px;
  font-weight: 800;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.primary, .button.gold, .button.dark {
  background: var(--amber);
  color: var(--ink);
  box-shadow: 0 10px 24px rgba(242, 169, 59, .2);
}
.button.ghost, .secondary {
  border: 1px solid rgba(127, 209, 193, .28);
  background: rgba(127, 209, 193, .1);
  color: var(--paper);
}
.button.danger { background: #b64132; color: #fff; box-shadow: 0 10px 24px rgba(182, 65, 50, .18); }
.primary:hover, .secondary:hover, .button:hover, .mini:hover { transform: translateY(-1px); }
.primary:active, .secondary:active, .button:active, .mini:active { transform: translateY(0) scale(.985); }
.button:disabled, button:disabled { cursor: not-allowed; filter: grayscale(.6); opacity: .58; transform: none; }

main { overflow: clip; }
.hero {
  max-width: 1240px;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  align-items: center;
  gap: 70px;
  margin: 0 auto;
  padding: 88px 20px 78px;
}
.eyebrow, .workspace-hero span, .form-title + span {
  color: var(--teal-soft);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .04em;
}
.hero h1 {
  margin: 13px 0 18px;
  font-size: clamp(43px, 6vw, 76px);
  line-height: 1.25;
  letter-spacing: -.055em;
}
.hero h1 em { color: var(--amber-soft); font-style: normal; }
.hero-copy > p { max-width: 680px; color: #c0d5cd; font-size: 17px; line-height: 2; }
.hero-actions { display: flex; gap: 11px; margin-top: 29px; }
.hero-card {
  min-height: 365px;
  display: flex;
  flex-direction: column;
  justify-content: end;
  position: relative;
  overflow: hidden;
  padding: 36px;
  border: 1px solid rgba(127, 209, 193, .25);
  border-radius: 38px;
  background: radial-gradient(circle at 78% 10%, rgba(247, 200, 120, .28), transparent 35%), linear-gradient(145deg, #1b4c4b, #132a30);
  box-shadow: 0 34px 75px rgba(0, 0, 0, .34);
  transform: rotate(-2deg);
}
.hero-card > img { position: absolute; top: 33px; right: 34px; width: 105px; filter: drop-shadow(0 15px 25px #07171890); }
.hero-card > span, .hero-card > small { color: #a9c9bf; }
.hero-card > b { margin: 8px 0; direction: ltr; color: #fff; font-size: 21px; text-align: right; }
.hero-card > i { position: absolute; top: -70px; left: -50px; width: 220px; height: 220px; border: 26px solid rgba(127, 209, 193, .06); border-radius: 50%; }

.directory {
  min-height: 620px;
  padding: 78px max(20px, calc((100% - 1240px) / 2)) 110px;
  background: var(--paper);
  color: var(--ink);
}
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.section-head span { color: #667c74; font-size: 12px; }
.section-head h2 { margin: 5px 0 0; font-size: 34px; }
.search {
  display: flex;
  gap: 3px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(18, 36, 42, .07);
}
.search :is(input, select) { min-width: 155px; border: 0; background: transparent; box-shadow: none; }
.business-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.business-card {
  overflow: hidden;
  border: 1px solid #dfe7e2;
  border-radius: 25px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(18, 36, 42, .08);
  transition: transform .24s ease, box-shadow .24s ease;
}
.business-card:hover { transform: translateY(-5px); box-shadow: 0 23px 50px rgba(18, 36, 42, .13); }
.business-card img { width: 100%; height: 205px; display: block; object-fit: cover; }
.business-card > div { padding: 21px; }
.business-card span { color: #55796d; font-size: 11px; font-weight: 800; }
.business-card h3 { margin: 7px 0; font-size: 20px; }
.business-card p { height: 52px; overflow: hidden; margin: 0; color: #66736e; line-height: 1.9; }
.business-card b { display: block; margin-top: 16px; color: #1e745f; }
.skeleton { height: 350px; border-radius: 25px; background: linear-gradient(90deg, #e7e7e2, #faf9f3, #e7e7e2); background-size: 220% 100%; animation: pulse 1.4s infinite; }

.state {
  max-width: 560px;
  min-height: 480px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  margin: 65px auto;
  padding: 60px 30px;
  border: 1px solid rgba(127, 209, 193, .13);
  border-radius: 30px;
  background: linear-gradient(145deg, #163239, #102328);
  text-align: center;
}
.state-mark { width: 92px; height: 92px; display: grid; place-items: center; margin-bottom: 8px; border-radius: 26px; background: var(--amber); }
.state-mark img { width: 78px; height: 78px; object-fit: contain; }
.state p { color: #9fb7af; }
.loader { width: 44px; height: 44px; border: 4px solid rgba(255, 255, 255, .12); border-top-color: var(--amber); border-radius: 50%; animation: spin .8s linear infinite; }

.workspace { max-width: 1240px; margin: 0 auto; padding: 42px 20px 100px; }
.workspace-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
  padding: 32px 36px;
  border: 1px solid rgba(127, 209, 193, .2);
  border-radius: 28px;
  background: linear-gradient(125deg, #123b3d, #1d675e);
  box-shadow: 0 20px 45px rgba(0, 0, 0, .15);
  position: relative;
  overflow: hidden;
}
.workspace-hero::after { content: ""; position: absolute; width: 240px; height: 240px; left: -70px; top: -110px; border: 34px solid rgba(247, 200, 120, .07); border-radius: 50%; pointer-events: none; }
.workspace-hero > * { position: relative; z-index: 1; }
.workspace-hero h1 { margin: 5px 0; font-size: clamp(27px, 4vw, 38px); }
.workspace-hero p { max-width: 760px; margin: 0; color: #c2dcd4; line-height: 1.9; }
.hero-step { width: 100px; display: grid; place-items: center; flex: 0 0 100px; gap: 2px; padding: 14px; border: 1px solid rgba(247, 200, 120, .22); border-radius: 20px; background: rgba(7, 30, 32, .22); text-align: center; }
.hero-step b { color: var(--amber-soft); font-size: 31px; }
.hero-step small { color: #c1d7d1; font-size: 9px; }
.panel {
  padding: 25px;
  border: 1px solid #dfe7e2;
  border-radius: var(--radius);
  background: var(--paper-soft);
  color: var(--ink);
  box-shadow: 0 13px 36px rgba(18, 36, 42, .09), inset 0 1px rgba(255, 255, 255, .78);
}
.panel h2, .panel h3 { margin-top: 0; }
.panel p { color: var(--muted); line-height: 1.8; }
.panel-head, .form-title, .owner-lookup > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.panel-head h2, .form-title h2, .owner-lookup h2 { margin: 0; }
.panel-head p, .form-title p, .owner-lookup p { margin: 3px 0 0; font-size: 12px; }
.premium-form { position: relative; overflow: visible; padding: 0; background: transparent; border: 0; box-shadow: none; }
.premium-form > .identity-card { margin-bottom: 15px; }
.form-section {
  overflow: hidden;
  margin-bottom: 15px;
  border: 1px solid #dfe7e2;
  border-radius: var(--radius);
  background: var(--paper-soft);
  color: var(--ink);
  box-shadow: 0 13px 36px rgba(18, 36, 42, .08);
}
.form-section > header { display: flex; align-items: center; gap: 13px; padding: 18px 22px; border-bottom: 1px solid #e3e9e5; background: linear-gradient(135deg, rgba(79, 179, 160, .08), rgba(242, 169, 59, .06)); }
.section-icon, .step-number { width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 42px; border-radius: 13px; background: #173e3c; color: var(--amber-soft); font-weight: 900; }
.form-section > header h3 { margin: 0; }
.form-section > header p { margin: 2px 0 0; color: var(--muted); font-size: 11px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 22px; }
.form-grid .wide { grid-column: 1 / -1; }
.booking-url-field > span { display: flex; align-items: center; gap: 8px; }
.booking-url-field > span i { padding: 3px 7px; border-radius: 999px; background: rgba(79, 179, 160, .12); color: #287763; font-size: 9px; font-style: normal; }
.offer-editor { overflow: hidden; border: 1px solid rgba(242, 169, 59, .34); border-radius: 20px; background: linear-gradient(145deg, rgba(16, 30, 34, .98), rgba(27, 57, 64, .98)); box-shadow: 0 17px 38px rgba(18, 36, 42, .14); }
.offer-editor summary { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 17px 20px; color: var(--paper); cursor: pointer; list-style: none; }
.offer-editor summary::-webkit-details-marker { display: none; }
.offer-editor summary > span { display: grid; gap: 4px; }
.offer-editor summary b { color: var(--amber-soft); font-size: 15px; }
.offer-editor summary small { color: #a8c8bf; font-size: 10px; font-weight: 500; }
.offer-editor summary > i { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 34px; border: 1px solid rgba(247, 200, 120, .25); border-radius: 11px; background: rgba(242, 169, 59, .09); color: var(--amber-soft); font-size: 19px; font-style: normal; transition: transform .2s ease; }
.offer-editor[open] summary > i { transform: rotate(180deg); }
.offer-editor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; padding: 20px; border-top: 1px solid rgba(247, 200, 120, .14); background: var(--paper-soft); }
.offer-editor-grid .wide { grid-column: 1 / -1; }
label { display: grid; align-content: start; gap: 7px; color: #50645d; font-size: 12px; font-weight: 800; }
label.is-optional::after { content: "عنوان برای پیامک اختیاری است"; color: #84918b; font-size: 10px; font-weight: 500; }
label > small { color: #788780; font-size: 10px; font-weight: 500; line-height: 1.7; }
input, textarea, select {
  width: 100%;
  min-height: 48px;
  padding: 11px 13px;
  border: 1px solid #cad9d2;
  border-radius: 12px;
  outline: 0;
  background: #fff;
  color: var(--ink);
  transition: border .18s ease, box-shadow .18s ease;
}
textarea { resize: vertical; line-height: 1.9; }
:is(input, textarea, select):focus { border-color: #4b9e88; box-shadow: 0 0 0 3px rgba(79, 179, 160, .12); }
input[readonly] { background: #edf3f0; color: #61736c; }
input[type="file"] { padding: 8px; }
.coordinate-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sticky-actions {
  position: sticky;
  bottom: 12px;
  z-index: 8;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 15px;
  padding: 13px 15px;
  border: 1px solid rgba(242, 169, 59, .28);
  border-radius: 18px;
  background: rgba(16, 30, 34, .95);
  color: var(--paper);
  box-shadow: 0 18px 45px rgba(0, 0, 0, .27);
  backdrop-filter: blur(14px);
}
.sticky-actions > span { color: #a9c1ba; font-size: 11px; }
.wide-action { width: 100%; margin-top: 15px; }
.inline-form-actions { display: flex; align-items: center; gap: 9px; }
.inline-form-actions .gold { flex: 1; }
.identity-card {
  min-height: 72px;
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 14px 16px;
  border: 1px solid rgba(79, 179, 160, .23);
  border-radius: 17px;
  background: linear-gradient(135deg, #e6f3ee, #faf5e8);
  color: var(--ink);
}
.identity-card::before { content: "✓"; width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 42px; border-radius: 13px; background: #277a66; color: #fff; font-weight: 900; }
.identity-card.muted { border-style: dashed; background: #eff3f0; color: #6d7b75; }
.identity-card.muted::before { content: "؟"; background: #a9b8b2; }
.identity-card.error { border-color: #efb8ae; background: #fff0ed; color: #8f3024; }
.identity-card.error::before { content: "!"; background: #c64b3b; }
.identity-card b, .identity-card small { display: block; }
.identity-card small { margin-top: 3px; color: #66776f; }
.owner-lookup { display: grid; gap: 16px; margin-bottom: 16px; }
.lookup-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; }

.ck.ck-editor { width: 100%; }
.ck.ck-toolbar { border-color: #cad9d2 !important; border-radius: 12px 12px 0 0 !important; background: #eef4f1 !important; }
.ck.ck-editor__main > .ck-editor__editable { min-height: 155px; border-color: #cad9d2 !important; border-radius: 0 0 12px 12px !important; background: #fff; color: var(--ink); box-shadow: none !important; direction: rtl; text-align: right; line-height: 2; }
.ck.ck-editor__main > .ck-editor__editable.ck-focused { border-color: #4b9e88 !important; }

.metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; margin: 18px 0; }
.metric { padding: 18px; border: 1px solid rgba(127, 209, 193, .2); border-radius: 18px; background: linear-gradient(125deg, #123b3d, #1d675e); }
.metric span { display: block; color: #afd1c8; font-size: 11px; }
.metric b { display: block; margin-top: 5px; color: var(--amber-soft); font-size: 25px; }
.tabs { display: flex; gap: 7px; margin: 24px 0 14px; overflow-x: auto; scrollbar-width: none; }
.tabs button { min-height: 44px; padding: 0 17px; white-space: nowrap; border: 1px solid rgba(127, 209, 193, .22); border-radius: 13px; background: var(--bg-deep-2); color: #d2e9df; }
.tabs button.active { border-color: var(--amber); background: var(--amber); color: var(--ink); font-weight: 900; }
.manager-command-nav { display: grid; grid-template-columns: repeat(7, minmax(92px, 1fr)); gap: 9px; padding: 8px; border: 1px solid rgba(127, 209, 193, .14); border-radius: 20px; background: linear-gradient(145deg, rgba(23, 53, 59, .88), rgba(14, 35, 40, .94)); box-shadow: 0 16px 36px rgba(0, 0, 0, .14); }
.manager-command-nav button { min-height: 76px; position: relative; display: grid; place-items: center; align-content: center; gap: 6px; overflow: hidden; border-color: rgba(127, 209, 193, .13); background: linear-gradient(145deg, var(--bg-deep-2), var(--bg-deep)); box-shadow: none; }
.manager-command-nav button span { color: var(--mint); font-size: 24px; line-height: 1; }
.manager-command-nav button b { font-size: 12px; }
.manager-command-nav button::after { content: ""; position: absolute; inset: auto 18px 0; height: 2px; border-radius: 3px; background: transparent; }
.manager-command-nav button.active { border-color: rgba(127, 209, 193, .65); background: linear-gradient(145deg, rgba(35, 82, 84, .9), rgba(21, 45, 51, .96)); color: #fff; }
.manager-command-nav button.active::after { background: var(--amber); box-shadow: 0 0 14px rgba(242, 169, 59, .45); }
.manager-command-nav button.active span { color: var(--amber); }
@media (max-width: 900px) { .manager-command-nav { display: flex; } .manager-command-nav button { min-width: 108px; } }
.manager-hero { min-height:210px;border-color:rgba(242,169,59,.24);background:radial-gradient(circle at 12% 20%,rgba(242,169,59,.18),transparent 28%),linear-gradient(125deg,#0b2428,#164f4b 58%,#0e3335);box-shadow:0 24px 65px rgba(5,28,29,.25) }.manager-hero h1{color:#fff;text-shadow:0 8px 28px rgba(0,0,0,.25)}
.manager-hero-actions{width:min(360px,100%);display:grid;align-items:stretch;gap:10px;justify-items:stretch}.manager-hero-actions>.button{width:100%;min-height:54px;border-color:rgba(242,169,59,.4);background:rgba(242,169,59,.12);color:#fff}.availability-switch{width:100%;display:grid;grid-template-columns:auto 72px 72px;align-items:center;gap:6px;padding:7px;border:1px solid rgba(255,255,255,.15);border-radius:17px;background:rgba(5,24,27,.55)}.availability-switch>span{padding:0 8px;color:#b8d1ca;font-size:10px;font-weight:800}.availability-switch button{min-height:42px;border:1px solid transparent;border-radius:12px;background:rgba(255,255,255,.06);color:#d9e7e2;font-weight:900;cursor:pointer;transition:.2s ease}.availability-switch button[data-availability="open"].active{background:linear-gradient(145deg,#42ca8d,#188358);color:#fff;box-shadow:0 9px 24px rgba(42,193,126,.3)}.availability-switch button[data-availability="closed"].active{background:linear-gradient(145deg,#ef766e,#ad3c38);color:#fff;box-shadow:0 9px 24px rgba(210,75,69,.28)}
.premium-metrics{grid-template-columns:repeat(5,minmax(0,1fr))}.premium-metrics .metric{min-height:125px;position:relative;overflow:hidden;padding:20px;border-color:rgba(242,169,59,.18);background:radial-gradient(circle at 15% 15%,rgba(242,169,59,.12),transparent 36%),linear-gradient(145deg,#102d31,#174b48);box-shadow:0 18px 42px rgba(8,33,34,.16),inset 0 1px rgba(255,255,255,.08)}.premium-metrics .metric::after{content:"";width:80px;height:80px;position:absolute;left:-32px;bottom:-42px;border:14px solid rgba(127,209,193,.06);border-radius:50%}.premium-metrics .metric b{font-size:30px}
.customer-directory{display:grid;gap:15px}.customer-search{width:min(320px,100%)}.customer-directory-list{display:grid;gap:8px}.customer-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:13px;padding:12px 14px;border:1px solid #d7e3de;border-radius:15px;background:#fff}.customer-row b,.customer-row small{display:block}.customer-row small,.customer-row time{color:#73847d;font-size:10px}.customer-row time{white-space:nowrap}
@media(max-width:900px){.premium-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.manager-hero-actions{justify-content:flex-start}.customer-row{grid-template-columns:auto minmax(0,1fr) auto}.customer-row time{grid-column:2}.availability-switch{grid-template-columns:auto 64px 64px}}
.split { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 18px; }
.admin-create-grid { display: grid; grid-template-columns: minmax(300px, .65fr) minmax(0, 1.35fr); align-items: start; gap: 16px; margin-bottom: 16px; }
.admin-partner-layout { display: grid; grid-template-columns: minmax(300px, .72fr) minmax(0, 1.28fr); align-items: start; gap: 18px; }
.partner-create-card { display: grid; gap: 22px; padding: 28px; }
.partner-create-card .form-title { justify-content: flex-start; padding-bottom: 18px; border-bottom: 1px solid #e2e8e4; }
.partner-create-card .form-title > div { min-width: 0; }
.partner-form-fields { display: grid; gap: 18px; }
.partner-form-fields label { gap: 9px; }
.partner-form-fields input { margin-top: 1px; }
.partner-list-card { min-height: 360px; }
.panel-kicker { display: block; margin-bottom: 4px; color: #277a66; font-size: 10px; font-weight: 900; letter-spacing: .04em; }
.list-panel { margin-top: 16px; }
.list { display: grid; gap: 10px; }
.card-list { margin-top: 17px; }
.list-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 13px;
  padding: 14px;
  border: 1px solid #dde5e1;
  border-radius: 15px;
  background: #fff;
}
.list-item.is-deleted { border-color: #efb8ae; background: linear-gradient(135deg, #fff6f3, #fffafa); box-shadow: inset 4px 0 #d94f3d; }
.list-item.is-deleted b { color: #8f2f25; }
.list-item.is-deleted small { color: #9b625a; }
.list-item > div:first-child { min-width: 0; }
.list-item b, .list-item small, .list-item span { display: block; }
.list-item small { margin-top: 3px; color: #748079; }
.list-item .actions, .row-actions { display: flex; flex-wrap: wrap; justify-content: end; gap: 6px; flex-shrink: 0; }
.mini { min-height: 36px; padding: 0 11px; border-radius: 10px; background: #205f52; color: #fff; font-size: 10px; }
.mini.danger { background: var(--coral); }
.mini.soft { background: #e8f1ed; color: #285c50; }
.status { display: inline-flex !important; width: max-content; margin-top: 7px; padding: 5px 9px; border-radius: 999px; background: #edf1ee; color: #53655d !important; font-size: 10px; font-weight: 800; }
.status--success { background: #dff2e9; color: #176148 !important; }
.status--danger { background: #ffe0db; color: #a52f20 !important; }
.status--pending { background: #fff0d4; color: #855a16 !important; }
.plan-suspended { display:flex; align-items:center; justify-content:space-between; gap:18px; margin:0 0 18px; padding:18px 20px; color:#fff; border:1px solid rgba(242,169,59,.42); border-radius:20px; background:radial-gradient(circle at 8% 20%,rgba(242,169,59,.2),transparent 34%),linear-gradient(135deg,#442f19,#1d3435); box-shadow:0 16px 38px rgba(33,25,12,.18) }
.plan-suspended[hidden],.credit-required[hidden]{display:none}
.plan-suspended>div { display:flex; align-items:center; gap:13px }.plan-suspended>div>span{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:rgba(242,169,59,.16);color:var(--amber);font-size:24px}.plan-suspended b{display:block;margin-bottom:3px}.plan-suspended p{margin:0;color:#e3d7c7;font-size:11px}.plan-suspended .button{flex:none}
.is-plan-suspended .manager-hero-actions{opacity:.58}.manager-command-nav button:disabled{opacity:.4;cursor:not-allowed;filter:saturate(.35)}
.credit-required{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:15px 0;padding:13px 14px;border:1px solid #edc67c;border-radius:15px;background:#fff7e6;color:#694716}.credit-required b,.credit-required small{display:block}.credit-required small{margin-top:3px;font-size:9px}.credit-required .button{flex:none;padding:9px 13px;font-size:10px}
.published-note { display: inline-flex !important; width: max-content; margin: 7px 5px 0 0; color: #277a66 !important; font-size: 10px; }
.preview { margin: 4px 0 14px; padding: 13px 14px; border: 1px solid transparent; border-radius: 13px; background: #edf2ef; color: #486158; font-size: 12px; line-height: 1.8; transition: .2s ease; }
.preview.is-loading { background: #f3f1e7; color: #746c4f; }
.preview.is-ready { border-color: #b8ddcf; background: #e4f4ed; color: #176148; }
.preview.is-warning { border-color: #ecd09b; background: #fff6e3; color: #815917; }
.preview.is-error { border-color: #efb8ae; background: #fff0ed; color: #9f3325; }
.message-workspace { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); align-items: start; gap: 18px; }
.message-side { display: grid; gap: 18px; }
.message-request-card { position: sticky; top: 94px; }
.message-request-card > p { margin: -4px 0 20px; }
.form-stack { display: grid; gap: 16px; }
.customer-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 18px 0; padding: 16px; border: 1px solid #e1e8e4; border-radius: 16px; background: #f5f8f6; }
.customer-form .wide { grid-column: 1 / -1; }
.customer-form .consent { display: flex; align-items: center; gap: 8px; min-height: 42px; padding: 8px 10px; border: 1px solid #dce5e0; border-radius: 11px; background: #fff; }
.customer-form .consent input { width: 18px; min-height: 18px; margin: 0; accent-color: #287864; }
.customer-form .consent span { line-height: 1.5; }
.compact-list { max-height: 330px; overflow: auto; padding-inline-end: 3px; }
.customer-item { display: flex; align-items: center; gap: 11px; padding: 11px; border: 1px solid #e1e7e3; border-radius: 13px; background: #fff; }
.customer-avatar { width: 40px; height: 40px; display: grid; place-items: center; flex: 0 0 40px; border-radius: 12px; background: #173e3c; color: var(--amber-soft); font-weight: 900; }
.customer-item b, .customer-item small { display: block; }
.customer-item small { margin-top: 2px; color: #718078; }
.consent-tags { display: flex; gap: 4px; margin-top: 5px; }
.consent-tags i { padding: 3px 7px; border-radius: 999px; background: #e4f2ec; color: #236551; font-size: 8px; font-style: normal; font-weight: 800; }
.empty-state { padding: 18px; border: 1px dashed #cfdad4; border-radius: 13px; background: #f5f7f5; color: #6d7c75; font-size: 11px; line-height: 1.8; text-align: center; }
.upload-card { display: grid; grid-template-columns: auto 1fr minmax(240px, .7fr) auto; align-items: center; gap: 16px; margin-top: 16px; }
.upload-card h2 { margin: 0; }
.upload-card p { margin: 3px 0 0; font-size: 11px; }
.upload-visual { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 15px; background: #dff0e9; color: #26715f; font-size: 24px; }
.danger-zone { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 16px; border-color: #f0c7c0; background: #fff8f5; }
.danger-zone h2 { margin: 0; color: #8d3025; font-size: 17px; }
.danger-zone p { margin: 3px 0 0; font-size: 11px; }

.qr-panel { display: grid; grid-template-columns: minmax(0, 1fr) 330px; align-items: center; gap: 45px; overflow: hidden; background: radial-gradient(circle at 86% 0, rgba(79, 179, 160, .17), transparent 45%), var(--paper-soft); }
.qr-panel h2 { margin: 8px 0; font-size: 29px; }
.qr-frame { position: relative; display: grid; place-items: center; gap: 8px; padding: 19px; border-radius: 32px; background: linear-gradient(145deg, #153c41, #247461); box-shadow: 0 25px 55px rgba(12, 43, 44, .25); transform: rotate(1.5deg); }
.qr-frame img { position: relative; z-index: 2; width: 100%; border-radius: 23px; box-shadow: 0 14px 30px rgba(0, 0, 0, .22); }
.qr-frame small { position: relative; z-index: 2; color: #d9ece7; font-size: 9px; }
.qr-glow { position: absolute; top: -70px; left: -50px; width: 170px; height: 170px; border-radius: 50%; background: rgba(242, 169, 59, .3); filter: blur(28px); }

.editor-dialog { width: min(960px, calc(100% - 24px)); max-height: min(92dvh, 900px); padding: 0; border: 1px solid rgba(127, 209, 193, .25); border-radius: 24px; background: var(--paper-soft); color: var(--ink); }
.editor-dialog::backdrop { background: rgba(3, 13, 16, .78); backdrop-filter: blur(5px); }
.dialog-shell { max-height: 92dvh; display: grid; grid-template-rows: auto 1fr; overflow: hidden; }
.dialog-shell > header { display: flex; align-items: center; justify-content: space-between; padding: 18px 21px; border-bottom: 1px solid #dde6e1; background: #133238; color: #fff; }
.dialog-shell > header span { color: var(--teal-soft); font-size: 10px; }
.dialog-shell > header h2 { margin: 2px 0 0; }
.dialog-shell > header button { width: 42px; height: 42px; border: 1px solid rgba(255, 255, 255, .13); border-radius: 12px; background: rgba(255, 255, 255, .05); color: #fff; font-size: 25px; }
#dialogForm { overflow-y: auto; padding: 18px; }

.toast { position: fixed; left: 22px; bottom: 22px; z-index: 100; max-width: min(420px, calc(100% - 44px)); padding: 13px 18px; border-radius: 14px; background: var(--amber-soft); color: var(--ink); box-shadow: 0 18px 38px rgba(0, 0, 0, .28); font-weight: 800; transform: translateY(130px); opacity: 0; transition: .25s ease; }
.toast.show { transform: none; opacity: 1; }

.profile-body {
  min-height: 100vh;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 8% 20%, rgba(79, 179, 160, .16), transparent 29rem),
    radial-gradient(circle at 94% 68%, rgba(242, 169, 59, .13), transparent 30rem),
    #eef3ef;
  color: var(--ink);
}
.profile-body .topbar { color: var(--paper); }
.profile-body .profile-top { max-width: none; margin: 0; }
.profile-ambient { position: fixed; z-index: 0; border-radius: 50%; pointer-events: none; filter: blur(3px); }
.ambient-one { width: 360px; height: 360px; right: -190px; top: 210px; border: 58px solid rgba(32, 105, 91, .055); }
.ambient-two { width: 260px; height: 260px; left: -150px; bottom: 80px; background: rgba(242, 169, 59, .055); }
.public-profile { position: relative; z-index: 1; max-width: 1180px; overflow: hidden; margin: 34px auto 70px; border: 1px solid rgba(185, 203, 194, .72); border-radius: 38px; background: rgba(255, 255, 255, .94); box-shadow: 0 38px 95px rgba(25, 55, 48, .17); }
.profile-hero { padding: 12px; }
.cover { min-height: 530px; position: relative; overflow: hidden; border-radius: 29px; background: #12352d; isolation: isolate; }
.cover img { width: 100%; height: 100%; position: absolute; inset: 0; display: block; object-fit: cover; animation: coverArrival .95s cubic-bezier(.2,.8,.2,1) both; }
.cover-shade { position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, rgba(7, 25, 24, .88) 0, rgba(7, 25, 24, .54) 45%, rgba(7, 25, 24, .08) 76%), linear-gradient(0deg, rgba(4, 17, 16, .66), transparent 56%); }
.cover-content { width: min(680px, 78%); position: absolute; z-index: 2; right: clamp(24px, 5vw, 65px); bottom: clamp(30px, 7vw, 68px); color: #fff; animation: contentArrival .72s .16s cubic-bezier(.2,.8,.2,1) both; }
.profile-back { width: max-content; display: inline-flex; align-items: center; gap: 8px; margin-bottom: 48px; color: #d8e8e2; font-size: 12px; font-weight: 700; }
.profile-back:hover { color: var(--amber-soft); }
.profile-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.profile-badges > span { display: inline-flex; align-items: center; gap: 6px; padding: 7px 11px; border: 1px solid rgba(255, 255, 255, .22); border-radius: 999px; background: rgba(12, 43, 42, .52); color: #e9f5f1; font-size: 10px; font-weight: 800; backdrop-filter: blur(10px); }
.profile-badges .verified-badge { border-color: rgba(247, 200, 120, .34); color: var(--amber-soft); }
.verified-badge i { width: 17px; height: 17px; display: grid; place-items: center; border-radius: 50%; background: var(--amber-soft); color: #18342f; font-size: 10px; font-style: normal; }
.cover-content h1 { max-width: 760px; margin: 14px 0 8px; font-size: clamp(38px, 6vw, 72px); line-height: 1.22; letter-spacing: -.045em; text-shadow: 0 12px 34px rgba(0, 0, 0, .28); }
.cover-content > p { margin: 0; color: #c5ddd6; font-size: 15px; }
.profile-content { padding: 48px clamp(24px, 5vw, 66px) 34px; }
.profile-intro { display: flex; align-items: start; justify-content: space-between; gap: 36px; }
.profile-eyebrow { display: block; margin-bottom: 9px; color: #237861; font-size: 11px; font-weight: 900; }
.rich-text { max-width: 790px; color: #52665e; font-size: 15px; line-height: 2.15; }
.rich-text :first-child { margin-top: 0; }
.rich-text :last-child { margin-bottom: 0; }
.rich-text a { color: #176c58; text-decoration: underline; }
.share-profile { min-height: 45px; display: inline-flex; align-items: center; flex: 0 0 auto; gap: 8px; padding: 0 15px; border: 1px solid #d6e3dd; border-radius: 13px; background: #f5f8f6; color: #2c5e51; font-weight: 800; }
.share-profile:hover { border-color: #98c8b8; background: #eaf4ef; }
.profile-actions { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; margin: 38px 0; }
.profile-actions a { min-width: 0; display: flex; align-items: center; gap: 11px; padding: 16px 13px; border: 1px solid #dfe8e3; border-radius: 17px; background: linear-gradient(145deg, #f7faf8, #eef4f0); box-shadow: 0 9px 20px rgba(23, 66, 56, .06); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.profile-actions a:hover { transform: translateY(-3px); border-color: #9fcdbd; box-shadow: 0 16px 28px rgba(23, 66, 56, .11); }
.profile-actions a[href=""], .profile-actions a[href="https://wa.me/98"] { display: none; }
.profile-actions a > span:last-child { min-width: 0; }
.action-icon { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 38px; border-radius: 12px; background: #173e3c; color: var(--amber-soft); }
.action-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.profile-actions .booking-action { border-color: rgba(242, 169, 59, .45); background: linear-gradient(145deg, rgba(247, 200, 120, .2), rgba(79, 179, 160, .1)); }
.profile-actions .booking-action .action-icon { background: linear-gradient(145deg, #1d675e, #173e3c); box-shadow: 0 8px 18px rgba(23, 62, 60, .18); }
.profile-actions b, .profile-actions small { display: block; }
.profile-actions b { color: #183c33; font-size: 12px; }
.profile-actions small { overflow: hidden; margin-top: 3px; color: #718078; font-size: 9px; white-space: nowrap; text-overflow: ellipsis; }
.profile-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 14px; align-items: stretch; }
.profile-grid .address-card { min-height: 250px; display: flex; align-items: flex-start; gap: 18px; position: relative; overflow: hidden; padding: 29px; border-radius: 27px; background: radial-gradient(circle at 90% 10%, rgba(127, 209, 193, .13), transparent 45%), var(--bg-deep-2); color: #fff; }
.profile-grid .address-card::after { content: ""; width: 160px; height: 160px; position: absolute; left: -70px; bottom: -95px; border: 24px solid rgba(255, 255, 255, .04); border-radius: 50%; }
.profile-grid .address-card > div { position: relative; z-index: 1; }
.profile-grid .address-card span:not(.card-icon) { color: var(--teal-soft); font-size: 10px; font-weight: 900; }
.profile-grid .address-card h2 { margin: 7px 0; font-size: 22px; }
.profile-grid .address-card p { margin: 0; color: #bfd0ca; line-height: 2; }
.card-icon { width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 48px; border-radius: 15px; background: rgba(127, 209, 193, .13); color: var(--teal-soft); font-size: 25px; }
.profile-grid .offer { --offer-angle: 0deg; min-width: 0; min-height: 250px; position: relative; overflow: hidden; padding: 2px; border-radius: 29px; background: conic-gradient(from var(--offer-angle), rgba(242, 169, 59, .34), var(--amber-soft), #fff2bd, var(--amber), rgba(79, 179, 160, .22), var(--amber-soft), rgba(242, 169, 59, .34)); box-shadow: 0 23px 55px rgba(67, 48, 14, .25), 0 0 0 1px rgba(242, 169, 59, .18); isolation: isolate; animation: offerFrameSpin 8s linear infinite; }
.offer-frame { height: 100%; position: relative; z-index: 2; padding: 1px; border-radius: 27px; background: linear-gradient(125deg, rgba(255, 244, 200, .82), rgba(242, 169, 59, .16), rgba(127, 209, 193, .15)); }
.offer-card { min-height: 100%; position: relative; overflow: hidden; padding: 28px 30px 24px; border-radius: 26px; background: radial-gradient(circle at 86% 5%, rgba(247, 200, 120, .09), transparent 29%), radial-gradient(circle at 10% 96%, rgba(79, 179, 160, .07), transparent 31%), repeating-linear-gradient(108deg, rgba(255, 255, 255, .018) 0, rgba(255, 255, 255, .018) 1px, transparent 1px, transparent 6px), linear-gradient(145deg, #080a0b, #171a1c 46%, #0c0e10 74%, #1a1d1f); color: var(--paper); box-shadow: inset 0 1px rgba(255, 255, 255, .08), inset 0 -22px 60px rgba(0, 0, 0, .3); }
.offer-card::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(112deg, transparent 20%, rgba(255, 238, 178, .055) 44%, transparent 60%); background-size: 230% 100%; animation: offerCardShimmer 5.5s ease-in-out infinite; }
.offer-copy { position: relative; z-index: 3; text-align: center; }
.offer-badge { width: max-content; position: relative; z-index: 4; display: flex; align-items: center; gap: 6px; margin: 0 auto 11px; padding: 6px 13px; border: 1px solid rgba(247, 200, 120, .42); border-radius: 999px; background: linear-gradient(145deg, rgba(242, 169, 59, .16), rgba(242, 169, 59, .035)); color: var(--amber-soft); font-size: 9px; font-weight: 900; box-shadow: 0 0 19px rgba(242, 169, 59, .12); animation: offerBadgePulse 3s ease-in-out infinite; }
.offer-badge > span { color: #ffe7a4; font-size: 15px; line-height: 1; }
.offer-eyebrow { color: #aebdb7; font-size: 9px; font-weight: 800; letter-spacing: .03em; }
.profile-grid .offer h2 { margin: 5px auto 7px; background: linear-gradient(90deg, #a96d17, #fff0b5, var(--amber-soft), #fff7dc, #b9781c); background-size: 220% auto; color: transparent; font-size: clamp(24px, 3.2vw, 38px); line-height: 1.35; letter-spacing: -.035em; -webkit-background-clip: text; background-clip: text; animation: offerTitleGlow 4s linear infinite; }
.offer-divider { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 4px auto 10px; color: var(--amber); }
.offer-divider i { width: 47px; height: 1px; display: block; background: linear-gradient(90deg, transparent, var(--amber)); }
.offer-divider i:last-child { transform: scaleX(-1); }
.offer-divider b { font-size: 7px; }
.offer-pricing { display: flex; align-items: baseline; justify-content: center; flex-wrap: wrap; gap: 7px; margin: 3px 0 8px; direction: rtl; }
.offer-pricing del { color: #7e8b86; font-size: 14px; text-decoration-color: var(--coral); text-decoration-thickness: 2px; }
.offer-pricing strong { color: #ffe49a; font-size: clamp(27px, 4vw, 42px); line-height: 1; text-shadow: 0 0 22px rgba(242, 169, 59, .22); }
.offer-pricing > span { color: #baa873; font-size: 9px; font-weight: 800; }
.profile-grid .offer p { max-width: 630px; margin: 7px auto 10px; color: #c7d2ce; font-size: 12px; line-height: 1.9; }
.offer-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 10px; max-width: 590px; margin: 12px auto 15px; padding: 0; list-style: none; text-align: right; }
.offer-features li { display: flex; align-items: flex-start; gap: 7px; color: #d8e2de; font-size: 10px; line-height: 1.65; }
.offer-features li span { width: 17px; height: 17px; display: grid; place-items: center; flex: 0 0 17px; margin-top: 1px; border-radius: 50%; background: rgba(242, 169, 59, .13); color: var(--amber-soft); font-size: 9px; }
.offer-cta { min-height: 47px; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; gap: 10px; max-width: 360px; margin: 12px auto 0; padding: 0 23px; border: 1px solid #ffe5a2; border-radius: 14px; background: linear-gradient(135deg, #ad6c18, var(--amber), #f8d17f, #c67b1f); background-size: 220% 100%; color: #172b2d; font-size: 12px; font-weight: 950; box-shadow: 0 13px 27px rgba(242, 169, 59, .18), inset 0 1px rgba(255, 255, 255, .42); animation: offerCTA 4.5s ease-in-out infinite; }
.offer-cta::after { content: ""; width: 38%; position: absolute; inset-block: -35%; right: -48%; transform: skewX(-20deg); background: rgba(255, 255, 255, .42); filter: blur(5px); animation: offerCTASweep 3.2s ease-in-out infinite; }
.offer-cta span, .offer-cta svg { position: relative; z-index: 1; }
.offer-cta svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
.offer-cta:hover { color: #102428; transform: translateY(-2px); }
.offer-cta:hover svg { transform: translateX(-3px); }
.offer-timer { display: flex; align-items: center; justify-content: center; gap: 5px; margin-top: 11px; color: #82958e; font-size: 9px; }
.offer-timer svg { width: 14px; height: 14px; fill: none; stroke: var(--amber-soft); stroke-width: 1.8; stroke-linecap: round; }
.offer-timer b { color: #d8bf7f; direction: ltr; font-size: 10px; }
.offer-corner { width: 47px; height: 47px; position: absolute; z-index: 3; pointer-events: none; }
.corner-top { top: 13px; right: 13px; border-top: 1px solid rgba(247, 200, 120, .4); border-right: 1px solid rgba(247, 200, 120, .4); border-radius: 0 11px 0 0; }
.corner-bottom { bottom: 13px; left: 13px; border-bottom: 1px solid rgba(247, 200, 120, .4); border-left: 1px solid rgba(247, 200, 120, .4); border-radius: 0 0 0 11px; }
.offer-rivet { width: 12px; height: 12px; position: absolute; z-index: 5; border: 1px solid #ffe9ac; border-radius: 50%; background: radial-gradient(circle at 34% 28%, #fff8dc 0 10%, #f8d27e 22%, #d49328 53%, #9a5b0f 76%, #543006 100%); box-shadow: 0 2px 3px rgba(0, 0, 0, .78), 0 0 10px rgba(242, 169, 59, .28), inset -1px -1px 2px rgba(67, 35, 2, .6); }
.offer-rivet::after { content: ""; width: 5px; height: 1px; position: absolute; inset: 0; margin: auto; border-radius: 999px; background: rgba(83, 47, 7, .68); box-shadow: 0 1px rgba(255, 239, 184, .36); transform: rotate(-38deg); }
.rivet-top-right { top: 17px; right: 17px; }
.rivet-top-left { top: 17px; left: 17px; }
.rivet-bottom-right { right: 17px; bottom: 17px; }
.rivet-bottom-left { bottom: 17px; left: 17px; }
.offer-glow { position: absolute; z-index: 1; border-radius: 50%; pointer-events: none; filter: blur(8px); }
.offer-glow-one { width: 170px; height: 170px; top: -100px; left: 4%; background: rgba(247, 200, 120, .17); }
.offer-glow-two { width: 130px; height: 130px; right: -64px; bottom: -40px; background: rgba(79, 179, 160, .16); }
.offer-sparkle { position: absolute; z-index: 4; color: #ffe6a0; pointer-events: none; text-shadow: 0 0 12px rgba(247, 200, 120, .9); animation: offerSparkle 3.7s ease-in-out infinite; }
.offer-sparkle-one { top: 25px; left: 28px; font-size: 13px; }
.offer-sparkle-two { right: 34px; bottom: 32px; font-size: 8px; animation-delay: -1.2s; }
.offer-sparkle-three { left: 18%; bottom: 19%; font-size: 6px; animation-delay: -2.3s; }
.profile-content footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 38px; padding-top: 24px; border-top: 1px solid #e1e8e4; color: #718078; }
.footer-brand { display: flex; align-items: center; gap: 10px; }
.footer-brand > span { display: grid; }
.footer-brand b { color: #1b6b54; }
.footer-brand small { color: #75857d; font-size: 9px; }
.profile-content footer > a { color: #256d5a; font-size: 11px; font-weight: 900; }
[data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity .62s ease, transform .62s ease; }
[data-reveal].is-visible { opacity: 1; transform: none; }

@keyframes pulse { to { background-position: -120% 0; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes coverArrival { from { transform: scale(1.06); filter: saturate(.7); } to { transform: scale(1); filter: saturate(1); } }
@keyframes contentArrival { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes offerFrameSpin { to { --offer-angle: 360deg; } }
@keyframes offerCardShimmer { 0%, 28% { background-position: 150% 0; } 68%, 100% { background-position: -90% 0; } }
@keyframes offerBadgePulse { 0%, 100% { transform: translateY(0); box-shadow: 0 0 16px rgba(242, 169, 59, .1); } 50% { transform: translateY(-2px); box-shadow: 0 0 25px rgba(242, 169, 59, .22); } }
@keyframes offerTitleGlow { to { background-position: -220% center; } }
@keyframes offerCTA { 0%, 100% { background-position: 0 50%; } 50% { background-position: 100% 50%; } }
@keyframes offerCTASweep { 0%, 32% { right: -48%; } 72%, 100% { right: 125%; } }
@keyframes offerSparkle { 0%, 100% { opacity: .2; transform: translateY(3px) scale(.72) rotate(0); } 45% { opacity: 1; transform: translateY(-5px) scale(1.2) rotate(70deg); } }

@property --offer-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

@media (max-width: 960px) {
  .hero { grid-template-columns: 1fr; padding-top: 55px; }
  .hero-card { display: none; }
  .business-grid { grid-template-columns: repeat(2, 1fr); }
  .section-head { align-items: stretch; flex-direction: column; }
  .search { flex-wrap: wrap; }
  .search :is(input, select) { flex: 1; }
  .admin-create-grid, .admin-partner-layout, .split, .qr-panel, .message-workspace { grid-template-columns: 1fr; }
  .message-request-card { position: static; }
  .upload-card { grid-template-columns: auto 1fr; }
  .upload-card input, .upload-card button { grid-column: 1 / -1; }
  .metrics { grid-template-columns: repeat(2, 1fr); }
  .qr-frame { width: min(350px, 100%); justify-self: center; }
  .profile-actions { grid-template-columns: repeat(3, 1fr); }
  .public-profile { margin-inline: 16px; }
  .cover { min-height: 470px; }
}

@media (max-width: 680px) {
  .topbar { height: 64px; grid-template-columns: auto minmax(0, 1fr) auto; padding: 0 12px; gap: 7px; }
  .superapp-return { width: auto; min-height: 44px; height: 44px; max-width: none; padding: 7px 11px; overflow: visible; white-space: nowrap; border-radius: 999px; font-size: 11.5px; box-shadow: none; }
  .brand { gap: 5px; }
  .brand > img { width: 38px; height: 38px; }
  .brand b, .brand strong { font-size: 11px; }
  .brand small { font-size: 8px; }
  .topbar-action { min-height: 40px !important; padding: 0 10px !important; font-size: 10px; }
  .hero { padding: 44px 16px 54px; }
  .hero h1 { font-size: 39px; }
  .hero-copy > p { font-size: 14px; }
  .hero-actions { flex-direction: column; }
  .directory { padding: 52px 15px 75px; }
  .business-grid { grid-template-columns: 1fr; }
  .search { display: grid; }
  .section-head h2 { font-size: 29px; }
  .workspace { padding: 25px 12px 75px; }
  .workspace-hero { align-items: flex-start; flex-direction: column; padding: 23px; }
  .hero-step { display: none; }
  .form-grid { grid-template-columns: 1fr; padding: 17px; }
  .form-grid .wide { grid-column: auto; }
  .offer-editor-grid { grid-template-columns: 1fr; padding: 16px; }
  .offer-editor-grid .wide { grid-column: auto; }
  .offer-editor summary { padding: 15px 16px; }
  .offer-editor summary small { line-height: 1.7; }
  .coordinate-fields { grid-template-columns: 1fr; }
  .sticky-actions { align-items: stretch; flex-direction: column; bottom: 7px; }
  .sticky-actions .button { width: 100%; }
  .metrics { grid-template-columns: 1fr 1fr; }
  .panel { padding: 18px; }
  .partner-create-card { gap: 18px; padding: 20px; }
  .customer-form { grid-template-columns: 1fr; padding: 13px; }
  .customer-form .wide { grid-column: auto; }
  .list-item { align-items: flex-start; flex-direction: column; }
  .list-item .actions { width: 100%; justify-content: flex-start; }
  .lookup-row { grid-template-columns: 1fr; }
  .danger-zone { align-items: stretch; flex-direction: column; }
  .qr-panel { padding: 20px; }
  .qr-panel h2 { font-size: 23px; }
  .profile-body .topbar { position: sticky; }
  .profile-body .topbar .brand small { display: none; }
  .profile-body .topbar .brand strong i { display: none; }
  .public-profile { margin: 12px 0 0; border: 0; border-radius: 0; box-shadow: none; }
  .profile-hero { padding: 0; }
  .cover { min-height: min(66dvh, 510px); border-radius: 0 0 25px 25px; }
  .cover-shade { background: linear-gradient(0deg, rgba(5, 20, 19, .9) 0, rgba(5, 20, 19, .38) 60%, rgba(5, 20, 19, .08)); }
  .cover-content { width: auto; inset-inline: 20px; right: 20px; bottom: 28px; }
  .profile-back { margin-bottom: 100px; }
  .profile-badges { gap: 6px; }
  .profile-badges > span { padding: 6px 9px; font-size: 8px; }
  .cover-content h1 { margin-top: 11px; font-size: clamp(35px, 12vw, 48px); }
  .cover-content > p { font-size: 12px; }
  .profile-content { padding: 28px 16px; }
  .profile-intro { flex-direction: column; gap: 18px; }
  .share-profile { width: 100%; justify-content: center; }
  .rich-text { font-size: 14px; }
  .profile-actions { grid-template-columns: repeat(2, 1fr); }
  .profile-actions a { gap: 9px; padding: 13px 10px; }
  .action-icon { width: 35px; height: 35px; flex-basis: 35px; }
  .profile-actions b { font-size: 11px; }
  .profile-grid { grid-template-columns: 1fr; }
  .profile-grid .address-card { min-height: 165px; padding: 22px; }
  .profile-grid .offer { min-height: 0; border-radius: 25px; }
  .offer-frame { border-radius: 23px; }
  .offer-card { padding: 27px 18px 22px; border-radius: 22px; }
  .profile-grid .offer h2 { font-size: clamp(27px, 8.5vw, 36px); }
  .offer-features { grid-template-columns: 1fr; max-width: 330px; }
  .offer-cta { width: 100%; max-width: 330px; }
  .offer-pricing strong { font-size: clamp(31px, 10vw, 42px); }
  .profile-content footer { align-items: flex-start; flex-direction: column; gap: 16px; }
}

@media (max-width: 390px) {
  .superapp-return { padding-inline: 9px; font-size: 11px; }
}

.business-card-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.business-card-meta > span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.card-live { display: inline-flex; align-items: center; flex: 0 0 auto; gap: 5px; color: #697772; font-size: 8px; font-weight: 900; }
.card-live i { width: 7px; height: 7px; display: block; border-radius: 50%; background: #9ca8a3; }
.card-live--open { color: #24755b; }
.card-live--open i { background: #35b97f; box-shadow: 0 0 0 4px rgba(53, 185, 127, .10), 0 0 12px rgba(53, 185, 127, .38); }
.card-live--closed { color: #a25248; }
.card-live--closed i { background: #dd7166; box-shadow: 0 0 0 4px rgba(221, 113, 102, .09); }
.optional-mark { display: inline-flex; margin-inline-start: 5px; padding: 2px 6px; border-radius: 999px; background: #edf2ef; color: #7b8882; font-size: 8px; font-weight: 700; }

.presence-section > .owner-presence-editor { padding: 20px; }
.owner-presence-editor { display: grid; gap: 18px; }
.availability-editor, .working-hours-editor {
  margin: 0;
  padding: 20px;
  border: 1px solid #dce5e0;
  border-radius: 18px;
  background: #f8faf8;
}
.availability-editor legend, .working-hours-editor legend { padding: 0 8px; color: #1c4b40; font-size: 13px; font-weight: 900; }
.availability-editor > p, .working-hours-editor > p { margin: 0 0 15px; color: #718078; font-size: 10px; }
.availability-editor > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.availability-editor label { position: relative; cursor: pointer; }
.availability-editor input { width: 1px; height: 1px; min-height: 1px; position: absolute; opacity: 0; }
.availability-editor label > span {
  min-height: 82px;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  align-content: center;
  gap: 2px 10px;
  padding: 14px;
  border: 1px solid #d9e3de;
  border-radius: 15px;
  background: #fff;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.availability-editor label > span > i { width: 13px; height: 13px; grid-row: 1 / -1; align-self: center; border: 2px solid #afbbb6; border-radius: 50%; box-shadow: inset 0 0 0 3px #fff; }
.availability-editor label > span b { color: #27463e; font-size: 11px; }
.availability-editor label > span small { color: #7c8b85; font-size: 8px; font-weight: 500; }
.availability-editor input:checked + span { border-color: #4c9e89; background: #eef8f4; box-shadow: 0 8px 20px rgba(45, 122, 100, .09); transform: translateY(-1px); }
.availability-editor input:checked + span > i { border-color: #277b64; background: #35a984; }
.availability-editor input:focus-visible + span { outline: 3px solid rgba(79, 179, 160, .24); outline-offset: 2px; }
.working-days { display: grid; gap: 7px; }
.working-hours-enable {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 13px;
  padding: 12px 13px;
  border: 1px solid #dce6e1;
  border-radius: 14px;
  background: #fff;
  cursor: pointer;
}
.working-hours-enable input { width: 1px; height: 1px; min-height: 1px; position: absolute; opacity: 0; }
.working-hours-enable > span:first-of-type { width: 42px; height: 24px; position: relative; flex: 0 0 42px; border-radius: 999px; background: #cbd6d1; transition: background .2s ease; }
.working-hours-enable > span:first-of-type i { width: 18px; height: 18px; position: absolute; top: 3px; right: 3px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(22, 44, 38, .2); transition: transform .2s ease; }
.working-hours-enable > span:last-child { display: grid; gap: 2px; }
.working-hours-enable b { color: #294a41; font-size: 10px; }
.working-hours-enable small { color: #7a8882; font-size: 8px; }
.working-hours-enable input:checked + span { background: #3aa783; }
.working-hours-enable input:checked + span i { transform: translateX(-18px); }
.working-hours-enable input:focus-visible + span { outline: 3px solid rgba(79, 179, 160, .24); outline-offset: 2px; }
.working-day {
  min-height: 64px;
  display: grid;
  grid-template-columns: 90px minmax(140px, 1fr) minmax(140px, 1fr) 105px;
  align-items: center;
  gap: 10px;
  padding: 8px 11px;
  border: 1px solid #e0e7e3;
  border-radius: 14px;
  background: #fff;
}
.working-day > strong { color: #294a41; font-size: 11px; }
.working-day.is-disabled { opacity: .55; background: #f3f6f4; }
.working-time { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 7px; color: #7a8882; font-size: 9px; }
.working-time select { min-height: 42px; padding: 7px 10px; color: #233e37; font-variant-numeric: tabular-nums; text-align: center; }
.working-time select:disabled { border-color: #e4e8e6; background: #f0f3f1; color: #9ca6a2; }
.hours-closed-toggle { display: flex; align-items: center; justify-content: flex-end; gap: 7px; cursor: pointer; }
.hours-closed-toggle input { width: 1px; height: 1px; min-height: 1px; position: absolute; opacity: 0; }
.hours-closed-toggle > span { width: 38px; height: 22px; position: relative; display: block; border-radius: 999px; background: #cdd7d2; transition: background .2s ease; }
.hours-closed-toggle > span i { width: 16px; height: 16px; position: absolute; top: 3px; right: 3px; border-radius: 50%; background: #fff; box-shadow: 0 2px 5px rgba(22, 44, 38, .18); transition: transform .2s ease; }
.hours-closed-toggle b { color: #6f7c76; font-size: 9px; }
.hours-closed-toggle input:checked + span { background: #d86c5d; }
.hours-closed-toggle input:checked + span i { transform: translateX(-16px); }
.hours-closed-toggle input:checked ~ b { color: #a54437; }
.hours-closed-toggle input:focus-visible + span { outline: 3px solid rgba(79, 179, 160, .24); outline-offset: 2px; }

.media-management { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px; }
.media-management .upload-card { margin: 0; grid-template-columns: auto 1fr; align-content: start; }
.media-management .upload-card input, .media-management .upload-card button { grid-column: 1 / -1; }
.upload-visual--logo { background: #f3ead5; color: #9a6c21; }
.upload-visual--gallery { background: #e7ecf6; color: #4e6292; }
.gallery-upload-card { grid-column: 1 / -1; }
.media-preview { grid-column: 1 / -1; }
.media-preview-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.media-preview-head > div { display: flex; align-items: center; gap: 12px; }
.media-preview-head > div > span { display: grid; gap: 2px; }
.media-preview-head b { color: #24493f; font-size: 12px; }
.media-preview-head small { color: #74827c; font-size: 9px; }
.media-preview-head > a { color: #276d5a; font-size: 9px; font-weight: 900; }
.media-logo-preview, .media-logo-fallback { width: 54px; height: 54px; display: grid; place-items: center; flex: 0 0 54px; overflow: hidden; border: 1px solid #d7e2dc; border-radius: 16px; object-fit: cover; }
.media-logo-fallback { background: linear-gradient(145deg, #f3ead4, #d9bd78); color: #21433c; font-size: 22px; font-weight: 900; }
.manager-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.manager-gallery figure { aspect-ratio: 1.25; position: relative; overflow: hidden; margin: 0; border-radius: 14px; background: #e5ebe7; }
.manager-gallery figure img { width: 100%; height: 100%; display: block; object-fit: cover; }
.manager-gallery figure button { width: 31px; height: 31px; position: absolute; top: 7px; left: 7px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(255, 255, 255, .28); border-radius: 10px; background: rgba(90, 31, 25, .83); color: #fff; font-size: 17px; }
.manager-gallery .empty-state { grid-column: 1 / -1; }
#managerMetrics { grid-template-columns: repeat(5, 1fr); }

.owner-edit-policy, .moderation-status { display: flex; align-items: flex-start; gap: 12px; padding: 16px 18px; border: 1px solid rgba(45, 130, 105, .18); border-radius: 17px; background: linear-gradient(145deg, #edf7f2, #fbfcfb); color: #244d42; }
.owner-edit-policy { margin-bottom: 14px; }
.owner-edit-policy b, .owner-edit-policy p { display: block; }
.owner-edit-policy b { font-size: 11px; }
.owner-edit-policy p { margin: 3px 0 0; color: #687a73; font-size: 9px; line-height: 1.9; }
.readonly-identity input[readonly], .readonly-identity textarea[readonly], .readonly-identity select:disabled { border-color: #e4e9e6; background: #f2f5f3; color: #728079; cursor: not-allowed; }
.readonly-identity .editable-owner-field input, .readonly-identity .editable-owner-field textarea { border-color: #cbded6; background: #fff; color: #183f35; cursor: text; }
.current-cover-preview, .manager-cover-preview { overflow: hidden; margin: 0 0 10px; border: 1px solid #dbe4df; border-radius: 17px; background: #eef2ef; }
.current-cover-preview img, .manager-cover-preview img { width: 100%; aspect-ratio: 2.25; display: block; object-fit: cover; }
.current-cover-preview figcaption, .manager-cover-preview figcaption { padding: 8px 12px; color: #64756e; font-size: 8px; }
.current-cover-preview.is-empty, .manager-cover-preview.is-empty { min-height: 92px; display: grid; place-items: center; padding: 18px; color: #78857f; font-size: 9px; }
.manager-cover-preview { margin-bottom: 12px; }
.media-management--readonly { grid-template-columns: 1fr; }
.media-readonly-note { margin: 12px 0 0; padding: 10px 12px; border-radius: 12px; background: #f2f6f3; color: #68776f; font-size: 8px; line-height: 1.8; }
.manager-gallery figure figcaption { position: absolute; inset: auto 6px 6px; padding: 5px 7px; border-radius: 8px; background: rgba(8, 25, 22, .7); color: #fff; font-size: 7px; }
.moderation-status { margin-bottom: 14px; background: linear-gradient(145deg, #fff8e9, #fffdf8); border-color: rgba(192, 144, 48, .2); }
.moderation-status > span { color: #ac791b; font-size: 19px; }
.moderation-status b, .moderation-status small { display: block; }
.moderation-status b { color: #6f541e; font-size: 10px; }
.moderation-status small { margin-top: 3px; color: #86785c; font-size: 8px; }
.moderation-item { border-right: 3px solid #c99d3f; }
.message-list-image { width: min(220px, 100%); aspect-ratio: 1.8; display: block; object-fit: cover; margin-top: 9px; border-radius: 11px; }
.message-image-preview { overflow: hidden; margin-top: 8px; border-radius: 14px; background: #e8eeea; }
.message-image-preview img { width: 100%; max-height: 280px; display: block; object-fit: cover; }
.billing-shell { display: grid; gap: 18px; }
.billing-overview { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(360px, 1.2fr); align-items: center; gap: 24px; overflow: hidden; color: #fff; border-color: rgba(242,169,59,.3); background: radial-gradient(circle at 12% 16%,rgba(242,169,59,.22),transparent 32%),linear-gradient(125deg,#0a292d,#15524f); }
.billing-overview h2 { margin: 7px 0; color: #fff; font-size: clamp(22px,3vw,34px); }
.billing-overview p { color: #c8ddd8; }
.credit-rings { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.credit-rings span { min-height: 112px; display: grid; place-items: center; align-content: center; gap: 4px; padding: 12px; border: 1px solid rgba(255,255,255,.13); border-radius: 18px; background: rgba(4,25,28,.38); text-align: center; }
.credit-rings b { color: var(--amber); font-size: 25px; }.credit-rings small { color: #c8ddd8; font-size: 9px; }
.plan-market { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.plan-product { min-height: 310px; position: relative; display: flex; flex-direction: column; gap: 12px; padding: 24px; overflow: hidden; color:#173530; border: 1px solid #cfe1da; border-radius: 24px; background: linear-gradient(155deg,#fff,#edf7f3); box-shadow: 0 18px 45px rgba(12,49,47,.1); }
.plan-product::before { content:""; width:110px; height:110px; position:absolute; top:-60px; left:-45px; border:22px solid rgba(242,169,59,.1); border-radius:50%; }
.plan-product--subscription { color:#fff; border-color:rgba(242,169,59,.28); background:radial-gradient(circle at 10% 10%,rgba(242,169,59,.17),transparent 36%),linear-gradient(145deg,#102d31,#174b48); }
.plan-product--notification_credit { border-color:#9dd5c8; background:radial-gradient(circle at 8% 8%,rgba(79,179,160,.2),transparent 38%),linear-gradient(155deg,#f7fffc,#dff3ed); }
.plan-product--sms_credit { border-color:#ebca88; background:radial-gradient(circle at 8% 8%,rgba(242,169,59,.22),transparent 38%),linear-gradient(155deg,#fffdf7,#faedcf); }
.plan-product h3 { margin:0; color:#173530; font-size:20px; }.plan-product p { min-height:48px; margin:0; color:#516a62; font-size:11px; }.plan-product--subscription h3{color:#fff}.plan-product--subscription p { color:#bfd3ce; }
.plan-product__type { width:max-content; padding:5px 10px; border-radius:999px; background:rgba(34,115,102,.1); color:#247565; font-size:9px; font-weight:900; }.plan-product--subscription .plan-product__type { background:rgba(255,255,255,.1);color:var(--amber); }
.plan-product__facts { display:grid; gap:5px; padding:14px; color:#244c43; border-radius:16px; background:rgba(29,94,84,.09); }.plan-product--subscription .plan-product__facts { color:#fff;background:rgba(255,255,255,.07); }.plan-product__facts small{font-size:9px}.plan-product>strong{margin-top:auto;color:#173530;font-size:18px}.plan-product--subscription>strong{color:#fff}.plan-product>.button{width:100%}.status-dot{position:absolute;top:22px;left:22px;font-size:8px;font-style:normal;color:#667b73}.status-dot--active{color:#21875d}
.plan-product:not(.plan-product--subscription)>.button.ghost{border-color:rgba(31,112,94,.28);background:rgba(31,112,94,.1);color:#184d43}

.horizontal-nav-hint[hidden]{display:none!important}
@media(max-width:700px){.horizontal-nav-hint:not([hidden]){min-height:25px;display:flex;align-items:center;justify-content:flex-end;gap:7px;margin:2px 4px 13px;color:#9fb7bb;font-size:9px}.horizontal-nav-hint b{min-width:26px;height:22px;display:grid;place-items:center;border:1px solid rgba(127,209,193,.24);border-radius:999px;background:rgba(127,209,193,.08);color:var(--teal-soft);font-size:14px;animation:horizontal-nav-nudge 1.4s ease-in-out infinite}.horizontal-nav-hint[data-direction=right] b{animation-direction:reverse}}
@keyframes horizontal-nav-nudge{50%{transform:translateX(-3px)}}
@media(prefers-reduced-motion:reduce){.horizontal-nav-hint b{animation:none}}
.admin-plan-layout { display:grid; grid-template-columns:minmax(300px,.65fr) minmax(0,1.35fr); align-items:start; gap:18px; }.admin-plan-layout .plan-market{grid-template-columns:repeat(2,minmax(0,1fr))}.plan-editor{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;position:sticky;top:90px}.plan-editor .form-title,.plan-editor .wide{grid-column:1/-1}
@media(max-width:900px){.billing-overview,.admin-plan-layout{grid-template-columns:1fr}.plan-market,.admin-plan-layout .plan-market{grid-template-columns:1fr}.credit-rings{grid-template-columns:repeat(3,minmax(0,1fr))}.plan-editor{position:static}}
@media(max-width:640px){.plan-suspended,.credit-required{align-items:stretch;flex-direction:column}.plan-suspended .button,.credit-required .button{width:100%}}
@media(max-width:520px){.credit-rings{grid-template-columns:1fr}.plan-editor{grid-template-columns:1fr}.plan-editor>*{grid-column:1!important}}
.partner-members { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.partner-members > span { display: grid; gap: 1px; padding: 7px 9px; border: 1px solid #d9e5df; border-radius: 11px; background: #f8fbf9; }
.partner-members > span b { color: #31584d; font-size: 8px; }
.partner-members > span small { color: #74837c; font-size: 7px; }
.partner-members > em { color: #839089; font-size: 8px; font-style: normal; }
.offer-validity > span { display: grid; grid-template-columns: 1fr 92px; gap: 7px; }
.offer-validity select { min-width: 0; }

@media (max-width: 960px) {
  .working-day { grid-template-columns: 75px 1fr 1fr; }
  .hours-closed-toggle { grid-column: 2 / -1; justify-content: flex-start; }
  #managerMetrics { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 680px) {
  .business-card-meta { align-items: flex-start; }
  .card-live { margin-top: 2px; }
  .presence-section > .owner-presence-editor { padding: 13px; }
  .availability-editor, .working-hours-editor { padding: 15px 12px; }
  .availability-editor > div { grid-template-columns: 1fr; }
  .availability-editor label > span { min-height: 67px; }
  .working-day { grid-template-columns: 1fr 1fr; padding: 11px; }
  .working-day > strong { grid-column: 1 / -1; }
  .hours-closed-toggle { grid-column: 1 / -1; }
  .media-management { grid-template-columns: 1fr; }
  .gallery-upload-card, .media-preview { grid-column: auto; }
  .media-preview-head { align-items: flex-start; flex-direction: column; }
  .manager-gallery { grid-template-columns: repeat(2, 1fr); }
  #managerMetrics { grid-template-columns: 1fr 1fr; }
}

/* Car-service parity: shared shell, contextual return, access hub and catalog. */
body:not(.profile-body) > .topbar {
  height: 72px;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
  align-items: center;
  padding: 0 max(20px, calc((100% - 1240px) / 2));
  gap: 14px;
  background: rgba(16, 30, 34, .94);
  border-bottom: 1px solid rgba(127, 209, 193, .18);
  backdrop-filter: blur(14px);
}
body:not(.profile-body) > .topbar .service-brand { justify-self: center; min-width: 0; }
body:not(.profile-body) > .topbar .service-brand > div { min-width: 0; text-align: right; }
body:not(.profile-body) > .topbar .service-brand b { color: var(--paper); font-size: 15px; white-space: nowrap; }
body:not(.profile-body) > .topbar .service-brand small { color: var(--teal-soft); font-size: 10px; }
body:not(.profile-body) > .topbar .superapp-return {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: start;
  gap: 8px;
  padding: 8px 15px;
  white-space: nowrap;
}
body:not(.profile-body) > .topbar .superapp-return > span:first-child { font-family: Arial, sans-serif; font-size: 19px; line-height: 1; }
.topbar-balance { justify-self: end; width: 1px; }
html.is-returning-to-superapp body:not(.profile-body) > .topbar .superapp-return { pointer-events: none; opacity: .72; }

body:not(.profile-body) > main { max-width: 1240px; margin: auto; padding: 28px 20px 110px; overflow: visible; }
body:not(.profile-body) > main > .workspace { max-width: none; padding: 14px 0 0; }
body:not(.profile-body) > main > .state { min-height: 65vh; max-width: none; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }

.service-context-nav {
  min-height: 48px;
  margin: 0 0 18px;
  padding: 3px 5px 3px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  position: sticky;
  top: 82px;
  z-index: 38;
  border: 1px solid rgba(127, 209, 193, .2);
  border-radius: 15px;
  background: rgba(16, 30, 34, .92);
  box-shadow: 0 12px 28px #0004;
  backdrop-filter: blur(14px);
}
.service-context-nav[hidden] { display: none !important; }
.service-context-nav small { color: #91aaae; font-size: 11px; font-weight: 700; }
.service-back {
  min-height: 44px;
  padding: 7px 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid rgba(127, 209, 193, .3);
  border-radius: 12px;
  background: #17343a;
  color: var(--teal-soft);
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}
.service-back:hover { border-color: var(--amber); color: var(--amber-soft); }
.service-back:focus-visible { outline: 3px solid var(--teal-soft); outline-offset: 2px; }

.home-dashboard { max-width: 1160px; margin: 0 auto; }
.home-dashboard-hero { position: relative; isolation: isolate; display: flex; align-items: center; justify-content: space-between; gap: 28px; min-height: 220px; padding: 34px 38px; margin-bottom: 18px; overflow: hidden; border: 1px solid rgba(127,209,193,.22); border-radius: 30px; background: radial-gradient(circle at 12% 10%,rgba(79,179,160,.23),transparent 34%),linear-gradient(125deg,#173940,#0e2227); box-shadow: 0 24px 60px #0006; }
.home-dashboard-hero::after { content: ""; position: absolute; z-index: -1; width: 380px; height: 380px; inset: -190px -100px auto auto; border-radius: 50%; background: radial-gradient(circle,rgba(242,169,59,.3),transparent 67%); }
.home-dashboard-hero h1 { margin: 7px 0; font-size: clamp(30px,5vw,52px); line-height: 1.2; color: #fff; }
.home-dashboard-hero p { max-width: 720px; margin: 0; color: #bcd0d2; font-size: 15px; line-height: 1.9; }
.home-dashboard-mark { flex: 0 0 132px; width: 132px; height: 132px; display: grid; place-items: center; border: 1px solid rgba(247,200,120,.34); border-radius: 35px; background: linear-gradient(145deg,rgba(242,169,59,.18),rgba(79,179,160,.12)); color: var(--amber-soft); box-shadow: inset 0 1px #fff2,0 18px 36px #0005; transform: rotate(-3deg); }
.home-dashboard-mark svg { width: 92px; height: 92px; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.home-dashboard-intro { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 3px 14px; }
.home-dashboard-intro span { font-size: 18px; font-weight: 900; color: var(--paper); }
.home-dashboard-intro small { color: #94aaae; }
.home-dashboard-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 17px; }
.home-entry-card { appearance: none; position: relative; min-width: 0; min-height: 350px; padding: 24px; overflow: hidden; border: 1px solid rgba(127,209,193,.2); border-radius: 26px; color: var(--paper); text-align: right; text-decoration: none; font: inherit; display: flex; flex-direction: column; align-items: flex-start; cursor: pointer; box-shadow: 0 18px 44px #0005; transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.home-entry-card::before { content: ""; position: absolute; width: 230px; height: 230px; inset: -110px auto auto -90px; border-radius: 50%; background: radial-gradient(circle,currentColor 0,transparent 68%); opacity: .12; pointer-events: none; }
.home-entry-card::after { content: ""; position: absolute; inset: auto 24px 0; height: 3px; border-radius: 99px 99px 0 0; background: currentColor; opacity: .9; }
.home-entry-centers { --home-accent: var(--amber-soft); background: linear-gradient(150deg,#3c2f1c,#172c30); color: var(--home-accent); }
.home-entry-register { --home-accent: var(--teal-soft); background: linear-gradient(150deg,#153c3b,#12292f); color: var(--home-accent); }
.home-entry-management { --home-accent: #ff9c82; background: linear-gradient(150deg,#3d282a,#172b31); color: var(--home-accent); cursor: default; }
.home-entry-card:hover { transform: translateY(-5px); border-color: currentColor; box-shadow: 0 25px 56px #0008; }
.home-entry-management:hover { transform: none; box-shadow: 0 18px 44px #0005; }
.home-entry-card:focus-visible,.home-management-actions button:focus-visible { outline: 3px solid var(--paper); outline-offset: 4px; }
.home-card-order { position: absolute; inset: 19px auto auto 19px; min-width: 34px; height: 34px; padding: 0 8px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 12px; background: #0d2025bb; color: currentColor; font-weight: 900; box-shadow: 0 8px 18px #0004; }
.home-card-icon { width: 92px; height: 92px; margin-bottom: 22px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 27px; background: #0c2025aa; color: currentColor; box-shadow: inset 0 1px #fff2,0 14px 28px #0004; }
.home-card-icon svg { width: 62px; height: 62px; fill: none; stroke: currentColor; stroke-width: 2.7; stroke-linecap: round; stroke-linejoin: round; }
.home-card-copy { display: block; color: var(--paper); }
.home-card-copy > small { display: block; color: var(--home-accent); font-size: 11px; font-weight: 900; }
.home-card-copy h2 { margin: 7px 0 8px; color: #fff; font-size: clamp(21px,2.4vw,28px); }
.home-card-copy p { margin: 0; color: #afc0c3; font-size: 13px; line-height: 1.9; }
.home-card-action { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 22px; color: currentColor; font-weight: 900; }
.home-card-action b { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: currentColor; color: var(--ink); font-size: 20px; }
.home-management-actions { width: 100%; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: auto; padding-top: 18px; }
.home-management-actions button { min-width: 0; min-height: 64px; padding: 10px 12px; border: 1px solid #70443d; border-radius: 14px; background: #281f22; color: #fff; text-align: right; font: inherit; cursor: pointer; transition: .18s; }
.home-management-actions button:hover { border-color: #ff9c82; background: #3a2829; }
.home-management-actions button span,.home-management-actions button small { display: block; }
.home-management-actions button span { font-weight: 900; }
.home-management-actions button small { margin-top: 3px; color: #cbb2ae; font-size: 9px; }
.home-management-actions button:only-child { grid-column: 1/-1; }

.catalog-view .hero { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 32px; border: 1px solid rgba(127,209,193,.18); border-radius: 26px; background: linear-gradient(128deg,var(--bg-deep-2),var(--bg-deep-3)); color: #fff; box-shadow: 0 20px 52px #0006; }
.catalog-view .hero::before { content: ""; position: absolute; inset: auto -7rem -9rem auto; width: 21rem; height: 21rem; border-radius: 50%; background: radial-gradient(circle,var(--amber) 0,transparent 65%); opacity: .15; pointer-events: none; }
.catalog-view .hero h1 { margin: 7px 0; font-size: clamp(24px,4vw,40px); }
.catalog-view .hero p { margin: 0; color: #b9cccf; }
.catalog-view .eyebrow,.catalog-view .step { color: var(--amber-soft); font-size: 12px; font-weight: 900; letter-spacing: .5px; }
.catalog-view .panel { padding: 22px; border: 1px solid rgba(127,209,193,.18); border-radius: 22px; background: linear-gradient(150deg,var(--bg-deep-2),#13282d); color: var(--paper); box-shadow: 0 16px 42px #0005; }
.catalog-view .panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.catalog-view .panel-head h2 { margin: 0; }
.centers-panel { margin-top: 18px; }
.catalog-filters { display: flex; align-items: center; gap: 9px; }
.catalog-filters select { min-width: 150px; }
.catalog-filters :is(input,select) { min-height: 46px; margin: 0; border: 1px solid #45636a; border-radius: 12px; background: #0f2227; color: var(--paper); }
.compact-search { max-width: 300px; }
.garage-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 16px; }
.business-catalog-card { position: relative; min-width: 0; overflow: hidden; padding: 0; border: 1px solid rgba(127,209,193,.18); border-radius: 17px; background: linear-gradient(150deg,#142d33,#102328); color: var(--paper); box-shadow: none; transition: transform .2s ease,border-color .2s ease; }
.business-catalog-card:hover { border-color: var(--amber); transform: translateY(-3px); }
.business-card-main { height: 100%; display: grid; align-content: start; gap: 8px; padding: 17px; color: inherit; text-decoration: none; }
.business-card-main > b { padding-inline-end: 2px; color: var(--paper); }
.business-card-main > small { min-height: 42px; color: #a9bec2; line-height: 1.8; }
.business-card-main > .link { margin-top: auto; color: var(--teal-soft); font-weight: 800; }
.business-catalog-card .garage-logo { height: 112px; display: block; overflow: hidden; border-radius: 12px; background: linear-gradient(135deg,var(--bg-deep-2),var(--teal)); color: #fff; }
.business-catalog-card .garage-logo img { width: 100%; height: 100%; min-width: 0; min-height: 0; display: block; padding: 10px; object-fit: contain; transition: transform .22s ease; }
.business-catalog-card:hover .garage-logo img { transform: scale(1.035); }
.favorite-button { width: 42px; height: 42px; position: absolute; z-index: 2; top: 25px; left: 25px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; background: rgba(10,29,33,.88); color: #fff; box-shadow: 0 8px 22px #0006; backdrop-filter: blur(8px); cursor: pointer; transition: transform .18s ease,color .18s ease,border-color .18s ease,background .18s ease; }
.favorite-button svg { width: 23px; height: 23px; fill: transparent; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; transition: fill .18s ease; }
.favorite-button:hover { transform: scale(1.08); border-color: var(--amber-soft); color: var(--amber-soft); }
.favorite-button.is-favorite { border-color: #ff9c82; background: #512e2d; color: #ff9c82; }
.favorite-button.is-favorite svg { fill: currentColor; }
.favorite-button:disabled { opacity: .7; }
.favorites-filter { min-height: 46px; display: inline-flex; align-items: center; gap: 7px; padding: 0 12px; border: 1px solid #45636a; border-radius: 12px; background: #0f2227; color: #b9cccf; white-space: nowrap; cursor: pointer; }
.favorites-filter input { width: 1px; min-height: 1px; position: absolute; opacity: 0; }
.favorites-filter span { color: #91aaae; font-size: 17px; }
.favorites-filter b { font-size: 11px; }
.favorites-filter:has(input:checked) { border-color: #ff9c82; background: #3f2929; color: #fff; }
.favorites-filter:has(input:checked) span { color: #ff9c82; }
.favorites-filter:focus-within { outline: 3px solid var(--teal-soft); outline-offset: 2px; }
.catalog-more { display: flex; justify-content: center; margin-top: 18px; }
.catalog-more .secondary { min-width: 210px; border: 1px solid #45636a; background: var(--bg-deep-3); color: var(--paper); }
.garage-grid > .empty { grid-column: 1/-1; padding: 35px 10px; color: #a9bdc1; text-align: center; }
.catalog-skeleton { height: 235px; border-radius: 17px; background: linear-gradient(90deg,#142d33,#1c3b42,#142d33); background-size: 220% 100%; animation: pulse 1.4s infinite; }

@media(max-width:900px) {
  .home-dashboard-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .home-entry-management { grid-column: 1/-1; min-height: 300px; }
  .home-entry-management .home-management-actions { max-width: 620px; }
  .home-dashboard-mark { flex-basis: 112px; width: 112px; height: 112px; }
  .home-dashboard-mark svg { width: 78px; height: 78px; }
  .catalog-view .panel-head { align-items: stretch; flex-direction: column; }
  .catalog-filters { width: 100%; flex-wrap: wrap; }
  .catalog-filters > * { flex: 1 1 180px; }
  .compact-search { max-width: none; }
}
@media(max-width:850px) { .garage-grid { grid-template-columns: repeat(2,1fr); } }
@media(max-width:700px) {
  body:not(.profile-body) > .topbar { height: 64px; padding: 0 12px; gap: 7px; }
  body:not(.profile-body) > .topbar .service-brand { gap: 7px; }
  body:not(.profile-body) > .topbar .service-brand > img { width: 38px; height: 38px; }
  body:not(.profile-body) > .topbar .service-brand b { font-size: 12px; }
  body:not(.profile-body) > .topbar .service-brand small { display: none; }
  body:not(.profile-body) > .topbar .superapp-return { min-height: 44px; height: 44px; max-width: none; padding: 7px 11px; border-radius: 999px; font-size: 11.5px; box-shadow: none; overflow: visible; }
  body:not(.profile-body) > main { padding-top: 16px; }
  .service-context-nav { top: 72px; margin-bottom: 14px; padding-inline-end: 9px; }
  .service-context-nav small { font-size: 10px; }
  .service-back { min-height: 44px; font-size: 11.5px; }
}
@media(max-width:620px) {
  .home-dashboard-hero { min-height: 0; padding: 25px 20px; border-radius: 23px; }
  .home-dashboard-mark { display: none; }
  .home-dashboard-hero h1 { font-size: 32px; }
  .home-dashboard-hero p { font-size: 13px; }
  .home-dashboard-intro { align-items: flex-start; flex-direction: column; padding-inline: 2px; }
  .home-dashboard-grid { grid-template-columns: 1fr; }
  .home-entry-card,.home-entry-management { grid-column: auto; min-height: 290px; padding: 20px; border-radius: 22px; }
  .home-card-icon { width: 76px; height: 76px; border-radius: 22px; }
  .home-card-icon svg { width: 52px; height: 52px; }
  .home-card-copy h2 { font-size: 24px; }
  .home-management-actions { grid-template-columns: 1fr; }
  .home-management-actions button { min-height: 58px; }
  .home-management-actions button:only-child { grid-column: auto; }
}
@media(max-width:520px) {
  .garage-grid { grid-template-columns: 1fr; }
  .catalog-filters { flex-direction: column; align-items: stretch; }
  .catalog-filters > * { width: 100%; flex-basis: auto; }
  .catalog-filters select,.catalog-filters input { max-width: none; }
}
@media(max-width:390px) {
  body:not(.profile-body) > .topbar .service-brand > img { width: 34px; height: 34px; }
  body:not(.profile-body) > .topbar .superapp-return { padding-inline: 9px; font-size: 11px; }
  .service-context-nav small { max-width: 42%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
@media(prefers-reduced-motion:reduce) { .home-entry-card { transition: none; } .home-entry-card:hover { transform: none; } }