:root {
  --bg: #05070a;
  --panel: rgba(8, 12, 16, .72);
  --panel-strong: rgba(8, 12, 16, .92);
  --line: rgba(255,255,255,.13);
  --text: #fbfdff;
  --muted: rgba(251,253,255,.70);
  --soft: rgba(255,255,255,.08);
  --cyan: #18f3ee;
  --pink: #ff2f7e;
  --green: #25ee97;
  --blue: #7ac8ff;
  --warm: #ffe099;
  --shadow: 0 24px 80px rgba(0,0,0,.48);
  --safe-bottom: env(safe-area-inset-bottom);
  color-scheme: dark;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; min-height: 100%; background: radial-gradient(circle at 50% -15%, #123c45 0, #05070a 46%); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body { display: grid; place-items: center; overflow: hidden; }
button, input, textarea, select { font: inherit; border: 0; color: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.05; stroke-linecap: round; stroke-linejoin: round; }
input, textarea { width: 100%; padding: 14px 15px; border-radius: 18px; background: rgba(255,255,255,.09); border: 1px solid var(--line); outline: none; }
textarea { resize: vertical; line-height: 1.35; }
input:focus, textarea:focus { border-color: rgba(24,243,238,.55); box-shadow: 0 0 0 4px rgba(24,243,238,.10); }

.phone { position: relative; width: min(100vw, 460px); height: 100dvh; max-height: 980px; overflow: hidden; background: #030507; box-shadow: var(--shadow); isolation: isolate; }
.phone::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 12% 0, rgba(24,243,238,.28), transparent 32%), radial-gradient(circle at 92% 18%, rgba(255,47,126,.18), transparent 36%), linear-gradient(180deg, #05070a, #020405); }

.topbar { position: absolute; z-index: 70; inset: 0 0 auto; padding: calc(9px + env(safe-area-inset-top)) 12px 0; display: grid; gap: 8px; background: linear-gradient(180deg, rgba(0,0,0,.78), rgba(0,0,0,.35) 58%, rgba(0,0,0,0)); pointer-events: none; }
.topbar button { pointer-events: auto; }
.top-row { display: grid; grid-template-columns: auto 1fr 42px 42px; align-items: center; gap: 8px; }
.brand { display: inline-grid; grid-template-columns: 30px auto; align-items: center; gap: 7px; min-width: 116px; padding: 0; background: transparent; font-weight: 950; line-height: .86; letter-spacing: -.05em; text-align: left; }
.brand-stack { display: grid; gap: 0; line-height: .84; }
.brand-vi { display: block; font-size: 17px; letter-spacing: -.06em; background: linear-gradient(135deg, #fff, var(--cyan) 58%, var(--pink)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.brand-connects { display: block; font-size: 13px; letter-spacing: -.04em; background: linear-gradient(135deg, var(--cyan), #fff 48%, var(--pink)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.brand img { width: 30px; height: 30px; border-radius: 10px; box-shadow: 0 0 22px rgba(24,243,238,.20); }

.feed-tabs { justify-self: center; display: flex; align-items: center; gap: 7px; padding: 4px; border-radius: 999px; background: rgba(0,0,0,.22); border: 1px solid rgba(255,255,255,.10); backdrop-filter: blur(16px); max-width: 180px; overflow: hidden; }
.feed-tabs button { min-width: 0; padding: 8px 9px; border-radius: 999px; background: transparent; color: rgba(255,255,255,.72); font-size: 12px; font-weight: 880; white-space: nowrap; }
.feed-tabs button.active { background: rgba(255,255,255,.18); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.12); }
.icon-btn, .round-btn { position: relative; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 999px; background: rgba(255,255,255,.11); border: 1px solid rgba(255,255,255,.14); backdrop-filter: blur(18px); color: #fff; }
.icon-btn svg { width: 20px; height: 20px; }
.notif-badge { position: absolute; top: 5px; right: 5px; min-width: 15px; height: 15px; padding: 0 4px; display: grid; place-items: center; border-radius: 999px; background: var(--pink); color: #fff; font-size: 9px; font-weight: 950; box-shadow: 0 0 0 2px rgba(0,0,0,.5); }
.location-row { display: flex; align-items: center; gap: 8px; min-width: 0; }
.area-chip { display: inline-flex; align-items: center; gap: 8px; min-width: 0; max-width: 58%; padding: 9px 12px; border-radius: 999px; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.15); backdrop-filter: blur(18px); box-shadow: inset 0 1px 0 rgba(255,255,255,.09); }
.area-chip svg { width: 17px; height: 17px; flex: 0 0 auto; color: var(--cyan); }
.area-chip span { display: block; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 13px; font-weight: 920; letter-spacing: -.02em; }
.area-chip small { display: none; }
.area-chip.is-gps::after { content: ""; width: 7px; height: 7px; border-radius: 999px; background: var(--green); box-shadow: 0 0 12px rgba(37,238,151,.9); }
.tiny-lang { width: 42px; font-size: 13px; font-weight: 950; color: var(--cyan); }
.ghost-dot { margin-left: auto; width: auto; height: 42px; display: inline-flex; align-items: center; gap: 7px; padding: 0 11px; border-radius: 999px; background: rgba(37,238,151,.10); border: 1px solid rgba(37,238,151,.18); color: #eafff5; font-size: 11px; font-weight: 900; backdrop-filter: blur(18px); }
.ghost-dot span { width: 9px; height: 9px; border-radius: 999px; background: var(--green); box-shadow: 0 0 15px rgba(37,238,151,.9); }
.ghost-dot.pulse span { animation: pulse 1s infinite; }
@keyframes pulse { 0%,100% { transform: scale(.85); opacity: .72; } 50% { transform: scale(1.25); opacity: 1; } }

.story-strip { position: absolute; z-index: 45; top: calc(103px + env(safe-area-inset-top)); left: 0; right: 0; display: flex; gap: 9px; overflow-x: auto; padding: 8px 12px; scrollbar-width: none; pointer-events: auto; }
.story-strip::-webkit-scrollbar { display: none; }
.story-pill { flex: 0 0 auto; width: 68px; display: grid; place-items: center; gap: 5px; padding: 0; background: transparent; color: #fff; text-align: center; }
.story-pill .story-ring { width: 56px; height: 56px; padding: 2px; border-radius: 50%; background: conic-gradient(from 20deg, var(--pink), var(--warm), var(--cyan), var(--pink)); box-shadow: 0 8px 22px rgba(0,0,0,.24); }
.story-pill img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; background: rgba(255,255,255,.08); border: 2px solid #05070a; }
.story-pill span { max-width: 68px; font-size: 10px; font-weight: 820; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 2px 8px #000; }

.feed { position: absolute; z-index: 2; inset: 0; overflow-y: auto; scroll-snap-type: y mandatory; scrollbar-width: none; }
.feed::-webkit-scrollbar { display: none; }
.reel-card { position: relative; min-height: 100dvh; scroll-snap-align: start; overflow: hidden; background: #05070a; }
.media-wrap { position: absolute; inset: 0; display: grid; place-items: center; overflow: hidden; background: #111; }
.media-wrap::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 30% 22%, rgba(24,243,238,.28), transparent 42%), linear-gradient(160deg, #071115, #010203 58%); }
.media-wrap::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.34) 0, rgba(0,0,0,.07) 28%, rgba(0,0,0,.10) 53%, rgba(0,0,0,.78) 82%, rgba(0,0,0,.96) 100%); }
.media-wrap img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; filter: saturate(1.05) contrast(1.02); transform: translateZ(0); }
.media-wrap.photo { background: #04080b; }
.media-wrap.photo .media-bg { position: absolute; z-index: 0; inset: -18px; width: calc(100% + 36px); height: calc(100% + 36px); object-fit: cover; filter: blur(18px) saturate(1.18) brightness(.72); opacity: .68; transform: scale(1.04); }
.media-wrap.photo .media-main { width: 100%; height: 100%; object-fit: contain; object-position: center; filter: saturate(1.04) contrast(1.01); background: transparent; }
.media-wrap.photo::before { background: radial-gradient(circle at 20% 12%, rgba(24,243,238,.16), transparent 34%), linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.20)); }
.media-wrap.photo::after { background: linear-gradient(180deg, rgba(0,0,0,.44) 0, rgba(0,0,0,.04) 24%, rgba(0,0,0,.06) 58%, rgba(0,0,0,.76) 82%, rgba(0,0,0,.96) 100%); }
.media-wrap.demo { background: linear-gradient(145deg, #09181f, #05070a); }
.media-wrap.demo img { width: min(70%, 310px); height: min(48%, 340px); object-fit: contain; filter: drop-shadow(0 24px 55px rgba(0,0,0,.44)); opacity: .94; }
.media-wrap.demo::after { background: linear-gradient(180deg, rgba(0,0,0,.30), rgba(0,0,0,.05) 44%, rgba(0,0,0,.82) 84%, rgba(0,0,0,.96)); }
.top-fade { position: absolute; inset: 0 0 auto; height: 180px; background: linear-gradient(180deg, rgba(0,0,0,.78), transparent); pointer-events: none; z-index: 2; }
.card-glow { position: absolute; z-index: 3; inset: auto -28% 0; height: 48%; background: radial-gradient(ellipse at bottom left, rgba(24,243,238,.23), transparent 48%), radial-gradient(ellipse at bottom right, rgba(255,47,126,.18), transparent 42%); pointer-events: none; }
.card-info { position: absolute; z-index: 5; left: 15px; right: 82px; bottom: calc(78px + var(--safe-bottom)); display: grid; gap: 8px; text-shadow: 0 2px 13px rgba(0,0,0,.55); }
.seller-line { width: fit-content; max-width: 100%; display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 4px 10px 4px 4px; border-radius: 999px; background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(14px); text-align: left; }
.seller-line .avatar { position: relative; width: 30px; height: 30px; flex: 0 0 auto; border-radius: 50%; padding: 2px; background: linear-gradient(135deg, var(--cyan), var(--pink)); }
.seller-line img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; background: #101820; border: 2px solid #05070a; }
.seller-line .online-dot { position: absolute; right: -1px; bottom: -1px; width: 9px; height: 9px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 2px #05070a, 0 0 12px rgba(37,238,151,.9); }
.seller-line .seller-text { min-width: 0; display: grid; line-height: 1.05; }
.seller-line .seller-name { max-width: 180px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 13px; font-weight: 950; }
.seller-line .seller-area { color: rgba(255,255,255,.72); font-size: 10.5px; font-weight: 780; }
.badge-line { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; max-height: 30px; overflow: hidden; }
.badge { width: fit-content; max-width: 178px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 6px 9px; border-radius: 999px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(12px); font-size: 10px; font-weight: 950; letter-spacing: .035em; text-transform: uppercase; }
.badge.live { background: rgba(255,47,126,.88); }
.badge.service { background: rgba(24,243,238,.17); color: #eaffff; }
.badge.price { color: #161208; background: linear-gradient(135deg, rgba(255,224,153,.95), rgba(255,255,255,.78)); border: 0; max-width: 148px; text-transform: none; letter-spacing: 0; }
.badge.ok { color: var(--green); }
.card-info h1 { margin: 0; font-size: clamp(25px, 7.2vw, 35px); line-height: 1.02; letter-spacing: -.055em; max-height: 75px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
.card-info p { margin: 0; color: rgba(255,255,255,.90); font-size: 13px; line-height: 1.34; max-height: 52px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.tag-line { display: flex; flex-wrap: wrap; gap: 6px; max-height: 31px; overflow: hidden; }
.tag { border-radius: 999px; padding: 6px 9px; font-size: 10.5px; color: #eafcff; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.12); }
.action-rail { position: absolute; z-index: 6; right: 10px; bottom: calc(82px + var(--safe-bottom)); display: grid; gap: 10px; justify-items: center; }
.action { width: 52px; min-height: 52px; border-radius: 999px; display: grid; place-items: center; gap: 2px; padding: 6px 3px; background: rgba(8,12,16,.50); border: 1px solid rgba(255,255,255,.14); backdrop-filter: blur(16px); color: #fff; box-shadow: 0 10px 24px rgba(0,0,0,.22); }
.action span { width: 22px; height: 22px; display: grid; place-items: center; }
.action svg { width: 21px; height: 21px; }
.action b { display: block; max-width: 48px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 8.5px; font-weight: 920; line-height: 1; }
.action.get { background: linear-gradient(135deg, var(--cyan), var(--pink)); color: #fff; border: 0; }
.action.chat { background: linear-gradient(135deg, rgba(37,238,151,.95), rgba(24,243,238,.82)); color: #021114; border: 0; }
.action.live { background: linear-gradient(135deg, rgba(255,47,126,.95), rgba(255,214,102,.88)); border: 0; }

.bottom-nav { position: absolute; z-index: 70; left: 10px; right: 10px; bottom: calc(8px + var(--safe-bottom)); height: 64px; display: grid; grid-template-columns: repeat(5, 1fr); align-items: center; padding: 7px 10px; background: rgba(3,5,7,.88); border: 1px solid rgba(255,255,255,.12); border-radius: 24px; backdrop-filter: blur(20px); box-shadow: 0 16px 42px rgba(0,0,0,.32); }
.bottom-nav button { background: transparent; color: rgba(255,255,255,.67); display: grid; place-items: center; gap: 3px; }
.bottom-nav svg { width: 21px; height: 21px; }
.bottom-nav button b { font-size: 9.5px; font-weight: 850; }
.bottom-nav button.active { color: #fff; }
.bottom-nav .post { width: 64px; height: 44px; border-radius: 17px; justify-self: center; background: #fff; color: #05070a; position: relative; box-shadow: -5px 0 0 var(--cyan), 5px 0 0 var(--pink); }
.bottom-nav .post svg { width: 26px; height: 26px; stroke-width: 2.5; }

.directory { position: absolute; z-index: 35; inset: 0; padding: calc(114px + env(safe-area-inset-top)) 14px 90px; overflow-y: auto; background: radial-gradient(circle at 50% 0, #123c45, #05070a 48%); }
.hidden { display: none !important; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.section-head small, .sheet-title small { color: var(--cyan); font-weight: 950; letter-spacing: .08em; text-transform: uppercase; }
.section-head h2, .sheet-title h3 { margin: 2px 0 0; line-height: 1.04; letter-spacing: -.04em; }
.mini-btn, .chip, .soft, .primary { border-radius: 999px; padding: 12px 16px; background: rgba(255,255,255,.10); border: 1px solid var(--line); color: #fff; font-weight: 900; }
.primary { background: linear-gradient(135deg, var(--cyan), var(--pink)); border: 0; color: #fff; box-shadow: 0 14px 30px rgba(24,243,238,.13); }
.soft { background: rgba(24,243,238,.13); }
.wide { width: 100%; }
.chips, .quick-areas, .area-grid { display: flex; gap: 9px; overflow-x: auto; padding-bottom: 8px; scrollbar-width: none; }
.area-grid, .quick-areas { flex-wrap: wrap; overflow: visible; margin: 12px 0; }
.chips::-webkit-scrollbar { display: none; }
.chip, .area-grid button, .quick-areas button { flex: 0 0 auto; font-size: 13px; border-radius: 999px; padding: 10px 12px; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.12); font-weight: 850; }
.chip.active, .language-grid button.active, .language-inline button.active { background: #fff; color: #051015; }
.inline-search { margin: 10px 0; }
.inline-search.with-icon { position: relative; }
.inline-search.with-icon svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; color: rgba(255,255,255,.65); pointer-events: none; }
.inline-search.with-icon input { padding-left: 42px; }
.directory-list { display: grid; gap: 12px; }
.dir-card { width: 100%; display: grid; grid-template-columns: 64px 1fr auto; gap: 12px; align-items: center; padding: 11px; border: 1px solid var(--line); border-radius: 24px; background: rgba(255,255,255,.075); backdrop-filter: blur(18px); text-align: left; }
.avatar-wrap { position: relative; width: 64px; height: 64px; border-radius: 22px; overflow: visible; flex: 0 0 auto; background: linear-gradient(135deg, var(--cyan), var(--pink)); padding: 2px; }
.avatar-wrap img { width: 100%; height: 100%; border-radius: 20px; object-fit: cover; background: #101820; border: 2px solid #05070a; }
.avatar-wrap .online-dot { position: absolute; right: 0; bottom: 0; width: 13px; height: 13px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px #05070a, 0 0 12px rgba(37,238,151,.9); }
.dir-card strong { display: block; font-size: 16px; letter-spacing: -.02em; }
.dir-card span, .dir-card em { display: block; color: var(--muted); font-size: 12px; font-style: normal; line-height: 1.28; max-width: 220px; }
.dir-card em { max-height: 32px; overflow: hidden; margin-top: 3px; }
.dir-actions { display: flex; gap: 6px; align-items: center; }
.dir-actions button { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 999px; background: rgba(255,255,255,.11); border: 1px solid rgba(255,255,255,.12); color: #fff; }
.dir-actions svg { width: 18px; height: 18px; }
.dir-actions .profile-small { background: linear-gradient(135deg, rgba(24,243,238,.85), rgba(255,47,126,.82)); border: 0; }

.toast-zone { position: fixed; z-index: 100; left: 50%; bottom: 24px; transform: translateX(-50%); width: min(92vw, 420px); display: grid; gap: 8px; pointer-events: none; }
.toast { padding: 13px 15px; border-radius: 18px; background: rgba(8,14,18,.95); border: 1px solid rgba(255,255,255,.14); box-shadow: var(--shadow); animation: toastIn .22s ease-out; font-weight: 760; }
@keyframes toastIn { from { transform: translateY(18px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

.sheet { margin: auto; width: min(100vw, 460px); max-width: 460px; height: 100dvh; max-height: none; padding: 0; border: 0; background: transparent; color: var(--text); }
.sheet::backdrop { background: rgba(0,0,0,.64); backdrop-filter: blur(8px); }
.sheet-card { position: absolute; left: 0; right: 0; bottom: 0; max-height: 88dvh; overflow-y: auto; padding: 12px 16px calc(18px + var(--safe-bottom)); border-radius: 30px 30px 0 0; background: rgba(5, 9, 12, .97); border: 1px solid rgba(255,255,255,.12); box-shadow: var(--shadow); }
.sheet-card.tall { max-height: 94dvh; }
.sheet-card.compact { max-height: 64dvh; }
.sheet-bar { width: 44px; height: 5px; border-radius: 999px; background: rgba(255,255,255,.24); margin: 2px auto 14px; }
.sheet-title { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; }
.xbtn { width: 38px; height: 38px; border-radius: 999px; background: rgba(255,255,255,.10); font-size: 22px; }
.muted { color: var(--muted); line-height: 1.45; font-size: 14px; }
.row { display: flex; align-items: center; }
.gap { gap: 10px; }
.ask-box { display: grid; gap: 10px; }
.search-results { display: grid; gap: 10px; margin-top: 10px; }
.result-card { width: 100%; display: grid; grid-template-columns: 56px 1fr auto; gap: 10px; align-items: center; padding: 10px; border-radius: 20px; background: rgba(255,255,255,.08); border: 1px solid var(--line); text-align: left; }
.result-card img { width: 56px; height: 56px; border-radius: 16px; object-fit: cover; background: rgba(255,255,255,.08); }
.result-card strong { display: block; }
.result-card span span { color: var(--muted); font-size: 12px; }
.upload-box { min-height: 210px; border-radius: 28px; border: 1px dashed rgba(255,255,255,.24); background: linear-gradient(145deg, rgba(24,243,238,.10), rgba(255,47,126,.08)); display: grid; place-items: center; overflow: hidden; position: relative; margin: 12px 0; }
.upload-box img { display: none; width: 100%; height: 100%; max-height: 330px; object-fit: contain; background: #061115; }
.upload-box.has-image img { display: block; }
.upload-box.has-image span { display: none; }
.upload-box span { color: var(--muted); font-weight: 850; text-align: center; padding: 22px; }
.post-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ai-card { margin: 12px 0; padding: 14px; border: 1px solid rgba(24,243,238,.20); border-radius: 24px; background: rgba(24,243,238,.08); }
.ai-card span { color: var(--cyan); font-size: 12px; text-transform: uppercase; font-weight: 950; letter-spacing: .09em; }
.ai-card strong { display: block; margin: 5px 0; }
.ai-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.35; }
.language-grid { display: grid; grid-template-columns: 1fr; gap: 10px; }
.language-grid button, .language-inline button { padding: 14px 16px; border-radius: 18px; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.13); font-weight: 950; }
.language-inline { display: flex; gap: 8px; margin: 10px 0 14px; }

.mode-toggle { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 5px; border-radius: 22px; background: rgba(255,255,255,.075); border: 1px solid var(--line); margin: 10px 0; }
.mode-toggle button { border-radius: 18px; padding: 12px 10px; background: transparent; color: var(--muted); font-weight: 950; }
.mode-toggle button.active { background: #fff; color: #061116; box-shadow: 0 12px 26px rgba(0,0,0,.20); }
.publish-status { display: grid; grid-template-columns: 34px 1fr; gap: 10px; align-items: center; padding: 12px; margin: 8px 0 12px; border-radius: 22px; background: rgba(24,243,238,.10); border: 1px solid rgba(24,243,238,.22); }
.publish-status strong { display: block; font-size: 13px; }
.publish-status small { display: block; color: var(--muted); line-height: 1.28; font-size: 12px; margin-top: 2px; }
.spinner { width: 30px; height: 30px; border-radius: 50%; border: 3px solid rgba(255,255,255,.16); border-top-color: var(--cyan); animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
button.loading { opacity: .72; pointer-events: none; }
.profile-editor-avatar { display: grid; grid-template-columns: 76px 1fr; gap: 12px; align-items: center; padding: 10px; border-radius: 24px; background: rgba(255,255,255,.075); border: 1px solid var(--line); margin: 10px 0 12px; }
.profile-editor-avatar .avatar-wrap { width: 76px; height: 76px; border-radius: 26px; }
.profile-editor-avatar .avatar-wrap img { border-radius: 24px; }
.profile-editor-avatar b { font-weight: 900; color: #fff; line-height: 1.2; }
.detail-card { background: rgba(5, 9, 12, .985); }
.detail-media { position: relative; height: min(52dvh, 520px); border-radius: 28px; overflow: hidden; background: #020406; border: 1px solid rgba(255,255,255,.12); margin-bottom: 12px; display: grid; place-items: center; }
.detail-media .detail-bg { position: absolute; inset: -20px; width: calc(100% + 40px); height: calc(100% + 40px); object-fit: cover; filter: blur(18px) brightness(.62) saturate(1.2); opacity: .7; }
.detail-media .detail-main { position: relative; z-index: 1; max-width: 100%; max-height: 100%; width: 100%; height: 100%; object-fit: contain; }
.detail-meta { display: grid; gap: 7px; }
.detail-meta .seller-line { pointer-events: auto; }
.detail-meta h2 { margin: 4px 0 0; font-size: clamp(24px, 7vw, 34px); line-height: 1.02; letter-spacing: -.05em; }
.detail-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin: 14px 0 4px; }
.detail-actions .primary, .detail-actions .soft { width: 100%; text-align: center; }
.story-pill.add-story .story-ring { background: rgba(255,255,255,.14); border: 1px dashed rgba(255,255,255,.28); display: grid; place-items: center; color: #fff; font-size: 24px; font-weight: 900; }
.story-pill.add-story .story-ring::before { content: "+"; }

.notification-list { display: grid; gap: 10px; }
.notification-card { display: grid; grid-template-columns: 44px 1fr auto; gap: 10px; align-items: center; padding: 11px; border-radius: 20px; background: rgba(255,255,255,.08); border: 1px solid var(--line); }
.notification-card .notif-icon { width: 44px; height: 44px; border-radius: 16px; display: grid; place-items: center; background: linear-gradient(135deg, rgba(24,243,238,.20), rgba(255,47,126,.20)); }
.notification-card strong { display: block; }
.notification-card small { color: var(--muted); }
.notification-card b { color: var(--cyan); font-size: 18px; }

.profile-hero { display: grid; grid-template-columns: 90px 1fr; gap: 14px; align-items: center; padding: 12px; border-radius: 26px; background: rgba(255,255,255,.08); border: 1px solid var(--line); }
.profile-hero .avatar-wrap { width: 90px; height: 90px; border-radius: 28px; }
.profile-hero .avatar-wrap img { border-radius: 26px; }
.profile-hero strong { display: block; font-size: 20px; letter-spacing: -.03em; }
.profile-hero span, .profile-hero p { color: var(--muted); font-size: 13px; margin: 2px 0 0; }
.profile-actions { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0; }
.profile-actions a, .profile-actions button { flex: 1 0 auto; }
.inside-list { display: grid; gap: 10px; }
.inside-card { width: 100%; display: grid; grid-template-columns: 58px 1fr auto; gap: 10px; align-items: center; text-align: left; padding: 10px; border-radius: 20px; background: rgba(255,255,255,.08); border: 1px solid var(--line); }
.inside-card img { width: 58px; height: 58px; object-fit: cover; border-radius: 16px; }
.inside-card strong { display: block; }
.inside-card small { color: var(--muted); }
.inside-card svg { width: 18px; height: 18px; color: var(--cyan); }

.live-card { background: #030507; }
.live-lobby-grid { display: grid; gap: 12px; }
.live-tile { width: 100%; display: grid; grid-template-columns: 64px 1fr auto; gap: 10px; align-items: center; padding: 10px; border-radius: 22px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); text-align: left; }
.live-tile img { width: 64px; height: 64px; object-fit: cover; border-radius: 18px; background: #091a1f; }
.live-tile small { color: var(--muted); }
.live-room { position: relative; border-radius: 26px; overflow: hidden; background: #000; min-height: min(68dvh, 640px); border: 1px solid rgba(255,255,255,.14); }
.live-video { width: 100%; height: min(68dvh, 640px); object-fit: contain; background: #000; }
.live-wait { position: absolute; inset: 0; display: grid; place-items: center; padding: 28px; text-align: center; background: radial-gradient(circle at top, rgba(24,243,238,.14), rgba(0,0,0,.86)); }
.live-top { position: absolute; z-index: 4; inset: 10px 10px auto 10px; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.live-pill { border-radius: 999px; padding: 8px 11px; background: rgba(0,0,0,.58); border: 1px solid rgba(255,255,255,.13); font-size: 12px; font-weight: 900; backdrop-filter: blur(12px); }
.live-comments { position: absolute; left: 10px; right: 70px; bottom: 72px; z-index: 5; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; max-height: 45%; pointer-events: none; }
.live-comment { width: max-content; max-width: 100%; padding: 8px 11px; border-radius: 16px; background: rgba(0,0,0,.55); border: 1px solid rgba(255,255,255,.12); animation: floatUp 5.2s ease forwards; font-size: 13px; }
.live-comment b { color: var(--cyan); }
@keyframes floatUp { 0% { transform: translateY(20px); opacity: 0; } 10% { transform: translateY(0); opacity: 1; } 82% { opacity: 1; } 100% { transform: translateY(-26px); opacity: .32; } }
.live-input { position: absolute; z-index: 6; left: 10px; right: 10px; bottom: 10px; display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.live-input input { background: rgba(0,0,0,.58); }
.live-side { position: absolute; z-index: 6; right: 10px; bottom: 74px; display: grid; gap: 8px; }
.live-side button { width: 54px; height: 54px; border-radius: 999px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.14); font-size: 12px; font-weight: 900; }
.live-side .get-small { background: linear-gradient(135deg, var(--cyan), var(--pink)); }
.host-controls { display: grid; gap: 10px; margin-top: 12px; }

@media (max-width: 420px) {
  .phone { width: 100vw; }
  .top-row { grid-template-columns: auto minmax(118px, 1fr) 40px 40px; gap: 6px; }
  .brand { min-width: 92px; grid-template-columns: 28px auto; font-size: 13px; }
  .brand img { width: 28px; height: 28px; }
  .feed-tabs { max-width: 150px; gap: 3px; padding: 3px; }
  .feed-tabs button { padding: 7px 7px; font-size: 11px; }
  .area-chip { max-width: 53%; }
  .ghost-dot b { display: none; }
  .ghost-dot { width: 42px; justify-content: center; padding: 0; }
  .card-info { left: 14px; right: 78px; bottom: calc(78px + var(--safe-bottom)); }
  .seller-line .seller-name { max-width: 145px; }
  .card-info h1 { font-size: clamp(24px, 7.8vw, 34px); max-height: 72px; }
  .card-info p { font-size: 13px; max-height: 52px; }
  .action { width: 50px; min-height: 50px; }
  .post-fields { grid-template-columns: 1fr; }
  .dir-card { grid-template-columns: 58px 1fr; }
  .avatar-wrap { width: 58px; height: 58px; border-radius: 20px; }
  .dir-actions { grid-column: 1 / -1; justify-content: end; }
}

/* v10: ViConnects rebrand, polished marketplace chrome, chat, share and showroom */
.topbar { padding: calc(8px + env(safe-area-inset-top)) 11px 0; gap: 7px; background: linear-gradient(180deg, rgba(0,0,0,.86), rgba(0,0,0,.42) 62%, rgba(0,0,0,0)); }
.top-row { grid-template-columns: minmax(82px, 100px) minmax(168px, 1fr) 40px 40px; gap: 6px; }
.brand { min-width: 0; font-size: 13px; letter-spacing: -.04em; }
.brand img { width: 29px; height: 29px; }
.feed-tabs { width: min(51vw, 226px); max-width: none; gap: 3px; padding: 3px 6px; background: rgba(4,7,9,.44); border-color: rgba(255,255,255,.16); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 26px rgba(0,0,0,.18); }
.feed-tabs button { flex: 1 1 0; padding: 8px 3px 10px; font-size: 12px; font-weight: 920; letter-spacing: -.02em; overflow: visible; }
.feed-tabs button.active { background: transparent; box-shadow: none; }
.feed-tabs button.active::after { content: ""; position: absolute; left: 50%; bottom: 3px; width: 22px; height: 3px; border-radius: 999px; transform: translateX(-50%); background: #fff; box-shadow: 0 0 10px rgba(255,255,255,.55); }
.location-row { gap: 7px; }
.area-chip { max-width: 45%; height: 42px; background: rgba(255,255,255,.13); }
.ghost-dot { min-width: 42px; }
.story-strip { top: calc(106px + env(safe-area-inset-top)); padding: 7px 12px 8px; gap: 10px; background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,0)); }
.story-pill { width: 62px; }
.story-pill .story-ring { width: 54px; height: 54px; box-shadow: 0 10px 24px rgba(0,0,0,.28), 0 0 0 1px rgba(255,255,255,.10); }
.story-pill span { max-width: 62px; font-size: 9.5px; }
.media-wrap.loading::before { animation: mediaPulse 1.1s ease-in-out infinite alternate; }
@keyframes mediaPulse { from { filter: brightness(.75); } to { filter: brightness(1.05); } }
.media-wrap.photo .media-main { opacity: 0; transition: opacity .22s ease, transform .22s ease; }
.media-wrap.photo.loaded .media-main { opacity: 1; }
.media-wrap.photo.portrait .media-main { object-fit: cover; object-position: center; }
.media-wrap.photo.landscape .media-main { object-fit: contain; object-position: center; width: 100%; height: 100%; padding: 0; }
.media-wrap.photo.squareish .media-main { object-fit: contain; object-position: center; }
.media-wrap.photo .media-bg { filter: blur(22px) saturate(1.12) brightness(.62); opacity: .92; }
.card-info { gap: 7px; right: 82px; bottom: calc(80px + var(--safe-bottom)); }
.card-info h1 { font-size: clamp(26px, 7vw, 34px); line-height: 1.01; max-height: 70px; text-wrap: balance; }
.card-info p { font-size: 13.5px; line-height: 1.32; color: rgba(255,255,255,.92); max-height: 55px; }
.badge-line { max-height: 34px; }
.action-rail { gap: 9px; right: 9px; }
.action { background: rgba(3,5,7,.58); border-color: rgba(255,255,255,.16); }
.action b { font-size: 8px; }
.bottom-nav { background: rgba(2,4,7,.92); border-radius: 26px; }
.upload-box.processing::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent); animation: shimmer 1s linear infinite; }
@keyframes shimmer { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
.chat-card { background: rgba(4,7,10,.985); }
.chat-product { display: grid; grid-template-columns: 52px 1fr; gap: 10px; align-items: center; padding: 10px; margin-bottom: 10px; border-radius: 20px; background: rgba(255,255,255,.075); border: 1px solid var(--line); }
.chat-product:empty { display: none; }
.chat-product img { width: 52px; height: 52px; border-radius: 16px; object-fit: cover; background: #0b151b; }
.chat-product b { display: block; }
.chat-product small { color: var(--muted); }
.chat-messages { min-height: 48dvh; max-height: 58dvh; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding: 6px 2px 12px; }
.chat-bubble { max-width: 82%; align-self: flex-start; padding: 9px 11px; border-radius: 18px 18px 18px 6px; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.10); }
.chat-bubble.mine { align-self: flex-end; border-radius: 18px 18px 6px 18px; background: linear-gradient(135deg, rgba(24,243,238,.88), rgba(255,47,126,.78)); color: #fff; border: 0; }
.chat-bubble b { display: block; font-size: 10px; opacity: .78; margin-bottom: 2px; }
.chat-bubble span { font-size: 14px; line-height: 1.3; }
.chat-input { position: sticky; bottom: 0; display: grid; grid-template-columns: 1fr auto; gap: 8px; padding-top: 8px; background: linear-gradient(180deg, rgba(4,7,10,0), rgba(4,7,10,.98) 18%); }
.chat-input .primary { padding-left: 18px; padding-right: 18px; }
.showroom-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 10px; }
.show-item { position: relative; min-height: 136px; border: 0; padding: 0; border-radius: 18px; overflow: hidden; background: rgba(255,255,255,.08); text-align: left; box-shadow: inset 0 0 0 1px rgba(255,255,255,.10); }
.show-item img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #101820; }
.show-item::after { content: ""; position: absolute; inset: 45% 0 0; background: linear-gradient(180deg, transparent, rgba(0,0,0,.78)); }
.show-item b { position: absolute; z-index: 2; left: 8px; right: 8px; bottom: 8px; font-size: 11px; line-height: 1.1; text-shadow: 0 2px 8px #000; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.show-price { position: absolute; z-index: 2; left: 7px; top: 7px; max-width: calc(100% - 14px); padding: 4px 7px; border-radius: 999px; background: rgba(0,0,0,.54); border: 1px solid rgba(255,255,255,.14); font-size: 9.5px; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.detail-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 420px) {
  .top-row { grid-template-columns: 84px minmax(160px, 1fr) 39px 39px; gap: 5px; }
  .brand { grid-template-columns: 26px auto; font-size: 12px; }
  .brand img { width: 26px; height: 26px; }
  .feed-tabs { width: min(52vw, 198px); max-width: none; gap: 2px; }
  .feed-tabs button { font-size: 11.2px; padding-left: 2px; padding-right: 2px; }
  .area-chip { max-width: 48%; }
  .showroom-grid { grid-template-columns: repeat(2, 1fr); }
  .show-item { min-height: 150px; }
}
.feed-tabs button { position: relative; }

/* v10: internal chat, editable AI post, cleaner TikTok-style media */
.media-wrap.photo .media-main,
.media-wrap.photo.portrait .media-main,
.media-wrap.photo.landscape .media-main,
.media-wrap.photo.squareish .media-main {
  object-fit: contain !important;
  object-position: center center !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
}
.media-wrap.photo.loaded .media-main { background: transparent; }
.media-wrap.photo .media-bg { transform: scale(1.08); }
.top-row { grid-template-columns: minmax(86px, 104px) minmax(172px, 1fr) 40px 40px; }
.feed-tabs { border-radius: 999px; height: 42px; align-items: center; justify-content: center; }
.feed-tabs button { position: relative; white-space: nowrap; line-height: 1; }
.feed-tabs button.active { color: #fff; font-weight: 980; }
.story-strip { backdrop-filter: blur(1px); }
.hero-upload { min-height: 250px; margin-top: 10px; border-radius: 30px; background: radial-gradient(circle at 18% 12%, rgba(24,243,238,.18), transparent 34%), rgba(255,255,255,.055); }
.hero-upload img { max-height: 410px; object-fit: contain; }
.smart-edit-grid { display: grid; gap: 10px; margin: 12px 0; }
.smart-edit-grid input, .smart-edit-grid textarea, .extra-notes { background: rgba(255,255,255,.075); border-color: rgba(255,255,255,.14); }
.smart-edit-grid #postDescription { min-height: 92px; }
.post-fields { margin-top: 10px; }
.ai-card { background: linear-gradient(135deg, rgba(24,243,238,.10), rgba(255,47,126,.065)); }
.time-badge { text-transform: none; letter-spacing: 0; color: rgba(255,255,255,.78); background: rgba(0,0,0,.32); }
.chat-bubble time { display: block; margin-top: 4px; font-size: 10px; opacity: .72; text-align: right; }
.chat-product small::after { content: " · inside ViConnects"; opacity: .72; }
.profile-switches { display: grid; gap: 10px; margin: 12px 0 14px; }
.profile-switches label { display: flex; align-items: center; gap: 10px; padding: 12px 13px; border-radius: 18px; background: rgba(255,255,255,.075); border: 1px solid var(--line); font-size: 13px; font-weight: 850; }
.profile-switches input { width: 18px; height: 18px; accent-color: var(--cyan); padding: 0; border-radius: 6px; }
#meSheet input, #meSheet textarea { margin-top: 10px; }
#meSheet .profile-editor-avatar + input { margin-top: 14px; }
.showroom-head { display: flex; align-items: end; justify-content: space-between; gap: 10px; margin-top: 14px; }
.showroom-head h3 { margin: 0; }
.showroom-head small { color: var(--muted); font-weight: 800; }
.show-item img { object-fit: cover; }
.show-item time { position: absolute; z-index: 2; right: 7px; top: 7px; padding: 4px 6px; border-radius: 999px; background: rgba(0,0,0,.48); font-size: 9px; font-weight: 900; color: rgba(255,255,255,.88); }
.detail-actions .soft { display: grid; place-items: center; min-height: 46px; border-radius: 16px; background: rgba(255,255,255,.09); border: 1px solid var(--line); font-weight: 850; }
.action-rail { bottom: calc(76px + var(--safe-bottom)); gap: 7px; }
.action { width: 49px; min-height: 49px; }
.action b { font-size: 8px; }
@media (max-width: 420px) {
  .top-row { grid-template-columns: 88px minmax(166px, 1fr) 39px 39px; }
  .feed-tabs { width: min(53vw, 206px); }
  .feed-tabs button { font-size: 10.6px; padding-left: 1px; padding-right: 1px; }
  .story-strip { top: calc(104px + env(safe-area-inset-top)); }
  .hero-upload { min-height: 230px; }
  .card-info { right: 74px; bottom: calc(78px + var(--safe-bottom)); }
  .action { width: 47px; min-height: 47px; }
}

/* v11: inbox-first chat, 24h messages, cleaner SmartPost draft */
.mode-toggle.three { grid-template-columns: repeat(3, 1fr); }
.mode-toggle.three button { font-size: 11px; padding-inline: 6px; white-space: nowrap; }
.compact-post { grid-template-columns: 1fr 128px; }
.compact-post input { min-width: 0; }
.draft-editor { display: grid; gap: 7px; margin: 10px 0 12px; border: 1px solid rgba(255,255,255,.12); }
.draft-editor strong,
.draft-editor small,
.draft-editor p { outline: none; border-radius: 12px; padding: 6px 8px; }
.draft-editor strong:focus,
.draft-editor small:focus,
.draft-editor p:focus { background: rgba(255,255,255,.10); box-shadow: inset 0 0 0 1px rgba(24,243,238,.40); }
.draft-editor small { width: fit-content; max-width: 100%; color: var(--cyan); background: rgba(24,243,238,.08); border: 1px solid rgba(24,243,238,.18); font-weight: 950; }
.draft-editor p { margin: 0; color: rgba(255,255,255,.86); line-height: 1.35; min-height: 44px; }
.post-errors { margin: 10px 0; padding: 10px 12px; border-radius: 18px; background: rgba(255,47,126,.16); border: 1px solid rgba(255,47,126,.30); color: #fff; }
.post-errors strong { display: block; margin-bottom: 5px; }
.post-errors ul { margin: 0; padding-left: 18px; }
.post-errors li { margin: 2px 0; font-size: 12px; }
.inbox-card { background: rgba(4,7,10,.985); }
.inbox-list { display: grid; gap: 8px; max-height: 70dvh; overflow-y: auto; padding-bottom: 8px; }
.inbox-item { display: grid; grid-template-columns: 54px 1fr auto; gap: 10px; align-items: center; text-align: left; width: 100%; padding: 10px; border-radius: 22px; background: rgba(255,255,255,.075); border: 1px solid var(--line); color: #fff; }
.inbox-item.unread { background: linear-gradient(135deg, rgba(24,243,238,.16), rgba(255,47,126,.11)); border-color: rgba(24,243,238,.34); }
.inbox-item img { width: 54px; height: 54px; border-radius: 18px; object-fit: cover; background: #0b151b; }
.inbox-item strong { display: block; font-size: 14px; }
.inbox-item small { display: block; color: var(--cyan); font-weight: 850; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.inbox-item em { display: block; color: var(--muted); font-style: normal; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 205px; }
.inbox-item b { min-width: 28px; height: 28px; border-radius: 999px; display: grid; place-items: center; padding: 0 8px; background: rgba(255,255,255,.10); color: #fff; font-size: 11px; }
.inbox-item.unread b { background: var(--pink); }
.chat-expire { display: block; margin: -4px 0 8px; color: var(--muted); font-weight: 750; }
.chat-input { grid-template-columns: auto 1fr auto; align-items: center; }
.attach-btn { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 15px; background: rgba(255,255,255,.09); border: 1px solid var(--line); color: #fff; cursor: pointer; }
.attach-btn svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.chat-image-preview { display: flex; align-items: center; gap: 8px; margin: 6px 0; padding: 8px; border-radius: 18px; background: rgba(255,255,255,.07); border: 1px solid var(--line); }
.chat-image-preview img { width: 64px; height: 64px; object-fit: cover; border-radius: 14px; }
.chat-image-preview button { width: 34px; height: 34px; border-radius: 50%; border: 0; background: rgba(255,47,126,.92); color: #fff; font-weight: 950; }
.chat-bubble .chat-img { display: block; width: min(230px, 62vw); max-height: 260px; object-fit: contain; border-radius: 14px; margin: 2px 0 6px; background: rgba(0,0,0,.22); }
.chat-bubble.mine .chat-img { background: rgba(255,255,255,.18); }
.action.chat b { font-size: 7.8px; }
.media-wrap.photo .media-main,
.media-wrap.photo.portrait .media-main,
.media-wrap.photo.landscape .media-main,
.media-wrap.photo.squareish .media-main { object-fit: contain !important; }
.media-wrap.photo::after { background: linear-gradient(180deg, rgba(0,0,0,.48) 0, rgba(0,0,0,.04) 22%, rgba(0,0,0,.02) 58%, rgba(0,0,0,.72) 82%, rgba(0,0,0,.96) 100%); }
@media (max-width: 420px) {
  .compact-post { grid-template-columns: 1fr; }
  .mode-toggle.three button { font-size: 10px; }
  .inbox-item { grid-template-columns: 48px 1fr auto; }
  .inbox-item img { width: 48px; height: 48px; }
}

/* v12: HD Live Sale, true online presence, realtime owner requests and polished notifications */
.toast {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(7,13,18,.96), rgba(15,25,30,.94));
  border: 1px solid rgba(24,243,238,.20);
  box-shadow: 0 18px 46px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.10);
  backdrop-filter: blur(18px);
}
.toast b { font-size: 13px; line-height: 1.25; }
.toast-dot { width: 11px; height: 11px; border-radius: 50%; flex: 0 0 auto; background: var(--cyan); box-shadow: 0 0 18px rgba(24,243,238,.85); }
.toast.booking .toast-dot { background: var(--pink); box-shadow: 0 0 18px rgba(255,47,126,.85); }
.toast.chat .toast-dot { background: var(--green); box-shadow: 0 0 18px rgba(37,238,151,.85); }
.notification-card.seen { opacity: .84; }
.notif-badge { min-width: 18px; height: 18px; font-size: 10px; right: 2px; top: 2px; }
.seller-line .online-dot:empty,
.avatar-wrap .online-dot:empty { display: block; }
.seller-line i:not(.online-dot),
.avatar-wrap i:not(.online-dot) { display: none; }
.live-card { background: rgba(2,4,7,.99); }
.live-room {
  min-height: min(78dvh, 760px);
  border-radius: 30px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 22px 70px rgba(0,0,0,.35);
}
.live-room:fullscreen { width: 100vw; height: 100vh; border-radius: 0; }
.live-room:fullscreen .live-video { height: 100vh; }
.live-video { height: min(78dvh, 760px); object-fit: contain; image-rendering: auto; }
.live-top { align-items: center; justify-content: flex-start; flex-wrap: wrap; }
.live-pill.live-red { background: linear-gradient(135deg, rgba(255,47,126,.95), rgba(255,47,126,.45)); border-color: rgba(255,255,255,.24); }
.live-pill.host-online::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px rgba(37,238,151,.85); vertical-align: middle; }
.live-side button svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.live-comments { right: 82px; bottom: 78px; max-height: 52%; gap: 7px; }
.live-comment { display: grid; grid-template-columns: auto 1fr auto; gap: 6px; align-items: center; width: fit-content; max-width: 100%; padding: 8px 10px; border-radius: 18px; background: rgba(0,0,0,.48); backdrop-filter: blur(12px); }
.live-comment span { color: #fff; }
.live-comment time { color: rgba(255,255,255,.58); font-size: 10px; }
.live-input input { background: rgba(0,0,0,.54); border-color: rgba(255,255,255,.16); }
.live-input .primary { min-height: 44px; padding-inline: 16px; }
.media-wrap.photo .media-main { max-width: 100%; max-height: 100%; }
.media-wrap.photo .media-bg { opacity: .74; }
.ghost-dot:not(.is-active) { opacity: .82; }

/* v13: owner-safe actions, sticky inbox chat, read receipts, live stop, stronger cache-busting UI */
.floating-live {
  position: absolute;
  z-index: 72;
  right: 12px;
  bottom: calc(96px + var(--safe-bottom));
  width: 58px;
  min-height: 58px;
  border-radius: 22px;
  display: grid;
  place-items: center;
  gap: 2px;
  padding: 7px 5px;
  background: linear-gradient(135deg, rgba(255,47,126,.95), rgba(24,243,238,.72));
  border: 1px solid rgba(255,255,255,.23);
  box-shadow: 0 18px 42px rgba(0,0,0,.42), 0 0 24px rgba(255,47,126,.24);
  color: #fff;
  font-weight: 950;
}
.floating-live svg { width: 22px; height: 22px; }
.floating-live span { font-size: 10px; line-height: 1; }
.directory:not(.hidden) ~ .floating-live { display: none; }
.chat-card { padding-top: 0 !important; overflow: hidden; }
.chat-sticky-head {
  position: sticky;
  top: 0;
  z-index: 5;
  margin: 0 -2px 8px;
  padding: 10px 0 10px;
  background: linear-gradient(180deg, rgba(4,7,10,1), rgba(4,7,10,.94));
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.chat-sticky-head em { display: block; margin-top: 2px; color: rgba(255,255,255,.60); font-style: normal; font-size: 11px; font-weight: 750; }
.chat-bubble .ticks { margin-left: 5px; color: rgba(255,255,255,.62); font-style: normal; font-weight: 950; letter-spacing: -2px; }
.chat-bubble .ticks.read { color: #29b7ff; text-shadow: 0 0 12px rgba(41,183,255,.55); }
.notification-card.unread { background: linear-gradient(135deg, rgba(24,243,238,.17), rgba(255,47,126,.10)); border-color: rgba(24,243,238,.40); box-shadow: inset 0 1px 0 rgba(255,255,255,.10); }
.notification-card.unread b { min-width: 36px; height: 24px; border-radius: 999px; display: grid; place-items: center; background: var(--pink); color: #fff; font-size: 9px; }
.notification-card.seen { background: rgba(255,255,255,.055); opacity: .72; }
.stop-live { background: rgba(255,47,126,.92) !important; color: #fff; display: grid !important; place-items: center; line-height: 1; }
.stop-live b { display: block; font-size: 9px; margin-top: 1px; }
.action.owner-inbox span { background: rgba(24,243,238,.18); }
.media-wrap.photo .media-main,
.detail-main,
.hero-upload img,
.show-item img { image-rendering: auto; }
@media (max-width: 420px) {
  .floating-live { right: 10px; bottom: calc(92px + var(--safe-bottom)); width: 54px; min-height: 54px; border-radius: 20px; }
}


/* v14: Live button lives inside the same vertical action rail.
   Only the active reel shows its rail, so the buttons stay in one stable place while scrolling. */
.floating-live { display: none !important; }
.reel-card .action-rail {
  opacity: 0;
  pointer-events: none;
  transform: translate3d(8px,0,0) scale(.985);
  transition: opacity .16s ease, transform .16s ease;
}
.reel-card.is-active .action-rail {
  position: fixed;
  right: max(10px, calc((100vw - min(100vw, 460px)) / 2 + 10px));
  bottom: calc(86px + var(--safe-bottom));
  z-index: 74;
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0,0,0) scale(1);
  gap: 8px;
}
.reel-card.is-active .action {
  width: 50px;
  min-height: 50px;
  border-radius: 50%;
}
.reel-card.is-active .action.live {
  background: linear-gradient(145deg, rgba(255,47,126,.96), rgba(24,243,238,.90));
  box-shadow: 0 12px 28px rgba(255,47,126,.20), 0 0 18px rgba(24,243,238,.18);
}
.reel-card.is-active .action.live b { color: #fff; }
.reel-card:not(.is-active) .action-rail button,
.reel-card:not(.is-active) .action-rail a { pointer-events: none; }
@media (max-height: 680px) {
  .reel-card.is-active .action-rail { gap: 6px; bottom: calc(82px + var(--safe-bottom)); }
  .reel-card.is-active .action { width: 46px; min-height: 46px; padding: 5px 2px; }
  .reel-card.is-active .action svg { width: 19px; height: 19px; }
  .reel-card.is-active .action b { font-size: 7.9px; }
}

/* v15 Innovation Suite: ViRadar, Wanted Board, TrustPass, Reserve and Delivery */
.vi-radar-bar {
  display: grid;
  grid-template-columns: 1.15fr 1fr .9fr;
  gap: 8px;
  padding: 0 14px 10px;
  margin-top: -2px;
}
.vi-radar-bar button {
  appearance: none;
  border: 1px solid rgba(255,255,255,.16);
  background: linear-gradient(150deg, rgba(255,255,255,.13), rgba(255,255,255,.055));
  color: #fff;
  border-radius: 19px;
  min-height: 50px;
  padding: 8px 9px;
  display: grid;
  grid-template-columns: 24px 1fr;
  column-gap: 6px;
  align-items: center;
  text-align: left;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 12px 32px rgba(0,0,0,.24);
  backdrop-filter: blur(16px);
}
.vi-radar-bar button span { grid-row: span 2; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: rgba(24,243,238,.14); }
.vi-radar-bar button b { font-size: 12px; line-height: 1; font-weight: 950; letter-spacing: -.03em; }
.vi-radar-bar button small { font-size: 9px; color: rgba(255,255,255,.68); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vi-radar-bar.has-live #radarOpen span { animation: pulseDot 1.4s infinite; }
@keyframes pulseDot { 0%,100% { box-shadow: 0 0 0 rgba(24,243,238,0); } 50% { box-shadow: 0 0 0 8px rgba(24,243,238,.10); } }
.radar-card .sheet-title h3 { background: linear-gradient(120deg, #fff, #18f3ee, #ff2f7e); -webkit-background-clip: text; color: transparent; }
.radar-body { display: grid; gap: 14px; }
.radar-hero, .ai-answer, .price-radar-box, .trust-mini, .profile-trust-card, .profile-qr {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(145deg, rgba(24,243,238,.10), rgba(255,47,126,.07));
  border-radius: 20px;
  padding: 12px;
}
.radar-hero span, .price-radar-box > span, .trust-mini > span, .profile-trust-card > span { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; border-radius: 16px; background: rgba(255,255,255,.10); }
.price-radar-box svg, .trust-mini svg, .profile-trust-card svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.radar-hero strong, .price-radar-box b, .trust-mini b, .profile-trust-card b { display:block; font-size: 14px; font-weight: 950; }
.radar-hero small, .price-radar-box small, .trust-mini small, .profile-trust-card small, .profile-qr small { display:block; margin-top:2px; color: rgba(255,255,255,.66); font-size: 11px; line-height: 1.25; word-break: break-word; }
.radar-stats { display:grid; grid-template-columns: repeat(4, 1fr); gap: 7px; }
.radar-stat { border: 1px solid rgba(255,255,255,.13); background: rgba(255,255,255,.07); color: #fff; border-radius: 18px; padding: 8px 4px; display:grid; place-items:center; gap: 2px; }
.radar-stat svg { width: 19px; height: 19px; fill:none; stroke:currentColor; stroke-width:2.3; stroke-linecap:round; stroke-linejoin:round; }
.radar-stat b { font-size: 16px; font-weight: 1000; }
.radar-stat small { font-size: 8.5px; color: rgba(255,255,255,.64); }
.radar-section { display:grid; gap: 8px; }
.radar-section h4 { margin:0; font-size: 13px; letter-spacing: -.02em; }
.wanted-mini { border:1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.06); color:#fff; border-radius: 16px; padding: 10px; text-align:left; }
.wanted-mini b, .wanted-mini small { display:block; }
.wanted-mini small { color: rgba(255,255,255,.66); margin-top: 3px; }
.request-options { display:grid; gap: 9px; margin: 8px 0 12px; }
.request-options label { display:flex; align-items:center; gap: 8px; background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); border-radius: 15px; padding: 10px; font-weight: 850; }
.request-options input[type="text"], .request-options input:not([type]) { width:100%; }
.price-radar-box.good_deal { border-color: rgba(40,255,166,.36); background: linear-gradient(145deg, rgba(40,255,166,.14), rgba(24,243,238,.08)); }
.price-radar-box.high_price { border-color: rgba(255,190,87,.36); background: linear-gradient(145deg, rgba(255,190,87,.14), rgba(255,47,126,.08)); }
.profile-qr { display:block; }
.profile-qr b { display:block; font-size: 12px; }
.trust-score { display:grid; place-items:center; gap: 5px; padding: 16px; border-radius: 22px; border:1px solid rgba(255,255,255,.14); background: radial-gradient(circle at 50% 0, rgba(24,243,238,.18), rgba(255,255,255,.05)); }
.trust-score svg { width: 36px; height: 36px; fill:none; stroke:currentColor; stroke-width:2.2; }
.trust-score b { font-size: 44px; line-height: .95; }
.trust-score small { text-transform: uppercase; letter-spacing: .18em; color: rgba(255,255,255,.68); }
.ai-answer { margin-bottom: 10px; }
.ai-answer svg { width: 22px; height: 22px; fill:none; stroke:currentColor; stroke-width:2.2; }
@media (max-width: 390px) {
  .vi-radar-bar { grid-template-columns: 1fr 1fr; }
  .vi-radar-bar #trustOpen { display:none; }
  .radar-stats { grid-template-columns: repeat(2, 1fr); }
}

/* v17: polish pass for innovation cards, story spacing, bottom nav, compact requests and QR cards */
.topbar {
  gap: 7px;
  padding-left: 10px;
  padding-right: 10px;
}
.vi-radar-bar {
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
  padding: 0 4px 8px;
  margin-top: 0;
}
.vi-radar-bar button {
  min-height: 46px;
  border-radius: 18px;
  padding: 8px 8px;
  grid-template-columns: 22px 1fr;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 8px 24px rgba(0,0,0,.22);
}
.vi-radar-bar button span {
  width: 22px;
  height: 22px;
  font-size: 14px;
}
.vi-radar-bar button b { font-size: 11px; }
.vi-radar-bar button small { font-size: 8px; }
.story-strip {
  top: calc(170px + env(safe-area-inset-top));
  padding: 6px 12px 10px;
  background: linear-gradient(180deg, rgba(0,0,0,.34), rgba(0,0,0,.02));
  backdrop-filter: blur(3px);
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.story-pill { width: 64px; }
.story-pill .story-ring {
  width: 54px;
  height: 54px;
  box-shadow: 0 8px 24px rgba(0,0,0,.32), 0 0 0 1px rgba(255,255,255,.10);
}
.story-pill span {
  max-width: 64px;
  font-size: 9.5px;
  line-height: 1.1;
  padding: 0 2px;
}
.feed-tabs {
  max-width: 194px;
  gap: 4px;
  background: rgba(0,0,0,.36);
}
.feed-tabs button { font-size: 11.5px; padding-inline: 10px; }
.bottom-nav {
  height: 66px;
  left: 12px;
  right: 12px;
  bottom: calc(8px + var(--safe-bottom));
  border-radius: 28px;
  padding: 7px 10px;
  background: linear-gradient(180deg, rgba(6,8,12,.94), rgba(2,3,5,.92));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 18px 44px rgba(0,0,0,.40), inset 0 1px 0 rgba(255,255,255,.10);
}
.bottom-nav button {
  border-radius: 18px;
  min-height: 48px;
  transition: transform .16s ease, background .16s ease, color .16s ease;
}
.bottom-nav button.active:not(.post) {
  color: #fff;
  background: rgba(255,255,255,.10);
}
.bottom-nav button:active { transform: scale(.96); }
.bottom-nav .post {
  width: 68px;
  height: 46px;
  border-radius: 18px;
  box-shadow: -5px 0 0 var(--cyan), 5px 0 0 var(--pink), 0 14px 30px rgba(0,0,0,.25);
}
.wanted-card {
  display: grid;
  gap: 12px;
  padding-left: 18px;
  padding-right: 18px;
}
.wanted-card .sheet-title { margin-bottom: 2px; }
.wanted-card .muted { margin: 0 0 2px; }
.wanted-card textarea,
.wanted-card input {
  margin: 0;
  min-height: 52px;
  border-radius: 20px;
  background: rgba(255,255,255,.085);
}
.wanted-card textarea { min-height: 118px; }
.request-options {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
}
.request-options label.mini-option {
  min-height: 46px;
  border-radius: 18px;
  justify-content: center;
  font-size: 13px;
  background: rgba(255,255,255,.075);
}
.request-options label.mini-option:has(input:checked) {
  background: linear-gradient(135deg, rgba(24,243,238,.22), rgba(255,47,126,.20));
  border-color: rgba(24,243,238,.32);
}
.request-options input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--cyan); }
.request-options .deposit-input,
.request-options #bookingDeliveryArea {
  grid-column: 1 / -1;
  min-height: 48px;
  border-radius: 18px;
}
.profile-qr {
  display: grid;
  grid-template-columns: 92px 1fr;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(255,255,255,.09), rgba(24,243,238,.065));
}
.qr-wrap {
  position: relative;
  width: 92px;
  height: 92px;
  border-radius: 22px;
  background: #fff;
  padding: 6px;
  display: grid;
  place-items: center;
  overflow: hidden;
}
.qr-wrap > img:first-child { width: 100%; height: 100%; object-fit: contain; border-radius: 14px; }
.qr-logo {
  position: absolute;
  width: 30px;
  height: 30px;
  border-radius: 10px;
  padding: 3px;
  background: #081015;
  box-shadow: 0 0 0 3px #fff, 0 4px 12px rgba(0,0,0,.24);
}
.profile-qr b { font-size: 13px; }
.profile-qr small { font-size: 11px; color: rgba(255,255,255,.67); }
.profile-qr button { margin-top: 8px; padding: 9px 12px; border-radius: 999px; background: rgba(255,255,255,.10); border: 1px solid var(--line); font-weight: 900; }
.live-side .stop-live,
.host-controls #endHostLive {
  background: linear-gradient(135deg, rgba(255,47,126,.95), rgba(255,87,87,.78)) !important;
  color: #fff !important;
}
.live-side button[disabled], .host-controls button[disabled] { opacity: .55; pointer-events: none; }
@media (max-width: 390px) {
  .vi-radar-bar { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .vi-radar-bar #trustOpen { display: grid; }
  .vi-radar-bar button { min-height: 44px; padding: 7px 6px; grid-template-columns: 20px 1fr; }
  .vi-radar-bar button span { width: 20px; height: 20px; }
  .vi-radar-bar button b { font-size: 10px; }
  .vi-radar-bar button small { display: none; }
  .story-strip { top: calc(164px + env(safe-area-inset-top)); }
  .feed-tabs { max-width: 166px; }
  .feed-tabs button { font-size: 10.5px; padding-inline: 7px; }
}
@media (max-height: 720px) {
  .story-strip { top: calc(158px + env(safe-area-inset-top)); }
  .vi-radar-bar button { min-height: 42px; }
}

/* v17: Services directory sits below the innovation header, Live owner controls, and Rwanda default polish */
.directory {
  padding-top: calc(208px + env(safe-area-inset-top));
  z-index: 36;
}
.directory .section-head {
  margin-top: 2px;
  padding-top: 4px;
}
.directory .section-head h2 {
  max-width: 320px;
  font-size: clamp(23px, 6.6vw, 31px);
  text-wrap: balance;
}
.live-now-list { display: grid; gap: 10px; }
.live-tile {
  cursor: pointer;
  border-radius: 24px;
  min-height: 78px;
  grid-template-columns: 64px 1fr auto;
  background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(24,243,238,.045));
}
.live-tile.mine-live {
  border-color: rgba(24,243,238,.38);
  background: linear-gradient(145deg, rgba(24,243,238,.16), rgba(255,47,126,.10));
}
.live-tile-actions {
  display: grid;
  gap: 6px;
  justify-items: end;
  align-items: center;
  min-width: 70px;
}
.live-tile-actions b {
  font-size: 10px;
  color: rgba(255,255,255,.72);
  text-transform: uppercase;
  letter-spacing: .08em;
}
.live-open-mini,
.live-resume-mini,
.live-stop-mini {
  min-width: 62px;
  min-height: 30px;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 950;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(255,255,255,.10);
  color: #fff;
}
.live-resume-mini,
.live-open-mini { background: linear-gradient(135deg, rgba(24,243,238,.75), rgba(255,47,126,.65)); border: 0; }
.live-stop-mini,
.soft.danger { background: rgba(255,47,126,.18); border-color: rgba(255,47,126,.38); color: #fff; }
.live-owner-banner {
  display: grid;
  gap: 8px;
  padding: 12px;
  border-radius: 22px;
  border: 1px solid rgba(24,243,238,.26);
  background: linear-gradient(145deg, rgba(24,243,238,.14), rgba(255,47,126,.07));
}
.live-owner-banner b { font-size: 14px; }
.live-owner-banner small { color: rgba(255,255,255,.68); }
.live-owner-banner div { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.live-side .stop-live {
  background: linear-gradient(135deg, rgba(255,47,126,.98), rgba(255,88,88,.84)) !important;
  color: #fff;
  box-shadow: 0 0 24px rgba(255,47,126,.22);
}
.area-chip span:empty::before { content: "Your Country"; }
@media (max-width: 390px) {
  .directory { padding-top: calc(196px + env(safe-area-inset-top)); }
  .directory .section-head h2 { font-size: 23px; }
  .live-tile { grid-template-columns: 58px 1fr; }
  .live-tile-actions { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; justify-items: stretch; }
  .live-tile-actions b { grid-column: 1 / -1; }
  .live-open-mini, .live-resume-mini, .live-stop-mini { width: 100%; }
}
@media (max-height: 720px) {
  .directory { padding-top: calc(188px + env(safe-area-inset-top)); }
}

/* v18 final polish: tighter Browse header, hidden directory headline, separated TrustPass + QR cards */
.directory {
  padding-top: calc(158px + env(safe-area-inset-top)) !important;
}
.directory .section-head {
  margin: 0 0 10px !important;
  padding: 0 !important;
  align-items: center;
}
.directory .section-head > div {
  min-height: 34px;
  display: grid;
  align-content: center;
}
.directory .section-head small {
  display: inline-flex;
  align-items: center;
  height: 20px;
  line-height: 1;
}
.directory .section-head h2,
.directory-main-title {
  display: none !important;
}
.directory .mini-btn {
  min-height: 42px;
  padding: 10px 18px;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10);
}
.directory .chips {
  margin-top: 0;
  padding-bottom: 10px;
}
.directory .inline-search {
  margin: 6px 0 12px;
}

#profileBody {
  display: grid;
  gap: 13px;
}
#profileBody .profile-actions {
  margin: 0;
}
#profileBody .profile-trust-card,
#profileBody .profile-qr,
#profileBody .profile-hero {
  margin: 0;
}
.profile-trust-card {
  min-height: 74px;
  padding: 14px !important;
  gap: 13px !important;
  align-items: center;
}
.profile-trust-card > div {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.profile-trust-card b {
  line-height: 1.1;
}
.profile-trust-card small {
  line-height: 1.35 !important;
}
.profile-qr {
  grid-template-columns: 104px minmax(0, 1fr) !important;
  gap: 15px !important;
  padding: 14px !important;
  align-items: center !important;
}
.qr-wrap {
  width: 104px !important;
  height: 104px !important;
  border-radius: 24px !important;
}
.profile-qr > span:last-child,
.profile-qr > div:last-child {
  min-width: 0;
  display: grid;
  gap: 8px;
  align-content: center;
}
.profile-qr b {
  font-size: 14px !important;
  line-height: 1.15;
  letter-spacing: -.02em;
}
.profile-qr small {
  display: block;
  max-width: 100%;
  line-height: 1.25 !important;
  word-break: break-all;
  overflow-wrap: anywhere;
  opacity: .78;
}
.profile-qr button {
  justify-self: start;
  margin-top: 0 !important;
  min-height: 36px;
  padding: 9px 16px !important;
  background: rgba(255,255,255,.13) !important;
}
.showroom-head {
  margin-top: 2px !important;
}

@media (max-width: 390px) {
  .directory { padding-top: calc(148px + env(safe-area-inset-top)) !important; }
  .directory .section-head > div { min-height: 30px; }
  .profile-qr { grid-template-columns: 92px minmax(0, 1fr) !important; gap: 12px !important; padding: 12px !important; }
  .qr-wrap { width: 92px !important; height: 92px !important; }
  .profile-qr b { font-size: 13px !important; }
  .profile-qr small { font-size: 10.5px !important; }
}
@media (max-height: 720px) {
  .directory { padding-top: calc(142px + env(safe-area-inset-top)) !important; }
}

/* v20: product management, sold/available state, multi-photo carousel, owner controls */
.media-wrap.carousel .media-main,
.media-wrap.carousel .media-bg { transition: opacity .28s ease, transform .28s ease; }
.media-dots { position: absolute; z-index: 4; left: 50%; bottom: calc(154px + var(--safe-bottom)); transform: translateX(-50%); display: flex; gap: 6px; padding: 6px 8px; border-radius: 999px; background: rgba(0,0,0,.28); border: 1px solid rgba(255,255,255,.10); backdrop-filter: blur(14px); }
.media-dots button { width: 7px; height: 7px; border-radius: 999px; padding: 0; background: rgba(255,255,255,.45); }
.media-dots button.active { width: 20px; background: linear-gradient(90deg, var(--cyan), var(--pink)); box-shadow: 0 0 12px rgba(24,243,238,.55); }
.badge.sold { background: rgba(255,47,126,.92); color: #fff; border-color: rgba(255,255,255,.16); box-shadow: 0 8px 22px rgba(255,47,126,.28); }
.badge.available { background: rgba(37,238,151,.16); color: #dfffee; border-color: rgba(37,238,151,.30); }
.badge.private { background: rgba(255,224,153,.14); color: #ffe7a8; border-color: rgba(255,224,153,.28); }
.owner-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 12px 0 8px; padding: 10px; border-radius: 22px; background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.10); }
.owner-tools .soft { min-height: 42px; border-radius: 16px; font-weight: 900; }
.owner-tools .danger { color: #fff; background: rgba(255,47,126,.20) !important; border-color: rgba(255,47,126,.35) !important; }
.owner-tools .ok { background: rgba(37,238,151,.14) !important; border-color: rgba(37,238,151,.28) !important; }
.action.owner-edit span { background: rgba(255,224,153,.16); }
.action.owner-status span { background: rgba(37,238,151,.14); }
.multi-preview { display: flex; align-items: center; gap: 8px; margin: -2px 0 10px; min-height: 48px; overflow-x: auto; scrollbar-width: none; }
.multi-preview::-webkit-scrollbar { display: none; }
.multi-preview.hidden { display: none; }
.post-thumb { position: relative; flex: 0 0 48px; width: 48px; height: 48px; border-radius: 15px; overflow: hidden; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.08); }
.post-thumb.active { box-shadow: 0 0 0 2px var(--cyan), 0 0 18px rgba(24,243,238,.28); }
.post-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.post-thumb b { position: absolute; right: 4px; bottom: 4px; min-width: 16px; height: 16px; display: grid; place-items: center; border-radius: 999px; background: rgba(0,0,0,.68); font-size: 9px; }
.multi-preview small { flex: 0 0 auto; color: var(--muted); font-size: 11px; font-weight: 850; }
.detail-media.has-gallery { margin-bottom: 8px; }
.photo-count { position: absolute; z-index: 3; right: 12px; top: 12px; padding: 6px 10px; border-radius: 999px; background: rgba(0,0,0,.42); border: 1px solid rgba(255,255,255,.14); font-size: 11px; font-weight: 900; backdrop-filter: blur(12px); }
.detail-thumbs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 0 0 12px; }
.detail-thumbs button { height: 70px; border-radius: 18px; overflow: hidden; padding: 0; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); }
.detail-thumbs button.active { border-color: var(--cyan); box-shadow: 0 0 0 2px rgba(24,243,238,.28); }
.detail-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.show-item.sold::after { content: "SOLD"; position: absolute; left: 8px; top: 8px; padding: 4px 7px; border-radius: 999px; background: rgba(255,47,126,.92); color: #fff; font-size: 9px; font-weight: 950; }
.show-sold { position: absolute; left: 7px; top: 7px; padding: 4px 7px; border-radius: 999px; background: rgba(255,47,126,.92); font-size: 9px; font-weight: 950; }
@media (max-width: 390px) {
  .media-dots { bottom: calc(146px + var(--safe-bottom)); }
  .owner-tools { grid-template-columns: 1fr 1fr; gap: 7px; padding: 8px; }
  .detail-thumbs button { height: 62px; }
}

/* v20: details-only owner tools, cleaner price badges, premium carousel polish */
.card-info {
  gap: 8px;
  filter: drop-shadow(0 14px 26px rgba(0,0,0,.32));
}
.card-info h1 {
  letter-spacing: -.06em;
  text-shadow: 0 3px 18px rgba(0,0,0,.58), 0 1px 0 rgba(0,0,0,.35);
}
.card-info p {
  text-shadow: 0 2px 14px rgba(0,0,0,.48);
}
.badge-line {
  gap: 7px;
  max-height: 36px;
}
.badge {
  min-height: 27px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(8,12,16,.54);
  border-color: rgba(255,255,255,.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 8px 18px rgba(0,0,0,.14);
  backdrop-filter: blur(13px);
}
.badge.price {
  background: linear-gradient(135deg, rgba(24,243,238,.20), rgba(255,47,126,.16));
  color: #fff;
  border-color: rgba(255,255,255,.20);
  letter-spacing: -.01em;
}
.badge.available {
  background: rgba(37,238,151,.13);
  color: #f2fff8;
  border-color: rgba(37,238,151,.26);
}
.reel-card.is-active .action.owner-edit,
.reel-card.is-active .action.owner-status,
.action.owner-edit,
.action.owner-status {
  display: none !important;
}
.reel-card.is-active .action {
  box-shadow: 0 14px 34px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.14);
}
.reel-card.is-active .action span {
  background: linear-gradient(145deg, rgba(255,255,255,.13), rgba(255,255,255,.05));
}
.reel-card.is-active .action.get span,
.reel-card.is-active .action.book span,
.reel-card.is-active .action.chat span {
  background: linear-gradient(135deg, rgba(24,243,238,.90), rgba(255,47,126,.82));
  color: #fff;
}
.media-wrap.carousel {
  background: radial-gradient(circle at 50% 8%, rgba(24,243,238,.09), transparent 34%), #020406;
}
.media-wrap.carousel .media-bg {
  transition: opacity .48s ease, transform .76s cubic-bezier(.2,.8,.2,1), filter .48s ease;
  will-change: transform, opacity;
}
.media-wrap.carousel .media-main {
  transition: opacity .42s ease, transform .72s cubic-bezier(.2,.8,.2,1), filter .42s ease;
  will-change: transform, opacity;
}
.media-wrap.carousel.is-changing .media-main {
  opacity: 0 !important;
  transform: scale(.982) translateY(3px);
  filter: saturate(.94) contrast(.98);
}
.media-wrap.carousel.is-changing .media-bg {
  opacity: .46;
  transform: scale(1.15);
  filter: blur(28px) saturate(1.18) brightness(.55);
}
.media-wrap.carousel.loaded:not(.is-changing) .media-main {
  animation: photoFloat 8s ease-in-out infinite alternate;
}
@keyframes photoFloat {
  from { transform: scale(1) translate3d(0,0,0); }
  to { transform: scale(1.012) translate3d(0,-4px,0); }
}
.media-dots {
  bottom: calc(156px + var(--safe-bottom));
  gap: 5px;
  padding: 5px 7px;
  background: rgba(2,4,7,.42);
  border-color: rgba(255,255,255,.16);
  box-shadow: 0 12px 28px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.10);
}
.media-dots button {
  width: 5px;
  height: 5px;
  opacity: .82;
  transition: width .28s ease, background .28s ease, opacity .28s ease, transform .28s ease;
}
.media-dots button.active {
  width: 28px;
  opacity: 1;
  transform: translateY(-.5px);
  animation: dotGlow 3.9s ease-in-out infinite;
}
@keyframes dotGlow {
  0%, 100% { box-shadow: 0 0 10px rgba(24,243,238,.38); }
  50% { box-shadow: 0 0 18px rgba(255,47,126,.42); }
}
.feed-photo-count {
  position: absolute;
  z-index: 4;
  right: 14px;
  top: calc(152px + env(safe-area-inset-top));
  min-width: 38px;
  height: 26px;
  display: grid;
  place-items: center;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(2,4,7,.44);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.92);
  font-size: 11px;
  font-weight: 950;
  backdrop-filter: blur(14px);
  box-shadow: 0 12px 26px rgba(0,0,0,.22);
}
.detail-media {
  box-shadow: 0 18px 50px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.08);
}
.detail-media .detail-main,
.detail-media .detail-bg {
  transition: opacity .34s ease, transform .48s cubic-bezier(.2,.8,.2,1), filter .34s ease;
}
.detail-media.is-changing .detail-main {
  opacity: 0;
  transform: scale(.985) translateY(3px);
}
.detail-media.is-changing .detail-bg {
  opacity: .48;
  transform: scale(1.06);
}
.detail-thumbs {
  gap: 10px;
}
.detail-thumbs button {
  border-radius: 20px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.detail-thumbs button.active {
  transform: translateY(-2px);
  border-color: rgba(24,243,238,.75);
  box-shadow: 0 12px 28px rgba(24,243,238,.13), 0 0 0 2px rgba(24,243,238,.24);
}
.owner-tools {
  margin-top: 14px;
  background: linear-gradient(135deg, rgba(24,243,238,.075), rgba(255,47,126,.045));
  border-color: rgba(255,255,255,.13);
}
@media (max-width: 390px) {
  .media-dots { bottom: calc(150px + var(--safe-bottom)); }
  .feed-photo-count { right: 12px; top: calc(144px + env(safe-area-inset-top)); }
  .badge { padding: 6px 9px; }
}

/* v21: action rail, photo counter and story strip final visual cleanup */
.story-strip {
  top: calc(166px + env(safe-area-inset-top)) !important;
  padding: 5px 12px 9px !important;
  background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,0)) !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.story-pill { width: 62px !important; gap: 4px !important; }
.story-pill .story-ring {
  width: 52px !important;
  height: 52px !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.36), 0 0 0 1px rgba(255,255,255,.14) !important;
}
.story-pill.add-story .story-ring {
  background: rgba(255,255,255,.13) !important;
  border: 1px dashed rgba(255,255,255,.30) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 12px 24px rgba(0,0,0,.24) !important;
}
.story-pill span {
  max-width: 62px !important;
  font-size: 9px !important;
  line-height: 1.05 !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.82) !important;
}

/* TikTok-like clean rail: round icon discs, no clipped triangle blocks */
.reel-card.is-active .action-rail {
  right: max(10px, calc((100vw - min(100vw, 460px)) / 2 + 10px)) !important;
  bottom: calc(86px + var(--safe-bottom)) !important;
  gap: 8px !important;
  width: 56px !important;
  align-items: center !important;
  justify-items: center !important;
  background: transparent !important;
  filter: drop-shadow(0 12px 24px rgba(0,0,0,.28));
}
.reel-card.is-active .action,
.action {
  width: 54px !important;
  min-height: 58px !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  backdrop-filter: none !important;
}
.reel-card.is-active .action span,
.action span {
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: rgba(5,8,12,.58) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 12px 26px rgba(0,0,0,.32) !important;
  backdrop-filter: blur(16px) saturate(1.12) !important;
  color: #fff !important;
  overflow: hidden !important;
}
.reel-card.is-active .action svg,
.action svg {
  width: 21px !important;
  height: 21px !important;
  filter: drop-shadow(0 2px 5px rgba(0,0,0,.26));
}
.reel-card.is-active .action b,
.action b {
  display: block !important;
  max-width: 58px !important;
  color: #fff !important;
  font-size: 8px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: -.02em !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.9) !important;
}
.reel-card.is-active .action.get span,
.reel-card.is-active .action.book span,
.reel-card.is-active .action.chat span,
.reel-card.is-active .action.live span,
.action.get span,
.action.book span,
.action.chat span,
.action.live span {
  border: 0 !important;
  background: radial-gradient(circle at 28% 20%, rgba(255,255,255,.55), transparent 24%), linear-gradient(145deg, var(--cyan), var(--pink)) !important;
  box-shadow: 0 12px 28px rgba(255,47,126,.28), 0 0 22px rgba(24,243,238,.20), inset 0 1px 0 rgba(255,255,255,.32) !important;
}
.reel-card.is-active .action.chat span,
.action.chat span {
  background: radial-gradient(circle at 28% 20%, rgba(255,255,255,.55), transparent 24%), linear-gradient(145deg, #25ee97, #18f3ee) !important;
  color: #031314 !important;
}
.reel-card.is-active .action.live span,
.action.live span {
  background: radial-gradient(circle at 30% 22%, rgba(255,255,255,.50), transparent 24%), linear-gradient(145deg, #ff2f7e, #18f3ee) !important;
}
.reel-card.is-active .action.owner-inbox span,
.action.owner-inbox span {
  background: rgba(24,243,238,.18) !important;
  color: #fff !important;
}

/* Put image count near the carousel controls, away from the top header/stories */
.feed-photo-count {
  top: auto !important;
  right: auto !important;
  left: 50% !important;
  bottom: calc(190px + var(--safe-bottom)) !important;
  transform: translateX(-50%) !important;
  min-width: 42px !important;
  height: 24px !important;
  padding: 0 10px !important;
  background: rgba(2,4,7,.56) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  font-size: 10.5px !important;
  letter-spacing: .01em !important;
  box-shadow: 0 14px 28px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.12) !important;
}
.media-dots {
  bottom: calc(160px + var(--safe-bottom)) !important;
  background: rgba(2,4,7,.38) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}
.photo-count {
  top: auto !important;
  right: 12px !important;
  bottom: 12px !important;
  background: rgba(2,4,7,.54) !important;
  border-color: rgba(255,255,255,.18) !important;
}

/* Narrow-device balancing */
@media (max-width: 390px) {
  .story-strip { top: calc(160px + env(safe-area-inset-top)) !important; padding-inline: 10px !important; }
  .story-pill { width: 58px !important; }
  .story-pill .story-ring { width: 49px !important; height: 49px !important; }
  .story-pill span { max-width: 58px !important; font-size: 8.5px !important; }
  .reel-card.is-active .action-rail { right: max(7px, calc((100vw - min(100vw, 460px)) / 2 + 7px)) !important; gap: 6px !important; bottom: calc(84px + var(--safe-bottom)) !important; }
  .reel-card.is-active .action, .action { width: 48px !important; min-height: 54px !important; }
  .reel-card.is-active .action span, .action span { width: 42px !important; height: 42px !important; min-width: 42px !important; min-height: 42px !important; }
  .reel-card.is-active .action svg, .action svg { width: 19px !important; height: 19px !important; }
  .reel-card.is-active .action b, .action b { font-size: 7.5px !important; max-width: 50px !important; }
  .feed-photo-count { bottom: calc(180px + var(--safe-bottom)) !important; }
  .media-dots { bottom: calc(152px + var(--safe-bottom)) !important; }
}
@media (max-height: 710px) {
  .story-strip { top: calc(154px + env(safe-area-inset-top)) !important; }
  .reel-card.is-active .action-rail { gap: 5px !important; bottom: calc(80px + var(--safe-bottom)) !important; }
  .reel-card.is-active .action, .action { min-height: 50px !important; }
  .reel-card.is-active .action span, .action span { width: 40px !important; height: 40px !important; min-width: 40px !important; min-height: 40px !important; }
  .reel-card.is-active .action b, .action b { font-size: 7.2px !important; }
  .feed-photo-count { bottom: calc(168px + var(--safe-bottom)) !important; }
  .media-dots { bottom: calc(141px + var(--safe-bottom)) !important; }
}

/* v23: cinematic caption polish, twin-dot loading and safer small-screen polish */
.boot-loader {
  position: absolute;
  z-index: 999;
  inset: 0;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  background:
    radial-gradient(circle at 30% 16%, rgba(24,243,238,.24), transparent 34%),
    radial-gradient(circle at 70% 84%, rgba(255,47,126,.20), transparent 32%),
    #030507;
  transition: opacity .38s ease, transform .38s ease, visibility .38s ease;
}
.boot-loader b { font-size: 19px; font-weight: 980; letter-spacing: -.045em; }
.boot-loader small { max-width: 230px; color: rgba(255,255,255,.66); font-size: 12px; text-align: center; }
.app-ready .boot-loader { opacity: 0; transform: scale(1.025); visibility: hidden; pointer-events: none; }
.twin-dots { position: relative; width: 58px; height: 22px; display: inline-grid; place-items: center; }
.twin-dots i { position: absolute; width: 16px; height: 16px; border-radius: 999px; background: var(--cyan); box-shadow: 0 0 20px rgba(24,243,238,.75); animation: twinDotA 1.05s ease-in-out infinite; }
.twin-dots i:nth-child(2) { background: var(--pink); box-shadow: 0 0 20px rgba(255,47,126,.72); animation-name: twinDotB; }
@keyframes twinDotA { 0%,100% { transform: translateX(-15px) scale(.82); opacity: .72; } 50% { transform: translateX(15px) scale(1.18); opacity: 1; } }
@keyframes twinDotB { 0%,100% { transform: translateX(15px) scale(1.18); opacity: 1; } 50% { transform: translateX(-15px) scale(.82); opacity: .72; } }
.media-loader { position: absolute; z-index: 5; left: 50%; top: 50%; transform: translate(-50%, -50%); opacity: 1; transition: opacity .25s ease; pointer-events: none; }
.media-loader.twin-dots { transform: translate(-50%, -50%); }
.media-wrap.loaded .media-loader { opacity: 0; }
.media-wrap.loading .media-loader { opacity: 1; }

/* Readability on bright photos: keep the photo beautiful, but make commerce data legible. */
.media-wrap.photo .media-main,
.media-wrap.photo.portrait .media-main,
.media-wrap.photo.landscape .media-main,
.media-wrap.photo.squareish .media-main {
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
}
.media-wrap.photo::after,
.media-wrap::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,.50) 0%, rgba(0,0,0,.08) 30%, rgba(0,0,0,.12) 54%, rgba(0,0,0,.72) 74%, rgba(0,0,0,.96) 100%),
    radial-gradient(ellipse at bottom left, rgba(0,0,0,.78), transparent 54%),
    linear-gradient(90deg, rgba(0,0,0,.32), transparent 44%, rgba(0,0,0,.20));
}
.card-info {
  padding: 10px 10px 11px !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg, rgba(3,6,9,.32), rgba(3,6,9,.54)) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  backdrop-filter: blur(8px) saturate(1.08) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08) !important;
  text-shadow: none !important;
}
.seller-line {
  background: rgba(2,4,7,.58) !important;
  border-color: rgba(255,255,255,.16) !important;
  box-shadow: 0 10px 25px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
.card-info h1 {
  color: #fff !important;
  text-shadow: 0 3px 12px rgba(0,0,0,.82), 0 1px 0 rgba(0,0,0,.55) !important;
}
.card-info p {
  color: rgba(255,255,255,.96) !important;
  background: rgba(1,4,7,.38) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 16px !important;
  padding: 8px 10px !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.72) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
}
.badge-line { gap: 6px !important; max-height: none !important; overflow: visible !important; }
.badge-line .badge {
  min-height: 28px !important;
  padding: 7px 10px !important;
  font-size: 10px !important;
  letter-spacing: .01em !important;
  white-space: nowrap !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.12) !important;
}
.badge.price {
  color: #fff !important;
  background: linear-gradient(135deg, rgba(24,243,238,.88), rgba(255,47,126,.86)) !important;
  border: 0 !important;
  text-shadow: 0 2px 9px rgba(0,0,0,.52) !important;
  font-weight: 970 !important;
}
.badge.available {
  color: #04160e !important;
  background: linear-gradient(135deg, rgba(37,238,151,.96), rgba(226,255,243,.90)) !important;
  border: 0 !important;
  text-shadow: none !important;
  font-weight: 980 !important;
}
.tag-line { max-height: 34px !important; }
.tag {
  background: rgba(3,6,9,.50) !important;
  border-color: rgba(255,255,255,.13) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.18) !important;
}
.toast { backdrop-filter: blur(18px) saturate(1.1); }

@media (max-width: 390px) {
  .card-info { left: 10px !important; right: 70px !important; padding: 9px !important; gap: 6px !important; }
  .card-info h1 { font-size: clamp(24px, 7.1vw, 31px) !important; max-height: 65px !important; }
  .card-info p { font-size: 12.5px !important; line-height: 1.28 !important; max-height: 54px !important; padding: 7px 9px !important; }
  .badge-line .badge { min-height: 25px !important; padding: 6px 8px !important; font-size: 9px !important; }
  .seller-line .seller-name { max-width: 132px !important; }
}

/* v23: beautiful readability without the heavy info card */
.card-info {
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  isolation: isolate;
}
.card-info::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -24px;
  right: -12px;
  bottom: -18px;
  height: calc(100% + 40px);
  pointer-events: none;
  background:
    radial-gradient(ellipse at 16% 44%, rgba(0,0,0,.82), rgba(0,0,0,.42) 44%, transparent 72%),
    linear-gradient(90deg, rgba(0,0,0,.68), rgba(0,0,0,.30) 56%, transparent 100%);
  filter: blur(15px);
  opacity: .92;
}
.card-info .seller-line {
  margin-bottom: 1px !important;
  background: rgba(0,0,0,.48) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.13) !important;
}
.card-info h1 {
  color: #fff !important;
  text-shadow:
    0 2px 0 rgba(0,0,0,.50),
    0 6px 18px rgba(0,0,0,.92),
    0 0 28px rgba(0,0,0,.72) !important;
  -webkit-text-stroke: .22px rgba(0,0,0,.38);
}
.card-info p {
  color: rgba(255,255,255,.96) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  text-shadow:
    0 2px 0 rgba(0,0,0,.42),
    0 5px 14px rgba(0,0,0,.88),
    0 0 22px rgba(0,0,0,.70) !important;
  -webkit-text-stroke: .14px rgba(0,0,0,.32);
}
.badge-line {
  gap: 7px !important;
  max-height: 34px !important;
  overflow: visible !important;
}
.badge-line .badge {
  min-height: 27px !important;
  padding: 7px 10px !important;
  border-radius: 999px !important;
  font-size: 9.7px !important;
  line-height: 1 !important;
  box-shadow: 0 12px 24px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.18) !important;
  backdrop-filter: blur(14px) saturate(1.08) !important;
}
.badge.price {
  color: #fff !important;
  background: linear-gradient(135deg, rgba(24,243,238,.96), rgba(255,47,126,.90)) !important;
  border: 0 !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.55) !important;
  letter-spacing: 0 !important;
}
.badge.available {
  color: #052014 !important;
  background: linear-gradient(135deg, rgba(37,238,151,1), rgba(221,255,241,.96)) !important;
  border: 0 !important;
  text-shadow: none !important;
}
.badge.sold {
  color: #fff !important;
  background: linear-gradient(135deg, rgba(255,47,126,.98), rgba(255,120,168,.88)) !important;
  border: 0 !important;
}
.tag-line { max-height: 30px !important; }
.tag {
  background: rgba(0,0,0,.34) !important;
  border-color: rgba(255,255,255,.14) !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.60) !important;
  backdrop-filter: blur(10px) !important;
}
.media-wrap.photo::after,
.media-wrap::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,.50) 0%, rgba(0,0,0,.05) 26%, rgba(0,0,0,.10) 54%, rgba(0,0,0,.66) 77%, rgba(0,0,0,.96) 100%),
    radial-gradient(ellipse at 0% 82%, rgba(0,0,0,.78), rgba(0,0,0,.42) 28%, transparent 66%),
    linear-gradient(90deg, rgba(0,0,0,.34), transparent 47%, rgba(0,0,0,.16)) !important;
}
@media (max-width: 390px) {
  .card-info {
    left: 12px !important;
    right: 70px !important;
    bottom: calc(80px + var(--safe-bottom)) !important;
    gap: 6px !important;
  }
  .card-info::before {
    left: -20px;
    right: -10px;
    bottom: -18px;
    height: calc(100% + 36px);
    filter: blur(13px);
  }
  .card-info h1 {
    font-size: clamp(25px, 7.3vw, 31px) !important;
    max-height: 66px !important;
  }
  .card-info p {
    font-size: 12.7px !important;
    line-height: 1.30 !important;
    max-height: 52px !important;
  }
  .badge-line { gap: 5px !important; max-height: 31px !important; }
  .badge-line .badge { min-height: 24px !important; padding: 6px 8px !important; font-size: 8.8px !important; }
}


/* v23: no-card cinematic caption polish */
.reel-card::before {
  content: "";
  position: absolute;
  z-index: 4;
  left: 0;
  right: 0;
  bottom: 0;
  height: 46%;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 14% 78%, rgba(0,0,0,.78), rgba(0,0,0,.36) 32%, transparent 64%),
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,.14) 27%, rgba(0,0,0,.66) 69%, rgba(0,0,0,.94) 100%);
}
.media-wrap.photo::after,
.media-wrap::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,.46) 0%, rgba(0,0,0,.05) 28%, rgba(0,0,0,.08) 58%, rgba(0,0,0,.58) 82%, rgba(0,0,0,.90) 100%),
    linear-gradient(90deg, rgba(0,0,0,.22), transparent 46%, rgba(0,0,0,.14));
}
.card-glow {
  height: 42% !important;
  opacity: .68 !important;
  background: radial-gradient(ellipse at bottom left, rgba(24,243,238,.20), transparent 48%), radial-gradient(ellipse at bottom right, rgba(255,47,126,.18), transparent 44%) !important;
}
.card-info {
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  gap: 8px !important;
}
.card-info .seller-line {
  background: rgba(2,5,8,.56) !important;
  border-color: rgba(255,255,255,.13) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.10) !important;
  backdrop-filter: blur(14px) saturate(1.08) !important;
}
.card-info h1 {
  max-width: min(100%, 335px) !important;
  color: #fff !important;
  text-shadow: 0 4px 18px rgba(0,0,0,.95), 0 1px 1px rgba(0,0,0,.72), 0 0 1px rgba(0,0,0,.90) !important;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.42));
}
.card-info p {
  max-width: min(100%, 335px) !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: rgba(255,255,255,.96) !important;
  text-shadow: 0 3px 13px rgba(0,0,0,.96), 0 1px 1px rgba(0,0,0,.78) !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.badge-line {
  gap: 7px !important;
  max-width: min(100%, 340px) !important;
}
.badge-line .badge {
  min-height: 25px !important;
  padding: 6px 9px !important;
  font-size: 9.4px !important;
  border-radius: 999px !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.14) !important;
}
.badge.price {
  background: linear-gradient(135deg, rgba(24,243,238,.94), rgba(255,47,126,.90)) !important;
  color: #fff !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.58) !important;
}
.badge.available {
  background: linear-gradient(135deg, rgba(37,238,151,.96), rgba(230,255,246,.92)) !important;
  color: #03160f !important;
}
.tag-line {
  max-width: min(100%, 342px) !important;
  max-height: 32px !important;
  mask-image: linear-gradient(90deg, #000 82%, transparent);
}
.tag {
  background: rgba(4,8,12,.46) !important;
  border-color: rgba(255,255,255,.14) !important;
  backdrop-filter: blur(10px) !important;
}
.empty-card .card-info {
  padding: 0 15px !important;
}
@media (max-width: 390px) {
  .card-info { left: 12px !important; right: 72px !important; bottom: calc(82px + var(--safe-bottom)) !important; gap: 6px !important; }
  .card-info h1 { font-size: clamp(25px, 8vw, 32px) !important; max-height: 72px !important; }
  .card-info p { font-size: 13px !important; line-height: 1.29 !important; -webkit-line-clamp: 3 !important; }
  .badge-line .badge { min-height: 24px !important; padding: 5.5px 8px !important; font-size: 8.8px !important; }
}
@media (max-height: 710px) {
  .card-info { gap: 5px !important; bottom: calc(74px + var(--safe-bottom)) !important; }
  .card-info p { -webkit-line-clamp: 2 !important; }
  .tag-line { display: none !important; }
}

/* v28: Pricing, MTN MoMo checkout and package access */
.vi-radar-bar {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 7px !important;
}
.vi-radar-bar button {
  min-height: 45px !important;
  padding: 7px 6px !important;
  grid-template-columns: 20px 1fr !important;
}
.vi-radar-bar button span { width: 20px !important; height: 20px !important; font-size: 13px !important; }
.vi-radar-bar button b { font-size: 10.2px !important; }
.vi-radar-bar button small { font-size: 7.4px !important; }
.vi-radar-bar #pricingOpen.is-pro {
  border-color: rgba(255,47,126,.36);
  background: linear-gradient(145deg, rgba(255,47,126,.20), rgba(24,243,238,.12));
}
.pricing-card { max-width: 520px; }
.pricing-body { display: grid; gap: 12px; }
.current-plan-box,
.account-plan-card,
.momo-note,
.payment-result,
.momo-checkout,
.pricing-plan {
  border: 1px solid rgba(255,255,255,.13);
  background: linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.045));
  border-radius: 22px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 14px 34px rgba(0,0,0,.22);
}
.current-plan-box,
.account-plan-card {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 12px;
}
.account-plan-card { margin-bottom: 12px; }
.current-plan-box > div,
.account-plan-card > div { min-width: 0; flex: 1; }
.current-plan-box small,
.account-plan-card small,
.plan-head small,
.momo-note small,
.payment-result small { color: rgba(255,255,255,.65); display: block; }
.current-plan-box b,
.account-plan-card b { display: block; font-size: 15px; font-weight: 1000; letter-spacing: -.03em; }
.current-plan-box em,
.account-plan-card em { display:block; font-size: 11px; color: rgba(255,255,255,.65); font-style: normal; line-height: 1.35; }
.account-plan-card button,
.current-plan-box button {
  appearance: none;
  border: 0;
  border-radius: 999px;
  color: #061014;
  font-weight: 1000;
  padding: 10px 13px;
  background: linear-gradient(135deg, var(--cyan), #fff, var(--pink));
  white-space: nowrap;
}
.plan-orb {
  width: 42px;
  height: 42px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  background: radial-gradient(circle at 25% 20%, rgba(255,255,255,.85), rgba(24,243,238,.30) 35%, rgba(255,47,126,.36));
  color: #fff;
  box-shadow: 0 12px 28px rgba(24,243,238,.12), inset 0 1px 0 rgba(255,255,255,.38);
}
.plan-orb svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.pricing-grid { display: grid; gap: 10px; }
.pricing-plan { padding: 13px; display: grid; gap: 10px; position: relative; overflow: hidden; }
.pricing-plan.current { border-color: rgba(40,255,166,.34); background: linear-gradient(145deg, rgba(40,255,166,.14), rgba(24,243,238,.08)); }
.pricing-plan.business_plus { border-color: rgba(255,47,126,.26); }
.plan-head { display: flex; align-items: center; gap: 10px; }
.plan-head > span { width: 38px; height: 38px; border-radius: 14px; display:grid; place-items:center; background: rgba(255,255,255,.10); }
.plan-head svg { width: 22px; height: 22px; fill:none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.plan-head h4 { margin: 0; font-size: 18px; letter-spacing: -.04em; }
.plan-price { font-size: 18px; letter-spacing: -.03em; }
.pricing-plan ul { margin: 0; padding-left: 18px; color: rgba(255,255,255,.75); font-size: 12px; line-height: 1.55; }
.plan-actions { display: grid; grid-template-columns: 1fr; gap: 8px; }
.momo-checkout { padding: 14px; display: grid; gap: 10px; }
.checkout-hero { display: flex; gap: 12px; align-items: center; }
.checkout-hero h4 { margin: 0; font-size: 20px; }
.checkout-hero b { color: #fff; }
.momo-checkout input,
.momo-checkout textarea { width: 100%; }
.momo-note { padding: 12px; display: grid; gap: 3px; }
.payment-result { text-align: center; padding: 24px 14px; display: grid; justify-items: center; gap: 9px; }
.payment-ref {
  display: inline-flex;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.10);
  letter-spacing: .08em;
}
.mini-muted { color: rgba(255,255,255,.58); font-size: 12px; }
@media (max-width: 390px) {
  .vi-radar-bar { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 5px !important; }
  .vi-radar-bar button { min-height: 40px !important; padding: 6px 4px !important; grid-template-columns: 18px 1fr !important; border-radius: 15px !important; }
  .vi-radar-bar button span { width: 18px !important; height: 18px !important; font-size: 11px !important; }
  .vi-radar-bar button b { font-size: 8.8px !important; }
  .vi-radar-bar button small { display: none !important; }
  .account-plan-card { align-items: flex-start; }
  .account-plan-card button { padding-inline: 10px; font-size: 11px; }
}


/* v28: active plan polish, shop-name pricing chip and live Mobile Money checkout */
.vi-radar-bar #pricingOpen {
  grid-template-columns: 22px 1fr !important;
  align-items: center !important;
}
.vi-radar-bar #pricingOpen b {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px !important;
}
.vi-radar-bar #pricingOpen small {
  display: block !important;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: rgba(255,255,255,.78) !important;
}
.active-plan-box {
  border-color: rgba(40,255,166,.34) !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(40,255,166,.18), transparent 34%),
    linear-gradient(145deg, rgba(24,243,238,.12), rgba(255,47,126,.08)) !important;
}
.active-plan-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 60px;
  padding: 9px 12px;
  border-radius: 999px;
  color: #061014;
  font-weight: 1000;
  font-size: 11px;
  background: linear-gradient(135deg, #28ffa6, #fff, var(--cyan));
  box-shadow: 0 12px 24px rgba(24,243,238,.16);
}
.pricing-plan.current::after {
  content: 'ACTIVE';
  position: absolute;
  top: 12px;
  right: 12px;
  padding: 5px 8px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 1000;
  color: #061014;
  background: linear-gradient(135deg, #28ffa6, #fff);
}
.momo-note { display: none !important; }
@media (max-width: 390px) {
  .vi-radar-bar #pricingOpen b { font-size: 8.6px !important; }
  .vi-radar-bar #pricingOpen small { display:block !important; font-size: 7.2px !important; }
  .active-plan-pill { min-width: 48px; padding-inline: 9px; }
}

/* v28: Mobile Money checkout polish */
.payment-checkout {
  gap: 12px !important;
}
.pay-method-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(40,255,166,.22);
  background: linear-gradient(135deg, rgba(40,255,166,.13), rgba(24,243,238,.08));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
.pay-method-card > span {
  width: 40px;
  height: 40px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.10);
  color: #fff;
}
.pay-method-card svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.pay-method-card b { display:block; font-size: 14px; }
.pay-method-card small { color: rgba(255,255,255,.62); }
.payment-result.success {
  background: radial-gradient(circle at 50% 0%, rgba(40,255,166,.18), transparent 40%);
}
.payment-result.danger {
  background: radial-gradient(circle at 50% 0%, rgba(255,47,126,.18), transparent 42%);
}
.pay-loader {
  margin: 4px auto;
}
.twin-dots.tiny {
  display: inline-flex;
  width: 26px;
  margin-right: 8px;
  vertical-align: middle;
}
.twin-dots.tiny i {
  width: 7px;
  height: 7px;
}

/* v30: resilient payment state */
.payment-inline-error{
  margin: 8px 0 10px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,70,95,.14);
  border: 1px solid rgba(255,120,140,.28);
  color: #fff;
  font-size: 12px;
  line-height: 1.35;
}
.payment-provider-status{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.78);
  font-size: 11px;
  font-style: normal;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* v30: production payment inline diagnostics */
.payment-inline-status { display:flex; align-items:flex-start; gap:8px; padding:11px 12px; border-radius:18px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.08); color:#fff; font-size:12px; line-height:1.35; box-shadow: inset 0 1px 0 rgba(255,255,255,.10); }
.payment-inline-status.hidden { display:none; }
.payment-inline-status.danger { border-color:rgba(255,47,126,.34); background:rgba(255,47,126,.12); }
.payment-inline-status.info { border-color:rgba(24,243,238,.30); background:rgba(24,243,238,.10); }
.payment-inline-status b { font-weight:800; }
.payment-result.danger .payment-ref { border-color:rgba(255,47,126,.35); background:rgba(255,47,126,.10); }

/* v30: product picker for Boost 24h, no manual Product ID */
.boost-product-picker label {
  font-size: 12px;
  font-weight: 1000;
  color: rgba(255,255,255,.78);
  letter-spacing: .02em;
}
.boost-selected {
  display: grid;
  grid-template-columns: 54px 1fr;
  align-items: center;
  gap: 10px;
  padding: 9px;
  border-radius: 18px;
  background: rgba(0,0,0,.20);
  border: 1px solid rgba(255,255,255,.10);
}
.boost-selected img {
  width: 54px;
  height: 54px;
  border-radius: 15px;
  object-fit: cover;
  background: rgba(255,255,255,.08);
}
.boost-selected b {
  display: block;
  color: #fff;
  font-size: 13px;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.boost-selected small {
  display: block;
  color: rgba(255,255,255,.64);
  font-size: 11px;
  margin-top: 2px;
}
.boost-empty-note {
  grid-template-columns: 38px 1fr;
  align-items: center;
}
.boost-empty-note > span:first-child {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(24,243,238,.12);
  color: #18f3ee;
}
.boost-empty-note small {
  font-size: 12px;
  color: rgba(255,255,255,.66);
  line-height: 1.45;
}


/* v30: clean payment checkout + visual Boost picker */
.boost-picker{display:grid;gap:10px;padding:12px;border-radius:22px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.045));box-shadow:inset 0 1px 0 rgba(255,255,255,.10)}
.boost-picker label{font-weight:850;font-size:13px;letter-spacing:.01em;color:#fff}
.boost-picker select{width:100%;min-height:44px;border-radius:16px;border:1px solid rgba(255,255,255,.16);background:rgba(6,10,20,.72);color:#fff;padding:0 12px;outline:none}
.boost-card-list{display:grid;grid-template-columns:1fr;gap:8px;max-height:230px;overflow:auto;padding-right:2px}
.boost-product-card{display:grid;grid-template-columns:48px 1fr 26px;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.055);color:#fff;border-radius:18px;padding:8px;text-align:left;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease}
.boost-product-card:active{transform:scale(.985)}
.boost-product-card.active{border-color:rgba(24,243,238,.46);background:linear-gradient(135deg,rgba(24,243,238,.16),rgba(255,47,126,.10))}
.boost-product-card img{width:48px;height:48px;border-radius:15px;object-fit:cover;background:#111827}
.boost-product-card b{display:block;font-size:13px;line-height:1.15;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.boost-product-card small{display:block;margin-top:3px;color:rgba(255,255,255,.65);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.boost-product-card i{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;color:#071018;background:linear-gradient(135deg,#18f3ee,#ff2f7e);font-style:normal;font-weight:900;opacity:.92}
.boost-product-card:not(.active) i{background:rgba(255,255,255,.10);color:transparent}
.boost-empty{display:flex;gap:10px;align-items:center;padding:13px;border-radius:20px;background:rgba(255,47,126,.11);border:1px solid rgba(255,47,126,.24);color:#fff}
.boost-empty span{width:34px;height:34px;display:grid;place-items:center;border-radius:14px;background:rgba(255,255,255,.10)}
.approve-phone{text-align:center;color:rgba(255,255,255,.78)!important}


/* v30.1: Boost picker is card-only, no confusing product ID/select field */
.boost-picker select{display:none!important}
.boost-picker-label{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:2px 2px 0}
.boost-picker-label b{font-size:13px;color:#fff;letter-spacing:.01em}
.boost-picker-label small{font-size:10.5px;color:rgba(255,255,255,.60);white-space:nowrap}
.boost-card-list{max-height:252px!important}
.boost-product-card{box-shadow:inset 0 1px 0 rgba(255,255,255,.055)}
.boost-product-card.active{border-color:rgba(40,255,166,.50)!important;background:linear-gradient(135deg,rgba(40,255,166,.15),rgba(24,243,238,.10))!important}
.boost-product-card.active i{background:linear-gradient(135deg,#28ffa6,#fff)!important;color:#061014!important}
@media(max-width:390px){.boost-picker-label{display:grid}.boost-picker-label small{white-space:normal}.boost-card-list{max-height:220px!important}}

/* v30: visual Boost 24h selector, no product ID input */
.boost-picker select,
.boost-picker input[type="hidden"]{display:none!important}
.boost-picker{gap:11px!important}
.boost-picker label{display:flex;align-items:center;justify-content:space-between;gap:8px}
.boost-card-list{display:grid!important;gap:9px!important;max-height:270px!important;overflow:auto!important;padding:1px 2px 3px!important}
.boost-product-card{appearance:none;border:1px solid rgba(255,255,255,.13)!important;background:rgba(255,255,255,.065)!important;border-radius:20px!important;padding:8px!important;display:grid!important;grid-template-columns:52px 1fr 28px!important;gap:10px!important;align-items:center!important;transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease!important}
.boost-product-card:hover{border-color:rgba(24,243,238,.32)!important;background:rgba(255,255,255,.09)!important}
.boost-product-card.active{border-color:rgba(40,255,166,.55)!important;background:linear-gradient(135deg,rgba(40,255,166,.16),rgba(24,243,238,.10),rgba(255,47,126,.08))!important;box-shadow:0 14px 28px rgba(24,243,238,.10),inset 0 1px 0 rgba(255,255,255,.12)!important}
.boost-product-card img{width:52px!important;height:52px!important;border-radius:16px!important;object-fit:cover!important;background:#111827!important}
.boost-product-card i{font-size:14px!important}
.boost-empty{display:flex;align-items:center;gap:10px;padding:12px;border-radius:18px;background:rgba(255,255,255,.07);border:1px dashed rgba(255,255,255,.18)}
.approve-phone{font-weight:900;color:rgba(255,255,255,.76)!important}


/* v31: cleaner payment status and compact Boost picker cards */
.payment-ref { display: none !important; }
.payment-result { gap: 11px; }
.payment-result p { margin: 0; font-weight: 850; color: rgba(255,255,255,.90); }
.payment-result .payment-provider-status { margin-top: -2px; }
.boost-picker { gap: 11px; overflow: hidden; }
.boost-picker-label { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.boost-picker-label b { font-size: 13px; line-height: 1.2; }
.boost-picker-label small { max-width: 45%; text-align:right; font-size: 10px; line-height:1.25; color:rgba(255,255,255,.58); }
.boost-card-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  max-height: min(288px, 34vh) !important;
  overflow: auto !important;
  padding: 2px 2px 4px !important;
  scrollbar-width: thin;
}
.boost-product-card {
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) 20px !important;
  gap: 8px !important;
  align-items: center !important;
  min-width: 0 !important;
  min-height: 60px !important;
  padding: 7px !important;
  border-radius: 17px !important;
  overflow: hidden !important;
}
.boost-card-media { width:44px; height:44px; border-radius:14px; overflow:hidden; background:rgba(0,0,0,.28); border:1px solid rgba(255,255,255,.12); display:block; }
.boost-card-media img { width:100%; height:100%; object-fit:cover; display:block; }
.boost-product-card > img { display:none !important; }
.boost-card-meta { min-width:0; display:grid; gap:3px; }
.boost-card-meta b, .boost-product-card b { font-size: 12px !important; line-height:1.15 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
.boost-card-meta small, .boost-product-card small { font-size: 10.5px !important; color:rgba(255,255,255,.68) !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
.boost-product-card i { width:20px !important; height:20px !important; font-size:12px !important; align-self:center; justify-self:end; }
@media (max-width: 365px) {
  .boost-card-list { grid-template-columns: 1fr !important; max-height: 260px !important; }
  .boost-picker-label { display:grid; }
  .boost-picker-label small { max-width:100%; text-align:left; }
}

/* v31 final: clean payment waiting card and fit Boost cards */
.payment-result .payment-ref,
.payment-result [data-ref],
.payment-result .transaction-ref{display:none!important}
.payment-result{padding:24px 18px!important;border-radius:26px!important}
.payment-result .payment-plan-line{
  margin: 0!important;
  width:min(100%, 340px)!important;
  padding: 12px 14px!important;
  border-radius: 20px!important;
  background: linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.04))!important;
  border:1px solid rgba(255,255,255,.12)!important;
  color:#fff!important;
  font-weight:900!important;
  letter-spacing:-.01em!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:normal!important;
  line-height:1.28!important;
}
.payment-result .payment-provider-status{
  border-radius:999px!important;
  padding:6px 12px!important;
  letter-spacing:.10em!important;
}

.boost-card-list.boost-card-grid{
  display:grid!important;
  grid-template-columns: repeat(2, minmax(0, 1fr))!important;
  gap: 10px!important;
  max-height: min(340px, 38vh)!important;
  overflow:auto!important;
  padding:2px 2px 5px!important;
}
.boost-product-card.boost-product-tile{
  position:relative!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:84px auto!important;
  gap:8px!important;
  min-width:0!important;
  min-height:0!important;
  padding:7px!important;
  border-radius:22px!important;
  overflow:hidden!important;
  align-items:stretch!important;
  background:linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.04))!important;
  border:1px solid rgba(255,255,255,.13)!important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07)!important;
}
.boost-product-card.boost-product-tile.active{
  border-color:rgba(40,255,166,.62)!important;
  background:linear-gradient(145deg, rgba(40,255,166,.15), rgba(24,243,238,.08), rgba(255,47,126,.07))!important;
  box-shadow:0 14px 28px rgba(24,243,238,.10), inset 0 1px 0 rgba(255,255,255,.13)!important;
}
.boost-thumb{
  display:block!important;
  width:100%!important;
  height:84px!important;
  border-radius:17px!important;
  overflow:hidden!important;
  background:rgba(0,0,0,.30)!important;
  border:1px solid rgba(255,255,255,.12)!important;
}
.boost-thumb img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  border-radius:0!important;
}
.boost-copy{
  display:grid!important;
  gap:3px!important;
  min-width:0!important;
  padding:0 2px 1px!important;
}
.boost-copy b{
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  white-space:normal!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  font-size:12px!important;
  line-height:1.15!important;
  color:#fff!important;
}
.boost-copy small{
  display:block!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  font-size:10px!important;
  color:rgba(255,255,255,.62)!important;
}
.boost-product-card.boost-product-tile i{
  position:absolute!important;
  top:9px!important;
  right:9px!important;
  width:24px!important;
  height:24px!important;
  border:1px solid rgba(255,255,255,.22)!important;
  box-shadow:0 10px 22px rgba(0,0,0,.26)!important;
  z-index:3!important;
}
.boost-product-card.boost-product-tile:not(.active) i{background:rgba(0,0,0,.38)!important;color:transparent!important}
@media(max-width:365px){
  .boost-card-list.boost-card-grid{gap:8px!important;max-height:320px!important}
  .boost-product-card.boost-product-tile{grid-template-rows:74px auto!important;border-radius:20px!important;padding:6px!important}
  .boost-thumb{height:74px!important;border-radius:15px!important}
  .boost-copy b{font-size:11.5px!important}
}

/* v32 Escrow balance, product payment and seller wallet polish */
.wallet-mini-wrap { margin: 10px 0; }
.wallet-mini { width: 100%; display: flex; gap: 12px; align-items: center; border: 1px solid rgba(255,255,255,.14); background: linear-gradient(135deg, rgba(32,221,219,.14), rgba(255,47,135,.12)); color: #fff; border-radius: 22px; padding: 12px 14px; text-align: left; box-shadow: inset 0 1px 0 rgba(255,255,255,.14); }
.wallet-mini span:first-child, .escrow-note span, .order-pay-card + .escrow-note span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 16px; background: linear-gradient(135deg, rgba(36,232,231,.35), rgba(255,45,135,.34)); flex: 0 0 auto; }
.wallet-mini svg, .escrow-note svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 2; }
.wallet-mini small, .wallet-mini em { color: rgba(255,255,255,.68); font-size: 12px; font-style: normal; display: block; }
.wallet-mini b { font-size: 18px; letter-spacing: -.02em; }
.wallet-card .sheet-title { position: sticky; top: 0; z-index: 3; backdrop-filter: blur(18px); }
.wallet-body { display: grid; gap: 14px; }
.wallet-hero { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.wallet-hero > div { min-height: 82px; border-radius: 24px; padding: 12px; background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.05)); border: 1px solid rgba(255,255,255,.14); display: flex; flex-direction: column; justify-content: center; }
.wallet-hero small { color: rgba(255,255,255,.58); font-size: 11px; }
.wallet-hero b { font-size: 16px; line-height: 1.15; }
.escrow-note { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 24px; background: linear-gradient(135deg, rgba(31,224,222,.12), rgba(255,43,133,.1)); border: 1px solid rgba(255,255,255,.14); }
.escrow-note b { display:block; font-size: 14px; }
.escrow-note small { display:block; margin-top: 3px; color: rgba(255,255,255,.66); line-height: 1.35; }
.wallet-list { display: grid; gap: 10px; }
.wallet-order { display: grid; grid-template-columns: 54px 1fr auto; gap: 10px; align-items: center; padding: 10px; border-radius: 20px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.065); }
.wallet-order img { width: 54px; height: 54px; object-fit: cover; border-radius: 16px; }
.wallet-order b, .wallet-order small, .wallet-order em { display:block; }
.wallet-order small, .wallet-order em { color: rgba(255,255,255,.64); font-size: 12px; font-style: normal; }
.wallet-order .tiny { min-height: 34px; padding: 8px 12px; border-radius: 999px; font-size: 12px; white-space: nowrap; }
.wallet-tx { display:grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 10px 12px; border-radius: 18px; background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.1); }
.wallet-tx span { font-size: 12px; color: rgba(255,255,255,.58); text-transform: uppercase; letter-spacing: .04em; }
.wallet-tx small { grid-column: 1 / -1; color: rgba(255,255,255,.62); }
.wallet-tx b.positive { color: #66f7bd; }
.wallet-tx b.negative { color: #ff86a8; }
.order-checkout { display: grid; gap: 14px; }
.order-pay-card { display: grid; grid-template-columns: 88px 1fr; gap: 14px; align-items: center; padding: 12px; border-radius: 26px; background: linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.055)); border: 1px solid rgba(255,255,255,.14); }
.order-pay-card img { width: 88px; height: 88px; object-fit: cover; border-radius: 22px; }
.order-pay-card small { color: #30eeee; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; font-size: 11px; }
.order-pay-card h4 { margin: 2px 0; font-size: 20px; line-height: 1.05; }
.order-pay-card b { font-size: 18px; }
.fee-grid { display: grid; grid-template-columns: 1fr auto; gap: 10px; padding: 13px 14px; border-radius: 22px; background: rgba(0,0,0,.22); border: 1px solid rgba(255,255,255,.1); }
.fee-grid span { color: rgba(255,255,255,.66); }
.fee-grid b { color: #fff; }
@media (max-width: 420px) { .wallet-hero { grid-template-columns: 1fr; } .wallet-order { grid-template-columns: 48px 1fr; } .wallet-order .tiny { grid-column: 1 / -1; } .order-pay-card { grid-template-columns: 72px 1fr; } .order-pay-card img { width:72px;height:72px;border-radius:18px; } }

/* v32 escrow wallet and buyer-protection polish */
.wallet-mini-holder{margin:10px 0 14px}.wallet-mini{width:100%;display:flex;gap:12px;align-items:center;text-align:left;border:1px solid rgba(255,255,255,.14);background:linear-gradient(135deg,rgba(32,226,225,.13),rgba(236,50,132,.10));border-radius:24px;padding:12px 14px;color:#fff;box-shadow:0 20px 50px rgba(0,0,0,.20)}.wallet-mini span{width:42px;height:42px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--pink));box-shadow:0 10px 25px rgba(32,226,225,.18)}.wallet-mini svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:2}.wallet-mini div{display:flex;flex-direction:column;gap:2px}.wallet-mini small,.wallet-mini em{color:rgba(255,255,255,.70);font-style:normal}.wallet-mini b{font-size:1.25rem}.wallet-card{max-width:560px}.wallet-body{display:flex;flex-direction:column;gap:14px}.wallet-hero{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.wallet-hero>div{padding:14px 10px;border-radius:22px;background:rgba(255,255,255,.075);border:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;gap:6px}.wallet-hero small{font-size:.72rem;color:rgba(255,255,255,.68)}.wallet-hero b{font-size:1.05rem}.escrow-note{display:flex;gap:12px;align-items:center;padding:13px 14px;border-radius:22px;background:linear-gradient(135deg,rgba(25,222,196,.12),rgba(236,50,132,.09));border:1px solid rgba(255,255,255,.13)}.escrow-note>span{width:44px;height:44px;border-radius:17px;display:grid;place-items:center;background:rgba(255,255,255,.09)}.escrow-note svg{width:22px;height:22px;fill:none;stroke:#56fff3;stroke-width:2}.escrow-note div{display:flex;flex-direction:column;gap:3px}.escrow-note small{color:rgba(255,255,255,.68)}.wallet-list{display:flex;flex-direction:column;gap:10px}.wallet-order{display:grid;grid-template-columns:58px 1fr;gap:12px;align-items:center;padding:10px;border-radius:22px;background:rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.12)}.wallet-order img{width:58px;height:58px;border-radius:18px;object-fit:cover;background:#111}.wallet-order div{min-width:0;display:flex;flex-direction:column;gap:3px}.wallet-order b{font-size:.97rem}.wallet-order small,.wallet-order em{font-size:.76rem;color:rgba(255,255,255,.68);font-style:normal}.wallet-order-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}.wallet-order-actions button{min-height:36px;font-size:.78rem}.wallet-tx{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;padding:10px 12px;border-radius:18px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.10)}.wallet-tx span{font-weight:800}.wallet-tx small{grid-column:1/-1;color:rgba(255,255,255,.62)}.wallet-tx .positive{color:#61ffbc}.wallet-tx .negative{color:#ff7eaa}.order-pay-card{display:grid;grid-template-columns:74px 1fr;gap:12px;align-items:center;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.07);padding:10px;border-radius:24px}.order-pay-card img{width:74px;height:74px;border-radius:20px;object-fit:cover;background:#101216}.order-pay-card h4{margin:2px 0 5px;font-size:1.05rem}.order-pay-card small{color:#45fff7;text-transform:uppercase;font-weight:900;letter-spacing:.06em}.order-pay-card b{font-size:1rem}.fee-grid{display:grid;grid-template-columns:1fr auto;gap:9px 12px;padding:13px;border-radius:22px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.11)}.fee-grid span{color:rgba(255,255,255,.68)}.fee-grid b{text-align:right}.order-checkout .approve-phone{display:block;text-align:center;margin-top:8px;color:rgba(255,255,255,.7)}
@media(max-width:430px){.wallet-hero{grid-template-columns:1fr}.wallet-card{max-height:88dvh}.wallet-order-actions{grid-template-columns:1fr}.order-pay-card{grid-template-columns:62px 1fr}.order-pay-card img{width:62px;height:62px}.fee-grid{font-size:.88rem}}

/* v32.0: escrow wallet, buyer confirmation and seller balance polish */
.account-wallet-card {
  display:flex;
  align-items:center;
  gap:11px;
  padding:12px;
  margin:0 0 12px;
  border-radius:22px;
  border:1px solid rgba(40,255,166,.22);
  background:linear-gradient(145deg,rgba(40,255,166,.12),rgba(24,243,238,.07),rgba(255,47,126,.07));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 14px 34px rgba(0,0,0,.20);
}
.account-wallet-card > div { min-width:0; flex:1; }
.account-wallet-card small,.account-wallet-card em { display:block; color:rgba(255,255,255,.66); font-style:normal; font-size:11px; line-height:1.35; }
.account-wallet-card b { display:block; color:#fff; font-weight:1000; letter-spacing:-.03em; font-size:16px; }
.account-wallet-card button { appearance:none; border:0; border-radius:999px; color:#061014; font-weight:1000; padding:10px 13px; background:linear-gradient(135deg,var(--cyan),#fff,var(--pink)); white-space:nowrap; }
.wallet-orb { background:radial-gradient(circle at 22% 18%, rgba(255,255,255,.82), rgba(40,255,166,.30) 35%, rgba(24,243,238,.28), rgba(255,47,126,.22)) !important; }
.wallet-body { display:grid !important; gap:14px !important; }
.wallet-hero {
  display:grid !important;
  grid-template-columns:54px 1fr !important;
  gap:13px !important;
  align-items:center !important;
  padding:15px !important;
  border-radius:26px !important;
  background:radial-gradient(circle at 12% 0%, rgba(40,255,166,.18), transparent 34%), linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.045)) !important;
  border:1px solid rgba(255,255,255,.13) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 16px 36px rgba(0,0,0,.22) !important;
}
.wallet-hero h3 { margin:0; font-size:28px; letter-spacing:-.06em; }
.wallet-hero p { margin:2px 0 0; color:rgba(255,255,255,.66); font-size:12px; line-height:1.35; }
.wallet-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.wallet-stats span { display:grid; gap:4px; padding:12px 10px; border-radius:20px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.11); min-width:0; }
.wallet-stats b { font-size:14px; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wallet-stats small { color:rgba(255,255,255,.62); font-size:10.5px; line-height:1.2; }
.withdraw-box { display:grid; gap:9px; padding:12px; border-radius:24px; background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.04)); border:1px solid rgba(255,255,255,.11); }
.withdraw-box small { color:rgba(255,255,255,.60); font-size:11.5px; line-height:1.35; }
.wallet-section { display:grid; gap:9px; }
.wallet-section h4 { margin:4px 0 0; font-size:14px; letter-spacing:-.02em; }
.wallet-order,.wallet-order-card { display:grid; grid-template-columns:58px 1fr; gap:11px; align-items:center; padding:10px; border-radius:22px; background:rgba(255,255,255,.065); border:1px solid rgba(255,255,255,.12); }
.wallet-order img,.wallet-order-card img { width:58px; height:58px; border-radius:18px; object-fit:cover; background:#111827; }
.wallet-order b,.wallet-order-card b { display:block; color:#fff; font-size:13.5px; line-height:1.15; }
.wallet-order small,.wallet-order-card small,.wallet-order em,.wallet-order-card em { display:block; color:rgba(255,255,255,.64); font-size:11.5px; line-height:1.35; font-style:normal; }
.wallet-row-actions,.wallet-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:8px; }
.wallet-row-actions button,.wallet-actions button { min-height:36px; border-radius:14px; font-size:11.5px; }
.order-pay-checkout { display:grid; gap:12px; }
.pay-product-card { display:grid; grid-template-columns:64px 1fr; gap:11px; align-items:center; padding:10px; border-radius:22px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12); }
.pay-product-card img { width:64px; height:64px; border-radius:18px; object-fit:cover; background:#111827; }
.pay-product-card b { display:block; color:#fff; font-weight:1000; }
.pay-product-card small { display:block; color:rgba(255,255,255,.64); font-size:11.5px; line-height:1.35; }
.escrow-breakdown { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.escrow-breakdown span { padding:10px; border-radius:18px; background:rgba(255,255,255,.065); border:1px solid rgba(255,255,255,.10); min-width:0; }
.escrow-breakdown small { display:block; color:rgba(255,255,255,.58); font-size:10px; line-height:1.2; }
.escrow-breakdown b { display:block; color:#fff; font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.detail-actions .pay-now { box-shadow:0 15px 34px rgba(40,255,166,.12); }
.payment-result.order-result .payment-plan-line { white-space:normal !important; }
@media(max-width:390px){
  .wallet-stats,.escrow-breakdown{grid-template-columns:1fr!important;}
  .wallet-row-actions,.wallet-actions{grid-template-columns:1fr!important;}
  .pay-product-card{grid-template-columns:54px 1fr;}
  .pay-product-card img{width:54px;height:54px;border-radius:16px;}
  .account-wallet-card{align-items:flex-start;}
  .account-wallet-card button{padding:9px 10px;font-size:11px;}
}

/* v34 wallet and escrow transparency polish */
.buyer-pay-note,.seller-fee-note{display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:22px;background:linear-gradient(135deg,rgba(32,226,225,.11),rgba(255,47,126,.08));border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.buyer-pay-note span,.seller-fee-note span{width:42px;height:42px;display:grid;place-items:center;border-radius:16px;background:rgba(255,255,255,.08);color:#47fff4;flex:0 0 auto}.buyer-pay-note svg,.seller-fee-note svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2}.buyer-pay-note b{display:block;color:#fff;font-size:14px}.buyer-pay-note small,.seller-fee-note small,.auto-release-note{display:block;color:rgba(255,255,255,.68);line-height:1.35}.seller-fee-note small{font-size:12px}.report-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:10px}.report-grid span{display:grid;gap:4px;padding:10px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);text-align:center}.report-grid b{font-size:17px;color:#fff}.report-grid small{font-size:10.5px;color:rgba(255,255,255,.62)}.activity-row{display:grid;grid-template-columns:40px 1fr auto;gap:10px;align-items:center;padding:10px;border-radius:18px;background:rgba(255,255,255,.052);border:1px solid rgba(255,255,255,.09);margin-top:8px}.activity-row>span{width:40px;height:40px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(32,226,225,.22),rgba(255,47,126,.17));color:#fff}.activity-row svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2}.activity-row b{display:block;font-size:13px}.activity-row small{display:block;font-size:11px;color:rgba(255,255,255,.62)}.activity-row strong{font-size:12px;white-space:nowrap;color:#a6fff4}.wallet-order .auto-release-note,.wallet-order-card .auto-release-note{margin-top:4px;color:rgba(103,255,238,.72)!important}.wallet-order.released,.wallet-order-card.released{border-color:rgba(79,255,173,.18);background:linear-gradient(135deg,rgba(79,255,173,.08),rgba(255,255,255,.04))}.wallet-order.disputed,.wallet-order-card.disputed{border-color:rgba(255,191,78,.20);background:linear-gradient(135deg,rgba(255,191,78,.08),rgba(255,255,255,.04))}
@media(max-width:430px){.report-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.activity-row{grid-template-columns:36px 1fr}.activity-row strong{grid-column:2/-1}.buyer-pay-note,.seller-fee-note{border-radius:18px;padding:10px}.buyer-pay-note span,.seller-fee-note span{width:36px;height:36px;border-radius:14px}}

/* v36: AI polish, typewriter waiting states and buyer assistant */
.ai-card.thinking {
  border-color: rgba(24,243,238,.34) !important;
  box-shadow: 0 18px 44px rgba(24,243,238,.08), inset 0 1px 0 rgba(255,255,255,.08);
}
.ai-extra-notes { margin-top: 10px; min-height: 0; }
.ai-waiting {
  display: grid;
  justify-items: center;
  gap: 7px;
  padding: 18px 14px;
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(24,243,238,.10), rgba(255,47,126,.08));
  border: 1px solid rgba(255,255,255,.10);
  text-align: center;
}
.ai-waiting b { font-size: 13px; }
.ai-waiting small { color: rgba(255,255,255,.66); font-size: 11.5px; line-height: 1.35; }
.ai-note-pills, .ai-question-pills {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  margin-top: 10px;
}
.mini-ai-note {
  border-radius: 999px;
  padding: 8px 11px;
  border: 1px solid rgba(255,255,255,.13);
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: 11px;
  font-weight: 850;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.mini-ai-note:active { transform: scale(.98); }
button.loading { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.ai-assist-box {
  margin-top: 10px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px;
  border-radius: 24px;
  border: 1px solid rgba(24,243,238,.22);
  background: radial-gradient(circle at top left, rgba(24,243,238,.15), transparent 38%), linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.035));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 42px rgba(0,0,0,.18);
}
.ai-assist-box > span {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--cyan), var(--pink));
  box-shadow: 0 12px 25px rgba(24,243,238,.18);
}
.ai-assist-box svg { width: 22px; height: 22px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ai-assist-box b { display: block; font-size: 14px; font-weight: 950; letter-spacing: -.01em; }
.ai-assist-box small { display: block; margin-top: 3px; color: rgba(255,255,255,.72); line-height: 1.35; font-size: 12px; }
.ai-alt-strip {
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.ai-alt-strip button {
  min-width: 0;
  display: grid;
  gap: 5px;
  padding: 7px;
  border-radius: 18px;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.10);
  color: #fff;
  text-align: left;
}
.ai-alt-strip img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 14px; background: rgba(255,255,255,.06); }
.ai-alt-strip span { display: block; font-size: 10.5px; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ai-alt-strip b { font-size: 10px; color: var(--cyan); }
.smart-ai-answer { border-color: rgba(24,243,238,.24) !important; }
.smart-ai-answer #smartAiAnswer::after, #detailAiText::after, #aiDescription:not(:empty)::after {
  content: '';
  display: inline-block;
  width: 6px;
  height: 1em;
  margin-left: 3px;
  border-radius: 99px;
  background: rgba(255,255,255,.75);
  vertical-align: -2px;
  animation: aiCursor .8s steps(2) infinite;
}
@keyframes aiCursor { 50% { opacity: .08; } }
@media (max-width: 390px) {
  .ai-alt-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ai-assist-box { padding: 12px; border-radius: 22px; }
  .ai-assist-box > span { width: 38px; height: 38px; flex-basis: 38px; }
}

/* v36: AI Chat Concierge, sticky chat header and media clarity */
.ai-consult-box{position:relative;margin-top:4px;padding:12px;border-radius:24px;background:linear-gradient(145deg,rgba(24,243,238,.11),rgba(255,47,126,.065));border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.ai-consult-head{display:flex;align-items:center;gap:9px;margin-bottom:8px;color:#fff}.ai-consult-head b{font-size:13px;font-weight:950}.ai-consult-head small{margin-left:auto;color:rgba(255,255,255,.62);font-size:10px;font-weight:800}.ai-spark{width:31px;height:31px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--pink));color:#031015;font-size:11px;font-weight:1000;box-shadow:0 10px 24px rgba(24,243,238,.18)}
.ai-quick-prompts{display:flex;gap:7px;overflow-x:auto;padding:2px 0 9px;scrollbar-width:none}.ai-quick-prompts::-webkit-scrollbar{display:none}.ai-quick-prompts button{flex:0 0 auto;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.08);color:#fff;padding:8px 11px;font-size:11px;font-weight:900;white-space:nowrap}
.chat-card{display:flex;flex-direction:column;min-height:min(94dvh,780px);overflow:hidden!important;padding-top:0!important}.chat-sticky-head{position:sticky!important;top:0;z-index:30;margin:0 -4px 8px!important;padding:12px 2px 11px!important;background:linear-gradient(180deg,rgba(3,6,9,.99),rgba(3,6,9,.92));backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.10);box-shadow:0 12px 24px rgba(0,0,0,.22)}.chat-sticky-head h3{max-width:72vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-sticky-head em{display:block;margin-top:2px;color:rgba(255,255,255,.58);font-style:normal;font-size:11px;font-weight:800}.chat-product{flex:0 0 auto}.chat-ai-dock{flex:0 0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:7px 0 8px;background:linear-gradient(180deg,rgba(4,7,10,.96),rgba(4,7,10,.72));position:sticky;top:66px;z-index:24}.chat-ai-dock button{min-width:0;border:1px solid rgba(24,243,238,.20);border-radius:999px;background:rgba(24,243,238,.09);color:#f5ffff;padding:8px 5px;font-size:10px;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-ai-dock button.is-busy{font-size:0}.chat-ai-answer{flex:0 0 auto;margin:0 0 8px}.chat-ai-result{padding:12px;border-radius:20px;background:linear-gradient(145deg,rgba(24,243,238,.12),rgba(255,47,126,.075));border:1px solid rgba(255,255,255,.12);box-shadow:0 12px 32px rgba(0,0,0,.22)}.chat-ai-result p{margin:8px 0 0;font-size:13px;line-height:1.45;color:rgba(255,255,255,.9)}.ai-result-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.ai-result-top b{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--cyan)}.chat-ai-suggestions{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}.chat-ai-suggestion{border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;padding:7px 10px;font-size:11px;font-weight:850}.chat-messages{flex:1 1 auto;min-height:0!important;max-height:none!important;overflow-y:auto!important;padding-bottom:12px}.chat-input{flex:0 0 auto;position:sticky;bottom:0;z-index:26;background:linear-gradient(180deg,rgba(4,7,10,0),rgba(4,7,10,.98) 20%)}
.detail-ai-top{margin:-2px 0 12px}.detail-ai-top .ai-assist-box{margin-top:0!important;border-radius:22px;background:linear-gradient(145deg,rgba(24,243,238,.12),rgba(255,47,126,.07));box-shadow:0 14px 36px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.08)}.detail-media{background:radial-gradient(circle at 50% 42%,rgba(24,243,238,.08),rgba(2,4,6,1) 64%)!important}.detail-media .detail-main{object-fit:contain!important;object-position:center!important;background:transparent!important}.detail-media .detail-bg{opacity:.72;transform:scale(1.04)}.detail-media.loading::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at center,rgba(255,255,255,.07),rgba(0,0,0,.92));z-index:0}.detail-loader{position:absolute;z-index:6;left:50%;top:50%;transform:translate(-50%,-50%);transition:opacity .22s ease}.detail-media.loaded .detail-loader{opacity:0;pointer-events:none}.detail-thumbs img{object-fit:cover;background:#071014}.ai-assist-box svg{stroke:#fff;fill:none;stroke-width:2.1}.ai-question-pills,.ai-note-pills{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}.mini-ai-note{border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;padding:7px 9px;font-size:10.5px;font-weight:850}.ai-alt-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:10px}.ai-alt-strip button{min-width:0;text-align:left;padding:6px;border-radius:15px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.11);color:#fff}.ai-alt-strip img{width:100%;aspect-ratio:1/1;border-radius:11px;object-fit:cover;background:#071014}.ai-alt-strip span{display:block;font-size:10px;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ai-alt-strip b{font-size:9px;color:var(--cyan)}
@media (max-width:380px){.chat-ai-dock{grid-template-columns:repeat(2,minmax(0,1fr));top:62px}.chat-sticky-head h3{max-width:68vw}.ai-quick-prompts button{font-size:10px}.ai-alt-strip{grid-template-columns:1fr 1fr}.detail-media{height:min(48dvh,440px)!important}}

/* v36 final polish: AI visibility, sticky chat, reliable detail photos */
.top-row{grid-template-columns:auto minmax(0,1fr) 42px 42px 42px!important;}
.ai-top-btn{display:grid;place-items:center;width:42px;height:42px;border-radius:16px;border:1px solid rgba(24,243,238,.24)!important;background:linear-gradient(135deg,rgba(24,243,238,.18),rgba(255,47,126,.13))!important;color:#fff;box-shadow:0 10px 26px rgba(24,243,238,.12),inset 0 1px 0 rgba(255,255,255,.12)}
.ai-top-btn b{font-size:12px;font-weight:1000;letter-spacing:-.02em;background:linear-gradient(135deg,#18f3ee,#ff5aa5);-webkit-background-clip:text;background-clip:text;color:transparent}
.ai-help-card textarea,.ai-help-card input{width:100%;}
.ai-help-card .ai-help-results{margin-top:12px;display:grid;gap:10px;max-height:50dvh;overflow:auto;padding-right:2px}
.ai-hero-strip{display:flex;gap:12px;align-items:center;margin:4px 0 12px;padding:13px;border-radius:24px;background:linear-gradient(145deg,rgba(24,243,238,.13),rgba(255,47,126,.08));border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.ai-hero-strip>span{width:42px;height:42px;display:grid;place-items:center;border-radius:17px;background:linear-gradient(135deg,var(--cyan),var(--pink));color:#031015;font-weight:1000;box-shadow:0 14px 30px rgba(24,243,238,.18)}
.ai-hero-strip b{display:block;font-size:14px;font-weight:1000}.ai-hero-strip small{display:block;margin-top:3px;color:rgba(255,255,255,.66);font-size:11.5px;line-height:1.35}
.ai-quick-row{display:flex;gap:7px;overflow-x:auto;padding:2px 0 9px;scrollbar-width:none}.ai-quick-row::-webkit-scrollbar{display:none}.ai-quick-row button{flex:0 0 auto;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.08);color:#fff;padding:8px 11px;font-size:11px;font-weight:900;white-space:nowrap}
.chat-card{display:flex!important;flex-direction:column!important;max-height:min(94dvh,820px)!important;overflow:hidden!important;padding-top:0!important;}
.chat-sticky-head{flex:0 0 auto;position:sticky!important;top:0!important;z-index:40!important;margin:0 -4px 8px!important;padding:12px 3px 11px!important;background:linear-gradient(180deg,rgba(4,7,11,.995),rgba(4,7,11,.93));backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.10);box-shadow:0 14px 26px rgba(0,0,0,.25)}
.chat-head-actions{display:flex;align-items:center;gap:7px}.chat-ai-btn{border:1px solid rgba(24,243,238,.25);border-radius:999px;background:rgba(24,243,238,.12);color:#eaffff;padding:8px 10px;font-size:11px;font-weight:950;white-space:nowrap}.chat-ai-btn:disabled{opacity:.6}
.chat-product{flex:0 0 auto}.chat-ai-dock{flex:0 0 auto;display:flex!important;gap:7px;overflow-x:auto;position:sticky;top:64px;z-index:31;padding:6px 0 8px;background:linear-gradient(180deg,rgba(5,8,12,.97),rgba(5,8,12,.78));scrollbar-width:none}.chat-ai-dock::-webkit-scrollbar{display:none}.chat-ai-dock button{flex:0 0 auto;border:1px solid rgba(24,243,238,.18);border-radius:999px;background:rgba(24,243,238,.08);color:#fff;padding:8px 11px;font-size:11px;font-weight:900;white-space:nowrap}.chat-ai-dock button:disabled{opacity:.55}
.chat-ai-answer{flex:0 0 auto;margin:0 0 8px}.chat-ai-card{padding:12px;border-radius:21px;background:linear-gradient(145deg,rgba(24,243,238,.13),rgba(255,47,126,.08));border:1px solid rgba(255,255,255,.12);box-shadow:0 12px 30px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.08)}.chat-ai-title{display:flex;align-items:center;gap:8px}.chat-ai-title span{width:28px;height:28px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(135deg,var(--cyan),var(--pink));color:#061114;font-size:10px;font-weight:1000}.chat-ai-card p{margin:9px 0 0;color:rgba(255,255,255,.92);font-size:13px;line-height:1.47}.chat-ai-card small{display:block;margin-top:7px;color:rgba(255,255,255,.65);line-height:1.4}.chat-ai-card .chat-ai-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.chat-ai-card .chat-ai-actions .primary,.chat-ai-card .chat-ai-actions .soft{padding:8px 10px;border-radius:999px;font-size:11px}
.chat-messages{flex:1 1 auto!important;min-height:0!important;max-height:none!important;overflow-y:auto!important;padding-bottom:12px}.chat-input{flex:0 0 auto;position:sticky;bottom:0;z-index:35;background:linear-gradient(180deg,rgba(5,8,12,0),rgba(5,8,12,.98) 20%);padding-top:10px}
.detail-media{isolation:isolate;background:radial-gradient(circle at 50% 45%,rgba(24,243,238,.09),rgba(2,4,6,1) 68%)!important;min-height:280px}.detail-media .detail-main{object-fit:contain!important;object-position:center center!important;background:transparent!important;opacity:1;transition:opacity .2s ease,transform .25s ease;z-index:2}.detail-media .detail-bg{object-fit:cover!important;opacity:.66!important;transform:scale(1.06);z-index:0}.detail-media-loader{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:54px;height:54px;border-radius:22px;background:rgba(2,5,8,.72);border:1px solid rgba(255,255,255,.11);box-shadow:0 20px 42px rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:opacity .18s ease}.detail-media.is-loading .detail-media-loader,.detail-media.is-preloading .detail-media-loader{opacity:1}.detail-media.is-preloading .detail-main{opacity:.82;transform:scale(.996)}.detail-thumbs{display:flex;gap:8px;overflow-x:auto;padding:2px 1px 10px;scrollbar-width:none}.detail-thumbs::-webkit-scrollbar{display:none}.detail-thumbs button{flex:0 0 58px;height:58px;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.06);padding:2px}.detail-thumbs button.active{border-color:rgba(24,243,238,.75);box-shadow:0 0 0 3px rgba(24,243,238,.12)}.detail-thumbs img{width:100%;height:100%;object-fit:cover;border-radius:15px;background:#071014}.photo-count{z-index:4;bottom:14px;right:14px;top:auto!important;left:auto!important;background:rgba(0,0,0,.52);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.12);color:#fff;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:950}.ai-assist-box.priority{margin:10px 0 12px;border-color:rgba(24,243,238,.26);background:linear-gradient(145deg,rgba(24,243,238,.12),rgba(255,47,126,.07));}
@media (max-width:390px){.top-row{grid-template-columns:minmax(82px,94px) minmax(128px,1fr) 38px 38px 38px!important;gap:5px}.ai-top-btn{width:38px;height:38px;border-radius:14px}.feed-tabs button{font-size:10px;padding:7px 5px}.chat-sticky-head h3{max-width:62vw}.chat-ai-dock{top:61px}.detail-media{height:min(47dvh,430px)!important;min-height:255px}.detail-thumbs button{flex-basis:52px;height:52px}}

/* v36 final tiny polish */
.detail-media:not(.loading) .detail-loader{opacity:0;pointer-events:none}.detail-media.loading .detail-main{opacity:.92}.chat-ai-answer.hidden{display:none!important}.ai-help-results .ai-answer,.ai-answer{min-height:44px}.ai-help-card textarea{resize:vertical}.chat-head-actions{display:flex;align-items:center;gap:8px}.chat-ai-btn{border:1px solid rgba(24,243,238,.28);background:linear-gradient(135deg,rgba(24,243,238,.16),rgba(255,47,126,.10));color:#fff;border-radius:999px;padding:8px 10px;font-size:11px;font-weight:1000}

/* v36.1: always-visible AI, stable chat header and no-black detail media */
.ai-coach-fab{
  position:fixed;
  right:calc(14px + env(safe-area-inset-right));
  bottom:calc(82px + env(safe-area-inset-bottom));
  z-index:85;
  width:56px;
  height:56px;
  border:1px solid rgba(24,243,238,.34);
  border-radius:22px;
  background:radial-gradient(circle at 25% 15%,rgba(255,255,255,.42),transparent 18%),linear-gradient(135deg,#18f3ee,#ff2f7e 72%);
  color:#051014;
  box-shadow:0 18px 44px rgba(24,243,238,.22),0 12px 34px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.35);
  display:grid;
  place-items:center;
  padding:0;
}
.ai-coach-fab span{font-size:11px;font-weight:1000;line-height:1;letter-spacing:.04em}.ai-coach-fab b{font-size:12px;line-height:1;margin-top:-16px;font-weight:1000}.ai-coach-fab:active{transform:scale(.96)}
.ai-help-empty,.ai-advice-card{display:flex;gap:12px;align-items:flex-start;padding:13px;border-radius:24px;background:linear-gradient(145deg,rgba(24,243,238,.11),rgba(255,47,126,.07));border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.ai-advice-card{display:block}.ai-advice-card p{margin:9px 0 0;color:rgba(255,255,255,.92);font-size:13px;line-height:1.47}.ai-help-empty b{display:block;font-size:14px}.ai-help-empty small{display:block;margin-top:3px;color:rgba(255,255,255,.66);line-height:1.35;font-size:12px}
.chat-card{height:min(94dvh,820px)!important;min-height:min(94dvh,820px)!important}.chat-sticky-head{position:sticky!important;top:0!important;flex:0 0 auto!important}.chat-product,.chat-ai-dock,.chat-ai-answer,.chat-ai-panel,.chat-image-preview,.chat-input{flex:0 0 auto!important}.chat-messages{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overscroll-behavior:contain}.chat-ai-panel{margin:0 0 8px}.chat-ai-panel.hidden{display:none!important}.chat-ai-panel-inner{padding:12px;border-radius:22px;background:linear-gradient(145deg,rgba(24,243,238,.12),rgba(255,47,126,.075));border:1px solid rgba(255,255,255,.12);box-shadow:0 12px 28px rgba(0,0,0,.22)}.ai-mini-head{display:flex;gap:10px;align-items:center}.ai-mini-head>span{width:34px;height:34px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--pink));color:#041015}.ai-mini-head svg{width:19px;height:19px;stroke:currentColor;fill:none}.ai-mini-head b{display:block}.ai-mini-head small{display:block;color:rgba(255,255,255,.66);font-size:11px;line-height:1.35}.chat-ai-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.chat-ai-actions button{font-size:11px!important;padding:8px 10px!important;border-radius:999px!important}.chat-ai-output{margin-top:10px}.chat-ai-output small{color:rgba(255,255,255,.67)}
.detail-media{min-height:292px!important;background:radial-gradient(circle at 50% 42%,rgba(24,243,238,.10),rgba(2,4,6,1) 72%)!important}.detail-media .detail-main{object-fit:contain!important;object-position:center center!important;background:rgba(2,4,6,.18)!important;opacity:1!important;filter:none!important}.detail-media .detail-bg{filter:blur(24px) brightness(.60) saturate(1.18)!important;opacity:.82!important}.detail-media.loading .detail-main,.detail-media.is-preloading .detail-main{opacity:.88!important}.detail-media.is-changing .detail-main{transform:scale(.998)}.detail-loader{position:absolute;z-index:8;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:21px;background:rgba(1,5,8,.70);border:1px solid rgba(255,255,255,.14);box-shadow:0 20px 42px rgba(0,0,0,.34);display:grid!important;place-items:center;opacity:0;pointer-events:none;transition:opacity .16s ease}.detail-media.loading .detail-loader,.detail-media.is-preloading .detail-loader{opacity:1}.detail-media.loaded:not(.is-preloading) .detail-loader{opacity:0}.detail-media.loading::before{opacity:.45!important}.detail-thumbs img{object-fit:contain!important;background:linear-gradient(145deg,#061017,#0b121a)!important}.detail-thumbs button.active img{background:#061017!important}
@media(max-width:390px){.ai-coach-fab{right:10px;bottom:calc(74px + env(safe-area-inset-bottom));width:50px;height:50px;border-radius:19px}.chat-card{height:94dvh!important;min-height:94dvh!important}.detail-media{min-height:260px!important}}

/* v36 final AI/chat/media polish */
.ai-coach-fab{
  position:fixed;left:14px;bottom:calc(78px + env(safe-area-inset-bottom));z-index:70;
  width:58px;height:58px;border:1px solid rgba(24,243,238,.28);border-radius:22px;
  background:linear-gradient(145deg,rgba(24,243,238,.22),rgba(255,47,126,.18) 72%),rgba(6,9,14,.88);
  color:#fff;box-shadow:0 18px 44px rgba(0,0,0,.40),0 0 0 1px rgba(255,255,255,.07) inset;
  backdrop-filter:blur(18px);display:grid;place-items:center;gap:0;
}
.ai-coach-fab span{font-size:12px;font-weight:1000;letter-spacing:.02em;line-height:1;background:linear-gradient(135deg,#18f3ee,#fff,#ff5aa5);-webkit-background-clip:text;background-clip:text;color:transparent}
.ai-coach-fab b{font-size:10px;line-height:1;color:rgba(255,255,255,.82);margin-top:-9px}
.ai-coach-fab:active{transform:scale(.97)}
.chat-ai-panel{flex:0 0 auto;margin:0 0 8px}.chat-ai-panel.hidden{display:none!important}.chat-ai-panel-inner{padding:12px;border-radius:20px;background:linear-gradient(145deg,rgba(24,243,238,.12),rgba(255,47,126,.08));border:1px solid rgba(255,255,255,.12);box-shadow:0 14px 34px rgba(0,0,0,.26)}.ai-mini-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}.ai-mini-head>span{width:34px;height:34px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(24,243,238,.2),rgba(255,47,126,.16));border:1px solid rgba(255,255,255,.13)}.ai-mini-head svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2}.ai-mini-head b{display:block;font-size:13px}.ai-mini-head small{display:block;color:rgba(255,255,255,.62);font-size:11px}.chat-ai-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:8px}.chat-ai-actions button,.ai-chat-btn{border:1px solid rgba(24,243,238,.18);background:rgba(255,255,255,.08);color:#fff;border-radius:999px;padding:9px 10px;font-size:11px;font-weight:950}.ai-chat-btn{flex:0 0 auto;padding:0 12px;min-height:42px;background:linear-gradient(135deg,rgba(24,243,238,.16),rgba(255,47,126,.12));letter-spacing:.02em}.ai-chat-answer p{font-size:13px;line-height:1.48;color:rgba(255,255,255,.9);margin:8px 0}.chat-ai-result .primary.wide{margin-top:10px}.chat-ai-dock button:active,.chat-ai-suggestion:active{transform:scale(.98)}
.detail-media{overflow:hidden!important;border-radius:26px!important;min-height:286px;background:linear-gradient(180deg,#081014,#030507)!important}.detail-media .detail-main{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center center!important;filter:drop-shadow(0 10px 28px rgba(0,0,0,.25));transition:opacity .24s ease,transform .32s ease}.detail-media.is-changing .detail-main{opacity:.45;transform:scale(.985)}.detail-media .detail-bg{width:100%!important;height:100%!important;object-fit:cover!important;filter:blur(22px) saturate(1.15);opacity:.64}.detail-media.loaded .detail-main{opacity:1}.detail-media.loading .detail-main{opacity:.72}.detail-thumbs{scrollbar-width:none}.detail-thumbs::-webkit-scrollbar{display:none}.detail-thumbs button{position:relative;overflow:hidden}.detail-thumbs button::after{content:'';position:absolute;inset:0;border-radius:inherit;border:2px solid transparent;transition:.2s ease}.detail-thumbs button.active::after{border-color:#18f3ee;box-shadow:0 0 0 2px rgba(24,243,238,.16) inset}.detail-thumbs img{display:block;width:100%;height:100%;object-fit:cover;transform:translateZ(0)}
@media (max-width:390px){.ai-coach-fab{left:10px;bottom:calc(72px + env(safe-area-inset-bottom));width:52px;height:52px;border-radius:19px}.chat-ai-dock button{font-size:9.8px;padding:8px 4px}.chat-ai-actions{grid-template-columns:1fr}.ai-chat-btn{padding:0 10px;font-size:10px}.chat-input input{min-width:0}.detail-media{min-height:248px!important;border-radius:22px!important}}

/* v36 final polish: AI visibility, sticky chat, product media safety */
.ai-top-btn{
  min-width:42px!important;
  padding:0 10px!important;
  border-radius:16px!important;
  font-weight:1000!important;
  letter-spacing:.02em!important;
  background:linear-gradient(135deg, rgba(30,246,244,.18), rgba(255,47,126,.17))!important;
  border-color:rgba(255,255,255,.16)!important;
  color:#fff!important;
  box-shadow:0 12px 30px rgba(20,240,238,.10), inset 0 1px 0 rgba(255,255,255,.10)!important;
}
.ai-help-card textarea{min-height:92px;resize:vertical;border-radius:22px!important;line-height:1.45!important;}
.ai-help-results{display:grid;gap:10px;margin-top:10px;max-height:42dvh;overflow:auto;padding-bottom:8px;}
.ai-hero-strip{display:flex;gap:12px;align-items:center;margin:6px 0 12px;padding:12px;border-radius:24px;background:radial-gradient(circle at top left,rgba(30,246,244,.18),transparent 42%),rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.12)}
.ai-hero-strip>span{width:42px;height:42px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--pink));font-weight:1000}.ai-hero-strip b,.ai-hero-strip small{display:block}.ai-hero-strip small{color:rgba(255,255,255,.68);line-height:1.35}.ai-quick-row{display:flex;gap:8px;overflow:auto;padding:2px 0 8px}.ai-quick-row button{white-space:nowrap;border-radius:999px;padding:9px 12px;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.075);color:#fff;font-weight:850}
.chat-card{display:flex!important;flex-direction:column!important;min-height:min(88dvh,720px)!important;overflow:hidden!important;padding-top:10px!important;}
.chat-sticky-head{position:sticky!important;top:0!important;z-index:30!important;margin:0 -2px 8px!important;padding:10px 4px 12px!important;background:linear-gradient(180deg,rgba(8,10,16,.98),rgba(8,10,16,.86))!important;backdrop-filter:blur(22px)!important;border-bottom:1px solid rgba(255,255,255,.08)!important;}
.chat-sticky-head h3{max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-sticky-head em{display:block;font-size:11px;color:rgba(255,255,255,.62);font-style:normal;margin-top:2px}.chat-head-actions{display:flex;gap:8px;align-items:center}.chat-ai-btn{min-width:42px;border-radius:999px;padding:9px 12px;background:linear-gradient(135deg,rgba(30,246,244,.18),rgba(255,47,126,.14));border:1px solid rgba(255,255,255,.14);color:#fff;font-weight:1000}.chat-product{flex:0 0 auto}.chat-ai-dock{position:sticky;top:62px;z-index:22;display:flex;gap:7px;overflow:auto;padding:6px 2px 8px;background:linear-gradient(180deg,rgba(8,10,16,.82),rgba(8,10,16,.55));backdrop-filter:blur(18px)}.chat-ai-dock button{white-space:nowrap;border-radius:999px;padding:8px 11px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.07);color:#fff;font-size:11px;font-weight:900}.chat-ai-answer{flex:0 0 auto;margin:5px 0 8px}.chat-ai-result,.ai-chat-answer{padding:12px;border-radius:22px;background:radial-gradient(circle at 0 0,rgba(30,246,244,.14),transparent 42%),rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.11);box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}.ai-result-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}.chat-ai-result p,.ai-chat-answer p{margin:0;color:rgba(255,255,255,.86);line-height:1.45}.chat-ai-suggestions{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0}.chat-messages{flex:1 1 auto!important;min-height:180px!important;overflow-y:auto!important;padding-bottom:10px!important;scrollbar-width:thin}.chat-input{position:sticky!important;bottom:0!important;z-index:25!important;background:linear-gradient(0deg,rgba(8,10,16,.98),rgba(8,10,16,.80))!important;backdrop-filter:blur(18px)!important;padding-top:9px!important;}
.detail-media{background:#06080d!important;isolation:isolate!important;}
.detail-media.loading::before{content:'';position:absolute;inset:0;z-index:2;background:linear-gradient(120deg,rgba(255,255,255,.035),rgba(255,255,255,.075),rgba(255,255,255,.03));animation:vcMediaPulse 1.1s ease-in-out infinite;pointer-events:none}.detail-loader{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:5;padding:10px 12px;border-radius:999px;background:rgba(3,7,11,.58);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(12px);box-shadow:0 14px 35px rgba(0,0,0,.28)}.detail-media:not(.loading) .detail-loader{display:none!important}.detail-media .detail-main{object-fit:contain!important;background:transparent!important;transition:opacity .24s ease,transform .24s ease!important}.detail-media .detail-bg{opacity:.72!important;transform:scale(1.03);transition:opacity .28s ease!important}.detail-media.is-changing .detail-main{opacity:.26;transform:scale(.985)}.detail-media.is-changing .detail-bg{opacity:.35}.detail-count{right:14px!important;bottom:14px!important;top:auto!important;left:auto!important;background:rgba(0,0,0,.48)!important;border:1px solid rgba(255,255,255,.16)!important;backdrop-filter:blur(12px)!important}.detail-thumbs{display:flex!important;gap:8px!important;overflow-x:auto!important;padding:4px 2px 10px!important}.detail-thumbs button{flex:0 0 58px!important;width:58px!important;height:58px!important;border-radius:18px!important;border:1px solid rgba(255,255,255,.14)!important;background:rgba(255,255,255,.065)!important;overflow:hidden!important;padding:3px!important}.detail-thumbs button.active{border-color:rgba(30,246,244,.65)!important;box-shadow:0 0 0 2px rgba(30,246,244,.14)!important}.detail-thumbs img{width:100%!important;height:100%!important;object-fit:cover!important;border-radius:14px!important;display:block!important}
@keyframes vcMediaPulse{0%,100%{opacity:.52}50%{opacity:.95}}
@media(max-width:390px){.chat-sticky-head h3{max-width:160px}.chat-ai-dock{top:58px}.ai-help-results{max-height:38dvh}.detail-media{height:min(48dvh,440px)!important}.detail-thumbs button{flex-basis:52px!important;width:52px!important;height:52px!important;border-radius:16px!important}}

/* v38: AI placement, cleaner brand, sticky chat header and smarter detail polish */
.top-row{grid-template-columns:auto 1fr 42px 42px!important;gap:8px!important}
.brand{min-width:58px!important;grid-template-columns:1fr!important;place-items:center!important;gap:2px!important;text-align:center!important;line-height:.88!important}
.brand img{width:36px!important;height:36px!important;border-radius:12px!important;box-shadow:0 0 20px rgba(24,243,238,.28),0 0 0 1px rgba(255,255,255,.12) inset!important}
.brand-stack{display:block!important;line-height:.9!important;margin-top:-2px!important}.brand-vi{display:none!important}.brand-connects{font-size:11px!important;letter-spacing:-.035em!important;font-weight:1000!important;background:linear-gradient(135deg,#fff 8%,var(--cyan) 54%,var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none!important}
.tiny-ai{width:42px!important;height:42px!important;border-radius:999px!important;border:1px solid rgba(24,243,238,.24)!important;background:linear-gradient(135deg,rgba(24,243,238,.18),rgba(255,47,126,.14))!important;color:#fff!important;font-size:12px!important;font-weight:1000!important;letter-spacing:.02em!important;box-shadow:0 12px 30px rgba(24,243,238,.10),inset 0 1px 0 rgba(255,255,255,.11)!important}.tiny-ai::before{content:'✦';font-size:12px;margin-right:-2px;color:var(--cyan)}
.ai-coach-fab{display:none!important}.ai-top-btn{display:none!important}.location-row{gap:7px!important}.ghost-dot{padding:0 10px!important}.area-chip{max-width:42%!important}
@media(max-width:390px){.top-row{grid-template-columns:58px minmax(126px,1fr) 38px 38px!important;gap:6px!important}.brand img{width:32px!important;height:32px!important}.brand-connects{font-size:10px!important}.tiny-ai,.tiny-lang,.icon-btn,.round-btn{width:38px!important;height:38px!important}.feed-tabs{max-width:172px!important}.feed-tabs button{font-size:11px!important;padding:7px 7px!important}.ghost-dot b{display:none}.ghost-dot{width:38px!important;padding:0!important;justify-content:center}.area-chip{max-width:46%!important}}

/* Keep chat identity visible while typing, including when mobile keyboard is open. */
#chatSheet[open] .chat-card{position:fixed!important;left:50%!important;transform:translateX(-50%)!important;right:auto!important;bottom:0!important;width:min(100vw,460px)!important;height:100dvh!important;max-height:100dvh!important;min-height:100dvh!important;border-radius:0!important;padding:calc(82px + env(safe-area-inset-top)) 14px calc(12px + env(safe-area-inset-bottom))!important;overflow:hidden!important;background:rgba(4,7,11,.985)!important}
#chatSheet[open] .sheet-bar{display:none!important}
#chatSheet[open] .chat-sticky-head{position:fixed!important;top:0!important;left:50%!important;transform:translateX(-50%)!important;width:min(100vw,460px)!important;z-index:999!important;margin:0!important;padding:calc(12px + env(safe-area-inset-top)) 14px 12px!important;border-radius:0 0 24px 24px!important;background:linear-gradient(180deg,rgba(3,5,9,.98),rgba(9,13,18,.94))!important;box-shadow:0 20px 44px rgba(0,0,0,.46),0 1px 0 rgba(255,255,255,.08) inset!important;backdrop-filter:blur(24px)!important}
#chatSheet[open] .chat-sticky-head small{color:var(--cyan)!important;letter-spacing:.06em!important}#chatSheet[open] .chat-sticky-head h3{max-width:68vw!important;font-size:18px!important;line-height:1.04!important}#chatSheet[open] .chat-sticky-head em{font-size:10.5px!important;color:rgba(255,255,255,.64)!important}
#chatSheet[open] .chat-product{flex:0 0 auto!important}.chat-messages{overscroll-behavior:contain!important}.chat-input{border-top:1px solid rgba(255,255,255,.08)!important}

/* AI cards should feel branded without fusing “Vi AI” into product names. */
.ai-assist-box>span,.ai-result-top::before,.ai-answer>span{box-shadow:0 12px 26px rgba(24,243,238,.14)!important}.ai-result-top b,.chat-ai-result b{letter-spacing:-.02em!important}.ai-answer b,.ai-assist-box b{word-spacing:.02em!important}.ai-brand-mark{width:34px;height:34px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--pink));box-shadow:0 12px 28px rgba(24,243,238,.18);font-size:0}.ai-brand-mark::before{content:'✦';font-size:17px;color:#061015;font-weight:1000}
.ai-alt-strip{margin-top:12px!important}.ai-alt-strip:empty{display:none!important}.ai-alt-strip button{background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.12)!important}.ai-alt-empty{display:none!important}
.detail-media{height:min(44dvh,420px)!important;min-height:290px!important}.detail-media .detail-main{object-fit:contain!important;object-position:center center!important;max-width:100%!important;max-height:100%!important}.detail-media .detail-bg{object-fit:cover!important;opacity:.55!important}.detail-main[style*="display: none"]{display:block!important}
@media(max-width:390px){#chatSheet[open] .chat-card{padding-top:calc(78px + env(safe-area-inset-top))!important}.detail-media{height:min(42dvh,392px)!important;min-height:250px!important}.ai-alt-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important}}

/* v39: chat send icon, sticky header under keyboard, full-photo viewer and detail media polish */
.chat-input {
  grid-template-columns: auto minmax(0, 1fr) 52px !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 10px 0 calc(8px + env(safe-area-inset-bottom)) !important;
}
.chat-input .attach-btn {
  width: 48px !important;
  height: 48px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.075) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}
.chat-input input#chatText {
  min-height: 48px !important;
  border-radius: 18px !important;
  padding: 0 15px !important;
  border: 1px solid rgba(24,243,238,.36) !important;
  box-shadow: 0 0 0 2px rgba(24,243,238,.05), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
.chat-send-icon {
  width: 50px !important;
  height: 50px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 20px !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: linear-gradient(135deg, var(--cyan), var(--pink)) !important;
  box-shadow: 0 14px 30px rgba(255,47,126,.20), 0 0 26px rgba(24,243,238,.16) !important;
  color: #061015 !important;
  padding: 0 !important;
  font-size: 0 !important;
  flex: 0 0 50px !important;
}
.chat-send-icon svg {
  width: 23px !important;
  height: 23px !important;
  stroke: #061015 !important;
  stroke-width: 2.4 !important;
  fill: none !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.chat-send-icon.loading { opacity: .72; pointer-events: none; }
.chat-send-icon.loading svg { opacity: .25; }
.chat-send-icon.loading::after {
  content: '';
  width: 20px;
  height: 20px;
  border-radius: 999px;
  border: 2px solid rgba(6,16,21,.25);
  border-top-color: #061015;
  animation: vcSpin .7s linear infinite;
  position: absolute;
}
@keyframes vcSpin { to { transform: rotate(360deg); } }
#chatSheet[open] .chat-card {
  padding-top: calc(92px + env(safe-area-inset-top)) !important;
}
#chatSheet[open] .chat-sticky-head {
  min-height: calc(76px + env(safe-area-inset-top)) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
#chatSheet[open] .chat-sticky-head h3 {
  font-size: 19px !important;
  max-width: 58vw !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.chat-keyboard-open #chatSheet[open] .chat-sticky-head {
  position: fixed !important;
  top: 0 !important;
  transform: translateX(-50%) translateZ(0) !important;
}
#chatSheet[open] .chat-ai-dock {
  top: calc(78px + env(safe-area-inset-top)) !important;
}
#chatSheet[open] .chat-messages {
  scroll-padding-top: 110px !important;
}

.detail-card { overflow: hidden auto !important; }
.detail-media {
  height: min(60dvh, 610px) !important;
  min-height: 360px !important;
  border-radius: 30px !important;
  cursor: zoom-in !important;
  background: radial-gradient(circle at 50% 43%, rgba(24,243,238,.10), rgba(2,4,6,1) 70%) !important;
}
.detail-media .detail-main {
  object-fit: contain !important;
  object-position: center center !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  filter: drop-shadow(0 18px 32px rgba(0,0,0,.28));
}
.detail-media .detail-bg {
  filter: blur(22px) brightness(.46) saturate(1.18) !important;
  opacity: .82 !important;
  transform: scale(1.10) !important;
}
.detail-zoom-btn {
  position: absolute;
  z-index: 7;
  right: 14px;
  top: 14px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(5,8,12,.48);
  color: #fff;
  backdrop-filter: blur(16px);
  display: grid;
  place-items: center;
  box-shadow: 0 14px 32px rgba(0,0,0,.28);
}
.detail-zoom-btn svg { width: 21px; height: 21px; stroke: #fff; fill: none; stroke-width: 2.15; stroke-linecap: round; stroke-linejoin: round; }
.detail-count { bottom: 14px !important; right: 14px !important; }
.detail-thumbs button { flex: 0 0 64px !important; width: 64px !important; height: 64px !important; }
.detail-thumbs img { object-fit: cover !important; }

.image-viewer {
  width: 100vw;
  height: 100dvh;
  max-width: none;
  max-height: none;
  border: 0;
  padding: 0;
  background: rgba(1,3,6,.96);
  overflow: hidden;
}
.image-viewer::backdrop { background: rgba(0,0,0,.78); backdrop-filter: blur(8px); }
.image-viewer img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  transition: transform .22s ease;
  touch-action: manipulation;
}
.image-viewer img.zoomed { transform: scale(1.65); cursor: zoom-out; }
.image-viewer-close,
.image-viewer-zoom {
  position: fixed;
  z-index: 10;
  top: calc(14px + env(safe-area-inset-top));
  width: 46px;
  height: 46px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  color: #fff;
  backdrop-filter: blur(14px);
  font-weight: 1000;
  font-size: 24px;
}
.image-viewer-close { right: 14px; }
.image-viewer-zoom { right: 70px; font-size: 18px; }
#imageViewerCount {
  position: fixed;
  left: 50%;
  bottom: calc(18px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  padding: 9px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.18);
  color: #fff;
  backdrop-filter: blur(12px);
  font-weight: 900;
}

.ai-assist-box.priority {
  scroll-margin-top: 108px !important;
}
.ai-assist-box.is-thinking {
  animation: vcAiGlow 1.25s ease-in-out infinite alternate;
}
@keyframes vcAiGlow { from { box-shadow: 0 16px 34px rgba(24,243,238,.10); } to { box-shadow: 0 18px 46px rgba(255,47,126,.16); } }

@media(max-width:390px){
  .detail-media { height:min(58dvh,540px)!important; min-height:330px!important; border-radius:24px!important; }
  .detail-zoom-btn { width:40px; height:40px; right:10px; top:10px; }
  .detail-thumbs button { flex-basis:56px!important; width:56px!important; height:56px!important; }
  #chatSheet[open] .chat-sticky-head h3 { max-width:52vw!important; }
  .chat-input { grid-template-columns:46px minmax(0,1fr) 48px!important; }
  .chat-send-icon { width:48px!important;height:48px!important; }
}


/* v40: Account restore, 48h chat, emoji, keyboard-safe chat and bigger brand polish */
:root{--vc-vvh:100dvh;--vc-vvo:0px}
.brand img{width:42px!important;height:42px!important;border-radius:14px!important}.brand-connects{font-size:12px!important;line-height:.86!important}.brand{min-width:64px!important}
.signin-card{display:grid;gap:10px;margin:0 0 12px;padding:13px;border-radius:24px;background:linear-gradient(135deg,rgba(24,243,238,.11),rgba(255,47,126,.07));border:1px solid rgba(255,255,255,.13);box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}
.signin-card b{display:block;color:#fff;font-size:14px}.signin-card small{display:block;color:rgba(255,255,255,.65);line-height:1.35;margin-top:3px}.signin-card.compact-ok{background:rgba(37,238,151,.065);border-color:rgba(37,238,151,.18)}
.signin-row{display:grid;grid-template-columns:1fr auto;gap:8px}.signin-row input{min-width:0}.signin-row button{white-space:nowrap;padding-inline:14px}
#chatSheet[open] .chat-card{top:var(--vc-vvo)!important;bottom:auto!important;height:var(--vc-vvh)!important;min-height:var(--vc-vvh)!important;max-height:var(--vc-vvh)!important;padding-top:calc(84px + env(safe-area-inset-top))!important;padding-bottom:calc(10px + env(safe-area-inset-bottom))!important}
#chatSheet[open] .chat-sticky-head{top:var(--vc-vvo)!important}
#chatSheet[open] .chat-messages{padding-bottom:12px!important;scroll-padding-bottom:100px!important}.chat-keyboard-open #chatSheet[open] .chat-product{display:none!important}.chat-keyboard-open #chatSheet[open] .chat-ai-dock{position:relative!important;top:auto!important;z-index:1!important;padding:4px 0 6px!important;background:rgba(4,7,11,.70)!important}.chat-keyboard-open #chatSheet[open] .chat-ai-dock button{padding:7px 10px!important;font-size:10px!important}
.chat-input{grid-template-columns:auto auto minmax(0,1fr) 52px!important;align-items:end!important}.emoji-btn{width:48px;height:48px;border-radius:18px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.075);color:#fff;font-size:22px;font-weight:900;display:grid;place-items:center}.emoji-panel{flex:0 0 auto;display:flex;gap:7px;overflow-x:auto;padding:8px 2px;margin-top:4px;scrollbar-width:none}.emoji-panel::-webkit-scrollbar{display:none}.emoji-panel.hidden{display:none!important}.emoji-panel button{flex:0 0 38px;width:38px;height:38px;border-radius:15px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.075);display:grid;place-items:center;font-size:20px;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.chat-input input{height:52px!important}.chat-send-icon{height:52px!important;width:52px!important}
.detail-media{height:min(58dvh,560px)!important;min-height:360px!important;background:#05070b!important}.detail-media .detail-main{object-fit:contain!important;object-position:center center!important;width:100%!important;height:100%!important}.detail-card .sheet-title{position:sticky;top:0;z-index:20;background:linear-gradient(180deg,rgba(3,6,10,.98),rgba(3,6,10,.82));backdrop-filter:blur(18px);padding-top:4px!important}
.ai-answer,.ai-assist-box,.chat-ai-result{scroll-margin-top:calc(96px + env(safe-area-inset-top))!important}
@media(max-width:390px){.brand img{width:38px!important;height:38px!important}.brand-connects{font-size:11px!important}.brand{min-width:60px!important}.signin-row{grid-template-columns:1fr}.chat-input{grid-template-columns:42px 42px minmax(0,1fr) 46px!important;gap:7px!important}.emoji-btn,.chat-input .attach-btn{width:42px!important;height:42px!important;border-radius:16px!important}.chat-send-icon{width:46px!important;height:46px!important;border-radius:17px!important}.detail-media{height:min(54dvh,500px)!important;min-height:315px!important}#chatSheet[open] .chat-card{padding-top:calc(78px + env(safe-area-inset-top))!important}.signin-card{border-radius:21px;padding:11px}}


/* v41: premium live sale controls, clean sheet headings and larger ViConnects brand */
.brand{min-width:72px!important;}
.brand img{width:50px!important;height:50px!important;border-radius:16px!important;box-shadow:0 0 0 1px rgba(255,255,255,.14) inset,0 16px 34px rgba(24,243,238,.20)!important;}
.brand-connects{font-size:13.2px!important;line-height:.88!important;margin-top:-3px!important;letter-spacing:-.045em!important;}
.top-row{align-items:center!important;}

.sheet-card .sheet-title{align-items:flex-start!important;gap:12px!important;margin-bottom:14px!important;}
.sheet-card .sheet-title small{display:block!important;color:var(--cyan)!important;font-size:12px!important;letter-spacing:.12em!important;line-height:1.2!important;margin:0 0 4px!important;}
.sheet-card .sheet-title h3{line-height:1.05!important;margin:0!important;}
.detail-card{padding-top:18px!important;scroll-padding-top:88px!important;}
.detail-card .sheet-title{position:sticky!important;top:0!important;z-index:60!important;padding:12px 54px 12px 0!important;margin:-2px 0 16px!important;background:linear-gradient(180deg,rgba(3,6,10,.99),rgba(3,6,10,.88) 80%,rgba(3,6,10,0))!important;border-bottom:0!important;backdrop-filter:blur(18px)!important;}
.detail-card .sheet-title .xbtn{position:absolute!important;right:0!important;top:8px!important;}
.detail-card .sheet-title h3{max-width:calc(100% - 4px)!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;}

.live-room{min-height:min(82dvh,820px)!important;border-radius:30px!important;background:radial-gradient(circle at 50% 25%,rgba(24,243,238,.10),#000 68%)!important;box-shadow:0 28px 70px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.11) inset!important;}
.live-video{height:min(82dvh,820px)!important;width:100%!important;object-fit:contain!important;background:#000!important;}
.live-room:fullscreen,.live-room:-webkit-full-screen{width:100vw!important;height:100vh!important;border-radius:0!important;border:0!important;}
.live-room:fullscreen .live-video,.live-room:-webkit-full-screen .live-video{height:100vh!important;}
.live-top{top:12px!important;left:12px!important;right:12px!important;gap:7px!important;flex-wrap:wrap!important;}
.live-pill{display:inline-flex!important;align-items:center!important;gap:6px!important;min-height:34px!important;background:rgba(3,8,12,.58)!important;border-color:rgba(255,255,255,.16)!important;box-shadow:0 10px 28px rgba(0,0,0,.22)!important;}
.live-viewers svg{width:15px!important;height:15px!important;stroke:#fff!important;fill:none!important;stroke-width:2!important;}
.live-viewers b{font-size:12px!important;color:#fff!important;}
.live-side{right:12px!important;bottom:84px!important;gap:9px!important;}
.live-side button{width:52px!important;height:52px!important;border-radius:19px!important;background:rgba(5,10,15,.55)!important;backdrop-filter:blur(16px)!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:0 14px 32px rgba(0,0,0,.28)!important;color:#fff!important;}
.live-side button:hover,.live-side button:active{transform:translateY(-1px) scale(1.02);}
.live-side .get-small{background:linear-gradient(135deg,var(--cyan),var(--pink))!important;color:#061015!important;}
.live-side .stop-live{background:linear-gradient(135deg,#ff477f,#ff245e)!important;color:#fff!important;border:0!important;}
.live-input{left:12px!important;right:12px!important;bottom:12px!important;grid-template-columns:minmax(0,1fr) auto!important;}
.live-input input{min-height:48px!important;border-radius:18px!important;background:rgba(3,7,12,.66)!important;backdrop-filter:blur(16px)!important;}
.live-input .primary{border-radius:18px!important;min-width:74px!important;}
.live-comments{right:82px!important;bottom:82px!important;max-height:48%!important;}
.host-controls{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin-top:12px!important;}
.host-controls button{border-radius:20px!important;}

.detail-media{height:min(62dvh,620px)!important;min-height:390px!important;border-radius:28px!important;background:#020406!important;}
.detail-media .detail-main{object-fit:contain!important;object-position:center center!important;max-width:100%!important;max-height:100%!important;padding:0!important;}
.detail-media .detail-bg{filter:blur(26px) brightness(.48) saturate(1.2)!important;opacity:.72!important;}
.detail-zoom-btn{background:rgba(3,7,12,.62)!important;backdrop-filter:blur(16px)!important;}

@media(max-width:430px){
  .brand{min-width:66px!important}.brand img{width:46px!important;height:46px!important}.brand-connects{font-size:12px!important}.top-row{grid-template-columns:66px minmax(126px,1fr) 42px 42px!important;gap:7px!important}.location-row{gap:7px!important}.tiny-ai,.tiny-lang{width:44px!important;height:44px!important}.detail-card{padding-top:16px!important}.detail-card .sheet-title{padding:10px 52px 12px 0!important;margin-bottom:12px!important}.detail-media{height:min(60dvh,560px)!important;min-height:345px!important}.live-room,.live-video{height:min(78dvh,720px)!important}.live-side button{width:48px!important;height:48px!important;border-radius:18px!important}.live-comments{right:72px!important}.host-controls{grid-template-columns:1fr!important}
}
@media(max-width:370px){.brand img{width:42px!important;height:42px!important}.brand{min-width:60px!important}.brand-connects{font-size:11px!important}.top-row{grid-template-columns:60px minmax(118px,1fr) 40px 40px!important}.detail-media{height:min(56dvh,520px)!important;min-height:315px!important}.live-room,.live-video{height:min(74dvh,680px)!important}}

/* v42: ViPulse, Seller Studio, offers, collections and retention polish */
.vi-radar-bar{display:flex!important;grid-template-columns:none!important;gap:8px!important;overflow-x:auto!important;padding-bottom:4px!important;scroll-snap-type:x proximity!important;scrollbar-width:none!important;}
.vi-radar-bar::-webkit-scrollbar{display:none!important;}
.vi-radar-bar button{flex:0 0 clamp(122px,26vw,150px)!important;scroll-snap-align:start!important;min-width:122px!important;}
.vi-radar-bar #pulseOpen{border-color:rgba(37,238,151,.30)!important;background:linear-gradient(135deg,rgba(37,238,151,.18),rgba(24,243,238,.08))!important;}
.vi-radar-bar #pulseOpen span{background:linear-gradient(135deg,rgba(37,238,151,.34),rgba(24,243,238,.18))!important;box-shadow:0 0 0 4px rgba(37,238,151,.08),0 0 18px rgba(24,243,238,.20)!important;}
.pulse-card,.studio-card{max-height:min(88dvh,860px)!important;}
.pulse-body,.studio-body{display:grid;gap:14px;padding-bottom:16px;}
.pulse-hero,.coach-card,.offer-preview-card{display:flex;gap:12px;align-items:center;padding:14px;border-radius:24px;background:linear-gradient(135deg,rgba(24,243,238,.12),rgba(255,47,126,.06));border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.07);}
.pulse-hero>span,.coach-card>span{width:48px;height:48px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--pink));box-shadow:0 18px 38px rgba(24,243,238,.14);}
.pulse-hero svg,.coach-card svg{width:24px;height:24px;stroke:#071015!important;fill:none!important;stroke-width:2.2!important;}
.pulse-hero b,.coach-card b{display:block;font-size:17px;color:#fff}.pulse-hero small,.coach-card li{color:rgba(255,255,255,.72);line-height:1.35}.coach-card ul{margin:8px 0 0 16px;padding:0;display:grid;gap:6px}
.pulse-stats,.studio-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
.pulse-stat,.studio-stat{min-height:84px;padding:11px;border-radius:20px;background:rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.12);display:grid;gap:4px;align-content:center;text-align:center;}
.pulse-stat span,.studio-stat span{margin:auto;width:30px;height:30px;display:grid;place-items:center;border-radius:13px;background:rgba(24,243,238,.12);}
.pulse-stat svg,.studio-stat svg{width:17px;height:17px;stroke:#fff!important;fill:none!important;}
.pulse-stat b,.studio-stat b{font-size:16px;color:#fff}.pulse-stat small,.studio-stat small{font-size:10px;color:rgba(255,255,255,.62)}
.pulse-section{display:grid;gap:10px;}.pulse-section h4{margin:0;color:#fff;font-size:15px;letter-spacing:-.02em}.pulse-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;}
.pulse-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.pulse-item{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);border-radius:21px;padding:8px;text-align:left;display:grid;grid-template-columns:64px minmax(0,1fr);gap:9px;align-items:center;min-width:0;}
.pulse-item img{width:64px;height:64px;border-radius:17px;object-fit:cover;background:#111;}.pulse-item b{display:block;color:#fff;font-size:12px;line-height:1.15;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.pulse-item small{display:block;color:rgba(255,255,255,.62);font-size:10px;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.community-row{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}.community-row::-webkit-scrollbar{display:none}.community-pill{flex:0 0 156px;display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;align-items:center;text-align:left;border-radius:20px;padding:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}.community-pill span{width:34px;height:34px;border-radius:14px;background:rgba(24,243,238,.12);display:grid;place-items:center}.community-pill svg{width:18px;height:18px;stroke:#fff!important;fill:none!important}.community-pill b{font-size:12px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.community-pill small{font-size:10px;color:rgba(255,255,255,.62)}
.schedule-mini{display:flex;gap:10px;align-items:center;padding:10px;border-radius:18px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.10)}.schedule-mini span{width:36px;height:36px;border-radius:14px;background:rgba(255,47,126,.12);display:grid;place-items:center}.schedule-mini svg{width:18px;height:18px;stroke:#fff!important;fill:none!important}.schedule-mini b{display:block;color:#fff;font-size:13px}.schedule-mini small{display:block;color:rgba(255,255,255,.63);font-size:10px}
.studio-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.offer-card input,.offer-card textarea,.schedule-card input{width:100%;border-radius:20px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.075);color:#fff;padding:14px 15px;outline:none}.offer-preview-card{margin-bottom:10px}.offer-preview-card img{width:68px;height:68px;border-radius:19px;object-fit:cover}.offer-preview-card b{display:block;color:#fff}.offer-preview-card small{color:rgba(255,255,255,.66)}
.detail-actions #detailOffer,.detail-actions #detailPriceAlert,.detail-actions #detailCollect{border-color:rgba(24,243,238,.20)!important;background:rgba(24,243,238,.075)!important;}
@media(max-width:430px){.vi-radar-bar{gap:7px!important}.vi-radar-bar button{flex-basis:118px!important;min-width:118px!important}.pulse-stats,.studio-stats{grid-template-columns:repeat(3,minmax(0,1fr));}.pulse-grid{grid-template-columns:1fr}.pulse-item{grid-template-columns:58px minmax(0,1fr)}.pulse-item img{width:58px;height:58px}.studio-actions{grid-template-columns:1fr}.pulse-card,.studio-card{padding-left:16px!important;padding-right:16px!important}}

/* v44: account identity, compact top plan chip, ViPulse/Seller Studio clarity and AI result spacing */
.location-row{overflow-x:auto;scrollbar-width:none;padding-bottom:2px;}
.location-row::-webkit-scrollbar{display:none;}
.account-top-chip{
  flex:0 0 auto;min-width:78px;max-width:118px;height:44px;border-radius:22px;
  display:grid;align-content:center;justify-items:start;gap:1px;padding:6px 12px;
  border:1px solid rgba(24,243,238,.22);
  background:linear-gradient(135deg,rgba(24,243,238,.16),rgba(255,47,126,.10));
  color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 14px 28px rgba(0,0,0,.18);
  text-align:left;overflow:hidden;
}
.account-top-chip b{max-width:100%;font-size:11px;line-height:1.04;font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.03em;}
.account-top-chip small{max-width:100%;font-size:8.6px;line-height:1;font-weight:950;color:rgba(255,255,255,.72);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.account-top-chip.is-pro{border-color:rgba(255,47,126,.35);background:linear-gradient(135deg,rgba(24,243,238,.20),rgba(255,47,126,.24));}
.vi-radar-bar{padding-top:4px!important;margin-top:3px!important;}
.vi-radar-bar button{flex-basis:clamp(112px,25vw,142px)!important;min-width:112px!important;}
.pulse-body .muted,.studio-body .muted{line-height:1.45;color:rgba(255,255,255,.70);}
.pulse-section .pulse-grid:empty::after{content:'No updates yet';color:rgba(255,255,255,.62);font-size:13px;}
.ai-answer{display:flex!important;align-items:flex-start!important;gap:12px!important;padding:12px 13px!important;}
.ai-answer .ai-brand-mark{flex:0 0 34px!important;width:34px!important;height:34px!important;margin-top:2px!important;}
.ai-answer>div{display:grid!important;gap:7px!important;min-width:0!important;}
.ai-answer b{display:block!important;margin:0!important;line-height:1.1!important;}
.ai-answer small{display:block!important;margin-top:0!important;line-height:1.45!important;color:rgba(255,255,255,.80)!important;}
.ai-help-results .search-results,.ai-help-results .compact-results{margin-top:10px!important;}
.ai-note-pills{margin-top:10px!important;}
@media(max-width:430px){
  .location-row{gap:6px!important;}
  .area-chip{min-width:118px!important;max-width:148px!important;}
  .tiny-lang,.tiny-ai{width:42px!important;height:42px!important;flex:0 0 42px!important;}
  .account-top-chip{height:42px;min-width:72px;max-width:96px;padding:6px 10px;border-radius:20px;}
  .account-top-chip b{font-size:10px;}.account-top-chip small{font-size:8px;}
  .ghost-dot{flex:0 0 auto;min-width:42px!important;}
  .ghost-dot b{display:none!important;}
  .vi-radar-bar button{flex-basis:108px!important;min-width:108px!important;}
}
@media(max-width:370px){
  .area-chip{min-width:104px!important;max-width:126px!important;}
  .account-top-chip{min-width:66px;max-width:82px;padding:5px 8px;}
  .tiny-lang,.tiny-ai{width:39px!important;height:39px!important;flex-basis:39px!important;}
}

/* v44: cleaner top shortcuts, Service Profiles and paid Service Connect */
.vi-radar-bar{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  overflow:visible!important;
  padding:0 12px 8px!important;
  margin-top:2px!important;
  scrollbar-width:none!important;
}
.vi-radar-bar button{
  min-width:0!important;
  flex:initial!important;
  min-height:48px!important;
  border-radius:20px!important;
  padding:9px 10px!important;
  grid-template-columns:28px minmax(0,1fr)!important;
  background:linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.055))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 14px 30px rgba(0,0,0,.20)!important;
}
.vi-radar-bar button span{width:28px!important;height:28px!important;font-size:14px!important;}
.vi-radar-bar button b{font-size:11.5px!important;}
.vi-radar-bar button small{font-size:8.5px!important;}
.story-strip{top:calc(174px + env(safe-area-inset-top))!important;padding-top:10px!important;}
.directory{padding-top:calc(158px + env(safe-area-inset-top))!important;}
.service-profile-builder{display:grid;gap:10px;margin:10px 0;padding:12px;border-radius:24px;background:linear-gradient(135deg,rgba(24,243,238,.09),rgba(255,47,126,.055));border:1px solid rgba(255,255,255,.12);}
.service-enable-row{display:flex!important;align-items:center!important;gap:10px!important;font-weight:900!important;line-height:1.2;}
.service-enable-row input{width:18px;height:18px;accent-color:var(--cyan);}
.service-fields{display:grid;gap:9px;}
.service-fields.hidden{display:none!important;}
.service-fields input{padding:12px 13px;border-radius:17px;}
.service-fields small{color:rgba(255,255,255,.66);font-size:11px;line-height:1.35;}
.service-connect-card .service-connect-preview,.service-pay-card{display:flex;align-items:center;gap:12px;padding:12px;border-radius:22px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);}
.service-connect-card .avatar-wrap img,.service-pay-card img{width:56px;height:56px;border-radius:18px;object-fit:cover;}
.service-fee-card{display:grid;gap:4px;margin:12px 0;padding:14px;border-radius:24px;background:linear-gradient(135deg,rgba(24,243,238,.12),rgba(255,47,126,.09));border:1px solid rgba(24,243,238,.20);}
.service-fee-card b{font-size:22px;color:#fff;}
.service-fee-card span{font-weight:900;color:#fff;}
.service-fee-card small,.service-fee-note{color:rgba(255,255,255,.68);line-height:1.35;}
.connect-fee-pill{display:inline-grid;margin-top:6px;width:max-content;padding:4px 8px;border-radius:999px;background:rgba(37,238,151,.14);border:1px solid rgba(37,238,151,.25);font-size:10px;font-weight:950;color:#eafff5;}
.service-worker-card{border-color:rgba(37,238,151,.18)!important;background:linear-gradient(135deg,rgba(37,238,151,.08),rgba(255,255,255,.055))!important;}
.service-profile-note{display:flex;gap:10px;align-items:center;margin:10px 0;padding:12px;border-radius:22px;background:rgba(24,243,238,.07);border:1px solid rgba(24,243,238,.18);}
.service-profile-note>span{width:42px;height:42px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--pink));}
.service-unlocked{display:inline-flex;align-items:center;gap:6px;padding:10px 12px;border-radius:999px;background:rgba(37,238,151,.14);border:1px solid rgba(37,238,151,.24);font-size:12px;font-weight:950;color:#eafff5;}
.profile-actions #profileTrustOpen{border-color:rgba(37,238,151,.20);}
@media(max-width:430px){
  .vi-radar-bar{gap:8px!important;padding-inline:10px!important;}
  .vi-radar-bar button{min-height:46px!important;padding:8px 8px!important;grid-template-columns:24px minmax(0,1fr)!important;}
  .vi-radar-bar button span{width:24px!important;height:24px!important;font-size:12px!important;}
  .vi-radar-bar button b{font-size:10.4px!important;}
  .vi-radar-bar button small{display:block!important;font-size:7.4px!important;}
  .story-strip{top:calc(170px + env(safe-area-inset-top))!important;}
}
@media(max-width:370px){
  .vi-radar-bar{gap:6px!important;}
  .vi-radar-bar button{border-radius:18px!important;padding:7px 6px!important;}
  .vi-radar-bar button b{font-size:9.6px!important;}
  .vi-radar-bar button small{display:none!important;}
  .story-strip{top:calc(164px + env(safe-area-inset-top))!important;}
}


/* v44 service connect polish */
.vi-radar-bar { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 10px; }
.story-strip { margin-top: 8px; }
.trust-inline-btn { display:flex; align-items:center; justify-content:flex-start; gap:12px; padding:12px 14px; border-radius:22px; }
.trust-inline-btn span { width:42px; height:42px; border-radius:16px; display:grid; place-items:center; background:linear-gradient(135deg, rgba(40,224,224,.28), rgba(255,47,133,.20)); border:1px solid rgba(255,255,255,.16); }
.service-profile-editor { margin: 12px 0; padding: 12px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.055); border-radius:22px; }
.service-provider-toggle { display:flex; gap:10px; align-items:center; font-weight:900; }
.service-profile-fields { display:none; margin-top:10px; gap:10px; }
.service-profile-fields.open { display:grid; }
.service-profile-fields select, .service-profile-fields input { width:100%; }
.contact-unlock-card .payment-inline-info { margin-top:10px; display:flex; align-items:center; justify-content:center; gap:10px; color:var(--muted); }
.contact-provider-mini { display:flex; align-items:center; gap:12px; padding:12px; border-radius:20px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); }
.contact-provider-mini img { width:58px; height:58px; border-radius:18px; object-fit:cover; }
.contact-fee-box { margin-top:10px; display:flex; gap:12px; align-items:center; padding:12px; border-radius:20px; background:linear-gradient(135deg, rgba(37,224,224,.14), rgba(255,47,133,.13)); border:1px solid rgba(37,224,224,.20); }
.contact-fee-box svg { width:24px; height:24px; }
@media (max-width: 420px) { .vi-radar-bar { gap:7px; } .vi-radar-bar button { min-width:0; padding:10px 8px; } }

/* v44 final: top quick actions stay as three relaxed cards, TrustPass moved to profile */
.vi-radar-bar{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  overflow:visible!important;
  padding-top:5px!important;
  padding-bottom:3px!important;
  margin-top:4px!important;
}
.vi-radar-bar button{
  min-width:0!important;
  width:100%!important;
  flex:initial!important;
  min-height:50px!important;
  padding:9px 10px!important;
  border-radius:20px!important;
}
.vi-radar-bar button span{width:34px!important;height:34px!important;border-radius:15px!important;}
.vi-radar-bar button b{font-size:12px!important;line-height:1.05!important;}
.vi-radar-bar button small{font-size:8.8px!important;line-height:1!important;}
.vi-radar-bar #trustOpen{display:none!important;}
.story-strip{margin-top:10px!important;}
.service-profile-fields{display:none;gap:9px;margin-top:10px;padding:10px;border-radius:20px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.10);}
.service-profile-fields.open{display:grid;}
.service-provider-toggle{display:flex;align-items:center;gap:10px;padding:12px 13px;border-radius:20px;background:rgba(24,243,238,.06);border:1px solid rgba(24,243,238,.12);font-weight:850;color:#fff;}
.connect-fee-pill{display:inline-flex;margin-top:5px;width:max-content;border-radius:999px;padding:5px 8px;font-size:10px;font-weight:950;color:#071015;background:linear-gradient(135deg,var(--cyan),var(--pink));box-shadow:0 8px 20px rgba(24,243,238,.12);}
.contact-provider-mini{display:flex;align-items:center;gap:11px;padding:11px;border-radius:22px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);}
.contact-provider-mini img{width:52px;height:52px;border-radius:18px;object-fit:cover;}
.contact-provider-mini b{display:block;color:#fff;font-size:15px;}.contact-provider-mini small{color:rgba(255,255,255,.68);}
.contact-fee-box{display:flex;gap:12px;align-items:center;margin-top:10px;padding:13px;border-radius:22px;background:linear-gradient(135deg,rgba(24,243,238,.13),rgba(255,47,126,.08));border:1px solid rgba(24,243,238,.18);}
.contact-fee-box>span{width:44px;height:44px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--pink));}.contact-fee-box svg{width:22px;height:22px;stroke:#061015!important;fill:none!important;}
.contact-fee-box b{display:block;color:#fff;font-size:18px;}.contact-fee-box small{color:rgba(255,255,255,.72);line-height:1.35;}
@media(max-width:370px){.vi-radar-bar{gap:7px!important}.vi-radar-bar button{padding:8px 7px!important;min-height:48px!important}.vi-radar-bar button span{width:30px!important;height:30px!important}.vi-radar-bar button b{font-size:11px!important}.vi-radar-bar button small{font-size:8px!important}}

/* v44 final services/contact-fee layout polish */
#trustOpen{display:none!important;}
.vi-radar-bar{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important;margin:8px 10px 6px!important;padding:0!important;overflow:visible!important;}
.vi-radar-bar button{min-width:0!important;width:100%!important;min-height:54px!important;padding:10px 11px!important;border-radius:22px!important;display:grid!important;grid-template-columns:32px minmax(0,1fr)!important;align-items:center!important;column-gap:9px!important;}
.vi-radar-bar button span{width:32px!important;height:32px!important;}
.vi-radar-bar button b,.vi-radar-bar button small{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.story-strip{margin-top:12px!important;border-top:0!important;box-shadow:none!important;}
.trust-inline-btn{margin:10px 0 12px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;text-align:left!important;gap:12px!important;}
.service-profile-editor{margin:13px 0 4px!important;padding:14px!important;border-radius:24px!important;background:linear-gradient(135deg,rgba(34,238,222,.08),rgba(255,47,133,.055))!important;border:1px solid rgba(255,255,255,.12)!important;}
.service-provider-toggle{display:flex!important;align-items:center!important;gap:11px!important;color:#fff!important;font-weight:950!important;line-height:1.25!important;}
.service-provider-toggle input{width:20px!important;height:20px!important;accent-color:#29e7df!important;}
.service-profile-fields{display:none;margin-top:12px;gap:10px;}
.service-profile-fields.open{display:grid!important;}
.service-profile-fields select,.service-profile-fields input{width:100%!important;border-radius:18px!important;background:rgba(255,255,255,.075)!important;border:1px solid rgba(255,255,255,.12)!important;color:#fff!important;}
.service-profile-fields small{color:rgba(255,255,255,.70)!important;line-height:1.38!important;}
.connect-fee-pill{display:inline-flex!important;align-items:center!important;width:max-content!important;margin-top:8px!important;padding:5px 9px!important;border-radius:999px!important;background:linear-gradient(135deg,rgba(44,234,221,.20),rgba(255,47,133,.12))!important;border:1px solid rgba(44,234,221,.28)!important;color:#eaffff!important;font-size:10.5px!important;font-weight:950!important;letter-spacing:.02em!important;}
.service-worker-card{position:relative;overflow:hidden;border-color:rgba(42,234,222,.28)!important;}
.service-worker-card::after{content:'service';position:absolute;right:13px;top:10px;font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:rgba(42,234,222,.72);font-weight:1000;}
.contact-unlock-card{max-width:430px!important;}
.contact-provider-mini{display:flex!important;align-items:center!important;gap:12px!important;padding:12px!important;border-radius:22px!important;background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.12)!important;}
.contact-provider-mini img{width:60px!important;height:60px!important;border-radius:20px!important;object-fit:cover!important;}
.contact-fee-box{margin-top:10px!important;display:flex!important;align-items:center!important;gap:12px!important;padding:13px!important;border-radius:22px!important;background:linear-gradient(135deg,rgba(42,234,222,.16),rgba(255,47,133,.13))!important;border:1px solid rgba(42,234,222,.24)!important;}
.payment-inline-info{margin-top:12px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;color:rgba(255,255,255,.72)!important;}
.profile-actions #profileServiceConnect{background:linear-gradient(135deg,#29e7df,#ff2f85)!important;color:#fff!important;border:0!important;box-shadow:0 14px 32px rgba(255,47,133,.20)!important;}
@media(max-width:430px){
  .vi-radar-bar{gap:8px!important;margin-inline:8px!important;}
  .vi-radar-bar button{min-height:48px!important;padding:8px!important;border-radius:20px!important;grid-template-columns:28px minmax(0,1fr)!important;}
  .vi-radar-bar button span{width:28px!important;height:28px!important;}
  .vi-radar-bar button b{font-size:10px!important;}
  .vi-radar-bar button small{font-size:7.2px!important;}
}
@media(max-width:360px){.vi-radar-bar{gap:6px!important}.vi-radar-bar button{grid-template-columns:1fr!important;place-items:center!important;text-align:center!important}.vi-radar-bar button small{display:none!important}}

/* v45: service marketplace polish, QR share card, directory spacing, owner delete reliability */
:root{
  --vc-premium-1:#18f3ee;
  --vc-premium-2:#25ee97;
  --vc-premium-3:#0a6f67;
}
.primary,
.profile-actions .primary,
#profileFollow,
.dir-actions .profile-small,
.action.get,
.live-open-mini,
.live-resume-mini,
.service-empty .primary,
.share-actions .primary{
  background:linear-gradient(135deg,var(--vc-premium-1),var(--vc-premium-2))!important;
  color:#031414!important;
  border:0!important;
  box-shadow:0 14px 32px rgba(24,243,238,.16), inset 0 1px 0 rgba(255,255,255,.24)!important;
}
.profile-actions .primary,
#profileFollow{font-weight:950!important;text-shadow:none!important;}
.directory{
  padding-top:calc(224px + env(safe-area-inset-top))!important;
  background:radial-gradient(circle at 50% 0,#123b44 0,#05070a 43%,#05070a 100%)!important;
}
.directory .section-head{
  position:relative!important;
  z-index:2!important;
  margin-bottom:10px!important;
}
.directory .mini-btn{
  position:relative!important;
  z-index:4!important;
  min-width:78px!important;
  background:rgba(255,255,255,.10)!important;
  border-color:rgba(255,255,255,.14)!important;
}
.directory .chips{position:relative!important;z-index:2!important;}
@media(max-width:390px){.directory{padding-top:calc(214px + env(safe-area-inset-top))!important}.directory .mini-btn{min-height:38px!important;padding:8px 14px!important}.directory .chips{gap:7px!important}.chip{padding:9px 11px!important}}
.profile-qr{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:12px!important;
  align-items:stretch!important;
  padding:14px!important;
  border-radius:26px!important;
  background:linear-gradient(145deg,rgba(24,243,238,.10),rgba(37,238,151,.06))!important;
}
.vc-qr-card{display:grid;grid-template-columns:112px minmax(0,1fr);gap:14px;align-items:center;width:100%;}
.qr-wrap.premium-qr{position:relative!important;width:112px!important;height:112px!important;display:grid;place-items:center;border-radius:26px!important;background:#fff!important;padding:8px!important;box-shadow:0 16px 34px rgba(0,0,0,.28), inset 0 0 0 1px rgba(0,0,0,.06)!important;overflow:hidden!important;}
.qr-wrap.premium-qr .qr-main{width:100%!important;height:100%!important;object-fit:contain!important;border-radius:18px!important;display:block!important;}
.qr-wrap.premium-qr .qr-logo{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;width:30px!important;height:30px!important;border-radius:10px!important;background:#071014!important;padding:3px!important;box-shadow:0 0 0 4px #fff!important;object-fit:contain!important;}
.qr-wrap .qr-fallback{display:none;position:absolute;inset:8px;border-radius:18px;background:radial-gradient(circle at 25% 20%,rgba(24,243,238,.42),transparent 34%),linear-gradient(135deg,#071014,#0e2c31);place-items:center;color:#fff;font-size:28px;font-weight:1000;letter-spacing:-.08em;}
.qr-wrap.qr-failed .qr-main{display:none!important}.qr-wrap.qr-failed .qr-fallback{display:grid!important}.qr-wrap.qr-failed .qr-logo{display:none!important;}
.qr-copy{min-width:0;display:grid;gap:6px}.qr-copy b{font-size:15px;font-weight:1000}.qr-copy small{overflow-wrap:anywhere;word-break:break-word;line-height:1.35;color:rgba(255,255,255,.66)}
.profile-qr-actions{display:flex;justify-content:flex-start}.profile-qr-actions button,.profile-qr button{border-radius:999px!important;background:rgba(255,255,255,.12)!important;border:1px solid rgba(255,255,255,.14)!important;color:#fff!important;padding:10px 18px!important;font-weight:950!important;}
.share-card .sheet-title{margin-bottom:12px}.share-body{display:grid;gap:14px}.share-card .vc-qr-card{grid-template-columns:1fr;justify-items:center;text-align:center}.share-card .qr-wrap.premium-qr{width:min(62vw,260px)!important;height:min(62vw,260px)!important;border-radius:32px!important}.share-card .qr-wrap.premium-qr .qr-logo{width:46px!important;height:46px!important;border-radius:15px!important;box-shadow:0 0 0 7px #fff!important}.share-actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:9px}.share-actions a,.share-actions button{display:grid;place-items:center;text-align:center;min-height:46px;border-radius:18px;text-decoration:none;font-weight:950;color:#fff}.share-actions .soft{background:rgba(255,255,255,.10)!important;border:1px solid rgba(255,255,255,.14)!important;}
.service-worker-card{
  grid-template-columns:66px minmax(0,1fr) auto!important;
  background:linear-gradient(145deg,rgba(24,243,238,.085),rgba(255,255,255,.055))!important;
  border-color:rgba(24,243,238,.17)!important;
  box-shadow:0 14px 32px rgba(0,0,0,.18)!important;
}
.service-card-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}.service-rank-pill,.service-ai-pill,.connect-fee-pill{display:inline-flex;align-items:center;width:max-content;border-radius:999px;padding:4px 8px;font-size:9.5px;font-weight:1000;line-height:1;border:1px solid rgba(255,255,255,.12)}.service-rank-pill{background:rgba(255,214,102,.13);color:#ffe9a6;border-color:rgba(255,214,102,.24)}.service-ai-pill{background:rgba(24,243,238,.12);color:#dffeff;border-color:rgba(24,243,238,.22)}
.service-empty{display:grid;gap:10px;place-items:start;padding:18px;border:1px solid rgba(24,243,238,.18);border-radius:26px;background:linear-gradient(145deg,rgba(24,243,238,.08),rgba(37,238,151,.045));}.service-empty>span{width:48px;height:48px;border-radius:18px;display:grid;place-items:center;background:rgba(255,255,255,.10)}.service-empty svg{width:24px;height:24px}.service-empty b{font-size:17px}.service-empty small{color:rgba(255,255,255,.68);line-height:1.4}.service-empty button{width:100%;}
.detail-card{max-height:96dvh!important;padding-top:6px!important;}.detail-card .sheet-title{position:sticky!important;top:0!important;z-index:80!important;margin:0 0 10px!important;padding:10px 54px 12px 0!important;background:linear-gradient(180deg,rgba(3,6,10,.995),rgba(3,6,10,.92) 78%,rgba(3,6,10,0))!important;}.detail-card .sheet-title small{line-height:1!important}.detail-card .sheet-title h3{line-height:1.05!important;}
.showroom-head h3::after{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--vc-premium-1);margin-left:8px;vertical-align:middle;opacity:.75}.showroom-grid{gap:10px!important}.inside-card{border-radius:19px!important;box-shadow:0 12px 28px rgba(0,0,0,.24)!important;}
@media(max-width:390px){.vc-qr-card{grid-template-columns:96px minmax(0,1fr);gap:11px}.qr-wrap.premium-qr{width:96px!important;height:96px!important;border-radius:23px!important}.qr-wrap.premium-qr .qr-logo{width:27px!important;height:27px!important}.share-actions{grid-template-columns:1fr}.service-worker-card{grid-template-columns:58px minmax(0,1fr)!important}.service-worker-card .dir-actions{grid-column:1/-1;justify-content:flex-end}.detail-card{max-height:97dvh!important}.detail-card .sheet-title{padding-right:52px!important}}


/* v46: payment-service UX, native-alert removal, premium green buttons, fixed detail headers */
:root{--vc-good-1:#15f5da;--vc-good-2:#20f09a;--vc-good-3:#0e4f4d;}
.primary:not(.danger-confirm),
.profile-actions .primary:not(.danger-confirm),
#profileFollow,
#startContactUnlock,
#sendBooking,
#sendChat,
#runAiHelp,
#publishBtn,
#saveProfile,
.share-actions .primary,
.service-empty .primary,
.action.get,
.live-open-mini,
.live-resume-mini{
  background:linear-gradient(135deg,var(--vc-good-1),var(--vc-good-2))!important;
  color:#021412!important;
  border:0!important;
  box-shadow:0 14px 32px rgba(21,245,218,.16),inset 0 1px 0 rgba(255,255,255,.28)!important;
  text-shadow:none!important;
}
.danger-confirm,.soft.danger,.owner-tools .danger{background:linear-gradient(135deg,#ff6868,#ff2f55)!important;color:#fff!important;border:0!important;}
.profile-actions #profileServiceConnect{background:rgba(255,255,255,.10)!important;color:#fff!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:none!important;}
.profile-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;}
.profile-actions .soft,.profile-actions .primary,.profile-actions a{display:grid!important;place-items:center!important;min-height:48px!important;border-radius:20px!important;text-decoration:none!important;}
.service-access-note{display:flex!important;gap:10px!important;align-items:center!important;margin:9px 0 12px!important;padding:10px 12px!important;border-radius:18px!important;border:1px solid rgba(21,245,218,.17)!important;background:rgba(21,245,218,.06)!important;color:rgba(255,255,255,.78)!important;line-height:1.35!important;}
.service-access-note span{width:28px;height:28px;border-radius:11px;display:grid;place-items:center;background:rgba(21,245,218,.12);flex:0 0 auto;}
.service-access-note svg{width:16px;height:16px;stroke:#ccfff6!important;fill:none!important;}
.detail-service-note{margin:8px 0 10px!important;}
.connect-fee-pill{display:none!important;}
.contact-unlock-card .payment-inline-info{display:none!important;}
.contact-soft-note{display:flex;align-items:center;gap:12px;margin-top:11px;padding:12px;border-radius:20px;border:1px solid rgba(21,245,218,.18);background:rgba(21,245,218,.065);}
.contact-soft-note>span{width:40px;height:40px;border-radius:15px;display:grid;place-items:center;background:rgba(255,255,255,.10);}
.contact-soft-note b{font-size:16px;color:#fff}.contact-soft-note small{display:block;color:rgba(255,255,255,.72);line-height:1.35;margin-top:3px;}
.payment-result-card{display:grid;gap:8px;place-items:center;margin-top:12px;padding:12px;border-radius:20px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);}
.payment-result-card.success{border-color:rgba(32,240,154,.34);background:rgba(32,240,154,.08)}.payment-result-card.danger{border-color:rgba(255,80,80,.34);background:rgba(255,80,80,.08)}
.confirm-sheet{border:0;background:transparent;color:#fff;max-width:min(92vw,390px);padding:0}.confirm-sheet::backdrop{background:rgba(0,0,0,.62);backdrop-filter:blur(10px)}.confirm-card{padding:20px;border-radius:28px;background:rgba(8,12,16,.96);border:1px solid rgba(255,255,255,.14);box-shadow:0 28px 80px rgba(0,0,0,.52);display:grid;gap:12px;text-align:left}.confirm-icon{width:44px;height:44px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(135deg,var(--vc-good-1),var(--vc-good-2));color:#051412;font-weight:1000}.confirm-icon.danger{background:linear-gradient(135deg,#ff6868,#ff2f55);color:#fff}.confirm-card h3{margin:0;font-size:22px;letter-spacing:-.04em}.confirm-card p{margin:0;color:rgba(255,255,255,.74);line-height:1.45}.confirm-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}.confirm-actions button{min-height:48px;border-radius:18px;font-weight:950}
.detail-card{padding-top:0!important;max-height:98dvh!important;}.detail-card>.sheet-bar{position:sticky!important;top:0!important;z-index:95!important;margin:8px auto 0!important;}.detail-card .sheet-title{position:sticky!important;top:0!important;z-index:92!important;margin:0 -16px 12px!important;padding:12px 64px 14px 18px!important;background:linear-gradient(180deg,rgba(3,7,10,.99),rgba(3,7,10,.94) 74%,rgba(3,7,10,.76))!important;border-bottom:1px solid rgba(255,255,255,.08)!important;backdrop-filter:blur(20px)!important;box-shadow:0 18px 38px rgba(0,0,0,.28)!important;}.detail-card .sheet-title .xbtn{right:14px!important;top:14px!important}.detail-card .sheet-title h3{font-size:20px!important;line-height:1.08!important;max-width:100%!important}.detail-card .sheet-title small{font-size:11px!important;letter-spacing:.14em!important;color:var(--vc-good-1)!important;}
.directory{padding-top:calc(238px + env(safe-area-inset-top))!important;}.directory .section-head{margin-top:0!important;}.directory .section-head .mini-btn{transform:translateY(-2px)!important;}
.share-actions.two{grid-template-columns:1fr 1fr!important}.share-card .qr-wrap.premium-qr{background:#fff!important}.share-card .qr-wrap.premium-qr .qr-main{filter:contrast(1.08)!important}.share-card .qr-copy small{font-size:12px!important;max-width:100%!important;}
.qr-wrap.qr-failed{background:radial-gradient(circle at 50% 0,rgba(21,245,218,.28),transparent 38%),#fff!important}.qr-wrap.qr-failed .qr-fallback{display:grid!important;color:#061014!important;background:repeating-linear-gradient(45deg,#111 0 4px,#fff 4px 8px)!important;opacity:.18}.qr-wrap.qr-failed::after{content:'Vi';position:absolute;inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:18px;background:#061014;color:#fff;display:grid;place-items:center;font-weight:1000;box-shadow:0 0 0 8px #fff;}
@media(max-width:390px){.profile-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}.profile-actions .soft,.profile-actions .primary,.profile-actions a{min-height:46px!important;border-radius:18px!important}.directory{padding-top:calc(230px + env(safe-area-inset-top))!important}.detail-card .sheet-title{padding-right:60px!important}.contact-unlock-card{max-height:74dvh!important}}

/* v47: Product Details AI auto-return, Seller Studio Today metrics, Wanted Auto-Match */
.studio-today{border:1px solid rgba(30,246,244,.20);background:linear-gradient(145deg,rgba(30,246,244,.10),rgba(33,255,169,.06),rgba(0,0,0,.12));border-radius:24px;padding:13px;margin:0 0 12px;box-shadow:0 18px 42px rgba(0,0,0,.22)}
.studio-today-title{display:flex;align-items:center;gap:10px;margin-bottom:10px}.studio-today-title>span{width:38px;height:38px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(30,246,244,.92),rgba(33,255,169,.72));box-shadow:0 14px 36px rgba(30,246,244,.20)}.studio-today-title svg{width:20px;height:20px;stroke:#06100e}.studio-today-title b{display:block;color:#fff;font-size:16px}.studio-today-title small{color:rgba(255,255,255,.68);line-height:1.25}.today-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.today-stat{min-width:0;border-radius:18px;background:rgba(255,255,255,.075);border:1px solid rgba(255,255,255,.10);display:grid;gap:3px;justify-items:center;text-align:center;padding:9px 5px}.today-stat span{width:28px;height:28px;border-radius:12px;background:rgba(255,255,255,.08);display:grid;place-items:center}.today-stat svg{width:15px;height:15px;stroke:#fff}.today-stat b{font-size:17px;line-height:1;color:#fff}.today-stat small{font-size:9px;color:rgba(255,255,255,.66);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.wanted-auto-match{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.035);border-radius:24px;padding:12px}.wanted-match-list{display:grid;gap:9px}.wanted-match-card{border:1px solid rgba(255,255,255,.11);background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(30,246,244,.04));border-radius:20px;padding:10px;display:grid;gap:9px}.wanted-match-head{display:flex;gap:9px;align-items:flex-start}.wanted-match-head>span{width:34px;height:34px;border-radius:14px;background:rgba(30,246,244,.12);display:grid;place-items:center;flex:0 0 auto}.wanted-match-head svg{width:18px;height:18px;stroke:var(--cyan)}.wanted-match-head b{display:block;font-size:13px;color:#fff;line-height:1.2}.wanted-match-head small{display:block;color:rgba(255,255,255,.62);margin-top:2px;font-size:11px}.wanted-match-product{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.06);border-radius:16px;padding:6px;display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:8px;color:#fff;text-align:left}.wanted-match-product img{width:42px;height:42px;border-radius:12px;object-fit:cover;background:#071014}.wanted-match-product b{font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wanted-match-product small{font-size:10px;color:var(--vc-good-1)}
@media(max-width:390px){.today-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.today-stat{padding:8px 4px}.today-stat small{font-size:8.5px}.studio-today{padding:11px;border-radius:22px}.wanted-match-card{border-radius:18px}}

/* v49: service-only contact fee, premium green buttons, secure account restore */
:root{--vc-action-a:#16f4dc;--vc-action-b:#22ee9b;--vc-action-c:#0a5d55;}
.primary:not(.danger-confirm),
.profile-actions .primary:not(.danger-confirm),
.profile-actions .soft:not(.danger),
#profileFollow,
#profileServiceConnect,
#startContactUnlock,
#sendBooking,
#sendChat,
#runAiHelp,
#publishBtn,
#saveProfile,
#restoreAccountBtn,
#openWalletBtn,
.share-actions .primary,
.service-empty .primary,
.action.get,
.action.book,
.action.live,
.live-open-mini,
.live-resume-mini,
.chat-send-icon,
.dir-actions .profile-small{
  background:linear-gradient(135deg,var(--vc-action-a),var(--vc-action-b))!important;
  color:#021513!important;
  border:0!important;
  box-shadow:0 14px 34px rgba(22,244,220,.16), inset 0 1px 0 rgba(255,255,255,.28)!important;
  text-shadow:none!important;
}
.action.get span,.action.book span,.action.live span,.action.chat span,
.reel-card.is-active .action.get span,.reel-card.is-active .action.book span,.reel-card.is-active .action.live span,.reel-card.is-active .action.chat span,
.plan-orb,.wallet-orb,.checkout-hero .plan-orb{
  background:radial-gradient(circle at 30% 18%,rgba(255,255,255,.58),transparent 25%),linear-gradient(145deg,var(--vc-action-a),var(--vc-action-b))!important;
  color:#031513!important;
  box-shadow:0 14px 30px rgba(22,244,220,.18)!important;
}
.action.live b,.action.get b,.action.book b,.action.chat b{color:inherit!important;}
.badge.price{background:linear-gradient(135deg,var(--vc-action-a),var(--vc-action-b))!important;color:#031513!important;border:0!important;}
.chat-bubble.mine{background:linear-gradient(135deg,rgba(22,244,220,.92),rgba(34,238,155,.84))!important;color:#021513!important;}
.profile-actions #profileServiceConnect{background:rgba(255,255,255,.10)!important;color:#fff!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:none!important;}
.signin-row.secure-signin{display:grid!important;grid-template-columns:1fr 120px auto!important;gap:8px!important;align-items:center!important;}
.signin-row.secure-signin input{min-width:0!important;}
.pin-help{display:block;margin:-4px 0 8px;padding:0 4px;color:rgba(255,255,255,.62);font-size:11.5px;line-height:1.35;}
.service-access-note{background:rgba(22,244,220,.055)!important;border-color:rgba(22,244,220,.18)!important;}
.contact-soft-note{background:rgba(22,244,220,.06)!important;border-color:rgba(22,244,220,.18)!important;}
.contact-soft-note b{color:#eafffb!important;}
@media(max-width:410px){.signin-row.secure-signin{grid-template-columns:1fr 1fr!important}.signin-row.secure-signin button{grid-column:1/-1;min-height:44px}.pin-help{font-size:11px}}

/* v50: ViAds, ViDeals, ViJobs, ViVerified, ViAgents revenue engine */
.revenue-card{max-height:94dvh!important;overflow:auto!important;background:linear-gradient(180deg,rgba(5,10,14,.98),rgba(3,7,10,.96))!important;}
.revenue-body{display:grid;gap:14px;padding-bottom:16px;}
.revenue-hero{position:relative;overflow:hidden;border:1px solid rgba(22,244,220,.18);background:radial-gradient(circle at 12% 0,rgba(22,244,220,.20),transparent 36%),radial-gradient(circle at 95% 18%,rgba(34,238,155,.12),transparent 34%),rgba(255,255,255,.045);border-radius:28px;padding:16px;display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:center;box-shadow:0 22px 52px rgba(0,0,0,.24)}
.revenue-hero>span{width:54px;height:54px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(135deg,var(--vc-action-a,#16f4dc),var(--vc-action-b,#22ee9b));color:#031513;box-shadow:0 18px 42px rgba(22,244,220,.18)}
.revenue-hero svg{width:26px;height:26px;stroke:currentColor}.revenue-hero small{display:block;color:var(--vc-action-a,#16f4dc);font-weight:1000;letter-spacing:.12em;text-transform:uppercase}.revenue-hero h4{margin:2px 0 4px;font-size:21px;line-height:1.02}.revenue-hero p{margin:0;color:rgba(255,255,255,.70);line-height:1.38;font-size:13px}.revenue-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.revenue-stat{min-width:0;border-radius:22px;background:rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.10);padding:11px 7px;text-align:center;display:grid;gap:4px}.revenue-stat b{font-size:19px;color:#fff;line-height:1}.revenue-stat small{font-size:10px;color:rgba(255,255,255,.62);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.revenue-block,.pricing-section{border:1px solid rgba(255,255,255,.10);background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(22,244,220,.035));border-radius:26px;padding:12px;display:grid;gap:12px}.revenue-block-head,.pricing-section-title{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}.revenue-block-head h4,.pricing-section-title h4{margin:0;color:#fff;font-size:17px;letter-spacing:-.03em}.revenue-block-head small,.pricing-section-title small{color:rgba(255,255,255,.62);line-height:1.25}.revenue-plan-grid,.pricing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.revenue-plan,.pricing-plan{position:relative;overflow:hidden;border-radius:24px;border:1px solid rgba(255,255,255,.11);background:radial-gradient(circle at 18% 0,rgba(22,244,220,.14),transparent 32%),rgba(255,255,255,.055);padding:12px;display:grid;gap:10px;min-height:180px}.revenue-plan::after,.pricing-plan::after{content:'';position:absolute;inset:auto -35px -55px auto;width:110px;height:110px;border-radius:50%;background:rgba(22,244,220,.08);pointer-events:none}.revenue-plan.deal,.pricing-plan.deal{background:radial-gradient(circle at 18% 0,rgba(255,214,102,.16),transparent 32%),rgba(255,255,255,.055)}.revenue-plan.verification,.pricing-plan.verification{background:radial-gradient(circle at 18% 0,rgba(112,176,255,.16),transparent 32%),rgba(255,255,255,.055)}.revenue-plan.agent,.pricing-plan.agent{background:radial-gradient(circle at 18% 0,rgba(34,238,155,.18),transparent 32%),rgba(255,255,255,.055)}.plan-head{display:flex;gap:10px;align-items:center}.plan-head>span{width:42px;height:42px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.10)}.plan-head svg{width:21px;height:21px;stroke:#eafffb}.plan-head small{display:block;color:var(--vc-action-a,#16f4dc);font-size:10px;font-weight:1000;letter-spacing:.08em}.plan-head h4{margin:0;font-size:14px;line-height:1.12;color:#fff}.plan-price{font-size:18px;color:#fff}.revenue-plan ul,.pricing-plan ul{margin:0;padding-left:16px;color:rgba(255,255,255,.70);font-size:11.5px;line-height:1.36}.plan-actions{margin-top:auto}.revenue-plan .primary,.pricing-plan .primary{min-height:42px;border-radius:16px!important;font-size:12px!important}.revenue-quick{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:12px 0}.revenue-quick button{border-radius:18px;min-height:46px;font-weight:950}.revenue-row{display:grid;grid-template-columns:50px minmax(0,1fr) auto;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.09);border-radius:20px;background:rgba(255,255,255,.045);padding:8px}.revenue-row img{width:50px;height:50px;border-radius:16px;object-fit:cover;background:#071014}.revenue-row b{display:block;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}.revenue-row small{display:block;color:rgba(255,255,255,.62);font-size:11px}.revenue-row em{font-style:normal;color:var(--vc-action-a,#16f4dc);font-weight:1000;font-size:11px}.revenue-empty{border:1px dashed rgba(255,255,255,.16);border-radius:22px;padding:14px;color:rgba(255,255,255,.64);text-align:center;background:rgba(255,255,255,.03)}.revenue-context-card{display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;align-items:center;border:1px solid rgba(22,244,220,.16);border-radius:20px;padding:10px;background:rgba(22,244,220,.055);margin:8px 0}.revenue-context-card>span{width:42px;height:42px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.10)}.revenue-context-card b{display:block;color:#fff}.revenue-context-card small{color:rgba(255,255,255,.66);line-height:1.35}.agent-card{display:grid;grid-template-columns:54px minmax(0,1fr);gap:12px;align-items:center;border-radius:24px;border:1px solid rgba(34,238,155,.20);background:linear-gradient(145deg,rgba(34,238,155,.10),rgba(22,244,220,.04));padding:12px}.agent-card>span{width:54px;height:54px;border-radius:20px;display:grid;place-items:center;background:rgba(255,255,255,.10)}.agent-card b{font-size:17px;color:#fff}.agent-card small{display:block;color:rgba(255,255,255,.66);line-height:1.35}.agent-code{font-family:ui-monospace,Menlo,monospace;color:var(--vc-action-a,#16f4dc);font-weight:1000;background:rgba(0,0,0,.22);padding:3px 7px;border-radius:9px}.boost-picker-label small{color:rgba(255,255,255,.62)}.boost-product-card .boost-card-meta small{line-height:1.25}.momo-checkout input#momoDealPrice,.momo-checkout input#momoJobText{border-radius:18px!important;min-height:48px!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.12)!important;color:#fff!important;padding:0 14px!important}
@media(max-width:430px){.revenue-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.revenue-plan-grid,.pricing-grid{grid-template-columns:1fr}.revenue-quick{grid-template-columns:1fr}.revenue-hero{grid-template-columns:1fr;text-align:left}.revenue-hero>span{width:48px;height:48px}.revenue-row{grid-template-columns:44px minmax(0,1fr)}.revenue-row em{grid-column:2}.pricing-section{padding:10px;border-radius:24px}.revenue-plan,.pricing-plan{min-height:auto}.revenue-card{max-height:96dvh!important}}


/* v51: revenue engine click fixes, cleaner cards, annual plans, premium green buttons */
:root{
  --vc-premium-a:#16f4dc;
  --vc-premium-b:#25ee97;
  --vc-premium-c:#dffef7;
}
.primary,
.action.get,
.action.live,
.live-side .get-small,
.wallet-mini span,
.account-wallet-card button,
.dir-actions .profile-small,
.profile-actions .primary,
.detail-actions .primary,
.momo-checkout .primary,
.payment-result .primary,
.revenue-plan .primary,
.pricing-plan .primary{
  background:linear-gradient(135deg,var(--vc-premium-a),var(--vc-premium-b))!important;
  color:#031413!important;
  border:0!important;
  box-shadow:0 16px 34px rgba(22,244,220,.16)!important;
}
.action.get svg,.action.live svg{stroke:#031413!important}.action.get small,.action.live small{color:#031413!important;font-weight:1000!important}
.pricing-section{padding:13px!important;border-radius:28px!important;background:linear-gradient(180deg,rgba(255,255,255,.072),rgba(255,255,255,.035))!important;border-color:rgba(255,255,255,.13)!important}
.pricing-section-title{align-items:flex-start!important}.pricing-section-title h4{font-size:18px!important}.pricing-section-title small{max-width:230px!important;text-align:right!important}
.pricing-grid,.revenue-plan-grid{gap:12px!important}
.pricing-plan,.revenue-plan{
  min-height:0!important;
  padding:14px!important;
  border-radius:26px!important;
  background:linear-gradient(155deg,rgba(255,255,255,.085),rgba(255,255,255,.035))!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 18px 42px rgba(0,0,0,.18)!important;
  isolation:isolate!important;
}
.pricing-plan::after,.revenue-plan::after{display:none!important;content:none!important}
.pricing-plan.current{
  background:radial-gradient(circle at 0 0,rgba(37,238,151,.18),transparent 34%),linear-gradient(155deg,rgba(22,244,220,.10),rgba(255,255,255,.04))!important;
  border-color:rgba(37,238,151,.42)!important;
}
.plan-head>span{background:rgba(22,244,220,.12)!important;border-color:rgba(22,244,220,.22)!important;color:#eafffb!important}.plan-head small{color:var(--vc-premium-a)!important}.plan-price{font-size:19px!important;letter-spacing:-.03em!important}.pricing-plan ul,.revenue-plan ul{padding-left:17px!important;margin:0!important;color:rgba(255,255,255,.76)!important}.pricing-plan li,.revenue-plan li{margin:3px 0!important}
.active-plan-box{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;align-items:center!important;gap:12px!important;border-radius:26px!important;padding:13px!important;background:linear-gradient(135deg,rgba(37,238,151,.14),rgba(22,244,220,.06))!important;border:1px solid rgba(37,238,151,.24)!important}.active-plan-box .plan-orb{width:48px!important;height:48px!important}.active-plan-box b{font-size:18px!important}.active-plan-box em{display:block!important;color:rgba(255,255,255,.70)!important;font-size:12px!important;line-height:1.3!important}.active-plan-pill{background:rgba(37,238,151,.15)!important;color:#9dffd7!important;border:1px solid rgba(37,238,151,.26)!important;border-radius:999px!important;padding:8px 10px!important;font-weight:1000!important;font-size:11px!important;white-space:nowrap!important}
.revenue-hero h3{margin:2px 0 5px!important;font-size:22px!important}.revenue-stats b{display:grid!important;gap:3px!important;padding:10px 7px!important;border-radius:18px!important;background:rgba(255,255,255,.065)!important;border:1px solid rgba(255,255,255,.10)!important;text-align:center!important}.revenue-stats b small{font-weight:800!important;color:rgba(255,255,255,.62)!important}.agent-card{grid-template-columns:54px minmax(0,1fr)!important}.agent-card button{grid-column:1/-1!important;width:100%!important}.agent-code{display:inline-block!important;margin-left:4px!important}
@media(max-width:430px){.pricing-section-title{display:grid!important;gap:4px!important}.pricing-section-title small{text-align:left!important}.active-plan-box{grid-template-columns:auto minmax(0,1fr)!important}.active-plan-pill{grid-column:2!important;width:max-content!important}.plan-head h4{font-size:15px!important}.pricing-plan,.revenue-plan{border-radius:24px!important}}


/* v51: pricing polish, agent metrics and premium action color */
:root{--vc-action-a:#20f2d6;--vc-action-b:#57f7b2;--vc-action-c:#063a34;--vc-accent-soft:rgba(32,242,214,.12)}
.primary,.action.get,.action.live,.action.book,.action.chat,#saveProfile,#restoreAccountBtn,#openWalletBtn,.chat-send-icon,.detail-actions .primary,.momo-checkout .primary,.pricing-plan .primary,.revenue-plan .primary{background:linear-gradient(135deg,var(--vc-action-a),var(--vc-action-b))!important;color:#031513!important;border:0!important;text-shadow:none!important;box-shadow:0 14px 34px rgba(32,242,214,.16),inset 0 1px 0 rgba(255,255,255,.36)!important}
.pricing-body{gap:15px!important}.current-plan-box.active-plan-box{display:grid!important;grid-template-columns:46px minmax(0,1fr) auto!important;align-items:center!important;border-radius:26px!important;padding:13px!important;background:linear-gradient(145deg,rgba(32,242,214,.11),rgba(255,255,255,.045))!important;border:1px solid rgba(32,242,214,.22)!important}.current-plan-box.active-plan-box .plan-orb,.plan-orb{width:42px!important;height:42px!important;flex:0 0 42px!important;border-radius:16px!important;background:rgba(255,255,255,.08)!important;color:#eafffb!important;box-shadow:none!important;border:1px solid rgba(255,255,255,.12)!important}.active-plan-pill{background:rgba(32,242,214,.14)!important;color:#cffff4!important;border:1px solid rgba(32,242,214,.22)!important;box-shadow:none!important}.pricing-section{overflow:hidden!important}.pricing-plan,.revenue-plan{min-height:auto!important;background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(32,242,214,.04))!important;border:1px solid rgba(255,255,255,.11)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important}.pricing-plan::after,.revenue-plan::after{display:none!important}.pricing-plan.current{border-color:rgba(32,242,214,.42)!important;background:linear-gradient(145deg,rgba(32,242,214,.13),rgba(87,247,178,.07))!important}.pricing-plan.current::after{content:''!important;display:none!important}.plan-head>span{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.12)!important;color:#eafffb!important}.plan-head h4{font-size:15px!important}.plan-price{font-size:17px!important}.pricing-plan ul{font-size:12px!important;color:rgba(255,255,255,.78)!important}.revenue-quick{margin:4px 0 0!important}.agent-join-card{border:1px solid rgba(32,242,214,.16);background:rgba(32,242,214,.045);border-radius:22px;padding:14px;display:grid;gap:10px}.agent-join-card p{margin:0;color:rgba(255,255,255,.72);line-height:1.38}.agent-card{grid-template-columns:48px minmax(0,1fr)!important}.agent-card .agent-metrics{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}.agent-card .agent-metrics em{font-style:normal;border:1px solid rgba(32,242,214,.18);background:rgba(32,242,214,.07);border-radius:999px;padding:6px 8px;font-size:11px;font-weight:900;color:#dffff7}.agent-code{color:#20f2d6!important;background:rgba(32,242,214,.10)!important}.badge.price{background:linear-gradient(135deg,#eafffb,#83f9cf)!important;color:#031513!important}.action.live{background:linear-gradient(135deg,#28f3d6,#70f6b4)!important}.action.get{background:linear-gradient(135deg,#20f2d6,#57f7b2)!important}.bottom-nav .post{box-shadow:-5px 0 0 #20f2d6,5px 0 0 #57f7b2!important}.revenue-plan-grid,.pricing-grid{align-items:stretch}@media(max-width:430px){.current-plan-box.active-plan-box{grid-template-columns:42px minmax(0,1fr)!important}.current-plan-box.active-plan-box .active-plan-pill{grid-column:2}.pricing-grid,.revenue-plan-grid{grid-template-columns:1fr!important}}

/* v51: professional pricing, working promote/agent cards, no oversized active blob */
.pricing-plan.current::after{display:none!important;content:none!important;width:0!important;height:0!important;inset:auto!important;background:none!important;}
.pricing-plan.current{overflow:hidden!important;border-color:rgba(34,238,155,.40)!important;background:linear-gradient(145deg,rgba(18,40,36,.94),rgba(8,20,22,.90))!important;box-shadow:0 18px 44px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.10)!important;}
.pricing-plan.current::before{content:'';position:absolute;right:-34px;top:-42px;width:118px;height:118px;border-radius:50%;background:radial-gradient(circle,rgba(34,238,155,.16),transparent 70%);pointer-events:none;}
.current-stamp{position:absolute;right:12px;top:12px;z-index:2;display:inline-flex;align-items:center;justify-content:center;min-height:22px;padding:4px 9px;border-radius:999px;background:rgba(34,238,155,.16);border:1px solid rgba(34,238,155,.30);color:#dfffee;font-size:9px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;}
.pricing-plan.current .plan-head,.pricing-plan.current .plan-price,.pricing-plan.current ul,.pricing-plan.current .plan-actions{position:relative;z-index:2;}
.pricing-plan.current .plan-head small{color:#70ffe3!important;}
.pricing-plan.current .plan-actions .primary:disabled{background:linear-gradient(135deg,#18f3ee,#22ee9b)!important;color:#031513!important;opacity:1!important;filter:none!important;}
.revenue-plan,.pricing-plan{isolation:isolate;}
.revenue-plan::after,.pricing-plan::after{opacity:.65;}
.agent-card em{display:block;margin-top:4px;color:#70ffe3;font-style:normal;font-weight:1000;font-size:12px;}
.agent-card button{justify-self:start;margin-top:8px;}
.plan-price{font-weight:1000;letter-spacing:-.03em;}
@media(max-width:430px){.pricing-plan.current::before{right:-46px;top:-52px;width:110px;height:110px}.current-stamp{right:10px;top:10px;font-size:8px}.pricing-plan .plan-head h4{padding-right:58px}}

/* v51: professional pricing, working promote/agent cards, no oversized active blob */
.pricing-plan.current::after{display:none!important;content:none!important;width:0!important;height:0!important;inset:auto!important;background:none!important;}
.pricing-plan.current{overflow:hidden!important;border-color:rgba(34,238,155,.40)!important;background:linear-gradient(145deg,rgba(18,40,36,.94),rgba(8,20,22,.90))!important;box-shadow:0 18px 44px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.10)!important;}
.pricing-plan.current::before{content:'';position:absolute;right:-34px;top:-42px;width:118px;height:118px;border-radius:50%;background:radial-gradient(circle,rgba(34,238,155,.16),transparent 70%);pointer-events:none;}
.current-stamp{position:absolute;right:12px;top:12px;z-index:2;display:inline-flex;align-items:center;justify-content:center;min-height:22px;padding:4px 9px;border-radius:999px;background:rgba(34,238,155,.16);border:1px solid rgba(34,238,155,.30);color:#dfffee;font-size:9px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;}
.pricing-plan.current .plan-head,.pricing-plan.current .plan-price,.pricing-plan.current ul,.pricing-plan.current .plan-actions{position:relative;z-index:2;}
.pricing-plan.current .plan-head small{color:#70ffe3!important;}
.pricing-plan.current .plan-actions .primary:disabled{background:linear-gradient(135deg,#18f3ee,#22ee9b)!important;color:#031513!important;opacity:1!important;filter:none!important;}
.revenue-plan,.pricing-plan{isolation:isolate;}
.revenue-plan::after,.pricing-plan::after{opacity:.65;}
.agent-card em{display:block;margin-top:4px;color:#70ffe3;font-style:normal;font-weight:1000;font-size:12px;}
.agent-card button{justify-self:start;margin-top:8px;}
.plan-price{font-weight:1000;letter-spacing:-.03em;}
@media(max-width:430px){.pricing-plan.current::before{right:-46px;top:-52px;width:110px;height:110px}.current-stamp{right:10px;top:10px;font-size:8px}.pricing-plan .plan-head h4{padding-right:58px}}

/* v52: public-ready account gate, clean buttons, hidden guest-only tools */
.account-locked .account-only { display: none !important; }
.account-locked #signinCard { display: grid !important; border-color: rgba(24,243,238,.26); background: linear-gradient(145deg, rgba(24,243,238,.10), rgba(255,255,255,.045)); }
.pin-help { display: none !important; }
.profile-switches.account-only, .service-profile-editor.account-only { transition: opacity .18s ease; }
body:not(.account-locked) .account-only { visibility: visible; }
/* remove the old pink-heavy commercial button color everywhere */
.primary,
.action.get,
.action.live,
.action.chat,
.detail-actions .primary,
.service-contact-card .primary,
.revenue-plan.active,
.pricing-plan.current button,
#joinAgentBtn,
#sendMomoPayment,
#saveProfile,
#publishBtn,
#sendOrderPayment,
#startContactUnlock,
#requestWithdrawBtn {
  background: linear-gradient(135deg, #20f4d2 0%, #27f59c 100%) !important;
  color: #031716 !important;
  border: 0 !important;
  box-shadow: 0 16px 34px rgba(32,244,210,.16), inset 0 1px 0 rgba(255,255,255,.24) !important;
}
.primary:hover,
.action.get:hover,
.action.live:hover,
.action.chat:hover,
#joinAgentBtn:hover,
#sendMomoPayment:hover {
  filter: brightness(1.04);
}
.chat-bubble.mine {
  background: linear-gradient(135deg, rgba(32,244,210,.92), rgba(39,245,156,.78)) !important;
  color: #031716 !important;
}
.dir-actions .profile-small,
.following,
.follow-btn.active,
.revenue-plan .selected,
.agent-card button,
#copyAgentLink {
  background: linear-gradient(135deg, rgba(32,244,210,.24), rgba(39,245,156,.16)) !important;
  border-color: rgba(32,244,210,.36) !important;
  color: #eafff8 !important;
}
.account-plan-card .plan-orb,
.wallet-orb,
.revenue-hero > span,
.checkout-hero .plan-orb {
  background: radial-gradient(circle at 30% 20%, rgba(255,255,255,.75), rgba(32,244,210,.35) 38%, rgba(39,245,156,.22)) !important;
}
.account-locked .account-plan-card,
.account-locked .account-wallet-card { min-height: 0 !important; padding: 0 !important; border: 0 !important; margin: 0 !important; }
.signin-card.compact-ok { opacity: .92; }
.revenue-plan-grid .revenue-plan { cursor: pointer; }
.revenue-plan-grid .revenue-plan:active { transform: scale(.985); }

/* v53: modal-safe toasts, forgot PIN, public launch admin/account polish */
.toast-zone { z-index: 2147483000 !important; }
.dialog-toast-zone.toast-zone {
  position: fixed !important;
  z-index: 2147483000 !important;
  left: 50% !important;
  right: auto !important;
  bottom: calc(24px + env(safe-area-inset-bottom)) !important;
  transform: translateX(-50%) !important;
  width: min(92vw, 420px) !important;
  display: grid !important;
  gap: 8px !important;
  pointer-events: none !important;
}
.link-btn.forgot-pin-btn {
  justify-self: start;
  margin-top: 8px;
  border: 0;
  background: transparent;
  color: var(--cyan);
  font-weight: 950;
  padding: 8px 2px;
  text-decoration: none;
}
.link-btn.forgot-pin-btn:disabled { opacity: .56; }
.link-btn.forgot-pin-btn.is-busy::after { content: ' •••'; letter-spacing: .15em; }
.confirm-sheet { z-index: 2147482500; }


/* v54: Adaptive tablet and desktop experience inspired by TikTok web */
.desktop-sidebar,
.desktop-top-actions { display: none; }

@media (min-width: 720px) and (max-width: 1099px) {
  body { place-items: stretch; background: #020305; }
  .phone { width: 100vw !important; max-height: none !important; height: 100dvh !important; box-shadow: none !important; }
  .reel-card { min-height: 100dvh !important; background: #020305 !important; }
  .media-wrap { inset: 0 !important; }
  .media-wrap.photo .media-main { object-fit: contain !important; }
  .card-info { left: max(18px, 7vw) !important; right: 108px !important; bottom: calc(88px + var(--safe-bottom)) !important; max-width: 560px !important; }
  .reel-card.is-active .action-rail { right: max(18px, 4vw) !important; bottom: calc(96px + var(--safe-bottom)) !important; }
  .story-strip { padding-left: max(16px, 5vw) !important; padding-right: max(16px, 5vw) !important; }
  .topbar { padding-inline: max(16px, 5vw) !important; }
  .bottom-nav { left: max(18px, 18vw) !important; right: max(18px, 18vw) !important; max-width: 560px !important; margin-inline: auto !important; }
}

@media (min-width: 1100px) {
  html, body { width: 100%; height: 100%; background: #000 !important; }
  body { display: block !important; overflow: hidden !important; }
  body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
      radial-gradient(circle at 35% -12%, rgba(24,243,238,.10), transparent 30%),
      radial-gradient(circle at 86% 12%, rgba(255,47,126,.08), transparent 26%),
      #000;
  }
  .desktop-sidebar {
    position: fixed;
    z-index: 180;
    left: 0;
    top: 0;
    bottom: 0;
    width: 246px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px 18px 18px;
    background: rgba(0,0,0,.94);
    border-right: 1px solid rgba(255,255,255,.08);
    box-shadow: 18px 0 42px rgba(0,0,0,.34);
  }
  .desktop-logo {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 0 2px 4px;
    background: transparent;
    color: #fff;
    text-align: left;
  }
  .desktop-logo img { width: 38px; height: 38px; border-radius: 12px; box-shadow: 0 0 22px rgba(24,243,238,.22); }
  .desktop-logo span { display: grid; line-height: .92; }
  .desktop-logo b { font-size: 24px; letter-spacing: -.08em; }
  .desktop-logo small { font-size: 14px; font-weight: 950; color: #dff; letter-spacing: -.04em; }
  .desktop-search {
    height: 44px;
    display: grid;
    grid-template-columns: 22px 1fr;
    align-items: center;
    gap: 8px;
    padding: 0 13px;
    border-radius: 999px;
    background: rgba(255,255,255,.11);
    border: 1px solid rgba(255,255,255,.08);
    color: rgba(255,255,255,.58);
  }
  .desktop-search svg { width: 18px; height: 18px; }
  .desktop-search input { height: 100%; padding: 0; background: transparent; border: 0; box-shadow: none; color: #fff; font-weight: 700; }
  .desktop-nav { display: grid; gap: 4px; padding-top: 2px; }
  .desktop-nav button {
    display: grid;
    grid-template-columns: 30px 1fr;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 0 10px;
    border-radius: 12px;
    background: transparent;
    color: rgba(255,255,255,.90);
    text-align: left;
    font-weight: 920;
  }
  .desktop-nav button:hover { background: rgba(255,255,255,.08); }
  .desktop-nav button.active { color: #fff; background: linear-gradient(90deg, rgba(24,243,238,.14), rgba(255,255,255,.035)); }
  .desktop-nav button.active svg { color: var(--cyan); filter: drop-shadow(0 0 12px rgba(24,243,238,.28)); }
  .desktop-login {
    margin-top: 8px;
    min-height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, #18f3ee, #25ee97) !important;
    color: #031313;
    font-weight: 1000;
    box-shadow: 0 18px 32px rgba(24,243,238,.18);
  }
  .desktop-foot { margin-top: auto; display: grid; gap: 6px; padding: 14px 4px 0; color: rgba(255,255,255,.45); font-size: 12px; line-height: 1.35; }
  .desktop-foot b { color: rgba(255,255,255,.70); }
  .desktop-top-actions {
    position: fixed;
    z-index: 181;
    right: 24px;
    top: 22px;
    display: flex;
    gap: 10px;
  }
  .desktop-top-actions button {
    min-height: 42px;
    padding: 0 16px;
    border-radius: 999px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.08);
    color: #fff;
    font-weight: 950;
    backdrop-filter: blur(16px);
  }
  .desktop-top-actions button.accent { background: linear-gradient(135deg, #18f3ee, #25ee97) !important; color: #031313; border: 0; }

  .phone { width: 100vw !important; height: 100dvh !important; max-height: none !important; overflow: hidden !important; background: #000 !important; box-shadow: none !important; }
  .phone::before { display: none !important; }
  .topbar {
    position: fixed !important;
    left: 246px !important;
    right: 0 !important;
    top: 0 !important;
    height: 96px !important;
    padding: 22px 280px 0 36px !important;
    background: linear-gradient(180deg, rgba(0,0,0,.92), rgba(0,0,0,.45) 74%, transparent) !important;
    gap: 0 !important;
  }
  .topbar .brand { display: none !important; }
  .top-row {
    grid-template-columns: 1fr 46px 46px !important;
    max-width: 650px !important;
    margin: 0 auto !important;
    gap: 12px !important;
  }
  .feed-tabs {
    justify-self: center !important;
    width: 330px !important;
    max-width: none !important;
    height: 48px !important;
    background: rgba(255,255,255,.065) !important;
    border-color: rgba(255,255,255,.11) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 42px rgba(0,0,0,.25) !important;
  }
  .feed-tabs button { font-size: 14px !important; padding: 12px 16px !important; }
  .location-row {
    position: fixed !important;
    left: 276px !important;
    top: 22px !important;
    width: auto !important;
    display: flex !important;
    gap: 10px !important;
  }
  .location-row .area-chip { max-width: 190px !important; height: 42px !important; padding: 0 14px !important; background: rgba(255,255,255,.09) !important; }
  .location-row .tiny-lang, .location-row .tiny-ai, .location-row .account-top-chip, .location-row .ghost-dot { height: 42px !important; }
  .ghost-dot b { display: none !important; }
  .vi-radar-bar { display: none !important; }
  .story-strip { display: none !important; }
  .bottom-nav { display: none !important; }

  .feed { inset: 0 !important; scroll-snap-type: y mandatory !important; background: #000 !important; }
  .reel-card {
    min-height: 100dvh !important;
    height: 100dvh !important;
    background: #000 !important;
    overflow: hidden !important;
    scroll-snap-align: start !important;
  }
  .media-wrap {
    position: absolute !important;
    top: 94px !important;
    bottom: 34px !important;
    left: clamp(315px, 21vw, 410px) !important;
    right: clamp(270px, 19vw, 380px) !important;
    width: auto !important;
    height: auto !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    background: #050505 !important;
    box-shadow: 0 22px 70px rgba(0,0,0,.62), 0 0 0 1px rgba(255,255,255,.12) !important;
  }
  .media-wrap.photo .media-main { object-fit: contain !important; object-position: center !important; }
  .media-wrap.photo.landscape .media-main { object-fit: contain !important; }
  .reel-card.media-portrait .media-wrap.photo {
    left: calc(50vw - 156px) !important;
    right: auto !important;
    width: min(430px, calc(100vw - 650px)) !important;
    max-width: 430px !important;
  }
  .reel-card.media-squareish .media-wrap.photo {
    left: calc(50vw - 235px) !important;
    right: auto !important;
    width: min(560px, calc(100vw - 620px)) !important;
  }
  .media-wrap.demo img { width: min(62%, 460px) !important; height: min(56%, 420px) !important; }
  .media-wrap::after { background: linear-gradient(180deg, rgba(0,0,0,.20) 0, rgba(0,0,0,.02) 38%, rgba(0,0,0,.18) 64%, rgba(0,0,0,.72) 100%) !important; }
  .media-wrap.photo .media-bg { opacity: .58 !important; filter: blur(20px) brightness(.60) saturate(1.16) !important; }

  .card-info {
    left: calc(clamp(315px, 21vw, 410px) + 18px) !important;
    right: auto !important;
    bottom: 56px !important;
    width: min(650px, calc(100vw - 760px)) !important;
    max-width: 650px !important;
    gap: 9px !important;
  }
  .reel-card.media-portrait .card-info {
    left: calc(50vw - 138px) !important;
    width: min(392px, calc(100vw - 700px)) !important;
  }
  .reel-card.media-squareish .card-info {
    left: calc(50vw - 215px) !important;
    width: min(520px, calc(100vw - 650px)) !important;
  }
  .card-info h1 { font-size: clamp(24px, 2.45vw, 38px) !important; line-height: .98 !important; max-width: 100% !important; }
  .card-info p { font-size: 15px !important; max-height: 44px !important; -webkit-line-clamp: 2 !important; }
  .seller-line { min-height: 44px !important; padding: 5px 12px 5px 5px !important; background: rgba(0,0,0,.46) !important; }
  .seller-line .avatar { width: 34px !important; height: 34px !important; }
  .badge { font-size: 11px !important; padding: 7px 11px !important; }

  .reel-card.is-active .action-rail {
    right: clamp(190px, 16vw, 330px) !important;
    bottom: 128px !important;
    width: 66px !important;
    gap: 12px !important;
  }
  .reel-card.media-portrait.is-active .action-rail { right: calc(50vw - 338px) !important; }
  .reel-card.media-squareish.is-active .action-rail { right: calc(50vw - 420px) !important; }
  .reel-card.is-active .action,
  .action { width: 62px !important; min-height: 66px !important; }
  .reel-card.is-active .action span,
  .action span { width: 52px !important; height: 52px !important; min-width: 52px !important; min-height: 52px !important; }
  .reel-card.is-active .action svg,
  .action svg { width: 23px !important; height: 23px !important; }
  .reel-card.is-active .action b,
  .action b { max-width: 64px !important; font-size: 10px !important; }

  .media-dots { bottom: 22px !important; }
  .feed-photo-count { bottom: 56px !important; left: 50% !important; transform: translateX(-50%) !important; }
  .directory {
    left: 246px !important;
    right: 0 !important;
    padding: 118px 56px 56px !important;
    background: radial-gradient(circle at 40% 0, rgba(24,243,238,.12), transparent 30%), #000 !important;
  }
  .directory-list { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)) !important; gap: 14px !important; }
  .directory .section-head, .directory .chips, .directory .inline-search { max-width: 1180px !important; }

  .sheet[open] { align-items: center !important; justify-content: center !important; padding-left: 246px !important; }
  .sheet-card { width: min(760px, calc(100vw - 340px)) !important; max-height: min(90dvh, 900px) !important; border-radius: 28px !important; }
  .detail-card { width: min(820px, calc(100vw - 360px)) !important; }
  .detail-media { height: min(62dvh, 620px) !important; min-height: 420px !important; }
  .chat-card { width: min(720px, calc(100vw - 360px)) !important; }
  .toast-zone { left: 266px !important; right: 24px !important; bottom: 24px !important; align-items: flex-end !important; }
}

@media (min-width: 1500px) {
  .media-wrap { left: 330px !important; right: 345px !important; }
  .card-info { left: 352px !important; width: min(690px, calc(100vw - 850px)) !important; }
  .reel-card.is-active .action-rail { right: 290px !important; }
  .reel-card.media-portrait .media-wrap.photo { left: calc(50vw - 140px) !important; width: 470px !important; }
  .reel-card.media-portrait .card-info { left: calc(50vw - 118px) !important; width: 430px !important; }
  .reel-card.media-portrait.is-active .action-rail { right: calc(50vw - 450px) !important; }
}


/* v55: desktop/tablet modal polish, real desktop detail width, keyboard and arrow navigation */
.desktop-scroll-controls { display: none; }

@media (min-width: 720px) and (max-width: 1099px) {
  .sheet { width: 100vw !important; max-width: none !important; height: 100dvh !important; margin: 0 !important; padding: 0 !important; }
  .sheet[open] { display: flex !important; align-items: center !important; justify-content: center !important; }
  .sheet-card { width: min(92vw, 820px) !important; max-width: 92vw !important; max-height: 92dvh !important; overflow-x: hidden !important; border-radius: 30px !important; }
  .detail-card { width: min(94vw, 900px) !important; max-width: 94vw !important; }
  .detail-media { height: min(58dvh, 640px) !important; min-height: 390px !important; }
}

@media (min-width: 1100px) {
  .sheet {
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    inset: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
  }
  .sheet[open] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 28px 0 274px !important;
    box-sizing: border-box !important;
  }
  .sheet::backdrop { background: rgba(0,0,0,.68) !important; backdrop-filter: blur(12px) brightness(.68) !important; }
  .sheet-card {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    top: auto !important;
    width: min(900px, calc(100vw - 340px)) !important;
    max-width: min(900px, calc(100vw - 340px)) !important;
    max-height: min(92dvh, 920px) !important;
    height: auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    border-radius: 30px !important;
    padding: 14px 18px 20px !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(24,243,238,.42) transparent;
  }
  .sheet-card::-webkit-scrollbar { width: 8px; height: 0 !important; }
  .sheet-card::-webkit-scrollbar-track { background: transparent; }
  .sheet-card::-webkit-scrollbar-thumb { background: rgba(24,243,238,.35); border-radius: 999px; }
  .sheet-card * { box-sizing: border-box; max-width: 100%; }
  .detail-card {
    width: min(1080px, calc(100vw - 360px)) !important;
    max-width: min(1080px, calc(100vw - 360px)) !important;
    max-height: min(94dvh, 940px) !important;
    padding: 12px 18px 22px !important;
    scroll-padding-top: 88px !important;
  }
  .detail-card > .sheet-bar { margin-top: 0 !important; }
  .detail-card .sheet-title {
    margin: 0 -18px 14px !important;
    padding: 14px 70px 14px 20px !important;
    top: 0 !important;
    border-radius: 28px 28px 0 0 !important;
  }
  .detail-card .sheet-title h3 {
    font-size: clamp(20px, 1.55vw, 29px) !important;
    line-height: 1.08 !important;
    max-width: calc(100% - 6px) !important;
  }
  .detail-card .sheet-title small { font-size: 11px !important; }
  .detail-media {
    height: min(64dvh, 690px) !important;
    min-height: 470px !important;
    max-height: 690px !important;
    width: 100% !important;
    margin: 0 0 14px !important;
    border-radius: 24px !important;
  }
  .detail-media .detail-main {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
  }
  .detail-media .detail-bg { inset: -28px !important; width: calc(100% + 56px) !important; height: calc(100% + 56px) !important; }
  .detail-thumbs { max-width: 100% !important; overflow-x: auto !important; padding-bottom: 10px !important; }
  .detail-meta h2 { font-size: clamp(28px, 2.2vw, 42px) !important; max-width: 100% !important; }
  .profile-card, .pricing-card, .revenue-card, .wallet-card, .studio-card, .pulse-card, .radar-card, .chat-card { width: min(900px, calc(100vw - 340px)) !important; max-width: min(900px, calc(100vw - 340px)) !important; }
  .post-card { width: min(920px, calc(100vw - 340px)) !important; max-width: min(920px, calc(100vw - 340px)) !important; }
  .desktop-scroll-controls {
    position: fixed;
    z-index: 182;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    gap: 16px;
    pointer-events: auto;
  }
  .desktop-scroll-controls button {
    width: 54px;
    height: 54px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    font-size: 30px;
    line-height: 1;
    font-weight: 1000;
    color: #fff;
    background: rgba(255,255,255,.13);
    border: 1px solid rgba(255,255,255,.13);
    box-shadow: 0 18px 44px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.12);
    backdrop-filter: blur(18px);
  }
  .desktop-scroll-controls button:hover { background: rgba(24,243,238,.18); border-color: rgba(24,243,238,.34); transform: translateY(-1px); }
  body:has(dialog[open]) .desktop-scroll-controls { opacity: .16; pointer-events: none; }
}

@media (min-width: 1500px) {
  .detail-card { width: min(1160px, calc(100vw - 390px)) !important; max-width: min(1160px, calc(100vw - 390px)) !important; }
  .detail-media { height: min(66dvh, 740px) !important; max-height: 740px !important; }
}

/* v55: Desktop modal/stage polish, keyboard scrolling and TikTok-style desktop arrows */
@media (min-width: 1100px) {
  body.vc-desktop-ready .sheet,
  .sheet[open] {
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: none !important;
    padding: 0 0 0 246px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
    background: transparent !important;
  }
  .sheet::backdrop {
    background: rgba(0,0,0,.72) !important;
    backdrop-filter: blur(18px) brightness(.72) !important;
  }
  .sheet-card {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: min(940px, calc(100vw - 340px)) !important;
    max-width: none !important;
    max-height: min(92dvh, 930px) !important;
    min-height: auto !important;
    margin: 0 auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 18px 22px 24px !important;
    border-radius: 30px !important;
    background:
      radial-gradient(circle at 18% 0, rgba(24,243,238,.10), transparent 34%),
      linear-gradient(180deg, rgba(7,12,16,.985), rgba(3,7,10,.965)) !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    box-shadow: 0 34px 120px rgba(0,0,0,.64), inset 0 1px 0 rgba(255,255,255,.07) !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(32,242,214,.55) rgba(255,255,255,.06) !important;
    overscroll-behavior: contain !important;
  }
  .sheet-card::-webkit-scrollbar { width: 10px !important; height: 10px !important; }
  .sheet-card::-webkit-scrollbar-thumb { background: rgba(32,242,214,.50) !important; border-radius: 999px !important; border: 2px solid rgba(6,10,14,.95) !important; }
  .sheet-card::-webkit-scrollbar-track { background: rgba(255,255,255,.045) !important; border-radius: 999px !important; }
  .sheet-card.compact { width: min(620px, calc(100vw - 360px)) !important; }
  .sheet-card.tall { width: min(980px, calc(100vw - 340px)) !important; }
  .share-card, .wanted-card, .offer-card, .schedule-card, .contact-unlock-card { width: min(680px, calc(100vw - 360px)) !important; }
  .pricing-card, .revenue-card, .studio-card, .wallet-card, .inbox-card, .chat-card, .radar-card, .pulse-card { width: min(1060px, calc(100vw - 340px)) !important; }

  .detail-card {
    width: min(1180px, calc(100vw - 330px)) !important;
    max-height: min(93dvh, 960px) !important;
    padding: 0 22px 24px !important;
    overflow-x: hidden !important;
  }
  .detail-card > .sheet-bar {
    position: sticky !important;
    top: 0 !important;
    z-index: 120 !important;
    margin-top: 10px !important;
  }
  .detail-card .sheet-title {
    position: sticky !important;
    top: 0 !important;
    z-index: 118 !important;
    margin: 0 -22px 18px !important;
    padding: 16px 76px 16px 22px !important;
    min-height: 76px !important;
    background:
      linear-gradient(180deg, rgba(3,7,10,.99), rgba(3,7,10,.94) 76%, rgba(3,7,10,.78)) !important;
    border-bottom: 1px solid rgba(255,255,255,.10) !important;
    box-shadow: 0 22px 44px rgba(0,0,0,.34) !important;
  }
  .detail-card .sheet-title .xbtn { right: 18px !important; top: 18px !important; }
  .detail-card .sheet-title h3 { font-size: clamp(22px, 1.55vw, 31px) !important; line-height: 1.12 !important; -webkit-line-clamp: 2 !important; }

  #detailBody {
    display: grid !important;
    grid-template-columns: minmax(420px, .96fr) minmax(430px, 1fr) !important;
    gap: 18px 22px !important;
    align-items: start !important;
    overflow: visible !important;
  }
  #detailBody .detail-media,
  #detailBody .detail-thumbs { grid-column: 1 !important; }
  #detailBody .detail-meta,
  #detailBody .detail-service-note,
  #detailBody .detail-actions { grid-column: 2 !important; }
  .detail-media {
    height: min(70dvh, 720px) !important;
    min-height: 480px !important;
    max-height: calc(92dvh - 132px) !important;
    border-radius: 26px !important;
    background: #020406 !important;
  }
  .detail-media .detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
  }
  .detail-media .detail-bg { opacity: .58 !important; filter: blur(26px) brightness(.48) saturate(1.12) !important; }
  .detail-thumbs {
    display: flex !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 4px 2px 12px !important;
    max-width: 100% !important;
    scrollbar-width: thin !important;
  }
  .detail-thumbs button { flex: 0 0 74px !important; width: 74px !important; height: 74px !important; }
  .detail-meta { min-width: 0 !important; align-self: start !important; }
  .detail-meta h2 { font-size: clamp(30px, 2.3vw, 46px) !important; line-height: 1.02 !important; }
  .detail-meta > p.muted { font-size: 15px !important; line-height: 1.5 !important; max-height: none !important; }
  .ai-assist-box.priority { margin-top: 10px !important; }
  .detail-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    gap: 10px !important;
    margin-top: 0 !important;
  }
  .owner-tools { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }

  #profileSheet .sheet-card { width: min(1040px, calc(100vw - 340px)) !important; }
  #profileBody { overflow-x: hidden !important; }
  #profileBody .profile-hero {
    display: grid !important;
    grid-template-columns: 98px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 18px !important;
  }
  #profileBody .profile-hero strong,
  #profileBody .profile-hero span,
  #profileBody .profile-hero p { min-width: 0 !important; overflow-wrap: anywhere !important; }
  #profileBody .profile-actions {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)) !important;
    gap: 10px !important;
    overflow: visible !important;
  }
  #profileBody .profile-actions > * { width: 100% !important; min-width: 0 !important; }
  .showroom-grid { grid-template-columns: repeat(auto-fill, minmax(172px, 1fr)) !important; gap: 12px !important; overflow: visible !important; }
  .inside-card { min-width: 0 !important; }
  .vc-qr-card { grid-template-columns: 138px minmax(0,1fr) !important; align-items: center !important; }
  .qr-copy, .qr-copy small { min-width: 0 !important; overflow-wrap: anywhere !important; }

  .desktop-scroll-controls {
    position: fixed;
    z-index: 179;
    right: 28px;
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    gap: 16px;
    pointer-events: auto;
  }
  .desktop-scroll-controls button {
    width: 54px;
    height: 54px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.13);
    border: 1px solid rgba(255,255,255,.10);
    color: #fff;
    backdrop-filter: blur(18px);
    box-shadow: 0 18px 44px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.12);
    transition: transform .16s ease, background .16s ease, opacity .16s ease;
  }
  .desktop-scroll-controls button:hover { transform: scale(1.05); background: rgba(255,255,255,.18); }
  .desktop-scroll-controls svg { width: 25px; height: 25px; stroke: currentColor; fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
  body.vc-sheet-open .desktop-scroll-controls { opacity: .34; pointer-events: none; }
  .desktop-key-hint {
    position: fixed;
    z-index: 178;
    right: 24px;
    bottom: 24px;
    color: rgba(255,255,255,.45);
    font-size: 12px;
    font-weight: 800;
    display: block;
  }
}

@media (min-width: 1100px) and (max-width: 1320px) {
  .sheet[open] { padding-left: 220px !important; }
  .desktop-sidebar { width: 220px !important; }
  .desktop-top-actions { right: 16px !important; }
  .detail-card { width: min(980px, calc(100vw - 260px)) !important; }
  #detailBody { grid-template-columns: minmax(360px, .92fr) minmax(360px, 1fr) !important; gap: 16px !important; }
  .detail-media { min-height: 410px !important; height: min(66dvh, 650px) !important; }
  .detail-actions { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  .desktop-scroll-controls { right: 18px !important; }
}

@media (min-width: 1100px) and (max-height: 760px) {
  .sheet-card { max-height: 94dvh !important; }
  .detail-card { max-height: 94dvh !important; }
  .detail-media { min-height: 320px !important; height: min(58dvh, 540px) !important; }
  .detail-card .sheet-title { min-height: 62px !important; padding-top: 12px !important; padding-bottom: 12px !important; }
}

/* v55: Desktop modal stage, keyboard/arrow navigation and unclipped details */
.desktop-scroll-arrows { display: none; }
@media (min-width: 1100px) {
  .sheet {
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    inset: 0 !important;
    border: 0 !important;
    background: transparent !important;
    overflow: hidden !important;
  }
  .sheet::backdrop {
    background: rgba(0,0,0,.66) !important;
    backdrop-filter: blur(16px) brightness(.74) !important;
  }
  .sheet[open] {
    display: grid !important;
    place-items: center !important;
    padding-left: 246px !important;
    box-sizing: border-box !important;
  }
  .sheet-card {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    width: min(920px, calc(100vw - 360px)) !important;
    max-width: none !important;
    max-height: min(92dvh, 920px) !important;
    border-radius: 30px !important;
    overflow: auto !important;
    overflow-x: hidden !important;
    padding: 18px 20px 22px !important;
    background: rgba(4, 8, 11, .985) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    box-shadow: 0 34px 120px rgba(0,0,0,.62), 0 0 0 1px rgba(24,243,238,.06) inset !important;
  }
  .sheet-card::-webkit-scrollbar,
  #detailBody::-webkit-scrollbar { width: 8px; height: 8px; }
  .sheet-card::-webkit-scrollbar-thumb,
  #detailBody::-webkit-scrollbar-thumb { background: rgba(255,255,255,.22); border-radius: 999px; }
  .sheet-card::-webkit-scrollbar-track,
  #detailBody::-webkit-scrollbar-track { background: rgba(255,255,255,.04); border-radius: 999px; }

  #detailSheet.sheet[open] {
    padding-left: 246px !important;
    place-items: center !important;
  }
  #detailSheet .detail-card {
    width: min(1240px, calc(100vw - 340px)) !important;
    max-height: min(92dvh, 940px) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    padding: 16px 18px 18px !important;
  }
  #detailSheet .detail-card > .sheet-bar {
    position: relative !important;
    top: auto !important;
    flex: 0 0 auto !important;
    margin: 0 auto 10px !important;
  }
  #detailSheet .detail-card .sheet-title {
    position: sticky !important;
    top: 0 !important;
    z-index: 90 !important;
    flex: 0 0 auto !important;
    margin: 0 -18px 16px !important;
    padding: 12px 70px 14px 20px !important;
    background: linear-gradient(180deg, rgba(3,7,10,.995), rgba(3,7,10,.94) 78%, rgba(3,7,10,.74)) !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: 0 18px 42px rgba(0,0,0,.34) !important;
  }
  #detailSheet .detail-card .sheet-title .xbtn { right: 18px !important; top: 12px !important; }
  #detailSheet .detail-card .sheet-title h3 {
    font-size: clamp(20px, 1.45vw, 28px) !important;
    line-height: 1.05 !important;
    max-width: min(960px, 100%) !important;
    -webkit-line-clamp: 2 !important;
  }
  #detailSheet #detailBody {
    min-height: 0 !important;
    flex: 1 1 auto !important;
    overflow: auto !important;
    overflow-x: hidden !important;
    display: grid !important;
    grid-template-columns: minmax(440px, 1.02fr) minmax(360px, .98fr) !important;
    grid-auto-rows: min-content !important;
    align-items: start !important;
    gap: 16px 24px !important;
    padding: 0 4px 24px 0 !important;
    scrollbar-gutter: stable !important;
  }
  #detailSheet #detailBody .detail-media {
    grid-column: 1 !important;
    grid-row: 1 !important;
    position: sticky !important;
    top: 0 !important;
    align-self: start !important;
    height: min(72dvh, 720px) !important;
    min-height: 520px !important;
    max-height: 720px !important;
    border-radius: 24px !important;
    background: #030507 !important;
    box-shadow: 0 24px 74px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.10) !important;
  }
  #detailSheet #detailBody .detail-media .detail-main,
  #detailSheet #detailBody .detail-media img.detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
  }
  #detailSheet #detailBody .detail-media .detail-bg {
    opacity: .36 !important;
    filter: blur(22px) brightness(.62) saturate(1.12) !important;
    transform: scale(1.04) !important;
  }
  #detailSheet #detailBody .detail-thumbs {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin-top: 0 !important;
    padding: 0 2px 2px !important;
    overflow-x: auto !important;
  }
  #detailSheet #detailBody .detail-meta {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    min-width: 0 !important;
    padding-top: 0 !important;
  }
  #detailSheet #detailBody .detail-actions,
  #detailSheet #detailBody .detail-service-note,
  #detailSheet #detailBody .owner-tools,
  #detailSheet #detailBody .price-radar-box,
  #detailSheet #detailBody .trust-mini {
    grid-column: 2 !important;
  }
  #detailSheet #detailBody .detail-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 10px !important;
    padding-bottom: 6px !important;
  }
  #detailSheet #detailBody .detail-actions .primary,
  #detailSheet #detailBody .detail-actions .soft,
  #detailSheet #detailBody .detail-actions a {
    min-height: 50px !important;
    border-radius: 18px !important;
  }
  #detailSheet #detailBody .detail-meta h2 {
    font-size: clamp(28px, 2.15vw, 42px) !important;
    line-height: .98 !important;
    letter-spacing: -.055em !important;
    margin: 12px 0 14px !important;
  }
  #detailSheet #detailBody .ai-assist-box,
  #detailSheet #detailBody .price-radar-box,
  #detailSheet #detailBody .trust-mini {
    border-radius: 22px !important;
  }
  #profileSheet .sheet-card,
  #meSheet .sheet-card,
  #pricingSheet .sheet-card,
  #revenueSheet .sheet-card,
  #studioSheet .sheet-card,
  #walletSheet .sheet-card {
    width: min(1040px, calc(100vw - 360px)) !important;
  }
  #profileSheet .showroom-grid { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important; gap: 14px !important; }
  #profileSheet .profile-actions { grid-template-columns: repeat(4, minmax(0,1fr)) !important; }

  .desktop-scroll-arrows {
    position: fixed;
    z-index: 210;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    gap: 14px;
    pointer-events: auto;
  }
  .desktop-scroll-arrows button {
    width: 54px;
    height: 54px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    color: #fff;
    background: rgba(255,255,255,.13);
    border: 1px solid rgba(255,255,255,.13);
    box-shadow: 0 18px 44px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.12);
    backdrop-filter: blur(16px);
    transition: transform .16s ease, background .16s ease, border-color .16s ease;
  }
  .desktop-scroll-arrows button:hover { transform: translateY(-2px) scale(1.04); background: rgba(24,243,238,.17); border-color: rgba(24,243,238,.34); }
  .desktop-scroll-arrows svg { width: 24px; height: 24px; stroke-width: 2.6px; fill: none; stroke: currentColor; }
  .desktop-scroll-arrows .up svg { transform: rotate(-90deg); }
  .desktop-scroll-arrows .down svg { transform: rotate(90deg); }
  .desktop-scroll-hint {
    position: fixed;
    z-index: 209;
    right: 24px;
    bottom: 28px;
    color: rgba(255,255,255,.52);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
    pointer-events: none;
  }
}

@media (min-width: 1100px) and (max-width: 1280px) {
  #detailSheet .detail-card { width: min(980px, calc(100vw - 300px)) !important; }
  #detailSheet #detailBody { grid-template-columns: minmax(390px, 1fr) minmax(330px, .9fr) !important; gap: 14px 18px !important; }
  #detailSheet #detailBody .detail-media { min-height: 440px !important; height: min(66dvh, 620px) !important; }
}

@media (max-width: 1099px) {
  .desktop-scroll-arrows, .desktop-scroll-hint { display: none !important; }
}

/* v55: desktop/tablet modal polish, full details and keyboard arrows */
.desktop-feed-controls{display:none}
@media (min-width:1100px){
  .desktop-feed-controls{
    position:fixed;z-index:182;right:24px;top:50%;transform:translateY(-50%);display:grid;gap:14px;
  }
  .desktop-feed-controls button{
    width:56px;height:56px;border-radius:999px;display:grid;place-items:center;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.12);color:#fff;backdrop-filter:blur(18px);box-shadow:0 18px 40px rgba(0,0,0,.35);transition:transform .18s ease,background .18s ease,border-color .18s ease;
  }
  .desktop-feed-controls button:hover{transform:translateY(-1px) scale(1.04);background:rgba(24,243,238,.18);border-color:rgba(24,243,238,.38)}
  .desktop-feed-controls svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

  .sheet{width:100vw!important;max-width:none!important;height:100dvh!important;margin:0!important;padding:0!important;overflow:hidden!important;}
  .sheet[open]{display:flex!important;align-items:center!important;justify-content:center!important;padding-left:246px!important;box-sizing:border-box!important;}
  .sheet-card{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;width:min(900px,calc(100vw - 330px))!important;max-width:none!important;height:auto!important;max-height:min(92dvh,980px)!important;overflow-y:auto!important;overflow-x:hidden!important;border-radius:32px!important;padding:18px 20px 24px!important;box-shadow:0 34px 120px rgba(0,0,0,.72),0 0 0 1px rgba(255,255,255,.11)!important;}
  .sheet-card.compact{max-height:min(82dvh,780px)!important}
  .sheet-card.tall{max-height:min(92dvh,980px)!important}
  .sheet-card::-webkit-scrollbar{width:8px;height:8px}.sheet-card::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:999px}.sheet-card::-webkit-scrollbar-track{background:transparent}

  #profileSheet .sheet-card,#pricingSheet .sheet-card,#revenueSheet .sheet-card,#walletSheet .sheet-card,#studioSheet .sheet-card,#pulseSheet .sheet-card,#radarSheet .sheet-card,#inboxSheet .sheet-card,#chatSheet .sheet-card{width:min(980px,calc(100vw - 340px))!important;}
  #shareSheet .sheet-card{width:min(720px,calc(100vw - 340px))!important;}

  .detail-card{width:min(1180px,calc(100vw - 330px))!important;max-width:1180px!important;padding:0!important;max-height:94dvh!important;border-radius:34px!important;}
  .detail-card>.sheet-bar{position:sticky!important;top:0!important;z-index:98!important;margin:10px auto 0!important;}
  .detail-card .sheet-title{position:sticky!important;top:0!important;z-index:96!important;margin:0!important;padding:16px 76px 16px 24px!important;background:linear-gradient(180deg,rgba(3,7,10,.985),rgba(3,7,10,.935) 82%,rgba(3,7,10,.78))!important;border-bottom:1px solid rgba(255,255,255,.08)!important;backdrop-filter:blur(20px)!important;}
  .detail-card .sheet-title .xbtn{right:20px!important;top:15px!important;}
  .detail-card .sheet-title h3{font-size:clamp(22px,1.8vw,30px)!important;line-height:1.05!important;max-width:100%!important;display:block!important;white-space:normal!important;overflow:visible!important;}
  .detail-card .sheet-title small{font-size:12px!important;letter-spacing:.14em!important;}
  #detailBody{min-width:0!important;overflow:visible!important;padding:20px 24px 26px;box-sizing:border-box;}
  #detailBody>*{min-width:0!important;}
  .detail-media{border-radius:28px!important;overflow:hidden!important;width:100%!important;max-width:100%!important;}
  .detail-media .detail-main{object-fit:contain!important;object-position:center center!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;}
  .detail-media .detail-bg{object-fit:cover!important;}
  .detail-thumbs{max-width:100%!important;overflow-x:auto!important;}
  .detail-meta{min-width:0!important;}
  .detail-meta h2{font-size:clamp(26px,2.2vw,38px)!important;line-height:1.02!important;letter-spacing:-.05em!important;}
  .detail-actions{min-width:0!important;}
}
@media (min-width:1280px){
  #detailBody{display:grid!important;grid-template-columns:minmax(460px,1.08fr) minmax(380px,.82fr);grid-template-rows:auto auto 1fr;column-gap:22px;row-gap:12px;align-items:start;}
  #detailBody>.detail-media{grid-column:1;grid-row:1;height:clamp(480px,68vh,720px)!important;min-height:0!important;margin:0!important;}
  #detailBody>.detail-thumbs{grid-column:1;grid-row:2;margin:0!important;}
  #detailBody>.detail-meta{grid-column:2;grid-row:1 / span 2;max-height:calc(94dvh - 118px);overflow-y:auto;padding-right:4px;scrollbar-width:thin;}
  #detailBody>.detail-service-note{grid-column:2;grid-row:3;margin-top:0!important;}
  #detailBody>.detail-actions{grid-column:2;grid-row:3;align-self:start;}
  #detailBody>.detail-meta::-webkit-scrollbar{width:7px}#detailBody>.detail-meta::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:999px}
  .detail-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (min-width:1100px) and (max-width:1279px){
  .detail-card{width:min(860px,calc(100vw - 310px))!important;}
  #detailBody{display:block!important;}
  .detail-media{height:clamp(430px,60vh,650px)!important;min-height:0!important;}
}
@media (min-width:1500px){
  .detail-card{width:min(1260px,calc(100vw - 360px))!important;}
  #detailBody{grid-template-columns:minmax(560px,1.16fr) minmax(420px,.84fr)!important;}
  #detailBody>.detail-media{height:clamp(540px,70vh,760px)!important;}
}


/* v55: Desktop/tablet detail polish, full-width modal stage and keyboard navigation */
.sheet-card { overflow-x: hidden !important; }
.sheet-card img { max-width: 100%; }

.desktop-scroll-controls { display: none; }

@media (min-width: 1100px) {
  .desktop-scroll-controls {
    position: fixed;
    z-index: 182;
    right: 22px;
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    gap: 14px;
    pointer-events: auto;
  }
  .desktop-scroll-controls button {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.12);
    color: #fff;
    box-shadow: 0 18px 38px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
    backdrop-filter: blur(18px);
    transition: transform .16s ease, background .16s ease, border-color .16s ease;
  }
  .desktop-scroll-controls button:hover {
    transform: translateY(-1px) scale(1.04);
    background: rgba(24,243,238,.16);
    border-color: rgba(24,243,238,.34);
  }
  .desktop-scroll-controls svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 2.7; stroke-linecap: round; stroke-linejoin: round; }

  .sheet[open] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding-left: 246px !important;
    padding-right: 88px !important;
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
  .sheet::backdrop { background: rgba(0,0,0,.66) !important; backdrop-filter: blur(18px) brightness(.82) !important; }
  .sheet-card {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: min(920px, calc(100vw - 370px)) !important;
    max-width: none !important;
    max-height: min(90dvh, 920px) !important;
    border-radius: 28px !important;
    padding: 14px 18px 20px !important;
    background: linear-gradient(145deg, rgba(4,8,11,.985), rgba(4,11,12,.96)) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: 0 36px 120px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.055) !important;
  }
  .sheet-card.tall { max-height: min(92dvh, 940px) !important; }
  .sheet-card.compact { max-height: min(82dvh, 760px) !important; }
  .sheet-title { position: sticky !important; top: 0 !important; z-index: 20 !important; padding: 10px 58px 12px 0 !important; background: linear-gradient(180deg, rgba(4,8,11,.98), rgba(4,8,11,.82) 72%, rgba(4,8,11,0)) !important; }
  .sheet-title .xbtn { position: absolute !important; right: 0 !important; top: 8px !important; }

  #profileSheet .sheet-card,
  #meSheet .sheet-card,
  #walletSheet .sheet-card,
  #pricingSheet .sheet-card,
  #revenueSheet .sheet-card,
  #studioSheet .sheet-card,
  #pulseSheet .sheet-card,
  #radarSheet .sheet-card,
  #searchSheet .sheet-card,
  #postSheet .sheet-card,
  #chatSheet .sheet-card {
    width: min(980px, calc(100vw - 360px)) !important;
  }

  #profileBody .inside-grid,
  .profile-products,
  .portfolio-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important;
    gap: 12px !important;
  }

  #detailSheet[open] { padding-right: 80px !important; }
  #detailSheet .detail-card {
    width: min(1180px, calc(100vw - 360px)) !important;
    max-height: min(92dvh, 940px) !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    padding: 12px 18px 18px !important;
  }
  #detailSheet .detail-card > .sheet-bar { flex: 0 0 auto; margin: 0 auto 10px !important; }
  #detailSheet .detail-card > .sheet-title {
    flex: 0 0 auto !important;
    margin: 0 -18px 14px !important;
    padding: 12px 68px 14px 20px !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: 0 16px 34px rgba(0,0,0,.22) !important;
  }
  #detailSheet .detail-card > .sheet-title h3 {
    font-size: clamp(18px, 1.45vw, 24px) !important;
    line-height: 1.12 !important;
    max-width: 100% !important;
    -webkit-line-clamp: 2 !important;
  }
  #detailBody {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
  }
  #detailSheet .detail-media {
    background: radial-gradient(circle at 50% 50%, rgba(24,243,238,.10), rgba(2,4,6,1) 70%) !important;
  }
  #detailSheet .detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
  }
  #detailSheet .detail-bg {
    object-fit: cover !important;
    filter: blur(26px) brightness(.48) saturate(1.12) !important;
    opacity: .70 !important;
  }
  #detailSheet .detail-thumbs { max-width: 100%; }
  #detailSheet .detail-actions { gap: 10px !important; }

  #chatSheet .chat-card {
    height: min(88dvh, 820px) !important;
    min-height: 640px !important;
    display: flex !important;
    flex-direction: column !important;
  }
  #chatSheet .chat-messages { flex: 1 1 auto !important; min-height: 260px !important; }
}

@media (min-width: 1280px) {
  #detailBody {
    display: grid !important;
    grid-template-columns: minmax(520px, 1fr) minmax(380px, 440px) !important;
    grid-template-rows: auto auto 1fr !important;
    gap: 16px 20px !important;
    align-items: start !important;
  }
  #detailBody > .detail-media {
    grid-column: 1 !important;
    grid-row: 1 !important;
    height: min(72dvh, 710px) !important;
    min-height: 470px !important;
    margin: 0 !important;
    border-radius: 22px !important;
  }
  #detailBody > .detail-thumbs {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin: 0 !important;
    padding: 4px 2px 0 !important;
  }
  #detailBody > .detail-meta {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    align-self: stretch !important;
    max-height: calc(min(92dvh, 940px) - 104px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 2px 6px 92px 0 !important;
    scrollbar-width: thin;
  }
  #detailBody > .detail-service-note,
  #detailBody > .detail-actions {
    grid-column: 2 !important;
    grid-row: 3 !important;
    align-self: end !important;
  }
  #detailBody > .detail-actions {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 10 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    padding: 12px 0 0 !important;
    margin-top: -76px !important;
    background: linear-gradient(180deg, rgba(4,8,11,0), rgba(4,8,11,.96) 28%, rgba(4,8,11,1)) !important;
  }
  #detailBody > .detail-actions button,
  #detailBody > .detail-actions a { min-width: 0 !important; }
  #detailBody > .detail-meta h2 { font-size: clamp(28px, 2.1vw, 42px) !important; }
  #detailBody .ai-assist-box { margin: 12px 0 !important; }
}

@media (min-width: 1100px) and (max-width: 1279px) {
  #detailSheet .detail-card { overflow-y: auto !important; width: min(860px, calc(100vw - 320px)) !important; }
  #detailSheet .detail-media { height: min(58dvh, 580px) !important; min-height: 380px !important; }
  #detailSheet .detail-actions { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 1099px) {
  .desktop-scroll-controls { display: none !important; }
}

/* v55: Desktop/tablet detail modal polish + keyboard arrows */
@media (min-width: 1100px) {
  .sheet {
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: none !important;
    overflow: hidden !important;
    padding: 0 !important;
    background: transparent !important;
  }
  .sheet[open] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 34px 34px 34px 280px !important;
  }
  .sheet-card {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    top: auto !important;
    width: min(900px, calc(100vw - 360px)) !important;
    max-width: none !important;
    max-height: min(92dvh, 940px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    border-radius: 30px !important;
    padding: 14px 20px 22px !important;
    background: linear-gradient(180deg, rgba(5,9,12,.985), rgba(4,8,11,.965)) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: 0 32px 90px rgba(0,0,0,.70), inset 0 1px 0 rgba(255,255,255,.05) !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(30,246,244,.36) rgba(255,255,255,.06);
  }
  .sheet-card::-webkit-scrollbar { width: 10px; height: 0 !important; }
  .sheet-card::-webkit-scrollbar-track { background: rgba(255,255,255,.04); border-radius: 999px; }
  .sheet-card::-webkit-scrollbar-thumb { background: linear-gradient(180deg, rgba(24,243,238,.50), rgba(37,238,151,.38)); border-radius: 999px; border: 2px solid rgba(3,7,10,.95); }
  .sheet-card * { min-width: 0; }

  .detail-card {
    width: min(980px, calc(100vw - 380px)) !important;
    max-height: min(92dvh, 960px) !important;
    padding: 0 22px 24px !important;
    scroll-padding-top: 104px !important;
  }
  .detail-card > .sheet-bar {
    position: sticky !important;
    top: 0 !important;
    z-index: 120 !important;
    margin-top: 12px !important;
    margin-bottom: 0 !important;
  }
  .detail-card .sheet-title {
    position: sticky !important;
    top: 17px !important;
    z-index: 118 !important;
    margin: 0 -22px 18px !important;
    padding: 14px 72px 16px 22px !important;
    min-height: 74px !important;
    background: linear-gradient(180deg, rgba(3,7,10,.99), rgba(3,7,10,.94) 76%, rgba(3,7,10,.78)) !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: 0 18px 34px rgba(0,0,0,.28) !important;
    backdrop-filter: blur(22px) saturate(1.06) !important;
  }
  .detail-card .sheet-title h3 {
    font-size: clamp(22px, 1.65vw, 30px) !important;
    line-height: 1.05 !important;
    max-width: 100% !important;
    -webkit-line-clamp: 2 !important;
  }
  .detail-card .sheet-title .xbtn { right: 18px !important; top: 16px !important; }
  .detail-media {
    height: min(58dvh, 610px) !important;
    min-height: 450px !important;
    width: 100% !important;
    border-radius: 28px !important;
    margin: 0 0 14px !important;
    background: radial-gradient(circle at 50% 42%, rgba(24,243,238,.10), rgba(4,6,9,1) 68%) !important;
  }
  .detail-media .detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    padding: 0 !important;
  }
  .detail-media .detail-bg {
    object-fit: cover !important;
    filter: blur(24px) brightness(.44) saturate(1.14) !important;
    opacity: .72 !important;
  }
  .detail-thumbs {
    padding: 2px 2px 14px !important;
    gap: 10px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }
  .detail-thumbs button {
    flex: 0 0 72px !important;
    width: 72px !important;
    height: 72px !important;
    border-radius: 20px !important;
  }
  .detail-thumbs img { object-fit: cover !important; border-radius: 16px !important; }
  .detail-meta h2 { font-size: clamp(28px, 2.2vw, 42px) !important; line-height: 1 !important; max-width: 100% !important; }
  .detail-actions { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; }
  .profileSheet .sheet-card, .profile-card { width: min(900px, calc(100vw - 360px)) !important; }
  .profile-sheet .showroom-grid, .showroom-grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important; }

  .desktop-feed-arrows {
    position: fixed;
    z-index: 190;
    right: 22px;
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    gap: 12px;
    pointer-events: auto;
  }
  .desktop-feed-arrows button {
    width: 54px;
    height: 54px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.13);
    border: 1px solid rgba(255,255,255,.13);
    color: #fff;
    backdrop-filter: blur(16px);
    box-shadow: 0 14px 34px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.05);
    transition: transform .16s ease, background .16s ease, border-color .16s ease;
  }
  .desktop-feed-arrows button:hover { transform: translateY(-2px); background: rgba(24,243,238,.16); border-color: rgba(24,243,238,.28); }
  .desktop-feed-arrows svg { width: 25px; height: 25px; stroke: #fff; fill: none; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
  .sheet[open] ~ .desktop-feed-arrows,
  body.sheet-open .desktop-feed-arrows { opacity: .45; }
  .detail-nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9;
    width: 46px;
    height: 58px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    background: rgba(2,6,9,.54) !important;
    border: 1px solid rgba(255,255,255,.16) !important;
    color: #fff !important;
    backdrop-filter: blur(14px);
    box-shadow: 0 14px 34px rgba(0,0,0,.35);
  }
  .detail-nav-btn.prev { left: 14px; }
  .detail-nav-btn.next { right: 14px; }
  .detail-nav-btn svg { width: 24px; height: 24px; stroke: #fff; fill: none; stroke-width: 2.55; stroke-linecap: round; stroke-linejoin: round; }
  .detail-nav-btn:hover { background: rgba(24,243,238,.18) !important; border-color: rgba(24,243,238,.32) !important; }
}
@media (max-width: 1099px) { .desktop-feed-arrows { display: none !important; } }
@media (min-width: 1100px) and (max-height: 760px) {
  .detail-media { height: min(50dvh, 500px) !important; min-height: 340px !important; }
  .detail-card { max-height: 94dvh !important; }
  .detail-card .sheet-title { min-height: 64px !important; padding-top: 11px !important; padding-bottom: 12px !important; }
}

/* v55 final desktop control cleanup: one clean arrow stack only */
@media (min-width: 1100px) {
  .desktop-feed-arrows,
  .desktop-feed-controls,
  .desktop-scroll-arrows,
  .desktop-scroll-hint { display: none !important; }
  .desktop-scroll-controls {
    position: fixed !important;
    z-index: 230 !important;
    right: 28px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: grid !important;
    gap: 14px !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  body.vc-sheet-open .desktop-scroll-controls,
  body:has(dialog[open]) .desktop-scroll-controls {
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  .desktop-scroll-controls button {
    width: 56px !important;
    height: 56px !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    font-size: 0 !important;
    color: #fff !important;
    background: rgba(255,255,255,.13) !important;
    border: 1px solid rgba(255,255,255,.16) !important;
    box-shadow: 0 22px 54px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.14) !important;
    backdrop-filter: blur(18px) !important;
  }
  .desktop-scroll-controls button::before {
    content: "";
    width: 15px;
    height: 15px;
    border-top: 3px solid currentColor;
    border-left: 3px solid currentColor;
    display: block;
  }
  .desktop-scroll-controls [data-desktop-scroll="prev"]::before { transform: translateY(4px) rotate(45deg); }
  .desktop-scroll-controls [data-desktop-scroll="next"]::before { transform: translateY(-4px) rotate(-135deg); }
  .desktop-scroll-controls button:hover { background: rgba(24,243,238,.18) !important; border-color: rgba(24,243,238,.42) !important; transform: scale(1.045) !important; }
}

/* v55 final pass: wider desktop detail pages, no clipped modal content */
@media (min-width: 1100px) {
  .sheet {
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  .sheet[open] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    padding: 28px 92px 28px 286px !important;
  }
  .sheet-card {
    position: relative !important;
    inset: auto !important;
    width: min(980px, calc(100vw - 390px)) !important;
    max-width: none !important;
    max-height: min(92dvh, 980px) !important;
    height: auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    border-radius: 30px !important;
    scrollbar-width: thin !important;
  }
  #detailSheet .detail-card {
    width: min(1260px, calc(100vw - 390px)) !important;
    max-width: 1260px !important;
    height: auto !important;
    max-height: min(94dvh, 1000px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 0 !important;
    border-radius: 34px !important;
  }
  #detailSheet .detail-card > .sheet-bar {
    position: sticky !important;
    top: 0 !important;
    z-index: 150 !important;
    margin: 10px auto 0 !important;
  }
  #detailSheet .detail-card > .sheet-title {
    position: sticky !important;
    top: 0 !important;
    z-index: 145 !important;
    margin: 0 !important;
    padding: 15px 78px 15px 24px !important;
    min-height: 74px !important;
    background: linear-gradient(180deg, rgba(3,7,10,.995), rgba(3,7,10,.94) 76%, rgba(3,7,10,.82)) !important;
    border-bottom: 1px solid rgba(255,255,255,.09) !important;
    backdrop-filter: blur(22px) saturate(1.1) !important;
    box-shadow: 0 20px 44px rgba(0,0,0,.30) !important;
  }
  #detailSheet .detail-card > .sheet-title .xbtn { right: 20px !important; top: 15px !important; }
  #detailSheet .detail-card > .sheet-title h3 {
    display: block !important;
    max-width: 100% !important;
    overflow: visible !important;
    white-space: normal !important;
    font-size: clamp(22px, 1.55vw, 30px) !important;
    line-height: 1.08 !important;
  }
  #detailSheet #detailBody {
    display: grid !important;
    grid-template-columns: minmax(520px, 1.15fr) minmax(380px, .85fr) !important;
    grid-template-rows: auto auto auto !important;
    gap: 16px 22px !important;
    align-items: start !important;
    padding: 22px 24px 26px !important;
    min-width: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }
  #detailSheet #detailBody > * { min-width: 0 !important; }
  #detailSheet #detailBody > .detail-media {
    grid-column: 1 !important;
    grid-row: 1 !important;
    height: clamp(480px, 68vh, 760px) !important;
    min-height: 0 !important;
    margin: 0 !important;
    border-radius: 26px !important;
    background: radial-gradient(circle at center, rgba(24,243,238,.10), #020406 70%) !important;
  }
  #detailSheet #detailBody > .detail-thumbs {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin: 0 !important;
    padding: 2px 2px 8px !important;
    max-width: 100% !important;
  }
  #detailSheet #detailBody > .detail-meta {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    max-height: calc(min(94dvh, 1000px) - 128px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 2px 6px 16px 0 !important;
    scrollbar-width: thin !important;
  }
  #detailSheet #detailBody > .detail-actions,
  #detailSheet #detailBody > .detail-service-note {
    grid-column: 2 !important;
    min-width: 0 !important;
  }
  #detailSheet .detail-media .detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    padding: 0 !important;
  }
  #detailSheet .detail-media .detail-bg {
    object-fit: cover !important;
    filter: blur(28px) brightness(.46) saturate(1.15) !important;
    opacity: .70 !important;
  }
  #detailSheet .detail-meta h2 { font-size: clamp(28px, 2vw, 42px) !important; line-height: 1.02 !important; }
  #detailSheet .detail-actions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
  #detailSheet .detail-actions button,
  #detailSheet .detail-actions a { min-width: 0 !important; }
  .desktop-feed-controls,
  .desktop-feed-arrows,
  .desktop-scroll-arrows,
  .desktop-scroll-hint { display: none !important; }
  .desktop-scroll-controls {
    display: grid !important;
    position: fixed !important;
    right: 28px !important;
    top: 50% !important;
    z-index: 240 !important;
    transform: translateY(-50%) !important;
    gap: 14px !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  .desktop-key-hint { display: block !important; }
}
@media (min-width: 1100px) and (max-width: 1320px) {
  .sheet[open] { padding-left: 270px !important; padding-right: 74px !important; }
  #detailSheet .detail-card { width: min(900px, calc(100vw - 350px)) !important; }
  #detailSheet #detailBody { display: block !important; }
  #detailSheet #detailBody > .detail-media { height: clamp(420px, 62vh, 650px) !important; margin-bottom: 14px !important; }
  #detailSheet #detailBody > .detail-meta { max-height: none !important; overflow: visible !important; padding-right: 0 !important; }
  #detailSheet .detail-actions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (min-width: 1500px) {
  #detailSheet .detail-card { width: min(1340px, calc(100vw - 420px)) !important; }
  #detailSheet #detailBody { grid-template-columns: minmax(640px, 1.22fr) minmax(420px, .78fr) !important; }
  #detailSheet #detailBody > .detail-media { height: clamp(560px, 72vh, 820px) !important; }
}

/* v56: desktop details readability, media stage polish and compact arrows */
@media (min-width: 1100px) {
  #detailSheet[open] {
    padding: 24px 78px 24px 282px !important;
  }
  #detailSheet .detail-card {
    width: min(1320px, calc(100vw - 390px)) !important;
    max-width: 1320px !important;
    max-height: min(94dvh, 980px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    border-radius: 32px !important;
    background: linear-gradient(180deg, rgba(2,6,9,.985), rgba(2,7,9,.965)) !important;
  }
  #detailSheet .detail-card > .sheet-bar {
    height: 4px !important;
    width: 44px !important;
    opacity: .70 !important;
    margin: 10px auto 0 !important;
  }
  #detailSheet .detail-card > .sheet-title {
    min-height: auto !important;
    padding: 16px 72px 14px 24px !important;
    margin: 0 !important;
    background: linear-gradient(180deg, rgba(2,6,9,.995), rgba(2,6,9,.94) 82%, rgba(2,6,9,.72)) !important;
  }
  #detailSheet .detail-card > .sheet-title h3 {
    font-size: clamp(22px, 1.45vw, 28px) !important;
    line-height: 1.12 !important;
    letter-spacing: -.045em !important;
    max-width: min(920px, 78vw) !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }
  #detailSheet #detailBody {
    display: grid !important;
    grid-template-columns: minmax(560px, 1.25fr) minmax(360px, .75fr) !important;
    gap: 18px 24px !important;
    padding: 18px 24px 24px !important;
    align-items: start !important;
  }
  #detailSheet #detailBody > .detail-media {
    grid-column: 1 !important;
    grid-row: 1 !important;
    height: clamp(500px, 68vh, 780px) !important;
    min-height: 0 !important;
    border-radius: 26px !important;
    margin: 0 !important;
    background: radial-gradient(circle at 50% 50%, rgba(24,243,238,.09), rgba(3,5,8,.95) 68%) !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.10), 0 28px 70px rgba(0,0,0,.38) !important;
  }
  #detailSheet #detailBody > .detail-thumbs {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin-top: 2px !important;
  }
  #detailSheet #detailBody > .detail-meta {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 11px !important;
    max-height: calc(min(94dvh, 980px) - 126px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 0 6px 20px 0 !important;
    scrollbar-width: thin !important;
  }
  #detailSheet #detailBody > .detail-meta > * {
    min-width: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  /* Header already contains the title on desktop, so this duplicate title is hidden to prevent crowding. */
  #detailSheet #detailBody > .detail-meta > h2 {
    display: none !important;
  }
  #detailSheet #detailBody .seller-line {
    max-width: 100% !important;
    width: max-content !important;
    min-width: min(100%, 230px) !important;
  }
  #detailSheet #detailBody .badge-line {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
    max-width: 100% !important;
  }
  #detailSheet #detailBody .ai-assist-box {
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 12px !important;
    max-width: 100% !important;
    width: 100% !important;
    padding: 14px !important;
    border-radius: 24px !important;
    background: linear-gradient(145deg, rgba(24,243,238,.13), rgba(37,238,151,.06) 42%, rgba(255,255,255,.035)) !important;
  }
  #detailSheet #detailBody .ai-assist-box > div {
    min-width: 0 !important;
    display: grid !important;
    gap: 8px !important;
  }
  #detailSheet #detailBody .ai-assist-box b,
  #detailSheet #detailBody .ai-assist-box small,
  #detailSheet #detailBody .ai-assist-box p {
    overflow-wrap: anywhere !important;
    word-break: normal !important;
  }
  #detailSheet #detailBody .ai-question-pills {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    width: 100% !important;
    margin-top: 4px !important;
  }
  #detailSheet #detailBody .mini-ai-note,
  #detailSheet #detailBody .ai-question-pills button {
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    line-height: 1.25 !important;
    padding: 10px 12px !important;
    border-radius: 18px !important;
  }
  #detailSheet #detailBody .detail-meta > p.muted {
    display: block !important;
    padding: 2px 0 0 !important;
    font-size: 15px !important;
    line-height: 1.58 !important;
    color: rgba(255,255,255,.78) !important;
    max-width: 100% !important;
  }
  #detailSheet #detailBody .tag-line {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  #detailSheet #detailBody > .detail-actions,
  #detailSheet #detailBody > .detail-service-note {
    grid-column: 2 !important;
    min-width: 0 !important;
  }
  #detailSheet .detail-media .detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    filter: drop-shadow(0 16px 42px rgba(0,0,0,.22)) !important;
  }
  #detailSheet .detail-media .detail-bg {
    opacity: .52 !important;
    filter: blur(26px) brightness(.50) saturate(1.14) !important;
  }
  #detailSheet .detail-thumbs button {
    flex: 0 0 66px !important;
    width: 66px !important;
    height: 66px !important;
    border-radius: 18px !important;
    padding: 3px !important;
  }
  #detailSheet .detail-thumbs img {
    object-fit: cover !important;
    border-radius: 14px !important;
  }
  #detailSheet .detail-nav-btn {
    width: 36px !important;
    height: 36px !important;
    border-radius: 999px !important;
    top: 50% !important;
    background: rgba(2,7,10,.50) !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    box-shadow: 0 12px 30px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.08) !important;
    backdrop-filter: blur(14px) !important;
  }
  #detailSheet .detail-nav-btn.prev { left: 12px !important; }
  #detailSheet .detail-nav-btn.next { right: 12px !important; }
  #detailSheet .detail-nav-btn svg { width: 17px !important; height: 17px !important; stroke-width: 2.6 !important; }
  .desktop-scroll-controls button {
    width: 46px !important;
    height: 46px !important;
    background: rgba(255,255,255,.10) !important;
    border-color: rgba(255,255,255,.13) !important;
  }
  .desktop-scroll-controls button::before {
    width: 12px !important;
    height: 12px !important;
    border-width: 2.4px !important;
  }
}

@media (min-width: 1100px) and (max-width: 1390px) {
  #detailSheet[open] { padding-left: 250px !important; padding-right: 58px !important; }
  #detailSheet .detail-card { width: min(1120px, calc(100vw - 320px)) !important; }
  #detailSheet #detailBody {
    grid-template-columns: minmax(500px, 1fr) minmax(330px, .72fr) !important;
    gap: 16px 18px !important;
  }
  #detailSheet #detailBody > .detail-media { height: clamp(440px, 62vh, 680px) !important; }
  #detailSheet #detailBody .ai-assist-box { grid-template-columns: 46px minmax(0,1fr) !important; }
}

@media (min-width: 1100px) and (max-height: 760px) {
  #detailSheet .detail-card { max-height: 96dvh !important; }
  #detailSheet #detailBody > .detail-media { height: clamp(360px, 55vh, 520px) !important; }
  #detailSheet #detailBody > .detail-meta { max-height: calc(96dvh - 112px) !important; }
}

/* v56: desktop detail reading polish, clean AI spacing and smaller modern gallery arrows */
@media (min-width: 1100px) {
  #detailSheet.sheet[open] {
    padding: 26px 86px 26px 286px !important;
  }
  #detailSheet .detail-card {
    width: min(1440px, calc(100vw - 360px)) !important;
    max-width: 1440px !important;
    max-height: min(94dvh, 1040px) !important;
    overflow: hidden !important;
    border-radius: 32px !important;
    background: linear-gradient(145deg, rgba(3,7,10,.98), rgba(1,4,7,.96)) !important;
  }
  #detailSheet .detail-card > .sheet-bar {
    height: 5px !important;
    width: 58px !important;
    margin: 10px auto 0 !important;
    opacity: .65 !important;
  }
  #detailSheet .detail-card > .sheet-title {
    position: sticky !important;
    top: 0 !important;
    z-index: 170 !important;
    min-height: 78px !important;
    padding: 16px 82px 14px 26px !important;
    background: linear-gradient(180deg, rgba(2,6,9,.99), rgba(2,6,9,.91) 70%, rgba(2,6,9,.72)) !important;
    border-bottom: 1px solid rgba(255,255,255,.075) !important;
  }
  #detailSheet .detail-card > .sheet-title h3 {
    font-size: clamp(20px, 1.35vw, 26px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.035em !important;
    max-width: min(760px, 70vw) !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }
  #detailSheet .detail-card > .sheet-title small {
    letter-spacing: .18em !important;
    font-size: 11px !important;
  }
  #detailSheet #detailBody {
    display: grid !important;
    grid-template-columns: minmax(600px, 1.46fr) minmax(380px, .74fr) !important;
    grid-template-rows: auto auto auto !important;
    gap: 15px 24px !important;
    align-items: start !important;
    padding: 22px 26px 28px !important;
    max-height: calc(min(94dvh, 1040px) - 88px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: thin !important;
  }
  #detailSheet #detailBody > .detail-media {
    grid-column: 1 !important;
    grid-row: 1 !important;
    height: clamp(520px, 67vh, 780px) !important;
    min-height: 0 !important;
    margin: 0 !important;
    border-radius: 28px !important;
    overflow: hidden !important;
    background: radial-gradient(circle at 50% 42%, rgba(24,243,238,.12), rgba(2,5,8,.98) 64%) !important;
    box-shadow: 0 24px 72px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.07) !important;
  }
  #detailSheet #detailBody > .detail-thumbs {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin: 0 !important;
    padding: 2px 2px 4px !important;
    align-self: start !important;
  }
  #detailSheet #detailBody > .detail-meta {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 2px 2px 4px 0 !important;
    min-width: 0 !important;
  }
  #detailSheet #detailBody > .detail-service-note,
  #detailSheet #detailBody > .detail-actions {
    grid-column: 2 !important;
    grid-row: 3 !important;
    min-width: 0 !important;
  }
  #detailSheet .detail-meta h2 {
    font-size: clamp(30px, 2.05vw, 44px) !important;
    line-height: .99 !important;
    letter-spacing: -.055em !important;
    margin: 2px 0 4px !important;
    overflow-wrap: anywhere !important;
    text-wrap: balance !important;
  }
  #detailSheet .detail-meta > p.muted {
    font-size: 15px !important;
    line-height: 1.58 !important;
    color: rgba(255,255,255,.78) !important;
    margin: 2px 0 0 !important;
  }
  #detailSheet .ai-assist-box.priority,
  #detailSheet .price-radar-box,
  #detailSheet .trust-mini {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  #detailSheet .ai-assist-box.priority {
    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;
    margin: 8px 0 10px !important;
    padding: 16px !important;
    border-radius: 24px !important;
    background: linear-gradient(145deg, rgba(12,48,50,.86), rgba(18,9,24,.82)) !important;
    border-color: rgba(24,243,238,.24) !important;
  }
  #detailSheet .ai-assist-box.priority > span {
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
  }
  #detailSheet .ai-assist-box.priority > div {
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }
  #detailSheet .ai-assist-box.priority b {
    font-size: 15px !important;
    line-height: 1.15 !important;
    letter-spacing: -.02em !important;
    margin-bottom: 5px !important;
  }
  #detailSheet .ai-assist-box.priority small {
    font-size: 13px !important;
    line-height: 1.5 !important;
  }
  #detailSheet .ai-question-pills {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    margin-top: 12px !important;
  }
  #detailSheet .mini-ai-note {
    width: 100% !important;
    white-space: normal !important;
    line-height: 1.25 !important;
    text-align: center !important;
    padding: 9px 12px !important;
    font-size: 11px !important;
  }
  #detailSheet .ai-alt-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  #detailSheet .detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
    background: transparent !important;
  }
  #detailSheet .detail-bg {
    opacity: .42 !important;
    filter: blur(32px) brightness(.42) saturate(1.18) !important;
    transform: scale(1.05) !important;
  }
  #detailSheet .detail-nav-btn {
    width: 38px !important;
    height: 38px !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    background: rgba(4,12,15,.58) !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    box-shadow: 0 12px 34px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.08) !important;
    backdrop-filter: blur(16px) saturate(1.2) !important;
    opacity: .96 !important;
  }
  #detailSheet .detail-nav-btn:hover {
    transform: translateY(-50%) scale(1.04) !important;
    background: rgba(12,42,45,.72) !important;
    border-color: rgba(24,243,238,.38) !important;
  }
  #detailSheet .detail-nav-btn.prev { left: 16px !important; }
  #detailSheet .detail-nav-btn.next { right: 16px !important; }
  #detailSheet .detail-nav-btn svg {
    width: 17px !important;
    height: 17px !important;
    stroke-width: 2.7 !important;
  }
  #detailSheet .detail-zoom-btn {
    width: 36px !important;
    height: 36px !important;
    top: 16px !important;
    right: 16px !important;
    border-radius: 999px !important;
    background: rgba(5,13,16,.62) !important;
    backdrop-filter: blur(16px) !important;
  }
  #detailSheet .detail-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    padding-top: 10px !important;
    background: linear-gradient(180deg, rgba(2,5,8,0), rgba(2,5,8,.92) 22%, rgba(2,5,8,.98)) !important;
    position: sticky !important;
    bottom: -28px !important;
    z-index: 60 !important;
  }
  #detailSheet .detail-actions button,
  #detailSheet .detail-actions a {
    min-width: 0 !important;
    height: 50px !important;
  }
}
@media (min-width: 1100px) and (max-width: 1320px) {
  #detailSheet.sheet[open] { padding-left: 260px !important; padding-right: 64px !important; }
  #detailSheet .detail-card { width: min(1040px, calc(100vw - 330px)) !important; }
  #detailSheet #detailBody {
    display: grid !important;
    grid-template-columns: minmax(520px, 1.25fr) minmax(320px, .75fr) !important;
    gap: 14px 18px !important;
  }
  #detailSheet #detailBody > .detail-media { height: clamp(440px, 62vh, 660px) !important; }
  #detailSheet .detail-meta h2 { font-size: clamp(26px, 2vw, 36px) !important; }
  #detailSheet .ai-assist-box.priority { padding: 14px !important; }
}
@media (min-width: 1500px) {
  #detailSheet .detail-card { width: min(1520px, calc(100vw - 430px)) !important; }
  #detailSheet #detailBody { grid-template-columns: minmax(720px, 1.54fr) minmax(430px, .76fr) !important; }
  #detailSheet #detailBody > .detail-media { height: clamp(600px, 72vh, 860px) !important; }
}
@media (max-width: 1099px) {
  #detailSheet .detail-nav-btn {
    width: 36px !important;
    height: 36px !important;
    background: rgba(5,13,16,.66) !important;
    border: 1px solid rgba(255,255,255,.16) !important;
    backdrop-filter: blur(14px) !important;
  }
  #detailSheet .detail-nav-btn svg { width: 16px !important; height: 16px !important; }
}

/* v56: Desktop detail readability, AI spacing and modern mini arrows */
@media (min-width: 1100px) {
  #detailSheet .detail-card {
    width: min(1360px, calc(100vw - 360px)) !important;
    max-width: min(1360px, calc(100vw - 360px)) !important;
    max-height: min(94dvh, 1000px) !important;
    border-radius: 34px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    background: linear-gradient(145deg, rgba(3,7,10,.992), rgba(5,12,14,.975)) !important;
  }
  #detailSheet .detail-card > .sheet-title {
    top: 0 !important;
    z-index: 180 !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 46px !important;
    align-items: center !important;
    gap: 18px !important;
    padding: 18px 22px 16px 24px !important;
    min-height: 76px !important;
    background: linear-gradient(180deg, rgba(3,7,10,.995), rgba(3,7,10,.955) 74%, rgba(3,7,10,.82)) !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.28) !important;
  }
  #detailSheet .detail-card > .sheet-title h3 {
    font-size: clamp(22px, 1.45vw, 30px) !important;
    line-height: 1.12 !important;
    letter-spacing: -.045em !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }
  #detailSheet .detail-card > .sheet-title .xbtn {
    position: static !important;
    width: 46px !important;
    height: 46px !important;
    border-radius: 50% !important;
  }
  #detailSheet #detailBody {
    display: grid !important;
    grid-template-columns: minmax(560px, 1.08fr) minmax(390px, .92fr) !important;
    grid-template-rows: auto auto !important;
    column-gap: clamp(20px, 2.1vw, 34px) !important;
    row-gap: 14px !important;
    align-items: start !important;
    padding: 24px clamp(22px, 2vw, 34px) 30px !important;
    overflow: visible !important;
  }
  #detailSheet #detailBody > .detail-media {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    height: clamp(460px, 65vh, 760px) !important;
    min-height: 0 !important;
    margin: 0 !important;
    border-radius: 30px !important;
    overflow: hidden !important;
    background:
      radial-gradient(circle at 50% 44%, rgba(24,243,238,.14), rgba(3,7,10,.18) 44%, rgba(2,4,6,1) 76%),
      #020406 !important;
    box-shadow: 0 24px 70px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.06) !important;
  }
  #detailSheet #detailBody > .detail-media.is-landscape { height: clamp(430px, 61vh, 700px) !important; }
  #detailSheet #detailBody > .detail-media.is-portrait { height: clamp(540px, 72vh, 820px) !important; }
  #detailSheet .detail-media .detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    padding: 0 !important;
    filter: saturate(1.03) contrast(1.015) !important;
  }
  #detailSheet .detail-media .detail-bg {
    opacity: .44 !important;
    filter: blur(34px) brightness(.44) saturate(1.16) !important;
    transform: scale(1.08) !important;
  }
  #detailSheet .detail-media::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(0,0,0,.08), transparent 36%, rgba(0,0,0,.16));
    z-index: 3;
  }
  #detailSheet #detailBody > .detail-thumbs {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin: 0 !important;
    padding: 2px 1px 10px !important;
    display: flex !important;
    gap: 10px !important;
    overflow-x: auto !important;
  }
  #detailSheet .detail-thumbs button {
    flex: 0 0 72px !important;
    width: 72px !important;
    height: 72px !important;
    border-radius: 20px !important;
    background: rgba(255,255,255,.07) !important;
  }
  #detailSheet .detail-thumbs img { border-radius: 16px !important; object-fit: cover !important; }
  #detailSheet #detailBody > .detail-meta {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 2px 0 0 !important;
  }
  #detailSheet .detail-meta h2 {
    font-size: clamp(30px, 2.15vw, 44px) !important;
    line-height: 1.05 !important;
    letter-spacing: -.052em !important;
    margin: 6px 0 0 !important;
    overflow-wrap: anywhere !important;
    max-width: 100% !important;
  }
  #detailSheet .detail-description {
    margin: 0 !important;
    color: rgba(255,255,255,.82) !important;
    font-size: clamp(14px, .98vw, 16px) !important;
    line-height: 1.55 !important;
    max-width: 58ch !important;
  }
  #detailSheet .tag-line { margin-top: 2px !important; gap: 8px !important; }
  #detailSheet .detail-ai-card,
  #detailSheet .ai-assist-box.priority {
    margin: 8px 0 0 !important;
    width: 100% !important;
    padding: 14px 15px !important;
    border-radius: 24px !important;
    background: linear-gradient(145deg, rgba(24,243,238,.105), rgba(255,255,255,.045)) !important;
    border-color: rgba(24,243,238,.22) !important;
  }
  #detailSheet .detail-ai-card b,
  #detailSheet .ai-assist-box.priority b { font-size: 14px !important; line-height: 1.15 !important; }
  #detailSheet .detail-ai-card small,
  #detailSheet .ai-assist-box.priority small { font-size: 12.5px !important; line-height: 1.48 !important; color: rgba(255,255,255,.77) !important; }
  #detailSheet .ai-question-pills { display: grid !important; grid-template-columns: 1fr !important; gap: 7px !important; }
  #detailSheet .mini-ai-note { width: 100% !important; text-align: center !important; border-radius: 999px !important; padding: 9px 12px !important; }
  #detailSheet #detailBody > .detail-actions {
    grid-column: 2 !important;
    position: static !important;
    margin: 10px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }
  #detailSheet #detailBody > .detail-service-note,
  #detailSheet .price-radar-box,
  #detailSheet .trust-mini { max-width: 100% !important; }
  .detail-nav-btn {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    border-radius: 50% !important;
    background: rgba(2,7,10,.52) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    box-shadow: 0 12px 28px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.08) !important;
    backdrop-filter: blur(14px) !important;
  }
  .detail-nav-btn.prev { left: 16px !important; }
  .detail-nav-btn.next { right: 16px !important; }
  .detail-nav-btn svg { width: 18px !important; height: 18px !important; stroke-width: 2.35 !important; }
  .detail-zoom-btn {
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    right: 16px !important;
    top: 16px !important;
  }
  .detail-count { right: 16px !important; bottom: 16px !important; }
}

@media (min-width: 1100px) and (max-width: 1320px) {
  #detailSheet #detailBody {
    display: block !important;
    padding: 20px 22px 28px !important;
  }
  #detailSheet .detail-media { height: clamp(430px, 61vh, 650px) !important; margin-bottom: 12px !important; }
  #detailSheet .detail-meta { display: flex !important; gap: 12px !important; }
  #detailSheet .detail-actions { position: static !important; margin-top: 12px !important; }
}


/* v56: desktop details readability, media-safe stage and slimmer navigation arrows */
@media (min-width: 1100px) {
  #detailSheet.sheet[open] {
    padding: 22px 72px 22px 248px !important;
  }
  #detailSheet .detail-card {
    width: min(1380px, calc(100vw - 340px)) !important;
    max-width: 1380px !important;
    max-height: min(94dvh, 980px) !important;
    border-radius: 28px !important;
    background: linear-gradient(180deg, rgba(3,7,10,.985), rgba(2,5,8,.98)) !important;
  }
  #detailSheet .detail-card > .sheet-title {
    min-height: 62px !important;
    padding: 12px 72px 12px 24px !important;
    display: flex !important;
    align-items: center !important;
  }
  #detailSheet .detail-card > .sheet-title small {
    font-size: 11px !important;
    line-height: 1 !important;
    margin-bottom: 4px !important;
  }
  #detailSheet .detail-card > .sheet-title h3 {
    font-size: clamp(21px, 1.45vw, 28px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.035em !important;
    max-width: min(1020px, calc(100vw - 470px)) !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }
  #detailSheet .detail-card > .sheet-title .xbtn {
    width: 42px !important;
    height: 42px !important;
    right: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
  }
  #detailSheet #detailBody {
    grid-template-columns: minmax(620px, 1.26fr) minmax(380px, .74fr) !important;
    gap: 18px 22px !important;
    padding: 20px 24px 22px !important;
    align-items: start !important;
  }
  #detailSheet #detailBody > .detail-media {
    height: min(70dvh, 760px) !important;
    min-height: 500px !important;
    border-radius: 24px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 22px 70px rgba(0,0,0,.26) !important;
  }
  #detailSheet #detailBody > .detail-media.is-landscape {
    height: min(66dvh, 700px) !important;
  }
  #detailSheet #detailBody > .detail-media.is-portrait {
    height: min(76dvh, 820px) !important;
  }
  #detailSheet #detailBody > .detail-media .detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
  }
  #detailSheet #detailBody > .detail-media.is-portrait .detail-main {
    width: auto !important;
    max-width: 100% !important;
  }
  #detailSheet #detailBody > .detail-thumbs {
    gap: 10px !important;
    padding-top: 8px !important;
  }
  #detailSheet #detailBody > .detail-thumbs button {
    width: 68px !important;
    height: 68px !important;
    flex-basis: 68px !important;
    border-radius: 18px !important;
  }
  #detailSheet #detailBody > .detail-meta {
    display: flex !important;
    flex-direction: column !important;
    gap: 11px !important;
    max-height: calc(min(94dvh, 980px) - 108px) !important;
    overflow-y: auto !important;
    padding: 3px 8px 110px 0 !important;
  }
  #detailSheet #detailBody > .detail-meta > h2 {
    display: none !important;
  }
  #detailSheet #detailBody .seller-line { order: 1 !important; }
  #detailSheet #detailBody .badge-line { order: 2 !important; margin: 2px 0 0 !important; }
  #detailSheet #detailBody .detail-meta > p.muted {
    order: 3 !important;
    font-size: 15.5px !important;
    line-height: 1.68 !important;
    color: rgba(255,255,255,.80) !important;
    max-width: 100% !important;
    margin: 2px 0 0 !important;
  }
  #detailSheet #detailBody .tag-line { order: 4 !important; margin: 2px 0 0 !important; }
  #detailSheet #detailBody .owner-tools { order: 5 !important; }
  #detailSheet #detailBody .ai-assist-box.priority {
    order: 6 !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    gap: 13px !important;
    margin: 4px 0 2px !important;
    padding: 15px !important;
    max-width: 100% !important;
    border-radius: 22px !important;
    background: radial-gradient(circle at 0 0, rgba(24,243,238,.13), transparent 40%), linear-gradient(145deg, rgba(12,43,44,.52), rgba(20,13,30,.42)) !important;
  }
  #detailSheet #detailBody .ai-assist-box.priority > span {
    width: 44px !important;
    height: 44px !important;
  }
  #detailSheet #detailBody .ai-assist-box.priority b {
    font-size: 15px !important;
    line-height: 1.16 !important;
  }
  #detailSheet #detailBody .ai-assist-box.priority small {
    font-size: 13px !important;
    line-height: 1.55 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
  #detailSheet #detailBody .ai-question-pills {
    gap: 8px !important;
  }
  #detailSheet #detailBody .mini-ai-note {
    max-width: 100% !important;
    white-space: normal !important;
    line-height: 1.25 !important;
    padding: 8px 10px !important;
  }
  #detailSheet #detailBody .price-radar-box { order: 7 !important; }
  #detailSheet #detailBody .trust-mini { order: 8 !important; }
  #detailSheet #detailBody > .detail-service-note,
  #detailSheet #detailBody > .detail-actions {
    grid-column: 2 !important;
  }
  #detailSheet #detailBody > .detail-actions {
    margin-top: 0 !important;
    padding: 12px 0 0 !important;
    background: linear-gradient(180deg, rgba(4,8,11,0), rgba(4,8,11,.92) 32%, rgba(4,8,11,.995)) !important;
  }
  .detail-nav-btn {
    width: 34px !important;
    height: 42px !important;
    border-radius: 15px !important;
    background: rgba(3,8,12,.44) !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.28) !important;
  }
  .detail-nav-btn.prev { left: 12px !important; }
  .detail-nav-btn.next { right: 12px !important; }
  .detail-nav-btn svg { width: 18px !important; height: 18px !important; stroke-width: 2.45 !important; }
  .detail-zoom-btn {
    width: 38px !important;
    height: 38px !important;
    border-radius: 16px !important;
  }
  .desktop-scroll-controls {
    right: 22px !important;
    gap: 10px !important;
  }
  .desktop-scroll-controls button {
    width: 42px !important;
    height: 42px !important;
    border-radius: 18px !important;
    background: rgba(255,255,255,.10) !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    box-shadow: 0 16px 36px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.09) !important;
  }
  .desktop-scroll-controls button::before {
    width: 10px !important;
    height: 10px !important;
    border-top-width: 2px !important;
    border-left-width: 2px !important;
  }
}
@media (min-width: 1100px) and (max-width: 1370px) {
  #detailSheet.sheet[open] { padding-left: 238px !important; padding-right: 58px !important; }
  #detailSheet .detail-card { width: min(1120px, calc(100vw - 315px)) !important; }
  #detailSheet #detailBody { grid-template-columns: minmax(540px, 1fr) minmax(330px, 390px) !important; gap: 16px !important; }
  #detailSheet #detailBody > .detail-media { min-height: 440px !important; height: min(66dvh, 670px) !important; }
}
@media (min-width: 1100px) and (max-width: 1220px) {
  #detailSheet.sheet[open] { padding-left: 226px !important; padding-right: 48px !important; }
  #detailSheet .detail-card { width: min(900px, calc(100vw - 285px)) !important; }
  #detailSheet #detailBody { display: block !important; padding: 16px 18px 22px !important; }
  #detailSheet #detailBody > .detail-media { height: min(62dvh, 620px) !important; min-height: 390px !important; margin-bottom: 12px !important; }
  #detailSheet #detailBody > .detail-meta { max-height: none !important; overflow: visible !important; padding: 0 !important; }
  #detailSheet #detailBody > .detail-actions { position: static !important; }
}

/* v56: desktop detail readability, non-overlapping AI, full media stage and smaller arrows */
@media (min-width: 1100px) {
  #detailSheet.sheet[open] {
    padding: 22px 72px 22px 270px !important;
    align-items: center !important;
    justify-content: center !important;
  }
  #detailSheet .detail-card {
    width: min(1480px, calc(100vw - 360px)) !important;
    max-width: 1480px !important;
    max-height: calc(100dvh - 44px) !important;
    height: min(960px, calc(100dvh - 44px)) !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border-radius: 32px !important;
    background: linear-gradient(180deg, rgba(3,7,10,.992), rgba(2,6,9,.972)) !important;
  }
  #detailSheet .detail-card > .sheet-bar {
    height: 5px !important;
    width: 58px !important;
    margin: 10px auto 0 !important;
    opacity: .55 !important;
    flex: 0 0 auto !important;
  }
  #detailSheet .detail-card > .sheet-title {
    flex: 0 0 auto !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 260 !important;
    min-height: 54px !important;
    margin: 0 !important;
    padding: 13px 76px 10px 28px !important;
    display: flex !important;
    align-items: center !important;
    background: linear-gradient(180deg, rgba(3,7,10,.995), rgba(3,7,10,.88)) !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: 0 18px 40px rgba(0,0,0,.30) !important;
  }
  #detailSheet .detail-card > .sheet-title small {
    display: inline-flex !important;
    align-items: center !important;
    height: 28px !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    background: rgba(24,243,238,.10) !important;
    border: 1px solid rgba(24,243,238,.18) !important;
    color: var(--cyan) !important;
    font-size: 12px !important;
    letter-spacing: .16em !important;
    font-weight: 1000 !important;
  }
  #detailSheet .detail-card > .sheet-title h3 {
    display: none !important;
  }
  #detailSheet .detail-card > .sheet-title .xbtn {
    right: 20px !important;
    top: 10px !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 999px !important;
  }
  #detailSheet #detailBody {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(640px, 1.28fr) minmax(430px, .72fr) !important;
    gap: 18px 26px !important;
    padding: 20px 24px 24px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-gutter: stable !important;
    box-sizing: border-box !important;
  }
  #detailSheet #detailBody > * { min-width: 0 !important; max-width: 100% !important; }
  #detailSheet #detailBody > .detail-media {
    grid-column: 1 !important;
    grid-row: 1 !important;
    position: sticky !important;
    top: 0 !important;
    height: min(76dvh, 780px) !important;
    min-height: 520px !important;
    max-height: calc(100dvh - 148px) !important;
    width: 100% !important;
    margin: 0 !important;
    border-radius: 28px !important;
    background: radial-gradient(circle at 50% 48%, rgba(24,243,238,.08), rgba(2,4,6,1) 72%) !important;
    box-shadow: 0 24px 80px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06) !important;
  }
  #detailSheet #detailBody > .detail-thumbs {
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 2px 2px 0 !important;
    margin: 0 !important;
  }
  #detailSheet #detailBody > .detail-meta {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    max-height: calc(100dvh - 150px) !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 2px 8px 96px 0 !important;
    scrollbar-width: thin !important;
    align-self: start !important;
  }
  #detailSheet #detailBody > .detail-meta::-webkit-scrollbar { width: 7px !important; }
  #detailSheet #detailBody > .detail-meta::-webkit-scrollbar-thumb { background: rgba(24,243,238,.28) !important; border-radius: 999px !important; }
  #detailSheet .seller-line { max-width: 100% !important; }
  #detailSheet .badge-line {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
    margin: 2px 0 0 !important;
  }
  #detailSheet .detail-meta h2 {
    font-size: clamp(30px, 2.1vw, 46px) !important;
    line-height: 1.03 !important;
    letter-spacing: -.055em !important;
    margin: 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }
  #detailSheet .detail-meta > p.muted {
    order: 4 !important;
    font-size: 15.5px !important;
    line-height: 1.58 !important;
    color: rgba(255,255,255,.78) !important;
    margin: 0 !important;
    max-height: none !important;
  }
  #detailSheet .tag-line { order: 5 !important; margin: 0 !important; }
  #detailSheet .ai-assist-box.priority {
    order: 6 !important;
    margin: 4px 0 0 !important;
    padding: 15px !important;
    border-radius: 24px !important;
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) !important;
    gap: 12px !important;
    background: linear-gradient(145deg, rgba(11, 35, 36, .92), rgba(23, 11, 24, .88)) !important;
    box-shadow: 0 18px 48px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08) !important;
  }
  #detailSheet .ai-assist-box.priority > span { width: 46px !important; height: 46px !important; border-radius: 17px !important; }
  #detailSheet .ai-assist-box.priority b,
  #detailSheet .ai-assist-box.priority small,
  #detailSheet .ai-assist-box.priority p { max-width: 100% !important; overflow-wrap: anywhere !important; }
  #detailSheet .ai-question-pills { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; }
  #detailSheet .mini-ai-note { width: 100% !important; text-align: center !important; line-height: 1.22 !important; white-space: normal !important; }
  #detailSheet #detailBody > .detail-actions,
  #detailSheet #detailBody > .detail-service-note {
    grid-column: 2 !important;
    width: 100% !important;
  }
  #detailSheet #detailBody > .detail-actions {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 120 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 10px !important;
    padding: 12px 0 0 !important;
    margin: -74px 8px 0 0 !important;
    background: linear-gradient(180deg, rgba(3,7,10,0), rgba(3,7,10,.92) 38%, rgba(3,7,10,.995)) !important;
  }
  #detailSheet .detail-media .detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    padding: 0 !important;
    filter: none !important;
  }
  #detailSheet .detail-media .detail-bg {
    object-fit: cover !important;
    opacity: .48 !important;
    filter: blur(30px) brightness(.50) saturate(1.12) !important;
    transform: scale(1.06) !important;
  }
  #detailSheet .detail-thumbs button {
    flex: 0 0 66px !important;
    width: 66px !important;
    height: 66px !important;
    border-radius: 19px !important;
  }
  #detailSheet .detail-thumbs img { object-fit: cover !important; border-radius: 15px !important; }
  #detailSheet .detail-nav-btn {
    width: 36px !important;
    height: 44px !important;
    border-radius: 16px !important;
    background: rgba(2,7,10,.54) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    box-shadow: 0 12px 30px rgba(0,0,0,.30) !important;
    opacity: .86 !important;
  }
  #detailSheet .detail-nav-btn.prev { left: 12px !important; }
  #detailSheet .detail-nav-btn.next { right: 12px !important; }
  #detailSheet .detail-nav-btn svg { width: 17px !important; height: 17px !important; stroke-width: 3 !important; }
  #detailSheet .detail-zoom-btn {
    width: 38px !important;
    height: 38px !important;
    border-radius: 15px !important;
    right: 14px !important;
    top: 14px !important;
  }
  .desktop-scroll-controls button {
    width: 44px !important;
    height: 44px !important;
    border-radius: 999px !important;
  }
  .desktop-scroll-controls button::before { width: 11px !important; height: 11px !important; border-width: 2.4px !important; }
}
@media (min-width: 1100px) and (max-width: 1320px) {
  #detailSheet.sheet[open] { padding: 18px 54px 18px 238px !important; }
  #detailSheet .detail-card { width: min(1040px, calc(100vw - 300px)) !important; height: min(950px, calc(100dvh - 36px)) !important; }
  #detailSheet #detailBody { grid-template-columns: minmax(500px, 1fr) minmax(360px, .82fr) !important; gap: 16px !important; }
  #detailSheet #detailBody > .detail-media { height: min(70dvh, 680px) !important; min-height: 440px !important; }
  #detailSheet .detail-meta h2 { font-size: clamp(26px, 2.1vw, 38px) !important; }
}
@media (min-width: 1100px) and (max-height: 780px) {
  #detailSheet .detail-card { height: calc(100dvh - 28px) !important; }
  #detailSheet #detailBody { padding-top: 14px !important; }
  #detailSheet #detailBody > .detail-media { height: min(66dvh, 600px) !important; min-height: 360px !important; }
  #detailSheet .detail-card > .sheet-title { min-height: 48px !important; padding-top: 10px !important; padding-bottom: 9px !important; }
}

/* v56: desktop detail readability, non-overlapping AI card, richer media stage and elegant mini arrows */
@media (min-width: 1100px) {
  #detailSheet .detail-card {
    width: min(1380px, calc(100vw - 380px)) !important;
    max-width: min(1380px, calc(100vw - 380px)) !important;
    max-height: min(94dvh, 1010px) !important;
    padding: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    border-radius: 34px !important;
  }
  #detailSheet .detail-card > .sheet-title {
    position: sticky !important;
    top: 0 !important;
    z-index: 190 !important;
    display: grid !important;
    gap: 2px !important;
    min-height: 68px !important;
    margin: 0 !important;
    padding: 14px 76px 14px 24px !important;
    background: linear-gradient(180deg, rgba(3,7,10,.995), rgba(3,7,10,.955) 78%, rgba(3,7,10,.90)) !important;
    border-bottom: 1px solid rgba(255,255,255,.10) !important;
    backdrop-filter: blur(22px) saturate(1.08) !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.30) !important;
  }
  #detailSheet .detail-card > .sheet-title h3 {
    font-size: clamp(21px, 1.45vw, 28px) !important;
    line-height: 1.12 !important;
    letter-spacing: -.045em !important;
    max-width: calc(100% - 4px) !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }
  #detailSheet .detail-card > .sheet-title .xbtn {
    top: 14px !important;
    right: 18px !important;
    width: 42px !important;
    height: 42px !important;
  }
  #detailSheet #detailBody {
    display: grid !important;
    grid-template-columns: minmax(620px, 1.34fr) minmax(390px, .66fr) !important;
    grid-template-rows: auto auto auto !important;
    gap: 18px 24px !important;
    align-items: start !important;
    padding: 22px 24px 28px !important;
    overflow: visible !important;
  }
  #detailSheet #detailBody > .detail-media {
    grid-column: 1 !important;
    grid-row: 1 !important;
    height: clamp(520px, 70vh, 780px) !important;
    min-height: 520px !important;
    max-height: calc(94dvh - 132px) !important;
    width: 100% !important;
    margin: 0 !important;
    border-radius: 30px !important;
    background:
      radial-gradient(circle at 48% 36%, rgba(24,243,238,.12), rgba(4,7,10,.92) 58%),
      #020406 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 22px 70px rgba(0,0,0,.34) !important;
  }
  #detailSheet .detail-media .detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    padding: 0 !important;
    display: block !important;
  }
  #detailSheet .detail-media .detail-bg {
    object-fit: cover !important;
    opacity: .54 !important;
    filter: blur(30px) brightness(.42) saturate(1.18) !important;
    transform: scale(1.06) !important;
  }
  #detailSheet #detailBody > .detail-thumbs {
    grid-column: 1 !important;
    grid-row: 2 !important;
    display: flex !important;
    gap: 10px !important;
    overflow-x: auto !important;
    margin: 0 !important;
    padding: 0 2px 10px !important;
    max-width: 100% !important;
    scrollbar-width: none !important;
  }
  #detailSheet #detailBody > .detail-thumbs::-webkit-scrollbar { display: none !important; }
  #detailSheet .detail-thumbs button {
    flex: 0 0 74px !important;
    width: 74px !important;
    height: 74px !important;
    border-radius: 20px !important;
    padding: 2px !important;
  }
  #detailSheet .detail-thumbs img { object-fit: cover !important; border-radius: 16px !important; }
  #detailSheet #detailBody > .detail-meta {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    display: grid !important;
    gap: 12px !important;
    align-self: start !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 !important;
    min-width: 0 !important;
  }
  #detailSheet #detailBody > .detail-meta .detail-title-main {
    display: none !important;
  }
  #detailSheet #detailBody > .detail-meta .detail-description {
    font-size: 15.5px !important;
    line-height: 1.55 !important;
    color: rgba(255,255,255,.78) !important;
    margin: 4px 0 0 !important;
  }
  #detailSheet #detailBody .ai-assist-box.priority {
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0,1fr) !important;
    gap: 14px !important;
    align-items: start !important;
    padding: 16px !important;
    border-radius: 24px !important;
    background:
      radial-gradient(circle at 0 0, rgba(24,243,238,.16), transparent 42%),
      linear-gradient(145deg, rgba(7,22,24,.86), rgba(14,11,19,.78)) !important;
    border-color: rgba(24,243,238,.28) !important;
    box-shadow: 0 20px 54px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08) !important;
  }
  #detailSheet #detailBody .ai-assist-box.priority > div,
  #detailSheet #detailBody .ai-assist-box.priority small,
  #detailSheet #detailBody .ai-assist-box.priority b { min-width: 0 !important; max-width: 100% !important; }
  #detailSheet #detailBody .ai-assist-box.priority small { font-size: 13px !important; line-height: 1.48 !important; }
  #detailSheet #detailBody .ai-question-pills { gap: 8px !important; }
  #detailSheet #detailBody .mini-ai-note {
    white-space: normal !important;
    text-align: center !important;
    line-height: 1.18 !important;
    padding: 9px 12px !important;
    max-width: 100% !important;
  }
  #detailSheet #detailBody .tag-line { margin-top: 2px !important; }
  #detailSheet #detailBody > .detail-service-note,
  #detailSheet #detailBody > .detail-actions {
    grid-column: 2 !important;
    position: static !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }
  #detailSheet #detailBody > .detail-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    align-self: start !important;
  }
  #detailSheet #detailBody .price-radar-box,
  #detailSheet #detailBody .trust-mini { margin-top: 2px !important; }
  #detailSheet .detail-nav-btn {
    width: 38px !important;
    height: 38px !important;
    border-radius: 999px !important;
    background: rgba(5,9,12,.58) !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.10) !important;
    backdrop-filter: blur(16px) !important;
    opacity: .92 !important;
  }
  #detailSheet .detail-nav-btn.prev { left: 16px !important; }
  #detailSheet .detail-nav-btn.next { right: 16px !important; }
  #detailSheet .detail-nav-btn svg { width: 19px !important; height: 19px !important; stroke-width: 2.35 !important; }
  #detailSheet .detail-nav-btn:hover { background: rgba(24,243,238,.20) !important; border-color: rgba(24,243,238,.36) !important; opacity: 1 !important; }
  .desktop-scroll-controls {
    right: 24px !important;
    gap: 12px !important;
  }
  .desktop-scroll-controls button {
    width: 44px !important;
    height: 44px !important;
    background: rgba(255,255,255,.10) !important;
    border-color: rgba(255,255,255,.14) !important;
    box-shadow: 0 16px 42px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.10) !important;
  }
  .desktop-scroll-controls button::before {
    width: 11px !important;
    height: 11px !important;
    border-top-width: 2.4px !important;
    border-left-width: 2.4px !important;
  }
}
@media (min-width: 1100px) and (max-width: 1340px) {
  #detailSheet .detail-card { width: min(980px, calc(100vw - 330px)) !important; }
  #detailSheet #detailBody { grid-template-columns: minmax(460px, 1fr) minmax(360px, .82fr) !important; gap: 16px !important; }
  #detailSheet #detailBody > .detail-media { height: clamp(430px, 62vh, 660px) !important; min-height: 430px !important; }
}
@media (min-width: 1100px) and (max-height: 780px) {
  #detailSheet #detailBody > .detail-media { height: clamp(360px, 58vh, 560px) !important; min-height: 360px !important; }
  #detailSheet .detail-card > .sheet-title { min-height: 62px !important; padding-top: 11px !important; padding-bottom: 12px !important; }
}

/* v56 final override: clean desktop details, readable right panel and compact media controls */
@media (min-width: 1100px) {
  #detailSheet.sheet[open] {
    padding: 20px 70px 20px 270px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  #detailSheet .detail-card {
    width: min(1500px, calc(100vw - 355px)) !important;
    max-width: 1500px !important;
    height: min(960px, calc(100dvh - 40px)) !important;
    max-height: calc(100dvh - 40px) !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 34px !important;
  }
  #detailSheet .detail-card > .sheet-bar {
    width: 58px !important;
    height: 5px !important;
    margin: 10px auto 0 !important;
    opacity: .50 !important;
  }
  #detailSheet .detail-card > .sheet-title {
    min-height: 52px !important;
    padding: 10px 76px 10px 26px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    background: linear-gradient(180deg, rgba(3,7,10,.995), rgba(3,7,10,.90)) !important;
    border-bottom: 1px solid rgba(255,255,255,.075) !important;
    box-shadow: 0 16px 36px rgba(0,0,0,.28) !important;
  }
  #detailSheet .detail-card > .sheet-title small {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 27px !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    background: rgba(24,243,238,.10) !important;
    border: 1px solid rgba(24,243,238,.18) !important;
    color: var(--cyan) !important;
    font-size: 11px !important;
    letter-spacing: .18em !important;
    font-weight: 1000 !important;
  }
  #detailSheet .detail-card > .sheet-title h3 { display: none !important; }
  #detailSheet .detail-card > .sheet-title .xbtn {
    top: 9px !important;
    right: 18px !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 999px !important;
  }
  #detailSheet #detailBody {
    height: calc(100% - 67px) !important;
    max-height: none !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(660px, 1.34fr) minmax(430px, .66fr) !important;
    gap: 18px 28px !important;
    align-items: start !important;
    padding: 20px 24px 24px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    scrollbar-gutter: stable !important;
  }
  #detailSheet #detailBody > * {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  #detailSheet #detailBody > .detail-media {
    grid-column: 1 !important;
    grid-row: 1 !important;
    position: sticky !important;
    top: 0 !important;
    height: min(76dvh, 780px) !important;
    min-height: 520px !important;
    max-height: calc(100dvh - 145px) !important;
    width: 100% !important;
    border-radius: 30px !important;
    margin: 0 !important;
    overflow: hidden !important;
    background: radial-gradient(circle at 50% 40%, rgba(24,243,238,.10), rgba(2,5,8,1) 70%) !important;
    box-shadow: 0 26px 80px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.065) !important;
  }
  #detailSheet .detail-media .detail-main,
  #detailSheet .detail-media img.detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    padding: 0 !important;
    display: block !important;
    filter: none !important;
  }
  #detailSheet .detail-media .detail-bg {
    object-fit: cover !important;
    filter: blur(30px) brightness(.46) saturate(1.15) !important;
    opacity: .52 !important;
    transform: scale(1.06) !important;
  }
  #detailSheet #detailBody > .detail-thumbs {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin: 0 !important;
    padding: 0 2px 4px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    max-width: 100% !important;
    scrollbar-width: none !important;
  }
  #detailSheet #detailBody > .detail-thumbs::-webkit-scrollbar { display: none !important; }
  #detailSheet .detail-thumbs button {
    flex: 0 0 66px !important;
    width: 66px !important;
    height: 66px !important;
    border-radius: 19px !important;
    padding: 2px !important;
  }
  #detailSheet .detail-thumbs img { object-fit: cover !important; border-radius: 15px !important; }
  #detailSheet #detailBody > .detail-meta {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    align-self: start !important;
    max-height: calc(100dvh - 145px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 0 8px 98px 0 !important;
    scrollbar-width: thin !important;
  }
  #detailSheet #detailBody > .detail-meta::-webkit-scrollbar { width: 7px !important; }
  #detailSheet #detailBody > .detail-meta::-webkit-scrollbar-thumb { background: rgba(24,243,238,.28) !important; border-radius: 999px !important; }
  #detailSheet .seller-line,
  #detailSheet .badge-line,
  #detailSheet .tag-line,
  #detailSheet .detail-meta > p,
  #detailSheet .detail-meta > div { max-width: 100% !important; min-width: 0 !important; }
  #detailSheet .detail-meta h2,
  #detailSheet .detail-title-main {
    display: block !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    margin: 0 !important;
    font-size: clamp(30px, 2vw, 44px) !important;
    line-height: 1.04 !important;
    letter-spacing: -.055em !important;
  }
  #detailSheet .detail-description,
  #detailSheet .detail-meta > p.muted {
    font-size: 15.5px !important;
    line-height: 1.58 !important;
    color: rgba(255,255,255,.78) !important;
    margin: 0 !important;
  }
  #detailSheet .ai-assist-box.priority,
  #detailSheet .detail-ai-card {
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    gap: 13px !important;
    align-items: start !important;
    margin: 2px 0 0 !important;
    padding: 15px !important;
    border-radius: 24px !important;
    background: radial-gradient(circle at 0 0, rgba(24,243,238,.16), transparent 40%), linear-gradient(145deg, rgba(7,22,24,.88), rgba(13,10,18,.82)) !important;
    border: 1px solid rgba(24,243,238,.24) !important;
    box-shadow: 0 20px 54px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08) !important;
  }
  #detailSheet .ai-assist-box.priority > span { width: 44px !important; height: 44px !important; border-radius: 16px !important; }
  #detailSheet .ai-assist-box.priority > div,
  #detailSheet .ai-assist-box.priority b,
  #detailSheet .ai-assist-box.priority small { min-width: 0 !important; max-width: 100% !important; overflow-wrap: anywhere !important; }
  #detailSheet .ai-question-pills { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; }
  #detailSheet .mini-ai-note { white-space: normal !important; width: 100% !important; text-align: center !important; line-height: 1.2 !important; }
  #detailSheet #detailBody > .detail-actions,
  #detailSheet #detailBody > .detail-service-note {
    grid-column: 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    position: sticky !important;
    bottom: 0 !important;
    z-index: 120 !important;
  }
  #detailSheet #detailBody > .detail-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin: -76px 8px 0 0 !important;
    padding: 12px 0 0 !important;
    background: linear-gradient(180deg, rgba(3,7,10,0), rgba(3,7,10,.94) 34%, rgba(3,7,10,.995)) !important;
  }
  #detailSheet .detail-nav-btn {
    width: 34px !important;
    height: 38px !important;
    border-radius: 15px !important;
    background: rgba(3,8,11,.58) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    box-shadow: 0 10px 26px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.10) !important;
    opacity: .88 !important;
    backdrop-filter: blur(14px) !important;
  }
  #detailSheet .detail-nav-btn.prev { left: 12px !important; }
  #detailSheet .detail-nav-btn.next { right: 12px !important; }
  #detailSheet .detail-nav-btn svg { width: 16px !important; height: 16px !important; stroke-width: 2.6 !important; }
  #detailSheet .detail-zoom-btn { width: 36px !important; height: 36px !important; border-radius: 14px !important; }
  .desktop-scroll-controls { right: 22px !important; gap: 11px !important; }
  .desktop-scroll-controls button { width: 42px !important; height: 42px !important; }
  .desktop-scroll-controls button::before { width: 10px !important; height: 10px !important; border-top-width: 2.3px !important; border-left-width: 2.3px !important; }
}
@media (min-width: 1100px) and (max-width: 1360px) {
  #detailSheet.sheet[open] { padding: 18px 52px 18px 236px !important; }
  #detailSheet .detail-card { width: min(1040px, calc(100vw - 300px)) !important; }
  #detailSheet #detailBody { grid-template-columns: minmax(500px, 1fr) minmax(360px, .82fr) !important; gap: 16px !important; }
  #detailSheet #detailBody > .detail-media { height: min(70dvh, 670px) !important; min-height: 420px !important; }
  #detailSheet .detail-meta h2 { font-size: clamp(26px, 2vw, 38px) !important; }
}
@media (min-width: 1100px) and (max-height: 780px) {
  #detailSheet .detail-card { height: calc(100dvh - 28px) !important; }
  #detailSheet #detailBody { padding-top: 14px !important; }
  #detailSheet #detailBody > .detail-media { height: min(66dvh, 590px) !important; min-height: 350px !important; }
  #detailSheet .detail-card > .sheet-title { min-height: 48px !important; }
}

/* v56 final: desktop detail readability, non-duplicated title, airy AI card, full media and tiny arrows */
@media (min-width: 1100px) {
  #detailSheet.sheet[open] {
    padding: 22px 70px 22px 270px !important;
  }
  #detailSheet .detail-card {
    width: min(1500px, calc(100vw - 360px)) !important;
    height: min(950px, calc(100dvh - 44px)) !important;
    max-height: calc(100dvh - 44px) !important;
    overflow: hidden !important;
    border-radius: 32px !important;
  }
  #detailSheet .detail-card > .sheet-title {
    display: flex !important;
    align-items: center !important;
    min-height: 78px !important;
    padding: 13px 78px 13px 28px !important;
    background: linear-gradient(180deg, rgba(2,6,9,.995), rgba(2,6,9,.95) 72%, rgba(2,6,9,.82)) !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
  }
  #detailSheet .detail-card > .sheet-title > div {
    min-width: 0 !important;
    display: grid !important;
    gap: 4px !important;
  }
  #detailSheet .detail-card > .sheet-title small {
    display: block !important;
    width: fit-content !important;
    height: auto !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    color: var(--cyan) !important;
    letter-spacing: .18em !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 1000 !important;
  }
  #detailSheet .detail-card > .sheet-title h3 {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    margin: 0 !important;
    max-width: min(940px, calc(100vw - 520px)) !important;
    color: #fff !important;
    font-size: clamp(24px, 1.75vw, 34px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.05em !important;
  }
  #detailSheet .detail-card > .sheet-title .xbtn {
    right: 20px !important;
    top: 18px !important;
    width: 42px !important;
    height: 42px !important;
  }
  #detailSheet #detailBody {
    height: calc(100% - 93px) !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    display: grid !important;
    grid-template-columns: minmax(620px, 1.34fr) minmax(390px, .66fr) !important;
    gap: 18px 26px !important;
    padding: 20px 24px 24px !important;
    align-items: start !important;
    scrollbar-gutter: stable !important;
  }
  #detailSheet #detailBody > .detail-media {
    grid-column: 1 !important;
    grid-row: 1 !important;
    position: sticky !important;
    top: 0 !important;
    height: min(72dvh, 740px) !important;
    min-height: 500px !important;
    max-height: calc(100dvh - 170px) !important;
    border-radius: 28px !important;
    overflow: hidden !important;
    background: radial-gradient(circle at 50% 46%, rgba(24,243,238,.10), rgba(3,5,7,.98) 72%) !important;
  }
  #detailSheet .detail-media .detail-main {
    object-fit: contain !important;
    object-position: center center !important;
    padding: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
  }
  #detailSheet .detail-media .detail-bg {
    object-fit: cover !important;
    opacity: .44 !important;
    filter: blur(32px) brightness(.48) saturate(1.1) !important;
    transform: scale(1.08) !important;
  }
  #detailSheet #detailBody > .detail-thumbs {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin: 0 !important;
    padding: 4px 2px 0 !important;
  }
  #detailSheet #detailBody > .detail-meta {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 8px 108px 0 !important;
  }
  #detailSheet #detailBody > .detail-meta > h2 {
    display: none !important;
  }
  #detailSheet #detailBody .seller-line {
    order: 1 !important;
    max-width: 100% !important;
  }
  #detailSheet #detailBody .badge-line {
    order: 2 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
    max-width: 100% !important;
  }
  #detailSheet #detailBody .detail-meta > p.muted {
    order: 3 !important;
    font-size: 15.5px !important;
    line-height: 1.62 !important;
    color: rgba(255,255,255,.80) !important;
    margin: 0 !important;
    max-width: 100% !important;
  }
  #detailSheet #detailBody .tag-line {
    order: 4 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 0 !important;
  }
  #detailSheet #detailBody .ai-assist-box.priority {
    order: 5 !important;
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: 46px minmax(0,1fr) !important;
    gap: 12px !important;
    padding: 15px !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    background: linear-gradient(145deg, rgba(9,31,33,.94), rgba(18,12,24,.92)) !important;
    border: 1px solid rgba(24,243,238,.20) !important;
    box-shadow: 0 16px 42px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
  }
  #detailSheet #detailBody .ai-assist-box.priority > div { min-width: 0 !important; }
  #detailSheet #detailBody .ai-assist-box.priority b,
  #detailSheet #detailBody .ai-assist-box.priority small,
  #detailSheet #detailBody .ai-assist-box.priority p {
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    max-width: 100% !important;
  }
  #detailSheet #detailBody .ai-question-pills {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
  #detailSheet #detailBody .ai-question-pills button,
  #detailSheet #detailBody .mini-ai-note {
    white-space: normal !important;
    max-width: 100% !important;
    line-height: 1.24 !important;
    padding: 9px 11px !important;
    border-radius: 16px !important;
  }
  #detailSheet #detailBody .owner-tools { order: 6 !important; }
  #detailSheet #detailBody .price-radar-box { order: 7 !important; }
  #detailSheet #detailBody .trust-mini { order: 8 !important; }
  #detailSheet #detailBody > .detail-actions,
  #detailSheet #detailBody > .detail-service-note {
    grid-column: 2 !important;
    width: 100% !important;
  }
  #detailSheet #detailBody > .detail-actions {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 130 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin: -88px 8px 0 0 !important;
    padding: 14px 0 0 !important;
    background: linear-gradient(180deg, rgba(3,7,10,0), rgba(3,7,10,.94) 34%, rgba(3,7,10,1)) !important;
  }
  #detailSheet .detail-nav-btn {
    width: 30px !important;
    height: 38px !important;
    border-radius: 14px !important;
    opacity: .78 !important;
    background: rgba(3,8,12,.48) !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    box-shadow: 0 10px 22px rgba(0,0,0,.26) !important;
  }
  #detailSheet .detail-nav-btn.prev { left: 10px !important; }
  #detailSheet .detail-nav-btn.next { right: 10px !important; }
  #detailSheet .detail-nav-btn svg { width: 15px !important; height: 15px !important; stroke-width: 2.7 !important; }
  #detailSheet .detail-nav-btn:hover { opacity: 1 !important; background: rgba(24,243,238,.16) !important; }
  .desktop-scroll-controls { right: 22px !important; gap: 9px !important; }
  .desktop-scroll-controls button {
    width: 38px !important;
    height: 38px !important;
    border-radius: 16px !important;
  }
  .desktop-scroll-controls button::before {
    width: 9px !important;
    height: 9px !important;
    border-top-width: 2px !important;
    border-left-width: 2px !important;
  }
}
@media (min-width: 1100px) and (max-width: 1320px) {
  #detailSheet.sheet[open] { padding-left: 236px !important; padding-right: 48px !important; }
  #detailSheet .detail-card { width: min(1100px, calc(100vw - 294px)) !important; }
  #detailSheet #detailBody { grid-template-columns: minmax(500px, 1fr) minmax(350px, .76fr) !important; gap: 16px !important; }
  #detailSheet #detailBody > .detail-media { height: min(68dvh, 650px) !important; min-height: 420px !important; }
}
@media (min-width: 1100px) and (max-width: 1210px) {
  #detailSheet.sheet[open] { padding-left: 222px !important; padding-right: 42px !important; }
  #detailSheet .detail-card { width: min(900px, calc(100vw - 270px)) !important; }
  #detailSheet #detailBody { display: block !important; height: calc(100% - 93px) !important; overflow-y: auto !important; }
  #detailSheet #detailBody > .detail-media { position: relative !important; height: min(60dvh, 580px) !important; min-height: 380px !important; margin-bottom: 12px !important; }
  #detailSheet #detailBody > .detail-meta { max-height: none !important; overflow: visible !important; padding-right: 0 !important; }
  #detailSheet #detailBody > .detail-actions { position: static !important; margin: 14px 0 0 !important; }
}

/* v57: desktop detail no-overlap layout. The right column now owns its own scroll,
   and the CTA buttons live in a real bottom row instead of floating over photos/AI. */
@media (min-width: 1100px) {
  #detailSheet.sheet[open] {
    padding: 22px 64px 22px 270px !important;
  }
  #detailSheet .detail-card {
    width: min(1500px, calc(100vw - 350px)) !important;
    height: min(950px, calc(100dvh - 44px)) !important;
    max-height: calc(100dvh - 44px) !important;
    overflow: hidden !important;
  }
  #detailSheet #detailBody {
    height: calc(100% - 93px) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-columns: minmax(590px, 1fr) minmax(380px, 448px) !important;
    grid-template-rows: minmax(0, 1fr) auto !important;
    gap: 14px 24px !important;
    padding: 20px 24px 22px !important;
    align-items: stretch !important;
  }
  #detailSheet #detailBody > * {
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  #detailSheet #detailBody > .detail-media {
    grid-column: 1 !important;
    grid-row: 1 !important;
    position: relative !important;
    top: auto !important;
    align-self: stretch !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    border-radius: 28px !important;
  }
  #detailSheet #detailBody > .detail-thumbs {
    grid-column: 1 !important;
    grid-row: 2 !important;
    align-self: end !important;
    display: flex !important;
    gap: 9px !important;
    min-height: 78px !important;
    max-height: 88px !important;
    padding: 4px 2px 0 !important;
    margin: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: thin !important;
  }
  #detailSheet #detailBody > .detail-thumbs button {
    flex: 0 0 72px !important;
    width: 72px !important;
    height: 72px !important;
    border-radius: 20px !important;
  }
  #detailSheet #detailBody > .detail-meta {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: stretch !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 0 8px 4px 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(24,243,238,.34) transparent !important;
  }
  #detailSheet #detailBody > .detail-meta::-webkit-scrollbar,
  #detailSheet #detailBody > .detail-actions::-webkit-scrollbar { width: 7px !important; height: 7px !important; }
  #detailSheet #detailBody > .detail-meta::-webkit-scrollbar-thumb,
  #detailSheet #detailBody > .detail-actions::-webkit-scrollbar-thumb { background: rgba(24,243,238,.34) !important; border-radius: 999px !important; }
  #detailSheet #detailBody > .detail-meta::-webkit-scrollbar-track,
  #detailSheet #detailBody > .detail-actions::-webkit-scrollbar-track { background: transparent !important; }
  #detailSheet #detailBody > .detail-meta > h2 { display: none !important; }
  #detailSheet #detailBody .seller-line,
  #detailSheet #detailBody .badge-line,
  #detailSheet #detailBody .tag-line,
  #detailSheet #detailBody .detail-description,
  #detailSheet #detailBody .ai-assist-box.priority,
  #detailSheet #detailBody .owner-tools,
  #detailSheet #detailBody .price-radar-box,
  #detailSheet #detailBody .trust-mini {
    flex: 0 0 auto !important;
    max-width: 100% !important;
  }
  #detailSheet #detailBody .ai-assist-box.priority {
    overflow: visible !important;
    margin: 0 !important;
  }
  #detailSheet #detailBody .ai-question-pills {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    margin-top: 10px !important;
  }
  #detailSheet #detailBody .ai-question-pills button,
  #detailSheet #detailBody .mini-ai-note {
    min-height: 34px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    line-height: 1.22 !important;
  }
  #detailSheet #detailBody .owner-tools {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 9px !important;
    padding: 10px !important;
    border-radius: 24px !important;
    background: linear-gradient(145deg, rgba(24,243,238,.08), rgba(255,47,126,.045)) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
  }
  #detailSheet #detailBody .owner-tools .soft {
    min-width: 0 !important;
    min-height: 46px !important;
    padding: 8px 10px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  #detailSheet #detailBody > .detail-service-note {
    grid-column: 2 !important;
    grid-row: 2 !important;
    align-self: end !important;
    margin: 0 !important;
  }
  #detailSheet #detailBody > .detail-actions {
    grid-column: 2 !important;
    grid-row: 2 !important;
    align-self: end !important;
    position: static !important;
    bottom: auto !important;
    z-index: 1 !important;
    width: 100% !important;
    max-height: 184px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px !important;
    margin: 0 !important;
    padding: 12px !important;
    border-radius: 24px !important;
    background: linear-gradient(145deg, rgba(10,20,24,.96), rgba(17,13,22,.94)) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: 0 20px 52px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
  }
  #detailSheet #detailBody > .detail-actions:empty { display: none !important; }
  #detailSheet #detailBody > .detail-actions > button,
  #detailSheet #detailBody > .detail-actions > a {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 46px !important;
    padding: 8px 10px !important;
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    white-space: normal !important;
    line-height: 1.15 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  #detailSheet .detail-nav-btn {
    z-index: 8 !important;
    width: 32px !important;
    height: 40px !important;
    opacity: .82 !important;
  }
  #detailSheet .detail-zoom-btn,
  #detailSheet .detail-count,
  #detailSheet .detail-loader { z-index: 9 !important; }
}

@media (min-width: 1100px) and (max-width: 1320px) {
  #detailSheet.sheet[open] { padding-left: 228px !important; padding-right: 44px !important; }
  #detailSheet .detail-card { width: min(1120px, calc(100vw - 286px)) !important; }
  #detailSheet #detailBody {
    grid-template-columns: minmax(500px, 1fr) minmax(350px, 410px) !important;
    gap: 14px 18px !important;
  }
  #detailSheet #detailBody > .detail-actions { max-height: 170px !important; }
}

@media (min-width: 1100px) and (max-width: 1210px) {
  #detailSheet.sheet[open] { padding-left: 218px !important; padding-right: 34px !important; }
  #detailSheet .detail-card { width: min(920px, calc(100vw - 254px)) !important; }
  #detailSheet #detailBody {
    display: block !important;
    height: calc(100% - 93px) !important;
    overflow-y: auto !important;
    padding: 16px 20px 22px !important;
  }
  #detailSheet #detailBody > .detail-media {
    position: relative !important;
    height: min(58dvh, 560px) !important;
    min-height: 360px !important;
    margin-bottom: 12px !important;
  }
  #detailSheet #detailBody > .detail-thumbs { min-height: 74px !important; margin: 0 0 12px !important; }
  #detailSheet #detailBody > .detail-meta {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 !important;
  }
  #detailSheet #detailBody > .detail-actions {
    position: static !important;
    max-height: none !important;
    overflow: visible !important;
    margin-top: 14px !important;
  }
}

@media (min-width: 1100px) and (max-height: 780px) {
  #detailSheet .detail-card { height: calc(100dvh - 28px) !important; max-height: calc(100dvh - 28px) !important; }
  #detailSheet #detailBody { height: calc(100% - 74px) !important; padding-top: 14px !important; }
  #detailSheet .detail-card > .sheet-title { min-height: 60px !important; }
  #detailSheet #detailBody > .detail-actions { max-height: 150px !important; }
}

/* v57.1: keep the desktop thumbnail strip in its own lane, not on top of the media stage. */
@media (min-width: 1211px) {
  #detailSheet #detailBody > .detail-media {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    align-self: stretch !important;
  }
}

/* v57.2: when the viewer is also the seller, keep seller controls visible before the long AI panel. */
@media (min-width: 1100px) {
  #detailSheet #detailBody .seller-line { order: 1 !important; }
  #detailSheet #detailBody .badge-line { order: 2 !important; }
  #detailSheet #detailBody .detail-description { order: 3 !important; }
  #detailSheet #detailBody .tag-line { order: 4 !important; }
  #detailSheet #detailBody .owner-tools { order: 5 !important; }
  #detailSheet #detailBody .ai-assist-box.priority { order: 6 !important; }
  #detailSheet #detailBody .price-radar-box { order: 7 !important; }
  #detailSheet #detailBody .trust-mini { order: 8 !important; }
}


/* v58: fast media switching. Keep the current photo visible while the next one is warming up. */
.media-wrap.carousel.is-buffering .media-main,
.media-wrap.carousel.is-preloading .media-main,
.media-wrap.carousel.is-changing .media-main {
  opacity: 1 !important;
  transform: scale(1.006) translateZ(0) !important;
  filter: saturate(1.04) contrast(1.02) !important;
}
.media-wrap.carousel.is-buffering .media-bg,
.media-wrap.carousel.is-preloading .media-bg,
.media-wrap.carousel.is-changing .media-bg {
  opacity: .70 !important;
  transform: scale(1.045) translateZ(0) !important;
  filter: blur(18px) brightness(.68) saturate(1.12) !important;
}
.media-wrap.carousel .media-main,
.media-wrap.carousel .media-bg {
  transition: opacity .14s ease, transform .16s ease, filter .16s ease !important;
  will-change: opacity, transform;
}
.detail-media.is-preloading .detail-main,
.detail-media.is-changing .detail-main {
  opacity: 1 !important;
  transform: scale(1.002) translateZ(0) !important;
}
.detail-media.is-preloading .detail-bg,
.detail-media.is-changing .detail-bg {
  opacity: .72 !important;
}
.detail-media .detail-main,
.detail-media .detail-bg {
  transition: opacity .16s ease, transform .18s ease, filter .18s ease !important;
  will-change: opacity, transform;
}
.pricing-pro-guide {
  position: relative;
  overflow: hidden;
}
.pricing-pro-guide::after {
  content: '';
  position: absolute;
  inset: auto -20% -60% 32%;
  height: 96px;
  background: radial-gradient(circle, rgba(24,243,238,.18), transparent 62%);
  pointer-events: none;
}

/* v58.1: instant media handoff, no dark flash while photos change. */
.media-wrap.carousel .media-main,
.media-wrap.carousel .media-bg {
  transition: opacity .12s ease, transform .16s ease, filter .16s ease !important;
  backface-visibility: hidden !important;
  transform: translate3d(0,0,0) !important;
}
.media-wrap.carousel.is-preloading .media-main,
.media-wrap.carousel.is-changing .media-main,
.media-wrap.photo.loaded.is-preloading .media-main,
.media-wrap.photo.loaded.is-changing .media-main {
  opacity: 1 !important;
  filter: none !important;
  transform: translate3d(0,0,0) scale(1) !important;
}
.media-wrap.carousel.is-preloading .media-bg,
.media-wrap.carousel.is-changing .media-bg {
  opacity: .74 !important;
  filter: blur(20px) brightness(.62) saturate(1.12) !important;
  transform: translate3d(0,0,0) scale(1.06) !important;
}
.media-wrap.loaded .media-loader { opacity: 0 !important; }
.media-wrap.loaded.is-preloading .media-loader { opacity: .42 !important; }
.detail-media.is-preloading .detail-main,
.detail-media.is-changing .detail-main,
.detail-media.loaded.is-changing .detail-main {
  opacity: 1 !important;
  transform: translate3d(0,0,0) scale(1) !important;
}
.detail-media.is-preloading .detail-bg,
.detail-media.is-changing .detail-bg {
  opacity: .70 !important;
  filter: blur(22px) brightness(.60) saturate(1.14) !important;
}
.detail-media.loaded.is-preloading .detail-loader,
.detail-media.loaded.is-preloading .detail-media-loader { opacity: .45 !important; display: grid !important; }
.pricing-simplified-note {
  margin: 10px 0 12px;
  padding: 11px 13px;
  border-radius: 20px;
  border: 1px solid rgba(24,243,238,.18);
  background: linear-gradient(135deg, rgba(24,243,238,.10), rgba(255,47,126,.055));
  color: rgba(255,255,255,.78);
  font-size: 12px;
  line-height: 1.45;
  font-weight: 800;
}

/* v58.2: professional AI strip and simplified package sheet polish. */
.ai-pro-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: -4px 0 12px;
}
.ai-pro-strip span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px 9px;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(24,243,238,.045));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.ai-pro-strip b {
  color: #fff;
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: -.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ai-pro-strip small {
  color: rgba(255,255,255,.66);
  font-size: 10.5px;
  line-height: 1.25;
}
.pricing-pro-guide {
  display: grid;
  grid-template-columns: 40px minmax(0,1fr);
  align-items: center;
  gap: 11px;
  padding: 12px;
  border: 1px solid rgba(24,243,238,.18);
  background: radial-gradient(circle at 0 0, rgba(24,243,238,.13), transparent 44%), rgba(255,255,255,.055);
  border-radius: 22px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.pricing-pro-guide b,
.pricing-pro-guide small {
  display: block;
}
.pricing-pro-guide b {
  color: #fff;
  font-size: 14px;
  font-weight: 1000;
  letter-spacing: -.02em;
}
.pricing-pro-guide small {
  color: rgba(255,255,255,.68);
  line-height: 1.34;
  font-size: 11.5px;
}
.pricing-section-title small {
  max-width: 360px !important;
}
.pricing-grid {
  grid-template-columns: repeat(auto-fit, minmax(178px, 1fr)) !important;
}
.pricing-plan.pro_weekly,
.pricing-plan.service_pro_monthly,
.pricing-plan.shop_pro,
.pricing-plan.business_plus {
  min-height: 196px !important;
}
.pricing-plan.boost_24h,
.pricing-plan.smart_campaign_7d,
.pricing-plan.verified_business {
  min-height: 176px !important;
}
.pricing-plan .plan-actions .primary {
  white-space: normal !important;
  line-height: 1.1 !important;
}
.media-wrap.carousel.loaded:not(.is-changing) .media-main {
  animation: none !important;
}
.media-wrap.loading.loaded::before,
.media-wrap.loaded::before {
  animation: none !important;
}
.detail-media.is-preloading::before,
.detail-media.is-changing::before {
  opacity: .18 !important;
}
@media (min-width: 760px) {
  .ai-pro-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pricing-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 520px) {
  .ai-pro-strip { grid-template-columns: 1fr; }
  .pricing-pro-guide { grid-template-columns: 36px minmax(0,1fr); }
}


/* v58 final: fast media transitions, clean package screen, professional AI notes */
.media-wrap.carousel.is-warming .media-main,
.media-wrap.carousel.is-preloading .media-main,
.media-wrap.carousel.is-changing .media-main{opacity:1!important;transform:translateZ(0) scale(1.002)!important;filter:saturate(1.03) contrast(1.01)!important;}
.media-wrap.carousel.is-warming .media-bg,
.media-wrap.carousel.is-preloading .media-bg{opacity:.72!important;}
.media-wrap.carousel.is-warming .media-loader,
.media-wrap.carousel.is-preloading .media-loader,
.media-wrap.photo.loaded .media-loader{opacity:0!important;display:none!important;pointer-events:none!important;}
.detail-media.is-preloading .detail-main,
.detail-media.is-changing .detail-main{opacity:1!important;transform:translateZ(0) scale(1.001)!important;}
.detail-media.is-preloading .detail-bg,
.detail-media.is-changing .detail-bg{opacity:.72!important;}
.detail-media.is-preloading .detail-loader{opacity:.18!important;}
.detail-media.loaded:not(.loading) .detail-loader{display:none!important;opacity:0!important;}
.package-guide-card,.package-ai-note{display:grid!important;grid-template-columns:46px minmax(0,1fr)!important;gap:12px!important;align-items:center!important;border:1px solid rgba(32,242,214,.18)!important;border-radius:24px!important;background:linear-gradient(145deg,rgba(32,242,214,.09),rgba(255,255,255,.045))!important;padding:12px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important;}
.package-guide-card>span{width:46px;height:46px;border-radius:18px;display:grid;place-items:center;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12);color:#eafffb;}
.package-guide-card b,.package-ai-note b{display:block;color:#fff;font-size:15px;letter-spacing:-.02em;}
.package-guide-card small,.package-ai-note small{display:block;color:rgba(255,255,255,.68);line-height:1.38;margin-top:2px;}
.package-ai-note{grid-template-columns:38px minmax(0,1fr)!important;background:linear-gradient(145deg,rgba(255,47,126,.075),rgba(32,242,214,.055))!important;}
.package-ai-note .ai-brand-mark{width:38px!important;height:38px!important;border-radius:16px!important;}
.pricing-section .pricing-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
.pricing-section .pricing-plan{min-height:188px!important;}
.pricing-plan.seller_pro,.pricing-plan.shop_pro{border-color:rgba(32,242,214,.22)!important;}
.pricing-plan.boost_24h{border-color:rgba(112,246,180,.24)!important;background:radial-gradient(circle at 20% 0,rgba(112,246,180,.16),transparent 35%),rgba(255,255,255,.055)!important;}
.pricing-plan.business_plus{border-color:rgba(255,47,126,.25)!important;background:radial-gradient(circle at 20% 0,rgba(255,47,126,.15),transparent 35%),rgba(255,255,255,.055)!important;}
@media(min-width:980px){.pricing-section .pricing-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}.pricing-plan.business_plus{grid-column:auto!important;}}
@media(max-width:560px){.pricing-section .pricing-grid{grid-template-columns:1fr!important;}.package-guide-card,.package-ai-note{grid-template-columns:42px minmax(0,1fr)!important;border-radius:22px!important;}}

/* v58.2: professional AI action strips and instant carousel polish */
.ai-action-pills,
.ai-question-pills,
.ai-note-pills{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:7px!important;
  align-items:center!important;
  margin-top:10px!important;
}
.ai-action-pills>b,
.ai-question-pills>b,
.ai-note-pills>b,
.ai-alt-strip>b{
  flex:0 0 100%!important;
  display:block!important;
  color:rgba(255,255,255,.62)!important;
  font-size:10px!important;
  text-transform:uppercase!important;
  letter-spacing:.08em!important;
  margin-bottom:1px!important;
}
.mini-ai-action,
.mini-ai-note{
  border:1px solid rgba(32,242,214,.22)!important;
  background:linear-gradient(135deg,rgba(32,242,214,.12),rgba(255,255,255,.06))!important;
  color:#fff!important;
  border-radius:999px!important;
  padding:8px 10px!important;
  font-weight:950!important;
  font-size:11px!important;
  line-height:1.15!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07)!important;
}
.mini-ai-action{
  border-color:rgba(32,242,214,.32)!important;
  background:linear-gradient(135deg,rgba(32,242,214,.18),rgba(255,47,126,.10))!important;
}
.ai-results-title{
  margin:13px 2px 8px!important;
  color:rgba(255,255,255,.66)!important;
  font-size:11px!important;
  font-weight:1000!important;
  text-transform:uppercase!important;
  letter-spacing:.08em!important;
}
.media-wrap.carousel .media-main,
.detail-media .detail-main{
  will-change:opacity,transform!important;
  backface-visibility:hidden!important;
}

/* v58.4: keep media glass alive while the next photo decodes. No blank frame between carousel slides. */
.media-wrap.carousel.quick-swap .media-main,
.media-wrap.carousel.is-changing .media-main,
.media-wrap.carousel.is-preloading .media-main {
  opacity: 1 !important;
  transform: translateZ(0) scale(1) !important;
}
.media-wrap.carousel.quick-swap .media-main { animation: vcQuickPhotoSwap .16s ease-out; }
.detail-media.quick-swap .detail-main,
.detail-media.is-changing .detail-main,
.detail-media.is-preloading .detail-main {
  opacity: 1 !important;
  transform: translateZ(0) scale(1) !important;
}
.detail-media.quick-swap .detail-main { animation: vcQuickPhotoSwap .16s ease-out; }
@keyframes vcQuickPhotoSwap {
  from { transform: translateZ(0) scale(.998); }
  to { transform: translateZ(0) scale(1); }
}

/* v60: AI Flyer Studio for seller/shop offerings */
#flyerSheet .sheet-card.flyer-card{
  max-height:92dvh!important;
  overflow:auto!important;
}
.flyer-card{
  border-color:rgba(32,242,214,.18)!important;
  background:
    radial-gradient(circle at 14% 8%,rgba(32,242,214,.14),transparent 32%),
    radial-gradient(circle at 84% 8%,rgba(255,47,126,.12),transparent 30%),
    rgba(7,11,18,.96)!important;
}
.flyer-intro{
  display:grid!important;
  grid-template-columns:48px minmax(0,1fr)!important;
  gap:12px!important;
  align-items:center!important;
  margin:0 0 14px!important;
  padding:14px!important;
  border-radius:22px!important;
  border:1px solid rgba(32,242,214,.18)!important;
  background:linear-gradient(135deg,rgba(32,242,214,.11),rgba(255,255,255,.045))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.flyer-intro>span{
  width:48px!important;
  height:48px!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(135deg,#23f0d8,#ff3f86)!important;
  color:#061114!important;
  box-shadow:0 14px 35px rgba(32,242,214,.16)!important;
}
.flyer-intro b{display:block!important;font-weight:1000!important;color:#fff!important;}
.flyer-intro small,.flyer-intro em{display:block!important;color:rgba(255,255,255,.7)!important;font-style:normal!important;line-height:1.35!important;}
.flyer-intro em{font-size:11px!important;color:rgba(35,240,216,.84)!important;margin-top:3px!important;}
.flyer-studio-grid{display:grid!important;gap:16px!important;align-items:start!important;}
.flyer-controls,.flyer-preview-panel{display:grid!important;gap:12px!important;min-width:0!important;}
.flyer-control-row{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;}
.flyer-control-row label,.flyer-field-stack label,.flyer-caption-box{display:grid!important;gap:6px!important;min-width:0!important;}
.flyer-control-row small,.flyer-field-stack small,.flyer-caption-box small,.flyer-picker-head small{color:rgba(255,255,255,.58)!important;font-size:11px!important;font-weight:900!important;letter-spacing:.03em!important;}
.flyer-control-row select,.flyer-field-stack input,.flyer-field-stack textarea,.flyer-caption-box textarea{
  width:100%!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(255,255,255,.075)!important;
  color:#fff!important;
  border-radius:16px!important;
  padding:12px 13px!important;
  outline:none!important;
  font-weight:850!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.flyer-control-row select option{background:#0b111b!important;color:#fff!important;}
.flyer-field-stack{display:grid!important;gap:10px!important;}
.flyer-field-stack textarea{min-height:76px!important;resize:vertical!important;line-height:1.35!important;}
.flyer-caption-box textarea{min-height:86px!important;resize:vertical!important;line-height:1.35!important;color:rgba(255,255,255,.84)!important;}
.flyer-picker-head,.flyer-showroom-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:12px!important;
}
.flyer-picker-head b,.flyer-showroom-head h3{color:#fff!important;font-weight:1000!important;}
.flyer-showroom-head>div{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:10px!important;flex-wrap:wrap!important;}
.flyer-generate-btn{
  min-height:38px!important;
  padding:0 15px!important;
  border-radius:999px!important;
  white-space:nowrap!important;
  background:linear-gradient(135deg,#23f0d8,#26ee97)!important;
  color:#061114!important;
  box-shadow:0 16px 34px rgba(35,240,216,.16)!important;
}
.flyer-product-picker{
  display:grid!important;
  grid-template-columns:repeat(auto-fill,minmax(130px,1fr))!important;
  gap:10px!important;
  max-height:268px!important;
  overflow:auto!important;
  padding:1px 4px 2px 1px!important;
  scrollbar-color:rgba(35,240,216,.72) rgba(255,255,255,.08)!important;
}
.flyer-pick{
  position:relative!important;
  display:grid!important;
  gap:7px!important;
  padding:8px!important;
  border-radius:18px!important;
  border:1px solid rgba(255,255,255,.11)!important;
  background:rgba(255,255,255,.06)!important;
  cursor:pointer!important;
  min-width:0!important;
  transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease!important;
}
.flyer-pick:hover{transform:translateY(-1px)!important;border-color:rgba(35,240,216,.32)!important;}
.flyer-pick.active{border-color:rgba(35,240,216,.92)!important;background:rgba(35,240,216,.12)!important;box-shadow:0 0 0 2px rgba(35,240,216,.12),0 16px 36px rgba(0,0,0,.2)!important;}
.flyer-pick input{position:absolute!important;opacity:0!important;pointer-events:none!important;}
.flyer-pick span{height:92px!important;border-radius:14px!important;overflow:hidden!important;background:rgba(0,0,0,.25)!important;}
.flyer-pick img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;}
.flyer-pick b{color:#fff!important;font-size:12px!important;line-height:1.14!important;font-weight:1000!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;}
.flyer-pick small{color:rgba(35,240,216,.9)!important;font-size:11px!important;font-weight:1000!important;}
.flyer-note{display:grid!important;grid-template-columns:34px minmax(0,1fr)!important;align-items:center!important;gap:9px!important;padding:10px!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:18px!important;background:rgba(255,255,255,.045)!important;color:rgba(255,255,255,.68)!important;}
.flyer-note span{width:34px!important;height:34px!important;border-radius:13px!important;display:grid!important;place-items:center!important;background:rgba(35,240,216,.13)!important;color:#23f0d8!important;}
.flyer-note small{line-height:1.35!important;font-weight:750!important;}
.flyer-actions-row,.flyer-export-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;}
.flyer-export-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
.flyer-actions-row button,.flyer-export-actions button,.flyer-caption-box button{min-height:42px!important;border-radius:16px!important;font-weight:1000!important;}
.flyer-canvas-shell{
  display:grid!important;
  place-items:center!important;
  min-height:420px!important;
  padding:12px!important;
  border-radius:26px!important;
  border:1px solid rgba(32,242,214,.16)!important;
  background:radial-gradient(circle at 50% 0,rgba(35,240,216,.14),transparent 34%),rgba(0,0,0,.22)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
  overflow:auto!important;
}
#flyerCanvas{
  width:100%!important;
  max-width:640px!important;
  max-height:62dvh!important;
  object-fit:contain!important;
  border-radius:20px!important;
  box-shadow:0 28px 70px rgba(0,0,0,.38)!important;
  background:#071114!important;
}
@media(min-width:1100px){
  #flyerSheet .sheet-card.flyer-card{width:min(1180px,calc(100vw - 340px))!important;max-width:min(1180px,calc(100vw - 340px))!important;}
  .flyer-studio-grid{grid-template-columns:minmax(320px,430px) minmax(0,1fr)!important;}
  .flyer-product-picker{max-height:304px!important;}
  #flyerCanvas{max-height:68dvh!important;max-width:720px!important;}
}
@media(max-width:720px){
  .flyer-control-row,.flyer-actions-row,.flyer-export-actions{grid-template-columns:1fr!important;}
  .flyer-product-picker{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .flyer-showroom-head{align-items:flex-start!important;}
  .flyer-showroom-head>div{width:100%!important;justify-content:space-between!important;}
  .flyer-canvas-shell{min-height:300px!important;padding:8px!important;border-radius:20px!important;}
  #flyerCanvas{border-radius:16px!important;max-height:58dvh!important;}
}

/* v60: lighter feed media, sharper text and hands-free shop rotation polish */
.reel-card::before{
  height:34%!important;
  background:
    radial-gradient(ellipse at 14% 82%, rgba(0,0,0,.54), rgba(0,0,0,.22) 36%, transparent 68%),
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,.08) 28%, rgba(0,0,0,.38) 74%, rgba(0,0,0,.66) 100%)!important;
  opacity:.86!important;
}
.media-wrap.photo::after,
.media-wrap::after{
  background:
    linear-gradient(180deg, rgba(0,0,0,.16) 0%, rgba(0,0,0,.015) 35%, rgba(0,0,0,.045) 58%, rgba(0,0,0,.30) 82%, rgba(0,0,0,.62) 100%),
    linear-gradient(90deg, rgba(0,0,0,.10), transparent 47%, rgba(0,0,0,.06))!important;
}
.card-info::before{
  left:-18px!important;
  right:-26px!important;
  bottom:-14px!important;
  height:calc(100% + 30px)!important;
  background:
    radial-gradient(ellipse at 12% 68%, rgba(0,0,0,.68), rgba(0,0,0,.34) 44%, transparent 72%),
    linear-gradient(90deg, rgba(0,0,0,.48), rgba(0,0,0,.16) 62%, transparent 100%)!important;
  filter:blur(12px)!important;
  opacity:.86!important;
}
.card-info .seller-line{
  background:rgba(2,5,8,.48)!important;
  border-color:rgba(255,255,255,.16)!important;
}
.card-info h1{
  text-shadow:0 2px 0 rgba(0,0,0,.56),0 8px 22px rgba(0,0,0,.86),0 0 2px rgba(0,0,0,.90)!important;
  -webkit-text-stroke:.28px rgba(0,0,0,.52)!important;
}
.card-info p{
  color:#fff!important;
  text-shadow:0 1px 0 rgba(0,0,0,.62),0 5px 16px rgba(0,0,0,.84)!important;
  background:linear-gradient(90deg, rgba(0,0,0,.22), rgba(0,0,0,.08), transparent)!important;
  border-radius:12px!important;
  padding:2px 6px 2px 0!important;
}
.reel-card.is-active .media-wrap.carousel .feed-photo-count{
  background:rgba(0,0,0,.52)!important;
  border-color:rgba(255,255,255,.18)!important;
  backdrop-filter:blur(12px) saturate(1.06)!important;
}
@media (min-width:760px){
  .reel-card::before{height:30%!important;opacity:.78!important;}
  .card-info::before{opacity:.80!important;filter:blur(13px)!important;}
}
@media (max-height:710px){
  .reel-card::before{height:38%!important;}
  .card-info::before{opacity:.88!important;}
}

/* v60: readable-light feed captions, auto-showroom feel, and professional Flyer Studio polish */
.media-wrap.photo::after,
.media-wrap::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,.24) 0%,rgba(0,0,0,.02) 34%,rgba(0,0,0,.06) 58%,rgba(0,0,0,.34) 78%,rgba(0,0,0,.70) 100%),
    radial-gradient(ellipse at 15% 83%,rgba(0,0,0,.58),rgba(0,0,0,.26) 38%,transparent 70%)!important;
}
.reel-card::before{
  height:36%!important;
  background:
    radial-gradient(ellipse at 16% 76%,rgba(0,0,0,.58),rgba(0,0,0,.24) 36%,transparent 68%),
    linear-gradient(180deg,transparent 0%,rgba(0,0,0,.08) 28%,rgba(0,0,0,.42) 74%,rgba(0,0,0,.66) 100%)!important;
}
.card-glow{opacity:.48!important;}
.card-info::before{
  left:-20px!important;
  right:-18px!important;
  bottom:-18px!important;
  height:calc(100% + 34px)!important;
  opacity:.72!important;
  filter:blur(12px)!important;
  background:
    radial-gradient(ellipse at 18% 55%,rgba(0,0,0,.74),rgba(0,0,0,.30) 45%,transparent 76%),
    linear-gradient(90deg,rgba(0,0,0,.52),rgba(0,0,0,.18) 62%,transparent 100%)!important;
}
.card-info h1{
  text-shadow:0 4px 18px rgba(0,0,0,.92),0 1px 1px rgba(0,0,0,.88),0 0 2px rgba(0,0,0,.9)!important;
  -webkit-text-stroke:.18px rgba(0,0,0,.48)!important;
}
.card-info p{
  color:rgba(255,255,255,.97)!important;
  line-height:1.36!important;
  text-shadow:0 3px 14px rgba(0,0,0,.95),0 1px 1px rgba(0,0,0,.88),0 0 2px rgba(0,0,0,.9)!important;
}
.feed-photo-count{
  background:rgba(4,7,10,.62)!important;
  border:1px solid rgba(255,255,255,.18)!important;
  box-shadow:0 12px 30px rgba(0,0,0,.28)!important;
  backdrop-filter:blur(14px) saturate(1.08)!important;
}
.media-dots{
  background:rgba(2,4,7,.42)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  padding:5px 8px!important;
  border-radius:999px!important;
  backdrop-filter:blur(14px)!important;
}
@media(min-width:1100px){
  .media-wrap.photo::after,
  .media-wrap::after{
    background:
      linear-gradient(180deg,rgba(0,0,0,.18) 0%,rgba(0,0,0,.01) 42%,rgba(0,0,0,.08) 64%,rgba(0,0,0,.32) 83%,rgba(0,0,0,.62) 100%),
      radial-gradient(ellipse at 15% 84%,rgba(0,0,0,.54),rgba(0,0,0,.22) 36%,transparent 72%)!important;
  }
  .reel-card::before{
    left:clamp(315px,21vw,410px)!important;
    right:clamp(270px,19vw,380px)!important;
    bottom:34px!important;
    height:34%!important;
    border-radius:0 0 16px 16px!important;
    background:
      radial-gradient(ellipse at 17% 78%,rgba(0,0,0,.50),rgba(0,0,0,.20) 38%,transparent 70%),
      linear-gradient(180deg,transparent 0%,rgba(0,0,0,.08) 36%,rgba(0,0,0,.38) 100%)!important;
  }
  .card-info p{font-size:16px!important;max-height:58px!important;-webkit-line-clamp:3!important;}
  .card-info h1{line-height:1.01!important;}
}

.flyer-profile-btn{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  min-height:42px!important;
  padding:0 15px!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,#23f0d8,#26ee97)!important;
  color:#041011!important;
  box-shadow:0 16px 34px rgba(35,240,216,.18)!important;
  white-space:nowrap!important;
}
.flyer-profile-btn svg{width:17px!important;height:17px!important;}
.flyer-body{display:grid!important;gap:14px!important;}
.flyer-studio-hero{
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr)!important;
  gap:13px!important;
  align-items:center!important;
  padding:14px!important;
  border-radius:24px!important;
  border:1px solid rgba(35,240,216,.22)!important;
  background:linear-gradient(135deg,rgba(35,240,216,.13),rgba(255,255,255,.055))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 18px 45px rgba(0,0,0,.18)!important;
}
.flyer-studio-hero>span{
  width:52px!important;height:52px!important;border-radius:19px!important;display:grid!important;place-items:center!important;
  color:#eafffb!important;background:linear-gradient(135deg,rgba(35,240,216,.24),rgba(255,47,126,.14))!important;border:1px solid rgba(255,255,255,.14)!important;
}
.flyer-studio-hero b{display:block!important;color:#fff!important;font-size:18px!important;font-weight:1000!important;letter-spacing:-.03em!important;}
.flyer-studio-hero small,.flyer-studio-hero em{display:block!important;color:rgba(255,255,255,.68)!important;line-height:1.36!important;margin-top:3px!important;font-style:normal!important;}
.flyer-control-grid,.flyer-copy-fields{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
}
.flyer-copy-fields{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
.flyer-field,.flyer-control-grid label,.flyer-copy-fields label{
  display:grid!important;gap:6px!important;padding:10px!important;border-radius:18px!important;border:1px solid rgba(255,255,255,.10)!important;background:rgba(255,255,255,.045)!important;
}
.flyer-field small,.flyer-control-grid small,.flyer-copy-fields small{color:rgba(35,240,216,.88)!important;font-weight:1000!important;font-size:11px!important;}
.flyer-field input,.flyer-control-grid select,.flyer-copy-fields input,.flyer-copy-fields textarea{
  width:100%!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:15px!important;background:rgba(0,0,0,.22)!important;color:#fff!important;min-height:42px!important;padding:10px 12px!important;font-weight:850!important;outline:none!important;
}
.flyer-copy-fields textarea{min-height:70px!important;resize:vertical!important;}
.flyer-ai-copy,.flyer-switches,.flyer-products-head,.flyer-preview-wrap{
  border:1px solid rgba(255,255,255,.10)!important;border-radius:22px!important;background:rgba(255,255,255,.05)!important;padding:12px!important;
}
.flyer-ai-copy{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;gap:10px!important;align-items:center!important;}
.flyer-ai-copy small,.flyer-products-head small{color:rgba(255,255,255,.62)!important;line-height:1.35!important;}
.flyer-switches{display:flex!important;align-items:center!important;gap:13px!important;flex-wrap:wrap!important;}
.flyer-switches b,.flyer-products-head b{color:#fff!important;font-weight:1000!important;}
.flyer-switches label{display:inline-flex!important;align-items:center!important;gap:7px!important;color:rgba(255,255,255,.78)!important;font-weight:850!important;}
.flyer-products-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;}
.flyer-products-head em{font-style:normal!important;color:#041011!important;background:#23f0d8!important;border-radius:999px!important;padding:7px 10px!important;font-weight:1000!important;}
.flyer-product-picker{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(165px,1fr))!important;gap:10px!important;max-height:300px!important;overflow:auto!important;padding:2px!important;}
.flyer-product-pick{position:relative!important;display:grid!important;grid-template-columns:70px minmax(0,1fr)!important;gap:10px!important;align-items:center!important;padding:8px!important;border-radius:19px!important;border:1px solid rgba(255,255,255,.12)!important;background:rgba(255,255,255,.055)!important;cursor:pointer!important;transition:transform .15s ease,border-color .15s ease,background .15s ease!important;}
.flyer-product-pick:hover{transform:translateY(-1px)!important;border-color:rgba(35,240,216,.36)!important;}
.flyer-product-pick:has(input:checked){border-color:rgba(35,240,216,.92)!important;background:rgba(35,240,216,.12)!important;box-shadow:0 0 0 2px rgba(35,240,216,.10)!important;}
.flyer-product-pick input{position:absolute!important;opacity:0!important;pointer-events:none!important;}
.flyer-product-pick img{width:70px!important;height:70px!important;border-radius:15px!important;object-fit:cover!important;background:rgba(0,0,0,.24)!important;}
.flyer-product-pick b{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;color:#fff!important;font-weight:1000!important;font-size:12.5px!important;line-height:1.18!important;}
.flyer-product-pick small{display:block!important;color:rgba(35,240,216,.86)!important;font-size:11px!important;font-weight:900!important;margin-top:3px!important;}
.flyer-preview-wrap{display:grid!important;place-items:center!important;gap:10px!important;background:radial-gradient(circle at 50% 0,rgba(35,240,216,.12),transparent 34%),rgba(0,0,0,.18)!important;}
.flyer-preview-wrap canvas{width:100%!important;max-width:620px!important;max-height:64dvh!important;object-fit:contain!important;border-radius:22px!important;box-shadow:0 26px 70px rgba(0,0,0,.40)!important;background:#071114!important;}
.flyer-status{justify-self:stretch!important;text-align:center!important;color:rgba(255,255,255,.72)!important;font-weight:900!important;font-size:12px!important;}
.flyer-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;}
.flyer-actions button{min-height:44px!important;border-radius:17px!important;font-weight:1000!important;}
@media(min-width:1100px){
  #flyerSheet .flyer-card{width:min(1160px,calc(100vw - 340px))!important;max-width:min(1160px,calc(100vw - 340px))!important;}
  .flyer-body{grid-template-columns:minmax(330px,460px) minmax(0,1fr)!important;align-items:start!important;}
  .flyer-studio-hero,.flyer-control-grid,.flyer-field,.flyer-ai-copy,.flyer-copy-fields,.flyer-switches,.flyer-products-head,.flyer-product-picker{grid-column:1!important;}
  .flyer-preview-wrap,.flyer-actions{grid-column:2!important;}
  .flyer-preview-wrap{grid-row:1 / span 7!important;min-height:620px!important;}
}
@media(max-width:720px){
  .flyer-control-grid,.flyer-copy-fields,.flyer-actions{grid-template-columns:1fr!important;}
  .flyer-ai-copy{grid-template-columns:1fr!important;}
  .flyer-product-picker{grid-template-columns:1fr!important;max-height:260px!important;}
  .flyer-preview-wrap canvas{max-height:58dvh!important;}
}

/* v60.0.0 final tune: keep the photo bright, keep the caption readable */
.media-wrap.photo::after,
.media-wrap::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,.10) 0%,rgba(0,0,0,0) 38%,rgba(0,0,0,.045) 62%,rgba(0,0,0,.20) 82%,rgba(0,0,0,.44) 100%),
    radial-gradient(ellipse at 15% 84%,rgba(0,0,0,.40),rgba(0,0,0,.15) 38%,transparent 74%)!important;
}
.reel-card::before{
  height:30%!important;
  opacity:.66!important;
  background:
    radial-gradient(ellipse at 17% 78%,rgba(0,0,0,.42),rgba(0,0,0,.17) 38%,transparent 72%),
    linear-gradient(180deg,transparent 0%,rgba(0,0,0,.055) 42%,rgba(0,0,0,.28) 100%)!important;
}
.card-info::before{
  left:-16px!important;
  right:auto!important;
  width:min(650px,calc(100% + 58px))!important;
  bottom:-13px!important;
  height:calc(100% + 28px)!important;
  opacity:.80!important;
  filter:blur(10px)!important;
  border-radius:26px!important;
  background:
    radial-gradient(ellipse at 15% 50%,rgba(0,0,0,.78),rgba(0,0,0,.33) 46%,transparent 78%),
    linear-gradient(90deg,rgba(0,0,0,.58),rgba(0,0,0,.22) 68%,transparent 100%)!important;
}
.card-info .seller-line{
  background:rgba(2,5,8,.42)!important;
}
.card-info h1{
  text-shadow:0 2px 1px rgba(0,0,0,.78),0 7px 21px rgba(0,0,0,.88),0 0 2px rgba(0,0,0,.88)!important;
}
.card-info p{
  background:transparent!important;
  color:rgba(255,255,255,.98)!important;
  text-shadow:0 1px 1px rgba(0,0,0,.84),0 5px 17px rgba(0,0,0,.94),0 0 2px rgba(0,0,0,.90)!important;
}
@media(min-width:1100px){
  .media-wrap.photo::after,
  .media-wrap::after{
    background:
      linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,0) 44%,rgba(0,0,0,.04) 66%,rgba(0,0,0,.18) 84%,rgba(0,0,0,.38) 100%),
      radial-gradient(ellipse at 15% 84%,rgba(0,0,0,.36),rgba(0,0,0,.12) 36%,transparent 74%)!important;
  }
  .reel-card::before{height:28%!important;opacity:.58!important;}
  .card-info::before{opacity:.76!important;width:min(670px,calc(100% + 70px))!important;}
}

/* v60 final polish: keep the picture bright, keep the words crisp */
.media-wrap.photo::after,
.media-wrap::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,.14) 0%,rgba(0,0,0,.006) 43%,rgba(0,0,0,.04) 66%,rgba(0,0,0,.25) 84%,rgba(0,0,0,.52) 100%),
    radial-gradient(ellipse at 14% 86%,rgba(0,0,0,.46),rgba(0,0,0,.18) 38%,transparent 72%)!important;
}
.reel-card::before{
  height:30%!important;
  opacity:.66!important;
  background:
    radial-gradient(ellipse at 16% 78%,rgba(0,0,0,.44),rgba(0,0,0,.16) 38%,transparent 70%),
    linear-gradient(180deg,transparent 0%,rgba(0,0,0,.04) 34%,rgba(0,0,0,.28) 100%)!important;
}
.card-info::before{
  opacity:.62!important;
  filter:blur(10px)!important;
  background:
    radial-gradient(ellipse at 16% 58%,rgba(0,0,0,.60),rgba(0,0,0,.24) 45%,transparent 78%),
    linear-gradient(90deg,rgba(0,0,0,.40),rgba(0,0,0,.12) 62%,transparent 100%)!important;
}
.card-info h1{
  text-shadow:0 3px 16px rgba(0,0,0,.94),0 1px 1px rgba(0,0,0,.92),0 0 2px rgba(0,0,0,.95)!important;
  -webkit-text-stroke:.22px rgba(0,0,0,.52)!important;
}
.card-info p{
  background:transparent!important;
  color:rgba(255,255,255,.98)!important;
  text-shadow:0 3px 14px rgba(0,0,0,.96),0 1px 1px rgba(0,0,0,.90),0 0 2px rgba(0,0,0,.92)!important;
}
@media(min-width:1100px){
  .media-wrap.photo::after,
  .media-wrap::after{
    background:
      linear-gradient(180deg,rgba(0,0,0,.10) 0%,rgba(0,0,0,.004) 46%,rgba(0,0,0,.035) 68%,rgba(0,0,0,.22) 84%,rgba(0,0,0,.46) 100%),
      radial-gradient(ellipse at 13% 86%,rgba(0,0,0,.42),rgba(0,0,0,.14) 38%,transparent 74%)!important;
  }
  .reel-card::before{height:28%!important;opacity:.58!important;}
  .card-info::before{opacity:.56!important;}
}

/* v60.0.0 showcase motion: next shop arrives gently without dimming the product photo */
.reel-card.auto-advancing .media-wrap img{transform:scale(1.012)!important;transition:transform .72s cubic-bezier(.2,.8,.2,1),filter .72s ease!important;}
.reel-card.auto-advancing .card-info{animation:vcShowcaseCaptionIn .58s cubic-bezier(.2,.8,.2,1) both!important;}
@keyframes vcShowcaseCaptionIn{from{opacity:.88;transform:translateY(10px) scale(.992);}to{opacity:1;transform:translateY(0) scale(1);}}

/* v60: lighter photo layer, sharper text, and desktop auto-showcase polish */
.media-wrap.photo::after,
.media-wrap::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.015) 34%, rgba(0,0,0,.04) 58%, rgba(0,0,0,.32) 82%, rgba(0,0,0,.58) 100%),
    radial-gradient(ellipse at 13% 82%, rgba(0,0,0,.42), rgba(0,0,0,.22) 32%, transparent 66%) !important;
}
.reel-card::before {
  height: 34% !important;
  opacity: .72 !important;
  background:
    radial-gradient(ellipse at 13% 76%, rgba(0,0,0,.46), rgba(0,0,0,.20) 34%, transparent 68%),
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,.18) 58%, rgba(0,0,0,.48) 100%) !important;
}
.card-info {
  position: absolute !important;
  isolation: isolate !important;
  padding: 8px 10px 10px !important;
  border-radius: 22px !important;
  background: linear-gradient(135deg, rgba(2,8,12,.25), rgba(2,8,12,.10)) !important;
  backdrop-filter: blur(4px) saturate(1.04) !important;
  box-shadow: none !important;
}
.card-info::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  left: -12px !important;
  right: -12px !important;
  top: -8px !important;
  bottom: -10px !important;
  border-radius: 26px !important;
  background:
    radial-gradient(ellipse at 18% 72%, rgba(0,0,0,.52), rgba(0,0,0,.24) 42%, transparent 72%),
    linear-gradient(135deg, rgba(0,0,0,.32), rgba(0,0,0,.10)) !important;
  filter: blur(4px) !important;
  opacity: .82 !important;
  pointer-events: none !important;
}
.card-info .seller-line {
  background: rgba(2,8,12,.46) !important;
  border-color: rgba(255,255,255,.14) !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
.card-info h1 {
  color: #fff !important;
  text-shadow: 0 3px 14px rgba(0,0,0,.88), 0 1px 1px rgba(0,0,0,.86) !important;
  filter: none !important;
}
.card-info p {
  color: rgba(255,255,255,.95) !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.82), 0 1px 1px rgba(0,0,0,.82) !important;
  line-height: 1.38 !important;
  max-height: 56px !important;
}
.reel-card.auto-advancing .media-wrap {
  box-shadow: 0 0 0 2px rgba(35,240,216,.22), 0 24px 76px rgba(0,0,0,.54) !important;
}
.flyer-profile-btn .icon,
.flyer-profile-btn svg {
  width: 16px !important;
  height: 16px !important;
}
.flyer-profile-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
}
@media (min-width: 1100px) {
  .media-wrap.photo::after,
  .media-wrap::after {
    background:
      linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.01) 44%, rgba(0,0,0,.06) 66%, rgba(0,0,0,.36) 100%),
      radial-gradient(ellipse at 15% 82%, rgba(0,0,0,.40), rgba(0,0,0,.20) 34%, transparent 70%) !important;
  }
  .reel-card::before {
    height: 28% !important;
    opacity: .62 !important;
    background:
      radial-gradient(ellipse at 15% 76%, rgba(0,0,0,.42), rgba(0,0,0,.18) 35%, transparent 70%),
      linear-gradient(180deg, transparent 0%, rgba(0,0,0,.16) 58%, rgba(0,0,0,.44) 100%) !important;
  }
  .card-info {
    padding: 10px 12px 12px !important;
    background: linear-gradient(135deg, rgba(1,7,10,.20), rgba(1,7,10,.07)) !important;
  }
  .card-info::before {
    opacity: .74 !important;
    filter: blur(5px) !important;
    background:
      radial-gradient(ellipse at 17% 74%, rgba(0,0,0,.48), rgba(0,0,0,.20) 42%, transparent 76%),
      linear-gradient(135deg, rgba(0,0,0,.24), rgba(0,0,0,.08)) !important;
  }
  .card-info h1 { text-shadow: 0 3px 16px rgba(0,0,0,.86), 0 1px 1px rgba(0,0,0,.84) !important; }
  .card-info p { max-height: 50px !important; -webkit-line-clamp: 2 !important; }
}

/* v60.0.0 shipping polish: auto-shop glide without hiding the photo */
.reel-card.auto-advancing{
  animation:vcAutoShopRise .58s cubic-bezier(.2,.78,.2,1) both!important;
}
@keyframes vcAutoShopRise{
  from{transform:translateY(14px) scale(.995);filter:saturate(.96) brightness(.96);}
  to{transform:translateY(0) scale(1);filter:none;}
}
.card-info{
  isolation:isolate!important;
}
.card-info p{
  letter-spacing:-.01em!important;
  max-width:min(580px,calc(100vw - 128px))!important;
}
@media(min-width:1100px){
  .card-info p{max-width:640px!important;}
}

/* v61.0.0 TikTok-style feed polish: no heavy caption card, product stays bright */
.media-wrap.photo .media-main{
  filter:saturate(1.07) contrast(1.045) brightness(1.02)!important;
}
.media-wrap.photo .media-bg{
  opacity:.42!important;
  filter:blur(18px) saturate(1.12) brightness(.74)!important;
}
.media-wrap.photo::after,
.media-wrap::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,.18) 0%,rgba(0,0,0,.015) 30%,rgba(0,0,0,.03) 58%,rgba(0,0,0,.20) 76%,rgba(0,0,0,.46) 100%),
    radial-gradient(ellipse at 15% 86%,rgba(0,0,0,.34),rgba(0,0,0,.12) 38%,transparent 72%)!important;
}
.reel-card::before{
  height:26%!important;
  opacity:.48!important;
  background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.12) 72%,rgba(0,0,0,.30) 100%)!important;
}
.card-glow{opacity:.42!important;height:34%!important;}
.card-info{
  background:transparent!important;
  backdrop-filter:none!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
  border-radius:0!important;
  isolation:isolate!important;
}
.card-info::before{display:none!important;content:none!important;}
.card-info .seller-line{
  background:rgba(0,0,0,.30)!important;
  border-color:rgba(255,255,255,.16)!important;
  backdrop-filter:blur(10px) saturate(1.05)!important;
  box-shadow:0 10px 26px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.10)!important;
}
.card-info h1{
  color:#fff!important;
  letter-spacing:-.065em!important;
  text-shadow:0 3px 18px rgba(0,0,0,.92),0 1px 2px rgba(0,0,0,.98),0 0 1px rgba(0,0,0,.95)!important;
  -webkit-text-stroke:.16px rgba(0,0,0,.42)!important;
}
.card-info p{
  background:transparent!important;
  color:rgba(255,255,255,.96)!important;
  text-shadow:0 2px 14px rgba(0,0,0,.92),0 1px 1px rgba(0,0,0,.98)!important;
  line-height:1.34!important;
}
.badge-line .badge,
.tag-line .tag{
  backdrop-filter:blur(10px)!important;
  background:rgba(0,0,0,.30)!important;
  border-color:rgba(255,255,255,.15)!important;
  box-shadow:0 8px 18px rgba(0,0,0,.18)!important;
}
.badge-line .badge.price,
.badge.price{
  color:#031114!important;
  background:linear-gradient(135deg,#23f0d8,#8fffe8)!important;
  border:0!important;
  box-shadow:0 10px 24px rgba(35,240,216,.18)!important;
}
.badge-line .badge.available,
.badge.available{
  color:#031114!important;
  background:linear-gradient(135deg,#25ee97,#b7ffd8)!important;
  border:0!important;
}
@media(max-width:720px){
  .media-wrap.photo .media-main{object-fit:cover!important;object-position:center!important;}
  .media-wrap.photo.portrait .media-main{object-fit:cover!important;}
  .media-wrap.photo.landscape .media-main{object-fit:cover!important;}
  .media-wrap.photo .media-bg{opacity:.34!important;}
  .card-info{left:16px!important;right:84px!important;bottom:calc(82px + var(--safe-bottom))!important;gap:7px!important;}
  .card-info h1{font-size:clamp(28px,8vw,39px)!important;line-height:.99!important;max-height:82px!important;}
  .card-info p{font-size:14px!important;max-height:44px!important;-webkit-line-clamp:2!important;}
}
@media(min-width:1100px){
  .media-wrap.photo .media-bg{opacity:.30!important;filter:blur(18px) brightness(.78) saturate(1.12)!important;}
  .media-wrap.photo::after,
  .media-wrap::after{
    background:
      linear-gradient(180deg,rgba(0,0,0,.10) 0%,rgba(0,0,0,.008) 42%,rgba(0,0,0,.035) 66%,rgba(0,0,0,.22) 84%,rgba(0,0,0,.40) 100%),
      radial-gradient(ellipse at 14% 86%,rgba(0,0,0,.34),rgba(0,0,0,.13) 38%,transparent 74%)!important;
  }
  .reel-card::before{height:22%!important;opacity:.42!important;}
  .card-info{
    background:transparent!important;
    backdrop-filter:none!important;
    padding:0!important;
  }
  .card-info .seller-line{background:rgba(0,0,0,.28)!important;}
  .card-info h1{text-shadow:0 3px 18px rgba(0,0,0,.90),0 1px 2px rgba(0,0,0,.96)!important;}
  .card-info p{max-height:46px!important;-webkit-line-clamp:2!important;}
}

/* v61.0.0 Flyer Studio: clear export progress and sharper preview chrome */
.flyer-export-progress{
  display:grid!important;
  gap:8px!important;
  padding:10px 12px!important;
  border-radius:18px!important;
  border:1px solid rgba(35,240,216,.22)!important;
  background:linear-gradient(135deg,rgba(35,240,216,.13),rgba(255,63,134,.07)),rgba(0,0,0,.28)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.flyer-export-progress[hidden]{display:none!important;}
.flyer-export-progress>div{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
}
.flyer-export-progress b,
#flyerProgressLabel{
  color:#fff!important;
  font-size:12px!important;
  font-weight:1000!important;
  line-height:1.25!important;
}
.flyer-export-progress span,
#flyerProgressPercent{
  color:#23f0d8!important;
  font-size:12px!important;
  font-weight:1000!important;
}
.flyer-export-progress i{
  display:block!important;
  height:8px!important;
  border-radius:999px!important;
  overflow:hidden!important;
  background:rgba(255,255,255,.11)!important;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.28)!important;
}
.flyer-export-progress i span,
#flyerProgressBar{
  display:block!important;
  width:0%;
  height:100%!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,#23f0d8,#25ee97,#ff3f86)!important;
  box-shadow:0 0 16px rgba(35,240,216,.45)!important;
  transition:width .22s ease!important;
}
.flyer-canvas-shell{
  background:radial-gradient(circle at 50% 0,rgba(35,240,216,.12),transparent 32%),rgba(0,0,0,.18)!important;
}
#flyerCanvas{
  image-rendering:auto!important;
  box-shadow:0 28px 80px rgba(0,0,0,.44),0 0 0 1px rgba(255,255,255,.13)!important;
}
.flyer-export-actions button.loading{
  opacity:.92!important;
  transform:none!important;
}

/* v61.0.0 sharper ViConnects mark wherever the SVG is used */
.brand img,
.desktop-logo img,
.qr-logo{
  object-fit:contain!important;
  background:#061017!important;
}

/* v61.0.0 final user polish: TikTok-like readable text without a heavy black card */
.media-wrap.photo .media-main,
.media-wrap.video .media-main,
.media-wrap img.media-main,
.media-wrap video.media-main{
  filter:saturate(1.08) contrast(1.035) brightness(1.035)!important;
}
.media-wrap.photo::after,
.media-wrap::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.006) 34%,rgba(0,0,0,.018) 60%,rgba(0,0,0,.16) 80%,rgba(0,0,0,.34) 100%),
    radial-gradient(ellipse at 15% 86%,rgba(0,0,0,.24),rgba(0,0,0,.08) 38%,transparent 72%)!important;
}
.reel-card::before{
  height:24%!important;
  opacity:.36!important;
  background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.08) 68%,rgba(0,0,0,.24) 100%)!important;
}
.card-info{
  background:transparent!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
  border:0!important;
  padding:0!important;
  border-radius:0!important;
}
.card-info::before{display:none!important;content:none!important;}
.card-info h1{
  text-shadow:0 2px 12px rgba(0,0,0,.92),0 1px 2px rgba(0,0,0,.98),0 0 1px rgba(0,0,0,.96)!important;
  -webkit-text-stroke:.12px rgba(0,0,0,.38)!important;
}
.card-info p{
  background:transparent!important;
  text-shadow:0 2px 10px rgba(0,0,0,.90),0 1px 1px rgba(0,0,0,.96)!important;
  max-height:52px!important;
}
.card-info .seller-line,
.badge-line .badge,
.tag-line .tag{
  background:rgba(0,0,0,.24)!important;
  backdrop-filter:blur(8px) saturate(1.05)!important;
  border-color:rgba(255,255,255,.14)!important;
}
.flyer-export-progress.active{
  animation:vcFlyerProgressPulse 1.1s ease-in-out infinite alternate!important;
}
@keyframes vcFlyerProgressPulse{from{box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 0 rgba(35,240,216,0);}to{box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 0 22px rgba(35,240,216,.18);}}

/* v61.0.0 final pass: TikTok-style readable captions without the heavy black product mask */
.media-wrap.photo .media-main,
.media-wrap.video .media-main{
  filter:saturate(1.05) contrast(1.03) brightness(1.01)!important;
}
.media-wrap.photo::after,
.media-wrap.video::after,
.media-wrap::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,.06) 0%,rgba(0,0,0,0) 42%,rgba(0,0,0,.018) 66%,rgba(0,0,0,.14) 84%,rgba(0,0,0,.32) 100%),
    radial-gradient(ellipse at 15% 86%,rgba(0,0,0,.30),rgba(0,0,0,.10) 38%,transparent 74%)!important;
}
.reel-card::before{
  height:18%!important;
  opacity:.34!important;
  background:
    radial-gradient(ellipse at 14% 80%,rgba(0,0,0,.34),rgba(0,0,0,.12) 40%,transparent 76%),
    linear-gradient(180deg,transparent 0%,rgba(0,0,0,.05) 52%,rgba(0,0,0,.20) 100%)!important;
}
.card-info{
  background:transparent!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
  border:0!important;
  padding:0!important;
  border-radius:0!important;
}
.card-info::before{display:none!important;content:none!important;}
.card-info .seller-line{
  width:max-content!important;
  max-width:min(92%,420px)!important;
  background:rgba(0,0,0,.34)!important;
  border:1px solid rgba(255,255,255,.16)!important;
  backdrop-filter:blur(12px) saturate(1.08)!important;
  box-shadow:0 8px 22px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.11)!important;
}
.card-info h1{
  color:#fff!important;
  text-shadow:0 4px 18px rgba(0,0,0,.92),0 1px 2px rgba(0,0,0,.96),0 0 1px rgba(0,0,0,1)!important;
  -webkit-text-stroke:.14px rgba(0,0,0,.58)!important;
}
.card-info p{
  background:transparent!important;
  color:rgba(255,255,255,.97)!important;
  text-shadow:0 3px 14px rgba(0,0,0,.96),0 1px 1px rgba(0,0,0,.96)!important;
  line-height:1.34!important;
}
.badge-line .badge,
.tag-line .tag{
  backdrop-filter:blur(12px) saturate(1.08)!important;
  background:rgba(0,0,0,.30)!important;
  border:1px solid rgba(255,255,255,.14)!important;
}
@media(min-width:1100px){
  .media-wrap.photo::after,
  .media-wrap.video::after,
  .media-wrap::after{
    background:
      linear-gradient(180deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,0) 48%,rgba(0,0,0,.014) 70%,rgba(0,0,0,.12) 86%,rgba(0,0,0,.28) 100%),
      radial-gradient(ellipse at 14% 86%,rgba(0,0,0,.26),rgba(0,0,0,.08) 39%,transparent 76%)!important;
  }
  .reel-card::before{height:16%!important;opacity:.30!important;}
  .card-info h1{letter-spacing:-.066em!important;}
  .card-info p{max-height:48px!important;-webkit-line-clamp:2!important;}
}
@media(max-width:720px){
  .media-wrap.photo::after,
  .media-wrap.video::after,
  .media-wrap::after{
    background:
      linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,0) 40%,rgba(0,0,0,.03) 68%,rgba(0,0,0,.20) 86%,rgba(0,0,0,.42) 100%),
      radial-gradient(ellipse at 15% 86%,rgba(0,0,0,.36),rgba(0,0,0,.13) 40%,transparent 74%)!important;
  }
  .reel-card::before{height:22%!important;opacity:.42!important;}
}

/* v61.0.0 Flyer Studio final polish: export progress is unmistakable and the preview stage stays premium */
.flyer-export-progress.active{
  animation:vcFlyerProgressPulse 1.4s ease-in-out infinite!important;
}
@keyframes vcFlyerProgressPulse{
  0%,100%{box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 0 rgba(35,240,216,0);}
  50%{box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 24px rgba(35,240,216,.12);}
}
.flyer-canvas-shell canvas,
#flyerCanvas{
  border-radius:22px!important;
}
.flyer-profile-btn{
  background:linear-gradient(135deg,rgba(35,240,216,.18),rgba(37,238,151,.10))!important;
  border-color:rgba(35,240,216,.28)!important;
}
.brand img,
.desktop-logo img,
.qr-logo{
  border-radius:12px!important;
  padding:2px!important;
  box-shadow:0 0 0 1px rgba(35,240,216,.24),0 12px 28px rgba(0,0,0,.24)!important;
}


/* v61.0.0 final pass: TikTok-like product visibility with readable captions */
.media-wrap.photo .media-main{
  filter:saturate(1.10) contrast(1.035) brightness(1.045)!important;
}
.media-wrap.photo .media-bg{
  opacity:.24!important;
  filter:blur(20px) saturate(1.08) brightness(.82)!important;
}
.media-wrap.photo::after,
.media-wrap::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,.07) 0%,rgba(0,0,0,.00) 38%,rgba(0,0,0,.025) 62%,rgba(0,0,0,.14) 80%,rgba(0,0,0,.32) 100%),
    radial-gradient(ellipse at 14% 88%,rgba(0,0,0,.25),rgba(0,0,0,.10) 39%,transparent 73%)!important;
}
.reel-card::before{
  height:20%!important;
  opacity:.34!important;
  background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.07) 68%,rgba(0,0,0,.22) 100%)!important;
}
.card-glow{opacity:.22!important;height:27%!important;}
.card-info{
  background:transparent!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
  border:0!important;
  padding:0!important;
}
.card-info .seller-line{
  background:rgba(0,0,0,.22)!important;
  border-color:rgba(255,255,255,.18)!important;
  backdrop-filter:blur(9px) saturate(1.05)!important;
}
.badge-line .badge,
.tag-line .tag{
  background:rgba(0,0,0,.20)!important;
  border-color:rgba(255,255,255,.18)!important;
}
.card-info h1{
  text-shadow:0 3px 16px rgba(0,0,0,.88),0 1px 2px rgba(0,0,0,.98)!important;
}
.card-info p{
  text-shadow:0 2px 13px rgba(0,0,0,.88),0 1px 1px rgba(0,0,0,.98)!important;
}
@media(min-width:1100px){
  .media-wrap.photo::after,
  .media-wrap::after{
    background:
      linear-gradient(180deg,rgba(0,0,0,.045) 0%,rgba(0,0,0,.00) 44%,rgba(0,0,0,.025) 68%,rgba(0,0,0,.12) 84%,rgba(0,0,0,.28) 100%),
      radial-gradient(ellipse at 13% 88%,rgba(0,0,0,.23),rgba(0,0,0,.09) 40%,transparent 75%)!important;
  }
  .reel-card::before{height:18%!important;opacity:.30!important;}
  .card-info .seller-line{background:rgba(0,0,0,.20)!important;}
  .badge-line .badge,.tag-line .tag{background:rgba(0,0,0,.18)!important;}
}

/* v61.0.0 final pass: export buttons clearly pause while a flyer is downloading */
.flyer-export-actions button:disabled,
.flyer-export-actions button.loading{
  cursor:wait!important;
  opacity:.78!important;
  filter:saturate(.92)!important;
}
.flyer-export-progress.active{
  animation:vcFlyerProgressBreath 1.15s ease-in-out infinite alternate!important;
}
@keyframes vcFlyerProgressBreath{
  from{box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 0 rgba(35,240,216,0);}
  to{box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 0 28px rgba(35,240,216,.13);}
}

/* v61.0.0 final cut: no heavy caption card, product stays the hero */
.media-wrap.photo::after,
.media-wrap::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,0) 38%,rgba(0,0,0,.012) 64%,rgba(0,0,0,.10) 82%,rgba(0,0,0,.28) 100%),
    radial-gradient(ellipse at 13% 87%,rgba(0,0,0,.18),rgba(0,0,0,.055) 42%,transparent 78%)!important;
}
.reel-card::before{
  height:22%!important;
  opacity:.24!important;
  background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.055) 70%,rgba(0,0,0,.18) 100%)!important;
}
.card-info{
  padding:0!important;
  background:transparent!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
  border:0!important;
}
.card-info::before{display:none!important;opacity:0!important;background:none!important;filter:none!important;}
.card-info h1{
  text-shadow:0 2px 1px rgba(0,0,0,.92),0 8px 20px rgba(0,0,0,.74),0 0 2px rgba(0,0,0,.96)!important;
  -webkit-text-stroke:.10px rgba(0,0,0,.35)!important;
}
.card-info p{
  color:rgba(255,255,255,.97)!important;
  text-shadow:0 2px 1px rgba(0,0,0,.90),0 7px 18px rgba(0,0,0,.76),0 0 2px rgba(0,0,0,.95)!important;
  max-height:55px!important;
  background:transparent!important;
}
.card-info .seller-line,
.badge-line .badge,
.tag-line .tag{
  background:rgba(4,9,13,.30)!important;
  border-color:rgba(255,255,255,.16)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.08)!important;
  backdrop-filter:blur(8px) saturate(1.08)!important;
}
.action{
  background:rgba(4,8,12,.42)!important;
  backdrop-filter:blur(12px) saturate(1.10)!important;
  border-color:rgba(255,255,255,.15)!important;
}
.action.chat,.action.live,.action.get{box-shadow:0 12px 30px rgba(0,0,0,.20)!important;}
@media(min-width:1100px){
  .media-wrap.photo::after,
  .media-wrap::after{
    background:
      linear-gradient(180deg,rgba(0,0,0,.055) 0%,rgba(0,0,0,0) 46%,rgba(0,0,0,.012) 68%,rgba(0,0,0,.09) 84%,rgba(0,0,0,.24) 100%),
      radial-gradient(ellipse at 14% 88%,rgba(0,0,0,.16),rgba(0,0,0,.045) 42%,transparent 80%)!important;
  }
  .reel-card::before{height:20%!important;opacity:.20!important;}
  .card-info p{max-width:min(660px,calc(100vw - 820px))!important;}
}

/* v61.0.0 Flyer Studio: product-photo cards, clear QR and visible download progress */
.flyer-canvas-shell canvas,
#flyerCanvas{
  border-radius:24px!important;
  background:#061017!important;
}
.flyer-export-progress{
  position:relative!important;
  overflow:hidden!important;
}
.flyer-export-progress::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.07) 38%,transparent 68%)!important;
  transform:translateX(-120%)!important;
  animation:vcFlyerProgressSweep 1.45s linear infinite!important;
}
@keyframes vcFlyerProgressSweep{to{transform:translateX(120%);}}
.flyer-export-actions button[aria-busy="true"],
.flyer-export-actions button.loading{
  opacity:.96!important;
  cursor:progress!important;
}
.flyer-pick,
.flyer-product-pick{
  background:rgba(255,255,255,.07)!important;
  border-color:rgba(255,255,255,.13)!important;
}
.flyer-pick.active,
.flyer-product-pick:has(input:checked){
  background:rgba(35,240,216,.13)!important;
  border-color:rgba(35,240,216,.72)!important;
  box-shadow:0 0 0 2px rgba(35,240,216,.10),0 12px 28px rgba(0,0,0,.18)!important;
}

/* v63.0.0 Long Flyer Studio + mobile photo fit polish */
.flyer-control-row.flyer-control-row-three{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}
.flyer-control-row input[readonly]{
  cursor:default!important;
  color:rgba(255,255,255,.88)!important;
  background:linear-gradient(135deg,rgba(35,240,216,.10),rgba(255,255,255,.055))!important;
}
.flyer-product-picker{
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr))!important;
  max-height:360px!important;
}
.flyer-pick{
  min-height:184px!important;
}
.flyer-pick span{
  height:118px!important;
  background:radial-gradient(circle at 50% 18%,rgba(35,240,216,.10),transparent 48%),rgba(255,255,255,.08)!important;
}
.flyer-pick img{
  object-fit:contain!important;
  padding:3px!important;
  background:rgba(255,255,255,.92)!important;
}
.flyer-canvas-shell{
  min-height:min(760px,78dvh)!important;
  align-items:start!important;
}
#flyerCanvas{
  max-height:none!important;
  height:auto!important;
  max-width:min(720px,100%)!important;
}
@media(min-width:1100px){
  #flyerSheet .sheet-card.flyer-card{width:min(1260px,calc(100vw - 310px))!important;max-width:min(1260px,calc(100vw - 310px))!important;}
  .flyer-studio-grid{grid-template-columns:minmax(360px,460px) minmax(0,1fr)!important;}
  .flyer-product-picker{max-height:390px!important;}
  .flyer-canvas-shell{max-height:78dvh!important;overflow:auto!important;}
}
@media(max-width:720px){
  .flyer-control-row.flyer-control-row-three{grid-template-columns:1fr!important;}
  .flyer-product-picker{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-height:330px!important;}
  .flyer-pick{min-height:172px!important;}
  .flyer-pick span{height:108px!important;}
  .flyer-canvas-shell{max-height:64dvh!important;overflow:auto!important;align-items:start!important;}
  #flyerCanvas{width:100%!important;max-width:100%!important;}
}

/* Mobile feed: never over-zoom product photos. The blurred background fills empty space, the main photo stays complete. */
@media(max-width:719px){
  .media-wrap.photo .media-main,
  .media-wrap.photo.portrait .media-main,
  .media-wrap.photo.landscape .media-main,
  .media-wrap.photo.squareish .media-main,
  .media-wrap.carousel .media-main{
    object-fit:contain!important;
    object-position:center center!important;
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:100%!important;
    transform:none!important;
    padding:0!important;
  }
  .media-wrap.photo .media-bg{
    opacity:.34!important;
    filter:blur(24px) saturate(1.12) brightness(.66)!important;
    transform:scale(1.06)!important;
  }
  .media-wrap.photo::after,
  .media-wrap::after{
    background:
      linear-gradient(180deg,rgba(0,0,0,.055) 0%,rgba(0,0,0,0) 42%,rgba(0,0,0,.02) 66%,rgba(0,0,0,.13) 84%,rgba(0,0,0,.30) 100%),
      radial-gradient(ellipse at 13% 88%,rgba(0,0,0,.24),rgba(0,0,0,.08) 42%,transparent 78%)!important;
  }
  .reel-card::before{height:20%!important;opacity:.25!important;}
  .card-info h1{font-size:clamp(28px,8.8vw,38px)!important;line-height:.98!important;}
  .card-info p{font-size:14px!important;line-height:1.32!important;max-height:58px!important;}
}

/* v63.0.0 Domain move polish: bright TikTok-style feed, no title clipping, hands-free mobile showcase, cleaner long flyers */
.media-wrap.photo .media-main,
.media-wrap.carousel .media-main{
  object-fit:contain!important;
  object-position:center center!important;
}
.media-wrap.photo .media-bg,
.media-wrap.carousel .media-bg{
  opacity:.42!important;
  filter:blur(22px) saturate(1.15) brightness(.70)!important;
}
.media-wrap.photo::after,
.media-wrap::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,0) 40%,rgba(0,0,0,.025) 66%,rgba(0,0,0,.15) 84%,rgba(0,0,0,.36) 100%),
    radial-gradient(ellipse at 13% 86%,rgba(0,0,0,.32),rgba(0,0,0,.12) 40%,transparent 74%)!important;
}
.reel-card::before{
  height:25%!important;
  opacity:.46!important;
  background:
    radial-gradient(ellipse at 16% 80%,rgba(0,0,0,.36),rgba(0,0,0,.13) 40%,transparent 72%),
    linear-gradient(180deg,transparent 0%,rgba(0,0,0,.035) 48%,rgba(0,0,0,.22) 100%)!important;
}
.card-info{
  overflow:visible!important;
  bottom:calc(84px + var(--safe-bottom))!important;
}
.card-info::before{
  opacity:.54!important;
  filter:blur(9px)!important;
  width:min(690px,calc(100% + 62px))!important;
  background:
    radial-gradient(ellipse at 16% 58%,rgba(0,0,0,.54),rgba(0,0,0,.22) 46%,transparent 78%),
    linear-gradient(90deg,rgba(0,0,0,.33),rgba(0,0,0,.10) 66%,transparent 100%)!important;
}
.card-info h1{
  line-height:1.065!important;
  max-height:132px!important;
  -webkit-line-clamp:3!important;
  overflow:hidden!important;
  padding-bottom:7px!important;
  margin-bottom:-3px!important;
  text-shadow:0 2px 1px rgba(0,0,0,.82),0 7px 22px rgba(0,0,0,.90),0 0 2px rgba(0,0,0,.92)!important;
}
.card-info p{
  line-height:1.36!important;
  max-height:68px!important;
  -webkit-line-clamp:3!important;
  text-shadow:0 2px 1px rgba(0,0,0,.84),0 6px 18px rgba(0,0,0,.92)!important;
}
@media(max-width:719px){
  .card-info{left:16px!important;right:78px!important;bottom:calc(82px + var(--safe-bottom))!important;}
  .card-info h1{font-size:clamp(27px,8.4vw,36px)!important;line-height:1.055!important;max-height:122px!important;padding-bottom:8px!important;}
  .card-info p{font-size:14px!important;line-height:1.34!important;max-height:64px!important;}
  .card-info::before{opacity:.50!important;filter:blur(8px)!important;}
  .reel-card::before{height:18%!important;opacity:.22!important;}
}
@media(min-width:1100px){
  .card-info h1{font-size:clamp(28px,2.45vw,40px)!important;line-height:1.055!important;max-height:132px!important;}
  .card-info p{font-size:15.5px!important;line-height:1.38!important;max-height:70px!important;}
  .reel-card::before{height:25%!important;opacity:.42!important;}
  .media-wrap.photo::after,
  .media-wrap::after{
    background:
      linear-gradient(180deg,rgba(0,0,0,.055) 0%,rgba(0,0,0,0) 46%,rgba(0,0,0,.022) 68%,rgba(0,0,0,.13) 84%,rgba(0,0,0,.30) 100%),
      radial-gradient(ellipse at 15% 86%,rgba(0,0,0,.30),rgba(0,0,0,.10) 38%,transparent 74%)!important;
  }
}
.flyer-canvas-shell{
  background:radial-gradient(circle at 50% 0,rgba(35,240,216,.12),transparent 34%),rgba(1,6,10,.42)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 26px 70px rgba(0,0,0,.30)!important;
}
#flyerCanvas{
  border-radius:24px!important;
  box-shadow:0 22px 60px rgba(0,0,0,.36)!important;
  image-rendering:auto!important;
}
.flyer-product-picker{max-height:430px!important;}
.flyer-pick{min-height:190px!important;}
.flyer-pick span{height:124px!important;}
.flyer-export-progress.active{outline:1px solid rgba(35,240,216,.26)!important;}
@media(min-width:1100px){
  #flyerSheet .sheet-card.flyer-card{width:min(1320px,calc(100vw - 260px))!important;max-width:min(1320px,calc(100vw - 260px))!important;}
  .flyer-studio-grid{grid-template-columns:minmax(370px,470px) minmax(0,1fr)!important;}
  #flyerCanvas{max-width:min(760px,100%)!important;}
}
@media(max-width:720px){
  .flyer-canvas-shell{max-height:70dvh!important;overflow:auto!important;}
  #flyerCanvas{width:100%!important;max-width:100%!important;}
  .flyer-product-picker{max-height:360px!important;}
}

/* v64.0.0: English-default launch polish, professional mobile action rail */
.reel-card.is-active .action-rail{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  filter:drop-shadow(0 14px 30px rgba(0,0,0,.38))!important;
  overflow:visible!important;
}
.reel-card.is-active .action,
.action{
  width:66px!important;
  min-height:60px!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:visible!important;
  text-align:center!important;
  backdrop-filter:none!important;
}
.reel-card.is-active .action span,
.action span{
  width:47px!important;
  height:47px!important;
  min-width:47px!important;
  min-height:47px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:999px!important;
  background:rgba(3,7,10,.62)!important;
  border:1px solid rgba(255,255,255,.20)!important;
  color:#fff!important;
  box-shadow:0 16px 34px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.16)!important;
  backdrop-filter:blur(18px) saturate(1.14)!important;
  overflow:hidden!important;
}
.reel-card.is-active .action svg,
.action svg{
  width:21px!important;
  height:21px!important;
  stroke-width:2.18!important;
  filter:drop-shadow(0 2px 7px rgba(0,0,0,.30))!important;
}
.reel-card.is-active .action b,
.action b{
  display:block!important;
  width:66px!important;
  max-width:66px!important;
  min-height:11px!important;
  color:#fff!important;
  font-size:8.8px!important;
  font-weight:1000!important;
  line-height:1.08!important;
  letter-spacing:-.025em!important;
  text-align:center!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  text-shadow:0 2px 7px rgba(0,0,0,.92),0 0 1px rgba(0,0,0,.9)!important;
}
.reel-card.is-active .action.get span,
.reel-card.is-active .action.book span,
.reel-card.is-active .action.chat span,
.reel-card.is-active .action.live span,
.action.get span,
.action.book span,
.action.chat span,
.action.live span{
  border:0!important;
  color:#031414!important;
  background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.76),rgba(255,255,255,0) 25%),linear-gradient(145deg,#26f4d3 0%,#28f59e 100%)!important;
  box-shadow:0 16px 36px rgba(38,244,211,.24),0 0 0 1px rgba(255,255,255,.10),inset 0 1px 0 rgba(255,255,255,.38)!important;
}
.reel-card.is-active .action.get svg,
.reel-card.is-active .action.book svg,
.reel-card.is-active .action.chat svg,
.reel-card.is-active .action.live svg,
.action.get svg,
.action.book svg,
.action.chat svg,
.action.live svg{
  stroke:#031414!important;
}
.reel-card.is-active .action:active span,
.action:active span{
  transform:translateY(1px) scale(.96)!important;
}
.reel-card.is-active .action:hover span,
.action:hover span{
  border-color:rgba(38,244,211,.48)!important;
  box-shadow:0 18px 38px rgba(0,0,0,.38),0 0 0 3px rgba(38,244,211,.08),inset 0 1px 0 rgba(255,255,255,.18)!important;
}
@media(max-width:719px){
  .reel-card.is-active .action-rail{
    right:max(8px,calc((100vw - min(100vw,460px)) / 2 + 8px))!important;
    top:calc(88px + env(safe-area-inset-top))!important;
    bottom:calc(70px + var(--safe-bottom))!important;
    width:70px!important;
    gap:7px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    max-height:calc(100dvh - 158px - var(--safe-bottom))!important;
  }
  .reel-card.is-active .action,
  .action{width:64px!important;min-height:57px!important;gap:3px!important;}
  .reel-card.is-active .action span,
  .action span{width:45px!important;height:45px!important;min-width:45px!important;min-height:45px!important;}
  .reel-card.is-active .action svg,
  .action svg{width:20px!important;height:20px!important;}
  .reel-card.is-active .action b,
  .action b{width:64px!important;max-width:64px!important;font-size:8.4px!important;line-height:1.06!important;}
  .card-info{right:90px!important;}
}
@media(max-width:390px){
  .reel-card.is-active .action-rail{right:5px!important;top:calc(86px + env(safe-area-inset-top))!important;bottom:calc(66px + var(--safe-bottom))!important;gap:5px!important;width:62px!important;}
  .reel-card.is-active .action,
  .action{width:58px!important;min-height:52px!important;gap:2px!important;}
  .reel-card.is-active .action span,
  .action span{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;}
  .reel-card.is-active .action svg,
  .action svg{width:18px!important;height:18px!important;}
  .reel-card.is-active .action b,
  .action b{width:58px!important;max-width:58px!important;font-size:7.7px!important;line-height:1.05!important;}
  .card-info{right:72px!important;}
}
@media(max-height:690px){
  .reel-card.is-active .action-rail{gap:4px!important;top:calc(76px + env(safe-area-inset-top))!important;bottom:calc(58px + var(--safe-bottom))!important;}
  .reel-card.is-active .action,
  .action{min-height:48px!important;}
  .reel-card.is-active .action span,
  .action span{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;}
  .reel-card.is-active .action b,
  .action b{font-size:7.2px!important;}
}
@media(min-width:720px) and (max-width:1099px){
  .reel-card.is-active .action-rail{width:78px!important;gap:10px!important;}
  .reel-card.is-active .action,
  .action{width:72px!important;min-height:66px!important;}
  .reel-card.is-active .action span,
  .action span{width:52px!important;height:52px!important;min-width:52px!important;min-height:52px!important;}
  .reel-card.is-active .action b,
  .action b{width:72px!important;max-width:72px!important;font-size:9.5px!important;}
}
@media(min-width:1100px){
  .reel-card.is-active .action-rail{width:82px!important;gap:12px!important;}
  .reel-card.is-active .action,
  .action{width:76px!important;min-height:70px!important;}
  .reel-card.is-active .action span,
  .action span{width:54px!important;height:54px!important;min-width:54px!important;min-height:54px!important;}
  .reel-card.is-active .action svg,
  .action svg{width:24px!important;height:24px!important;}
  .reel-card.is-active .action b,
  .action b{width:76px!important;max-width:76px!important;font-size:10px!important;line-height:1.08!important;}
}

/* v65.0.0: country-aware location chip + extra-compact action rail for small devices */
.area-chip.is-gps{
  border-color:rgba(38,244,211,.44)!important;
  background:linear-gradient(180deg,rgba(38,244,211,.12),rgba(255,255,255,.045))!important;
}
.area-chip span:empty::before { content: "Nearby"; }
@media(max-width:719px){
  .reel-card.is-active .action-rail{
    right:max(3px,calc((100vw - min(100vw,460px)) / 2 + 3px))!important;
    top:calc(80px + env(safe-area-inset-top))!important;
    bottom:calc(62px + var(--safe-bottom))!important;
    width:54px!important;
    max-width:54px!important;
    gap:4px!important;
    padding:0!important;
    justify-content:center!important;
    transform:translateX(0)!important;
  }
  .reel-card.is-active .action,
  .action{
    width:52px!important;
    min-height:44px!important;
    gap:1.5px!important;
  }
  .reel-card.is-active .action span,
  .action span{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    min-height:36px!important;
    box-shadow:0 10px 22px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.14)!important;
  }
  .reel-card.is-active .action svg,
  .action svg{
    width:16.5px!important;
    height:16.5px!important;
    stroke-width:2.25!important;
  }
  .reel-card.is-active .action b,
  .action b{
    width:52px!important;
    max-width:52px!important;
    font-size:7px!important;
    line-height:1!important;
    letter-spacing:-.035em!important;
    max-height:14px!important;
    overflow:hidden!important;
  }
  .card-info{right:66px!important;}
}
@media(max-width:390px){
  .reel-card.is-active .action-rail{
    right:2px!important;
    top:calc(76px + env(safe-area-inset-top))!important;
    bottom:calc(58px + var(--safe-bottom))!important;
    width:48px!important;
    gap:3px!important;
  }
  .reel-card.is-active .action,
  .action{width:46px!important;min-height:39px!important;}
  .reel-card.is-active .action span,
  .action span{width:33px!important;height:33px!important;min-width:33px!important;min-height:33px!important;}
  .reel-card.is-active .action svg,
  .action svg{width:15.5px!important;height:15.5px!important;}
  .reel-card.is-active .action b,
  .action b{width:46px!important;max-width:46px!important;font-size:6.5px!important;max-height:13px!important;}
  .card-info{right:56px!important;}
}
@media(max-height:650px), (max-width:360px){
  .reel-card.is-active .action-rail{gap:2px!important;top:calc(72px + env(safe-area-inset-top))!important;bottom:calc(54px + var(--safe-bottom))!important;}
  .reel-card.is-active .action,
  .action{min-height:35px!important;}
  .reel-card.is-active .action span,
  .action span{width:31px!important;height:31px!important;min-width:31px!important;min-height:31px!important;}
  .reel-card.is-active .action svg,
  .action svg{width:14px!important;height:14px!important;}
  .reel-card.is-active .action b,
  .action b{font-size:6px!important;max-height:12px!important;}
}
@media(max-height:575px){
  .reel-card.is-active .action b,
  .action b{display:none!important;}
  .reel-card.is-active .action,
  .action{min-height:34px!important;}
  .reel-card.is-active .action-rail{gap:4px!important;}
}


/* v65.0.0: country-aware location polish + smaller action rail on small devices */
.area-chip.is-gps{
  border-color:rgba(38,244,211,.36)!important;
  box-shadow:0 0 0 1px rgba(38,244,211,.10),0 12px 30px rgba(0,0,0,.18)!important;
}
.area-chip span{
  max-width:154px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
@media(max-width:719px){
  .reel-card.is-active .action-rail{
    right:max(5px,calc((100vw - min(100vw,460px)) / 2 + 5px))!important;
    top:calc(94px + env(safe-area-inset-top))!important;
    bottom:calc(76px + var(--safe-bottom))!important;
    width:52px!important;
    gap:5px!important;
    max-height:calc(100dvh - 170px - var(--safe-bottom))!important;
    overflow-y:auto!important;
    overflow-x:visible!important;
    overscroll-behavior:contain!important;
    scrollbar-width:none!important;
  }
  .reel-card.is-active .action-rail::-webkit-scrollbar{display:none!important;}
  .reel-card.is-active .action,
  .action{
    width:50px!important;
    min-height:44px!important;
    gap:2px!important;
  }
  .reel-card.is-active .action span,
  .action span{
    width:35px!important;
    height:35px!important;
    min-width:35px!important;
    min-height:35px!important;
    box-shadow:0 10px 24px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.14)!important;
  }
  .reel-card.is-active .action svg,
  .action svg{width:17px!important;height:17px!important;stroke-width:2.25!important;}
  .reel-card.is-active .action b,
  .action b{
    width:50px!important;
    max-width:50px!important;
    font-size:6.8px!important;
    line-height:1.02!important;
    letter-spacing:-.04em!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .card-info{right:66px!important;}
}
@media(max-width:390px){
  .reel-card.is-active .action-rail{
    right:3px!important;
    width:44px!important;
    gap:4px!important;
    top:calc(90px + env(safe-area-inset-top))!important;
    bottom:calc(70px + var(--safe-bottom))!important;
  }
  .reel-card.is-active .action,
  .action{width:42px!important;min-height:38px!important;}
  .reel-card.is-active .action span,
  .action span{width:31px!important;height:31px!important;min-width:31px!important;min-height:31px!important;}
  .reel-card.is-active .action svg,
  .action svg{width:15.5px!important;height:15.5px!important;}
  .reel-card.is-active .action b,
  .action b{font-size:6px!important;width:42px!important;max-width:42px!important;}
  .card-info{right:54px!important;}
}
@media(max-height:660px){
  .reel-card.is-active .action-rail{top:calc(72px + env(safe-area-inset-top))!important;bottom:calc(56px + var(--safe-bottom))!important;gap:3px!important;}
  .reel-card.is-active .action,
  .action{min-height:34px!important;}
  .reel-card.is-active .action span,
  .action span{width:29px!important;height:29px!important;min-width:29px!important;min-height:29px!important;}
  .reel-card.is-active .action b,
  .action b{display:none!important;}
}

/* v65.0.1: pocket phones use icon-only rail to keep product media clean */
@media(max-width:480px), (max-height:620px){
  .reel-card.is-active .action-rail{
    width:44px!important;
    right:max(2px,calc((100vw - min(100vw,460px)) / 2 + 2px))!important;
    gap:7px!important;
    top:calc(78px + env(safe-area-inset-top))!important;
    bottom:calc(58px + var(--safe-bottom))!important;
  }
  .reel-card.is-active .action,
  .action{width:42px!important;min-height:36px!important;gap:0!important;}
  .reel-card.is-active .action span,
  .action span{width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;}
  .reel-card.is-active .action svg,
  .action svg{width:15.5px!important;height:15.5px!important;}
  .reel-card.is-active .action b,
  .action b{display:none!important;}
  .card-info{right:50px!important;}
}
.area-chip span:empty::before{content:"Your Country"!important;}

/* v65.0.0: country-aware default location + compact mobile action rail */
@media(max-width:719px){
  .reel-card.is-active .action-rail.has-secondary:not(.is-expanded) .action.rail-secondary{
    display:none!important;
  }
  .reel-card.is-active .action-rail.has-secondary:not(.is-expanded){
    justify-content:center!important;
    gap:8px!important;
  }
  .reel-card.is-active .action-rail.is-expanded{
    justify-content:center!important;
    max-height:calc(100dvh - 120px - var(--safe-bottom))!important;
    overflow:visible!important;
    padding-block:2px!important;
  }
  .reel-card.is-active .action-rail .rail-more span{
    background:rgba(255,255,255,.10)!important;
    border-color:rgba(38,244,211,.40)!important;
  }
  .reel-card.is-active .action-rail:not(.has-secondary) .rail-more{display:none!important;}
}
@media(max-width:390px){
  .reel-card.is-active .action-rail.has-secondary:not(.is-expanded){gap:6px!important;}
  .reel-card.is-active .action-rail.has-secondary:not(.is-expanded) .action{min-height:50px!important;}
}
@media(min-width:720px){
  .reel-card .action-rail .rail-more{display:none!important;}
}

/* v65.0.2: final pocket-device action rail, fewer visible buttons and clean media */
@media(max-width:480px), (max-height:640px){
  .reel-card.is-active .action-rail.has-secondary:not(.is-expanded) .action.rail-secondary{display:none!important;}
  .reel-card.is-active .action-rail.has-secondary:not(.is-expanded) .action.rail-more{display:flex!important;}
  .reel-card.is-active .action-rail.has-secondary:not(.is-expanded){
    width:42px!important;
    right:max(2px,calc((100vw - min(100vw,460px)) / 2 + 2px))!important;
    top:calc(86px + env(safe-area-inset-top))!important;
    bottom:calc(68px + var(--safe-bottom))!important;
    gap:8px!important;
    justify-content:center!important;
    overflow:visible!important;
  }
  .reel-card.is-active .action-rail.has-secondary:not(.is-expanded) .action{width:40px!important;min-height:38px!important;}
  .reel-card.is-active .action-rail.has-secondary:not(.is-expanded) .action span{width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;}
  .reel-card.is-active .action-rail.has-secondary:not(.is-expanded) .action svg{width:15.5px!important;height:15.5px!important;}
  .reel-card.is-active .action-rail.has-secondary:not(.is-expanded) .action b{display:none!important;}
  .reel-card.is-active .action-rail.is-expanded{
    width:48px!important;
    right:max(3px,calc((100vw - min(100vw,460px)) / 2 + 3px))!important;
    top:calc(72px + env(safe-area-inset-top))!important;
    bottom:calc(54px + var(--safe-bottom))!important;
    gap:4px!important;
    overflow-y:auto!important;
    scrollbar-width:none!important;
  }
  .reel-card.is-active .action-rail.is-expanded::-webkit-scrollbar{display:none!important;}
  .reel-card.is-active .action-rail.is-expanded .action{width:46px!important;min-height:40px!important;}
  .reel-card.is-active .action-rail.is-expanded .action span{width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;}
  .reel-card.is-active .action-rail.is-expanded .action b{font-size:6.2px!important;width:46px!important;max-width:46px!important;}
  .card-info{right:52px!important;}
}

/* v70.0.0: professional packages with annual tiers, in-card AI benefits and agent commission flow */
.pricing-grid{align-items:stretch!important}.pricing-plan.revenue-plan-card{min-height:220px!important}.pricing-plan.shop_pro_yearly,.pricing-plan.business_plus_yearly{border-color:rgba(39,244,213,.28)!important;background:radial-gradient(circle at 18% 0,rgba(39,244,213,.18),transparent 34%),linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.035))!important}.pricing-plan.agent_starter{border-color:rgba(255,214,102,.30)!important;background:radial-gradient(circle at 18% 0,rgba(255,214,102,.18),transparent 36%),linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.035))!important}.plan-feature-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:-2px}.plan-feature-pills span{display:inline-flex;align-items:center;min-height:25px;padding:0 9px;border-radius:999px;background:rgba(39,244,213,.12);border:1px solid rgba(39,244,213,.20);color:#eafffb;font-size:10px;font-weight:1000;letter-spacing:-.01em}.pricing-plan.agent_starter .plan-feature-pills span{background:rgba(255,214,102,.12);border-color:rgba(255,214,102,.22)}.agent-commission-box{display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;align-items:start;border:1px solid rgba(39,244,213,.17);border-radius:20px;background:linear-gradient(145deg,rgba(39,244,213,.10),rgba(255,255,255,.04));padding:10px;margin:8px 0}.agent-commission-box>span{width:42px;height:42px;border-radius:16px;display:grid;place-items:center;background:rgba(39,244,213,.13);border:1px solid rgba(39,244,213,.20)}.agent-commission-box svg{width:20px;height:20px;stroke:#eafffb}.agent-commission-box b{display:block;color:#fff;font-size:13px;line-height:1.15}.agent-commission-box small{display:block;color:rgba(255,255,255,.70);font-size:11px;line-height:1.35;margin:3px 0 8px}.agent-commission-box input{width:100%;height:42px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.23);color:#fff;padding:0 12px;text-transform:uppercase;font-weight:900;letter-spacing:.04em}.agent-commission-box input::placeholder{text-transform:none;letter-spacing:0;color:rgba(255,255,255,.52)}@media(max-width:560px){.pricing-plan.revenue-plan-card{min-height:auto!important}.plan-feature-pills span{font-size:9.5px;min-height:24px}.agent-commission-box{grid-template-columns:36px minmax(0,1fr);border-radius:18px}.agent-commission-box>span{width:36px;height:36px;border-radius:14px}}


/* v70 annual packages and agent balance commission polish */
.pricing-plan.shop_pro_yearly,.pricing-plan.business_plus_yearly{position:relative;border-color:rgba(32,242,214,.36)!important;background:linear-gradient(145deg,rgba(32,242,214,.13),rgba(255,255,255,.045))!important;box-shadow:0 18px 44px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.08)!important;}
.pricing-plan.business_plus_yearly{border-color:rgba(255,214,92,.38)!important;background:linear-gradient(145deg,rgba(255,214,92,.11),rgba(32,242,214,.06))!important;}
.pricing-plan.agent_starter{border-color:rgba(32,242,214,.30)!important;background:linear-gradient(145deg,rgba(32,242,214,.10),rgba(255,47,126,.07))!important;}
.plan-agent-line{display:flex;align-items:center;gap:8px;margin:8px 0 2px;padding:8px 10px;border-radius:14px;background:rgba(32,242,214,.10);border:1px solid rgba(32,242,214,.20);color:#dffffa;font-size:12px;line-height:1.25;font-weight:800;}
.plan-agent-line svg{width:16px;height:16px;flex:0 0 16px;color:#27f2d2;}
.agent-commission-box{display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;align-items:start;padding:12px;border-radius:18px;background:linear-gradient(145deg,rgba(32,242,214,.11),rgba(255,255,255,.045));border:1px solid rgba(32,242,214,.18);}
.agent-commission-box>span{width:42px;height:42px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#fff;}
.agent-commission-box b{display:block;color:#fff;font-size:13px;line-height:1.25;}
.agent-commission-box small{display:block;color:rgba(255,255,255,.66);font-size:12px;line-height:1.3;margin:3px 0 8px;}
.agent-commission-box input{width:100%;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.22);color:#fff;border-radius:12px;padding:10px 12px;font-weight:800;text-transform:uppercase;}
@media(max-width:560px){.plan-agent-line{font-size:11px;padding:7px 9px}.agent-commission-box{grid-template-columns:36px minmax(0,1fr);padding:10px}.agent-commission-box>span{width:36px;height:36px;border-radius:14px}}

/* v70.0.1: remove package intro cards and keep AI inside plans */
.package-guide-card,.package-ai-note{display:none!important;}
.pricing-section-title small:empty{display:none!important;}
.pricing-plan .plan-actions{margin-top:auto!important;}


/* v72: one-product gallery + service fee clarity */
.multi-preview small{font-weight:900;color:rgba(218,255,248,.82)!important;letter-spacing:-.01em;white-space:normal!important;line-height:1.2!important}
.post-thumb{position:relative;overflow:hidden}.post-thumb b{background:rgba(0,0,0,.62)!important;color:#fff!important;border:1px solid rgba(255,255,255,.22)!important}
.service-access-note small,.contact-soft-note small{line-height:1.35}

/* v75: unread badges, stronger live entry, host viewer moderation */
.nav-unread-badge{position:absolute;right:6px;top:4px;min-width:18px;height:18px;border-radius:999px;display:grid;place-items:center;padding:0 5px;background:linear-gradient(135deg,#ff2f7e,#ffcf5a);color:#fff;font-size:10px;font-weight:1000;line-height:1;box-shadow:0 8px 20px rgba(255,47,126,.36);z-index:10;font-style:normal}.nav-unread-badge[hidden]{display:none!important}.desktop-nav button,.bottom-nav button,#openInboxBtn,.action.owner-inbox{position:relative}.desktop-nav button.has-unread svg,.bottom-nav button.has-unread svg{filter:drop-shadow(0 0 8px rgba(34,244,214,.45))}.action.owner-inbox .nav-unread-badge{right:-3px;top:-3px}.live-join-card{position:absolute;z-index:7;left:20px;top:92px;display:flex;align-items:center;gap:8px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:linear-gradient(135deg,rgba(255,47,126,.94),rgba(34,244,214,.80));color:#fff;padding:9px 12px;box-shadow:0 14px 34px rgba(0,0,0,.28);font-weight:1000;text-shadow:0 2px 12px rgba(0,0,0,.35)}.live-join-card .live-dot{width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 0 rgba(255,255,255,.75);animation:vcLivePulse 1.15s infinite}.live-join-card small{font-weight:900;color:rgba(255,255,255,.92)}.reel-card.is-live-card .badge.live,.reel-card.is-live-card .badge:first-child{background:linear-gradient(135deg,#ff2f7e,#ffb84c)!important;color:#fff!important}.live-pill.live-red i{display:inline-block;width:8px;height:8px;margin-right:5px;border-radius:50%;background:#fff;box-shadow:0 0 0 0 rgba(255,255,255,.8);animation:vcLivePulse 1.1s infinite;vertical-align:middle}@keyframes vcLivePulse{70%{box-shadow:0 0 0 9px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}.live-host-panel{margin:12px 0;border:1px solid rgba(34,244,214,.18);background:linear-gradient(145deg,rgba(34,244,214,.09),rgba(255,255,255,.04));border-radius:24px;padding:12px}.live-host-panel-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:10px}.live-host-panel-head b{font-size:14px;color:#eafffb}.live-host-panel-head small{font-size:11px;color:rgba(255,255,255,.58);text-align:right}.live-viewer-list{display:grid;gap:8px}.live-viewer-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:9px;align-items:center;text-align:left;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.18);color:#fff;padding:10px}.live-viewer-row span{font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.live-viewer-row small{color:rgba(255,255,255,.55);font-family:ui-monospace,Menlo,monospace}.live-viewer-row b{border-radius:999px;background:rgba(255,47,126,.18);border:1px solid rgba(255,47,126,.24);padding:6px 9px;color:#ffdbe8;font-size:11px}.live-side #liveSwitchCamera{background:linear-gradient(135deg,rgba(34,244,214,.94),rgba(37,238,151,.82))!important;color:#021114!important}.live-wait h3{font-size:clamp(22px,4vw,34px);letter-spacing:-.04em}.live-wait .twin-dots{margin:auto}@media(max-width:520px){.live-join-card{left:14px;top:82px;padding:8px 10px;font-size:12px}.live-host-panel{border-radius:20px}.live-viewer-row{grid-template-columns:minmax(0,1fr) auto}.live-viewer-row small{display:none}.live-viewer-row b{font-size:10px}.nav-unread-badge{right:7px;top:2px}.bottom-nav .nav-unread-badge{right:18px;top:5px}}

/* v76/v77: persistent Vi AI assistant, cleaner home cards and 2-column service directory */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.reel-card.home-title-only .card-info p{display:none!important}
.reel-card.home-title-only .card-info{gap:8px!important}
.reel-card.home-title-only .tag-line{margin-top:2px!important}
.vi-ai-dock{position:fixed;z-index:75;left:50%;bottom:calc(72px + var(--safe-bottom));transform:translateX(-50%);width:min(94vw,430px);display:grid;grid-template-columns:48px minmax(0,1fr);gap:9px;align-items:end;pointer-events:none}
.vi-ai-dock>*{pointer-events:auto}.vi-ai-orb{width:48px;height:48px;border-radius:18px;border:1px solid rgba(43,244,218,.45);background:radial-gradient(circle at 35% 18%,rgba(255,255,255,.85),rgba(43,244,218,.76) 25%,rgba(255,47,126,.48) 72%,rgba(3,7,12,.94));box-shadow:0 14px 34px rgba(0,0,0,.42),0 0 28px rgba(34,244,214,.22);color:#001615;font-weight:1000;letter-spacing:-.04em;text-shadow:0 1px 0 rgba(255,255,255,.52)}
.vi-ai-search{height:50px;display:grid;grid-template-columns:minmax(0,1fr) 42px;gap:7px;padding:5px;border-radius:20px;background:rgba(5,9,14,.72);border:1px solid rgba(255,255,255,.13);box-shadow:0 16px 42px rgba(0,0,0,.40),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(24px)}
.vi-ai-search input{width:100%;min-width:0;height:40px;border:0!important;background:transparent!important;color:#fff!important;padding:0 11px!important;font-size:13px!important;font-weight:850!important;outline:none}.vi-ai-search input::placeholder{color:rgba(234,255,250,.62)}
.vi-ai-search button{width:42px;height:40px;border-radius:16px;border:0;background:linear-gradient(135deg,#28f4d4,#33ef96);color:#02110f;font-weight:1000;box-shadow:0 10px 24px rgba(34,244,214,.22)}.vi-ai-search button:disabled{opacity:.72;filter:saturate(.7)}
.vi-ai-mini-panel{grid-column:1/-1;order:-1;max-height:min(42dvh,360px);overflow:auto;border-radius:26px;background:linear-gradient(160deg,rgba(5,9,14,.94),rgba(14,24,28,.90));border:1px solid rgba(43,244,218,.20);box-shadow:0 24px 80px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.08);padding:12px;backdrop-filter:blur(26px);display:grid;gap:10px}.vi-ai-mini-panel.hidden{display:none!important}
.vi-ai-panel-head,.vi-ai-loading{display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;align-items:start}.vi-ai-panel-head b,.vi-ai-loading b{display:block;color:#fff;font-size:14px;letter-spacing:-.03em;line-height:1.15}.vi-ai-panel-head small,.vi-ai-loading small{display:block;margin-top:3px;color:rgba(234,255,250,.72);font-size:12px;line-height:1.35}.vi-ai-loading .twin-dots{margin-top:7px}
.vi-ai-pills,.vi-ai-notes{display:flex;gap:7px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}.vi-ai-pills::-webkit-scrollbar,.vi-ai-notes::-webkit-scrollbar{display:none}.vi-ai-pills button,.vi-ai-notes button{flex:0 0 auto;border-radius:999px;border:1px solid rgba(43,244,218,.20);background:rgba(43,244,218,.10);color:#eafffb;padding:8px 10px;font-size:11px;font-weight:900}.vi-ai-notes button{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);color:rgba(255,255,255,.88)}
.vi-ai-results{display:grid;gap:8px}.vi-ai-results .result-card{border-radius:18px;padding:8px;background:rgba(255,255,255,.075);border:1px solid rgba(255,255,255,.11)}.vi-ai-results .result-card img{width:44px;height:44px;border-radius:14px;object-fit:cover}.vi-ai-results .result-card strong{font-size:13px}.vi-ai-results .result-card span span{font-size:11px;color:rgba(255,255,255,.62)}
.directory-list.service-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}.directory-list.service-grid .dir-card{min-width:0!important;grid-template-columns:50px minmax(0,1fr)!important;grid-template-rows:auto auto!important;gap:9px!important;padding:10px!important;border-radius:22px!important;align-items:start!important}.directory-list.service-grid .avatar-wrap{width:50px!important;height:50px!important}.directory-list.service-grid .dir-card strong{font-size:13px!important;line-height:1.12!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}.directory-list.service-grid .dir-card span,.directory-list.service-grid .dir-card em{font-size:10.5px!important;max-width:100%!important;line-height:1.2!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}.directory-list.service-grid .dir-actions{grid-column:1/-1!important;display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important;width:100%!important}.directory-list.service-grid .dir-actions button{width:100%!important;height:34px!important;border-radius:13px!important}.directory-list.service-grid .service-card-meta{grid-column:1/-1!important;display:flex!important;flex-wrap:wrap!important;gap:5px!important;margin-top:5px!important}.directory-list.service-grid .service-rank-pill,.directory-list.service-grid .service-ai-pill{font-size:9px!important;padding:4px 6px!important}
@media(min-width:721px){.vi-ai-dock{bottom:24px;left:calc(50% + 64px);width:min(520px,42vw);grid-template-columns:52px minmax(0,1fr)}.vi-ai-orb{width:52px;height:52px;border-radius:20px}.vi-ai-search{height:54px;grid-template-columns:minmax(0,1fr) 46px}.vi-ai-search input{height:44px;font-size:14px!important}.vi-ai-search button{width:46px;height:44px}.vi-ai-mini-panel{max-height:420px}.directory-list.service-grid{grid-template-columns:repeat(2,minmax(260px,1fr))!important;max-width:840px}}
@media(max-width:430px){.vi-ai-dock{width:calc(100vw - 16px);grid-template-columns:42px minmax(0,1fr);gap:7px;bottom:calc(68px + var(--safe-bottom))}.vi-ai-orb{width:42px;height:42px;border-radius:16px;font-size:12px}.vi-ai-search{height:46px;border-radius:18px;grid-template-columns:minmax(0,1fr) 38px}.vi-ai-search input{height:36px;font-size:12px!important;padding-inline:8px!important}.vi-ai-search button{width:38px;height:36px;border-radius:14px}.vi-ai-mini-panel{border-radius:22px;max-height:36dvh;padding:10px}.vi-ai-panel-head,.vi-ai-loading{grid-template-columns:36px minmax(0,1fr)}.directory-list.service-grid{gap:8px!important}.directory-list.service-grid .dir-card{padding:8px!important;border-radius:18px!important;grid-template-columns:44px minmax(0,1fr)!important}.directory-list.service-grid .avatar-wrap{width:44px!important;height:44px!important}.directory-list.service-grid .dir-actions button{height:31px!important}.directory-list.service-grid .dir-card strong{font-size:12px!important}.directory-list.service-grid .dir-card span,.directory-list.service-grid .dir-card em{font-size:9.8px!important}}
@media(max-height:650px){.vi-ai-dock{bottom:calc(56px + var(--safe-bottom))}.vi-ai-mini-panel{max-height:32dvh}.reel-card.home-title-only .tag-line{display:none!important}}


/* v77: professional compact quick tools + clean bottom Vi AI composer */
body:has(dialog[open]) .topbar .tiny-ai{display:none!important;}
body:has(dialog[open]) .topbar{z-index:20!important;}
.sheet[open]{z-index:180!important;}
.sheet-card .sheet-title{position:relative!important;z-index:185!important;}
.sheet-title .xbtn{z-index:190!important;}
.location-row{position:relative!important;overflow:visible!important;}
.ghost-dot.action-menu-trigger{margin-left:auto!important;flex:0 0 42px!important;width:42px!important;min-width:42px!important;height:42px!important;padding:0!important;display:grid!important;grid-template-columns:1fr!important;place-items:center!important;gap:0!important;background:linear-gradient(135deg,rgba(37,238,151,.18),rgba(24,243,238,.10))!important;border-color:rgba(37,238,151,.30)!important;box-shadow:0 10px 28px rgba(37,238,151,.12),inset 0 1px 0 rgba(255,255,255,.10)!important;}
.ghost-dot.action-menu-trigger span{display:none!important;}
.ghost-dot.action-menu-trigger i{display:block!important;width:5px!important;height:5px!important;border-radius:999px!important;background:#25ee97!important;box-shadow:0 0 12px rgba(37,238,151,.8)!important;margin:1.4px 0!important;}
.ghost-dot.action-menu-trigger b{position:absolute!important;overflow:hidden!important;width:1px!important;height:1px!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;}
.ghost-dot.action-menu-trigger.is-open{background:linear-gradient(135deg,#28f4d4,#33ef96)!important;border-color:rgba(255,255,255,.28)!important;color:#001b18!important;}
.ghost-dot.action-menu-trigger.is-open i{background:#06100e!important;box-shadow:none!important;}
.vi-radar-bar{display:none!important;position:absolute!important;z-index:95!important;right:12px!important;top:calc(100% + 8px)!important;width:min(260px,calc(100vw - 24px))!important;padding:8px!important;margin:0!important;border-radius:24px!important;background:linear-gradient(160deg,rgba(5,9,14,.96),rgba(15,26,30,.94))!important;border:1px solid rgba(43,244,218,.22)!important;box-shadow:0 22px 70px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.08)!important;backdrop-filter:blur(24px)!important;grid-template-columns:1fr!important;gap:8px!important;overflow:visible!important;}
.vi-radar-bar.is-open{display:grid!important;animation:vcQuickMenu .16s ease-out both!important;}
.vi-radar-bar button{width:100%!important;min-width:0!important;min-height:48px!important;display:grid!important;grid-template-columns:34px minmax(0,1fr)!important;align-items:center!important;gap:9px!important;padding:8px 10px!important;border-radius:18px!important;text-align:left!important;flex:initial!important;scroll-snap-align:initial!important;}
.vi-radar-bar button span{width:32px!important;height:32px!important;font-size:15px!important;grid-row:span 2!important;}
.vi-radar-bar button b{font-size:12px!important;line-height:1.1!important;}
.vi-radar-bar button small{display:block!important;font-size:9.5px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;color:rgba(234,255,250,.68)!important;}
@keyframes vcQuickMenu{from{opacity:0;transform:translateY(-5px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
.vi-ai-dock{z-index:96!important;width:min(94vw,520px)!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important;align-items:end!important;}
.vi-ai-orb{display:none!important;}
.vi-ai-search{position:relative!important;z-index:3!important;grid-column:1/-1!important;border-radius:23px!important;background:linear-gradient(180deg,rgba(5,9,14,.92),rgba(8,16,20,.88))!important;border-color:rgba(43,244,218,.20)!important;box-shadow:0 16px 45px rgba(0,0,0,.50),0 0 0 1px rgba(255,255,255,.045),inset 0 1px 0 rgba(255,255,255,.10)!important;}
.vi-ai-mini-panel{position:relative!important;z-index:2!important;grid-column:1/-1!important;margin:0 0 8px!important;max-height:min(34dvh,330px)!important;padding:12px 12px 14px!important;overscroll-behavior:contain!important;}
.vi-ai-mini-panel .vi-ai-pills,.vi-ai-mini-panel .vi-ai-notes{max-width:100%!important;mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 24px),transparent)!important;}
.vi-ai-panel-head.no-match{background:rgba(43,244,218,.06)!important;border:1px solid rgba(43,244,218,.12)!important;border-radius:20px!important;padding:10px!important;}
.vi-ai-results .primary.wide,.vi-ai-results .soft.wide{width:100%!important;min-height:42px!important;border-radius:16px!important;font-weight:950!important;}
@media(max-width:520px){.vi-radar-bar{right:8px!important;top:calc(100% + 7px)!important;width:min(232px,calc(100vw - 16px))!important;border-radius:22px!important}.vi-radar-bar button{min-height:46px!important;padding:8px!important}.vi-ai-dock{bottom:calc(76px + var(--safe-bottom))!important;width:calc(100vw - 18px)!important}.vi-ai-mini-panel{max-height:31dvh!important;border-radius:22px!important}.vi-ai-search input{font-size:13px!important}.vi-ai-search button{font-size:18px!important}}
@media(max-height:650px){.vi-ai-mini-panel{max-height:27dvh!important}.vi-ai-dock{bottom:calc(64px + var(--safe-bottom))!important}}


/* v78: Story placement, lower AI dock, white tools dots and professional service covers */
.story-strip{top:calc(142px + env(safe-area-inset-top))!important;padding:4px 13px 7px!important;z-index:58!important;background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,0))!important;}
.story-pill{width:64px!important;gap:4px!important}.story-pill .story-ring{width:52px!important;height:52px!important}.story-pill span{font-size:9.5px!important;color:#fff!important;text-shadow:0 2px 10px rgba(0,0,0,.75)!important}
.quick-tools-dot::before{color:#ffffff!important;text-shadow:0 2px 10px rgba(0,0,0,.55)!important;letter-spacing:.12em!important;font-size:16px!important;}
.quick-tools-dot.is-open::before{color:#06100f!important;text-shadow:0 1px 0 rgba(255,255,255,.32)!important;}
.ghost-dot.action-menu-trigger i{background:#ffffff!important;box-shadow:0 0 10px rgba(255,255,255,.72)!important;}
.ghost-dot.action-menu-trigger.is-open i{background:#06100e!important;box-shadow:none!important;}
.vi-ai-dock{bottom:calc(72px + var(--safe-bottom))!important;width:calc(100vw - 20px)!important;max-width:440px!important;}
.vi-ai-search{height:44px!important;border-radius:18px!important;padding:4px!important;grid-template-columns:minmax(0,1fr) 38px!important;}
.vi-ai-search input{height:36px!important;font-size:12.8px!important;padding-left:10px!important;}
.vi-ai-search button{width:38px!important;height:36px!important;border-radius:14px!important;font-size:18px!important;}
.vi-ai-mini-panel{margin-bottom:6px!important;max-height:32dvh!important;}
.feed{padding-bottom:calc(138px + var(--safe-bottom))!important;}
.directory{padding-bottom:calc(138px + var(--safe-bottom))!important;}
.service-cover-editor{display:grid!important;grid-template-columns:86px minmax(0,1fr)!important;gap:10px!important;align-items:center!important;border-radius:22px!important;padding:10px!important;background:linear-gradient(135deg,rgba(34,244,214,.08),rgba(255,255,255,.05))!important;border:1px solid rgba(34,244,214,.18)!important;color:#fff!important;cursor:pointer!important;}
.service-cover-preview{width:86px!important;height:58px!important;border-radius:17px!important;overflow:hidden!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.12)!important;}
.service-cover-preview img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;}
.service-cover-editor b{font-size:13px!important;line-height:1.1!important;}.service-cover-editor small{display:block!important;margin-top:3px!important;color:rgba(255,255,255,.62)!important;font-size:10.5px!important;line-height:1.2!important;}
.directory-list.service-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;align-items:stretch!important;}
.directory-list.service-grid .service-worker-card.has-service-cover{display:grid!important;grid-template-columns:38px minmax(0,1fr)!important;grid-template-rows:auto auto auto!important;gap:7px!important;padding:7px!important;border-radius:20px!important;min-width:0!important;overflow:hidden!important;background:linear-gradient(155deg,rgba(11,23,27,.94),rgba(255,255,255,.055))!important;border-color:rgba(34,244,214,.22)!important;}
.directory-list.service-grid .service-card-cover{grid-column:1/-1!important;width:100%!important;aspect-ratio:16/10!important;border-radius:16px!important;overflow:hidden!important;background:#0b1114!important;border:1px solid rgba(255,255,255,.11)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;}
.directory-list.service-grid .service-card-cover img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;filter:saturate(1.05) contrast(1.02)!important;}
.directory-list.service-grid .avatar-wrap{width:38px!important;height:38px!important;border-radius:15px!important;align-self:start!important;}
.directory-list.service-grid .avatar-wrap img{border-radius:13px!important;border-width:1px!important;}
.directory-list.service-grid .dir-main{min-width:0!important;}
.directory-list.service-grid .dir-card strong{font-size:12.2px!important;line-height:1.08!important;letter-spacing:-.03em!important;-webkit-line-clamp:2!important;}
.directory-list.service-grid .dir-card span,.directory-list.service-grid .dir-card em{font-size:9.5px!important;line-height:1.18!important;max-width:100%!important;-webkit-line-clamp:2!important;color:rgba(255,255,255,.66)!important;}
.directory-list.service-grid .service-card-meta{grid-column:1/-1!important;margin-top:0!important;gap:4px!important;}
.directory-list.service-grid .service-rank-pill,.directory-list.service-grid .service-ai-pill{font-size:8.4px!important;padding:3px 5px!important;}
.directory-list.service-grid .dir-actions{grid-column:1/-1!important;display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:5px!important;width:100%!important;}
.directory-list.service-grid .dir-actions button{height:30px!important;border-radius:12px!important;width:100%!important;background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.10)!important;}
.directory-list.service-grid .dir-actions svg{width:16px!important;height:16px!important;}
@media(max-width:380px){.story-strip{top:calc(136px + env(safe-area-inset-top))!important}.story-pill .story-ring{width:48px!important;height:48px!important}.vi-ai-dock{bottom:calc(69px + var(--safe-bottom))!important}.directory-list.service-grid{gap:7px!important}.directory-list.service-grid .service-worker-card.has-service-cover{padding:6px!important;border-radius:18px!important;grid-template-columns:34px minmax(0,1fr)!important}.directory-list.service-grid .avatar-wrap{width:34px!important;height:34px!important}.directory-list.service-grid .dir-card strong{font-size:11.5px!important}.directory-list.service-grid .dir-card span,.directory-list.service-grid .dir-card em{font-size:8.8px!important}.directory-list.service-grid .dir-actions button{height:28px!important}}
@media(min-width:721px){.story-strip{top:126px!important}.vi-ai-dock{bottom:22px!important;width:min(560px,42vw)!important}.directory-list.service-grid{grid-template-columns:repeat(2,minmax(260px,1fr))!important;max-width:860px!important}.directory-list.service-grid .service-card-cover{aspect-ratio:16/8!important}}
@media(max-height:650px){.story-strip{top:calc(128px + env(safe-area-inset-top))!important}.vi-ai-dock{bottom:calc(62px + var(--safe-bottom))!important}.vi-ai-search{height:42px!important}.feed{padding-bottom:calc(124px + var(--safe-bottom))!important}}

/* v78: raised Story strip, lower AI composer, white tools dots and professional service covers */
.story-strip{
  top:calc(142px + env(safe-area-inset-top))!important;
  left:10px!important;
  right:76px!important;
  padding:4px 4px!important;
  gap:8px!important;
  background:linear-gradient(90deg,rgba(3,7,10,.18),rgba(3,7,10,0))!important;
  z-index:58!important;
  border-radius:22px!important;
  pointer-events:auto!important;
}
.story-pill{width:54px!important;gap:3px!important;filter:drop-shadow(0 8px 18px rgba(0,0,0,.32))!important}
.story-pill .story-ring{width:46px!important;height:46px!important;background:rgba(255,255,255,.12)!important;border:1px solid rgba(255,255,255,.25)!important;box-shadow:0 10px 24px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.28)!important;backdrop-filter:blur(12px)!important}
.story-pill.add-story .story-ring{background:rgba(255,255,255,.16)!important;border-style:solid!important;color:#fff!important}
.story-pill span{max-width:54px!important;font-size:8.7px!important;line-height:1.05!important;color:#fff!important;text-shadow:0 3px 10px rgba(0,0,0,.78)!important}
.ghost-dot.action-menu-trigger{background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.20)!important;box-shadow:0 12px 28px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.14)!important;color:#fff!important}
.ghost-dot.action-menu-trigger i{background:#fff!important;width:5px!important;height:5px!important;box-shadow:0 0 10px rgba(255,255,255,.72)!important}
.ghost-dot.action-menu-trigger.is-open{background:linear-gradient(135deg,rgba(34,244,214,.92),rgba(37,238,151,.88))!important;border-color:rgba(255,255,255,.28)!important}
.ghost-dot.action-menu-trigger.is-open i{background:#04201c!important;box-shadow:none!important}
.vi-ai-dock{bottom:calc(62px + var(--safe-bottom))!important;width:min(92vw,480px)!important;z-index:88!important}
.vi-ai-search{height:44px!important;border-radius:18px!important;padding:4px!important;background:linear-gradient(180deg,rgba(5,9,14,.92),rgba(5,12,15,.88))!important;box-shadow:0 12px 38px rgba(0,0,0,.44),inset 0 1px 0 rgba(255,255,255,.08)!important}
.vi-ai-search input{height:34px!important;font-size:12.5px!important;padding-left:10px!important}
.vi-ai-search button{width:36px!important;height:34px!important;border-radius:14px!important;font-size:18px!important}
.vi-ai-mini-panel{margin-bottom:6px!important;max-height:30dvh!important}
.bottom-nav{z-index:96!important}.feed{padding-bottom:calc(142px + var(--safe-bottom))!important}.directory{padding-bottom:calc(142px + var(--safe-bottom))!important}
@media(max-width:430px){
  .story-strip{top:calc(136px + env(safe-area-inset-top))!important;left:12px!important;right:84px!important}
  .story-pill{width:50px!important}.story-pill .story-ring{width:42px!important;height:42px!important}.story-pill span{font-size:8px!important;max-width:50px!important}
  .vi-ai-dock{bottom:calc(60px + var(--safe-bottom))!important;width:calc(100vw - 22px)!important}
  .vi-ai-search{height:42px!important}.vi-ai-search input{height:32px!important}.vi-ai-search button{height:32px!important;width:34px!important}
  .reel-card.home-title-only .card-info{bottom:calc(138px + var(--safe-bottom))!important;right:74px!important}
  .reel-card.home-title-only .card-info h1{font-size:clamp(26px,8.4vw,36px)!important;max-height:76px!important}
}
@media(max-height:650px){.story-strip{top:calc(128px + env(safe-area-inset-top))!important}.vi-ai-dock{bottom:calc(54px + var(--safe-bottom))!important}.reel-card.home-title-only .card-info{bottom:calc(124px + var(--safe-bottom))!important}}
.service-cover-picker{display:grid!important;grid-template-columns:82px minmax(0,1fr)!important;gap:10px!important;align-items:center!important;padding:10px!important;border-radius:20px!important;border:1px solid rgba(34,244,214,.18)!important;background:linear-gradient(135deg,rgba(34,244,214,.08),rgba(255,255,255,.045))!important;cursor:pointer!important;color:#fff!important}
.service-cover-picker>span:first-of-type{width:82px;height:58px;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.07);display:block!important}
.service-cover-picker img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}.service-cover-picker b{display:block!important;font-size:12px!important;line-height:1.15!important}.service-cover-picker small{display:block!important;color:rgba(234,255,250,.68)!important;font-size:10.5px!important;line-height:1.25!important;margin-top:3px!important}
.directory-list.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;width:100%!important;max-width:100%!important}.directory-list.service-grid .service-cover-card{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;padding:8px!important;border-radius:24px!important;overflow:hidden!important;background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(7,18,22,.74))!important;border:1px solid rgba(34,244,214,.20)!important;box-shadow:0 18px 42px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.09)!important}.directory-list.service-grid .service-cover-card::after{display:none!important}.directory-list.service-grid .dir-cover{height:94px!important;border-radius:18px!important;overflow:hidden!important;background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.10)!important}.directory-list.service-grid .dir-cover img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}.directory-list.service-grid .dir-service-body{display:grid!important;grid-template-columns:42px minmax(0,1fr)!important;gap:8px!important;align-items:start!important}.directory-list.service-grid .service-cover-card .avatar-wrap{width:42px!important;height:42px!important;border-radius:15px!important}.directory-list.service-grid .service-cover-card strong{font-size:12.5px!important;line-height:1.08!important;-webkit-line-clamp:2!important}.directory-list.service-grid .service-cover-card span,.directory-list.service-grid .service-cover-card em{font-size:9.8px!important;line-height:1.18!important}.directory-list.service-grid .service-cover-card em{-webkit-line-clamp:2!important;color:rgba(234,255,250,.68)!important}.directory-list.service-grid .service-cover-card .service-card-meta{display:flex!important;gap:5px!important;flex-wrap:wrap!important;margin:0!important}.directory-list.service-grid .service-cover-card .dir-actions{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important}.directory-list.service-grid .service-cover-card .dir-actions button{height:32px!important;border-radius:14px!important}.directory-list.service-grid .service-rank-pill,.directory-list.service-grid .service-ai-pill{font-size:8.6px!important;padding:4px 6px!important}
@media(min-width:721px){.directory-list.service-grid{grid-template-columns:repeat(2,minmax(280px,1fr))!important;max-width:860px!important}.directory-list.service-grid .dir-cover{height:118px!important}.vi-ai-dock{bottom:22px!important}.story-strip{top:116px!important;left:calc(50vw - 316px)!important;right:auto!important;width:min(380px,32vw)!important}}

/* v78 final polish: service cover picker aliases and clear service-card cover badges */
.profile-cover-editor{
  display:grid!important;
  grid-template-columns:82px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:center!important;
  padding:10px!important;
  border-radius:20px!important;
  border:1px solid rgba(34,244,214,.18)!important;
  background:linear-gradient(135deg,rgba(34,244,214,.08),rgba(255,255,255,.045))!important;
  cursor:pointer!important;
  color:#fff!important;
}
.profile-cover-editor .cover-preview{width:82px;height:58px;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.07);display:block!important;grid-row:span 2!important}
.profile-cover-editor img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}
.profile-cover-editor b{display:block!important;font-size:12px!important;line-height:1.15!important;align-self:end!important}
.profile-cover-editor small{display:block!important;color:rgba(234,255,250,.68)!important;font-size:10.5px!important;line-height:1.25!important;align-self:start!important}
.directory-list.service-grid .service-cover-badge{position:absolute!important;left:8px!important;top:8px!important;border-radius:999px!important;padding:4px 7px!important;background:rgba(2,8,12,.72)!important;border:1px solid rgba(255,255,255,.14)!important;color:#eafffb!important;font-size:8px!important;font-weight:1000!important;text-transform:uppercase!important;letter-spacing:.04em!important;backdrop-filter:blur(12px)!important}
.directory-list.service-grid .dir-cover{position:relative!important}
@media(max-width:430px){
  .profile-cover-editor{grid-template-columns:72px minmax(0,1fr)!important;padding:9px!important;border-radius:18px!important}
  .profile-cover-editor .cover-preview{width:72px!important;height:52px!important;border-radius:14px!important}
  .directory-list.service-grid .dir-cover{height:82px!important;border-radius:16px!important}
}


/* v78.0.1: final mobile polish requested: Story higher, AI composer lower, white tools dots, service covers in 2 columns */
@media(max-width:720px){
  .story-strip{top:calc(132px + env(safe-area-inset-top))!important;padding-top:2px!important;z-index:70!important;}
  .story-pill .story-ring{box-shadow:0 14px 30px rgba(0,0,0,.38),0 0 0 1px rgba(255,255,255,.16)!important;}
  .vi-ai-dock{bottom:calc(58px + var(--safe-bottom))!important;width:calc(100vw - 22px)!important;max-width:460px!important;z-index:92!important;}
  .vi-ai-search{height:44px!important;border-radius:19px!important;background:linear-gradient(180deg,rgba(4,9,13,.94),rgba(4,12,15,.91))!important;box-shadow:0 10px 30px rgba(0,0,0,.38),0 0 0 1px rgba(42,244,218,.12)!important;}
  .vi-ai-search input{height:36px!important;font-size:12.5px!important;}
  .vi-ai-search button{height:36px!important;width:38px!important;border-radius:15px!important;}
  .vi-ai-mini-panel{max-height:29dvh!important;margin-bottom:6px!important;}
  .feed{padding-bottom:calc(118px + var(--safe-bottom))!important;}
}
@media(max-height:650px){
  .story-strip{top:calc(120px + env(safe-area-inset-top))!important;}
  .vi-ai-dock{bottom:calc(50px + var(--safe-bottom))!important;}
  .vi-ai-search{height:42px!important;}
}
.ghost-dot.action-menu-trigger{background:rgba(255,255,255,.065)!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:0 12px 28px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.14)!important;}
.ghost-dot.action-menu-trigger i{background:#fff!important;width:5px!important;height:5px!important;box-shadow:0 0 10px rgba(255,255,255,.80)!important;}
.ghost-dot.action-menu-trigger.is-open{background:linear-gradient(135deg,#f4fffd,#c9fff4)!important;border-color:rgba(255,255,255,.55)!important;}
.ghost-dot.action-menu-trigger.is-open i{background:#08211e!important;}
.directory-list.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;align-items:stretch!important;}
.directory-list.service-grid .dir-card.service-cover-card{display:grid!important;grid-template-columns:1fr!important;grid-template-rows:auto auto auto!important;padding:0!important;overflow:hidden!important;min-width:0!important;border-radius:22px!important;background:linear-gradient(165deg,rgba(11,21,26,.96),rgba(17,31,35,.92))!important;border:1px solid rgba(43,244,218,.20)!important;box-shadow:0 16px 38px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.08)!important;}
.directory-list.service-grid .dir-card.service-cover-card .service-cover{position:relative!important;display:block!important;width:100%!important;aspect-ratio:1.45/1!important;overflow:hidden!important;border-radius:0!important;margin:0!important;background:#071014!important;}
.directory-list.service-grid .dir-card.service-cover-card .service-cover img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;filter:saturate(1.06) contrast(1.04)!important;}
.directory-list.service-grid .dir-card.service-cover-card .service-cover::after{content:"";position:absolute;inset:auto 0 0;height:48%;background:linear-gradient(180deg,transparent,rgba(0,0,0,.52));pointer-events:none;}
.directory-list.service-grid .service-cover-badge{position:absolute!important;left:7px!important;top:7px!important;z-index:2!important;max-width:calc(100% - 14px)!important;padding:4px 7px!important;border-radius:999px!important;background:rgba(31,244,216,.92)!important;color:#031716!important;font-size:8.5px!important;font-weight:1000!important;letter-spacing:-.02em!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.directory-list.service-grid .service-card-body{display:grid!important;grid-template-columns:34px minmax(0,1fr)!important;gap:8px!important;align-items:start!important;padding:8px 8px 5px!important;min-width:0!important;}
.directory-list.service-grid .service-card-body .avatar-wrap{width:34px!important;height:34px!important;border-radius:14px!important;box-shadow:0 8px 18px rgba(0,0,0,.28)!important;}
.directory-list.service-grid .service-card-copy{min-width:0!important;display:grid!important;gap:2px!important;}
.directory-list.service-grid .service-card-copy strong{font-size:12px!important;line-height:1.08!important;color:#fff!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;}
.directory-list.service-grid .service-card-copy span,.directory-list.service-grid .service-card-copy em{font-size:9.2px!important;line-height:1.18!important;color:rgba(237,255,252,.68)!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;}
.directory-list.service-grid .dir-card.service-cover-card .service-card-meta{display:flex!important;gap:4px!important;flex-wrap:wrap!important;margin-top:3px!important;}
.directory-list.service-grid .dir-card.service-cover-card .dir-actions{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:5px!important;padding:0 8px 8px!important;width:100%!important;}
.directory-list.service-grid .dir-card.service-cover-card .dir-actions button{height:30px!important;min-height:30px!important;width:100%!important;border-radius:12px!important;background:rgba(255,255,255,.075)!important;border:1px solid rgba(255,255,255,.10)!important;}
.directory-list.service-grid .dir-card.service-cover-card .dir-actions svg{width:15.5px!important;height:15.5px!important;}
@media(max-width:380px){
  .directory-list.service-grid{gap:8px!important;}
  .directory-list.service-grid .dir-card.service-cover-card{border-radius:19px!important;}
  .directory-list.service-grid .service-card-body{grid-template-columns:30px minmax(0,1fr)!important;gap:6px!important;padding:7px 7px 4px!important;}
  .directory-list.service-grid .service-card-body .avatar-wrap{width:30px!important;height:30px!important;}
  .directory-list.service-grid .service-card-copy strong{font-size:11.2px!important;}
  .directory-list.service-grid .service-card-copy span,.directory-list.service-grid .service-card-copy em{font-size:8.4px!important;}
  .directory-list.service-grid .dir-card.service-cover-card .dir-actions{gap:4px!important;padding:0 7px 7px!important;}
  .directory-list.service-grid .dir-card.service-cover-card .dir-actions button{height:28px!important;}
}
@media(min-width:721px){
  .directory-list.service-grid .dir-card.service-cover-card .service-cover{aspect-ratio:16/8.5!important;}
  .directory-list.service-grid .service-card-body{grid-template-columns:42px minmax(0,1fr)!important;padding:10px 10px 6px!important;}
  .directory-list.service-grid .service-card-body .avatar-wrap{width:42px!important;height:42px!important;}
  .directory-list.service-grid .service-card-copy strong{font-size:14px!important;}
}


/* v78.0.2: quick tools popover and service cover class compatibility */
.quick-tools-popover:not(.hidden){display:block!important;}
.quick-tools-popover .vi-radar-bar{position:static!important;display:grid!important;width:100%!important;}
.directory-list.service-grid .service-cover-card .service-cover{height:94px!important;border-radius:18px!important;overflow:hidden!important;background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.10)!important;position:relative!important;}
.directory-list.service-grid .service-cover-card .service-cover img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;}
.directory-list.service-grid .service-cover-badge{position:absolute!important;left:8px!important;top:8px!important;padding:5px 7px!important;border-radius:999px!important;background:rgba(2,8,11,.62)!important;border:1px solid rgba(255,255,255,.16)!important;color:#fff!important;font-size:8px!important;font-weight:1000!important;text-transform:uppercase!important;letter-spacing:.04em!important;}
.directory-list.service-grid .service-card-body{display:grid!important;grid-template-columns:42px minmax(0,1fr)!important;gap:8px!important;align-items:start!important;}
.directory-list.service-grid .service-card-copy{min-width:0!important;}
@media(min-width:721px){.directory-list.service-grid .service-cover-card .service-cover{height:118px!important;}}


/* v78.0.1 final polish: high story lane, low AI composer, white tools dots and service cover cards */
.profile-cover-editor,.service-cover-editor{display:grid!important;grid-template-columns:86px minmax(0,1fr)!important;gap:10px!important;align-items:center!important;border-radius:22px!important;padding:10px!important;background:linear-gradient(135deg,rgba(34,244,214,.08),rgba(255,255,255,.05))!important;border:1px solid rgba(34,244,214,.18)!important;color:#fff!important;cursor:pointer!important;}
.profile-cover-editor .cover-preview,.service-cover-preview{width:86px!important;height:58px!important;border-radius:17px!important;overflow:hidden!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.12)!important;display:block!important;}
.profile-cover-editor img,.service-cover-preview img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;}
.profile-cover-editor b,.service-cover-editor b{font-size:13px!important;line-height:1.1!important;}.profile-cover-editor small,.service-cover-editor small{display:block!important;margin-top:3px!important;color:rgba(255,255,255,.62)!important;font-size:10.5px!important;line-height:1.2!important;}
.story-strip{top:calc(116px + env(safe-area-inset-top))!important;left:12px!important;right:84px!important;padding:4px 3px!important;gap:8px!important;z-index:62!important;background:linear-gradient(90deg,rgba(0,0,0,.18),rgba(0,0,0,0))!important;border-radius:22px!important;}
.story-pill{width:50px!important;gap:3px!important}.story-pill .story-ring{width:42px!important;height:42px!important;background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.26)!important;box-shadow:0 8px 20px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.26)!important}.story-pill span{max-width:50px!important;font-size:8px!important;line-height:1.05!important;}
.quick-tools-dot::before,.ghost-dot.action-menu-trigger i{color:#fff!important;background:#fff!important;text-shadow:0 2px 10px rgba(0,0,0,.62)!important;box-shadow:0 0 10px rgba(255,255,255,.68)!important}.quick-tools-dot.is-open::before{color:#041614!important;background:transparent!important;box-shadow:none!important;}
.vi-ai-dock{bottom:calc(54px + var(--safe-bottom))!important;width:calc(100vw - 26px)!important;max-width:450px!important;z-index:86!important}.vi-ai-search{height:40px!important;border-radius:17px!important;padding:4px!important;grid-template-columns:minmax(0,1fr) 34px!important}.vi-ai-search input{height:32px!important;font-size:12px!important;padding-left:10px!important}.vi-ai-search button{width:34px!important;height:32px!important;border-radius:13px!important}.vi-ai-mini-panel{max-height:28dvh!important;margin-bottom:5px!important}.feed{padding-bottom:calc(126px + var(--safe-bottom))!important}.directory{padding-bottom:calc(126px + var(--safe-bottom))!important}
.directory-list.service-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;width:100%!important;max-width:100%!important}.directory-list.service-grid .service-cover-card{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;padding:8px!important;border-radius:24px!important;overflow:hidden!important;background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(7,18,22,.74))!important;border:1px solid rgba(34,244,214,.20)!important;box-shadow:0 18px 42px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.09)!important}.directory-list.service-grid .service-cover-card::after{display:none!important}.directory-list.service-grid .dir-cover{position:relative!important;height:96px!important;border-radius:18px!important;overflow:hidden!important;background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.10)!important}.directory-list.service-grid .dir-cover img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}.directory-list.service-grid .service-cover-badge{position:absolute!important;left:7px!important;top:7px!important;padding:4px 7px!important;border-radius:999px!important;background:linear-gradient(135deg,rgba(34,244,214,.92),rgba(37,238,151,.86))!important;color:#031513!important;font-size:8.5px!important;font-weight:1000!important;box-shadow:0 6px 16px rgba(0,0,0,.25)!important}.directory-list.service-grid .dir-service-body{display:grid!important;grid-template-columns:42px minmax(0,1fr)!important;gap:8px!important;align-items:start!important}.directory-list.service-grid .service-cover-card .avatar-wrap{width:42px!important;height:42px!important;border-radius:15px!important}.directory-list.service-grid .service-cover-card strong{font-size:12.3px!important;line-height:1.08!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}.directory-list.service-grid .service-cover-card span,.directory-list.service-grid .service-cover-card em{font-size:9.6px!important;line-height:1.18!important;max-width:100%!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}.directory-list.service-grid .service-cover-card em{color:rgba(234,255,250,.68)!important}.directory-list.service-grid .service-cover-card .service-card-meta{display:flex!important;gap:5px!important;flex-wrap:wrap!important;margin:0!important}.directory-list.service-grid .service-cover-card .dir-actions{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important}.directory-list.service-grid .service-cover-card .dir-actions button{height:32px!important;border-radius:14px!important}.directory-list.service-grid .service-rank-pill,.directory-list.service-grid .service-ai-pill{font-size:8.6px!important;padding:4px 6px!important}
@media(min-width:721px){.story-strip{top:108px!important;left:calc(50vw - 318px)!important;right:auto!important;width:min(390px,32vw)!important}.vi-ai-dock{bottom:22px!important;width:min(560px,42vw)!important}.directory-list.service-grid{grid-template-columns:repeat(2,minmax(280px,1fr))!important;max-width:880px!important}.directory-list.service-grid .dir-cover{height:120px!important}}
@media(max-height:650px){.story-strip{top:calc(108px + env(safe-area-inset-top))!important}.vi-ai-dock{bottom:calc(50px + var(--safe-bottom))!important}.reel-card.home-title-only .card-info{bottom:calc(118px + var(--safe-bottom))!important}}

/* v78.0.3 final mobile spacing override */
.story-strip{top:calc(132px + env(safe-area-inset-top))!important;left:12px!important;right:86px!important;}
.quick-tools-dot::before{background:transparent!important;color:#fff!important;box-shadow:none!important;text-shadow:0 2px 10px rgba(0,0,0,.70)!important;}
.ghost-dot.action-menu-trigger i{background:#fff!important;color:#fff!important;box-shadow:0 0 10px rgba(255,255,255,.70)!important;}
.ghost-dot.action-menu-trigger.is-open i{background:#041614!important;box-shadow:none!important;}
.vi-ai-dock{bottom:calc(76px + var(--safe-bottom))!important;z-index:88!important;}
.vi-ai-search{height:42px!important;}
.vi-ai-search input{height:34px!important;}
.vi-ai-search button{height:34px!important;}
.feed{padding-bottom:calc(150px + var(--safe-bottom))!important;}
.directory{padding-bottom:calc(150px + var(--safe-bottom))!important;}
@media(max-height:650px){.story-strip{top:calc(124px + env(safe-area-inset-top))!important}.vi-ai-dock{bottom:calc(68px + var(--safe-bottom))!important}.feed{padding-bottom:calc(136px + var(--safe-bottom))!important}.directory{padding-bottom:calc(136px + var(--safe-bottom))!important}}
@media(min-width:721px){.story-strip{top:116px!important}.vi-ai-dock{bottom:24px!important}.feed{padding-bottom:120px!important}.directory{padding-bottom:120px!important}}

/* v79.0.0: high Story rail, keyboard-safe Vi AI, hideable AI answers, visible photo counter */
.story-strip{
  top:calc(100px + env(safe-area-inset-top))!important;
  left:12px!important;
  right:96px!important;
  min-height:52px!important;
  padding:3px 4px!important;
  align-items:center!important;
  background:linear-gradient(90deg,rgba(2,8,11,.18),rgba(2,8,11,0))!important;
  backdrop-filter:none!important;
  border:0!important;
  z-index:76!important;
}
.story-pill{width:50px!important;gap:2px!important;transform:translateY(0)!important;}
.story-pill .story-ring{width:44px!important;height:44px!important;background:rgba(255,255,255,.12)!important;border:1px solid rgba(255,255,255,.24)!important;box-shadow:0 9px 24px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.22)!important;}
.story-pill span{max-width:50px!important;font-size:8px!important;line-height:1!important;text-shadow:0 2px 8px rgba(0,0,0,.86)!important;}
.feed-photo-count{
  z-index:78!important;
  right:86px!important;
  left:auto!important;
  bottom:calc(178px + var(--safe-bottom))!important;
  transform:none!important;
  padding:6px 11px!important;
  border-radius:999px!important;
  background:rgba(3,7,10,.78)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.22)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.14)!important;
  backdrop-filter:blur(14px)!important;
  font-size:11px!important;
  font-weight:1000!important;
  letter-spacing:.01em!important;
}
.media-dots{z-index:77!important;bottom:calc(150px + var(--safe-bottom))!important;background:rgba(3,7,10,.46)!important;border-color:rgba(255,255,255,.16)!important;}
.vi-ai-mini-panel{position:relative!important;padding-top:14px!important;}
.vi-ai-panel-close{position:absolute!important;right:8px!important;top:8px!important;width:30px!important;height:30px!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.16)!important;background:rgba(255,255,255,.10)!important;color:#fff!important;display:grid!important;place-items:center!important;font-size:18px!important;font-weight:1000!important;line-height:1!important;box-shadow:0 10px 24px rgba(0,0,0,.26)!important;z-index:4!important;}
.vi-ai-panel-close:active{transform:scale(.94)!important;}
.vi-ai-panel-head,.vi-ai-loading{padding-right:34px!important;}
.vi-ai-panel-head b{font-size:14.5px!important;line-height:1.12!important;}
.vi-ai-panel-head small{font-size:12px!important;line-height:1.42!important;color:rgba(237,255,252,.80)!important;}
.vi-ai-pills button,.vi-ai-notes button{max-width:90vw!important;white-space:normal!important;text-align:left!important;line-height:1.18!important;}
.global-ai-keyboard-open .bottom-nav{opacity:0!important;transform:translateY(120%)!important;pointer-events:none!important;transition:opacity .15s ease,transform .15s ease!important;}
body.global-ai-keyboard-open .vi-ai-dock{
  bottom:calc(var(--vc-keyboard-inset, 0px) + 8px)!important;
  z-index:190!important;
  width:calc(100vw - 18px)!important;
}
body.global-ai-keyboard-open .vi-ai-mini-panel{max-height:min(24dvh,210px)!important;margin-bottom:6px!important;}
body.global-ai-keyboard-open .vi-ai-search{height:46px!important;box-shadow:0 10px 34px rgba(0,0,0,.62),0 0 0 1px rgba(43,244,218,.14)!important;}
body.global-ai-keyboard-open .vi-ai-search input{font-size:14px!important;}
body.global-ai-keyboard-open .feed{scroll-snap-type:none!important;}
body.global-ai-keyboard-open .reel-card.is-active .action-rail{opacity:.74!important;}
@media(max-width:390px){
  .story-strip{top:calc(96px + env(safe-area-inset-top))!important;right:86px!important;}
  .story-pill .story-ring{width:41px!important;height:41px!important;}
  .feed-photo-count{right:72px!important;bottom:calc(168px + var(--safe-bottom))!important;}
  .media-dots{bottom:calc(142px + var(--safe-bottom))!important;}
}
@media(max-height:650px){
  .story-strip{top:calc(92px + env(safe-area-inset-top))!important;}
  .feed-photo-count{bottom:calc(154px + var(--safe-bottom))!important;}
  .media-dots{bottom:calc(130px + var(--safe-bottom))!important;}
}
@media(min-width:721px){
  .story-strip{top:96px!important;left:calc(50vw - 318px)!important;right:auto!important;width:min(360px,30vw)!important;}
  .feed-photo-count{right:calc(50vw - 270px)!important;bottom:168px!important;}
}


/* v80.0.0: professional mobile spacing, right-side carousel status and separated AI composer */
@media (max-width: 720px) {
  .story-strip{
    top:calc(88px + env(safe-area-inset-top))!important;
    left:14px!important;
    right:112px!important;
    min-height:48px!important;
    padding:2px 3px!important;
    z-index:82!important;
    background:transparent!important;
  }
  .story-pill{width:48px!important;gap:2px!important;}
  .story-pill .story-ring{width:40px!important;height:40px!important;background:rgba(255,255,255,.105)!important;border:1px solid rgba(255,255,255,.22)!important;box-shadow:0 8px 22px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.18)!important;}
  .story-pill.add-story .story-ring{background:rgba(255,255,255,.13)!important;}
  .story-pill span{font-size:7.8px!important;max-width:48px!important;color:rgba(255,255,255,.88)!important;text-shadow:0 2px 8px rgba(0,0,0,.78)!important;}

  .feed-photo-count{
    top:clamp(230px, 56dvh, 560px)!important;
    bottom:auto!important;
    left:auto!important;
    right:72px!important;
    transform:none!important;
    z-index:84!important;
    min-width:42px!important;
    text-align:center!important;
    padding:7px 10px!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,rgba(3,7,10,.82),rgba(3,7,10,.64))!important;
    border:1px solid rgba(255,255,255,.24)!important;
    box-shadow:0 14px 30px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.16)!important;
    color:#fff!important;
    backdrop-filter:blur(16px)!important;
    font-size:11px!important;
    font-weight:1000!important;
    line-height:1!important;
  }
  .media-dots{
    top:clamp(262px, calc(56dvh + 34px), 594px)!important;
    bottom:auto!important;
    left:auto!important;
    right:68px!important;
    transform:none!important;
    z-index:83!important;
    padding:6px 8px!important;
    background:rgba(3,7,10,.44)!important;
    border:1px solid rgba(255,255,255,.16)!important;
    box-shadow:0 12px 26px rgba(0,0,0,.30)!important;
    backdrop-filter:blur(14px)!important;
  }
  .reel-card.home-title-only .card-info{right:84px!important;bottom:calc(162px + var(--safe-bottom))!important;z-index:80!important;}
  .reel-card.home-title-only .card-info h1{padding-right:0!important;max-width:min(88vw, 360px)!important;}

  .vi-ai-dock{
    bottom:calc(96px + var(--safe-bottom))!important;
    width:calc(100vw - 28px)!important;
    max-width:460px!important;
    z-index:90!important;
  }
  .vi-ai-mini-panel{
    margin-bottom:12px!important;
    max-height:min(34dvh, 310px)!important;
    overflow:auto!important;
    border-radius:24px!important;
    box-shadow:0 18px 48px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.08)!important;
  }
  .vi-ai-search{height:44px!important;border-radius:18px!important;}
  .vi-ai-search input{height:36px!important;font-size:13px!important;}
  .vi-ai-search button{width:38px!important;height:36px!important;border-radius:14px!important;}
  .feed{padding-bottom:calc(184px + var(--safe-bottom))!important;}
  .directory{padding-bottom:calc(184px + var(--safe-bottom))!important;}

  body.global-ai-keyboard-open .vi-ai-dock{
    bottom:calc(var(--vc-keyboard-inset, 0px) + 16px)!important;
    width:calc(100vw - 18px)!important;
    z-index:210!important;
  }
  body.global-ai-keyboard-open .vi-ai-mini-panel{
    max-height:min(26dvh, 230px)!important;
    margin-bottom:10px!important;
  }
  body.global-ai-keyboard-open .vi-ai-search{height:48px!important;}
  body.global-ai-keyboard-open .vi-ai-search input{height:38px!important;font-size:14px!important;}
  body.global-ai-keyboard-open .vi-ai-search button{height:38px!important;width:40px!important;}
}
@media (max-width:390px){
  .story-strip{top:calc(84px + env(safe-area-inset-top))!important;right:104px!important;}
  .story-pill .story-ring{width:38px!important;height:38px!important;}
  .feed-photo-count{right:66px!important;top:clamp(220px, 55dvh, 535px)!important;}
  .media-dots{right:62px!important;top:clamp(252px, calc(55dvh + 34px), 570px)!important;}
  .vi-ai-dock{bottom:calc(92px + var(--safe-bottom))!important;width:calc(100vw - 24px)!important;}
  .feed,.directory{padding-bottom:calc(178px + var(--safe-bottom))!important;}
}
@media (max-height:650px) and (max-width:720px){
  .story-strip{top:calc(82px + env(safe-area-inset-top))!important;}
  .feed-photo-count{top:clamp(198px, 52dvh, 480px)!important;}
  .media-dots{top:clamp(230px, calc(52dvh + 32px), 512px)!important;}
  .vi-ai-dock{bottom:calc(84px + var(--safe-bottom))!important;}
  .feed,.directory{padding-bottom:calc(166px + var(--safe-bottom))!important;}
}
@media (min-width:721px){
  .vi-ai-dock{bottom:28px!important;}
  .feed-photo-count{bottom:192px!important;right:calc(50vw - 286px)!important;}
  .media-dots{bottom:160px!important;}
}

/* v81.0.0: boot-safe Vi AI, refined Story lane, separated bottom composer and professional carousel status */
body:not(.app-ready) .vi-ai-dock,
body:not(.app-ready) #globalAiDock {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
@media (max-width: 720px) {
  .story-strip {
    top: calc(114px + env(safe-area-inset-top)) !important;
    left: 14px !important;
    right: 116px !important;
    min-height: 46px !important;
    z-index: 82 !important;
    background: linear-gradient(90deg, rgba(2,8,11,.08), rgba(2,8,11,0)) !important;
  }
  .story-pill .story-ring {
    width: 39px !important;
    height: 39px !important;
  }
  .story-pill span {
    margin-top: 1px !important;
    font-size: 7.7px !important;
  }
  .feed-photo-count {
    top: auto !important;
    bottom: calc(292px + var(--safe-bottom)) !important;
    left: auto !important;
    right: 72px !important;
    z-index: 90 !important;
    transform: none !important;
    min-width: 43px !important;
    text-align: center !important;
    pointer-events: none !important;
  }
  .media-dots {
    top: auto !important;
    bottom: calc(260px + var(--safe-bottom)) !important;
    left: auto !important;
    right: 66px !important;
    z-index: 89 !important;
    transform: none !important;
    pointer-events: auto !important;
  }
  .vi-ai-dock {
    bottom: calc(86px + var(--safe-bottom)) !important;
    width: calc(100vw - 30px) !important;
    max-width: 460px !important;
    z-index: 91 !important;
  }
  .vi-ai-search {
    height: 43px !important;
    border-radius: 18px !important;
  }
  .vi-ai-search input {
    height: 35px !important;
    padding-left: 11px !important;
  }
  .vi-ai-search button {
    width: 38px !important;
    height: 35px !important;
  }
  .vi-ai-mini-panel {
    margin-bottom: 10px !important;
    max-height: min(32dvh, 292px) !important;
  }
  .feed { padding-bottom: calc(176px + var(--safe-bottom)) !important; }
  .directory { padding-bottom: calc(176px + var(--safe-bottom)) !important; }
  body.global-ai-keyboard-open .vi-ai-dock {
    bottom: calc(var(--vc-keyboard-inset, 0px) + 14px) !important;
    z-index: 220 !important;
  }
  body.global-ai-keyboard-open .vi-ai-mini-panel {
    max-height: min(25dvh, 224px) !important;
  }
}
@media (max-width: 390px) {
  .story-strip { top: calc(108px + env(safe-area-inset-top)) !important; right: 106px !important; }
  .story-pill .story-ring { width: 37px !important; height: 37px !important; }
  .feed-photo-count { bottom: calc(276px + var(--safe-bottom)) !important; right: 64px !important; }
  .media-dots { bottom: calc(246px + var(--safe-bottom)) !important; right: 58px !important; }
  .vi-ai-dock { bottom: calc(82px + var(--safe-bottom)) !important; width: calc(100vw - 24px) !important; }
  .feed,.directory { padding-bottom: calc(168px + var(--safe-bottom)) !important; }
}
@media (max-height: 650px) and (max-width: 720px) {
  .story-strip { top: calc(100px + env(safe-area-inset-top)) !important; }
  .feed-photo-count { bottom: calc(246px + var(--safe-bottom)) !important; }
  .media-dots { bottom: calc(218px + var(--safe-bottom)) !important; }
  .vi-ai-dock { bottom: calc(78px + var(--safe-bottom)) !important; }
  .feed,.directory { padding-bottom: calc(158px + var(--safe-bottom)) !important; }
}
@media (min-width: 721px) {
  body:not(.app-ready) .vi-ai-dock { display:none!important; }
  .story-strip { top: 112px !important; }
}

/* v82.0.0: lower product information stack and professional notification fallback */
@media (max-width: 720px) {
  .story-strip {
    top: calc(124px + env(safe-area-inset-top)) !important;
    left: 14px !important;
    right: 118px !important;
    min-height: 48px !important;
    padding: 4px 4px !important;
    border-radius: 24px !important;
    background: linear-gradient(90deg, rgba(255,255,255,.035), rgba(2,8,11,0)) !important;
    z-index: 82 !important;
  }
  .story-pill .story-ring {
    width: 40px !important;
    height: 40px !important;
    background: linear-gradient(145deg, rgba(255,255,255,.18), rgba(255,255,255,.065)) !important;
    border: 1px solid rgba(255,255,255,.25) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.23) !important;
  }
  .reel-card.home-title-only .card-info {
    bottom: calc(134px + var(--safe-bottom)) !important;
    right: 78px !important;
    left: 16px !important;
    z-index: 80 !important;
    padding-bottom: 0 !important;
  }
  .reel-card.home-title-only .card-info h1 {
    max-width: min(88vw, 382px) !important;
    font-size: clamp(28px, 8.1vw, 39px) !important;
    line-height: .98 !important;
    text-shadow: 0 3px 12px rgba(0,0,0,.82), 0 12px 34px rgba(0,0,0,.52) !important;
  }
  .reel-card.home-title-only .tag-line {
    padding-right: 116px !important;
    margin-top: 10px !important;
    min-height: 30px !important;
  }
  .feed-photo-count {
    top: auto !important;
    bottom: calc(222px + var(--safe-bottom)) !important;
    right: 72px !important;
    left: auto !important;
    transform: none !important;
    z-index: 93 !important;
    min-width: 42px !important;
    height: 30px !important;
    display: inline-grid !important;
    place-items: center !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(6,8,12,.74), rgba(6,8,12,.50)) !important;
    border: 1px solid rgba(255,255,255,.20) !important;
    box-shadow: 0 12px 28px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.16) !important;
    backdrop-filter: blur(16px) !important;
  }
  .media-dots {
    top: auto !important;
    bottom: calc(190px + var(--safe-bottom)) !important;
    right: 67px !important;
    left: auto !important;
    transform: none !important;
    z-index: 92 !important;
    min-width: 54px !important;
    justify-content: center !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(4,8,11,.54), rgba(4,8,11,.34)) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    box-shadow: 0 12px 28px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.10) !important;
    backdrop-filter: blur(16px) !important;
  }
  .vi-ai-dock {
    bottom: calc(78px + var(--safe-bottom)) !important;
    width: calc(100vw - 30px) !important;
    max-width: 462px !important;
    z-index: 91 !important;
  }
  .vi-ai-search {
    height: 44px !important;
    border-radius: 19px !important;
    background: linear-gradient(180deg, rgba(3,7,10,.94), rgba(3,7,10,.80)) !important;
    border: 1px solid rgba(34,244,214,.22) !important;
    box-shadow: 0 16px 44px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.08) !important;
  }
  .vi-ai-search input { height: 36px !important; }
  .vi-ai-search button { width: 38px !important; height: 36px !important; }
  .feed { padding-bottom: calc(170px + var(--safe-bottom)) !important; }
  .directory { padding-bottom: calc(170px + var(--safe-bottom)) !important; }
}
@media (max-width: 390px) {
  .story-strip { top: calc(116px + env(safe-area-inset-top)) !important; right: 108px !important; }
  .reel-card.home-title-only .card-info { bottom: calc(128px + var(--safe-bottom)) !important; right: 74px !important; }
  .feed-photo-count { bottom: calc(208px + var(--safe-bottom)) !important; right: 62px !important; }
  .media-dots { bottom: calc(178px + var(--safe-bottom)) !important; right: 57px !important; }
  .vi-ai-dock { bottom: calc(76px + var(--safe-bottom)) !important; width: calc(100vw - 24px) !important; }
}
@media (max-height: 650px) and (max-width: 720px) {
  .story-strip { top: calc(108px + env(safe-area-inset-top)) !important; }
  .reel-card.home-title-only .card-info { bottom: calc(112px + var(--safe-bottom)) !important; }
  .feed-photo-count { bottom: calc(190px + var(--safe-bottom)) !important; }
  .media-dots { bottom: calc(160px + var(--safe-bottom)) !important; }
  .vi-ai-dock { bottom: calc(70px + var(--safe-bottom)) !important; }
}
.notification-detail-card {
  display: grid !important;
  gap: 12px !important;
  padding: 14px !important;
  border-radius: 24px !important;
  background: linear-gradient(155deg, rgba(255,255,255,.09), rgba(34,244,214,.06)) !important;
  border: 1px solid rgba(34,244,214,.20) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 18px 48px rgba(0,0,0,.26) !important;
}
.notification-detail-head { display:grid !important; grid-template-columns:48px minmax(0,1fr) !important; gap:10px !important; align-items:center !important; }
.notification-detail-head .notif-icon { width:48px !important; height:48px !important; border-radius:17px !important; display:grid !important; place-items:center !important; background:linear-gradient(135deg, rgba(34,244,214,.24), rgba(255,47,126,.16)) !important; border:1px solid rgba(255,255,255,.12) !important; }
.notification-detail-head b { display:block !important; font-size:16px !important; line-height:1.1 !important; color:#fff !important; }
.notification-detail-head small { display:block !important; margin-top:3px !important; color:rgba(237,255,252,.66) !important; font-size:11px !important; text-transform:capitalize !important; }
.notification-detail-card p { margin:0 !important; color:rgba(237,255,252,.84) !important; line-height:1.43 !important; font-size:13px !important; }
.notification-detail-card em { font-style:normal !important; display:block !important; padding:10px 11px !important; border-radius:17px !important; background:rgba(255,255,255,.06) !important; border:1px solid rgba(255,255,255,.10) !important; color:rgba(255,255,255,.70) !important; font-size:12px !important; line-height:1.35 !important; }
.notification-detail-actions { display:grid !important; grid-template-columns:1fr 1fr !important; gap:8px !important; }
.notification-detail-actions .primary,.notification-detail-actions .soft { min-height:42px !important; border-radius:16px !important; }
@media(max-width:390px){ .notification-detail-actions{grid-template-columns:1fr!important;} }


/* v83.0.0: mobile carousel title no-overlap and lean Services search */
@media (max-width: 720px) {
  .media-wrap:not(.carousel) > .feed-photo-count,
  .media-wrap:not(.carousel) > .media-dots,
  .feed-photo-count:empty {
    display: none !important;
  }
  .feed-photo-count {
    top: auto !important;
    bottom: calc(318px + var(--safe-bottom)) !important;
    left: auto !important;
    right: 72px !important;
    transform: none !important;
    z-index: 94 !important;
    min-width: 44px !important;
    height: 30px !important;
    display: inline-grid !important;
    place-items: center !important;
    pointer-events: none !important;
  }
  .media-dots {
    top: auto !important;
    bottom: calc(286px + var(--safe-bottom)) !important;
    left: auto !important;
    right: 66px !important;
    transform: none !important;
    z-index: 93 !important;
    pointer-events: auto !important;
  }
  .reel-card.home-title-only .card-info {
    bottom: calc(134px + var(--safe-bottom)) !important;
    right: 82px !important;
    left: 16px !important;
  }
  .reel-card.home-title-only .card-info h1 {
    max-width: min(82vw, 372px) !important;
    padding-right: 0 !important;
  }
  .reel-card.home-title-only .tag-line {
    padding-right: 0 !important;
  }
  .directory {
    padding-top: calc(148px + env(safe-area-inset-top)) !important;
  }
  .directory .section-head,
  .directory #directoryTabs {
    display: none !important;
  }
  .directory .inline-search {
    margin: 0 0 14px !important;
  }
  .directory .inline-search.with-icon input {
    min-height: 50px !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,.07)) !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 30px rgba(0,0,0,.22) !important;
  }
  .directory-list {
    margin-top: 2px !important;
  }
}
@media (max-width: 390px) {
  .feed-photo-count {
    bottom: calc(302px + var(--safe-bottom)) !important;
    right: 62px !important;
  }
  .media-dots {
    bottom: calc(272px + var(--safe-bottom)) !important;
    right: 57px !important;
  }
  .directory {
    padding-top: calc(140px + env(safe-area-inset-top)) !important;
  }
  .reel-card.home-title-only .card-info {
    bottom: calc(128px + var(--safe-bottom)) !important;
    right: 74px !important;
  }
}
@media (max-height: 650px) and (max-width: 720px) {
  .feed-photo-count {
    bottom: calc(270px + var(--safe-bottom)) !important;
  }
  .media-dots {
    bottom: calc(240px + var(--safe-bottom)) !important;
  }
  .directory {
    padding-top: calc(132px + env(safe-area-inset-top)) !important;
  }
  .reel-card.home-title-only .card-info {
    bottom: calc(112px + var(--safe-bottom)) !important;
  }
}

/* v86.0.0: service call buttons and real push notification polish */
.service-cover-card .call-small,
.dir-actions .call-small {
  border-color: rgba(34,244,214,.42);
  background: rgba(34,244,214,.16);
  color: #eaffff;
}
.profile-actions .primary svg,
.profile-actions .soft svg { width: 16px; height: 16px; }
.profile-actions button span { display: inline-grid; place-items: center; }


/* v92: restore desktop left data and fit the new user-provided logos without zooming */
@media (min-width: 1100px) {
  .desktop-sidebar { display: flex !important; visibility: visible !important; opacity: 1 !important; }
  .desktop-top-actions { display: flex !important; visibility: visible !important; opacity: 1 !important; }
  .desktop-scroll-controls { display: grid !important; visibility: visible !important; opacity: 1 !important; }
  .desktop-logo { min-height: 128px !important; padding: 0 0 8px !important; align-items: center !important; justify-content: flex-start !important; }
  .desktop-logo img.desktop-full-logo,
  .desktop-logo img { width: 184px !important; height: 118px !important; max-width: 100% !important; object-fit: contain !important; object-position: center left !important; border-radius: 16px !important; box-shadow: none !important; background: transparent !important; }
  .desktop-logo span:not(.sr-only) { display: none !important; }
}
.brand img,
.admin-brand img,
.brand-side img,
.qr-logo,
.vc-logo,
.logo-img { object-fit: contain !important; object-position: center !important; background: transparent !important; }
.brand img { padding: 3px !important; box-sizing: border-box !important; }
@media (max-width: 1099px) { .brand img { width: 52px !important; height: 52px !important; } }


/* v92: exact user-provided logos. Web uses the Connects wordmark; square/icon slots use the icon-only mark without zoom. */
@media (min-width: 1100px) {
  .desktop-logo { min-height: 188px !important; padding: 0 0 12px !important; align-items: center !important; justify-content: center !important; }
  .desktop-logo img.desktop-full-logo { width: 220px !important; height: 176px !important; object-fit: contain !important; object-position: center !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important; }
}
.brand img, .desktop-logo img, .admin-brand img, .brand-side img, .qr-logo, .vc-logo, .logo-img { object-fit: contain !important; object-position: center !important; background: transparent !important; }
.brand img { padding: 0 !important; border-radius: 14px !important; }

/* v92: smaller desktop wordmark and final fit-safe user logo */
@media (min-width: 901px) {
  .desktop-logo {
    min-height: 94px !important;
    padding: 0 0 6px !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }
  .desktop-logo img.desktop-full-logo,
  .desktop-logo img {
    width: 154px !important;
    height: 92px !important;
    max-width: 154px !important;
    object-fit: contain !important;
    object-position: center left !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }
  .desktop-logo span:not(.sr-only) { display: none !important; }
}


/* v92: web/desktop keeps the Connects wordmark but makes it compact and non-zoomed. */
@media (min-width: 861px){
  .desktop-logo { min-height: 94px !important; padding: 2px 0 8px !important; }
  .desktop-logo img.desktop-full-logo { width: 108px !important; height: 92px !important; max-width: 88% !important; object-fit: contain !important; object-position: center !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important; }
  .brand-logo img, .top-logo img, .nav-logo img { object-fit: contain !important; }
}


/* v92: smaller web desktop Connects logo; Android uses icon-only branding. */
@media (min-width: 901px) {
  .desktop-logo { min-height: 74px !important; padding: 0 0 4px !important; justify-content: flex-start !important; }
  .desktop-logo img.desktop-full-logo,
  .desktop-logo img {
    width: 126px !important;
    height: 70px !important;
    max-width: 126px !important;
    object-fit: contain !important;
    object-position: center left !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }
}


/* v92: final desktop logo size. Web keeps the Connects wordmark, but smaller and not zoomed. */
@media (min-width: 901px) {
  .desktop-logo { min-height: 80px !important; padding: 0 0 4px !important; align-items: center !important; justify-content: flex-start !important; }
  .desktop-logo img.desktop-full-logo,
  .desktop-logo img { width: 126px !important; height: 78px !important; max-width: 126px !important; object-fit: contain !important; object-position: center left !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important; }
}

/* ========================================================================
   v95.0.0 · stable TikTok-style feed, compact product metadata and GPS UI
   ======================================================================== */

/* The feed selector is now a clean social-media tab strip, not three cards. */
.feed-tabs {
  position: relative !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.feed-tabs button {
  position: relative !important;
  min-width: 0 !important;
  min-height: 36px !important;
  padding: 0 11px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(244,251,255,.64) !important;
  font-size: 12px !important;
  font-weight: 780 !important;
  letter-spacing: -.015em !important;
  white-space: nowrap !important;
  transform: none !important;
  transition: color .16s ease, opacity .16s ease !important;
}
.feed-tabs button::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  bottom: 1px !important;
  width: 0 !important;
  height: 3px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg,#20f2dd,#77ffe7) !important;
  box-shadow: 0 0 12px rgba(32,242,221,.55) !important;
  transform: translateX(-50%) !important;
  transition: width .18s ease !important;
}
.feed-tabs button.active {
  color: #fff !important;
  background: transparent !important;
}
.feed-tabs button.active::after { width: 22px !important; }
.feed-tabs button:active { opacity: .78 !important; transform: none !important; }

/* Never animate or auto-transform the whole product card. */
.feed.feed-reconciling *,
.reel-card.auto-advancing,
.reel-card.auto-advancing .card-info,
.reel-card.auto-advancing .media-main,
.reel-card.auto-advancing .action-rail {
  animation: none !important;
  transform: none !important;
}
.reel-card,
.reel-card .action-rail,
.reel-card .card-info,
.reel-card .seller-line,
.reel-card .badge,
.reel-card .tag {
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}
.media-wrap .media-main,
.media-wrap .media-bg {
  transform: translateZ(0) !important;
  transition: opacity .14s ease !important;
}
.media-wrap.quick-swap .media-main,
.media-wrap.is-changing .media-main { transform: translateZ(0) !important; }

/* Product information becomes one compact, aligned metadata stack. */
.product-meta-row {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  width: 100% !important;
}
.product-meta-row .seller-line {
  flex: 0 1 auto !important;
  min-width: 0 !important;
}
.product-meta-row .badge-line {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  gap: 4px !important;
  overflow: hidden !important;
}

@media (max-width: 720px) {
  .top-row { gap: 7px !important; }
  .top-row .feed-tabs { flex: 1 1 auto !important; max-width: 232px !important; }
  .feed-tabs button { flex: 1 1 auto !important; padding: 0 7px !important; font-size: 11.5px !important; }

  .card-info,
  .reel-card.home-title-only .card-info {
    left: 15px !important;
    right: 78px !important;
    bottom: calc(118px + var(--safe-bottom)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: 132px !important;
    gap: 5px !important;
    overflow: hidden !important;
    contain: layout paint !important;
  }
  .product-meta-row { height: 32px !important; gap: 5px !important; }
  .product-meta-row .seller-line,
  .card-info .seller-line {
    width: auto !important;
    max-width: 47% !important;
    min-height: 30px !important;
    height: 30px !important;
    padding: 2px 7px 2px 3px !important;
    border-radius: 999px !important;
    gap: 5px !important;
    background: rgba(2,9,12,.46) !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    box-shadow: 0 6px 18px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08) !important;
  }
  .card-info .seller-line .avatar {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    border-width: 1px !important;
  }
  .card-info .seller-line .online-dot,
  .card-info .seller-line .avatar i {
    width: 7px !important;
    height: 7px !important;
    right: -1px !important;
    bottom: -1px !important;
  }
  .card-info .seller-text { min-width: 0 !important; gap: 0 !important; }
  .card-info .seller-name {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 10.5px !important;
    line-height: 1.05 !important;
    font-weight: 850 !important;
  }
  .card-info .seller-area {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 8px !important;
    line-height: 1.05 !important;
    opacity: .76 !important;
  }
  .product-meta-row .badge-line { height: 30px !important; }
  .badge-line .badge {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    min-height: 20px !important;
    height: 20px !important;
    padding: 0 6px !important;
    border-radius: 999px !important;
    font-size: 7.8px !important;
    line-height: 20px !important;
    letter-spacing: .015em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    box-shadow: none !important;
  }
  .card-info h1,
  .reel-card.home-title-only .card-info h1 {
    margin: 0 !important;
    max-width: 100% !important;
    max-height: 58px !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    font-size: clamp(25px, 7.1vw, 32px) !important;
    line-height: 1.01 !important;
    letter-spacing: -.052em !important;
  }
  .card-info > p { display: none !important; }
  .card-info .tag-line {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 5px !important;
    min-height: 21px !important;
    max-height: 21px !important;
    overflow: hidden !important;
    padding: 0 !important;
  }
  .card-info .tag-line .tag {
    min-height: 20px !important;
    height: 20px !important;
    padding: 0 7px !important;
    border-radius: 999px !important;
    font-size: 8.5px !important;
    line-height: 20px !important;
    white-space: nowrap !important;
    box-shadow: none !important;
  }

  /* Counter/dots live above the compact caption, never on the title. */
  .feed-photo-count {
    bottom: calc(256px + var(--safe-bottom)) !important;
    right: 66px !important;
    min-width: 40px !important;
    height: 27px !important;
    font-size: 10px !important;
  }
  .media-dots {
    bottom: calc(224px + var(--safe-bottom)) !important;
    right: 60px !important;
    min-height: 24px !important;
    padding: 5px 8px !important;
  }
  .media-dots button { width: 6px !important; height: 6px !important; }
  .media-dots button.active { width: 23px !important; }
}

@media (max-width: 390px) {
  .top-row .feed-tabs { max-width: 202px !important; }
  .feed-tabs button { padding: 0 5px !important; font-size: 10.5px !important; }
  .card-info,
  .reel-card.home-title-only .card-info {
    left: 13px !important;
    right: 72px !important;
    bottom: calc(112px + var(--safe-bottom)) !important;
  }
  .product-meta-row .seller-line,
  .card-info .seller-line { max-width: 44% !important; }
  .card-info h1,
  .reel-card.home-title-only .card-info h1 { font-size: clamp(23px, 7vw, 29px) !important; }
  .feed-photo-count { bottom: calc(244px + var(--safe-bottom)) !important; right: 58px !important; }
  .media-dots { bottom: calc(214px + var(--safe-bottom)) !important; right: 54px !important; }
}

@media (max-height: 680px) and (max-width: 720px) {
  .card-info,
  .reel-card.home-title-only .card-info { bottom: calc(105px + var(--safe-bottom)) !important; max-height: 116px !important; }
  .card-info h1,
  .reel-card.home-title-only .card-info h1 { font-size: clamp(22px, 6.5vw, 28px) !important; max-height: 54px !important; }
  .feed-photo-count { bottom: calc(224px + var(--safe-bottom)) !important; }
  .media-dots { bottom: calc(195px + var(--safe-bottom)) !important; }
}

/* ========================================================================
   v96.0.0 · area-ranked auto showcase, adaptive titles and clean controls
   ======================================================================== */

/* Keep the account/package chip in the same premium dark-cyan family as all top controls. */
.account-top-chip,
.account-top-chip.is-pro {
  border-color: rgba(48,236,214,.25) !important;
  background: linear-gradient(145deg,rgba(13,25,29,.90),rgba(9,14,18,.84)) !important;
  color: #f8ffff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 10px 26px rgba(0,0,0,.20) !important;
}
.account-top-chip.is-pro::before { display: none !important; }
.account-top-chip b { color: rgba(255,255,255,.96) !important; }
.account-top-chip small { color: rgba(157,255,238,.76) !important; }

/* Product titles have an exact two-line box. Long names scale down instead of being cut. */
.card-info h1,
.reel-card.home-title-only .card-info h1 {
  text-wrap: pretty !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: auto !important;
  max-height: 2.16em !important;
  min-height: 0 !important;
  padding-bottom: 1px !important;
}

@media (max-width: 720px) {
  .card-info,
  .reel-card.home-title-only .card-info {
    max-height: 130px !important;
    gap: 5px !important;
  }
  .card-info h1,
  .reel-card.home-title-only .card-info h1 {
    margin: 0 !important;
    font-size: clamp(21px, 5.95vw, 26px) !important;
    line-height: 1.075 !important;
    letter-spacing: -.037em !important;
    max-height: 2.16em !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
  }
  .reel-card.title-long .card-info h1 { font-size: clamp(19px, 5.25vw, 23px) !important; letter-spacing: -.030em !important; }
  .reel-card.title-xlong .card-info h1 { font-size: clamp(17.5px, 4.75vw, 21px) !important; letter-spacing: -.024em !important; }
  .reel-card.title-xxlong .card-info h1 { font-size: clamp(16.5px, 4.35vw, 19.5px) !important; letter-spacing: -.018em !important; }

  .product-meta-row .seller-line,
  .card-info .seller-line {
    max-width: 49% !important;
    border-color: rgba(55,238,216,.20) !important;
    background: rgba(3,12,15,.58) !important;
  }
  .product-meta-row .badge-line { justify-content: flex-start !important; }
  .badge-line .badge.price,
  .badge-line .badge.available { box-shadow: none !important; }
}

@media (max-width: 390px) {
  .card-info h1,
  .reel-card.home-title-only .card-info h1 { font-size: clamp(20px, 5.85vw, 24px) !important; }
  .reel-card.title-long .card-info h1 { font-size: clamp(18.5px, 5.15vw, 22px) !important; }
  .reel-card.title-xlong .card-info h1 { font-size: clamp(17px, 4.65vw, 20px) !important; }
  .reel-card.title-xxlong .card-info h1 { font-size: clamp(16px, 4.25vw, 18.5px) !important; }
}

/* Automatic photo changes are a quiet in-place cross-fade. Nothing else on the card moves. */
.media-wrap.carousel .media-main,
.media-wrap.carousel .media-bg {
  transition: opacity .20s ease !important;
  animation: none !important;
}
.media-wrap.carousel.quick-swap .media-main {
  animation: vc96PhotoFade .24s ease-out both !important;
}
@keyframes vc96PhotoFade {
  from { opacity: .86; }
  to { opacity: 1; }
}
.reel-card.auto-advancing,
.reel-card.auto-advancing .media-wrap,
.reel-card.auto-advancing .card-info,
.reel-card.auto-advancing .action-rail {
  animation: none !important;
  transform: none !important;
}
.feed { scroll-behavior: smooth; }

@media (min-width: 1100px) {
  .card-info h1,
  .reel-card.home-title-only .card-info h1 {
    font-size: clamp(25px, 2.05vw, 34px) !important;
    line-height: 1.04 !important;
    max-height: 2.10em !important;
  }
  .reel-card.title-long .card-info h1 { font-size: clamp(23px, 1.85vw, 31px) !important; }
  .reel-card.title-xlong .card-info h1 { font-size: clamp(21px, 1.65vw, 28px) !important; }
  .reel-card.title-xxlong .card-info h1 { font-size: clamp(19px, 1.5vw, 25px) !important; }
}

/* ========================================================================
   v97.0.0 · Professional product stage, hover action dock and gallery UX
   ======================================================================== */

/* Accessible product/gallery interaction primitives. */
.reel-card:focus-visible {
  outline: 2px solid rgba(45,245,207,.72) !important;
  outline-offset: -3px !important;
}
.media-wrap:focus-visible {
  outline: 2px solid rgba(45,245,207,.78) !important;
  outline-offset: -4px !important;
}
.media-nav-controls {
  position: absolute;
  z-index: 18;
  inset: 0;
  pointer-events: none;
}
.media-nav-button {
  position: absolute;
  top: 50%;
  width: 46px;
  height: 58px;
  display: grid;
  place-items: center;
  padding: 0;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(3,8,11,.54);
  color: #fff;
  box-shadow: 0 18px 42px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.12);
  backdrop-filter: blur(18px) saturate(1.16);
  transform: translateY(-50%) scale(.92);
  opacity: 0;
  pointer-events: auto;
  transition: opacity .16s ease, transform .16s ease, background .16s ease, border-color .16s ease;
}
.media-nav-prev { left: 14px; }
.media-nav-next { right: 14px; }
.media-nav-button svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.media-wrap.carousel:hover .media-nav-button,
.media-wrap.carousel:focus-within .media-nav-button,
.reel-card.is-inspecting .media-nav-button {
  opacity: .94;
  transform: translateY(-50%) scale(1);
}
.media-nav-button:hover,
.media-nav-button:focus-visible {
  opacity: 1 !important;
  background: rgba(19,52,54,.78) !important;
  border-color: rgba(45,245,207,.52) !important;
  transform: translateY(-50%) scale(1.055) !important;
}
.media-nav-button:active { transform: translateY(-50%) scale(.96) !important; }

/* A tiny, non-blocking indicator for the automatic local showcase. */
.showcase-meter {
  position: absolute;
  z-index: 24;
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  opacity: 0;
  pointer-events: none;
}
.showcase-meter::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  transform: scaleX(0);
  transform-origin: left center;
  background: linear-gradient(90deg, #20f2dd, #77ffe7 58%, #ff58af);
  box-shadow: 0 0 14px rgba(32,242,221,.58);
}
.reel-card.is-active.showcase-running .showcase-meter { opacity: .82; }
.reel-card.is-active.showcase-running .showcase-meter::after { animation: vc97Showcase var(--vc-showcase-duration, 9200ms) linear both; }
.reel-card.showcase-paused .showcase-meter::after,
.reel-card.is-inspecting .showcase-meter::after { animation-play-state: paused !important; }
@keyframes vc97Showcase { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* Mobile: cleaner controls, compact product surface and aligned gallery HUD. */
@media (max-width: 720px) {
  .topbar {
    padding-left: 12px !important;
    padding-right: 12px !important;
    gap: 7px !important;
    background: linear-gradient(180deg, rgba(2,7,10,.96) 0%, rgba(2,9,12,.82) 58%, rgba(2,9,12,.28) 82%, transparent 100%) !important;
  }
  .top-row { min-height: 52px !important; gap: 7px !important; }
  .top-row .brand { flex: 0 0 58px !important; }
  .top-row .brand img { width: 50px !important; height: 50px !important; object-fit: contain !important; }
  .top-row .feed-tabs {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: 232px !important;
    min-height: 42px !important;
    align-self: center !important;
  }
  .feed-tabs button {
    min-height: 42px !important;
    padding-inline: 6px !important;
    font-size: 11.5px !important;
  }
  .feed-tabs button.active::after { bottom: 3px !important; width: 24px !important; }
  .top-row > .icon-btn {
    flex: 0 0 43px !important;
    width: 43px !important;
    height: 43px !important;
    min-width: 43px !important;
    min-height: 43px !important;
    padding: 0 !important;
    background: rgba(255,255,255,.075) !important;
    border-color: rgba(255,255,255,.13) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 10px 24px rgba(0,0,0,.18) !important;
  }
  .location-row {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 1px 0 3px !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
    mask-image: linear-gradient(90deg,#000 0,#000 calc(100% - 18px),transparent 100%);
  }
  .location-row::-webkit-scrollbar { display: none !important; }
  .location-row > * { flex: 0 0 auto !important; }
  .location-row .area-chip { max-width: min(44vw, 178px) !important; }
  .location-row .account-top-chip { max-width: 122px !important; }

  .card-info,
  .reel-card.home-title-only .card-info {
    left: 12px !important;
    right: 58px !important;
    bottom: calc(108px + var(--safe-bottom)) !important;
    max-height: 142px !important;
    gap: 5px !important;
    padding: 9px 10px 8px !important;
    border-radius: 19px !important;
    border: 1px solid rgba(255,255,255,.105) !important;
    background:
      linear-gradient(145deg, rgba(2,8,11,.72), rgba(2,8,11,.42)),
      radial-gradient(circle at 8% 0, rgba(45,245,207,.10), transparent 40%) !important;
    box-shadow: 0 18px 42px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.07) !important;
    backdrop-filter: blur(14px) saturate(1.08) !important;
    text-shadow: 0 2px 10px rgba(0,0,0,.72) !important;
    contain: layout paint !important;
  }
  .product-meta-row { min-height: 29px !important; height: 29px !important; gap: 5px !important; }
  .product-meta-row .seller-line,
  .card-info .seller-line {
    max-width: 55% !important;
    min-height: 28px !important;
    height: 28px !important;
    padding: 2px 7px 2px 3px !important;
    background: rgba(255,255,255,.055) !important;
    border-color: rgba(255,255,255,.12) !important;
    box-shadow: none !important;
  }
  .card-info .seller-line .avatar { width: 23px !important; height: 23px !important; min-width: 23px !important; }
  .card-info .seller-name { font-size: 10.5px !important; }
  .card-info .seller-area { font-size: 7.8px !important; }
  .product-meta-row .badge-line { height: 28px !important; gap: 4px !important; }
  .badge-line .badge {
    height: 20px !important;
    min-height: 20px !important;
    padding: 0 7px !important;
    line-height: 20px !important;
    font-size: 7.7px !important;
    border-color: rgba(255,255,255,.11) !important;
    background: rgba(255,255,255,.075) !important;
  }
  .badge-line .badge.available,
  .badge-line .badge.service { background: rgba(45,245,207,.14) !important; color: #dcfff8 !important; }
  .card-info h1,
  .reel-card.home-title-only .card-info h1 {
    font-size: clamp(20px, 5.65vw, 25px) !important;
    line-height: 1.075 !important;
    letter-spacing: -.034em !important;
    max-height: 2.16em !important;
  }
  .reel-card.title-long .card-info h1 { font-size: clamp(18.5px, 5.1vw, 22.5px) !important; }
  .reel-card.title-xlong .card-info h1 { font-size: clamp(17px, 4.62vw, 20.5px) !important; }
  .reel-card.title-xxlong .card-info h1 { font-size: clamp(15.8px, 4.18vw, 18.8px) !important; }
  .card-info .tag-line { min-height: 20px !important; max-height: 20px !important; gap: 4px !important; }
  .card-info .tag-line .tag {
    height: 19px !important;
    min-height: 19px !important;
    padding: 0 7px !important;
    line-height: 19px !important;
    font-size: 8px !important;
    background: rgba(255,255,255,.055) !important;
    border-color: rgba(255,255,255,.105) !important;
  }

  /* Photo count and dots behave like one compact gallery HUD. */
  .feed-photo-count {
    bottom: calc(260px + var(--safe-bottom)) !important;
    right: 62px !important;
    height: 26px !important;
    min-width: 40px !important;
    padding: 0 8px !important;
    font-size: 9.5px !important;
    background: rgba(2,8,11,.68) !important;
    border-color: rgba(255,255,255,.15) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.25) !important;
  }
  .media-dots {
    bottom: calc(260px + var(--safe-bottom)) !important;
    right: 108px !important;
    min-width: 48px !important;
    min-height: 26px !important;
    height: 26px !important;
    padding: 5px 8px !important;
    background: rgba(2,8,11,.58) !important;
    border-color: rgba(255,255,255,.13) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.22) !important;
  }
  .media-dots button { width: 5px !important; height: 5px !important; }
  .media-dots button.active { width: 20px !important; }

  /* The mobile action rail becomes a slim dock, not loose bubbles over the product. */
  .reel-card.is-active .action-rail {
    right: 5px !important;
    width: 46px !important;
    max-width: 46px !important;
    padding: 7px 3px !important;
    gap: 7px !important;
    border-radius: 27px !important;
    border: 1px solid rgba(255,255,255,.105) !important;
    background: linear-gradient(180deg, rgba(2,8,11,.44), rgba(2,8,11,.28)) !important;
    box-shadow: 0 18px 36px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.07) !important;
    backdrop-filter: blur(13px) saturate(1.08) !important;
    filter: none !important;
  }
  .reel-card.is-active .action,
  .action { width: 40px !important; min-height: 38px !important; }
  .reel-card.is-active .action span,
  .action span { width: 34px !important; height: 34px !important; min-width: 34px !important; min-height: 34px !important; }
  .reel-card.is-active .action b,
  .action b { display: none !important; }
  .showcase-meter { display: none !important; }
  .media-nav-controls { display: none !important; }
}

@media (max-width: 390px) {
  .top-row .feed-tabs { max-width: 202px !important; }
  .feed-tabs button { font-size: 10.6px !important; padding-inline: 4px !important; }
  .top-row > .icon-btn { width: 40px !important; min-width: 40px !important; height: 40px !important; min-height: 40px !important; }
  .card-info,
  .reel-card.home-title-only .card-info { left: 10px !important; right: 54px !important; bottom: calc(104px + var(--safe-bottom)) !important; padding: 8px 9px 7px !important; }
  .feed-photo-count { bottom: calc(244px + var(--safe-bottom)) !important; right: 57px !important; }
  .media-dots { bottom: calc(244px + var(--safe-bottom)) !important; right: 102px !important; }
}

@media (max-height: 690px) and (max-width: 720px) {
  .card-info,
  .reel-card.home-title-only .card-info { bottom: calc(96px + var(--safe-bottom)) !important; max-height: 124px !important; }
  .feed-photo-count,
  .media-dots { bottom: calc(216px + var(--safe-bottom)) !important; }
}

/* Tablet: keep the immersive feed but expose photo controls on pointer devices. */
@media (min-width: 721px) and (max-width: 1099px) {
  .media-wrap { border-radius: 22px !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.10) !important; }
  .reel-card.is-active .action-rail {
    right: 18px !important;
    width: 58px !important;
    padding: 8px 5px !important;
    border-radius: 30px !important;
    background: rgba(2,8,11,.46) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    backdrop-filter: blur(16px) !important;
  }
  .media-nav-button { opacity: .72; }
  .showcase-meter { display: none !important; }
}

/* Desktop: one premium product stage, with actions genuinely floating on the photo. */
@media (min-width: 1100px) {
  .phone {
    --vc97-stage-left: clamp(272px, 18vw, 344px);
    --vc97-stage-right: clamp(112px, 8.7vw, 170px);
  }
  .desktop-sidebar {
    width: 218px !important;
    padding: 18px 14px 16px !important;
    gap: 13px !important;
    background: linear-gradient(180deg, rgba(0,0,0,.97), rgba(1,5,7,.94)) !important;
    border-right-color: rgba(255,255,255,.07) !important;
  }
  .desktop-logo { min-height: 74px !important; }
  .desktop-logo img.desktop-full-logo,
  .desktop-logo img { width: 116px !important; height: 70px !important; max-width: 116px !important; }
  .desktop-nav { gap: 3px !important; }
  .desktop-nav button { min-height: 40px !important; border-radius: 13px !important; }
  .desktop-nav button:hover { background: rgba(255,255,255,.065) !important; }
  .desktop-nav button.active { background: linear-gradient(90deg, rgba(45,245,207,.14), rgba(255,255,255,.025)) !important; }
  .desktop-top-actions { top: 18px !important; right: 18px !important; gap: 8px !important; }
  .desktop-top-actions button { min-height: 39px !important; padding-inline: 15px !important; }

  .topbar {
    left: 218px !important;
    height: 84px !important;
    padding: 16px 246px 0 22px !important;
    background: linear-gradient(180deg, rgba(0,0,0,.88), rgba(0,0,0,.38) 72%, transparent) !important;
  }
  .location-row { left: 242px !important; top: 18px !important; gap: 8px !important; }
  .location-row .area-chip,
  .location-row .tiny-lang,
  .location-row .tiny-ai,
  .location-row .account-top-chip,
  .location-row .ghost-dot { height: 39px !important; min-height: 39px !important; }
  .top-row { max-width: 530px !important; gap: 9px !important; }
  .top-row .feed-tabs,
  .feed-tabs {
    width: 286px !important;
    height: 42px !important;
    min-height: 42px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  .feed-tabs button { min-height: 42px !important; padding: 0 15px !important; font-size: 12.5px !important; }

  .media-wrap,
  .reel-card.media-portrait .media-wrap.photo,
  .reel-card.media-squareish .media-wrap.photo {
    top: 82px !important;
    bottom: 24px !important;
    left: var(--vc97-stage-left) !important;
    right: var(--vc97-stage-right) !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    border-radius: 24px !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    background: #030709 !important;
    box-shadow: 0 28px 90px rgba(0,0,0,.62), 0 0 0 1px rgba(45,245,207,.035), inset 0 1px 0 rgba(255,255,255,.06) !important;
  }
  .media-wrap.photo .media-bg { opacity: .50 !important; filter: blur(25px) brightness(.54) saturate(1.13) !important; }
  .reel-card.media-landscape .media-wrap.photo .media-main { object-fit: cover !important; object-position: center center !important; }
  .reel-card.media-portrait .media-wrap.photo .media-main,
  .reel-card.media-squareish .media-wrap.photo .media-main { object-fit: contain !important; object-position: center center !important; }
  .media-wrap.photo::after {
    background:
      linear-gradient(180deg, rgba(0,0,0,.12), transparent 34%, rgba(0,0,0,.03) 56%, rgba(0,0,0,.58) 100%),
      radial-gradient(ellipse at 14% 88%, rgba(0,0,0,.54), transparent 55%) !important;
  }

  .card-info,
  .reel-card.media-portrait .card-info,
  .reel-card.media-squareish .card-info,
  .reel-card.home-title-only .card-info {
    left: calc(var(--vc97-stage-left) + 24px) !important;
    right: auto !important;
    bottom: 46px !important;
    width: min(610px, calc(100vw - var(--vc97-stage-left) - var(--vc97-stage-right) - 150px)) !important;
    max-width: 610px !important;
    max-height: 170px !important;
    gap: 7px !important;
    padding: 13px 15px 12px !important;
    border-radius: 22px !important;
    border: 1px solid rgba(255,255,255,.11) !important;
    background: linear-gradient(145deg, rgba(2,7,10,.74), rgba(2,7,10,.40)) !important;
    box-shadow: 0 20px 50px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.07) !important;
    backdrop-filter: blur(17px) saturate(1.08) !important;
    text-shadow: 0 2px 12px rgba(0,0,0,.64) !important;
  }
  .product-meta-row { min-height: 34px !important; height: 34px !important; }
  .product-meta-row .seller-line,
  .card-info .seller-line {
    min-height: 32px !important;
    height: 32px !important;
    max-width: 54% !important;
    padding: 3px 9px 3px 3px !important;
    background: rgba(255,255,255,.055) !important;
    border-color: rgba(255,255,255,.11) !important;
    box-shadow: none !important;
  }
  .card-info .seller-line .avatar { width: 26px !important; height: 26px !important; min-width: 26px !important; }
  .card-info .seller-name { font-size: 11.5px !important; }
  .card-info .seller-area { font-size: 8.8px !important; }
  .product-meta-row .badge-line { height: 32px !important; }
  .badge-line .badge { min-height: 22px !important; height: 22px !important; line-height: 22px !important; padding: 0 8px !important; font-size: 8.3px !important; }
  .card-info h1,
  .reel-card.home-title-only .card-info h1 {
    font-size: clamp(25px, 1.95vw, 33px) !important;
    line-height: 1.035 !important;
    letter-spacing: -.038em !important;
    max-height: 2.08em !important;
  }
  .reel-card.title-long .card-info h1 { font-size: clamp(23px, 1.72vw, 29px) !important; }
  .reel-card.title-xlong .card-info h1 { font-size: clamp(21px, 1.55vw, 26px) !important; }
  .reel-card.title-xxlong .card-info h1 { font-size: clamp(19px, 1.38vw, 23px) !important; }
  .card-info .tag-line { min-height: 23px !important; max-height: 23px !important; gap: 5px !important; }
  .card-info .tag-line .tag { height: 22px !important; min-height: 22px !important; line-height: 22px !important; padding: 0 8px !important; font-size: 8.8px !important; }

  /* The rail sits INSIDE the right edge of the image. Labels appear only on hover/focus. */
  .reel-card.is-active .action-rail,
  .reel-card.media-portrait.is-active .action-rail,
  .reel-card.media-squareish.is-active .action-rail {
    top: 50% !important;
    right: calc(var(--vc97-stage-right) + 15px) !important;
    bottom: auto !important;
    width: 54px !important;
    max-height: calc(100dvh - 150px) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    padding: 8px 5px !important;
    border-radius: 30px !important;
    border: 1px solid rgba(255,255,255,.115) !important;
    background: linear-gradient(180deg, rgba(2,8,11,.58), rgba(2,8,11,.34)) !important;
    box-shadow: 0 22px 52px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.08) !important;
    backdrop-filter: blur(18px) saturate(1.12) !important;
    filter: none !important;
    transform: translateY(-46%) !important;
    opacity: .72 !important;
    transition: opacity .16s ease, transform .18s ease, border-color .16s ease !important;
    overflow: visible !important;
  }
  .reel-card.is-active:hover .action-rail,
  .reel-card.is-active.is-inspecting .action-rail,
  .reel-card.is-active .action-rail:hover,
  .reel-card.is-active .action-rail:focus-within {
    opacity: 1 !important;
    transform: translateY(-50%) !important;
    border-color: rgba(45,245,207,.24) !important;
  }
  .reel-card.is-active .action,
  .action {
    position: relative !important;
    width: 44px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    overflow: visible !important;
  }
  .reel-card.is-active .action span,
  .action span {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    border-color: rgba(255,255,255,.16) !important;
    background: rgba(3,9,12,.68) !important;
    box-shadow: 0 12px 28px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.11) !important;
  }
  .reel-card.is-active .action svg,
  .action svg { width: 19px !important; height: 19px !important; }
  .reel-card.is-active .action b,
  .action b {
    position: absolute !important;
    right: 51px !important;
    top: 50% !important;
    width: max-content !important;
    max-width: 160px !important;
    min-height: 31px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 11px !important;
    border-radius: 999px !important;
    background: rgba(2,8,11,.88) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 880 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    text-shadow: none !important;
    box-shadow: 0 14px 32px rgba(0,0,0,.34) !important;
    backdrop-filter: blur(14px) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translate(7px,-50%) !important;
    transition: opacity .14s ease, transform .14s ease !important;
  }
  .reel-card.is-active .action:hover b,
  .reel-card.is-active .action:focus-visible b { opacity: 1 !important; transform: translate(0,-50%) !important; }
  .reel-card.is-active .action:hover span,
  .reel-card.is-active .action:focus-visible span { border-color: rgba(45,245,207,.42) !important; transform: scale(1.055) !important; }
  .reel-card.is-active .action.get span,
  .reel-card.is-active .action.book span,
  .reel-card.is-active .action.chat span,
  .reel-card.is-active .action.live span {
    background: linear-gradient(145deg,#2af4d3,#27eca1) !important;
    color: #031414 !important;
    border: 0 !important;
  }

  .feed-photo-count {
    top: 98px !important;
    right: calc(var(--vc97-stage-right) + 17px) !important;
    bottom: auto !important;
    height: 29px !important;
    min-width: 43px !important;
    padding: 0 9px !important;
    font-size: 10px !important;
    background: rgba(2,8,11,.60) !important;
    border-color: rgba(255,255,255,.15) !important;
  }
  .media-dots {
    left: calc((var(--v99-stage-left, 258px) + (100% - var(--v99-stage-right, 205px))) / 2) !important;
    right: auto !important;
    top: auto !important;
    bottom: 42px !important;
    min-height: 26px !important;
    padding: 6px 9px !important;
    transform: translateX(-50%) !important;
    background: rgba(2,8,11,.52) !important;
    border-color: rgba(255,255,255,.13) !important;
  }
  .media-dots button { width: 6px !important; height: 6px !important; }
  .media-dots button.active { width: 24px !important; }

  .showcase-meter {
    left: var(--vc97-stage-left) !important;
    right: var(--vc97-stage-right) !important;
    bottom: 24px !important;
    border-radius: 0 0 24px 24px !important;
  }
  .desktop-scroll-controls { right: 20px !important; gap: 10px !important; }
  .desktop-scroll-controls button { width: 44px !important; height: 44px !important; }
}

@media (min-width: 1100px) and (max-height: 760px) {
  .media-wrap,
  .reel-card.media-portrait .media-wrap.photo,
  .reel-card.media-squareish .media-wrap.photo { top: 72px !important; bottom: 16px !important; }
  .card-info,
  .reel-card.media-portrait .card-info,
  .reel-card.media-squareish .card-info,
  .reel-card.home-title-only .card-info { bottom: 34px !important; max-height: 150px !important; }
  .showcase-meter { bottom: 16px !important; }
  .media-dots { bottom: 32px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .media-nav-button,
  .reel-card.is-active .action-rail,
  .reel-card.is-active .action b,
  .showcase-meter::after { transition: none !important; animation: none !important; }
  .showcase-meter { display: none !important; }
}

/* v97 correction: gallery HUD coordinates are relative to the media stage itself. */
@media (min-width: 1100px) {
  .feed-photo-count {
    top: 16px !important;
    right: 16px !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
  }
  .media-dots {
    left: 50% !important;
    right: auto !important;
    top: auto !important;
    bottom: 18px !important;
    transform: translateX(-50%) !important;
  }
}

/* ========================================================================
   v98.0.0 · Restored clean feed geometry and unified desktop controls
   - keeps the automatic showcase progress meter
   - removes photo-covering gallery arrows and card/dock backgrounds
   - places desktop controls in one shelf outside the product media
   - keeps desktop action hover labels/toasts in the right black gutter
   ======================================================================== */

/* v98 never renders the v97 previous/next overlay arrows. Swipe, dots and
   keyboard navigation remain available. */
.media-nav-controls,
.media-nav-button {
  display: none !important;
}

/* The duplicate desktop Account/Packages row was removed from the markup.
   These guards also keep stale cached markup from showing it. */
.desktop-login,
.desktop-top-actions {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Restore a caption that feels painted onto the media instead of a second card. */
.card-info,
.reel-card.home-title-only .card-info {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Keep the automatic product progress line visible. */
.showcase-meter {
  display: block !important;
  height: 3px !important;
  border: 0 !important;
  background: rgba(255,255,255,.10) !important;
  box-shadow: none !important;
}

/* Phones and small tablets: restore the calm pre-v97 composition. */
@media (max-width: 1099px) {
  .card-info,
  .reel-card.home-title-only .card-info {
    left: 15px !important;
    right: 62px !important;
    bottom: calc(118px + var(--safe-bottom)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: 130px !important;
    padding: 0 !important;
    gap: 5px !important;
    overflow: hidden !important;
    contain: layout paint !important;
    text-shadow: 0 3px 13px rgba(0,0,0,.86), 0 10px 30px rgba(0,0,0,.42) !important;
  }
  .card-info h1,
  .reel-card.home-title-only .card-info h1 {
    margin: 0 !important;
    font-size: clamp(21px, 5.95vw, 26px) !important;
    line-height: 1.075 !important;
    letter-spacing: -.037em !important;
    max-height: 2.16em !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
  }
  .reel-card.title-long .card-info h1 { font-size: clamp(19px, 5.25vw, 23px) !important; }
  .reel-card.title-xlong .card-info h1 { font-size: clamp(17.5px, 4.75vw, 21px) !important; }
  .reel-card.title-xxlong .card-info h1 { font-size: clamp(16.5px, 4.35vw, 19.5px) !important; }

  /* Seller and status keep their own readable chips, but the caption has no box. */
  .product-meta-row { min-height: 30px !important; height: 30px !important; gap: 5px !important; }
  .product-meta-row .seller-line,
  .card-info .seller-line {
    max-width: 49% !important;
    min-height: 29px !important;
    height: 29px !important;
    padding: 2px 7px 2px 3px !important;
    background: rgba(3,12,15,.58) !important;
    border: 1px solid rgba(55,238,216,.20) !important;
    box-shadow: 0 7px 18px rgba(0,0,0,.20) !important;
  }
  .card-info .seller-line .avatar { width: 24px !important; height: 24px !important; min-width: 24px !important; }
  .card-info .seller-name { font-size: 10.5px !important; }
  .card-info .seller-area { font-size: 8px !important; }
  .product-meta-row .badge-line { height: 29px !important; }
  .badge-line .badge {
    height: 20px !important;
    min-height: 20px !important;
    padding: 0 7px !important;
    line-height: 20px !important;
    font-size: 7.8px !important;
    box-shadow: none !important;
  }
  .card-info .tag-line { min-height: 21px !important; max-height: 21px !important; gap: 5px !important; }
  .card-info .tag-line .tag {
    height: 20px !important;
    min-height: 20px !important;
    padding: 0 7px !important;
    line-height: 20px !important;
    font-size: 8.5px !important;
  }

  /* The gallery HUD is one tidy row above the caption, never through the title. */
  .feed-photo-count {
    top: auto !important;
    bottom: calc(252px + var(--safe-bottom)) !important;
    right: 61px !important;
    left: auto !important;
    transform: none !important;
    min-width: 40px !important;
    height: 26px !important;
    padding: 0 8px !important;
    font-size: 9.5px !important;
    z-index: 94 !important;
  }
  .media-dots {
    top: auto !important;
    bottom: calc(252px + var(--safe-bottom)) !important;
    right: 107px !important;
    left: auto !important;
    transform: none !important;
    min-width: 49px !important;
    min-height: 26px !important;
    height: 26px !important;
    padding: 5px 8px !important;
    z-index: 93 !important;
  }
  .media-dots button { width: 5px !important; height: 5px !important; }
  .media-dots button.active { width: 20px !important; }

  /* No large glass capsule behind the mobile action buttons. Existing priority/
     More behaviour still keeps the rail compact. */
  .reel-card.is-active .action-rail,
  .reel-card.media-portrait.is-active .action-rail,
  .reel-card.media-squareish.is-active .action-rail {
    right: 4px !important;
    width: 44px !important;
    max-width: 44px !important;
    padding: 0 !important;
    gap: 7px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    filter: none !important;
  }
  .reel-card.is-active .action,
  .action { width: 42px !important; min-height: 38px !important; }
  .reel-card.is-active .action span,
  .action span { width: 34px !important; height: 34px !important; min-width: 34px !important; min-height: 34px !important; }
  .reel-card.is-active .action b,
  .action b { display: none !important; }

  /* The progress line sits at the media/caption seam and restarts for each item. */
  .showcase-meter {
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    bottom: calc(278px + var(--safe-bottom)) !important;
    border-radius: 0 !important;
    z-index: 95 !important;
  }

  /* Leave a deliberate right lane for actions on small phones. */
  .vi-ai-dock,
  #globalAiDock {
    left: 12px !important;
    right: auto !important;
    transform: none !important;
    width: calc(100vw - 78px) !important;
    max-width: 390px !important;
  }
  body.global-ai-keyboard-open .vi-ai-dock,
  body.global-ai-keyboard-open #globalAiDock {
    left: 9px !important;
    width: calc(100vw - 18px) !important;
    max-width: none !important;
  }
}

@media (max-width: 390px) {
  .card-info,
  .reel-card.home-title-only .card-info {
    left: 13px !important;
    right: 56px !important;
    bottom: calc(112px + var(--safe-bottom)) !important;
  }
  .card-info h1,
  .reel-card.home-title-only .card-info h1 { font-size: clamp(20px, 5.85vw, 24px) !important; }
  .reel-card.title-long .card-info h1 { font-size: clamp(18.5px, 5.15vw, 22px) !important; }
  .reel-card.title-xlong .card-info h1 { font-size: clamp(17px, 4.65vw, 20px) !important; }
  .reel-card.title-xxlong .card-info h1 { font-size: clamp(16px, 4.25vw, 18.5px) !important; }
  .feed-photo-count { bottom: calc(238px + var(--safe-bottom)) !important; right: 56px !important; }
  .media-dots { bottom: calc(238px + var(--safe-bottom)) !important; right: 101px !important; }
  .showcase-meter { bottom: calc(265px + var(--safe-bottom)) !important; }
  .vi-ai-dock,
  #globalAiDock { width: calc(100vw - 72px) !important; }
}

@media (max-height: 690px) and (max-width: 720px) {
  .card-info,
  .reel-card.home-title-only .card-info { bottom: calc(102px + var(--safe-bottom)) !important; max-height: 116px !important; }
  .feed-photo-count,
  .media-dots { bottom: calc(214px + var(--safe-bottom)) !important; }
  .showcase-meter { bottom: calc(241px + var(--safe-bottom)) !important; }
}

/* Desktop: one header shelf, one account control, media below it, actions in
   the right black gutter rather than on the product image. */
@media (min-width: 1100px) {
  .phone {
    --v98-stage-left: clamp(258px, 17vw, 310px);
    --v98-stage-right: clamp(205px, 15vw, 292px);
    width: 100vw !important;
    max-width: none !important;
    margin: 0 !important;
    height: 100dvh !important;
    background: #000 !important;
  }

  .topbar {
    position: fixed !important;
    z-index: 130 !important;
    top: 13px !important;
    left: 238px !important;
    right: 18px !important;
    width: auto !important;
    height: 64px !important;
    min-height: 64px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    padding: 8px 11px !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 20px !important;
    background: linear-gradient(180deg, rgba(6,10,13,.96), rgba(3,7,10,.91)) !important;
    box-shadow: 0 18px 46px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06) !important;
    backdrop-filter: blur(18px) saturate(1.05) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.05) !important;
    overflow: hidden !important;
  }
  .topbar .top-row {
    position: static !important;
    inset: auto !important;
    order: 1 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }
  .top-row .brand { display: none !important; }
  .top-row .feed-tabs,
  .feed-tabs {
    flex: 0 0 276px !important;
    width: 276px !important;
    max-width: 276px !important;
    min-height: 42px !important;
    height: 42px !important;
    padding: 0 5px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .feed-tabs button {
    min-height: 42px !important;
    padding: 0 13px !important;
    font-size: 12px !important;
  }
  .top-row > .icon-btn {
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
  }
  .topbar .location-row {
    position: static !important;
    inset: auto !important;
    order: 2 !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    height: 46px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
  }
  .topbar .location-row::-webkit-scrollbar { display: none !important; }
  .topbar .location-row > * { flex: 0 0 auto !important; }
  .location-row .area-chip { max-width: 220px !important; height: 42px !important; min-height: 42px !important; }
  .location-row .tiny-lang,
  .location-row .tiny-ai,
  .location-row .account-top-chip,
  .location-row .ghost-dot { height: 42px !important; min-height: 42px !important; }
  .location-row .account-top-chip { max-width: 150px !important; }

  .media-wrap,
  .reel-card.media-portrait .media-wrap.photo,
  .reel-card.media-squareish .media-wrap.photo {
    top: 92px !important;
    bottom: 18px !important;
    left: var(--v98-stage-left) !important;
    right: var(--v98-stage-right) !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    border-radius: 23px !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    background: #020507 !important;
    box-shadow: 0 28px 78px rgba(0,0,0,.56), inset 0 1px 0 rgba(255,255,255,.05) !important;
  }
  .reel-card.media-landscape .media-wrap.photo .media-main { object-fit: cover !important; object-position: center !important; }
  .reel-card.media-portrait .media-wrap.photo .media-main,
  .reel-card.media-squareish .media-wrap.photo .media-main { object-fit: contain !important; object-position: center !important; }

  .card-info,
  .reel-card.media-portrait .card-info,
  .reel-card.media-squareish .card-info,
  .reel-card.home-title-only .card-info {
    left: calc(var(--v98-stage-left) + 22px) !important;
    right: auto !important;
    bottom: 42px !important;
    width: min(620px, calc(100vw - var(--v98-stage-left) - var(--v98-stage-right) - 70px)) !important;
    max-width: 620px !important;
    max-height: 154px !important;
    padding: 0 !important;
    gap: 6px !important;
    overflow: hidden !important;
    text-shadow: 0 3px 14px rgba(0,0,0,.88), 0 14px 34px rgba(0,0,0,.48) !important;
  }
  .product-meta-row { min-height: 32px !important; height: 32px !important; }
  .product-meta-row .seller-line,
  .card-info .seller-line {
    min-height: 31px !important;
    height: 31px !important;
    max-width: 52% !important;
    padding: 3px 9px 3px 3px !important;
    background: rgba(2,8,11,.52) !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.24) !important;
  }
  .card-info .seller-line .avatar { width: 26px !important; height: 26px !important; min-width: 26px !important; }
  .card-info h1,
  .reel-card.home-title-only .card-info h1 {
    font-size: clamp(25px, 1.85vw, 32px) !important;
    line-height: 1.04 !important;
    letter-spacing: -.038em !important;
    max-height: 2.10em !important;
  }
  .reel-card.title-long .card-info h1 { font-size: clamp(23px, 1.65vw, 29px) !important; }
  .reel-card.title-xlong .card-info h1 { font-size: clamp(21px, 1.48vw, 26px) !important; }
  .reel-card.title-xxlong .card-info h1 { font-size: clamp(19px, 1.34vw, 23px) !important; }

  /* Count and dots share one row above the caption. */
  .feed-photo-count {
    top: auto !important;
    bottom: 142px !important;
    right: 18px !important;
    left: auto !important;
    transform: none !important;
    height: 27px !important;
    min-width: 42px !important;
    padding: 0 8px !important;
    font-size: 9.5px !important;
  }
  .media-dots {
    top: auto !important;
    bottom: 142px !important;
    right: 66px !important;
    left: auto !important;
    transform: none !important;
    min-height: 27px !important;
    height: 27px !important;
    min-width: 50px !important;
    padding: 5px 8px !important;
  }
  .media-dots button { width: 5px !important; height: 5px !important; }
  .media-dots button.active { width: 21px !important; }

  /* Outside-media desktop action lane. There is no enclosing background card. */
  .reel-card.is-active .action-rail,
  .reel-card.media-portrait.is-active .action-rail,
  .reel-card.media-squareish.is-active .action-rail {
    position: fixed !important;
    top: 50% !important;
    right: clamp(54px, 7.2vw, 118px) !important;
    bottom: auto !important;
    width: 54px !important;
    max-width: 54px !important;
    max-height: calc(100dvh - 150px) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    filter: none !important;
    transform: translateY(-48%) !important;
    opacity: .82 !important;
    overflow: visible !important;
  }
  .reel-card.is-active:hover .action-rail,
  .reel-card.is-active.is-inspecting .action-rail,
  .reel-card.is-active .action-rail:hover,
  .reel-card.is-active .action-rail:focus-within {
    opacity: 1 !important;
    transform: translateY(-50%) !important;
  }
  .reel-card.is-active .action,
  .action {
    position: relative !important;
    width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
  .reel-card.is-active .action span,
  .action span {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    background: rgba(4,9,12,.78) !important;
    box-shadow: 0 12px 28px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.09) !important;
    backdrop-filter: blur(12px) !important;
  }
  .reel-card.is-active .action.get span,
  .reel-card.is-active .action.book span,
  .reel-card.is-active .action.chat span,
  .reel-card.is-active .action.live span {
    background: linear-gradient(145deg,#2af4d3,#27eca1) !important;
    color: #031414 !important;
    border-color: transparent !important;
  }
  .reel-card.is-active .action b,
  .action b {
    position: absolute !important;
    right: 52px !important;
    top: 50% !important;
    width: max-content !important;
    max-width: 170px !important;
    min-height: 31px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 11px !important;
    border-radius: 999px !important;
    background: rgba(2,8,11,.92) !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 880 !important;
    white-space: nowrap !important;
    box-shadow: 0 14px 32px rgba(0,0,0,.34) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translate(7px,-50%) !important;
    transition: opacity .14s ease, transform .14s ease !important;
  }
  .reel-card.is-active .action:hover b,
  .reel-card.is-active .action:focus-visible b {
    opacity: 1 !important;
    transform: translate(0,-50%) !important;
  }
  .reel-card.is-active .action:hover span,
  .reel-card.is-active .action:focus-visible span {
    border-color: rgba(45,245,207,.42) !important;
    transform: scale(1.055) !important;
  }

  .showcase-meter {
    left: var(--v98-stage-left) !important;
    right: var(--v98-stage-right) !important;
    top: auto !important;
    bottom: 18px !important;
    border-radius: 0 0 23px 23px !important;
    z-index: 96 !important;
  }

  .desktop-scroll-controls { right: 16px !important; }
  .vi-ai-dock,
  #globalAiDock {
    left: calc((var(--v98-stage-left) + (100vw - var(--v98-stage-right))) / 2) !important;
    width: min(500px, calc(100vw - var(--v98-stage-left) - var(--v98-stage-right) - 90px)) !important;
    transform: translateX(-50%) !important;
  }
}

@media (min-width: 1100px) and (max-width: 1320px) {
  .topbar { left: 226px !important; gap: 7px !important; }
  .top-row .feed-tabs,
  .feed-tabs { flex-basis: 244px !important; width: 244px !important; max-width: 244px !important; }
  .feed-tabs button { padding-inline: 8px !important; font-size: 11px !important; }
  .location-row .area-chip { max-width: 170px !important; }
  .location-row .account-top-chip { max-width: 122px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .showcase-meter { display: none !important; }
}

/* ========================================================================
   v99.0.0 · Media-aware gallery, clean full-product framing and ordered UI
   - progress follows the rendered photo edge instead of a fixed viewport line
   - count-only gallery HUD in the rendered photo's top-right corner
   - every product photo uses non-cropping contain geometry
   - desktop controls start with Location and end with Notifications
   - all valid actions stay visible; the empty More/Less control is removed
   - the Vi AI composer regains a comfortable mobile width
   ======================================================================== */

/* The old dots capsule and stale More/Less control are intentionally gone. */
.media-dots,
.action-rail .rail-more {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.action-rail .rail-standard,
.action-rail .rail-secondary,
.action-rail .rail-priority {
  display: grid !important;
  visibility: visible !important;
}

/* Never crop merchandise or service photos. A quiet blurred canvas fills any
   letterbox space, while the real image remains complete and undistorted. */
.media-wrap.photo .media-main,
.media-wrap.carousel .media-main,
.reel-card.media-landscape .media-wrap.photo .media-main,
.reel-card.media-portrait .media-wrap.photo .media-main,
.reel-card.media-squareish .media-wrap.photo .media-main {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
  scale: 1 !important;
  padding: 0 !important;
  filter: saturate(1.035) contrast(1.015) !important;
}
.media-wrap.photo .media-bg,
.media-wrap.carousel .media-bg {
  inset: -28px !important;
  width: calc(100% + 56px) !important;
  height: calc(100% + 56px) !important;
  object-fit: cover !important;
  opacity: .30 !important;
  filter: blur(28px) saturate(1.10) brightness(.62) !important;
  transform: scale(1.045) !important;
}

/* The meter is now a child of .media-wrap. JavaScript supplies the precise
   contain-box coordinates for every aspect ratio and every viewport size. */
.media-wrap > .showcase-meter {
  display: block !important;
  position: absolute !important;
  z-index: 98 !important;
  left: var(--media-content-left, 0px) !important;
  right: auto !important;
  top: auto !important;
  bottom: calc(var(--media-content-bottom, 0px) + 1px) !important;
  width: var(--media-content-width, 100%) !important;
  height: 4px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: rgba(0,0,0,.72) !important;
  border: 1px solid rgba(255,255,255,.34) !important;
  box-shadow: 0 0 0 1px rgba(0,0,0,.48), 0 0 13px rgba(32,242,221,.52) !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.reel-card.is-active.showcase-running .media-wrap > .showcase-meter {
  opacity: .98 !important;
}
.media-wrap > .showcase-meter::after {
  height: 100% !important;
  background: linear-gradient(90deg,#00fff0 0%,#7dffe9 48%,#ff2f8b 100%) !important;
  box-shadow: 0 0 12px rgba(0,255,240,.95), 0 0 20px rgba(255,47,139,.58) !important;
}

/* One counter only. It stays in the top-right corner of the visible image,
   even when a wide or tall photo is letterboxed inside the stage. */
.media-wrap.carousel > .feed-photo-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: absolute !important;
  z-index: 99 !important;
  top: calc(var(--media-content-top, 0px) + 12px) !important;
  right: calc(var(--media-content-right, 0px) + 12px) !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
  min-width: 42px !important;
  width: auto !important;
  height: 27px !important;
  padding: 0 9px !important;
  border-radius: 999px !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: .01em !important;
  background: rgba(2,7,10,.78) !important;
  border: 1px solid rgba(255,255,255,.24) !important;
  box-shadow: 0 9px 24px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.10) !important;
  backdrop-filter: blur(12px) saturate(1.08) !important;
}
.media-wrap:not(.carousel) > .feed-photo-count,
.feed-photo-count:empty { display: none !important; }

/* Phones and tablets: all genuine actions are visible in one calm, scroll-safe
   rail. The composer can use the full practical width beneath the media. */
@media (max-width: 1099px) {
  .reel-card.is-active .action-rail,
  .reel-card.media-portrait.is-active .action-rail,
  .reel-card.media-squareish.is-active .action-rail {
    position: absolute !important;
    top: max(calc(var(--media-content-top, 0px) + 56px), calc(clamp(190px, 27dvh, 285px) + env(safe-area-inset-top))) !important;
    right: 4px !important;
    bottom: calc(142px + var(--safe-bottom)) !important;
    width: 44px !important;
    max-width: 44px !important;
    max-height: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    padding: 2px 0 !important;
    overflow-y: auto !important;
    overflow-x: visible !important;
    scrollbar-width: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    transform: none !important;
  }
  .reel-card.is-active .action-rail::-webkit-scrollbar { display: none !important; }
  .reel-card.is-active .action,
  .action {
    flex: 0 0 38px !important;
    width: 42px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
  }
  .reel-card.is-active .action span,
  .action span {
    width: 35px !important;
    height: 35px !important;
    min-width: 35px !important;
    min-height: 35px !important;
  }
  .reel-card.is-active .action b,
  .action b { display: none !important; }

  .vi-ai-dock,
  #globalAiDock {
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
  }
  body.global-ai-keyboard-open .vi-ai-dock,
  body.global-ai-keyboard-open #globalAiDock {
    left: 9px !important;
    right: 9px !important;
    width: auto !important;
  }
}

@media (max-width: 390px), (max-height: 690px) and (max-width: 720px) {
  .reel-card.is-active .action-rail,
  .reel-card.media-portrait.is-active .action-rail,
  .reel-card.media-squareish.is-active .action-rail {
    top: calc(165px + env(safe-area-inset-top)) !important;
    bottom: calc(124px + var(--safe-bottom)) !important;
    gap: 3px !important;
  }
  .reel-card.is-active .action,
  .action { flex-basis: 35px !important; height: 35px !important; min-height: 35px !important; }
  .reel-card.is-active .action span,
  .action span { width: 32px !important; height: 32px !important; min-width: 32px !important; min-height: 32px !important; }
}

/* Desktop: flatten the two markup rows into a single ordered shelf. Location
   begins the sequence; Notifications is always the final control. */
@media (min-width: 1100px) {
  .phone {
    --v99-stage-left: clamp(258px, 17vw, 310px);
    --v99-stage-right: clamp(205px, 15vw, 292px);
  }
  .topbar {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    padding: 8px 11px !important;
    overflow: visible !important;
  }
  .topbar .top-row,
  .topbar .location-row {
    display: contents !important;
  }
  .top-row .brand { display: none !important; }

  .topbar .area-chip {
    order: 1 !important;
    flex: 0 1 232px !important;
    width: auto !important;
    min-width: 155px !important;
    max-width: 232px !important;
    height: 42px !important;
  }
  .topbar .feed-tabs {
    order: 2 !important;
    flex: 0 1 270px !important;
    width: 270px !important;
    max-width: 270px !important;
    min-width: 220px !important;
  }
  .topbar .tiny-lang { order: 3 !important; }
  .topbar .tiny-ai { order: 4 !important; }
  .topbar .account-top-chip {
    order: 5 !important;
    flex: 0 1 148px !important;
    max-width: 148px !important;
  }
  .topbar .ghost-dot { order: 6 !important; }
  .topbar #searchOpen { order: 7 !important; }
  .topbar #notifyOpen {
    order: 8 !important;
    margin-left: auto !important;
  }
  .topbar .tiny-lang,
  .topbar .tiny-ai,
  .topbar .ghost-dot,
  .topbar #searchOpen,
  .topbar #notifyOpen {
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
  }

  /* Match all geometry to the v99 stage variables. */
  .media-wrap,
  .reel-card.media-portrait .media-wrap.photo,
  .reel-card.media-squareish .media-wrap.photo {
    left: var(--v99-stage-left) !important;
    right: var(--v99-stage-right) !important;
  }
  .card-info,
  .reel-card.media-portrait .card-info,
  .reel-card.media-squareish .card-info,
  .reel-card.home-title-only .card-info {
    left: calc(var(--v99-stage-left) + 22px) !important;
    width: min(620px, calc(100vw - var(--v99-stage-left) - var(--v99-stage-right) - 70px)) !important;
  }

  /* All actions are real buttons; no empty More/Less item follows Share. */
  .reel-card.is-active .action-rail,
  .reel-card.media-portrait.is-active .action-rail,
  .reel-card.media-squareish.is-active .action-rail {
    gap: 7px !important;
    overflow: visible !important;
  }
  .reel-card.is-active .action,
  .action { display: grid !important; }

  .vi-ai-dock,
  #globalAiDock {
    left: calc((var(--v99-stage-left) + (100vw - var(--v99-stage-right))) / 2) !important;
    width: min(560px, calc(100vw - var(--v99-stage-left) - var(--v99-stage-right) - 70px)) !important;
  }
}

@media (min-width: 1100px) and (max-width: 1320px) {
  .topbar { gap: 6px !important; }
  .topbar .area-chip { flex-basis: 172px !important; max-width: 172px !important; min-width: 142px !important; }
  .topbar .feed-tabs { flex-basis: 220px !important; width: 220px !important; max-width: 220px !important; min-width: 190px !important; }
  .topbar .feed-tabs button { padding-inline: 7px !important; font-size: 10.7px !important; }
  .topbar .account-top-chip { flex-basis: 112px !important; max-width: 112px !important; }
  .topbar .tiny-lang,
  .topbar .tiny-ai,
  .topbar .ghost-dot,
  .topbar #searchOpen,
  .topbar #notifyOpen { flex-basis: 39px !important; width: 39px !important; min-width: 39px !important; height: 39px !important; min-height: 39px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .media-wrap > .showcase-meter { display: none !important; }
}


/* ========================================================================
   v100.0.0 · Desktop full-product fit and centered command shelf
   - desktop product photos use a measured optical safe-frame, never cover/crop
   - low-resolution uploads are not enlarged into a soft, zoomed billboard
   - the desktop command shelf is one compact centered cluster
   - Account is penultimate and the three-dot Tools control is always last
   - Android/mobile layouts are intentionally unchanged from v99
   ======================================================================== */

@media (min-width: 1100px) {
  /* The JS supplies the exact contained size after reading the real source ratio.
     These fallbacks keep the first paint calm before image metadata arrives. */
  .media-wrap.photo .media-main,
  .media-wrap.carousel .media-main,
  .reel-card.media-landscape .media-wrap.photo .media-main,
  .reel-card.media-portrait .media-wrap.photo .media-main,
  .reel-card.media-squareish .media-wrap.photo .media-main {
    width: var(--media-main-width, calc(100% - clamp(56px, 7vmin, 112px))) !important;
    height: var(--media-main-height, calc(100% - clamp(56px, 7vmin, 112px))) !important;
    max-width: calc(100% - 36px) !important;
    max-height: calc(100% - 36px) !important;
    object-fit: contain !important;
    object-position: center center !important;
    padding: 0 !important;
    margin: auto !important;
    transform: none !important;
    scale: 1 !important;
    background: transparent !important;
    image-rendering: auto !important;
  }
  .media-wrap.photo.media-lowres .media-main,
  .media-wrap.carousel.media-lowres .media-main {
    filter: saturate(1.025) contrast(1.015) !important;
  }
  .media-wrap.photo .media-bg,
  .media-wrap.carousel .media-bg {
    opacity: .22 !important;
    filter: blur(34px) saturate(1.08) brightness(.54) !important;
  }
  .media-wrap.photo::before,
  .media-wrap.carousel::before {
    background:
      radial-gradient(circle at 50% 44%, rgba(255,255,255,.035), transparent 52%),
      linear-gradient(145deg, rgba(8,15,18,.92), rgba(1,4,6,.98)) !important;
  }

  /* One centered, compact desktop control cluster. No auto margins can tear the
     notification/search/tools controls away from the rest of the shelf. */
  .topbar {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-content: center !important;
    gap: 7px !important;
    padding: 8px 18px !important;
    overflow: visible !important;
  }
  .topbar .top-row,
  .topbar .location-row { display: contents !important; }
  .topbar > *,
  .topbar button {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .top-row .brand { display: none !important; }

  .topbar .area-chip {
    order: 1 !important;
    flex: 0 1 218px !important;
    width: auto !important;
    min-width: 160px !important;
    max-width: 218px !important;
    height: 42px !important;
  }
  .topbar .feed-tabs {
    order: 2 !important;
    flex: 0 0 258px !important;
    width: 258px !important;
    min-width: 258px !important;
    max-width: 258px !important;
  }
  .topbar .tiny-lang { order: 3 !important; }
  .topbar .tiny-ai { order: 4 !important; }
  .topbar #searchOpen { order: 5 !important; }
  .topbar #notifyOpen { order: 6 !important; }
  .topbar .account-top-chip {
    order: 7 !important;
    flex: 0 1 146px !important;
    width: auto !important;
    min-width: 112px !important;
    max-width: 146px !important;
  }
  .topbar .ghost-dot {
    order: 8 !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
  }
  .topbar .tiny-lang,
  .topbar .tiny-ai,
  .topbar #searchOpen,
  .topbar #notifyOpen {
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
  }
  .topbar #notifyOpen { margin-left: 0 !important; }
  .topbar .ghost-dot { margin-left: 0 !important; }

  .topbar .area-chip,
  .topbar .account-top-chip,
  .topbar .tiny-lang,
  .topbar .tiny-ai,
  .topbar #searchOpen,
  .topbar #notifyOpen,
  .topbar .ghost-dot {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 10px 24px rgba(0,0,0,.18) !important;
  }
  .topbar .feed-tabs button { padding-inline: 9px !important; }
}

@media (min-width: 1100px) and (max-width: 1320px) {
  .topbar { gap: 5px !important; padding-inline: 10px !important; }
  .topbar .area-chip { flex-basis: 168px !important; min-width: 138px !important; max-width: 168px !important; }
  .topbar .feed-tabs { flex-basis: 214px !important; width: 214px !important; min-width: 214px !important; max-width: 214px !important; }
  .topbar .feed-tabs button { padding-inline: 6px !important; font-size: 10.5px !important; }
  .topbar .account-top-chip { flex-basis: 108px !important; min-width: 96px !important; max-width: 108px !important; }
  .topbar .tiny-lang,
  .topbar .tiny-ai,
  .topbar #searchOpen,
  .topbar #notifyOpen,
  .topbar .ghost-dot {
    flex-basis: 39px !important;
    width: 39px !important;
    min-width: 39px !important;
    max-width: 39px !important;
    height: 39px !important;
    min-height: 39px !important;
  }
}


/* ========================================================================
   v101.0.0 · Caption-safe meter, compact shelf, anchored Tools dropdown
   - the desktop progress meter is clamped above the live caption boundary
   - the top command shelf hugs its controls, removing decorative empty ends
   - the Tools menu opens directly beneath the final three-dot trigger
   - mobile and Android presentation remain unchanged from v100
   ======================================================================== */
@media (min-width: 1100px) {
  .media-wrap > .showcase-meter {
    top: var(--media-meter-top, calc(var(--media-content-top, 0px) + var(--media-content-height, 100%) - 7px)) !important;
    bottom: auto !important;
    height: 4px !important;
    border-color: rgba(255,255,255,.46) !important;
    background: rgba(0,0,0,.80) !important;
    box-shadow: 0 0 0 1px rgba(0,0,0,.64), 0 0 16px rgba(30,245,219,.68), 0 0 9px rgba(255,48,143,.34) !important;
  }

  .topbar {
    left: calc(50% + 110px) !important;
    right: auto !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: calc(100vw - 274px) !important;
    height: 60px !important;
    min-height: 60px !important;
    padding: 8px 9px !important;
    gap: 7px !important;
    transform: translateX(-50%) !important;
    justify-content: center !important;
    border-radius: 20px !important;
    overflow: visible !important;
    isolation: isolate !important;
  }

  .topbar #viRadarBar {
    position: absolute !important;
    z-index: 1005 !important;
    top: calc(100% + 10px) !important;
    right: 0 !important;
    bottom: auto !important;
    left: auto !important;
    width: 272px !important;
    max-width: min(272px, calc(100vw - 28px)) !important;
    max-height: min(420px, calc(100dvh - 104px)) !important;
    margin: 0 !important;
    padding: 9px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border-radius: 22px !important;
    background: linear-gradient(165deg, rgba(6,13,17,.985), rgba(3,8,11,.97)) !important;
    border: 1px solid rgba(45,245,207,.23) !important;
    box-shadow: 0 24px 66px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.08) !important;
    backdrop-filter: blur(22px) saturate(1.12) !important;
    -webkit-backdrop-filter: blur(22px) saturate(1.12) !important;
    transform-origin: top right !important;
  }
  .topbar #viRadarBar.is-open {
    display: grid !important;
    animation: vcQuickMenuV101 .16s cubic-bezier(.2,.8,.2,1) both !important;
  }
  .topbar #viRadarBar:not(.is-open) { display: none !important; }
  .topbar #viRadarBar button {
    min-height: 49px !important;
    border-radius: 17px !important;
  }
}
@media (min-width: 1100px) and (max-width: 1320px) {
  .topbar {
    left: calc(50% + 108px) !important;
    max-width: calc(100vw - 252px) !important;
    padding-inline: 7px !important;
    gap: 5px !important;
  }
}
@keyframes vcQuickMenuV101 {
  from { opacity: 0; transform: translateY(-7px) scale(.975); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* ========================================================================
   v102.0.0 · Stable bottom progress rail and wider desktop Vi AI composer
   - desktop progress always runs beneath the complete product stage
   - it never crosses media, seller metadata, title, tags or the AI composer
   - desktop Vi AI is wider and easier to read/type in
   - mobile and Android-facing layouts remain unchanged from v101
   ======================================================================== */

/* Desktop-only duplicate is hidden everywhere until the desktop breakpoint. */
.showcase-meter-card { display: none !important; }

@media (min-width: 1100px) {
  /* v101's photo-aware rail remains available on smaller devices only. */
  .media-wrap > .showcase-meter-media { display: none !important; }

  /* One stable track underneath the whole usable stage, independent of image
     aspect ratio, letterboxing, caption height or Live/product type. */
  .reel-card > .showcase-meter-card {
    display: block !important;
    position: absolute !important;
    z-index: 110 !important;
    top: auto !important;
    bottom: 2px !important;
    left: calc(var(--v99-stage-left, 258px) + 4px) !important;
    right: calc(var(--v99-stage-right, 205px) + 4px) !important;
    width: auto !important;
    height: 5px !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(0,0,0,.90) !important;
    box-shadow:
      0 -1px 0 rgba(255,255,255,.28),
      0 0 0 1px rgba(0,0,0,.62),
      0 0 18px rgba(0,255,235,.58),
      0 0 11px rgba(255,45,139,.30) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: none !important;
  }
  .reel-card.is-active.showcase-running > .showcase-meter-card {
    opacity: .98 !important;
  }
  .reel-card > .showcase-meter-card::after {
    height: 100% !important;
    background: linear-gradient(90deg,#00fff0 0%,#69ffe7 48%,#ff2d8b 100%) !important;
    box-shadow: 0 0 14px rgba(0,255,240,.96), 0 0 22px rgba(255,45,139,.62) !important;
  }

  /* Wider, calmer desktop composer. It sits above the progress rail. */
  .vi-ai-dock,
  #globalAiDock {
    bottom: 24px !important;
    width: min(720px, calc(100vw - var(--v99-stage-left, 258px) - var(--v99-stage-right, 205px) - 48px)) !important;
    max-width: 720px !important;
    min-width: min(520px, calc(100vw - var(--v99-stage-left, 258px) - var(--v99-stage-right, 205px) - 48px)) !important;
    z-index: 124 !important;
  }
  .vi-ai-search,
  #globalAiForm {
    height: 58px !important;
    min-height: 58px !important;
    grid-template-columns: minmax(0,1fr) 48px !important;
    gap: 7px !important;
    padding: 5px !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg,rgba(4,11,15,.97),rgba(3,9,12,.94)) !important;
    border: 1px solid rgba(43,244,218,.34) !important;
    box-shadow: 0 18px 52px rgba(0,0,0,.50),0 0 0 1px rgba(255,255,255,.04),inset 0 1px 0 rgba(255,255,255,.10) !important;
  }
  .vi-ai-search input,
  #globalAiInput {
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 16px !important;
    font-size: 15px !important;
    line-height: 46px !important;
    letter-spacing: -.012em !important;
  }
  .vi-ai-search button,
  #globalAiSubmit {
    width: 48px !important;
    min-width: 48px !important;
    height: 46px !important;
    min-height: 46px !important;
    border-radius: 17px !important;
    font-size: 21px !important;
    box-shadow: 0 10px 25px rgba(20,242,190,.25),inset 0 1px 0 rgba(255,255,255,.30) !important;
  }
}

@media (min-width: 1100px) and (max-width: 1320px) {
  .reel-card > .showcase-meter-card {
    left: calc(var(--v99-stage-left, 226px) + 3px) !important;
    right: calc(var(--v99-stage-right, 190px) + 3px) !important;
  }
  .vi-ai-dock,
  #globalAiDock {
    width: min(620px, calc(100vw - var(--v99-stage-left, 226px) - var(--v99-stage-right, 190px) - 36px)) !important;
    max-width: 620px !important;
    min-width: min(470px, calc(100vw - var(--v99-stage-left, 226px) - var(--v99-stage-right, 190px) - 36px)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .reel-card > .showcase-meter-card { display: none !important; }
}

/* ========================================================================
   v103.0.0 · Inside-bottom progress rail + width-only desktop Vi AI
   - progress stays inside the product stage at the lower inner edge
   - Vi AI grows only in width and keeps the compact proven height
   - caption, title and tags retain a separate visible lane
   - mobile and Android-facing layouts remain unchanged from v102
   ======================================================================== */
@media (min-width: 1100px) {
  :root {
    --v103-ai-width: clamp(400px, 30vw, 520px);
  }

  /* Keep one timer inside the desktop product stage, below the photo/caption
     content and above the rounded card edge. */
  .reel-card {
    overflow: hidden !important;
  }
  .media-wrap > .showcase-meter-media {
    display: none !important;
  }
  .reel-card > .showcase-meter-card {
    display: block !important;
    position: absolute !important;
    z-index: 126 !important;
    top: auto !important;
    bottom: 4px !important;
    left: calc(var(--v99-stage-left, 258px) + 14px) !important;
    right: calc(var(--v99-stage-right, 205px) + 14px) !important;
    width: auto !important;
    height: 4px !important;
    min-height: 4px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255,255,255,.22) !important;
    border-radius: 999px !important;
    background: rgba(1,7,10,.84) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.11),
      0 0 0 1px rgba(0,0,0,.46),
      0 0 14px rgba(22,244,219,.42) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: none !important;
  }
  .reel-card.is-active.showcase-running > .showcase-meter-card {
    opacity: .98 !important;
  }
  .reel-card > .showcase-meter-card::after {
    height: 100% !important;
    border-radius: inherit !important;
    background: linear-gradient(90deg,#11f4e1 0%,#75ffe9 48%,#ff3a98 100%) !important;
    box-shadow: 0 0 12px rgba(18,255,232,.94), 0 0 18px rgba(255,47,143,.55) !important;
  }

  /* Width-only change. The established compact height is restored; the dock
     occupies the right caption lane and cannot cover product information. */
  .vi-ai-dock,
  #globalAiDock {
    left: auto !important;
    right: calc(var(--v99-stage-right, 205px) + 24px) !important;
    bottom: 12px !important;
    width: var(--v103-ai-width) !important;
    max-width: var(--v103-ai-width) !important;
    min-width: 0 !important;
    transform: none !important;
    z-index: 124 !important;
  }
  .vi-ai-search,
  #globalAiForm {
    height: 42px !important;
    min-height: 42px !important;
    grid-template-columns: minmax(0,1fr) 36px !important;
    gap: 5px !important;
    padding: 4px !important;
    border-radius: 18px !important;
    background: linear-gradient(180deg,rgba(4,11,15,.94),rgba(3,9,12,.91)) !important;
    border: 1px solid rgba(43,244,218,.30) !important;
    box-shadow: 0 12px 34px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.08) !important;
  }
  .vi-ai-search input,
  #globalAiInput {
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 12px !important;
    font-size: 13px !important;
    line-height: 34px !important;
  }
  .vi-ai-search button,
  #globalAiSubmit {
    width: 36px !important;
    min-width: 36px !important;
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 14px !important;
    font-size: 18px !important;
    box-shadow: 0 8px 20px rgba(20,242,190,.22), inset 0 1px 0 rgba(255,255,255,.28) !important;
  }

  .card-info,
  .reel-card.media-portrait .card-info,
  .reel-card.media-squareish .card-info,
  .reel-card.home-title-only .card-info {
    bottom: 48px !important;
    width: min(620px, calc(100vw - var(--v99-stage-left, 258px) - var(--v99-stage-right, 205px) - var(--v103-ai-width) - 72px)) !important;
    max-width: 620px !important;
  }
}

@media (min-width: 1100px) and (max-width: 1320px) {
  :root {
    --v103-ai-width: clamp(340px, 29vw, 430px);
  }
  .reel-card > .showcase-meter-card {
    left: calc(var(--v99-stage-left, 226px) + 12px) !important;
    right: calc(var(--v99-stage-right, 190px) + 12px) !important;
  }
  .vi-ai-dock,
  #globalAiDock {
    right: calc(var(--v99-stage-right, 190px) + 18px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .reel-card > .showcase-meter-card { display: none !important; }
}


/* ========================================================================
   v104.0.0 · Centered inside-card Vi AI + lower inner progress rail
   - on desktop the Vi AI dock is physically mounted inside the active card
   - the composer is centered in the lower card lane, never parked at the edge
   - the animated cyan/pink rail sits directly below it, inside the same card
   - caption metadata stays above both controls and remains fully readable
   - mobile and Android-facing layouts remain unchanged from v103
   ======================================================================== */
@media (min-width: 1100px) {
  :root { --v104-ai-width: clamp(460px, 36vw, 590px); }

  .reel-card { overflow: hidden !important; }

  /* The global assistant is re-parented by JS into the active product card. */
  .reel-card > .vi-ai-dock.is-card-mounted,
  .reel-card > #globalAiDock.is-card-mounted,
  body.global-ai-keyboard-open .reel-card > .vi-ai-dock.is-card-mounted,
  body.global-ai-keyboard-open .reel-card > #globalAiDock.is-card-mounted {
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    top: auto !important;
    bottom: 15px !important;
    width: min(var(--v104-ai-width), calc(100% - 136px)) !important;
    max-width: min(var(--v104-ai-width), calc(100% - 136px)) !important;
    min-width: min(430px, calc(100% - 136px)) !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
    z-index: 132 !important;
  }

  .reel-card > .vi-ai-dock.is-card-mounted .vi-ai-search,
  .reel-card > #globalAiDock.is-card-mounted #globalAiForm {
    height: 42px !important;
    min-height: 42px !important;
    grid-template-columns: minmax(0,1fr) 36px !important;
    gap: 5px !important;
    padding: 4px !important;
    border-radius: 18px !important;
    background: linear-gradient(180deg,rgba(4,11,15,.96),rgba(3,9,12,.94)) !important;
    border: 1px solid rgba(43,244,218,.34) !important;
    box-shadow: 0 13px 36px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.09) !important;
  }
  .reel-card > .vi-ai-dock.is-card-mounted .vi-ai-search input,
  .reel-card > #globalAiDock.is-card-mounted #globalAiInput {
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 13px !important;
    font-size: 13.2px !important;
    line-height: 34px !important;
  }
  .reel-card > .vi-ai-dock.is-card-mounted .vi-ai-search button,
  .reel-card > #globalAiDock.is-card-mounted #globalAiSubmit {
    width: 36px !important;
    min-width: 36px !important;
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 14px !important;
    font-size: 18px !important;
  }

  /* One card-owned timer, directly underneath the centered composer. */
  .reel-card > .showcase-meter-card {
    display: block !important;
    position: absolute !important;
    z-index: 130 !important;
    top: auto !important;
    bottom: 5px !important;
    left: calc(var(--v99-stage-left, 258px) + 14px) !important;
    right: calc(var(--v99-stage-right, 205px) + 14px) !important;
    width: auto !important;
    height: 4px !important;
    min-height: 4px !important;
    border: 1px solid rgba(255,255,255,.24) !important;
    border-radius: 999px !important;
    background: rgba(1,7,10,.88) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 0 15px rgba(22,244,219,.46) !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }
  .reel-card.is-active.showcase-running > .showcase-meter-card { opacity: .99 !important; }
  .reel-card > .showcase-meter-card::after {
    height: 100% !important;
    border-radius: inherit !important;
    background: linear-gradient(90deg,#0df4df 0%,#75ffe9 48%,#ff3494 100%) !important;
    box-shadow: 0 0 13px rgba(18,255,232,.96), 0 0 19px rgba(255,47,143,.58) !important;
  }

  /* Keep the seller/title/tag lane above the composer and rail. */
  .card-info,
  .reel-card.media-portrait .card-info,
  .reel-card.media-squareish .card-info,
  .reel-card.home-title-only .card-info {
    bottom: 66px !important;
    width: min(650px, calc(100% - 96px)) !important;
    max-width: min(650px, calc(100% - 96px)) !important;
  }
}

@media (min-width: 1100px) and (max-width: 1320px) {
  :root { --v104-ai-width: clamp(430px, 41vw, 520px); }
  .reel-card > .vi-ai-dock.is-card-mounted,
  .reel-card > #globalAiDock.is-card-mounted {
    width: min(var(--v104-ai-width), calc(100% - 104px)) !important;
    max-width: min(var(--v104-ai-width), calc(100% - 104px)) !important;
    min-width: min(390px, calc(100% - 104px)) !important;
  }
  .reel-card > .showcase-meter-card {
    left: calc(var(--v99-stage-left, 226px) + 12px) !important;
    right: calc(var(--v99-stage-right, 190px) + 12px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .reel-card > .showcase-meter-card { display: none !important; }
}

/* ========================================================================
   v105.0.1 · Vi AI shop product shelf
   - shows the active seller's other products first, then ranked shops
   - photo + price cards rotate every four seconds without rebuilding the feed
   - responsive 4 / 3 / 2-card layouts preserve the v104 caption and AI lanes
   ======================================================================== */
.smart-shop-shelf {
  --vc-smart-shop-cols: 4;
  --vc-smart-shop-gap: clamp(9px, 1.15vw, 16px);
  position: absolute;
  z-index: 96;
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  top: calc(194px + env(safe-area-inset-top));
  left: 10px;
  right: 70px;
  width: auto;
  max-width: 720px;
  margin-inline: auto;
  pointer-events: auto;
  isolation: isolate;
  filter: drop-shadow(0 16px 26px rgba(0,0,0,.34));
}
.reel-card.is-active > .smart-shop-shelf:not([hidden]) { display: flex; }
.smart-shop-shelf[hidden] { display: none !important; }
.smart-shop-shelf-head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  min-height: 24px;
  padding: 3px 7px 3px 9px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  background: linear-gradient(180deg,rgba(5,13,17,.92),rgba(2,8,11,.86));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 8px 22px rgba(0,0,0,.32), 0 0 20px rgba(25,238,211,.08);
  color: #f5fffd;
  white-space: nowrap;
  overflow: hidden;
  backdrop-filter: blur(14px) saturate(1.18);
  -webkit-backdrop-filter: blur(14px) saturate(1.18);
}
.smart-shop-shelf-title {
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 11.5px;
  font-weight: 850;
  line-height: 1;
  letter-spacing: -.018em;
}
.smart-shop-shelf-shop {
  overflow: hidden;
  max-width: 170px;
  text-overflow: ellipsis;
  color: rgba(221,255,249,.72);
  font-size: 9.4px;
  font-weight: 700;
  line-height: 1;
}
.smart-shop-shelf-ai,
.smart-shop-shelf-page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-height: 17px;
  padding: 0 6px;
  border-radius: 999px;
  font-size: 8.2px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .015em;
}
.smart-shop-shelf-ai {
  color: #04110e;
  background: linear-gradient(135deg,#6bffe8,#28eac9 58%,#ff75b8);
  box-shadow: 0 0 13px rgba(43,240,211,.30);
}
.smart-shop-shelf-page {
  padding-inline: 5px;
  color: rgba(242,255,252,.66);
  background: rgba(255,255,255,.07);
}
.smart-shop-shelf-window {
  width: 100%;
  overflow: visible;
  perspective: 800px;
}
.smart-shop-shelf-track {
  display: grid;
  grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(84px, 112px));
  justify-content: center;
  align-items: stretch;
  gap: var(--vc-smart-shop-gap);
  min-height: 104px;
  transition: opacity .17s ease, transform .17s cubic-bezier(.2,.8,.2,1), filter .17s ease;
  will-change: opacity, transform;
}
.smart-shop-shelf.is-swapping .smart-shop-shelf-track {
  opacity: 0;
  transform: translateY(-8px) scale(.985);
  filter: blur(2px);
}
.smart-shop-product {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0,1fr) 24px;
  width: 100%;
  min-width: 0;
  height: 104px;
  padding: 4px 4px 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 10px;
  background: linear-gradient(180deg,rgba(255,255,255,.985),rgba(241,246,246,.97));
  box-shadow: 0 11px 24px rgba(0,0,0,.34), 0 0 0 1px rgba(3,12,14,.20), inset 0 1px 0 rgba(255,255,255,.96);
  color: #071113;
  cursor: pointer;
  transform-origin: 50% 100%;
  -webkit-tap-highlight-color: transparent;
  transition: transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s ease, border-color .22s ease;
}
.smart-shop-product::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(5,15,18,.06);
}
.smart-shop-product img {
  width: 100%;
  height: 100%;
  min-height: 0;
  display: block;
  object-fit: contain;
  object-position: center;
  border-radius: 7px 7px 4px 4px;
  background: #fff;
}
.smart-shop-product-price {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  padding-inline: 3px;
  color: #061012;
  font-size: 13px;
  font-weight: 950;
  line-height: 24px;
  letter-spacing: -.04em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.smart-shop-product:hover,
.smart-shop-product:focus-visible {
  z-index: 2;
  outline: none;
  border-color: rgba(57,241,214,.92);
  transform: translateY(-4px) scale(1.035);
  box-shadow: 0 17px 32px rgba(0,0,0,.42), 0 0 0 2px rgba(49,240,213,.32), 0 0 25px rgba(255,70,151,.16);
}
.smart-shop-shelf.is-entering .smart-shop-product {
  animation: vc-smart-shop-enter .48s cubic-bezier(.18,.82,.18,1) both;
  animation-delay: calc(var(--vc-smart-shop-order, 0) * 55ms);
}
@keyframes vc-smart-shop-enter {
  0% { opacity: 0; transform: translateY(13px) rotateX(-7deg) scale(.94); filter: blur(2px); }
  68% { opacity: 1; transform: translateY(-2px) rotateX(0deg) scale(1.015); filter: blur(0); }
  100% { opacity: 1; transform: translateY(0) rotateX(0deg) scale(1); filter: blur(0); }
}
.smart-shop-shelf-progress {
  position: relative;
  display: block;
  width: min(310px, 62%);
  height: 2px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  box-shadow: 0 0 0 1px rgba(0,0,0,.28);
}
.smart-shop-shelf-progress i {
  position: absolute;
  inset: 0;
  display: block;
  border-radius: inherit;
  background: linear-gradient(90deg,#19f1d5 0%,#7cffe9 55%,#ff4a9b 100%);
  box-shadow: 0 0 10px rgba(32,242,215,.70), 0 0 13px rgba(255,56,145,.32);
  transform: scaleX(0);
  transform-origin: left center;
}
.smart-shop-shelf.is-timing .smart-shop-shelf-progress i {
  animation: vc-smart-shop-progress 4s linear both;
}
@keyframes vc-smart-shop-progress { to { transform: scaleX(1); } }

@media (min-width: 520px) and (max-width: 1099px) {
  .smart-shop-shelf {
    top: calc(194px + env(safe-area-inset-top));
    left: 18px;
    right: 86px;
    --vc-smart-shop-gap: 12px;
  }
  .smart-shop-shelf-track {
    grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(96px, 124px));
    min-height: 116px;
  }
  .smart-shop-product {
    height: 116px;
    grid-template-rows: minmax(0,1fr) 26px;
  }
  .smart-shop-product-price { font-size: 14px; line-height: 26px; }
}

@media (min-width: 1100px) {
  .smart-shop-shelf {
    z-index: 128;
    top: 80px;
    left: 50%;
    right: auto;
    width: min(700px, calc(100% - var(--v99-stage-left, 258px) - var(--v99-stage-right, 205px) - 34px));
    max-width: 700px;
    transform: translateX(-50%);
    --vc-smart-shop-gap: clamp(12px, 1.15vw, 18px);
  }
  .smart-shop-shelf-head {
    min-height: 26px;
    padding: 4px 8px 4px 10px;
  }
  .smart-shop-shelf-title { font-size: 12px; }
  .smart-shop-shelf-shop { max-width: 210px; font-size: 9.8px; }
  .smart-shop-shelf-track {
    grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(104px, 128px));
    min-height: 137px;
  }
  .smart-shop-product {
    height: 137px;
    grid-template-rows: minmax(0,1fr) 28px;
    padding: 5px 5px 0;
    border-radius: 11px;
  }
  .smart-shop-product-price { font-size: 16px; line-height: 28px; }
  .smart-shop-shelf-progress { width: min(360px, 60%); }
}

@media (min-width: 1100px) and (max-width: 1320px) {
  .smart-shop-shelf {
    width: min(620px, calc(100% - var(--v99-stage-left, 226px) - var(--v99-stage-right, 190px) - 24px));
    top: 80px;
  }
  .smart-shop-shelf-track { grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(96px, 116px)); }
  .smart-shop-product { height: 126px; }
}

@media (max-width: 519px) {
  .smart-shop-shelf-head { max-width: min(100%, 278px); }
  .smart-shop-shelf-shop { max-width: 92px; }
  .smart-shop-shelf-ai { padding-inline: 5px; }
  .smart-shop-shelf-track { grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(82px, 104px)); }
}

@media (max-width: 390px) {
  .smart-shop-shelf {
    top: calc(194px + env(safe-area-inset-top));
    right: 66px;
    --vc-smart-shop-gap: 8px;
  }
  .smart-shop-shelf-title { font-size: 10.4px; }
  .smart-shop-shelf-shop { display: none; }
  .smart-shop-product { height: 96px; grid-template-rows: minmax(0,1fr) 23px; }
  .smart-shop-product-price { font-size: 12px; line-height: 23px; }
  .smart-shop-shelf-track { min-height: 96px; grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(78px, 96px)); }
}

@media (max-height: 650px) and (max-width: 1099px) {
  .smart-shop-shelf { top: calc(194px + env(safe-area-inset-top)); }
  .smart-shop-shelf-head { min-height: 21px; padding-block: 2px; }
  .smart-shop-product { height: 86px; grid-template-rows: minmax(0,1fr) 22px; }
  .smart-shop-product-price { font-size: 11.5px; line-height: 22px; }
  .smart-shop-shelf-track { min-height: 86px; }
}

@media (prefers-reduced-motion: reduce) {
  .smart-shop-shelf,
  .smart-shop-shelf-track,
  .smart-shop-product { transition: none !important; animation: none !important; }
  .smart-shop-shelf-progress { display: none !important; }
}


/* ========================================================================
   v106.0.0 · Flat mobile navigation, one progress rail, story-free showcase
   - small-screen navigation is edge-to-edge and rests at the device bottom
   - the active product owns the only visible progress rail
   - Story UI is retired; the rotating shop shelf moves into the recovered space
   - shelf cards are calmer and smaller on large screens
   ======================================================================== */
.story-strip,
.smart-shop-shelf-progress { display: none !important; }

.smart-shop-shelf {
  gap: 4px !important;
}
.smart-shop-shelf-track {
  transition: opacity .17s ease, transform .17s cubic-bezier(.2,.8,.2,1), filter .17s ease !important;
}

@media (max-width: 720px) {
  .phone { padding-bottom: 0 !important; }

  .bottom-nav,
  #bottomNav {
    position: absolute !important;
    z-index: 160 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: calc(72px + var(--safe-bottom)) !important;
    min-height: calc(72px + var(--safe-bottom)) !important;
    margin: 0 !important;
    padding: 5px 8px max(5px, var(--safe-bottom)) !important;
    grid-template-columns: repeat(5, minmax(0,1fr)) !important;
    gap: 0 !important;
    align-items: start !important;
    border: 0 !important;
    border-top: 1px solid rgba(255,255,255,.13) !important;
    border-radius: 0 !important;
    background: #000 !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    box-shadow: 0 -10px 30px rgba(0,0,0,.50) !important;
  }
  .bottom-nav button,
  #bottomNav button {
    width: 100% !important;
    min-width: 0 !important;
    height: 60px !important;
    min-height: 60px !important;
    padding: 3px 1px 2px !important;
    gap: 2px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(255,255,255,.62) !important;
    box-shadow: none !important;
    transform: none !important;
  }
  .bottom-nav button.active:not(.post),
  #bottomNav button.active:not(.post) {
    color: #fff !important;
    background: transparent !important;
  }
  .bottom-nav button svg,
  #bottomNav button svg {
    width: 28px !important;
    height: 28px !important;
    stroke-width: 2.15 !important;
  }
  .bottom-nav button b,
  #bottomNav button b {
    display: block !important;
    max-width: 100% !important;
    font-size: 10.5px !important;
    font-weight: 820 !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
  }
  .bottom-nav .post,
  #bottomNav .post {
    align-self: start !important;
    justify-self: center !important;
    width: 60px !important;
    min-width: 60px !important;
    height: 42px !important;
    min-height: 42px !important;
    margin-top: 4px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: #fff !important;
    color: #05070a !important;
    box-shadow: -5px 0 0 #16eee8, 5px 0 0 #ff3f87 !important;
  }
  .bottom-nav .post svg,
  #bottomNav .post svg {
    width: 29px !important;
    height: 29px !important;
    stroke-width: 2.55 !important;
  }
  .bottom-nav .nav-unread-badge {
    right: 17% !important;
    top: 1px !important;
  }

  /* One TikTok-like timeline immediately above the flat navigation. */
  .media-wrap > .showcase-meter-media,
  .media-wrap > .showcase-meter {
    display: block !important;
    z-index: 158 !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    bottom: calc(72px + var(--safe-bottom)) !important;
    width: 100% !important;
    height: 2px !important;
    min-height: 2px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: rgba(255,255,255,.32) !important;
    box-shadow: 0 -1px 0 rgba(0,0,0,.50) !important;
    opacity: 0 !important;
  }
  .reel-card.is-active.showcase-running .media-wrap > .showcase-meter-media,
  .reel-card.is-active.showcase-running .media-wrap > .showcase-meter {
    opacity: .96 !important;
  }
  .media-wrap > .showcase-meter-media::after,
  .media-wrap > .showcase-meter::after {
    border-radius: 0 !important;
    background: linear-gradient(90deg,#f7fbff 0%,#f7fbff 72%,#26f4dd 100%) !important;
    box-shadow: 0 0 7px rgba(255,255,255,.60) !important;
  }
  .reel-card > .showcase-meter-card { display: none !important; }

  /* The composer and product caption stay clear of the flat navigation/timeline. */
  .vi-ai-dock,
  #globalAiDock {
    bottom: calc(81px + var(--safe-bottom)) !important;
  }
  .card-info,
  .reel-card.home-title-only .card-info {
    bottom: calc(130px + var(--safe-bottom)) !important;
  }
  .action-rail {
    bottom: calc(82px + var(--safe-bottom)) !important;
  }
  .feed,
  .directory {
    padding-bottom: calc(74px + var(--safe-bottom)) !important;
  }

  /* Story space is reclaimed by the AI shelf, without covering top controls. */
  .smart-shop-shelf {
    z-index: 118 !important;
    top: calc(143px + env(safe-area-inset-top)) !important;
    left: 8px !important;
    right: 62px !important;
    width: auto !important;
    gap: 3px !important;
    --vc-smart-shop-gap: 8px !important;
  }
  .smart-shop-shelf-head {
    min-height: 21px !important;
    max-width: min(100%, 286px) !important;
    padding: 2px 6px 2px 8px !important;
  }
  .smart-shop-shelf-title { font-size: 10.7px !important; }
  .smart-shop-shelf-shop { max-width: 96px !important; font-size: 8.7px !important; }
  .smart-shop-shelf-ai,
  .smart-shop-shelf-page { min-height: 16px !important; font-size: 7.7px !important; padding-inline: 5px !important; }
  .smart-shop-shelf-track {
    min-height: 92px !important;
    grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(78px, 100px)) !important;
    gap: var(--vc-smart-shop-gap) !important;
  }
  .smart-shop-product {
    height: 92px !important;
    grid-template-rows: minmax(0,1fr) 22px !important;
    padding: 3px 3px 0 !important;
    border-radius: 8px !important;
  }
  .smart-shop-product img { border-radius: 6px 6px 3px 3px !important; }
  .smart-shop-product-price { font-size: 11.7px !important; line-height: 22px !important; }
}

@media (max-width: 390px) {
  .smart-shop-shelf {
    top: calc(139px + env(safe-area-inset-top)) !important;
    right: 58px !important;
    --vc-smart-shop-gap: 7px !important;
  }
  .smart-shop-shelf-shop { display: none !important; }
  .smart-shop-shelf-track { grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(74px, 94px)) !important; }
  .smart-shop-product { height: 88px !important; grid-template-rows: minmax(0,1fr) 21px !important; }
  .smart-shop-product-price { font-size: 11.2px !important; line-height: 21px !important; }
}

@media (max-height: 650px) and (max-width: 720px) {
  .smart-shop-shelf { top: calc(132px + env(safe-area-inset-top)) !important; }
  .smart-shop-product { height: 82px !important; grid-template-rows: minmax(0,1fr) 20px !important; }
  .smart-shop-shelf-track { min-height: 82px !important; }
  .smart-shop-product-price { font-size: 10.8px !important; line-height: 20px !important; }
}

@media (min-width: 721px) and (max-width: 1099px) {
  .smart-shop-shelf {
    top: calc(154px + env(safe-area-inset-top)) !important;
    left: 18px !important;
    right: 86px !important;
    --vc-smart-shop-gap: 10px !important;
  }
  .smart-shop-shelf-track {
    grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(86px, 110px)) !important;
    min-height: 104px !important;
  }
  .smart-shop-product {
    height: 104px !important;
    grid-template-rows: minmax(0,1fr) 24px !important;
  }
  .smart-shop-product-price { font-size: 13px !important; line-height: 24px !important; }
}

@media (min-width: 1100px) {
  .smart-shop-shelf {
    top: 72px !important;
    width: min(620px, calc(100% - var(--v99-stage-left, 258px) - var(--v99-stage-right, 205px) - 34px)) !important;
    max-width: 620px !important;
    --vc-smart-shop-gap: clamp(10px, .9vw, 14px) !important;
  }
  .smart-shop-shelf-head { min-height: 23px !important; padding: 3px 7px 3px 9px !important; }
  .smart-shop-shelf-title { font-size: 11.4px !important; }
  .smart-shop-shelf-shop { max-width: 180px !important; font-size: 9.2px !important; }
  .smart-shop-shelf-track {
    grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(88px, 108px)) !important;
    min-height: 112px !important;
  }
  .smart-shop-product {
    height: 112px !important;
    grid-template-rows: minmax(0,1fr) 25px !important;
    padding: 4px 4px 0 !important;
    border-radius: 9px !important;
  }
  .smart-shop-product-price { font-size: 13.5px !important; line-height: 25px !important; }
}

@media (min-width: 1100px) and (max-width: 1320px) {
  .smart-shop-shelf {
    top: 70px !important;
    width: min(560px, calc(100% - var(--v99-stage-left, 226px) - var(--v99-stage-right, 190px) - 24px)) !important;
  }
  .smart-shop-shelf-track { grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(84px, 102px)) !important; }
  .smart-shop-product { height: 106px !important; }
}


/* ========================================================================
   v107.0.0 · Compact top shelf + TikTok-style mobile action rail
   - mobile shelf hugs the measured bottom of the top controls with a tiny gap
   - 4 products fit across phones; wider devices progressively show 5 / 6 / 7 / 8
   - recommendation thumbnails remain complete-fit, image + price only
   - small-device side actions become clean white TikTok-like glyphs
   - the Call action visibly rings while respecting reduced-motion settings
   ======================================================================== */

@media (max-width: 1099px) {
  .phone {
    --vc-mobile-header-bottom: 138px;
  }

  /* The shelf now follows the real topbar height instead of a hard-coded gap. */
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf {
    top: calc(var(--vc-mobile-header-bottom, 138px) + 3px) !important;
    left: 5px !important;
    right: 56px !important;
    width: auto !important;
    max-width: none !important;
    gap: 2px !important;
    filter: drop-shadow(0 10px 20px rgba(0,0,0,.28)) !important;
  }
  .smart-shop-shelf-head {
    min-height: 18px !important;
    max-width: min(100%, 320px) !important;
    padding: 1px 6px 1px 8px !important;
    gap: 5px !important;
  }
  .smart-shop-shelf-title {
    font-size: 10px !important;
    line-height: 1 !important;
  }
  .smart-shop-shelf-shop {
    max-width: 92px !important;
    font-size: 8px !important;
  }
  .smart-shop-shelf-ai,
  .smart-shop-shelf-page {
    min-height: 14px !important;
    padding-inline: 4px !important;
    font-size: 7px !important;
  }
  .smart-shop-shelf-window,
  .smart-shop-shelf-track {
    width: 100% !important;
  }
  .smart-shop-shelf-track {
    grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(0, 1fr)) !important;
    gap: 4px !important;
    min-height: 78px !important;
  }
  .smart-shop-product {
    height: 78px !important;
    min-width: 0 !important;
    grid-template-rows: minmax(0,1fr) 18px !important;
    padding: 2px 2px 0 !important;
    border-radius: 7px !important;
    border-width: 1px !important;
    box-shadow: 0 8px 17px rgba(0,0,0,.30), 0 0 0 1px rgba(3,12,14,.14) !important;
  }
  .smart-shop-product img {
    border-radius: 5px 5px 3px 3px !important;
    object-fit: contain !important;
  }
  .smart-shop-product-price {
    padding-inline: 1px !important;
    font-size: 8.9px !important;
    line-height: 18px !important;
    letter-spacing: -.025em !important;
  }

  /* TikTok-like white mobile rail: no turquoise/black capsules around icons. */
  .reel-card.is-active .action-rail,
  .reel-card.media-portrait.is-active .action-rail,
  .reel-card.media-squareish.is-active .action-rail {
    z-index: 132 !important;
    top: calc(var(--vc-mobile-header-bottom, 138px) + 103px) !important;
    right: 1px !important;
    bottom: calc(82px + var(--safe-bottom)) !important;
    width: 55px !important;
    max-width: 55px !important;
    gap: 3px !important;
    padding: 0 !important;
    justify-content: center !important;
    overflow-y: auto !important;
    overflow-x: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
  .reel-card.is-active .action-rail .action,
  .reel-card.is-active .action-rail .action.get,
  .reel-card.is-active .action-rail .action.book,
  .reel-card.is-active .action-rail .action.chat,
  .reel-card.is-active .action-rail .action.live,
  .reel-card.is-active .action-rail .action.rail-contact {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 54px !important;
    height: auto !important;
    min-height: 49px !important;
    padding: 0 !important;
    gap: 1px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #fff !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    overflow: visible !important;
    transform: none !important;
  }
  .reel-card.is-active .action-rail .action > span,
  .reel-card.is-active .action-rail .action.get > span,
  .reel-card.is-active .action-rail .action.book > span,
  .reel-card.is-active .action-rail .action.chat > span,
  .reel-card.is-active .action-rail .action.live > span,
  .reel-card.is-active .action-rail .action.rail-contact > span {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    width: 39px !important;
    height: 39px !important;
    min-width: 39px !important;
    min-height: 39px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #fff !important;
    box-shadow: none !important;
    filter: drop-shadow(0 2px 2px rgba(0,0,0,.92)) drop-shadow(0 0 6px rgba(0,0,0,.55)) !important;
    transition: transform .15s ease, opacity .15s ease !important;
  }
  .reel-card.is-active .action-rail .action svg {
    width: 31px !important;
    height: 31px !important;
    color: #fff !important;
    stroke: #fff !important;
    fill: none !important;
    stroke-width: 2.2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    overflow: visible !important;
  }
  .reel-card.is-active .action-rail .action[data-action-key="heart"] svg {
    fill: rgba(255,255,255,.10) !important;
  }
  .reel-card.is-active .action-rail .action[data-action-key="check"] svg {
    stroke-width: 2.8 !important;
  }
  .reel-card.is-active .action-rail .action > b {
    position: static !important;
    display: block !important;
    width: 54px !important;
    max-width: 54px !important;
    min-height: 9px !important;
    padding: 0 1px !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
    color: rgba(255,255,255,.96) !important;
    font-size: 8px !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    text-align: center !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    text-shadow: 0 2px 3px #000, 0 0 5px #000 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    pointer-events: none !important;
    transform: none !important;
  }
  .reel-card.is-active .action-rail .action:hover > span,
  .reel-card.is-active .action-rail .action:focus-visible > span,
  .reel-card.is-active .action-rail .action:active > span {
    border: 0 !important;
    transform: scale(1.09) !important;
  }
  .reel-card.is-active .action-rail .action:focus-visible {
    outline: 2px solid rgba(42,244,214,.88) !important;
    outline-offset: 0 !important;
  }

  /* A visible ringing phone: a gentle handset rock plus two clean signal arcs. */
  .reel-card.is-active .action-rail .action.is-ringing-call > span::before,
  .reel-card.is-active .action-rail .action.is-ringing-call > span::after {
    content: '' !important;
    position: absolute !important;
    top: 5px !important;
    width: 8px !important;
    height: 8px !important;
    border: 2px solid transparent !important;
    border-top-color: #fff !important;
    border-radius: 50% !important;
    opacity: 0 !important;
    filter: drop-shadow(0 1px 2px #000) !important;
    animation: vc-v108-call-wave 1.85s ease-out infinite !important;
  }
  .reel-card.is-active .action-rail .action.is-ringing-call > span::before {
    left: 1px !important;
    transform: rotate(-42deg) !important;
  }
  .reel-card.is-active .action-rail .action.is-ringing-call > span::after {
    right: 1px !important;
    transform: rotate(42deg) !important;
    animation-delay: .16s !important;
  }
  .reel-card.is-active .action-rail .action.is-ringing-call svg {
    transform-origin: 50% 60% !important;
    animation: vc-v108-phone-ring 1.85s ease-in-out infinite !important;
  }
}

@media (max-width: 390px) {
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf {
    top: calc(var(--vc-mobile-header-bottom, 134px) + 2px) !important;
    left: 4px !important;
    right: 52px !important;
  }
  .smart-shop-shelf-head { min-height: 17px !important; padding-block: 1px !important; }
  .smart-shop-shelf-shop { display: none !important; }
  .smart-shop-shelf-track { gap: 3px !important; min-height: 74px !important; }
  .smart-shop-product {
    height: 74px !important;
    grid-template-rows: minmax(0,1fr) 17px !important;
  }
  .smart-shop-product-price { font-size: 8.2px !important; line-height: 17px !important; }
  .reel-card.is-active .action-rail,
  .reel-card.media-portrait.is-active .action-rail,
  .reel-card.media-squareish.is-active .action-rail {
    top: calc(var(--vc-mobile-header-bottom, 134px) + 96px) !important;
    width: 52px !important;
    max-width: 52px !important;
  }
  .reel-card.is-active .action-rail .action,
  .reel-card.is-active .action-rail .action.get,
  .reel-card.is-active .action-rail .action.book,
  .reel-card.is-active .action-rail .action.chat,
  .reel-card.is-active .action-rail .action.live,
  .reel-card.is-active .action-rail .action.rail-contact {
    width: 51px !important;
    min-height: 46px !important;
  }
  .reel-card.is-active .action-rail .action > span { width: 36px !important; height: 36px !important; min-width: 36px !important; min-height: 36px !important; }
  .reel-card.is-active .action-rail .action svg { width: 29px !important; height: 29px !important; }
  .reel-card.is-active .action-rail .action > b { width: 51px !important; max-width: 51px !important; font-size: 7.4px !important; }
}

@media (min-width: 520px) and (max-width: 719px) {
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf {
    left: 8px !important;
    right: 60px !important;
  }
  .smart-shop-shelf-track { gap: 5px !important; min-height: 82px !important; }
  .smart-shop-product { height: 82px !important; grid-template-rows: minmax(0,1fr) 19px !important; }
  .smart-shop-product-price { font-size: 9.5px !important; line-height: 19px !important; }
}

@media (min-width: 720px) and (max-width: 1099px) {
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf {
    top: calc(var(--vc-mobile-header-bottom, 146px) + 4px) !important;
    left: 12px !important;
    right: 72px !important;
  }
  .smart-shop-shelf-head { min-height: 20px !important; }
  .smart-shop-shelf-title { font-size: 10.8px !important; }
  .smart-shop-shelf-shop { max-width: 140px !important; font-size: 8.6px !important; }
  .smart-shop-shelf-track { gap: 6px !important; min-height: 88px !important; }
  .smart-shop-product { height: 88px !important; grid-template-rows: minmax(0,1fr) 20px !important; }
  .smart-shop-product-price { font-size: 10.4px !important; line-height: 20px !important; }
  .reel-card.is-active .action-rail,
  .reel-card.media-portrait.is-active .action-rail,
  .reel-card.media-squareish.is-active .action-rail {
    top: calc(var(--vc-mobile-header-bottom, 146px) + 116px) !important;
    right: 6px !important;
    width: 60px !important;
    max-width: 60px !important;
  }
}

@media (max-height: 680px) and (max-width: 1099px) {
  .smart-shop-shelf-track { min-height: 68px !important; }
  .smart-shop-product { height: 68px !important; grid-template-rows: minmax(0,1fr) 16px !important; }
  .smart-shop-product-price { font-size: 7.8px !important; line-height: 16px !important; }
  .reel-card.is-active .action-rail,
  .reel-card.media-portrait.is-active .action-rail,
  .reel-card.media-squareish.is-active .action-rail {
    top: calc(var(--vc-mobile-header-bottom, 126px) + 88px) !important;
    gap: 1px !important;
  }
  .reel-card.is-active .action-rail .action,
  .reel-card.is-active .action-rail .action.get,
  .reel-card.is-active .action-rail .action.book,
  .reel-card.is-active .action-rail .action.chat,
  .reel-card.is-active .action-rail .action.live,
  .reel-card.is-active .action-rail .action.rail-contact { min-height: 39px !important; }
  .reel-card.is-active .action-rail .action > span { width: 33px !important; height: 33px !important; min-width: 33px !important; min-height: 33px !important; }
  .reel-card.is-active .action-rail .action svg { width: 27px !important; height: 27px !important; }
  .reel-card.is-active .action-rail .action > b { display: none !important; }
}

@media (min-width: 1100px) {
  .smart-shop-shelf {
    top: 66px !important;
    width: min(760px, calc(100% - var(--v99-stage-left, 258px) - var(--v99-stage-right, 205px) - 30px)) !important;
    max-width: 760px !important;
    gap: 3px !important;
    --vc-smart-shop-gap: 7px !important;
  }
  .smart-shop-shelf-head { min-height: 21px !important; padding: 2px 7px 2px 9px !important; }
  .smart-shop-shelf-title { font-size: 10.8px !important; }
  .smart-shop-shelf-shop { max-width: 190px !important; font-size: 8.8px !important; }
  .smart-shop-shelf-track {
    width: 100% !important;
    grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(0, 1fr)) !important;
    gap: var(--vc-smart-shop-gap) !important;
    min-height: 94px !important;
  }
  .smart-shop-product {
    height: 94px !important;
    min-width: 0 !important;
    grid-template-rows: minmax(0,1fr) 21px !important;
    padding: 3px 3px 0 !important;
    border-radius: 8px !important;
  }
  .smart-shop-product img { border-radius: 6px 6px 3px 3px !important; }
  .smart-shop-product-price { font-size: 10.8px !important; line-height: 21px !important; }
}

@media (min-width: 1440px) {
  .smart-shop-shelf { width: min(820px, calc(100% - var(--v99-stage-left, 258px) - var(--v99-stage-right, 205px) - 34px)) !important; max-width: 820px !important; }
}

@media (min-width: 1800px) {
  .smart-shop-shelf { width: min(940px, calc(100% - var(--v99-stage-left, 258px) - var(--v99-stage-right, 205px) - 40px)) !important; max-width: 940px !important; }
}

@keyframes vc-v108-phone-ring {
  0%, 68%, 100% { transform: rotate(0deg); }
  72% { transform: rotate(-13deg); }
  76% { transform: rotate(11deg); }
  80% { transform: rotate(-9deg); }
  84% { transform: rotate(7deg); }
  88% { transform: rotate(-4deg); }
  92% { transform: rotate(0deg); }
}

@keyframes vc-v108-call-wave {
  0%, 66%, 100% { opacity: 0; scale: .72; }
  72% { opacity: .95; scale: .92; }
  86% { opacity: 0; scale: 1.36; }
}

@media (prefers-reduced-motion: reduce) {
  .reel-card.is-active .action-rail .action.is-ringing-call svg,
  .reel-card.is-active .action-rail .action.is-ringing-call > span::before,
  .reel-card.is-active .action-rail .action.is-ringing-call > span::after {
    animation: none !important;
  }
}


/* ========================================================================
   v108.0.0 · Tight caption lane + true icon-only actions + header-safe shelf
   - removes the spare strip below mobile product titles without covering Vi AI
   - side actions are white glyphs only: no capsule, tile, tint or visible label
   - Call keeps a restrained ringing handset and two signal arcs
   - tablet/desktop shelves sit below the measured header and never get clipped
   ======================================================================== */

@media (max-width: 1099px) {
  /* Compress the title/tag stack into the last safe pixels above the composer. */
  .card-info,
  .reel-card.home-title-only .card-info {
    gap: 3px !important;
    max-height: 124px !important;
  }
  .card-info h1,
  .reel-card.home-title-only .card-info h1 {
    margin: 0 !important;
    padding: 0 !important;
  }
  .card-info .tag-line,
  .reel-card.home-title-only .tag-line {
    min-height: 18px !important;
    max-height: 18px !important;
    margin: 0 !important;
    gap: 4px !important;
  }
  .card-info .tag-line .tag,
  .reel-card.home-title-only .tag-line .tag {
    height: 18px !important;
    min-height: 18px !important;
    padding-inline: 6px !important;
    font-size: 8px !important;
    line-height: 18px !important;
  }

  /* Hard reset every inherited button skin. The accessible label remains in
     aria-label/title, but the visual rail is deliberately icon-only. */
  .reel-card.is-active .action-rail,
  .reel-card.is-active .action-rail .action,
  .reel-card.is-active .action-rail .action.get,
  .reel-card.is-active .action-rail .action.book,
  .reel-card.is-active .action-rail .action.chat,
  .reel-card.is-active .action-rail .action.live,
  .reel-card.is-active .action-rail .action.rail-contact,
  .reel-card.is-active .action-rail .action > span,
  .reel-card.is-active .action-rail .action.get > span,
  .reel-card.is-active .action-rail .action.book > span,
  .reel-card.is-active .action-rail .action.chat > span,
  .reel-card.is-active .action-rail .action.live > span,
  .reel-card.is-active .action-rail .action.rail-contact > span {
    -webkit-appearance: none !important;
    appearance: none !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  .reel-card.is-active .action-rail .action > span {
    filter: drop-shadow(0 2px 2px rgba(0,0,0,.96)) drop-shadow(0 0 6px rgba(0,0,0,.66)) !important;
  }
  .reel-card.is-active .action-rail .action::before,
  .reel-card.is-active .action-rail .action::after,
  .reel-card.is-active .action-rail .action > span::before,
  .reel-card.is-active .action-rail .action > span::after {
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }
  .reel-card.is-active .action-rail .action > b {
    display: none !important;
    visibility: hidden !important;
  }
  .reel-card.is-active .action-rail .action svg,
  .reel-card.is-active .action-rail .action[data-action-key="heart"] svg,
  .reel-card.is-active .action-rail .action[data-action-key="check"] svg {
    color: #fff !important;
    stroke: #fff !important;
    fill: none !important;
  }

  /* Re-enable only the ringing signal arcs after the universal pseudo reset. */
  .reel-card.is-active .action-rail .action.is-ringing-call > span::before,
  .reel-card.is-active .action-rail .action.is-ringing-call > span::after {
    content: '' !important;
    position: absolute !important;
    top: 5px !important;
    width: 8px !important;
    height: 8px !important;
    border: 2px solid transparent !important;
    border-top-color: #fff !important;
    border-radius: 50% !important;
    opacity: 0 !important;
    filter: drop-shadow(0 1px 2px #000) !important;
    animation: vc-v108-call-wave 1.85s ease-out infinite !important;
  }
  .reel-card.is-active .action-rail .action.is-ringing-call > span::before {
    left: 1px !important;
    transform: rotate(-42deg) !important;
  }
  .reel-card.is-active .action-rail .action.is-ringing-call > span::after {
    right: 1px !important;
    transform: rotate(42deg) !important;
    animation-delay: .16s !important;
  }
  .reel-card.is-active .action-rail .action.is-ringing-call svg {
    transform-origin: 50% 60% !important;
    animation: vc-v108-phone-ring 1.85s ease-in-out infinite !important;
  }
}

@media (max-width: 719px) {
  .card-info,
  .reel-card.home-title-only .card-info {
    /* Two clean pixels above the Vi AI composer: no black spare strip and no overlap. */
    bottom: calc(127px + var(--safe-bottom)) !important;
  }
  /* Phones keep the compact near-header placement requested in v107. */
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf {
    top: calc(var(--vc-mobile-header-bottom, 138px) + 3px) !important;
  }
  /* Start the first glyph after the recommendation cards, never through them. */
  .reel-card.is-active .action-rail,
  .reel-card.media-portrait.is-active .action-rail,
  .reel-card.media-squareish.is-active .action-rail {
    top: calc(var(--vc-mobile-header-bottom, 138px) + 105px) !important;
  }
}

@media (max-width: 390px) {
  .card-info,
  .reel-card.home-title-only .card-info {
    bottom: calc(127px + var(--safe-bottom)) !important;
  }
}

@media (min-width: 720px) and (max-width: 1099px) {
  /* Compact browser/tablet headers cast a shadow over a 3px gap. Ten pixels
     keeps the pill readable while remaining visually attached to the header. */
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf {
    top: calc(var(--vc-mobile-header-bottom, 146px) + 10px) !important;
  }
  .card-info,
  .reel-card.home-title-only .card-info {
    /* Compact tablets also keep the caption attached to the composer. */
    bottom: calc(74px + var(--safe-bottom)) !important;
  }
  .reel-card.is-active .action-rail,
  .reel-card.media-portrait.is-active .action-rail,
  .reel-card.media-squareish.is-active .action-rail {
    top: calc(var(--vc-mobile-header-bottom, 146px) + 124px) !important;
  }
}

@media (min-width: 1100px) {
  .smart-shop-shelf {
    top: calc(var(--vc-topbar-bottom, 77px) + 10px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .reel-card.is-active .action-rail .action.is-ringing-call svg,
  .reel-card.is-active .action-rail .action.is-ringing-call > span::before,
  .reel-card.is-active .action-rail .action.is-ringing-call > span::after {
    animation: none !important;
  }
}

/* ============================================================================
   v109.0.0 · Fast auto-GPS + separate current/buying areas + nearby area pin
   ========================================================================== */
#locationSheet .location-market-card {
  width: min(620px, calc(100vw - 24px));
  max-height: min(88dvh, 820px);
  overflow: auto;
  background:
    radial-gradient(circle at 10% 0%, rgba(29, 255, 201, .10), transparent 34%),
    radial-gradient(circle at 100% 18%, rgba(255, 43, 121, .08), transparent 30%),
    #080b0e;
  border: 1px solid rgba(255,255,255,.11);
}
#locationSheet .location-status-copy {
  margin: 2px 0 12px;
  line-height: 1.45;
  color: rgba(255,255,255,.70);
}
.location-market-overview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 4px 0 10px;
}
.location-market-cell {
  position: relative;
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
  min-height: 80px;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.055);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.location-market-cell.current-location-cell {
  border-color: rgba(42, 238, 202, .24);
  background: linear-gradient(135deg, rgba(42,238,202,.10), rgba(255,255,255,.04));
}
.location-market-cell.buying-location-cell.is-pinned {
  border-color: rgba(255, 55, 126, .28);
  background: linear-gradient(135deg, rgba(255,55,126,.10), rgba(42,238,202,.06));
}
.location-market-icon {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(42,238,202,.12);
  color: #43f4cf;
}
.location-market-icon.lock-icon { background: rgba(255,55,126,.12); color: #ff5c91; }
.location-market-icon svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.location-market-cell > div { min-width: 0; display: grid; gap: 2px; }
.location-market-cell small { color: rgba(255,255,255,.58); font-size: 11px; font-weight: 760; }
.location-market-cell strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #fff; font-size: 15px; letter-spacing: -.01em; }
.location-market-cell em { color: rgba(255,255,255,.54); font-size: 10px; font-style: normal; font-weight: 700; }
.location-market-actions {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 9px;
  margin: 8px 0 10px;
}
.location-market-actions > button { min-height: 46px; border-radius: 15px; }
.location-pin-toggle.is-pinned {
  border-color: rgba(255,55,126,.34) !important;
  background: rgba(255,55,126,.11) !important;
  color: #fff !important;
}
.location-context-summary {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 2px 10px;
  min-height: 58px;
  padding: 10px 13px;
  margin: 2px 0 12px;
  border-radius: 16px;
  border: 1px solid rgba(42,238,202,.17);
  background: rgba(0,0,0,.28);
}
.location-context-summary span { grid-row: 1 / span 2; color: #3cf0ca; font-size: 11px; font-weight: 850; text-transform: uppercase; letter-spacing: .04em; }
.location-context-summary strong { color: #fff; font-size: 14px; }
.location-context-summary small { color: rgba(255,255,255,.62); font-size: 11px; }
.nearby-market-section { margin: 2px 0 12px; }
.nearby-market-head { display: flex; align-items: end; justify-content: space-between; margin: 0 2px 8px; }
.nearby-market-head > div { display: grid; gap: 3px; }
.nearby-market-head strong { color: #fff; font-size: 14px; }
.nearby-market-head small { color: rgba(255,255,255,.55); font-size: 10px; line-height: 1.35; }
.nearby-area-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.nearby-area-option {
  display: grid;
  gap: 6px;
  min-width: 0;
  min-height: 66px;
  padding: 10px 11px;
  text-align: left;
  border-radius: 15px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
  color: #fff;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.nearby-area-option:hover,
.nearby-area-option:focus-visible { transform: translateY(-1px); border-color: rgba(42,238,202,.42); background: rgba(42,238,202,.09); outline: none; }
.nearby-area-option.is-current { border-color: rgba(42,238,202,.26); }
.nearby-area-option.is-selected { border-color: rgba(42,238,202,.65); box-shadow: inset 0 0 0 1px rgba(42,238,202,.18); }
.nearby-area-option.is-pinned { border-color: rgba(255,55,126,.52); background: linear-gradient(135deg, rgba(255,55,126,.10), rgba(42,238,202,.07)); }
.nearby-area-option > span { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; min-width: 0; }
.nearby-area-option b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.nearby-area-option em { flex: 0 0 auto; color: rgba(255,255,255,.48); font-size: 9px; font-style: normal; }
.nearby-area-option small { color: rgba(255,255,255,.60); font-size: 10px; }
.nearby-area-option small i { color: #47f0ce; font-style: normal; font-weight: 900; }
.location-manual-search { margin-top: 10px; }
.location-search-results { max-height: 124px; overflow: auto !important; align-content: start; padding-right: 2px; }
.area-chip.is-pinned { border-color: rgba(255,55,126,.46) !important; box-shadow: 0 0 0 1px rgba(255,55,126,.08), 0 0 22px rgba(255,55,126,.08) !important; }
.area-chip.is-pinned::after {
  content: '';
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #ff4e86;
  box-shadow: 0 0 10px rgba(255,78,134,.75);
}
@media (max-width: 560px) {
  #locationSheet .location-market-card { width: 100%; max-height: 92dvh; border-radius: 24px 24px 0 0; padding-left: 14px; padding-right: 14px; }
  .location-market-overview { gap: 7px; }
  .location-market-cell { min-height: 72px; padding: 10px; border-radius: 15px; gap: 8px; }
  .location-market-icon { flex-basis: 32px; width: 32px; height: 32px; border-radius: 11px; }
  .location-market-icon svg { width: 18px; height: 18px; }
  .location-market-cell small { font-size: 9px; }
  .location-market-cell strong { font-size: 13px; }
  .location-market-cell em { font-size: 8px; }
  .location-market-actions { gap: 7px; }
  .location-market-actions > button { min-height: 43px; padding-inline: 9px; font-size: 12px; }
  .nearby-area-grid { gap: 7px; }
  .nearby-area-option { min-height: 62px; padding: 9px; border-radius: 13px; }
  .nearby-area-option b { font-size: 12px; }
  .nearby-area-option small { font-size: 9px; }
}
@media (min-width: 760px) {
  .nearby-area-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .nearby-area-option { transition: none; }
}

/* ============================================================================
   v110.0.0 · Trusted cross-device GPS + context AI discovery
   - weak desktop Wi-Fi fixes never masquerade as a precise neighbourhood
   - nearby counts follow the buyer's active intent (lodges, mechanics, etc.)
   - product and service recommendation groups take turns every four seconds
   - existing ViConnects loaders stay visible until verified results are ready
   ========================================================================== */
.location-context-summary.is-loading {
  min-height: 72px;
  border-color: rgba(42, 238, 202, .24);
  background: linear-gradient(120deg, rgba(42,238,202,.08), rgba(255,255,255,.025), rgba(255,55,126,.055));
  overflow: hidden;
}
.location-context-loading {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 11px;
}
.location-context-loading > div { min-width: 0; display: grid; gap: 3px; }
.location-context-loading strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.location-context-loading small { color: rgba(255,255,255,.54); font-size: 9.5px; }
.location-context-loading .twin-dots { flex: 0 0 auto; transform: scale(.82); }
.location-context-result { min-width: 0; display: grid; gap: 3px; }
.location-context-result > strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.location-context-result > small { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px; }
.location-context-result > small b { color: #50f6d1; font-size: 13px; }
.location-context-result > small em {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: rgba(255,255,255,.54);
  font-style: normal;
}
.location-source-badge {
  justify-self: start;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 3px 7px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  color: rgba(255,255,255,.68);
  font-size: 8.5px;
  font-weight: 760;
}
.location-source-badge[data-source="trusted-phone-gps"],
.location-source-badge[data-source="trusted-account-gps"],
.location-source-badge[data-source="device-gps"] {
  border-color: rgba(42,238,202,.27);
  background: rgba(42,238,202,.09);
  color: #bffbef;
}
.nearby-area-skeleton {
  position: relative;
  min-height: 66px;
  padding: 11px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 15px;
  background: rgba(255,255,255,.035);
  animation: vc-v110-loader-breathe 1.45s ease-in-out infinite;
  animation-delay: calc(var(--vc-skeleton-order, 0) * 70ms);
}
.nearby-area-skeleton::after,
.smart-shop-card-skeleton::after {
  content: '';
  position: absolute;
  inset: 0;
  transform: translateX(-120%);
  background: linear-gradient(100deg, transparent 16%, rgba(255,255,255,.10) 46%, transparent 76%);
  animation: vc-v110-shimmer 1.35s ease-in-out infinite;
  animation-delay: calc(var(--vc-skeleton-order, 0) * 75ms);
}
.nearby-area-skeleton i,
.nearby-area-skeleton span,
.nearby-area-skeleton small {
  display: block;
  border-radius: 999px;
  background: rgba(255,255,255,.085);
}
.nearby-area-skeleton i { width: 48%; height: 10px; }
.nearby-area-skeleton span { width: 76%; height: 8px; margin-top: 13px; }
.nearby-area-skeleton small { width: 38%; height: 7px; margin-top: 7px; }
.nearby-area-option small {
  display: flex;
  align-items: baseline;
  gap: 4px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nearby-area-option small i { font-size: 11px; }

.smart-shop-shelf {
  isolation: isolate;
}
.smart-shop-shelf::before {
  content: '';
  position: absolute;
  inset: -3px -5px -5px;
  z-index: -1;
  border-radius: 14px;
  opacity: .64;
  pointer-events: none;
  background: radial-gradient(circle at 15% 0%, rgba(42,238,202,.16), transparent 43%), radial-gradient(circle at 90% 30%, rgba(255,55,126,.12), transparent 38%);
  filter: blur(7px);
  transition: opacity .32s ease, background .32s ease;
}
.smart-shop-shelf[data-group-kind="services"]::before {
  opacity: .88;
  background: radial-gradient(circle at 15% 0%, rgba(42,238,202,.23), transparent 44%), radial-gradient(circle at 90% 30%, rgba(113,89,255,.17), transparent 40%);
}
.smart-shop-shelf-head {
  position: relative;
  overflow: hidden;
  border-color: rgba(255,255,255,.11) !important;
  background: linear-gradient(105deg, rgba(4,10,13,.91), rgba(18,24,28,.86), rgba(5,10,13,.91)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055), 0 6px 24px rgba(0,0,0,.22);
}
.smart-shop-shelf[data-group-kind="services"] .smart-shop-shelf-head {
  border-color: rgba(42,238,202,.23) !important;
  background: linear-gradient(105deg, rgba(5,25,25,.94), rgba(19,22,34,.91), rgba(5,20,22,.94)) !important;
}
.smart-shop-shelf-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff !important;
  text-shadow: 0 1px 7px rgba(0,0,0,.9);
}
.smart-shop-shelf-shop {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: rgba(255,255,255,.62) !important;
}
.smart-shop-shelf-ai {
  border-color: rgba(42,238,202,.22) !important;
  background: linear-gradient(100deg, rgba(42,238,202,.20), rgba(255,55,126,.14)) !important;
  color: #bffbef !important;
}
.smart-shop-shelf.is-loading .smart-shop-shelf-page { opacity: 0; }
.smart-shop-card-skeleton {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0,1fr) 20px;
  min-width: 0;
  height: 94px;
  padding: 3px 3px 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 8px;
  background: rgba(255,255,255,.065);
}
.smart-shop-card-skeleton i,
.smart-shop-card-skeleton b {
  display: block;
  border-radius: 6px;
  background: rgba(255,255,255,.095);
}
.smart-shop-card-skeleton b { height: 8px; margin: 6px 14%; }
.smart-shop-product {
  overflow: hidden;
  box-shadow: 0 7px 20px rgba(0,0,0,.25), inset 0 0 0 1px rgba(255,255,255,.025) !important;
}
.smart-shop-product.is-service {
  border-color: rgba(42,238,202,.48) !important;
  background: linear-gradient(145deg, rgba(7,28,28,.96), rgba(13,16,24,.96)) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.34), 0 0 0 1px rgba(42,238,202,.08), 0 0 22px rgba(42,238,202,.08) !important;
}
.smart-shop-product.is-service::before {
  content: 'SERVICE';
  position: absolute;
  top: 5px;
  left: 5px;
  z-index: 2;
  padding: 2px 4px;
  border-radius: 999px;
  background: rgba(2,12,14,.80);
  color: #63f6d6;
  font-size: 6.5px;
  font-weight: 900;
  letter-spacing: .04em;
  box-shadow: 0 1px 7px rgba(0,0,0,.65);
}
.smart-shop-product.is-service img {
  object-fit: cover !important;
  background: radial-gradient(circle at 50% 30%, rgba(42,238,202,.13), rgba(6,10,13,.96)) !important;
}
.smart-shop-product.is-service .smart-shop-product-price {
  overflow: hidden;
  padding-inline: 4px;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: linear-gradient(90deg, rgba(42,238,202,.17), rgba(255,55,126,.09)) !important;
  color: #eafffa !important;
}
.smart-shop-shelf.is-entering[data-group-kind="services"] .smart-shop-product {
  animation-name: vc-v110-service-enter !important;
}
@keyframes vc-v110-service-enter {
  from { opacity: 0; transform: translateY(-7px) scale(.965); filter: blur(2px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: none; }
}
@keyframes vc-v110-shimmer { to { transform: translateX(120%); } }
@keyframes vc-v110-loader-breathe { 0%,100% { opacity: .72; } 50% { opacity: 1; } }

@media (max-width: 719px) {
  .location-context-summary { grid-template-columns: auto minmax(0,1fr); }
  .location-source-badge { font-size: 7.8px; }
  .smart-shop-card-skeleton { height: 74px; grid-template-rows: minmax(0,1fr) 17px; padding: 2px 2px 0; }
  .smart-shop-product.is-service::before { top: 3px; left: 3px; padding: 1px 3px; font-size: 5.4px; }
}
@media (min-width: 720px) and (max-width: 1099px) {
  .smart-shop-card-skeleton { height: 88px; grid-template-rows: minmax(0,1fr) 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .nearby-area-skeleton,
  .nearby-area-skeleton::after,
  .smart-shop-card-skeleton::after,
  .smart-shop-shelf.is-entering[data-group-kind="services"] .smart-shop-product { animation: none !important; }
}

/* ============================================================================
   v111.0.0 · Dark balanced mixed shelf + boot-ready feed reveal
   - product cards share the premium dark visual language of service cards
   - mobile recommendation rows use the whole safe width with balanced columns
   - initial feed never flashes a false empty state while network data is loading
   ========================================================================== */
.feed-loading-card {
  position: relative;
  display: grid;
  min-height: 100dvh;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 22% 18%, rgba(42,238,202,.13), transparent 34%),
    radial-gradient(circle at 78% 72%, rgba(255,55,126,.10), transparent 32%),
    linear-gradient(160deg, #04080b, #071116 54%, #030507);
}
.feed-loading-aura {
  position: absolute;
  inset: 18% 8%;
  border-radius: 42%;
  opacity: .62;
  background: conic-gradient(from 110deg, rgba(42,238,202,.12), transparent 30%, rgba(255,55,126,.10), transparent 68%, rgba(95,85,255,.11));
  filter: blur(42px);
  animation: vc-v111-aura 3.8s ease-in-out infinite alternate;
}
.feed-loading-content {
  position: relative;
  z-index: 1;
  display: grid;
  width: min(82vw, 330px);
  justify-items: center;
  gap: 10px;
  padding: 24px 20px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 28px;
  background: linear-gradient(145deg, rgba(8,18,22,.66), rgba(5,8,12,.50));
  box-shadow: 0 26px 70px rgba(0,0,0,.38), inset 0 1px rgba(255,255,255,.045);
  backdrop-filter: blur(18px) saturate(1.12);
  -webkit-backdrop-filter: blur(18px) saturate(1.12);
  text-align: center;
}
.feed-loading-content b { color: #f7fffd; font-size: 15px; font-weight: 930; letter-spacing: -.025em; }
.feed-loading-content small { color: rgba(235,255,251,.64); font-size: 11px; line-height: 1.45; }
.feed-loading-line {
  position: relative;
  width: min(190px, 72%);
  height: 2px;
  margin-top: 2px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.07);
}
.feed-loading-line i {
  position: absolute;
  inset: 0 auto 0 0;
  width: 46%;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, #2aeeca 32%, #ff4f91 74%, transparent);
  box-shadow: 0 0 15px rgba(42,238,202,.48);
  animation: vc-v111-load-line 1.25s cubic-bezier(.45,0,.55,1) infinite;
}

/* Product cards no longer use the stark white paper tile. The photo remains
   complete-fit, while the surrounding canvas, label lane and border stay dark. */
.smart-shop-product:not(.is-service) {
  border-color: rgba(62,244,214,.34) !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(42,238,202,.20), transparent 46%),
    radial-gradient(circle at 94% 18%, rgba(255,55,126,.13), transparent 42%),
    linear-gradient(150deg, rgba(8,30,32,.98), rgba(8,13,19,.98) 58%, rgba(17,10,22,.98)) !important;
  color: #f6fffd !important;
  box-shadow: 0 9px 24px rgba(0,0,0,.38), 0 0 0 1px rgba(42,238,202,.065), inset 0 1px rgba(255,255,255,.055) !important;
}
.smart-shop-product:not(.is-service):nth-child(4n + 2) {
  border-color: rgba(114,108,255,.34) !important;
  background: radial-gradient(circle at 80% 0%, rgba(112,105,255,.22), transparent 48%), linear-gradient(150deg, rgba(8,24,30,.98), rgba(11,12,24,.98)) !important;
}
.smart-shop-product:not(.is-service):nth-child(4n + 3) {
  border-color: rgba(255,179,82,.32) !important;
  background: radial-gradient(circle at 22% 0%, rgba(255,179,82,.20), transparent 48%), linear-gradient(150deg, rgba(26,22,12,.98), rgba(9,14,19,.98)) !important;
}
.smart-shop-product:not(.is-service):nth-child(4n) {
  border-color: rgba(255,83,145,.31) !important;
  background: radial-gradient(circle at 84% 0%, rgba(255,83,145,.19), transparent 48%), linear-gradient(150deg, rgba(8,27,29,.98), rgba(19,10,20,.98)) !important;
}
.smart-shop-product:not(.is-service)::after {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), inset 0 -20px 26px rgba(0,0,0,.08) !important;
}
.smart-shop-product:not(.is-service) img {
  border: 1px solid rgba(255,255,255,.055) !important;
  background:
    radial-gradient(circle at 50% 28%, rgba(121,255,233,.12), transparent 48%),
    linear-gradient(145deg, rgba(17,37,40,.94), rgba(7,11,16,.98)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.035) !important;
}
.smart-shop-product:not(.is-service) .smart-shop-product-price {
  color: #f7fffd !important;
  background: linear-gradient(90deg, rgba(42,238,202,.13), rgba(255,55,126,.08)) !important;
  text-shadow: 0 1px 5px rgba(0,0,0,.88) !important;
}
.smart-shop-product:not(.is-service):hover,
.smart-shop-product:not(.is-service):focus-visible {
  border-color: rgba(67,248,216,.80) !important;
  box-shadow: 0 15px 34px rgba(0,0,0,.48), 0 0 0 2px rgba(42,238,202,.22), 0 0 25px rgba(42,238,202,.10) !important;
}

@media (max-width: 719px) {
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf {
    left: 5px !important;
    right: 5px !important;
    width: auto !important;
    max-width: none !important;
  }
  .smart-shop-shelf-window,
  .smart-shop-shelf-track { width: 100% !important; }
  .smart-shop-shelf-track {
    justify-content: stretch !important;
    grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(0, 1fr)) !important;
    gap: 4px !important;
  }
  .smart-shop-product { width: 100% !important; max-width: none !important; }
}

@media (min-width: 720px) and (max-width: 1099px) {
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf { left: 10px !important; right: 10px !important; }
  .smart-shop-shelf-track { justify-content: stretch !important; }
}

@keyframes vc-v111-load-line {
  0% { transform: translateX(-120%); opacity: .35; }
  48% { opacity: 1; }
  100% { transform: translateX(320%); opacity: .35; }
}
@keyframes vc-v111-aura {
  from { transform: scale(.94) rotate(-2deg); opacity: .42; }
  to { transform: scale(1.04) rotate(2deg); opacity: .72; }
}
@media (prefers-reduced-motion: reduce) {
  .feed-loading-aura,
  .feed-loading-line i { animation: none !important; }
}


/* ============================================================================
   v113.0.0 · Responsive Details + secure account + conversational Vi AI + refined Quick Post
   - reliable, loading-first Live Sale with product pinning and host controls
   - balanced listing details and public profiles on phone, tablet and desktop
   - concise customer copy and a calmer, card-based account editor
   ========================================================================== */

/* Live Sale lobby */
#liveSheet .live-card {
  width: min(1040px, calc(100vw - 22px));
  max-width: 1040px;
  padding: 16px;
  background:
    radial-gradient(circle at 8% 0%, rgba(42,238,202,.11), transparent 32%),
    radial-gradient(circle at 92% 8%, rgba(255,55,126,.09), transparent 30%),
    linear-gradient(160deg, rgba(4,10,14,.995), rgba(3,6,10,.995));
}
#liveLobby { min-height: 280px; }
.live-v112-loading,
.profile-v112-loading,
.profile-v112-error {
  min-height: 300px;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 11px;
  padding: 28px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 28px;
  background: radial-gradient(circle at 50% 30%, rgba(42,238,202,.12), transparent 46%), rgba(255,255,255,.025);
  color: #f5fffd;
  text-align: center;
}
.live-v112-loader-orb {
  width: 62px;
  height: 62px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(42,238,202,.28);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(42,238,202,.17), rgba(255,55,126,.10));
  box-shadow: 0 18px 50px rgba(0,0,0,.36), 0 0 28px rgba(42,238,202,.08);
}
.live-v112-loader-orb svg { width: 28px; height: 28px; fill: none; stroke: #eafffb; stroke-width: 1.9; }
.live-v112-lobby { display: grid; gap: 16px; }
.live-v112-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 28px;
  background: linear-gradient(145deg, rgba(10,30,33,.90), rgba(11,11,21,.90));
  box-shadow: inset 0 1px rgba(255,255,255,.04), 0 18px 48px rgba(0,0,0,.24);
}
.live-v112-hero h2 { max-width: 680px; margin: 7px 0 0; font-size: clamp(20px, 3vw, 34px); line-height: 1.04; letter-spacing: -.045em; }
.live-v112-kicker,
.live-v112-network,
.live-v112-live-dot {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .07em;
}
.live-v112-kicker { color: #ffb8d1; }
.live-v112-kicker i,
.live-v112-live-dot i,
.live-v112-active > span i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ff397d;
  box-shadow: 0 0 0 0 rgba(255,57,125,.55);
  animation: vc-v112-live-pulse 1.2s infinite;
}
.live-v112-network { flex: 0 0 auto; padding: 9px 11px; border: 1px solid rgba(255,255,255,.11); background: rgba(255,255,255,.055); color: rgba(255,255,255,.74); letter-spacing: 0; }
.live-v112-network.ready { border-color: rgba(42,238,202,.28); color: #bffff1; background: rgba(42,238,202,.09); }
.live-v112-network svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.live-v112-active {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto auto;
  align-items: center;
  gap: 11px;
  padding: 12px 14px;
  border: 1px solid rgba(255,75,139,.25);
  border-radius: 22px;
  background: linear-gradient(120deg, rgba(255,55,126,.13), rgba(42,238,202,.07));
}
.live-v112-active > span { display: inline-flex; align-items: center; gap: 6px; color: #ffd5e4; font-size: 10px; font-weight: 950; }
.live-v112-active b,
.live-v112-active small { display: block; }
.live-v112-active small { margin-top: 2px; color: rgba(255,255,255,.60); font-size: 10px; }
.live-v112-setup {
  display: grid;
  grid-template-columns: minmax(280px, .9fr) minmax(300px, 1.1fr);
  gap: 14px;
  align-items: stretch;
}
.live-v112-preview,
.live-v112-fields,
.live-v112-products,
.live-v112-now,
.live-v112-host-panel {
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 26px;
  background: rgba(255,255,255,.035);
  box-shadow: inset 0 1px rgba(255,255,255,.035), 0 16px 42px rgba(0,0,0,.20);
}
.live-v112-preview { position: relative; min-height: 300px; overflow: hidden; display: grid; place-items: center; background: radial-gradient(circle at 50% 30%, rgba(42,238,202,.15), #020507 66%); }
.live-v112-preview video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #020406; }
.live-v112-preview-mask { position: relative; z-index: 1; display: grid; justify-items: center; gap: 8px; color: rgba(255,255,255,.67); }
.live-v112-preview-mask svg { width: 36px; height: 36px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.live-v112-preview.camera-ready .live-v112-preview-mask { opacity: 0; pointer-events: none; }
.live-v112-preview > button { position: absolute; z-index: 3; left: 12px; right: 12px; bottom: 12px; backdrop-filter: blur(14px); }
.live-v112-fields { display: grid; align-content: center; gap: 12px; padding: 18px; }
.live-v112-fields label { display: grid; gap: 6px; }
.live-v112-fields label > span { color: rgba(255,255,255,.67); font-size: 10px; font-weight: 900; letter-spacing: .03em; }
.live-v112-fields input { margin: 0; min-height: 48px; border-radius: 16px; }
.live-v112-checks { display: flex; flex-wrap: wrap; gap: 7px; }
.live-v112-checks span { display: inline-flex; align-items: center; gap: 5px; padding: 7px 9px; border: 1px solid rgba(42,238,202,.15); border-radius: 999px; background: rgba(42,238,202,.06); color: rgba(231,255,250,.73); font-size: 9px; font-weight: 850; }
.live-v112-checks svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.live-v112-start { min-height: 54px; border-radius: 18px; font-size: 14px; }
.live-v112-start span { display: inline-grid; margin-right: 7px; vertical-align: middle; }
.live-v112-start svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
.live-v112-products,
.live-v112-now,
.live-v112-host-panel { padding: 14px; }
.live-v112-section-head,
.live-v112-panel-head { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-bottom: 11px; }
.live-v112-section-head small,
.live-v112-panel-head small { color: var(--cyan); font-size: 8px; font-weight: 1000; letter-spacing: .14em; }
.live-v112-section-head h3,
.live-v112-panel-head h3 { margin: 3px 0 0; font-size: 17px; letter-spacing: -.03em; }
.live-v112-section-head > span { min-width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.10); border-radius: 10px; color: rgba(255,255,255,.68); font-size: 10px; font-weight: 950; }
.live-product-picker { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; }
.live-product-option { position: relative; min-width: 0; overflow: hidden; display: grid; grid-template-rows: 90px auto; gap: 0; border: 1px solid rgba(255,255,255,.10); border-radius: 18px; background: rgba(255,255,255,.04); cursor: pointer; transition: transform .18s ease, border-color .18s ease, background .18s ease; }
.live-product-option:hover { transform: translateY(-2px); border-color: rgba(42,238,202,.34); }
.live-product-option.selected { border-color: rgba(42,238,202,.78); background: linear-gradient(145deg, rgba(42,238,202,.13), rgba(255,55,126,.06)); box-shadow: 0 0 0 2px rgba(42,238,202,.10), 0 12px 28px rgba(0,0,0,.25); }
.live-product-option input { position: absolute; opacity: 0; pointer-events: none; }
.live-product-option-media { min-width: 0; overflow: hidden; display: grid; place-items: center; background: radial-gradient(circle, rgba(42,238,202,.09), #05090d 70%); }
.live-product-option-media img { width: 100%; height: 100%; object-fit: contain; }
.live-product-option-copy { min-width: 0; display: grid; gap: 2px; padding: 8px; }
.live-product-option-copy b,
.live-product-option-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-product-option-copy b { font-size: 10px; }
.live-product-option-copy small { color: rgba(255,255,255,.58); font-size: 8.5px; }
.live-product-option > i { position: absolute; top: 7px; right: 7px; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: rgba(2,8,10,.78); color: var(--cyan); font-size: 11px; font-style: normal; }
.live-v112-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }
.live-v112-tile { min-width: 0; display: grid; grid-template-columns: 106px minmax(0,1fr); grid-template-rows: auto auto; gap: 9px 11px; padding: 9px; border: 1px solid rgba(255,255,255,.09); border-radius: 22px; background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.025)); }
.live-v112-tile.mine-live { border-color: rgba(255,55,126,.28); }
.live-v112-cover { position: relative; grid-row: 1 / 3; min-height: 108px; overflow: hidden; padding: 0; border: 0; border-radius: 16px; background: #030608; color: #fff; }
.live-v112-cover img { width: 100%; height: 100%; object-fit: cover; }
.live-v112-live-dot { position: absolute; top: 7px; left: 7px; padding: 5px 7px; background: rgba(8,3,7,.76); color: #fff; font-size: 7px; }
.live-v112-cover em { position: absolute; left: 7px; right: 7px; bottom: 7px; overflow: hidden; padding: 5px 6px; border-radius: 8px; background: rgba(0,0,0,.60); color: rgba(255,255,255,.82); font-size: 7px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.live-v112-tile-copy { min-width: 0; align-self: end; }
.live-v112-tile-copy b,
.live-v112-tile-copy small,
.live-v112-tile-copy span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-v112-tile-copy b { font-size: 13px; }
.live-v112-tile-copy small { margin-top: 3px; color: rgba(255,255,255,.56); font-size: 9px; }
.live-v112-tile-copy span { margin-top: 5px; color: #bffbed; font-size: 9px; font-weight: 850; }
.live-v112-tile-actions { display: flex; gap: 7px; align-self: start; }
.live-v112-tile-actions button { min-height: 34px; padding: 7px 10px; border-radius: 11px; font-size: 9px; }
.live-v112-empty { min-height: 130px; display: grid; align-content: center; justify-items: center; gap: 6px; padding: 18px; border: 1px dashed rgba(255,255,255,.10); border-radius: 20px; background: rgba(255,255,255,.025); text-align: center; }
.live-v112-empty.compact { min-height: 82px; }
.live-v112-empty svg { width: 25px; height: 25px; fill: none; stroke: rgba(255,255,255,.65); stroke-width: 1.8; }
.live-v112-empty small { color: rgba(255,255,255,.56); font-size: 10px; line-height: 1.4; }

/* Live room */
.live-v112-room-wrap { display: grid; gap: 12px; }
.live-v112-room { min-height: min(76dvh, 760px) !important; border-radius: 28px !important; }
.live-v112-room .live-video { height: min(76dvh, 760px) !important; }
.live-v112-host-name { position: absolute; z-index: 5; left: 14px; top: 58px; max-width: calc(100% - 100px); padding: 8px 10px; border-radius: 14px; background: rgba(0,0,0,.42); backdrop-filter: blur(12px); }
.live-v112-host-name b,
.live-v112-host-name small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-v112-host-name b { font-size: 12px; }
.live-v112-host-name small { margin-top: 2px; color: rgba(255,255,255,.62); font-size: 9px; }
.live-v112-room .live-side button { display: grid; place-items: center; background: transparent !important; border-color: transparent !important; box-shadow: none !important; backdrop-filter: none !important; }
.live-v112-room .live-side button:hover,
.live-v112-room .live-side button:focus-visible { background: rgba(0,0,0,.24) !important; border-color: rgba(255,255,255,.12) !important; }
.live-v112-room .live-side button svg { width: 28px; height: 28px; filter: drop-shadow(0 2px 8px rgba(0,0,0,.9)); }
.live-v112-pinned { display: grid; grid-template-columns: 76px minmax(0,1fr) auto; align-items: center; gap: 11px; padding: 10px; border: 1px solid rgba(42,238,202,.18); border-radius: 22px; background: linear-gradient(120deg, rgba(42,238,202,.09), rgba(255,55,126,.05)); }
.live-v112-pinned.empty { grid-template-columns: auto minmax(0,1fr); }
.live-v112-pinned > img { width: 76px; height: 66px; object-fit: contain; border-radius: 15px; background: #071014; }
.live-v112-pinned small,
.live-v112-pinned b,
.live-v112-pinned span { display: block; }
.live-v112-pinned small { color: var(--cyan); font-size: 8px; font-weight: 950; letter-spacing: .08em; }
.live-v112-pinned b { margin-top: 3px; overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.live-v112-pinned span { color: rgba(255,255,255,.60); font-size: 9px; }
.live-v112-host-panel { margin: 0; }
.live-v112-panel-head > span { display: inline-flex; align-items: center; gap: 6px; color: rgba(255,255,255,.58); font-size: 9px; }
.live-v112-panel-head svg { width: 15px; height: 15px; fill: none; stroke: var(--cyan); stroke-width: 1.8; }
.live-v112-host-panel .live-viewer-row { border-radius: 15px; }
.live-v112-host-panel .host-controls { grid-template-columns: 1fr 1fr !important; }

/* Listing details */
#detailBody { min-width: 0; }
.detail-v112-layout { display: grid; gap: 12px; }
.detail-v112-media { min-width: 0; }
.detail-v112-media .detail-media { margin-bottom: 8px; }
.detail-v112-content { min-width: 0; display: grid; align-content: start; gap: 12px; }
.detail-v112-summary,
.detail-v112-insights,
.detail-v112-actions,
.detail-v112-content > .owner-tools,
.detail-v112-content > .detail-service-note {
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.022));
  box-shadow: inset 0 1px rgba(255,255,255,.035);
}
.detail-v112-summary { display: grid; gap: 9px; padding: 13px; }
.detail-v112-summary .seller-line { margin: 0; padding: 0 0 9px; border-bottom: 1px solid rgba(255,255,255,.07); }
.detail-v112-badges { margin: 0; gap: 5px; }
.detail-v112-summary .detail-title-main { margin: 0; font-size: clamp(25px, 5vw, 38px); line-height: 1.02; letter-spacing: -.047em; }
.detail-v112-summary .detail-description { margin: 0; color: rgba(237,255,251,.69); font-size: 12px; line-height: 1.55; }
.detail-v112-tags { margin: 0; }
.detail-v112-insights { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; padding: 9px; }
.detail-v112-insights > * { min-width: 0; margin: 0 !important; border-radius: 18px !important; }
.detail-v112-insights .detail-ai-card { grid-column: 1 / -1; }
.detail-v112-trust { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 9px; padding: 11px; }
.detail-v112-trust > span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 13px; background: rgba(42,238,202,.09); }
.detail-v112-trust svg { width: 19px; height: 19px; fill: none; stroke: var(--cyan); stroke-width: 1.8; }
.detail-v112-trust b,
.detail-v112-trust small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.detail-v112-trust small { color: rgba(255,255,255,.58); font-size: 9px; }
.detail-v112-content > .owner-tools { margin: 0; padding: 9px; }
.detail-v112-content > .detail-service-note { margin: 0; padding: 11px; }
.detail-v112-actions { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; margin: 0; padding: 9px; }
.detail-v112-actions .primary,
.detail-v112-actions .soft { min-height: 44px; border-radius: 15px; }

/* Public profile */
#profileBody { min-width: 0; }
.profile-v112 { display: grid; gap: 12px; }
.profile-v112-hero {
  min-width: 0;
  display: grid;
  grid-template-columns: 104px minmax(0,1fr);
  gap: 15px;
  align-items: center;
  padding: 15px;
  border: 1px solid rgba(42,238,202,.15);
  border-radius: 28px;
  background:
    radial-gradient(circle at 12% 16%, rgba(42,238,202,.15), transparent 36%),
    linear-gradient(145deg, rgba(9,26,29,.94), rgba(11,10,19,.94));
  box-shadow: inset 0 1px rgba(255,255,255,.045), 0 18px 48px rgba(0,0,0,.25);
}
.profile-v112-avatar { position: relative; width: 104px; height: 104px; display: block; border-radius: 34px; padding: 3px; background: linear-gradient(145deg, var(--cyan), rgba(255,55,126,.82)); box-shadow: 0 14px 36px rgba(0,0,0,.36); }
.profile-v112-avatar img { width: 100%; height: 100%; display: block; object-fit: cover; border: 3px solid #071014; border-radius: 31px; }
.profile-v112-avatar i { position: absolute; right: 3px; bottom: 5px; }
.profile-v112-identity { min-width: 0; }
.profile-v112-kicker { color: var(--cyan); font-size: 8px; font-weight: 1000; letter-spacing: .10em; text-transform: uppercase; }
.profile-v112-identity h2 { margin: 5px 0 2px; overflow: hidden; font-size: clamp(22px, 4vw, 34px); letter-spacing: -.045em; text-overflow: ellipsis; }
.profile-v112-identity strong { display: block; color: rgba(246,255,253,.82); font-size: 12px; }
.profile-v112-identity > small { display: flex; align-items: center; gap: 5px; margin-top: 5px; color: rgba(255,255,255,.59); font-size: 10px; }
.profile-v112-identity > small svg { width: 13px; height: 13px; fill: none; stroke: var(--cyan); stroke-width: 2; }
.profile-v112-identity p { margin: 8px 0 0; color: rgba(238,255,252,.67); font-size: 11px; line-height: 1.5; }
.profile-v112-stats { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.profile-v112-stats > div { min-width: 0; padding: 11px 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 18px; background: rgba(255,255,255,.035); }
.profile-v112-stats small,
.profile-v112-stats b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-v112-stats small { color: rgba(255,255,255,.50); font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.profile-v112-stats b { margin-top: 4px; font-size: 12px; }
.profile-v112-actions { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; margin: 0; padding: 9px; border: 1px solid rgba(255,255,255,.08); border-radius: 22px; background: rgba(255,255,255,.03); }
.profile-v112-actions a,
.profile-v112-actions button { min-width: 0; min-height: 43px; display: flex; align-items: center; justify-content: center; gap: 6px; margin: 0; border-radius: 14px; }
.profile-v112-intelligence { display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr); gap: 9px; }
.profile-v112-intelligence .profile-trust-card,
.profile-v112-intelligence .profile-qr { min-width: 0; margin: 0; border-radius: 22px; }
.profile-v112-intelligence .profile-qr { display: grid; align-content: center; }
.profile-v112-intelligence .vc-qr-card { min-width: 0; }
.profile-v112-showroom { padding: 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 24px; background: rgba(255,255,255,.026); }
.profile-v112-showroom .showroom-head { margin: 0 0 10px; align-items: center; }
.profile-v112-showroom .showroom-head > div:first-child small { color: var(--cyan); font-size: 8px; font-weight: 1000; letter-spacing: .13em; }
.profile-v112-showroom .showroom-head h3 { margin-top: 3px; }
.profile-v112-showroom .showroom-head > div:last-child { display: flex; align-items: center; gap: 7px; }
.profile-v112-showroom .showroom-grid { margin: 0; grid-template-columns: repeat(4, minmax(0,1fr)); }
.profile-v112-showroom .inside-card { min-width: 0; }
.profile-v112-empty,
.profile-v112-error { min-height: 160px; }
.profile-v112-empty { grid-column: 1 / -1; display: grid; place-items: center; gap: 7px; padding: 22px; color: rgba(255,255,255,.61); text-align: center; }
.profile-v112-empty svg { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 1.6; }

/* Your Profile editor */
#meSheet .sheet-card { width: min(760px, calc(100vw - 20px)); max-width: 760px; }
.me-v112-intro { margin: 0 0 10px; color: rgba(235,255,250,.60); font-size: 11px; line-height: 1.45; }
.me-v112-section,
.me-v112-overview {
  margin: 0 0 11px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(255,255,255,.042), rgba(255,255,255,.022));
  box-shadow: inset 0 1px rgba(255,255,255,.03);
}
.me-v112-overview { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.me-v112-overview > * { min-width: 0; margin: 0 !important; }
.me-v112-overview #profileTrustOpen { grid-column: 1 / -1; }
.me-v112-section-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 10px; }
.me-v112-section-head small { color: var(--cyan); font-size: 8px; font-weight: 1000; letter-spacing: .13em; }
.me-v112-section-head h4 { margin: 3px 0 0; font-size: 15px; letter-spacing: -.025em; }
.me-v112-signin { padding: 0; overflow: hidden; }
#meSheet .me-v112-signin .signin-card { margin: 0; border: 0; border-radius: 23px; background: transparent; }
#meSheet .profile-editor-avatar { margin: 0 0 10px; grid-template-columns: 78px minmax(0,1fr); border-radius: 20px; }
#meSheet .profile-editor-avatar > span:last-child { min-width: 0; }
#meSheet .profile-editor-avatar small { display: block; margin-top: 4px; color: rgba(255,255,255,.53); font-size: 9px; line-height: 1.35; }
#meSheet .me-v112-fields { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
#meSheet .me-v112-fields input,
#meSheet .me-v112-fields textarea { min-width: 0; margin: 0; }
#meSheet .me-v112-fields textarea,
#meSheet .me-v112-fields .pin-help { grid-column: 1 / -1; }
#meSheet .me-v112-service { display: block; }
#meSheet .me-v112-service .service-provider-toggle { max-width: 340px; }
#meSheet .me-v112-service .service-profile-fields { margin-top: 10px; }
#meSheet .profile-cover-editor > span:last-child { min-width: 0; }
.me-v112-service-note { display: block; color: rgba(255,255,255,.56); font-size: 9.5px; line-height: 1.45; }
#meSheet .me-v112-preferences .profile-switches { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; margin: 0; }
#meSheet .me-v112-preferences .profile-switches label { margin: 0; border-radius: 17px; }
.me-v112-tool-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.me-v112-tool-grid button { min-width: 0; min-height: 58px; display: grid; align-content: center; justify-items: start; margin: 0; padding: 10px 12px; text-align: left; border-radius: 17px; }
.me-v112-tool-grid button b,
.me-v112-tool-grid button small { display: block; }
.me-v112-tool-grid button small { margin-top: 3px; color: rgba(255,255,255,.50); font-size: 9px; }
.me-v112-savebar { position: sticky; z-index: 10; bottom: -1px; display: grid; grid-template-columns: auto minmax(0,1fr); gap: 9px; align-items: center; padding: 10px 0 2px; background: linear-gradient(180deg, transparent, rgba(4,8,11,.96) 28%); }
.me-v112-savebar .language-inline { margin: 0; }
.me-v112-savebar #saveProfile { margin: 0; min-height: 48px; border-radius: 17px; }

@keyframes vc-v112-live-pulse {
  70% { box-shadow: 0 0 0 9px rgba(255,57,125,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,57,125,0); }
}

@media (min-width: 1100px) {
  #detailSheet .detail-card { width: min(1180px, calc(100vw - 42px)); max-width: 1180px; }
  .detail-v112-layout { grid-template-columns: minmax(0,1.28fr) minmax(350px,.72fr); align-items: start; }
  .detail-v112-media { position: sticky; top: 78px; }
  .detail-v112-media .detail-media { height: min(72dvh, 720px) !important; }
  .detail-v112-content { max-height: calc(100dvh - 116px); overflow-y: auto; padding-right: 3px; scrollbar-width: thin; }
  #profileSheet .sheet-card { width: min(980px, calc(100vw - 42px)); max-width: 980px; }
  .profile-v112-showroom .showroom-grid { grid-template-columns: repeat(5, minmax(0,1fr)); }
}

@media (max-width: 719px) {
  #liveSheet .live-card,
  #meSheet .sheet-card { width: 100%; max-width: none; padding: 12px; }
  .live-v112-hero { align-items: flex-start; padding: 13px; border-radius: 22px; }
  .live-v112-hero h2 { font-size: 20px; }
  .live-v112-network { padding: 7px 8px; font-size: 8px; }
  .live-v112-active { grid-template-columns: auto minmax(0,1fr); }
  .live-v112-active button { min-width: 0; }
  .live-v112-active > button { grid-row: 2; }
  .live-v112-active #resumeLiveBtn { grid-column: 1; }
  .live-v112-active #stopOwnerLiveBtn { grid-column: 2; }
  .live-v112-setup { grid-template-columns: 1fr; }
  .live-v112-preview { min-height: 220px; }
  .live-v112-fields { padding: 13px; }
  .live-v112-products,
  .live-v112-now,
  .live-v112-host-panel { padding: 10px; border-radius: 22px; }
  .live-product-picker { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 6px; }
  .live-product-option { grid-template-rows: 76px auto; border-radius: 15px; }
  .live-v112-list { grid-template-columns: 1fr; }
  .live-v112-tile { grid-template-columns: 92px minmax(0,1fr); }
  .live-v112-room { min-height: min(70dvh, 640px) !important; border-radius: 22px !important; }
  .live-v112-room .live-video { height: min(70dvh, 640px) !important; }
  .live-v112-host-name { top: 54px; }
  .live-v112-pinned { grid-template-columns: 58px minmax(0,1fr) auto; padding: 8px; border-radius: 18px; }
  .live-v112-pinned > img { width: 58px; height: 54px; border-radius: 12px; }
  .live-v112-host-panel .host-controls { grid-template-columns: 1fr !important; }

  .detail-v112-layout { gap: 9px; }
  .detail-v112-media .detail-media { border-radius: 22px; }
  .detail-v112-summary,
  .detail-v112-insights,
  .detail-v112-actions { border-radius: 20px; }
  .detail-v112-insights { grid-template-columns: 1fr; }
  .detail-v112-insights .detail-ai-card { grid-column: auto; }
  .detail-v112-actions { grid-template-columns: repeat(2, minmax(0,1fr)); }

  .profile-v112-hero { grid-template-columns: 82px minmax(0,1fr); gap: 11px; padding: 12px; border-radius: 23px; }
  .profile-v112-avatar { width: 82px; height: 82px; border-radius: 27px; }
  .profile-v112-avatar img { border-radius: 24px; }
  .profile-v112-identity h2 { font-size: 23px; }
  .profile-v112-stats { gap: 5px; }
  .profile-v112-stats > div { padding: 9px 8px; border-radius: 15px; }
  .profile-v112-actions { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .profile-v112-intelligence { grid-template-columns: 1fr; }
  .profile-v112-showroom { padding: 9px; border-radius: 20px; }
  .profile-v112-showroom .showroom-grid { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 6px; }
  .profile-v112-showroom .showroom-head { align-items: flex-start; }
  .profile-v112-showroom .showroom-head > div:last-child { display: grid; justify-items: end; }

  .me-v112-section,
  .me-v112-overview { padding: 10px; border-radius: 20px; }
  .me-v112-overview { grid-template-columns: 1fr; }
  .me-v112-overview #profileTrustOpen { grid-column: auto; }
  #meSheet .me-v112-fields { grid-template-columns: 1fr; }
  #meSheet .me-v112-fields textarea,
  #meSheet .me-v112-fields .pin-help { grid-column: auto; }
  #meSheet .me-v112-preferences .profile-switches { grid-template-columns: 1fr; }
  .me-v112-tool-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 390px) {
  .live-product-picker { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .live-v112-network { display: none; }
  .profile-v112-hero { grid-template-columns: 72px minmax(0,1fr); }
  .profile-v112-avatar { width: 72px; height: 72px; }
  .profile-v112-stats { grid-template-columns: 1fr 1fr; }
  .profile-v112-stats > div:last-child { grid-column: 1 / -1; }
  .me-v112-tool-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .live-v112-kicker i,
  .live-v112-live-dot i,
  .live-v112-active > span i { animation: none !important; }
  .live-product-option { transition: none !important; }
}

/* v112 account-state polish: active accounts show one clear secure status instead of a redundant sign-in form. */
#meSheet .me-v112-signed-pill {
  display: flex; align-items: center; gap: 9px; width: fit-content; margin-top: 10px;
  padding: 9px 12px; border: 1px solid rgba(42,238,202,.26); border-radius: 999px;
  background: linear-gradient(135deg, rgba(42,238,202,.12), rgba(32,72,87,.18)); color: #effffb;
  font-size: 10px; letter-spacing: .01em;
}
#meSheet .me-v112-signed-pill[hidden] { display: none !important; }
#meSheet .me-v112-signed-pill > span {
  display: grid; place-items: center; width: 23px; height: 23px; border-radius: 50%;
  background: var(--cyan); color: #031411; font-weight: 1000;
}
#meSheet .signin-card.is-active-account { padding: 14px 16px !important; }
#meSheet .signin-card.is-active-account .secure-signin,
#meSheet .signin-card.is-active-account .forgot-pin-btn { display: none !important; }

/* ========================================================================== */
/* v113: responsive details, secure account controls, conversational AI room  */
/* and a single-loader professional Quick Post workspace.                     */
/* ========================================================================== */

/* Product details: neutralize legacy direct-child desktop grids. The v113
   wrapper owns the complete two-column composition on large screens. */
#detailSheet.sheet[open] {
  display: grid !important;
  place-items: center !important;
  padding: 16px !important;
}
#detailSheet .detail-card {
  width: min(1420px, calc(100vw - 32px)) !important;
  max-width: 1420px !important;
  height: min(920px, calc(100dvh - 32px)) !important;
  max-height: calc(100dvh - 32px) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  padding: 0 !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(24,243,238,.055), transparent 31%),
    radial-gradient(circle at 88% 100%, rgba(255,47,126,.045), transparent 34%),
    rgba(3,7,10,.985) !important;
}
#detailSheet .detail-card > .sheet-bar { flex: 0 0 auto !important; margin-top: 10px !important; }
#detailSheet .detail-card > .sheet-title {
  flex: 0 0 auto !important;
  min-height: 72px !important;
  margin: 0 !important;
  padding: 10px 20px 14px !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
}
#detailSheet .detail-card > .sheet-title > div { min-width: 0 !important; }
#detailSheet .detail-card > .sheet-title h3 {
  max-width: min(760px, 70vw) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#detailSheet #detailBody {
  flex: 1 1 auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  display: block !important;
  overflow: hidden !important;
  padding: 0 !important;
}
#detailSheet #detailBody > .detail-v113-layout {
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.34fr) minmax(390px, .66fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: stretch !important;
  padding: 16px 18px 18px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
#detailSheet .detail-v113-layout > * { min-width: 0 !important; min-height: 0 !important; }
#detailSheet .detail-v113-media {
  position: static !important;
  top: auto !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  align-content: stretch !important;
  gap: 8px !important;
  overflow: hidden !important;
}
#detailSheet .detail-v113-media .detail-media {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  border-radius: 24px !important;
  background: #080a0d !important;
}
#detailSheet .detail-v113-media .detail-main { object-fit: contain !important; }
#detailSheet .detail-v113-media .detail-thumbs {
  width: 100% !important;
  min-height: 68px !important;
  max-height: 78px !important;
  margin: 0 !important;
  padding: 2px 1px 2px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}
#detailSheet .detail-v113-content {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-content: initial !important;
  gap: 10px !important;
  padding: 0 4px 2px 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(24,243,238,.34) transparent !important;
}
#detailSheet .detail-v113-content > * {
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
#detailSheet .detail-v113-summary,
#detailSheet .detail-v113-insights,
#detailSheet .detail-v113-actions,
#detailSheet .detail-v113-content > .owner-tools,
#detailSheet .detail-v113-content > .detail-service-note {
  margin: 0 !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.018)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.025) !important;
}
#detailSheet .detail-v113-summary { padding: 14px !important; border-radius: 22px !important; }
#detailSheet .detail-v113-summary .seller-line { width: 100% !important; min-width: 0 !important; }
#detailSheet .detail-v113-summary .seller-text { min-width: 0 !important; }
#detailSheet .detail-v113-summary .detail-title-main {
  max-width: 100% !important;
  font-size: clamp(25px, 2.25vw, 38px) !important;
  line-height: 1.04 !important;
  overflow-wrap: anywhere !important;
}
#detailSheet .detail-v113-summary .detail-description {
  max-width: 100% !important;
  font-size: 12px !important;
  line-height: 1.52 !important;
  overflow-wrap: anywhere !important;
}
#detailSheet .detail-v113-insights {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 9px !important;
  border-radius: 22px !important;
}
#detailSheet .detail-v113-insights > * { min-width: 0 !important; margin: 0 !important; }
#detailSheet .detail-v113-ai {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-height: 72px !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 11px !important;
  padding: 12px !important;
  text-align: left !important;
  overflow: hidden !important;
  cursor: pointer !important;
}
#detailSheet .detail-v113-ai > div { min-width: 0 !important; }
#detailSheet .detail-v113-ai b,
#detailSheet .detail-v113-ai small {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}
#detailSheet .detail-v113-ai b { font-size: 13px !important; line-height: 1.15 !important; }
#detailSheet .detail-v113-ai small { margin-top: 3px !important; font-size: 10px !important; line-height: 1.38 !important; color: rgba(255,255,255,.67) !important; }
#detailSheet .detail-v113-ai > i { display: grid !important; place-items: center !important; color: var(--cyan) !important; }
#detailSheet .detail-v113-ai > i svg { width: 17px !important; height: 17px !important; }
#detailSheet .detail-v113-insights .price-radar-box,
#detailSheet .detail-v113-insights .trust-mini {
  min-height: 72px !important;
  display: grid !important;
  grid-template-columns: 36px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 10px !important;
}
#detailSheet .detail-v113-insights b,
#detailSheet .detail-v113-insights small {
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
#detailSheet .detail-v113-actions {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 7 !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 10px !important;
  border-radius: 22px !important;
  background: linear-gradient(180deg, rgba(6,12,15,.97), rgba(4,8,11,.995)) !important;
  box-shadow: 0 -12px 34px rgba(0,0,0,.24), inset 0 1px rgba(255,255,255,.04) !important;
}
#detailSheet .detail-v113-actions > button,
#detailSheet .detail-v113-actions > a {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 43px !important;
  margin: 0 !important;
  padding: 8px 9px !important;
  display: grid !important;
  place-items: center !important;
  text-align: center !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  line-height: 1.16 !important;
}

/* Vi AI is a conversation room, not a dashboard. */
#aiHelpSheet.sheet[open] {
  display: grid !important;
  place-items: center !important;
  padding: 16px !important;
}
#aiHelpSheet .ai-room-card {
  width: min(780px, calc(100vw - 32px)) !important;
  max-width: 780px !important;
  height: min(850px, calc(100dvh - 32px)) !important;
  max-height: calc(100dvh - 32px) !important;
  min-height: min(620px, calc(100dvh - 32px)) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(24,243,238,.075), transparent 31%),
    radial-gradient(circle at 90% 100%, rgba(255,47,126,.055), transparent 33%),
    rgba(4,8,12,.988) !important;
}
#aiHelpSheet .ai-room-card > .sheet-bar { flex: 0 0 auto !important; margin-top: 10px !important; }
#aiHelpSheet .ai-room-title {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 10px 18px 13px !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
}
#aiHelpSheet .ai-room-title h3 { font-size: 18px !important; letter-spacing: -.025em !important; }
#aiHelpSheet .ai-room-head-actions { display: flex !important; align-items: center !important; gap: 8px !important; }
#aiHelpSheet .ai-room-new {
  width: 40px !important;
  height: 40px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(24,243,238,.22) !important;
  border-radius: 15px !important;
  background: rgba(24,243,238,.075) !important;
  color: #eaffff !important;
  font-size: 20px !important;
  font-weight: 500 !important;
}
#aiHelpSheet .ai-room-context {
  flex: 0 0 auto !important;
  width: fit-content !important;
  max-width: calc(100% - 36px) !important;
  margin: 10px 18px 0 !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(24,243,238,.17) !important;
  border-radius: 999px !important;
  background: rgba(24,243,238,.055) !important;
  color: rgba(224,255,251,.72) !important;
  font-size: 9px !important;
  font-weight: 820 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#aiHelpSheet .ai-room-messages,
#aiHelpSheet .ai-help-results.ai-room-messages {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 18px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 11px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scroll-behavior: smooth !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(24,243,238,.28) transparent !important;
}
#aiHelpSheet .ai-room-message-v113 {
  width: 100% !important;
  display: flex !important;
  align-items: flex-end !important;
  gap: 8px !important;
}
#aiHelpSheet .ai-room-message-v113.user { justify-content: flex-end !important; }
#aiHelpSheet .ai-room-bubble-avatar-v113 {
  flex: 0 0 31px !important;
  width: 31px !important;
  height: 31px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, rgba(24,243,238,.92), rgba(255,47,126,.88)) !important;
  box-shadow: 0 8px 20px rgba(24,243,238,.13) !important;
}
#aiHelpSheet .ai-room-bubble-avatar-v113 i {
  width: 10px !important;
  height: 10px !important;
  border-radius: 3px !important;
  background: #041013 !important;
  transform: rotate(45deg) !important;
}
#aiHelpSheet .ai-room-bubble-v113 {
  width: fit-content !important;
  max-width: min(82%, 610px) !important;
  min-width: 0 !important;
  padding: 11px 13px !important;
  border: 1px solid rgba(255,255,255,.095) !important;
  border-radius: 18px 18px 18px 6px !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.16) !important;
}
#aiHelpSheet .ai-room-message-v113.user .ai-room-bubble-v113 {
  border-color: rgba(24,243,238,.22) !important;
  border-radius: 18px 18px 6px 18px !important;
  background: linear-gradient(145deg, rgba(24,243,238,.16), rgba(19,66,75,.20)) !important;
}
#aiHelpSheet .ai-room-bubble-v113 > p {
  margin: 0 !important;
  color: rgba(247,255,254,.91) !important;
  font-size: 13px !important;
  line-height: 1.52 !important;
  white-space: pre-wrap !important;
  overflow-wrap: anywhere !important;
}
#aiHelpSheet .ai-room-followups-v113 {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-top: 10px !important;
}
#aiHelpSheet .ai-room-followups-v113 button {
  min-height: 31px !important;
  padding: 7px 9px !important;
  border: 1px solid rgba(24,243,238,.18) !important;
  border-radius: 999px !important;
  background: rgba(24,243,238,.065) !important;
  color: #eaffff !important;
  font-size: 9.5px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
}
#aiHelpSheet .ai-room-items-v113 {
  display: grid !important;
  gap: 6px !important;
  margin-top: 10px !important;
}
#aiHelpSheet .ai-room-items-v113 > button {
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) 17px !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 7px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 14px !important;
  background: rgba(0,0,0,.18) !important;
  color: #fff !important;
  text-align: left !important;
}
#aiHelpSheet .ai-room-items-v113 img { width: 42px !important; height: 42px !important; border-radius: 11px !important; object-fit: cover !important; }
#aiHelpSheet .ai-room-items-v113 span { min-width: 0 !important; }
#aiHelpSheet .ai-room-items-v113 b,
#aiHelpSheet .ai-room-items-v113 small { display: block !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
#aiHelpSheet .ai-room-items-v113 b { font-size: 10.5px !important; }
#aiHelpSheet .ai-room-items-v113 small { margin-top: 3px !important; color: rgba(255,255,255,.54) !important; font-size: 8.5px !important; }
#aiHelpSheet .ai-room-typing-v113 { display: flex !important; align-items: center !important; gap: 8px !important; }
#aiHelpSheet .ai-room-typing-v113 small { color: rgba(255,255,255,.54) !important; font-size: 9px !important; }
#aiHelpSheet .ai-room-composer {
  flex: 0 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 48px !important;
  align-items: end !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 11px 14px 9px !important;
  border-top: 1px solid rgba(255,255,255,.075) !important;
  background: linear-gradient(180deg, rgba(4,8,12,.74), rgba(4,8,12,.99) 32%) !important;
  backdrop-filter: blur(18px) !important;
}
#aiHelpSheet #aiHelpText {
  width: 100% !important;
  min-height: 46px !important;
  max-height: 132px !important;
  margin: 0 !important;
  padding: 13px 14px !important;
  resize: none !important;
  border-radius: 17px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.055) !important;
  color: #fff !important;
  line-height: 1.35 !important;
}
#aiHelpSheet .ai-room-send {
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 17px !important;
  font-size: 20px !important;
}
#aiHelpSheet .ai-room-note {
  flex: 0 0 auto !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 16px 11px !important;
  color: rgba(255,255,255,.39) !important;
  font-size: 8.5px !important;
  line-height: 1.35 !important;
  text-align: center !important;
}
#aiHelpSheet .ai-hero-strip,
#aiHelpSheet .ai-pro-strip,
#aiHelpSheet .ai-quick-row { display: none !important; }

/* Quick Post: one polished workspace and exactly one animated status at a time. */
#postSheet.sheet[open] {
  display: grid !important;
  place-items: center !important;
  padding: 16px !important;
}
#postSheet .post-v113-card {
  width: min(1120px, calc(100vw - 32px)) !important;
  max-width: 1120px !important;
  height: min(850px, calc(100dvh - 32px)) !important;
  max-height: calc(100dvh - 32px) !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 0 0, rgba(24,243,238,.055), transparent 33%),
    radial-gradient(circle at 100% 100%, rgba(255,47,126,.045), transparent 35%),
    rgba(4,8,11,.988) !important;
}
#postSheet .post-v113-card > .sheet-bar { flex: 0 0 auto !important; margin-top: 10px !important; }
#postSheet .post-v113-card > .sheet-title {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 10px 18px 13px !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
}
#postSheet .post-v113-layout {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(360px, .92fr) minmax(430px, 1.08fr) !important;
  gap: 14px !important;
  padding: 14px 16px 16px !important;
  overflow: hidden !important;
}
#postSheet .post-v113-media-column,
#postSheet .post-v113-editor-column {
  min-width: 0 !important;
  min-height: 0 !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.025) !important;
}
#postSheet .post-v113-media-column {
  display: flex !important;
  flex-direction: column !important;
  padding: 12px !important;
  overflow: hidden !important;
}
#postSheet .post-v113-editor-column {
  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
  padding: 12px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
}
#postSheet .post-v113-section-head { flex: 0 0 auto !important; display: grid !important; gap: 3px !important; margin: 0 2px 10px !important; }
#postSheet .post-v113-section-head b { font-size: 13px !important; }
#postSheet .post-v113-section-head small { color: rgba(255,255,255,.52) !important; font-size: 9.5px !important; line-height: 1.4 !important; }
#postSheet .post-v113-upload {
  flex: 1 1 auto !important;
  width: 100% !important;
  min-height: 300px !important;
  height: 100% !important;
  max-height: none !important;
  margin: 0 !important;
  border-radius: 20px !important;
  background: linear-gradient(145deg, rgba(24,243,238,.055), rgba(255,47,126,.035)), #080b0e !important;
}
#postSheet .post-v113-upload img { width: 100% !important; height: 100% !important; max-height: none !important; object-fit: contain !important; }
#postSheet .post-v113-media-column .multi-preview { flex: 0 0 auto !important; margin-top: 9px !important; }
#postSheet .post-v113-editor-column .compact-post {
  display: grid !important;
  grid-template-columns: minmax(0, 1.2fr) minmax(150px, .8fr) !important;
  gap: 8px !important;
}
#postSheet .post-v113-editor-column input,
#postSheet .post-v113-editor-column textarea { min-width: 0 !important; margin: 0 !important; }
#postSheet .post-v113-editor-column .extra-notes { min-height: 82px !important; resize: vertical !important; }
#postSheet .post-v113-draft {
  margin: 0 !important;
  padding: 12px !important;
  border-radius: 20px !important;
  background: linear-gradient(145deg, rgba(24,243,238,.075), rgba(255,47,126,.035)) !important;
}
#postSheet .post-v113-draft #aiTitle { font-size: 16px !important; line-height: 1.2 !important; overflow-wrap: anywhere !important; }
#postSheet .post-v113-draft #aiDescription { min-height: 46px !important; max-height: 130px !important; overflow-y: auto !important; }
#postSheet .post-v113-draft.thinking { box-shadow: inset 0 0 0 1px rgba(24,243,238,.12) !important; }
#postSheet .post-v113-actions {
  position: sticky !important;
  bottom: -1px !important;
  z-index: 8 !important;
  display: grid !important;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr) !important;
  gap: 8px !important;
  margin-top: auto !important;
  padding-top: 8px !important;
  background: linear-gradient(180deg, transparent, rgba(4,8,11,.98) 28%) !important;
}
#postSheet .post-v113-actions > button { min-height: 46px !important; margin: 0 !important; border-radius: 16px !important; }
#postSheet .post-fields { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; margin: 0 !important; }
#postSheet #publishStatus { margin: 0 !important; border-radius: 18px !important; }
#postSheet #aiFillBtn[aria-busy="true"]::before,
#postSheet #aiFillBtn[aria-busy="true"]::after,
#postSheet #publishBtn[aria-busy="true"]::before,
#postSheet #publishBtn[aria-busy="true"]::after,
#postSheet .post-v113-upload.processing::after { content: none !important; display: none !important; animation: none !important; }
#postSheet #aiFillBtn[aria-busy="true"],
#postSheet #publishBtn[aria-busy="true"] { opacity: .66 !important; }

/* Account privacy and a visible, dependable sign-out action. */
#meSheet #signinPin,
#meSheet #profilePin {
  -webkit-text-security: disc !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: .14em !important;
}
#meSheet .me-v113-logout {
  width: 100% !important;
  margin: 9px 0 0 !important;
  min-height: 55px !important;
  display: grid !important;
  align-content: center !important;
  justify-items: start !important;
  padding: 10px 13px !important;
  border-color: rgba(255,91,132,.25) !important;
  border-radius: 17px !important;
  background: rgba(255,47,126,.06) !important;
  color: #fff !important;
  text-align: left !important;
}
#meSheet .me-v113-logout b,
#meSheet .me-v113-logout small { display: block !important; }
#meSheet .me-v113-logout small { margin-top: 3px !important; color: rgba(255,255,255,.52) !important; font-size: 9px !important; }

/* Market-area summary must never turn one label into a billboard. */
#locationSheet .location-context-summary {
  width: 100% !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(72px, 108px) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 9px 12px !important;
  padding: 11px 13px !important;
  overflow: hidden !important;
}
#locationSheet .location-context-summary > span {
  grid-row: auto !important;
  max-width: 108px !important;
  min-width: 0 !important;
  font-size: clamp(7px, .72vw, 9px) !important;
  line-height: 1.18 !important;
  letter-spacing: .055em !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
#locationSheet .location-context-result,
#locationSheet .location-context-loading {
  min-width: 0 !important;
  max-width: 100% !important;
}
#locationSheet .location-context-result strong,
#locationSheet .location-context-result small,
#locationSheet .location-context-result mark,
#locationSheet .location-context-loading strong,
#locationSheet .location-context-loading small {
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
#locationSheet .location-context-result strong { font-size: clamp(13px, 1.25vw, 16px) !important; line-height: 1.15 !important; }
#locationSheet .location-context-result small { font-size: 10px !important; line-height: 1.35 !important; }
#locationSheet .location-source-badge { width: fit-content !important; max-width: 100% !important; font-size: 7.5px !important; line-height: 1.28 !important; }

@media (max-width: 1099px) {
  #detailSheet.sheet[open] { align-items: end !important; padding: 0 !important; }
  #detailSheet .detail-card {
    width: 100% !important;
    max-width: none !important;
    height: min(96dvh, 920px) !important;
    max-height: 96dvh !important;
    border-radius: 28px 28px 0 0 !important;
  }
  #detailSheet #detailBody { overflow-x: hidden !important; overflow-y: auto !important; }
  #detailSheet #detailBody > .detail-v113-layout {
    height: auto !important;
    min-height: 100% !important;
    display: block !important;
    padding: 10px 12px 18px !important;
    overflow: visible !important;
  }
  #detailSheet .detail-v113-media {
    height: auto !important;
    display: block !important;
    overflow: visible !important;
    margin-bottom: 9px !important;
  }
  #detailSheet .detail-v113-media .detail-media {
    height: clamp(330px, 49dvh, 590px) !important;
    min-height: 330px !important;
  }
  #detailSheet .detail-v113-media .detail-thumbs { margin-top: 7px !important; }
  #detailSheet .detail-v113-content {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 !important;
  }
  #detailSheet .detail-v113-actions { position: static !important; }

  #postSheet.sheet[open] { align-items: end !important; padding: 0 !important; }
  #postSheet .post-v113-card {
    width: 100% !important;
    max-width: none !important;
    height: min(96dvh, 900px) !important;
    max-height: 96dvh !important;
    border-radius: 28px 28px 0 0 !important;
  }
  #postSheet .post-v113-layout {
    display: block !important;
    padding: 10px 12px 18px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  #postSheet .post-v113-media-column,
  #postSheet .post-v113-editor-column { overflow: visible !important; }
  #postSheet .post-v113-media-column { margin-bottom: 10px !important; }
  #postSheet .post-v113-upload { height: clamp(270px, 42dvh, 480px) !important; min-height: 270px !important; }
  #postSheet .post-v113-editor-column { display: grid !important; }
  #postSheet .post-v113-actions { position: sticky !important; bottom: -18px !important; padding: 12px 0 18px !important; }
}

@media (max-width: 719px) {
  #detailSheet .detail-card > .sheet-title { min-height: 61px !important; padding: 8px 12px 10px !important; }
  #detailSheet .detail-card > .sheet-title h3 { max-width: 72vw !important; font-size: 17px !important; }
  #detailSheet #detailBody > .detail-v113-layout { padding: 8px 9px 15px !important; }
  #detailSheet .detail-v113-media .detail-media { height: clamp(290px, 45dvh, 500px) !important; min-height: 290px !important; border-radius: 20px !important; }
  #detailSheet .detail-v113-summary { padding: 11px !important; border-radius: 19px !important; }
  #detailSheet .detail-v113-summary .detail-title-main { font-size: clamp(23px, 7.2vw, 32px) !important; }
  #detailSheet .detail-v113-insights { grid-template-columns: 1fr !important; border-radius: 19px !important; }
  #detailSheet .detail-v113-ai { grid-column: auto !important; }
  #detailSheet .detail-v113-actions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; border-radius: 19px !important; }

  #aiHelpSheet.sheet[open] { align-items: end !important; padding: 0 !important; }
  #aiHelpSheet .ai-room-card {
    width: 100% !important;
    max-width: none !important;
    height: 95dvh !important;
    max-height: 95dvh !important;
    min-height: 0 !important;
    border-radius: 28px 28px 0 0 !important;
  }
  #aiHelpSheet .ai-room-title { padding: 8px 11px 10px !important; }
  #aiHelpSheet .ai-room-context { max-width: calc(100% - 22px) !important; margin: 8px 11px 0 !important; }
  #aiHelpSheet .ai-room-messages,
  #aiHelpSheet .ai-help-results.ai-room-messages { padding: 13px 11px !important; gap: 9px !important; }
  #aiHelpSheet .ai-room-bubble-v113 { max-width: 88% !important; padding: 10px 11px !important; }
  #aiHelpSheet .ai-room-bubble-v113 > p { font-size: 12.5px !important; }
  #aiHelpSheet .ai-room-composer { grid-template-columns: minmax(0, 1fr) 46px !important; padding: 9px 9px 7px !important; }
  #aiHelpSheet .ai-room-send { width: 46px !important; height: 46px !important; min-width: 46px !important; min-height: 46px !important; }
  #aiHelpSheet .ai-room-note { padding: 0 12px 9px !important; font-size: 7.8px !important; }

  #postSheet .post-v113-card > .sheet-title { padding: 8px 11px 10px !important; }
  #postSheet .post-v113-layout { padding: 8px 9px 16px !important; }
  #postSheet .post-v113-media-column,
  #postSheet .post-v113-editor-column { padding: 9px !important; border-radius: 20px !important; }
  #postSheet .post-v113-upload { height: clamp(245px, 37dvh, 410px) !important; min-height: 245px !important; border-radius: 17px !important; }
  #postSheet .post-v113-editor-column .compact-post,
  #postSheet .post-fields { grid-template-columns: 1fr !important; }
  #postSheet .post-v113-actions { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr) !important; }

  #locationSheet .location-context-summary {
    grid-template-columns: minmax(60px, 84px) minmax(0, 1fr) !important;
    gap: 7px 9px !important;
    padding: 10px !important;
  }
  #locationSheet .location-context-summary > span { max-width: 84px !important; font-size: 7px !important; }
}

@media (max-width: 390px) {
  #detailSheet .detail-v113-media .detail-media { height: clamp(270px, 42dvh, 390px) !important; min-height: 270px !important; }
  #detailSheet .detail-v113-actions { grid-template-columns: 1fr 1fr !important; gap: 6px !important; padding: 8px !important; }
  #detailSheet .detail-v113-actions > button,
  #detailSheet .detail-v113-actions > a { min-height: 40px !important; font-size: 10px !important; }
  #aiHelpSheet .ai-room-bubble-avatar-v113 { flex-basis: 28px !important; width: 28px !important; height: 28px !important; }
  #aiHelpSheet .ai-room-bubble-v113 { max-width: 90% !important; }
  #locationSheet .location-context-summary { grid-template-columns: 1fr !important; }
  #locationSheet .location-context-summary > span { max-width: 100% !important; }
}

@media (prefers-reduced-motion: reduce) {
  #aiHelpSheet .ai-room-messages { scroll-behavior: auto !important; }
  #detailSheet *, #aiHelpSheet *, #postSheet * { transition-duration: .01ms !important; }
}

/* ============================================================================
   v113.0.0 · Responsive Details, secure account, Vi AI chat room, Quick Post
   ========================================================================== */

/* Account PIN stays visually masked even in WebViews with aggressive form CSS. */
#signinPin,
#profilePin {
  -webkit-text-security: disc !important;
  text-security: disc !important;
  font-variant-numeric: tabular-nums;
  letter-spacing: .16em;
}
#signinPin::placeholder,
#profilePin::placeholder { letter-spacing: normal; }
#meSheet .me-v113-logout {
  margin-top: 10px !important;
  min-height: 58px !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) !important;
  justify-items: start !important;
  align-content: center !important;
  gap: 3px !important;
  padding: 11px 13px !important;
  border-color: rgba(255,77,128,.26) !important;
  background: linear-gradient(145deg, rgba(255,55,126,.11), rgba(255,255,255,.035)) !important;
  color: #fff !important;
  text-align: left !important;
}
#meSheet .me-v113-logout b,
#meSheet .me-v113-logout small { display: block; min-width: 0; }
#meSheet .me-v113-logout small { color: rgba(255,255,255,.55); font-size: 9px; line-height: 1.35; }
#meSheet .me-v113-logout[aria-busy="true"] { opacity: .72; pointer-events: none; }

/* Compact area inventory label. Long translations can never push outside the sheet. */
#locationSheet .location-context-summary {
  min-width: 0 !important;
  grid-template-columns: minmax(82px, auto) minmax(0,1fr) !important;
  align-items: center !important;
  gap: 5px 12px !important;
  overflow: hidden !important;
}
#locationSheet .location-context-summary > span {
  grid-row: auto !important;
  min-width: 0 !important;
  max-width: 128px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: clamp(7px, .66vw, 9px) !important;
  line-height: 1.1 !important;
  letter-spacing: .065em !important;
}
#locationSheet .location-context-result,
#locationSheet .location-context-loading { min-width: 0 !important; max-width: 100% !important; }
#locationSheet .location-context-result > strong,
#locationSheet .location-context-loading strong { min-width: 0 !important; max-width: 100% !important; }

/* Details dialog: reset legacy direct-child grids and use the v113 wrapper only. */
#detailSheet.sheet[open] {
  inset: 0 !important;
  width: 100vw !important;
  max-width: none !important;
  height: 100dvh !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 16px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  background: rgba(0,3,5,.82) !important;
  backdrop-filter: blur(20px) saturate(1.08) !important;
}
#detailSheet .detail-card {
  width: min(1320px, calc(100vw - 32px)) !important;
  max-width: 1320px !important;
  height: min(920px, calc(100dvh - 32px)) !important;
  max-height: calc(100dvh - 32px) !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 18px 16px !important;
  display: grid !important;
  grid-template-rows: auto minmax(0,1fr) !important;
  overflow: hidden !important;
  border-radius: 30px !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(42,238,202,.075), transparent 30%),
    radial-gradient(circle at 100% 20%, rgba(255,55,126,.055), transparent 28%),
    #05090c !important;
  box-shadow: 0 28px 90px rgba(0,0,0,.62), inset 0 1px rgba(255,255,255,.035) !important;
}
#detailSheet .detail-card > .sheet-bar {
  position: absolute !important;
  top: 9px !important;
  left: 50% !important;
  width: 56px !important;
  height: 5px !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
  z-index: 4 !important;
}
#detailSheet .detail-card > .sheet-title {
  min-width: 0 !important;
  min-height: 80px !important;
  margin: 0 -18px !important;
  padding: 24px 26px 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
  background: linear-gradient(180deg, rgba(4,8,11,.98), rgba(4,8,11,.88)) !important;
}
#detailSheet .detail-card > .sheet-title > div { min-width: 0 !important; }
#detailSheet .detail-card > .sheet-title small {
  display: block !important;
  margin: 0 0 5px !important;
  color: var(--cyan) !important;
  font-size: 9px !important;
  line-height: 1 !important;
  font-weight: 1000 !important;
  letter-spacing: .15em !important;
}
#detailSheet .detail-card > .sheet-title h3 {
  display: block !important;
  max-width: min(820px, calc(100vw - 150px)) !important;
  margin: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #fff !important;
  font-size: clamp(22px, 2vw, 32px) !important;
  line-height: 1.05 !important;
  letter-spacing: -.045em !important;
}
#detailSheet .detail-card > .sheet-title .xbtn {
  position: static !important;
  flex: 0 0 44px !important;
  width: 44px !important;
  height: 44px !important;
  margin: 0 !important;
  border-radius: 50% !important;
}
#detailSheet #detailBody {
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  display: block !important;
  overflow: hidden !important;
  padding: 16px 0 0 !important;
  margin: 0 !important;
}
#detailSheet #detailBody > .detail-v113-layout {
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.28fr) minmax(390px, .72fr) !important;
  grid-template-rows: minmax(0,1fr) !important;
  align-items: stretch !important;
  gap: 18px !important;
  overflow: hidden !important;
}
#detailSheet .detail-v113-media {
  position: relative !important;
  top: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-height: none !important;
  display: grid !important;
  grid-template-rows: minmax(0,1fr) auto !important;
  align-content: stretch !important;
  gap: 10px !important;
  overflow: hidden !important;
}
#detailSheet .detail-v113-media > .detail-media {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 24px !important;
  background: #070b0e !important;
  box-shadow: inset 0 1px rgba(255,255,255,.035), 0 18px 46px rgba(0,0,0,.28) !important;
}
#detailSheet .detail-v113-media .detail-bg {
  position: absolute !important;
  inset: -5% !important;
  width: 110% !important;
  height: 110% !important;
  object-fit: cover !important;
  filter: blur(28px) brightness(.36) saturate(.86) !important;
  opacity: .66 !important;
  transform: scale(1.04) !important;
}
#detailSheet .detail-v113-media .detail-main {
  position: absolute !important;
  z-index: 2 !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
}
#detailSheet .detail-v113-media .detail-thumbs {
  position: static !important;
  width: 100% !important;
  min-height: 70px !important;
  max-height: 78px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 2px 2px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}
#detailSheet .detail-v113-media .detail-thumbs::-webkit-scrollbar { display: none !important; }
#detailSheet .detail-v113-media .detail-thumbs button {
  flex: 0 0 68px !important;
  width: 68px !important;
  height: 68px !important;
  min-width: 68px !important;
  min-height: 68px !important;
  margin: 0 !important;
  padding: 2px !important;
  overflow: hidden !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.055) !important;
}
#detailSheet .detail-v113-media .detail-thumbs img { width: 100% !important; height: 100% !important; object-fit: cover !important; border-radius: 15px !important; }
#detailSheet .detail-v113-content {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) !important;
  align-content: start !important;
  gap: 11px !important;
  padding: 0 4px 14px 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(42,238,202,.32) transparent !important;
}
#detailSheet .detail-v113-content::-webkit-scrollbar { width: 7px !important; }
#detailSheet .detail-v113-content::-webkit-scrollbar-thumb { border-radius: 999px !important; background: rgba(42,238,202,.28) !important; }
#detailSheet .detail-v113-summary,
#detailSheet .detail-v113-insights,
#detailSheet .detail-v113-actions,
#detailSheet .detail-v113-content > .owner-tools,
#detailSheet .detail-v113-content > .detail-service-note {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.052), rgba(255,255,255,.024)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.03) !important;
}
#detailSheet .detail-v113-summary {
  display: grid !important;
  gap: 10px !important;
  padding: 15px !important;
  border-radius: 22px !important;
}
#detailSheet .detail-v113-summary .seller-line {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 0 11px !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
}
#detailSheet .detail-v113-summary .seller-text { min-width: 0 !important; }
#detailSheet .detail-v113-summary .seller-name,
#detailSheet .detail-v113-summary .seller-area { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
#detailSheet .detail-v113-summary .badge-line,
#detailSheet .detail-v113-summary .tag-line { width: 100% !important; min-width: 0 !important; margin: 0 !important; display: flex !important; flex-wrap: wrap !important; gap: 6px !important; }
#detailSheet .detail-v113-summary .detail-title-main {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(27px, 2.45vw, 43px) !important;
  line-height: 1.02 !important;
  letter-spacing: -.05em !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}
#detailSheet .detail-v113-summary .detail-description {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 68ch !important;
  margin: 0 !important;
  color: rgba(238,255,252,.68) !important;
  font-size: 12.5px !important;
  line-height: 1.52 !important;
  overflow-wrap: anywhere !important;
}
#detailSheet .detail-v113-insights {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 8px !important;
  padding: 9px !important;
  border-radius: 22px !important;
}
#detailSheet .detail-v113-insights > * {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 64px !important;
  margin: 0 !important;
  padding: 11px !important;
  border-radius: 17px !important;
  overflow: hidden !important;
}
#detailSheet .detail-v113-ai {
  grid-column: 1 / -1 !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0,1fr) 22px !important;
  align-items: center !important;
  gap: 10px !important;
  text-align: left !important;
  cursor: pointer !important;
}
#detailSheet .detail-v113-ai > div,
#detailSheet .detail-v113-ai b,
#detailSheet .detail-v113-ai small { min-width: 0 !important; max-width: 100% !important; }
#detailSheet .detail-v113-ai b,
#detailSheet .detail-v113-ai small { display: block !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
#detailSheet .detail-v113-ai small { margin-top: 3px !important; color: rgba(255,255,255,.62) !important; font-size: 10px !important; }
#detailSheet .detail-v113-ai > i { display: grid !important; place-items: center !important; color: var(--cyan) !important; font-style: normal !important; }
#detailSheet .detail-v113-ai > i svg { width: 18px !important; height: 18px !important; fill: none !important; stroke: currentColor !important; }
#detailSheet .detail-v113-actions {
  position: static !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 8px !important;
  padding: 9px !important;
  border-radius: 22px !important;
  overflow: visible !important;
}
#detailSheet .detail-v113-actions > button,
#detailSheet .detail-v113-actions > a {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 9px 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  border-radius: 15px !important;
  font-size: 10px !important;
}
#detailSheet .detail-nav-btn,
#detailSheet .detail-zoom-btn {
  z-index: 8 !important;
  background: rgba(3,8,10,.58) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  backdrop-filter: blur(10px) !important;
}

/* Vi AI is a focused chat room, not an information dashboard. */
#aiHelpSheet.sheet[open] {
  inset: 0 !important;
  width: 100vw !important;
  max-width: none !important;
  height: 100dvh !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 18px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  background: rgba(0,3,5,.80) !important;
  backdrop-filter: blur(20px) !important;
}
#aiHelpSheet .ai-room-card {
  width: min(760px, calc(100vw - 36px)) !important;
  max-width: 760px !important;
  height: min(820px, calc(100dvh - 36px)) !important;
  max-height: calc(100dvh - 36px) !important;
  min-height: 520px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0,1fr) auto !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(42,238,202,.10), transparent 30%),
    radial-gradient(circle at 100% 15%, rgba(255,55,126,.075), transparent 28%),
    #05090c !important;
  box-shadow: 0 28px 90px rgba(0,0,0,.62), inset 0 1px rgba(255,255,255,.035) !important;
}
#aiHelpSheet .ai-room-card > .sheet-bar {
  position: absolute !important;
  top: 9px !important;
  left: 50% !important;
  width: 50px !important;
  transform: translateX(-50%) !important;
  z-index: 4 !important;
}
#aiHelpSheet .ai-room-title {
  min-width: 0 !important;
  min-height: 74px !important;
  margin: 0 !important;
  padding: 22px 18px 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
  background: rgba(4,8,11,.90) !important;
}
#aiHelpSheet .ai-room-title > div:first-child { min-width: 0 !important; }
#aiHelpSheet .ai-room-title small { color: var(--cyan) !important; font-size: 8px !important; font-weight: 1000 !important; letter-spacing: .15em !important; }
#aiHelpSheet .ai-room-title h3 { margin: 4px 0 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; font-size: 21px !important; letter-spacing: -.035em !important; }
#aiHelpSheet .ai-room-head-actions { flex: 0 0 auto !important; display: flex !important; align-items: center !important; gap: 8px !important; }
#aiHelpSheet .ai-room-new,
#aiHelpSheet .ai-room-title .xbtn { width: 40px !important; height: 40px !important; min-width: 40px !important; display: grid !important; place-items: center !important; margin: 0 !important; padding: 0 !important; border: 1px solid rgba(255,255,255,.10) !important; border-radius: 50% !important; background: rgba(255,255,255,.065) !important; color: #fff !important; font-size: 22px !important; }
#aiHelpSheet .ai-room-context {
  min-width: 0 !important;
  margin: 10px 14px 0 !important;
  padding: 8px 11px !important;
  overflow: hidden !important;
  border: 1px solid rgba(42,238,202,.17) !important;
  border-radius: 14px !important;
  background: rgba(42,238,202,.065) !important;
  color: rgba(236,255,251,.72) !important;
  font-size: 10px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#aiHelpSheet .ai-room-context.hidden { display: none !important; }
#aiHelpSheet .ai-room-messages {
  min-width: 0 !important;
  min-height: 0 !important;
  max-height: none !important;
  display: block !important;
  margin: 0 !important;
  padding: 18px 16px 24px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scroll-behavior: smooth !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(42,238,202,.28) transparent !important;
  background: linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.22)) !important;
}
#aiHelpSheet .ai-room-messages::-webkit-scrollbar { width: 6px !important; }
#aiHelpSheet .ai-room-messages::-webkit-scrollbar-thumb { border-radius: 999px !important; background: rgba(42,238,202,.26) !important; }
.ai-room-message-v113 {
  width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: flex-end !important;
  gap: 8px !important;
  margin: 0 0 12px !important;
}
.ai-room-message-v113.user { justify-content: flex-end !important; }
.ai-room-bubble-avatar-v113 {
  flex: 0 0 32px !important;
  width: 32px !important;
  height: 32px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, #25ead1, #ff3b82) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.26) !important;
}
.ai-room-bubble-avatar-v113 > i { width: 8px !important; height: 8px !important; border-radius: 50% !important; background: #071012 !important; box-shadow: 0 0 0 4px rgba(255,255,255,.25) !important; }
.ai-room-bubble-v113 {
  max-width: min(82%, 610px) !important;
  min-width: 0 !important;
  padding: 11px 13px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 19px 19px 19px 6px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.072), rgba(255,255,255,.035)) !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.16) !important;
}
.ai-room-message-v113.user .ai-room-bubble-v113 {
  border-color: rgba(42,238,202,.20) !important;
  border-radius: 19px 19px 6px 19px !important;
  background: linear-gradient(145deg, rgba(42,238,202,.20), rgba(23,104,109,.20)) !important;
}
.ai-room-bubble-v113 p { margin: 0 !important; color: rgba(247,255,253,.92) !important; font-size: 13px !important; line-height: 1.52 !important; white-space: pre-wrap !important; overflow-wrap: anywhere !important; }
.ai-room-followups-v113 { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin-top: 10px !important; }
.ai-room-followups-v113 button { min-height: 31px !important; max-width: 100% !important; padding: 6px 9px !important; overflow: hidden !important; border: 1px solid rgba(42,238,202,.18) !important; border-radius: 999px !important; background: rgba(42,238,202,.07) !important; color: #dffff8 !important; font-size: 9px !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.ai-room-items-v113 { display: grid !important; gap: 6px !important; margin-top: 10px !important; }
.ai-room-items-v113 button { min-width: 0 !important; display: grid !important; grid-template-columns: 45px minmax(0,1fr) 17px !important; align-items: center !important; gap: 8px !important; padding: 6px !important; border: 1px solid rgba(255,255,255,.085) !important; border-radius: 14px !important; background: rgba(0,0,0,.20) !important; color: #fff !important; text-align: left !important; }
.ai-room-items-v113 img { width: 45px !important; height: 45px !important; object-fit: contain !important; border-radius: 10px !important; background: #080d10 !important; }
.ai-room-items-v113 span,
.ai-room-items-v113 b,
.ai-room-items-v113 small { min-width: 0 !important; display: block !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.ai-room-items-v113 b { font-size: 10px !important; }
.ai-room-items-v113 small { margin-top: 2px !important; color: rgba(255,255,255,.56) !important; font-size: 8px !important; }
.ai-room-items-v113 svg { width: 15px !important; height: 15px !important; fill: none !important; stroke: currentColor !important; }
.ai-room-typing-v113 { display: flex !important; align-items: center !important; gap: 8px !important; min-height: 44px !important; }
.ai-room-typing-v113 small { color: rgba(255,255,255,.55) !important; font-size: 9px !important; }
#aiHelpSheet .ai-room-composer {
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 48px !important;
  align-items: end !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
  border-top: 1px solid rgba(255,255,255,.075) !important;
  background: rgba(4,8,11,.96) !important;
  box-shadow: 0 -18px 42px rgba(0,0,0,.25) !important;
}
#aiHelpSheet #aiHelpText {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  max-height: 132px !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  resize: none !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.055) !important;
  color: #fff !important;
  font-size: 13px !important;
  line-height: 1.38 !important;
}
#aiHelpSheet .ai-room-send {
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 17px !important;
  font-size: 23px !important;
}
#aiHelpSheet .ai-room-send.is-busy { opacity: .64 !important; }

/* Quick Post: one calm workspace and one visible loader per operation. */
#postSheet.sheet[open] {
  inset: 0 !important;
  width: 100vw !important;
  max-width: none !important;
  height: 100dvh !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 18px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  background: rgba(0,3,5,.80) !important;
  backdrop-filter: blur(20px) !important;
}
#postSheet .post-v113-card {
  width: min(1120px, calc(100vw - 36px)) !important;
  max-width: 1120px !important;
  height: min(850px, calc(100dvh - 36px)) !important;
  max-height: calc(100dvh - 36px) !important;
  min-height: 560px !important;
  margin: 0 !important;
  padding: 0 17px 17px !important;
  display: grid !important;
  grid-template-rows: auto minmax(0,1fr) !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(42,238,202,.085), transparent 31%),
    radial-gradient(circle at 100% 15%, rgba(255,55,126,.065), transparent 27%),
    #05090c !important;
  box-shadow: 0 28px 90px rgba(0,0,0,.62), inset 0 1px rgba(255,255,255,.035) !important;
}
#postSheet .post-v113-card > .sheet-title {
  min-width: 0 !important;
  min-height: 78px !important;
  margin: 0 -17px !important;
  padding: 23px 22px 13px !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
  background: rgba(4,8,11,.91) !important;
}
#postSheet .post-v113-layout {
  min-width: 0 !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0,.88fr) minmax(410px,1.12fr) !important;
  gap: 16px !important;
  padding-top: 15px !important;
  overflow: hidden !important;
}
#postSheet .post-v113-media-column,
#postSheet .post-v113-editor-column {
  min-width: 0 !important;
  min-height: 0 !important;
  display: grid !important;
  align-content: start !important;
  gap: 10px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 2px 3px 14px !important;
  scrollbar-width: thin !important;
}
#postSheet .post-v113-section-head { min-width: 0 !important; display: grid !important; gap: 3px !important; padding: 0 2px !important; }
#postSheet .post-v113-section-head b { font-size: 14px !important; }
#postSheet .post-v113-section-head small { color: rgba(255,255,255,.55) !important; font-size: 9px !important; line-height: 1.4 !important; }
#postSheet .post-v113-upload {
  width: 100% !important;
  min-width: 0 !important;
  height: clamp(310px, 53dvh, 560px) !important;
  min-height: 310px !important;
  max-height: 560px !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: 1px dashed rgba(42,238,202,.30) !important;
  border-radius: 24px !important;
  background: radial-gradient(circle at 50% 35%, rgba(42,238,202,.09), rgba(5,9,12,.96) 68%) !important;
}
#postSheet .post-v113-upload img { width: 100% !important; height: 100% !important; object-fit: contain !important; background: transparent !important; }
#postSheet .post-v113-editor-column > input,
#postSheet .post-v113-editor-column > textarea,
#postSheet .post-v113-editor-column .smart-edit-grid input,
#postSheet .post-fields input { min-width: 0 !important; margin: 0 !important; }
#postSheet .post-v113-draft {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 13px !important;
  overflow: hidden !important;
  border-radius: 22px !important;
  background: linear-gradient(145deg, rgba(42,238,202,.08), rgba(255,55,126,.055), rgba(255,255,255,.025)) !important;
}
#postSheet .post-v113-draft.thinking {
  animation: none !important;
  border-color: rgba(42,238,202,.30) !important;
}
#postSheet .post-v113-draft .ai-extra-notes { min-width: 0 !important; }
#postSheet .post-v113-draft .ai-waiting { min-height: 74px !important; padding: 11px !important; border-radius: 17px !important; }
#postSheet .post-v113-actions { display: grid !important; grid-template-columns: minmax(0,.78fr) minmax(0,1.22fr) !important; gap: 8px !important; }
#postSheet .post-v113-actions button { min-width: 0 !important; min-height: 48px !important; margin: 0 !important; border-radius: 17px !important; }
#postSheet #aiFillBtn[aria-busy="true"]::before,
#postSheet #aiFillBtn[aria-busy="true"]::after,
#postSheet #publishBtn[aria-busy="true"]::before,
#postSheet #publishBtn[aria-busy="true"]::after { content: none !important; display: none !important; animation: none !important; }
#postSheet #publishBtn[aria-busy="true"],
#postSheet #aiFillBtn[aria-busy="true"] { opacity: .68 !important; }
#postSheet .publish-status {
  min-width: 0 !important;
  margin: 0 !important;
  grid-template-columns: 34px minmax(0,1fr) !important;
  border-radius: 18px !important;
}
#postSheet .publish-status .spinner { display: block !important; }
#postSheet .publish-status.hidden { display: none !important; }
#postSheet .publish-status .twin-dots,
#postSheet .publish-status ~ .twin-dots { display: none !important; }

@media (max-width: 1099px) {
  #detailSheet.sheet[open] { padding: 10px !important; }
  #detailSheet .detail-card {
    width: min(920px, calc(100vw - 20px)) !important;
    height: calc(100dvh - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
    padding: 0 12px 12px !important;
    border-radius: 26px !important;
  }
  #detailSheet .detail-card > .sheet-title { margin-inline: -12px !important; padding-inline: 18px !important; }
  #detailSheet #detailBody > .detail-v113-layout {
    grid-template-columns: minmax(0,1.12fr) minmax(330px,.88fr) !important;
    gap: 12px !important;
  }
  #detailSheet .detail-v113-summary .detail-title-main { font-size: clamp(25px, 3vw, 36px) !important; }
  #detailSheet .detail-v113-actions { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  #postSheet .post-v113-layout { grid-template-columns: minmax(0,.82fr) minmax(370px,1.18fr) !important; gap: 12px !important; }
}

@media (max-width: 899px) {
  #detailSheet.sheet[open] {
    padding: 0 !important;
    place-items: stretch !important;
    background: #020608 !important;
  }
  #detailSheet .detail-card {
    width: 100% !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    padding: 0 10px 12px !important;
    border-radius: 0 !important;
    border: 0 !important;
  }
  #detailSheet .detail-card > .sheet-title {
    min-height: 68px !important;
    margin-inline: -10px !important;
    padding: 20px 13px 10px !important;
  }
  #detailSheet .detail-card > .sheet-title h3 { font-size: 20px !important; max-width: calc(100vw - 88px) !important; }
  #detailSheet .detail-card > .sheet-title .xbtn { width: 40px !important; height: 40px !important; flex-basis: 40px !important; }
  #detailSheet #detailBody {
    height: 100% !important;
    padding-top: 10px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  #detailSheet #detailBody > .detail-v113-layout {
    height: auto !important;
    min-height: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    grid-template-rows: auto auto !important;
    gap: 10px !important;
    overflow: visible !important;
    padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
  }
  #detailSheet .detail-v113-media {
    min-height: 0 !important;
    height: auto !important;
    grid-template-rows: minmax(300px, 47dvh) auto !important;
    overflow: visible !important;
  }
  #detailSheet .detail-v113-media > .detail-media { height: auto !important; min-height: 300px !important; }
  #detailSheet .detail-v113-content {
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 0 8px !important;
  }
  #detailSheet .detail-v113-summary .detail-title-main { font-size: clamp(24px, 7.5vw, 34px) !important; }
  #detailSheet .detail-v113-insights { grid-template-columns: 1fr !important; }
  #detailSheet .detail-v113-ai { grid-column: auto !important; }

  #postSheet.sheet[open] { padding: 0 !important; place-items: stretch !important; background: #020608 !important; }
  #postSheet .post-v113-card {
    width: 100% !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
    padding: 0 10px 14px !important;
    border: 0 !important;
    border-radius: 0 !important;
  }
  #postSheet .post-v113-card > .sheet-title { min-height: 68px !important; margin-inline: -10px !important; padding: 20px 13px 10px !important; }
  #postSheet .post-v113-layout {
    display: block !important;
    padding-top: 10px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  #postSheet .post-v113-media-column,
  #postSheet .post-v113-editor-column { display: grid !important; overflow: visible !important; padding: 2px 1px 12px !important; }
  #postSheet .post-v113-upload { height: clamp(250px, 42dvh, 430px) !important; min-height: 250px !important; }

  #aiHelpSheet.sheet[open] { padding: 0 !important; place-items: stretch !important; background: #020608 !important; }
  #aiHelpSheet .ai-room-card {
    width: 100% !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
  }
}

@media (max-width: 560px) {
  #locationSheet .location-context-summary {
    grid-template-columns: minmax(0,1fr) !important;
    gap: 6px !important;
    padding: 10px !important;
  }
  #locationSheet .location-context-summary > span {
    max-width: 100% !important;
    white-space: normal !important;
    font-size: 7.5px !important;
  }
  #locationSheet .location-context-loading { align-items: flex-start !important; }

  #detailSheet .detail-v113-media { grid-template-rows: minmax(270px, 43dvh) auto !important; }
  #detailSheet .detail-v113-media > .detail-media { min-height: 270px !important; border-radius: 20px !important; }
  #detailSheet .detail-v113-media .detail-thumbs { min-height: 60px !important; max-height: 64px !important; }
  #detailSheet .detail-v113-media .detail-thumbs button { flex-basis: 58px !important; width: 58px !important; height: 58px !important; min-width: 58px !important; min-height: 58px !important; border-radius: 15px !important; }
  #detailSheet .detail-v113-summary { padding: 12px !important; border-radius: 19px !important; }
  #detailSheet .detail-v113-insights,
  #detailSheet .detail-v113-actions { border-radius: 19px !important; }
  #detailSheet .detail-v113-actions { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 7px !important; }
  #detailSheet .detail-v113-actions > button,
  #detailSheet .detail-v113-actions > a { min-height: 42px !important; font-size: 9.5px !important; }

  #aiHelpSheet .ai-room-title { min-height: 66px !important; padding: 20px 12px 9px !important; }
  #aiHelpSheet .ai-room-title h3 { font-size: 18px !important; }
  #aiHelpSheet .ai-room-new,
  #aiHelpSheet .ai-room-title .xbtn { width: 37px !important; height: 37px !important; min-width: 37px !important; }
  #aiHelpSheet .ai-room-messages { padding: 14px 10px 20px !important; }
  .ai-room-bubble-v113 { max-width: 88% !important; padding: 10px 11px !important; }
  .ai-room-bubble-v113 p { font-size: 12.5px !important; }
  #aiHelpSheet .ai-room-composer { grid-template-columns: minmax(0,1fr) 46px !important; padding: 9px 9px calc(9px + env(safe-area-inset-bottom,0px)) !important; }
  #aiHelpSheet .ai-room-send { width: 46px !important; height: 46px !important; min-width: 46px !important; min-height: 46px !important; }

  #postSheet .post-v113-section-head small { font-size: 8.5px !important; }
  #postSheet .post-v113-upload { height: clamp(230px, 37dvh, 360px) !important; min-height: 230px !important; border-radius: 20px !important; }
  #postSheet .post-v113-actions { grid-template-columns: 1fr 1.2fr !important; }
}

@media (max-width: 370px) {
  #detailSheet .detail-v113-actions { grid-template-columns: 1fr !important; }
  #postSheet .post-v113-actions { grid-template-columns: 1fr !important; }
}

@media (prefers-reduced-motion: reduce) {
  #aiHelpSheet .ai-room-messages { scroll-behavior: auto !important; }
  #postSheet .post-v113-draft.thinking { animation: none !important; }
}

/* ============================================================================
   v113.0.0 · Responsive Details + private account + conversational Vi AI
   - desktop Details uses a real media/content split without narrow text columns
   - Vi AI is a focused chat room on every viewport
   - Quick Post uses one shared progress indicator
   - compact area inventory copy never escapes the screen
   ========================================================================== */

/* Account privacy and reliable sign-out surface */
#signinPin,
#profilePin {
  -webkit-text-security: disc;
  font-variant-numeric: tabular-nums;
  letter-spacing: .16em;
}
#meSheet .me-v113-logout {
  width: 100%;
  min-width: 0;
  min-height: 58px;
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 3px;
  margin: 9px 0 0;
  padding: 11px 13px;
  text-align: left;
  border-color: rgba(255,82,118,.28);
  background: linear-gradient(145deg, rgba(255,62,110,.105), rgba(255,255,255,.035));
}
#meSheet .me-v113-logout b,
#meSheet .me-v113-logout small { display: block; min-width: 0; }
#meSheet .me-v113-logout small { color: rgba(255,255,255,.56); font-size: 9px; line-height: 1.35; }
#meSheet .me-v113-logout.is-busy { opacity: .66; pointer-events: none; }

/* Compact market inventory summary */
.location-context-summary {
  min-width: 0 !important;
  grid-template-columns: minmax(0, 118px) minmax(0, 1fr) !important;
  gap: 4px 12px !important;
  overflow: hidden !important;
}
.location-context-summary > span {
  min-width: 0 !important;
  max-width: 118px !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  white-space: normal !important;
  font-size: 9px !important;
  line-height: 1.18 !important;
  letter-spacing: .08em !important;
}
.location-context-summary > strong,
.location-context-summary > small,
.location-context-summary > div,
.location-context-result,
.location-context-loading,
.location-context-loading > div { min-width: 0 !important; max-width: 100% !important; }
.location-context-summary strong,
.location-context-result > strong {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 13px !important;
}
.location-context-result > small,
.location-context-summary > small {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
  font-size: 10px !important;
  line-height: 1.32 !important;
}
.location-source-badge { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Details, neutralise legacy desktop offsets and direct-child layouts. */
#detailSheet.sheet[open] {
  box-sizing: border-box !important;
  width: 100vw !important;
  max-width: none !important;
  height: 100dvh !important;
  max-height: none !important;
  inset: 0 !important;
  margin: 0 !important;
  padding: clamp(10px, 1.8vw, 26px) !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  background: rgba(0,0,0,.72) !important;
  backdrop-filter: blur(15px) saturate(1.05) !important;
}
#detailSheet .detail-card {
  position: relative !important;
  inset: auto !important;
  box-sizing: border-box !important;
  width: min(1320px, calc(100vw - 36px)) !important;
  max-width: 1320px !important;
  height: min(92dvh, 900px) !important;
  max-height: min(92dvh, 900px) !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 7% 0%, rgba(42,238,202,.09), transparent 28%),
    radial-gradient(circle at 96% 0%, rgba(255,55,126,.065), transparent 25%),
    linear-gradient(155deg, #050a0e, #030609 64%, #06050a) !important;
  box-shadow: 0 32px 110px rgba(0,0,0,.62), inset 0 1px rgba(255,255,255,.045) !important;
}
#detailSheet .detail-card > .sheet-bar { flex: 0 0 auto; }
#detailSheet .detail-card > .sheet-title {
  position: relative !important;
  top: auto !important;
  flex: 0 0 auto !important;
  z-index: 8 !important;
  min-height: 78px !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
  margin: 0 !important;
  padding: 15px 20px 14px 24px !important;
  background: rgba(2,7,10,.84) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px) !important;
}
#detailSheet .detail-card > .sheet-title > div { min-width: 0; }
#detailSheet .detail-card > .sheet-title small { color: var(--cyan); font-size: 9px; font-weight: 950; letter-spacing: .13em; }
#detailSheet .detail-card > .sheet-title h3 {
  max-width: 100% !important;
  margin: 5px 0 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: clamp(21px, 2.1vw, 31px) !important;
  line-height: 1.05 !important;
  letter-spacing: -.045em !important;
}
#detailSheet .detail-card > .sheet-title .xbtn {
  position: static !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  border-radius: 50% !important;
}
#detailSheet #detailBody {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  display: block !important;
  padding: 0 !important;
  overflow: hidden !important;
}
#detailSheet .detail-v113-layout {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.36fr) minmax(390px, .78fr) !important;
  grid-template-rows: minmax(0,1fr) !important;
  align-items: stretch !important;
  gap: 16px !important;
  padding: 16px 18px 18px !important;
  overflow: hidden !important;
}
#detailSheet .detail-v113-media {
  position: relative !important;
  top: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
  display: grid !important;
  grid-template-rows: minmax(0,1fr) auto !important;
  align-content: stretch !important;
  gap: 9px !important;
  overflow: hidden !important;
}
#detailSheet .detail-v113-media > .detail-media,
#detailSheet .detail-v113-media > .detail-media.is-landscape,
#detailSheet .detail-v113-media > .detail-media.is-portrait,
#detailSheet .detail-v113-media > .detail-media.is-squareish {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  background: radial-gradient(circle at 50% 42%, rgba(42,238,202,.10), #05090d 68%) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055), 0 22px 54px rgba(0,0,0,.30) !important;
}
#detailSheet .detail-v113-media .detail-main {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  padding: 0 !important;
}
#detailSheet .detail-v113-media .detail-thumbs {
  min-width: 0 !important;
  max-width: 100% !important;
  display: flex !important;
  gap: 7px !important;
  margin: 0 !important;
  padding: 0 1px 1px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}
#detailSheet .detail-v113-media .detail-thumbs button {
  flex: 0 0 58px !important;
  width: 58px !important;
  height: 58px !important;
  border-radius: 17px !important;
}
#detailSheet .detail-v113-content {
  box-sizing: border-box !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  display: grid !important;
  grid-auto-rows: max-content !important;
  align-content: start !important;
  gap: 10px !important;
  padding: 0 3px 10px 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-width: thin !important;
}
#detailSheet .detail-v113-summary,
#detailSheet .detail-v113-insights,
#detailSheet .detail-v113-actions,
#detailSheet .owner-tools,
#detailSheet .detail-service-note {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
#detailSheet .detail-v113-summary {
  display: grid !important;
  gap: 8px !important;
  padding: 14px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 21px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.022)) !important;
}
#detailSheet .detail-v113-summary .seller-line { min-width: 0; width: 100%; }
#detailSheet .detail-v113-summary .seller-text { min-width: 0; }
#detailSheet .detail-title-main {
  max-width: 100% !important;
  margin: 1px 0 0 !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  font-size: clamp(25px, 2.35vw, 38px) !important;
  line-height: 1.02 !important;
  letter-spacing: -.05em !important;
}
#detailSheet .detail-description {
  max-width: 100% !important;
  margin: 0 !important;
  overflow-wrap: anywhere !important;
  font-size: 12.5px !important;
  line-height: 1.52 !important;
  color: rgba(244,255,252,.72) !important;
}
#detailSheet .detail-v113-badges,
#detailSheet .detail-v112-badges,
#detailSheet .detail-v112-tags { min-width: 0; max-width: 100%; flex-wrap: wrap !important; }
#detailSheet .detail-v113-insights {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
#detailSheet .detail-v113-insights > * {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  border-radius: 19px !important;
}
#detailSheet .detail-v113-ai {
  grid-column: 1 / -1 !important;
  display: grid !important;
  grid-template-columns: 42px minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 11px !important;
  padding: 12px !important;
  text-align: left !important;
  border: 1px solid rgba(42,238,202,.27) !important;
  background: linear-gradient(135deg, rgba(42,238,202,.12), rgba(255,55,126,.075)) !important;
}
#detailSheet .detail-v113-ai > div { min-width: 0 !important; }
#detailSheet .detail-v113-ai b,
#detailSheet .detail-v113-ai small {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  white-space: normal !important;
}
#detailSheet .detail-v113-ai b { font-size: 13px !important; line-height: 1.18 !important; }
#detailSheet .detail-v113-ai small { margin-top: 3px; font-size: 10px !important; line-height: 1.38 !important; color: rgba(255,255,255,.66) !important; }
#detailSheet .detail-v113-ai > i { display: grid; place-items: center; width: 24px; height: 24px; color: var(--cyan); }
#detailSheet .detail-v113-ai > i svg { width: 16px; height: 16px; fill: none; stroke: currentColor; }
#detailSheet .price-radar-box,
#detailSheet .trust-mini { padding: 11px !important; min-height: 72px !important; }
#detailSheet .price-radar-box > div,
#detailSheet .trust-mini > div { min-width: 0 !important; }
#detailSheet .price-radar-box b,
#detailSheet .price-radar-box small,
#detailSheet .trust-mini b,
#detailSheet .trust-mini small { white-space: normal !important; overflow-wrap: anywhere !important; }
#detailSheet .detail-v113-actions {
  position: sticky !important;
  bottom: -10px !important;
  z-index: 5 !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 10px 0 4px !important;
  background: linear-gradient(180deg, transparent, rgba(3,7,10,.96) 22%, #03070a 52%) !important;
}
#detailSheet .detail-v113-actions > * {
  min-width: 0 !important;
  width: 100% !important;
  min-height: 44px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 9px 10px !important;
  white-space: normal !important;
  line-height: 1.15 !important;
  border-radius: 14px !important;
}

/* Vi AI, a focused chat room rather than an information dashboard. */
#aiHelpSheet.sheet[open] {
  width: 100vw !important;
  max-width: none !important;
  height: 100dvh !important;
  inset: 0 !important;
  margin: 0 !important;
  padding: clamp(10px, 2vw, 28px) !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  background: rgba(0,0,0,.70) !important;
  backdrop-filter: blur(14px) !important;
}
#aiHelpSheet .ai-room-v113 {
  box-sizing: border-box !important;
  width: min(920px, calc(100vw - 26px)) !important;
  max-width: 920px !important;
  height: min(88dvh, 820px) !important;
  max-height: min(88dvh, 820px) !important;
  min-height: 480px !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0,1fr) auto !important;
  gap: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(42,238,202,.11), transparent 34%),
    radial-gradient(circle at 96% 8%, rgba(255,55,126,.075), transparent 30%),
    linear-gradient(160deg, #050a0e, #030609 68%, #09050a) !important;
  box-shadow: 0 32px 100px rgba(0,0,0,.60), inset 0 1px rgba(255,255,255,.045) !important;
}
#aiHelpSheet .ai-room-v113 > .sheet-bar { margin-top: 10px; }
#aiHelpSheet .ai-room-title {
  min-height: 72px !important;
  margin: 0 !important;
  padding: 10px 16px 12px 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(3,8,11,.70) !important;
}
#aiHelpSheet .ai-room-title > div:first-child { min-width: 0; }
#aiHelpSheet .ai-room-title h3 { margin: 3px 0 0; font-size: 20px; line-height: 1.05; letter-spacing: -.035em; }
#aiHelpSheet .ai-room-presence { display: block; max-width: 100%; margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: rgba(255,255,255,.52); font-size: 9px; }
#aiHelpSheet .ai-room-head-actions { display: flex; align-items: center; gap: 7px; }
#aiHelpSheet .ai-room-new,
#aiHelpSheet .ai-room-title .xbtn {
  position: static !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.06) !important;
  color: #fff !important;
  font-size: 22px !important;
}
#aiHelpSheet .ai-room-new:hover,
#aiHelpSheet .ai-room-new:focus-visible { border-color: rgba(42,238,202,.45) !important; background: rgba(42,238,202,.11) !important; outline: none; }
#aiHelpSheet .ai-room-messages {
  min-width: 0 !important;
  min-height: 0 !important;
  max-height: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 18px clamp(13px, 2.4vw, 26px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-width: thin !important;
}
.ai-room-message-v113 {
  width: 100%;
  min-width: 0;
  display: flex;
  align-items: flex-end;
  gap: 9px;
}
.ai-room-message-v113.user { justify-content: flex-end; }
.ai-room-bubble-avatar-v113 {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(145deg, #24efcb, #7269ff 52%, #ff397d);
  box-shadow: 0 9px 26px rgba(0,0,0,.32), 0 0 20px rgba(42,238,202,.09);
}
.ai-room-bubble-avatar-v113 i { width: 9px; height: 9px; border-radius: 3px; background: #061214; transform: rotate(45deg); }
.ai-room-bubble-v113 {
  min-width: 0;
  max-width: min(76%, 660px);
  padding: 11px 13px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 20px 20px 20px 7px;
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.035));
  box-shadow: 0 10px 30px rgba(0,0,0,.20), inset 0 1px rgba(255,255,255,.035);
}
.ai-room-message-v113.user .ai-room-bubble-v113 {
  border-color: rgba(42,238,202,.23);
  border-radius: 20px 20px 7px 20px;
  background: linear-gradient(135deg, rgba(42,238,202,.18), rgba(31,95,92,.18));
}
.ai-room-bubble-v113 > p {
  max-width: 100%;
  margin: 0;
  overflow-wrap: anywhere;
  word-break: normal;
  white-space: pre-wrap;
  color: rgba(250,255,254,.94);
  font-size: 13px;
  line-height: 1.55;
}
.ai-room-followups-v113 { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.ai-room-followups-v113 button {
  max-width: 100%;
  min-height: 32px;
  padding: 7px 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border: 1px solid rgba(42,238,202,.18);
  border-radius: 999px;
  background: rgba(42,238,202,.07);
  color: #eafffb;
  font-size: 9.5px;
  font-weight: 800;
}
.ai-room-followups-v113 button:hover,
.ai-room-followups-v113 button:focus-visible { border-color: rgba(42,238,202,.48); background: rgba(42,238,202,.13); outline: none; }
.ai-room-items-v113 { display: grid; gap: 6px; margin-top: 9px; }
.ai-room-items-v113 button {
  min-width: 0;
  display: grid;
  grid-template-columns: 44px minmax(0,1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 6px;
  text-align: left;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: rgba(0,0,0,.22);
  color: #fff;
}
.ai-room-items-v113 img { width: 44px; height: 42px; object-fit: contain; border-radius: 10px; background: #071014; }
.ai-room-items-v113 span { min-width: 0; }
.ai-room-items-v113 b,
.ai-room-items-v113 small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ai-room-items-v113 b { font-size: 10px; }
.ai-room-items-v113 small { margin-top: 2px; color: rgba(255,255,255,.52); font-size: 8.5px; }
.ai-room-items-v113 svg { width: 14px; height: 14px; fill: none; stroke: var(--cyan); }
.ai-room-typing-v113 { display: flex; align-items: center; gap: 9px; min-height: 44px; }
.ai-room-typing-v113 small { color: rgba(255,255,255,.55); font-size: 9px; }
#aiHelpSheet .ai-room-composer {
  position: relative !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 48px !important;
  align-items: end !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 12px clamp(13px, 2.4vw, 26px) calc(13px + env(safe-area-inset-bottom)) !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(3,8,11,.90) !important;
  backdrop-filter: blur(18px) !important;
}
#aiHelpSheet .ai-room-composer textarea {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 48px !important;
  max-height: 132px !important;
  margin: 0 !important;
  padding: 13px 15px !important;
  resize: none !important;
  overflow-y: auto !important;
  border: 1px solid rgba(42,238,202,.20) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.055) !important;
  color: #fff !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}
#aiHelpSheet .ai-room-composer textarea:focus { border-color: rgba(42,238,202,.55) !important; box-shadow: 0 0 0 3px rgba(42,238,202,.08) !important; outline: none !important; }
#aiHelpSheet .ai-room-send {
  width: 48px !important;
  min-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 17px !important;
  font-size: 22px !important;
}
#aiHelpSheet .ai-room-send.is-busy { opacity: .62; }

/* Quick Post, one calm workflow and one loader. */
#postSheet .post-v113-card {
  box-sizing: border-box;
  width: min(1080px, calc(100vw - 28px));
  max-width: 1080px;
  max-height: min(92dvh, 880px);
  overflow: auto;
  padding: 14px;
  background:
    radial-gradient(circle at 8% 0%, rgba(42,238,202,.10), transparent 30%),
    radial-gradient(circle at 96% 4%, rgba(255,55,126,.07), transparent 28%),
    linear-gradient(155deg, #060b0f, #030609);
}
#postSheet .post-v113-layout {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(300px,.88fr) minmax(420px,1.12fr);
  gap: 14px;
  align-items: start;
}
#postSheet .post-v113-media-column,
#postSheet .post-v113-editor-column { min-width: 0; }
#postSheet .post-v113-media-column {
  position: sticky;
  top: 0;
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 23px;
  background: rgba(255,255,255,.025);
}
#postSheet .post-v113-editor-column {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 23px;
  background: rgba(255,255,255,.025);
}
#postSheet .post-v113-section-head { display: grid; gap: 3px; }
#postSheet .post-v113-section-head b { font-size: 13px; }
#postSheet .post-v113-section-head small { color: rgba(255,255,255,.52); font-size: 9px; line-height: 1.35; }
#postSheet .post-v113-upload {
  min-height: 360px;
  max-height: min(58dvh, 520px);
  margin: 0;
  border-radius: 20px;
  background: radial-gradient(circle at 50% 28%, rgba(42,238,202,.10), transparent 45%), #050a0e;
}
#postSheet .post-v113-upload img { width: 100%; height: 100%; max-height: min(58dvh, 520px); object-fit: contain; }
#postSheet .post-v113-draft { min-width: 0; margin: 0; border-radius: 20px; }
#postSheet .post-v113-draft strong,
#postSheet .post-v113-draft small,
#postSheet .post-v113-draft p { max-width: 100%; overflow-wrap: anywhere; }
#postSheet .compact-post { margin: 0; }
#postSheet .extra-notes { margin: 0; min-height: 82px; }
#postSheet .post-fields { margin: 0; }
#postSheet .post-v113-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
#postSheet .post-v113-actions button { min-width: 0; min-height: 48px; margin: 0; border-radius: 16px; }
#postSheet .post-v113-progress {
  min-width: 0;
  grid-template-columns: auto minmax(0,1fr);
  gap: 11px;
  margin: 0;
  border-radius: 18px;
  background: linear-gradient(120deg, rgba(42,238,202,.10), rgba(255,55,126,.055));
}
#postSheet .post-v113-progress > div { min-width: 0; }
#postSheet .post-v113-progress strong,
#postSheet .post-v113-progress small { overflow-wrap: anywhere; }
#postSheet .post-v113-progress .twin-dots { transform: scale(.82); }
/* Explicitly suppress legacy duplicate animations inside Quick Post. */
#postSheet .upload-box.processing::after,
#postSheet .ai-card.thinking::before,
#postSheet .ai-card.thinking::after,
#postSheet #aiExtraNotes .ai-waiting { display: none !important; animation: none !important; }
#postSheet #aiFillBtn[aria-busy="true"]::before,
#postSheet #publishBtn[aria-busy="true"]::before { display: none !important; }

@media (max-width: 1099px) {
  #detailSheet.sheet[open] { padding: 8px !important; place-items: stretch center !important; }
  #detailSheet .detail-card {
    width: min(760px, calc(100vw - 16px)) !important;
    max-width: 760px !important;
    height: calc(100dvh - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 25px !important;
  }
  #detailSheet .detail-card > .sheet-title { min-height: 68px !important; padding: 11px 13px 10px 16px !important; }
  #detailSheet .detail-card > .sheet-title h3 { font-size: clamp(18px, 4.4vw, 25px) !important; }
  #detailSheet #detailBody { overflow-y: auto !important; }
  #detailSheet .detail-v113-layout {
    height: auto !important;
    min-height: 100% !important;
    grid-template-columns: minmax(0,1fr) !important;
    grid-template-rows: auto auto !important;
    gap: 10px !important;
    padding: 10px 11px 16px !important;
    overflow: visible !important;
  }
  #detailSheet .detail-v113-media {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  #detailSheet .detail-v113-media > .detail-media,
  #detailSheet .detail-v113-media > .detail-media.is-landscape,
  #detailSheet .detail-v113-media > .detail-media.is-portrait,
  #detailSheet .detail-v113-media > .detail-media.is-squareish {
    height: clamp(300px, 48dvh, 560px) !important;
    min-height: 300px !important;
  }
  #detailSheet .detail-v113-content {
    max-height: none !important;
    padding: 0 0 8px !important;
    overflow: visible !important;
  }
  #detailSheet .detail-v113-actions { position: relative !important; bottom: auto !important; padding-bottom: calc(4px + env(safe-area-inset-bottom)) !important; }
  #postSheet .post-v113-layout { grid-template-columns: 1fr; }
  #postSheet .post-v113-media-column { position: relative; top: auto; }
  #postSheet .post-v113-upload { min-height: 270px; max-height: 430px; }
}

@media (max-width: 600px) {
  .location-context-summary {
    grid-template-columns: minmax(0, 72px) minmax(0,1fr) !important;
    min-height: 54px !important;
    gap: 3px 8px !important;
    padding: 9px 10px !important;
    border-radius: 14px !important;
  }
  .location-context-summary > span {
    max-width: 72px !important;
    font-size: 7.5px !important;
    line-height: 1.12 !important;
    letter-spacing: .055em !important;
  }
  .location-context-summary strong,
  .location-context-result > strong { font-size: 12px !important; }
  .location-context-result > small,
  .location-context-summary > small { font-size: 8.8px !important; line-height: 1.25 !important; }

  #detailSheet.sheet[open] { padding: 0 !important; place-items: end stretch !important; }
  #detailSheet .detail-card {
    width: 100% !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
  }
  #detailSheet .detail-card > .sheet-bar { display: block !important; }
  #detailSheet .detail-card > .sheet-title { min-height: 61px !important; padding: 8px 10px 8px 13px !important; }
  #detailSheet .detail-card > .sheet-title h3 { font-size: 18px !important; }
  #detailSheet .detail-card > .sheet-title .xbtn { width: 38px !important; height: 38px !important; min-width: 38px !important; }
  #detailSheet .detail-v113-layout { padding: 7px 8px 16px !important; gap: 8px !important; }
  #detailSheet .detail-v113-media > .detail-media,
  #detailSheet .detail-v113-media > .detail-media.is-landscape,
  #detailSheet .detail-v113-media > .detail-media.is-portrait,
  #detailSheet .detail-v113-media > .detail-media.is-squareish {
    height: clamp(255px, 43dvh, 420px) !important;
    min-height: 255px !important;
    border-radius: 19px !important;
  }
  #detailSheet .detail-v113-media .detail-thumbs button { flex-basis: 50px !important; width: 50px !important; height: 50px !important; border-radius: 14px !important; }
  #detailSheet .detail-v113-summary { padding: 11px !important; border-radius: 18px !important; }
  #detailSheet .detail-title-main { font-size: clamp(23px, 8vw, 31px) !important; }
  #detailSheet .detail-v113-insights { grid-template-columns: 1fr !important; }
  #detailSheet .detail-v113-ai { grid-column: auto !important; }
  #detailSheet .detail-v113-actions { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 7px !important; }

  #aiHelpSheet.sheet[open] { padding: 0 !important; place-items: stretch !important; }
  #aiHelpSheet .ai-room-v113 {
    width: 100% !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
    border-radius: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
  }
  #aiHelpSheet .ai-room-title { min-height: 64px !important; padding: 8px 10px 9px 13px !important; }
  #aiHelpSheet .ai-room-title h3 { font-size: 18px; }
  #aiHelpSheet .ai-room-presence { max-width: 62vw; font-size: 8px; }
  #aiHelpSheet .ai-room-new,
  #aiHelpSheet .ai-room-title .xbtn { width: 38px !important; height: 38px !important; min-width: 38px !important; }
  #aiHelpSheet .ai-room-messages { gap: 10px !important; padding: 13px 10px !important; }
  .ai-room-bubble-avatar-v113 { flex-basis: 28px; width: 28px; height: 28px; border-radius: 10px; }
  .ai-room-bubble-v113 { max-width: 84%; padding: 10px 11px; border-radius: 17px 17px 17px 6px; }
  .ai-room-message-v113.user .ai-room-bubble-v113 { border-radius: 17px 17px 6px 17px; }
  .ai-room-bubble-v113 > p { font-size: 12.5px; line-height: 1.5; }
  .ai-room-followups-v113 { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
  .ai-room-followups-v113::-webkit-scrollbar { display: none; }
  .ai-room-followups-v113 button { flex: 0 0 auto; max-width: 230px; }
  #aiHelpSheet .ai-room-composer { grid-template-columns: minmax(0,1fr) 46px !important; gap: 7px !important; padding: 9px 9px calc(9px + env(safe-area-inset-bottom)) !important; }
  #aiHelpSheet .ai-room-composer textarea { min-height: 46px !important; padding: 12px 13px !important; border-radius: 16px !important; font-size: 12.5px !important; }
  #aiHelpSheet .ai-room-send { width: 46px !important; min-width: 46px !important; height: 46px !important; min-height: 46px !important; border-radius: 16px !important; }

  #postSheet.sheet[open] { padding: 0 !important; place-items: end stretch !important; }
  #postSheet .post-v113-card {
    width: 100% !important;
    max-width: none !important;
    max-height: 100dvh !important;
    min-height: 100dvh !important;
    padding: 10px !important;
    border-radius: 0 !important;
  }
  #postSheet .post-v113-layout { gap: 9px; }
  #postSheet .post-v113-media-column,
  #postSheet .post-v113-editor-column { padding: 9px; border-radius: 18px; }
  #postSheet .post-v113-upload { min-height: 225px; max-height: 38dvh; border-radius: 17px; }
  #postSheet .post-v113-upload img { max-height: 38dvh; }
  #postSheet .compact-post { grid-template-columns: 1fr; }
  #postSheet .post-v113-actions { position: sticky; bottom: 0; z-index: 5; padding-top: 8px; background: linear-gradient(180deg, transparent, rgba(3,7,10,.96) 30%); }
}

@media (prefers-reduced-motion: reduce) {
  .ai-room-message-v113,
  .ai-room-bubble-v113,
  #postSheet .post-v113-progress { animation: none !important; transition: none !important; }
}

/* v113 specificity shield: older detail generations used two-ID selectors. */
#detailSheet #detailBody > .detail-v113-layout > .detail-v113-content {
  display: flex !important;
  flex-direction: column !important;
  grid-column: auto !important;
  grid-row: auto !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
}
#detailSheet #detailBody > .detail-v113-layout > .detail-v113-content > .detail-v113-summary,
#detailSheet #detailBody > .detail-v113-layout > .detail-v113-content > .detail-v113-insights,
#detailSheet #detailBody > .detail-v113-layout > .detail-v113-content > .detail-v113-actions,
#detailSheet #detailBody > .detail-v113-layout > .detail-v113-content > .owner-tools,
#detailSheet #detailBody > .detail-v113-layout > .detail-v113-content > .detail-service-note {
  grid-column: auto !important;
  grid-row: auto !important;
  order: initial !important;
}
#detailSheet #detailBody .detail-v113-insights > * {
  grid-row: auto !important;
  order: initial !important;
}
#detailSheet #detailBody .detail-v113-insights > .detail-v113-ai { grid-column: 1 / -1 !important; }
#detailSheet #detailBody .detail-v113-insights > .price-radar-box,
#detailSheet #detailBody .detail-v113-insights > .detail-v112-trust { grid-column: auto !important; }

@media (max-width: 719px) {
  #detailSheet #detailBody .detail-v113-insights > .detail-v113-ai { grid-column: auto !important; }
}

/* v113 Quick Post specificity shield against legacy tall-sheet grid rules. */
#postSheet .sheet-card.post-v113-card {
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
}
#postSheet .sheet-card.post-v113-card > .sheet-title {
  width: 100% !important;
  height: auto !important;
  min-height: 64px !important;
  margin: 0 !important;
  padding: 10px 18px 13px !important;
  box-sizing: border-box !important;
}
#postSheet .sheet-card.post-v113-card > .post-v113-layout { width: 100% !important; box-sizing: border-box !important; }

@media (max-width: 719px) {
  #postSheet .sheet-card.post-v113-card > .sheet-title { min-height: 58px !important; padding: 8px 11px 10px !important; }
}

@media (max-width: 719px) {
  #postSheet .post-v113-actions {
    position: static !important;
    bottom: auto !important;
    margin-top: 2px !important;
    padding: 8px 0 0 !important;
    background: transparent !important;
  }
}

/* ============================================================================
   v114.0.0 · Bottom action dock, showroom-first profiles, professional flyers,
   adaptive discovery cards and transparent complete-fit smart shelf
   ========================================================================== */

/* Product Details: keep media + useful description/AI above, move actions into
   a calm full-width dock below. This prevents button collisions on desktop. */
#detailSheet #detailBody > .detail-v114-layout {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 12px 14px 14px !important;
  gap: 12px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
#detailSheet #detailBody > .detail-v114-layout > .detail-v114-main {
  display: grid !important;
  grid-template-columns: minmax(0, 1.46fr) minmax(360px, .84fr) !important;
  gap: 12px !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
#detailSheet .detail-v114-main > .detail-v114-media,
#detailSheet .detail-v114-main > .detail-v114-content {
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  max-width: none !important;
}
#detailSheet .detail-v114-main > .detail-v114-media {
  height: 100% !important;
  max-height: none !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
}
#detailSheet .detail-v114-main > .detail-v114-media > .detail-media,
#detailSheet .detail-v114-main > .detail-v114-media > .detail-media.is-landscape,
#detailSheet .detail-v114-main > .detail-v114-media > .detail-media.is-portrait,
#detailSheet .detail-v114-main > .detail-v114-media > .detail-media.is-squareish {
  height: 100% !important;
  min-height: 360px !important;
  max-height: none !important;
}
#detailSheet .detail-v114-content {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 0 4px 2px 0 !important;
  scrollbar-gutter: stable !important;
}
#detailSheet .detail-v114-summary,
#detailSheet .detail-v114-insights,
#detailSheet .detail-v114-content > .owner-tools,
#detailSheet .detail-v114-content > .detail-service-note {
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
#detailSheet .detail-v114-summary .detail-description {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 7 !important;
  overflow: hidden !important;
  max-height: none !important;
}
#detailSheet .detail-v114-insights {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
#detailSheet .detail-v114-insights > .detail-v114-ai {
  grid-column: 1 / -1 !important;
  min-height: 72px !important;
}
#detailSheet .detail-v114-action-dock {
  display: grid !important;
  grid-template-columns: minmax(205px, .30fr) minmax(0, 1fr) !important;
  align-items: stretch !important;
  gap: 10px !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
  padding: 9px !important;
  border: 1px solid rgba(42, 238, 202, .18) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 8% 10%, rgba(42, 238, 202, .10), transparent 38%),
    linear-gradient(135deg, rgba(8, 20, 25, .97), rgba(7, 10, 15, .98)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055), 0 16px 38px rgba(0,0,0,.26) !important;
}
#detailSheet .detail-v114-action-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-width: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.035) !important;
}
#detailSheet .detail-v114-action-heading > div { min-width: 0 !important; }
#detailSheet .detail-v114-action-heading small {
  display: block !important;
  margin-bottom: 4px !important;
  color: var(--cyan) !important;
  font-size: 8px !important;
  font-weight: 1000 !important;
  letter-spacing: .11em !important;
}
#detailSheet .detail-v114-action-heading b {
  display: block !important;
  color: #fff !important;
  font-size: 13px !important;
  line-height: 1.28 !important;
}
#detailSheet .detail-v114-action-heading > span {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 13px !important;
  color: #061114 !important;
  background: linear-gradient(145deg, var(--cyan), #52f0a5) !important;
  box-shadow: 0 8px 24px rgba(42,238,202,.17) !important;
}
#detailSheet .detail-v114-action-heading svg { width: 18px !important; height: 18px !important; }
#detailSheet .detail-v114-actions {
  position: static !important;
  inset: auto !important;
  display: grid !important;
  grid-template-columns: repeat(6, minmax(92px, 1fr)) !important;
  align-content: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
#detailSheet .detail-v114-actions > button,
#detailSheet .detail-v114-actions > a {
  min-width: 0 !important;
  min-height: 43px !important;
  height: auto !important;
  padding: 9px 8px !important;
  border-radius: 14px !important;
  font-size: 10px !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  text-align: center !important;
}
#detailSheet .detail-v114-actions > .primary,
#detailSheet .detail-v114-actions > .pay-now {
  background: linear-gradient(135deg, #25f0d4, #52eda8) !important;
  color: #031114 !important;
  border-color: transparent !important;
}

/* Profile: identity first, then the seller's showroom, then contact/trust tools. */
#profileSheet .profile-v114 {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  min-width: 0 !important;
}
#profileSheet .profile-v114 > * { min-width: 0 !important; }
#profileSheet .profile-v114-showroom-first {
  order: 2 !important;
  padding: 12px !important;
  border: 1px solid rgba(42,238,202,.16) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 9% 0%, rgba(42,238,202,.09), transparent 40%),
    linear-gradient(145deg, rgba(8,20,24,.96), rgba(8,10,15,.98)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.045), 0 16px 34px rgba(0,0,0,.20) !important;
}
#profileSheet .profile-v114-stats { order: 3 !important; }
#profileSheet .profile-v114-contact-zone { order: 4 !important; }
#profileSheet .profile-v112-service-note { order: 5 !important; }
#profileSheet .profile-v114-intelligence { order: 6 !important; }
#profileSheet .profile-v114-showroom-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 10px !important;
}
#profileSheet .profile-v114-showroom-head h3 { margin: 1px 0 0 !important; font-size: 18px !important; }
#profileSheet .profile-v114-showroom-head > div:last-child {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}
#profileSheet .profile-v114-showroom-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)) !important;
  gap: 9px !important;
  min-width: 0 !important;
}
#profileSheet .inside-card-v114 {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  min-height: 184px !important;
  padding: 5px 5px 9px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 18px !important;
  background: linear-gradient(155deg, rgba(12,26,31,.96), rgba(6,10,15,.99)) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.24), inset 0 1px rgba(255,255,255,.05) !important;
  text-align: left !important;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease !important;
}
#profileSheet .inside-card-v114:hover,
#profileSheet .inside-card-v114:focus-visible {
  transform: translateY(-3px) !important;
  border-color: rgba(42,238,202,.50) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.32), 0 0 0 1px rgba(42,238,202,.08) !important;
}
#profileSheet .inside-card-v114-media {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  aspect-ratio: 4 / 3 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 50% 22%, rgba(42,238,202,.12), transparent 48%),
    linear-gradient(145deg, rgba(255,255,255,.06), rgba(2,7,11,.78)) !important;
}
#profileSheet .inside-card-v114-media > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  padding: 6px !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-sizing: border-box !important;
  filter: drop-shadow(0 8px 13px rgba(0,0,0,.24)) !important;
}
#profileSheet .inside-card-v114-meta {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  min-width: 0 !important;
  padding: 7px 4px 2px !important;
}
#profileSheet .inside-card-v114 .show-price {
  position: static !important;
  display: block !important;
  min-width: 0 !important;
  max-width: 72% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #7ff8df !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  font-size: 9px !important;
}
#profileSheet .inside-card-v114 time {
  position: static !important;
  flex: 0 0 auto !important;
  color: rgba(255,255,255,.48) !important;
  font-size: 8px !important;
}
#profileSheet .inside-card-v114 > b {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 2px 4px 0 !important;
  overflow: hidden !important;
  color: #fff !important;
  font-size: 11px !important;
  line-height: 1.28 !important;
}
#profileSheet .profile-v114-contact-zone {
  padding: 10px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 20px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.035), rgba(42,238,202,.025)) !important;
}
#profileSheet .profile-v114-contact-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 2px 3px 9px !important;
}
#profileSheet .profile-v114-contact-head small { display: block !important; color: var(--cyan) !important; font-size: 8px !important; font-weight: 1000 !important; letter-spacing: .1em !important; }
#profileSheet .profile-v114-contact-head b { display: block !important; margin-top: 3px !important; font-size: 12px !important; }
#profileSheet .profile-v114-contact-head > span { color: var(--cyan) !important; }
#profileSheet .profile-v114-actions {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
#profileSheet .profile-v114-actions > * { min-width: 0 !important; min-height: 48px !important; border-radius: 15px !important; }

/* QR cards: no logo over the matrix; retain a generous white quiet zone. */
.vc-qr-card-v114 { align-items: center !important; gap: 14px !important; }
.qr-v114-clean {
  display: grid !important;
  place-items: center !important;
  padding: 8px !important;
  overflow: hidden !important;
  border: 1px solid rgba(7,17,20,.12) !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.24) !important;
}
.qr-v114-clean .qr-main { display: block !important; width: 100% !important; height: 100% !important; object-fit: contain !important; image-rendering: pixelated !important; }
.qr-v114-clean .qr-logo { display: none !important; }
.qr-v114-brand { display: inline-flex !important; align-items: center !important; gap: 6px !important; margin-bottom: 5px !important; color: var(--cyan) !important; font-size: 10px !important; }
.qr-v114-brand img { width: 24px !important; height: 24px !important; border-radius: 8px !important; object-fit: contain !important; }

/* Explore/directory: media-first equal-height cards that scale from phones to
   four-column desktop layouts without squeezing actions or copy. */
#directoryList.discovery-v114-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 12px !important;
  min-width: 0 !important;
  padding-bottom: 24px !important;
}
#directoryList .discovery-v114-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto minmax(0,1fr) auto !important;
  min-width: 0 !important;
  min-height: 300px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(42,238,202,.18) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(42,238,202,.08), transparent 38%),
    linear-gradient(155deg, rgba(7,22,25,.98), rgba(5,9,13,.99)) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.25), inset 0 1px rgba(255,255,255,.04) !important;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease !important;
}
#directoryList .discovery-v114-card:hover,
#directoryList .discovery-v114-card:focus-within {
  transform: translateY(-3px) !important;
  border-color: rgba(42,238,202,.52) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.34), 0 0 0 1px rgba(42,238,202,.07) !important;
}
#directoryList .discovery-v114-visual {
  position: relative !important;
  min-width: 0 !important;
  aspect-ratio: 16 / 8.6 !important;
  overflow: hidden !important;
  background: linear-gradient(135deg, rgba(42,238,202,.10), rgba(44,37,86,.16)) !important;
}
#directoryList .discovery-v114-cover {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
  filter: saturate(.93) contrast(1.03) !important;
}
#directoryList .discovery-v114-visual::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, transparent 36%, rgba(2,7,10,.84) 100%) !important;
}
#directoryList .discovery-v114-kind {
  position: absolute !important;
  z-index: 2 !important;
  top: 9px !important;
  right: 9px !important;
  left: auto !important;
  padding: 4px 7px !important;
  border-radius: 999px !important;
  color: #8bffe7 !important;
  background: rgba(2,13,16,.78) !important;
  border: 1px solid rgba(42,238,202,.26) !important;
  backdrop-filter: blur(10px) !important;
  font-size: 7px !important;
  font-weight: 1000 !important;
  letter-spacing: .05em !important;
}
#directoryList .discovery-v114-avatar {
  position: absolute !important;
  z-index: 3 !important;
  left: 12px !important;
  bottom: -22px !important;
  width: 58px !important;
  height: 58px !important;
  padding: 3px !important;
  border: 2px solid rgba(42,238,202,.72) !important;
  border-radius: 19px !important;
  background: #071015 !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.42) !important;
}
#directoryList .discovery-v114-avatar > img { width: 100% !important; height: 100% !important; border-radius: 14px !important; object-fit: cover !important; }
#directoryList .discovery-v114-copy {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  padding: 31px 13px 9px !important;
}
#directoryList .discovery-v114-copy > strong {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
}
#directoryList .discovery-v114-copy > span {
  margin-top: 4px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: rgba(225,248,246,.68) !important;
  font-size: 10px !important;
}
#directoryList .discovery-v114-copy > em {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  min-height: 30px !important;
  margin-top: 7px !important;
  overflow: hidden !important;
  color: rgba(255,255,255,.66) !important;
  font-size: 10px !important;
  font-style: normal !important;
  line-height: 1.45 !important;
}
#directoryList .discovery-v114-copy .service-card-meta { margin-top: auto !important; padding-top: 9px !important; }
#directoryList .discovery-v114-actions {
  position: static !important;
  display: grid !important;
  grid-template-columns: repeat(3, 38px) !important;
  justify-content: end !important;
  gap: 7px !important;
  padding: 0 12px 12px !important;
  background: transparent !important;
}
#directoryList .discovery-v114-actions > button {
  display: grid !important;
  place-items: center !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 13px !important;
  background: rgba(255,255,255,.055) !important;
  color: #fff !important;
}
#directoryList .discovery-v114-actions > button:first-child { border-color: rgba(42,238,202,.38) !important; color: #7ff8df !important; background: rgba(42,238,202,.10) !important; }

/* Smart shelf: dark transparent glass, clean complete-fit product images and
   cover-style service cards. The product itself, not a white rectangle, leads. */
.smart-shop-shelf {
  background: linear-gradient(180deg, rgba(4,13,17,.74), rgba(3,7,11,.88)) !important;
  border-radius: 14px !important;
  backdrop-filter: blur(16px) saturate(1.14) !important;
}
.smart-shop-shelf-head {
  display: grid !important;
  grid-template-columns: minmax(0, auto) minmax(0,1fr) auto auto !important;
  align-items: center !important;
  column-gap: 7px !important;
  min-width: 0 !important;
  padding: 4px 8px 4px 10px !important;
  border-radius: 12px !important;
}
.smart-shop-shelf-title { min-width: 0 !important; font-size: 11px !important; letter-spacing: -.01em !important; }
.smart-shop-shelf-shop { min-width: 0 !important; max-width: none !important; font-size: 8.7px !important; }
.smart-shop-shelf-window { min-width: 0 !important; overflow: hidden !important; }
.smart-shop-shelf-track { align-items: stretch !important; min-width: 0 !important; }
.smart-shop-product {
  position: relative !important;
  display: grid !important;
  grid-template-rows: minmax(0,1fr) 22px !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: 3px 3px 0 !important;
  border: 1px solid rgba(42,238,202,.22) !important;
  border-radius: 11px !important;
  background:
    radial-gradient(circle at 50% 15%, rgba(42,238,202,.12), transparent 46%),
    linear-gradient(150deg, rgba(11,29,34,.88), rgba(4,8,13,.96)) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.27), inset 0 1px rgba(255,255,255,.04) !important;
}
.smart-shop-product-image {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 4px !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-sizing: border-box !important;
  filter: drop-shadow(0 7px 10px rgba(0,0,0,.24)) !important;
}
.smart-shop-product.is-service .smart-shop-product-image {
  padding: 0 !important;
  object-fit: cover !important;
  filter: saturate(.96) contrast(1.03) !important;
}
.smart-shop-product-price {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  height: 22px !important;
  padding: 0 4px !important;
  overflow: hidden !important;
  border-radius: 0 0 8px 8px !important;
  background: rgba(1,7,10,.72) !important;
  color: #ecfffb !important;
  font-size: 8.2px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Flyer Studio preview canvas gets a framed, neutral stage while the exported
   file remains full-resolution. */
#flyerSheet #flyerCanvas {
  border: 1px solid rgba(42,238,202,.20) !important;
  border-radius: 20px !important;
  background: #071015 !important;
  box-shadow: 0 22px 54px rgba(0,0,0,.38), 0 0 0 1px rgba(255,255,255,.025) !important;
}

@media (max-width: 1399px) {
  #detailSheet .detail-v114-actions { grid-template-columns: repeat(4, minmax(88px,1fr)) !important; }
  #directoryList.discovery-v114-grid { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
}

@media (max-width: 1099px) {
  #detailSheet #detailBody > .detail-v114-layout { overflow: auto !important; height: auto !important; }
  #detailSheet #detailBody > .detail-v114-layout > .detail-v114-main {
    grid-template-columns: 1fr !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
  }
  #detailSheet .detail-v114-main > .detail-v114-media { height: auto !important; }
  #detailSheet .detail-v114-main > .detail-v114-content { overflow: visible !important; padding-right: 0 !important; }
  #detailSheet .detail-v114-action-dock { grid-template-columns: 1fr !important; }
  #detailSheet .detail-v114-actions { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
  #directoryList.discovery-v114-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  #profileSheet .profile-v114-showroom-grid { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
}

@media (max-width: 719px) {
  #detailSheet #detailBody > .detail-v114-layout { padding: 7px 8px 18px !important; gap: 8px !important; }
  #detailSheet .detail-v114-main { gap: 8px !important; }
  #detailSheet .detail-v114-main > .detail-v114-media > .detail-media,
  #detailSheet .detail-v114-main > .detail-v114-media > .detail-media.is-landscape,
  #detailSheet .detail-v114-main > .detail-v114-media > .detail-media.is-portrait,
  #detailSheet .detail-v114-main > .detail-v114-media > .detail-media.is-squareish {
    height: clamp(255px, 43dvh, 420px) !important;
    min-height: 255px !important;
  }
  #detailSheet .detail-v114-action-dock { padding: 7px !important; border-radius: 19px !important; }
  #detailSheet .detail-v114-action-heading { padding: 8px 9px !important; border-radius: 14px !important; }
  #detailSheet .detail-v114-action-heading > span { flex-basis: 34px !important; width: 34px !important; height: 34px !important; }
  #detailSheet .detail-v114-actions { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 7px !important; }
  #detailSheet .detail-v114-actions > button,
  #detailSheet .detail-v114-actions > a { min-height: 43px !important; font-size: 9.5px !important; }

  #profileSheet .profile-v114-showroom-first { padding: 9px !important; border-radius: 19px !important; }
  #profileSheet .profile-v114-showroom-head { align-items: flex-start !important; }
  #profileSheet .profile-v114-showroom-head > div:last-child { flex-direction: column !important; align-items: flex-end !important; }
  #profileSheet .profile-v114-showroom-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 7px !important; }
  #profileSheet .inside-card-v114 { min-height: 160px !important; border-radius: 16px !important; }
  #profileSheet .inside-card-v114 > b { font-size: 10px !important; }
  #profileSheet .profile-v114-actions { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  #profileSheet .profile-v114-intelligence { grid-template-columns: 1fr !important; }
  .vc-qr-card-v114 { align-items: flex-start !important; }

  #directoryList.discovery-v114-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  #directoryList .discovery-v114-card { min-height: 250px !important; border-radius: 19px !important; }
  #directoryList .discovery-v114-visual { aspect-ratio: 16 / 7.8 !important; }
  #directoryList .discovery-v114-copy { padding-top: 29px !important; }

  .smart-shop-shelf-head { grid-template-columns: minmax(0,1fr) auto auto !important; }
  .smart-shop-shelf-shop { display: none !important; }
  .smart-shop-shelf-title { font-size: 9.7px !important; }
  .smart-shop-product { grid-template-rows: minmax(0,1fr) 18px !important; padding: 2px 2px 0 !important; border-radius: 9px !important; }
  .smart-shop-product-image { padding: 2px !important; border-radius: 7px !important; }
  .smart-shop-product-price { height: 18px !important; font-size: 6.9px !important; }
}

@media (max-width: 360px) {
  #detailSheet .detail-v114-actions { grid-template-columns: 1fr !important; }
  #profileSheet .profile-v114-showroom-grid { grid-template-columns: 1fr 1fr !important; }
}

@media (prefers-reduced-motion: reduce) {
  #profileSheet .inside-card-v114,
  #directoryList .discovery-v114-card { transition: none !important; }
}
/* v114 specificity shield: final release overrides remain last in the cascade. */

/* v114 final action-grid shield: legacy Details selectors must not compress
   the lower action dock. The content column stays reserved for description
   and Vi AI, while every transactional control lives in the dock below. */
#detailSheet #detailBody .detail-v114-action-dock .detail-v114-actions {
  grid-template-columns: repeat(6, minmax(92px, 1fr)) !important;
}
@media (max-width: 1399px) {
  #detailSheet #detailBody .detail-v114-action-dock .detail-v114-actions {
    grid-template-columns: repeat(4, minmax(88px, 1fr)) !important;
  }
}
@media (max-width: 1099px) {
  #detailSheet #detailBody .detail-v114-action-dock .detail-v114-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 719px) {
  #detailSheet #detailBody .detail-v114-action-dock .detail-v114-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 360px) {
  #detailSheet #detailBody .detail-v114-action-dock .detail-v114-actions {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================================
   v115.0.0 · Mobile Explore two-up service grid + measured compact browser top
   ========================================================================== */
@media (max-width: 719px) {
  /* The measured header value is written by syncSmartShopOverlayGeometry().
     Keep only a hairline breathing space beneath it instead of a fixed empty
     strip, while retaining safe-area protection. */
  #phone > #directoryView.directory,
  #directoryView.directory {
    padding-top: calc(var(--vc-mobile-header-bottom, 136px) + 2px) !important;
    padding-right: 8px !important;
    padding-left: 8px !important;
  }
  #directoryView .inline-search {
    margin: 0 0 8px !important;
  }
  #directoryView .inline-search.with-icon input {
    min-height: 44px !important;
    border-radius: 18px !important;
  }
  #directoryList.discovery-v114-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin-top: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  #directoryList .discovery-v114-card {
    min-height: 234px !important;
    border-radius: 17px !important;
  }
  #directoryList .discovery-v114-visual {
    aspect-ratio: 16 / 9.3 !important;
  }
  #directoryList .discovery-v114-kind {
    top: 6px !important;
    right: 6px !important;
    max-width: calc(100% - 12px) !important;
    padding: 3px 5px !important;
    overflow: hidden !important;
    font-size: 6.3px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  #directoryList .discovery-v114-avatar {
    left: 8px !important;
    bottom: -16px !important;
    width: 43px !important;
    height: 43px !important;
    padding: 2px !important;
    border-radius: 14px !important;
  }
  #directoryList .discovery-v114-avatar > img {
    border-radius: 10px !important;
  }
  #directoryList .discovery-v114-copy {
    padding: 22px 8px 6px !important;
  }
  #directoryList .discovery-v114-copy > strong {
    font-size: 11.6px !important;
    line-height: 1.12 !important;
  }
  #directoryList .discovery-v114-copy > span {
    margin-top: 3px !important;
    font-size: 8.4px !important;
  }
  #directoryList .discovery-v114-copy > em {
    min-height: 24px !important;
    margin-top: 5px !important;
    font-size: 8.4px !important;
    line-height: 1.35 !important;
  }
  #directoryList .discovery-v114-copy .service-card-meta {
    gap: 4px !important;
    padding-top: 6px !important;
  }
  #directoryList .service-rank-pill,
  #directoryList .service-ai-pill {
    max-width: 100% !important;
    padding: 3px 5px !important;
    overflow: hidden !important;
    font-size: 7px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  #directoryList .discovery-v114-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    justify-content: stretch !important;
    gap: 5px !important;
    padding: 0 7px 7px !important;
  }
  #directoryList .discovery-v114-actions > button {
    width: 100% !important;
    min-width: 0 !important;
    height: 32px !important;
    min-height: 32px !important;
    border-radius: 11px !important;
  }
  #directoryList .discovery-v114-actions > button svg {
    width: 15px !important;
    height: 15px !important;
  }
}

@media (max-width: 374px) {
  #phone > #directoryView.directory,
  #directoryView.directory {
    padding-right: 6px !important;
    padding-left: 6px !important;
  }
  #directoryList.discovery-v114-grid { gap: 6px !important; }
  #directoryList .discovery-v114-card { min-height: 226px !important; }
  #directoryList .discovery-v114-copy > em { -webkit-line-clamp: 1 !important; min-height: 12px !important; }
}


/* ============================================================================
   v116.0.0 · Overlap-safe flyer studio, clearer showroom cards + calm motion
   ========================================================================== */

/* The v116 flyer markup owns one full-width studio grid. Older two-column rules
   on .flyer-body created an empty first lane and squeezed the actual controls. */
#flyerSheet .flyer-body {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-studio-v116 {
  display: grid !important;
  grid-template-columns: minmax(360px, 470px) minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 16px !important;
  width: 100% !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-intro-v116 {
  grid-column: 1 / -1 !important;
  margin: 0 !important;
  min-height: 78px !important;
  padding: 12px 14px !important;
  border-radius: 20px !important;
  background:
    linear-gradient(110deg, rgba(35,240,216,.12), rgba(255,255,255,.045) 46%, rgba(255,63,134,.07)) !important;
}
#flyerSheet .flyer-controls-v116 {
  grid-column: 1 !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-preview-panel-v116 {
  grid-column: 2 !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-preview-panel-v116 .flyer-canvas-shell {
  min-height: 520px !important;
  max-height: 72dvh !important;
  padding: 10px !important;
  overflow: auto !important;
}
#flyerSheet .flyer-picker-head-v116 {
  padding: 2px 1px 0 !important;
}
#flyerSheet .flyer-product-picker-v116 {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 9px !important;
  max-height: 410px !important;
  padding: 2px 4px 4px 1px !important;
}
#flyerSheet .flyer-pick-v116 {
  display: grid !important;
  grid-template-rows: 118px minmax(0, auto) !important;
  align-content: start !important;
  gap: 8px !important;
  min-height: 181px !important;
  padding: 7px !important;
  overflow: hidden !important;
}
#flyerSheet .flyer-pick-v116 > .flyer-pick-media {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 118px !important;
  min-height: 118px !important;
  overflow: hidden !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 50% 18%, rgba(35,240,216,.12), transparent 48%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(1,7,11,.78)) !important;
}
#flyerSheet .flyer-pick-v116 > .flyer-pick-media > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  padding: 3px !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 11px !important;
  background: transparent !important;
  box-sizing: border-box !important;
  filter: drop-shadow(0 8px 14px rgba(0,0,0,.26)) !important;
}
#flyerSheet .flyer-pick-v116 > .flyer-pick-copy {
  display: grid !important;
  grid-template-rows: minmax(28px, auto) 15px !important;
  align-content: start !important;
  gap: 4px !important;
  width: 100% !important;
  height: auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}
#flyerSheet .flyer-pick-v116 .flyer-pick-copy > b {
  display: -webkit-box !important;
  min-height: 28px !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: #f5fffd !important;
  font-size: 11.5px !important;
  line-height: 1.22 !important;
  overflow-wrap: anywhere !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}
#flyerSheet .flyer-pick-v116 .flyer-pick-copy > small {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: rgba(81,246,211,.88) !important;
  font-size: 9.5px !important;
  line-height: 15px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Showroom cards reserve a real copy lane. The blurred image fills the stage,
   while the foreground image remains complete and readable. */
#profileSheet .profile-v114-showroom-grid {
  grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)) !important;
  align-items: stretch !important;
}
#profileSheet .inside-card-v116 {
  display: grid !important;
  grid-template-rows: minmax(112px, 1fr) 66px !important;
  align-content: stretch !important;
  min-height: 194px !important;
  padding: 5px !important;
  overflow: hidden !important;
}
#profileSheet .inside-card-v116-media {
  position: relative !important;
  isolation: isolate !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 112px !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
  border-radius: 14px !important;
  background: linear-gradient(145deg, rgba(13,31,36,.96), rgba(2,7,11,.98)) !important;
}
#profileSheet .inside-card-v116-media > .inside-card-v116-backdrop {
  position: absolute !important;
  inset: -10px !important;
  z-index: 0 !important;
  display: block !important;
  width: calc(100% + 20px) !important;
  height: calc(100% + 20px) !important;
  padding: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 0 !important;
  opacity: .27 !important;
  filter: blur(13px) saturate(1.08) brightness(.68) !important;
  transform: scale(1.08) !important;
}
#profileSheet .inside-card-v116-media > .inside-card-v116-main {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  padding: 3px !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 12px !important;
  background: transparent !important;
  box-sizing: border-box !important;
  filter: drop-shadow(0 9px 14px rgba(0,0,0,.34)) !important;
}
#profileSheet .inside-card-v116-copy {
  display: grid !important;
  grid-template-rows: minmax(34px, 1fr) 20px !important;
  align-content: start !important;
  gap: 3px !important;
  min-width: 0 !important;
  min-height: 66px !important;
  padding: 7px 5px 3px !important;
  overflow: hidden !important;
}
#profileSheet .inside-card-v116-title {
  display: -webkit-box !important;
  min-width: 0 !important;
  min-height: 31px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: #f6fffd !important;
  font-size: 10.6px !important;
  font-weight: 1000 !important;
  line-height: 1.22 !important;
  overflow-wrap: anywhere !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}
#profileSheet .inside-card-v116 .inside-card-v114-meta {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 5px !important;
  min-width: 0 !important;
  height: 20px !important;
  padding: 0 !important;
  overflow: hidden !important;
}
#profileSheet .inside-card-v116 .show-price {
  max-width: 68% !important;
  font-size: 8.5px !important;
  line-height: 20px !important;
}
#profileSheet .inside-card-v116 time {
  max-width: 32% !important;
  overflow: hidden !important;
  font-size: 7.4px !important;
  line-height: 20px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Premium movement is deliberately limited to modal/cards and never rebuilds or
   moves the main feed. It disappears completely for reduced-motion users. */
@keyframes vcV116Reveal {
  from { opacity: 0; transform: translate3d(0, 10px, 0) scale(.988); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}
@keyframes vcV116SoftPulse {
  0%, 100% { box-shadow: 0 13px 30px rgba(35,240,216,.12); }
  50% { box-shadow: 0 16px 38px rgba(35,240,216,.23), 0 0 0 1px rgba(255,63,134,.08); }
}
@keyframes vcV116Sheen {
  from { transform: translateX(-145%) skewX(-18deg); }
  to { transform: translateX(245%) skewX(-18deg); }
}
#flyerSheet[open] .flyer-intro-v116,
#profileSheet[open] .profile-v114-showroom-first,
#detailSheet[open] .detail-v114-action-dock {
  animation: vcV116Reveal .34s cubic-bezier(.2,.75,.22,1) both !important;
}
#profileSheet[open] .inside-card-v116,
#flyerSheet[open] .flyer-pick-v116,
#directoryList .discovery-v114-card {
  animation: vcV116Reveal .30s cubic-bezier(.2,.75,.22,1) both !important;
}
#profileSheet[open] .inside-card-v116:nth-child(2),
#flyerSheet[open] .flyer-pick-v116:nth-child(2),
#directoryList .discovery-v114-card:nth-child(2) { animation-delay: 35ms !important; }
#profileSheet[open] .inside-card-v116:nth-child(3),
#flyerSheet[open] .flyer-pick-v116:nth-child(3),
#directoryList .discovery-v114-card:nth-child(3) { animation-delay: 65ms !important; }
#profileSheet[open] .inside-card-v116:nth-child(4),
#flyerSheet[open] .flyer-pick-v116:nth-child(4),
#directoryList .discovery-v114-card:nth-child(4) { animation-delay: 95ms !important; }
#flyerSheet .flyer-intro-v116 > span {
  animation: vcV116SoftPulse 3.4s ease-in-out infinite !important;
}
#profileSheet .inside-card-v116-media::after,
#flyerSheet .flyer-pick-v116 > .flyer-pick-media::after {
  content: '' !important;
  position: absolute !important;
  inset: -30% auto -30% -42% !important;
  z-index: 2 !important;
  width: 24% !important;
  pointer-events: none !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.20), transparent) !important;
  opacity: 0 !important;
}
@media (hover:hover) and (pointer:fine) {
  #profileSheet .inside-card-v116:hover .inside-card-v116-main,
  #flyerSheet .flyer-pick-v116:hover .flyer-pick-media > img {
    transform: scale(1.025) !important;
  }
  #profileSheet .inside-card-v116:hover .inside-card-v116-media::after,
  #flyerSheet .flyer-pick-v116:hover > .flyer-pick-media::after {
    opacity: .75 !important;
    animation: vcV116Sheen .72s ease-out both !important;
  }
  #profileSheet .inside-card-v116-main,
  #flyerSheet .flyer-pick-v116 .flyer-pick-media > img {
    transition: transform .28s ease !important;
  }
  .primary:not(:disabled), .soft:not(:disabled), .chip:not(:disabled) {
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease !important;
  }
  .primary:not(:disabled):hover, .soft:not(:disabled):hover, .chip:not(:disabled):hover {
    transform: translateY(-1px) !important;
  }
}

@media (min-width: 1100px) {
  #flyerSheet .flyer-preview-panel-v116 {
    position: sticky !important;
    top: 0 !important;
  }
}
@media (max-width: 1099px) {
  #flyerSheet .flyer-studio-v116 {
    grid-template-columns: 1fr !important;
  }
  #flyerSheet .flyer-intro-v116,
  #flyerSheet .flyer-controls-v116,
  #flyerSheet .flyer-preview-panel-v116 {
    grid-column: 1 !important;
  }
  #flyerSheet .flyer-preview-panel-v116 .flyer-canvas-shell {
    min-height: 360px !important;
    max-height: 65dvh !important;
  }
  #profileSheet .profile-v114-showroom-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 719px) {
  #flyerSheet .flyer-intro-v116 {
    grid-template-columns: 42px minmax(0,1fr) !important;
    min-height: 0 !important;
    padding: 10px !important;
  }
  #flyerSheet .flyer-intro-v116 > span {
    width: 42px !important;
    height: 42px !important;
    border-radius: 15px !important;
  }
  #flyerSheet .flyer-product-picker-v116 {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    max-height: 330px !important;
  }
  #flyerSheet .flyer-pick-v116 {
    grid-template-rows: 100px minmax(0, auto) !important;
    min-height: 163px !important;
  }
  #flyerSheet .flyer-pick-v116 > .flyer-pick-media {
    height: 100px !important;
    min-height: 100px !important;
  }
  #profileSheet .profile-v114-showroom-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #profileSheet .inside-card-v116 {
    grid-template-rows: minmax(102px, 1fr) 64px !important;
    min-height: 178px !important;
  }
  #profileSheet .inside-card-v116-media { min-height: 102px !important; }
  #profileSheet .inside-card-v116-copy { min-height: 64px !important; }
}
@media (max-width: 374px) {
  #flyerSheet .flyer-product-picker-v116 { gap: 6px !important; }
  #flyerSheet .flyer-pick-v116 { padding: 5px !important; }
  #profileSheet .profile-v114-showroom-grid { gap: 6px !important; }
  #profileSheet .inside-card-v116-title { font-size: 9.8px !important; }
}
@media (prefers-reduced-motion: reduce) {
  #flyerSheet[open] .flyer-intro-v116,
  #profileSheet[open] .profile-v114-showroom-first,
  #detailSheet[open] .detail-v114-action-dock,
  #profileSheet[open] .inside-card-v116,
  #flyerSheet[open] .flyer-pick-v116,
  #directoryList .discovery-v114-card,
  #flyerSheet .flyer-intro-v116 > span,
  #profileSheet .inside-card-v116-media::after,
  #flyerSheet .flyer-pick-v116 > .flyer-pick-media::after {
    animation: none !important;
    transition: none !important;
  }
}
/* v116 showroom grid reset: neutralize the legacy 58px list-card columns. */
#profileSheet .inside-card-v116 {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
  align-items: stretch !important;
}
/* v116 media sizing: use the card width, never an intrinsic image height. */
#profileSheet .inside-card-v116 {
  grid-template-rows: auto 66px !important;
}
#profileSheet .inside-card-v116-media {
  height: auto !important;
  min-height: 102px !important;
  aspect-ratio: 16 / 10 !important;
}
@media (max-width: 719px) {
  #profileSheet .inside-card-v116 { grid-template-rows: auto 64px !important; }
  #profileSheet .inside-card-v116-media { min-height: 94px !important; }
}

/* v116 final showroom copy-order shield: the legacy .show-item overlay and
   absolutely positioned title must never leak into the measured v116 card. */
#profileSheet .inside-card-v116::after {
  content: none !important;
  display: none !important;
}
#profileSheet .inside-card-v116-copy {
  position: relative !important;
  z-index: 3 !important;
  grid-template-rows: minmax(0, 1fr) 20px !important;
  align-content: stretch !important;
  gap: 2px !important;
  height: 100% !important;
  padding: 6px 5px 3px !important;
  box-sizing: border-box !important;
}
#profileSheet .inside-card-v116-title {
  position: static !important;
  inset: auto !important;
  z-index: auto !important;
  grid-row: 1 !important;
  align-self: start !important;
  width: auto !important;
  max-width: 100% !important;
  text-shadow: none !important;
}
#profileSheet .inside-card-v116 .inside-card-v114-meta {
  position: static !important;
  inset: auto !important;
  z-index: 1 !important;
  grid-row: 2 !important;
  align-self: end !important;
  width: 100% !important;
  margin: 0 !important;
}

/* ============================================================================
   v117.0.0 · Flexible professional flyer composer for shops and services
   ========================================================================== */

/* The composer is deliberately dense and measured. The intro spans the sheet,
   the editor owns the left lane, and the export preview owns the right lane. */
#flyerSheet .sheet-card.flyer-card {
  width: min(1460px, calc(100vw - 40px)) !important;
  max-width: min(1460px, calc(100vw - 40px)) !important;
}
#flyerSheet .flyer-body {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-studio-v117 {
  display: grid !important;
  grid-template-columns: minmax(540px, 600px) minmax(360px, 1fr) !important;
  align-items: start !important;
  gap: 16px !important;
  width: 100% !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-intro-v117 {
  grid-column: 1 / -1 !important;
  display: grid !important;
  grid-template-columns: 52px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 11px !important;
  min-width: 0 !important;
  min-height: 68px !important;
  margin: 0 !important;
  padding: 10px 13px !important;
  overflow: hidden !important;
  border: 1px solid rgba(35,240,216,.24) !important;
  border-radius: 19px !important;
  background:
    radial-gradient(circle at 91% 8%, rgba(255,63,134,.13), transparent 30%),
    linear-gradient(112deg, rgba(35,240,216,.13), rgba(7,19,25,.96) 54%, rgba(255,255,255,.04)) !important;
  box-shadow: 0 15px 38px rgba(0,0,0,.24) !important;
}
#flyerSheet .flyer-intro-v117 > span {
  display: grid !important;
  place-items: center !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  border-radius: 16px !important;
  color: #061116 !important;
  background: linear-gradient(145deg, #23f0d8, #ff3f86) !important;
  box-shadow: 0 10px 25px rgba(35,240,216,.16) !important;
}
#flyerSheet .flyer-intro-v117 > div {
  display: grid !important;
  align-content: center !important;
  gap: 2px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-intro-v117 b,
#flyerSheet .flyer-intro-v117 small,
#flyerSheet .flyer-intro-v117 em {
  display: block !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}
#flyerSheet .flyer-intro-v117 b {
  color: #f6fffd !important;
  font-size: 15px !important;
  line-height: 1.18 !important;
}
#flyerSheet .flyer-intro-v117 small {
  color: rgba(255,255,255,.72) !important;
  font-size: 11px !important;
  line-height: 1.30 !important;
}
#flyerSheet .flyer-intro-v117 em {
  color: rgba(81,246,211,.88) !important;
  font-size: 10px !important;
  font-style: normal !important;
  line-height: 1.30 !important;
}
#flyerSheet .flyer-controls-v117,
#flyerSheet .flyer-preview-panel-v117 {
  display: grid !important;
  gap: 11px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-controls-v117 { grid-column: 1 !important; }
#flyerSheet .flyer-preview-panel-v117 { grid-column: 2 !important; align-self: start !important; }

/* Global format controls */
#flyerSheet .flyer-control-row-v117 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-control-row-v117 > label,
#flyerSheet .flyer-field-stack > label,
#flyerSheet .flyer-field-stack .flyer-control-row > label {
  min-width: 0 !important;
}
#flyerSheet .flyer-control-row-v117 select,
#flyerSheet .flyer-field-stack input,
#flyerSheet .flyer-field-stack textarea {
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
#flyerSheet .flyer-image-scale-v117 {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
  padding: 9px 11px !important;
  border: 1px solid rgba(35,240,216,.17) !important;
  border-radius: 15px !important;
  background: linear-gradient(145deg, rgba(35,240,216,.07), rgba(255,255,255,.025)) !important;
}
#flyerSheet .flyer-image-scale-v117 > span {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 9px !important;
  height: auto !important;
  border-radius: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}
#flyerSheet .flyer-image-scale-v117 small { color: rgba(255,255,255,.68) !important; }
#flyerSheet .flyer-image-scale-v117 b { color: #51f6d3 !important; font-size: 11px !important; }
#flyerSheet .flyer-image-scale-v117 input[type="range"] {
  position: static !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  accent-color: #23f0d8 !important;
}

/* Product/service selection and manual ordering */
#flyerSheet .flyer-picker-head-v117 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 3px !important;
  min-width: 0 !important;
  padding: 3px 1px 0 !important;
}
#flyerSheet .flyer-picker-head-v117 > div {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-picker-head-v117 p {
  margin: 0 !important;
  color: rgba(255,255,255,.52) !important;
  font-size: 9.5px !important;
  line-height: 1.35 !important;
}
#flyerSheet .flyer-product-picker-v117 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 8px !important;
  max-height: 490px !important;
  min-width: 0 !important;
  padding: 2px 5px 6px 1px !important;
  overflow: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
}
#flyerSheet .flyer-pick-v117 {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto auto !important;
  align-content: start !important;
  gap: 7px !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 7px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 17px !important;
  background:
    radial-gradient(circle at 88% 8%, rgba(255,63,134,.08), transparent 31%),
    linear-gradient(150deg, rgba(10,27,32,.99), rgba(2,8,13,.995)) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.23) !important;
  box-sizing: border-box !important;
  cursor: grab !important;
}
#flyerSheet .flyer-pick-v117.active {
  border-color: rgba(35,240,216,.60) !important;
  background:
    radial-gradient(circle at 88% 8%, rgba(255,63,134,.10), transparent 31%),
    linear-gradient(150deg, rgba(11,34,38,.99), rgba(2,9,14,.995)) !important;
  box-shadow: 0 0 0 1px rgba(35,240,216,.12), 0 13px 30px rgba(0,0,0,.30) !important;
}
#flyerSheet .flyer-pick-v117.is-featured {
  border-color: rgba(255,63,134,.42) !important;
  background:
    radial-gradient(circle at 84% 10%, rgba(255,63,134,.15), transparent 36%),
    linear-gradient(145deg, rgba(14,38,41,.99), rgba(2,9,14,.995)) !important;
}
#flyerSheet .flyer-pick-v117.is-dragging {
  opacity: .56 !important;
  transform: scale(.985) !important;
  cursor: grabbing !important;
}
/* Neutralize broad legacy .flyer-pick descendant rules. */
#flyerSheet .flyer-pick-v117 span {
  height: auto !important;
  border-radius: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}
#flyerSheet .flyer-pick-select-v117 {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 105px minmax(0, 1fr) !important;
  align-items: stretch !important;
  gap: 8px !important;
  min-width: 0 !important;
  margin: 0 !important;
  cursor: pointer !important;
}
#flyerSheet .flyer-pick-select-v117 > input[type="checkbox"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
#flyerSheet .flyer-pick-v117 .flyer-pick-media {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 105px !important;
  height: 96px !important;
  min-width: 0 !important;
  overflow: hidden !important;
  border-radius: 13px !important;
  background:
    radial-gradient(circle at 50% 14%, rgba(35,240,216,.13), transparent 45%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(1,7,11,.82)) !important;
}
#flyerSheet .flyer-pick-v117 .flyer-pick-media > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  padding: 4px !important;
  object-fit: contain !important;
  object-position: center !important;
  box-sizing: border-box !important;
  border-radius: 11px !important;
  background: transparent !important;
  filter: drop-shadow(0 8px 14px rgba(0,0,0,.30)) !important;
}
#flyerSheet .flyer-order-badge {
  position: absolute !important;
  top: 6px !important;
  left: 6px !important;
  z-index: 3 !important;
  display: grid !important;
  place-items: center !important;
  min-width: 23px !important;
  height: 23px !important;
  padding: 0 6px !important;
  border-radius: 999px !important;
  color: #021014 !important;
  background: linear-gradient(135deg, #23f0d8, #51f6a9) !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 1000 !important;
  box-shadow: 0 5px 14px rgba(0,0,0,.24) !important;
}
#flyerSheet .flyer-drag-handle {
  position: absolute !important;
  right: 7px !important;
  top: 5px !important;
  z-index: 3 !important;
  color: rgba(255,255,255,.78) !important;
  font-size: 15px !important;
  font-style: normal !important;
  letter-spacing: -4px !important;
  text-shadow: 0 2px 6px rgba(0,0,0,.45) !important;
}
#flyerSheet .flyer-pick-v117 .flyer-pick-copy {
  display: grid !important;
  grid-template-rows: minmax(39px, auto) 18px !important;
  align-content: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  padding: 3px 1px !important;
  overflow: hidden !important;
  background: transparent !important;
}
#flyerSheet .flyer-pick-v117 .flyer-pick-copy > b {
  display: -webkit-box !important;
  min-width: 0 !important;
  min-height: 39px !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: #f6fffd !important;
  font-size: 11px !important;
  line-height: 1.18 !important;
  overflow-wrap: anywhere !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
}
#flyerSheet .flyer-pick-v117 .flyer-pick-copy > small {
  display: block !important;
  min-width: 0 !important;
  height: 18px !important;
  overflow: hidden !important;
  color: rgba(81,246,211,.86) !important;
  font-size: 9.2px !important;
  line-height: 18px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#flyerSheet .flyer-item-label-v117 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 4px !important;
  min-width: 0 !important;
  margin: 0 !important;
}
#flyerSheet .flyer-item-label-v117 > small {
  color: rgba(255,255,255,.52) !important;
  font-size: 8.2px !important;
  font-weight: 900 !important;
  letter-spacing: .05em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}
#flyerSheet .flyer-item-label-v117 > input {
  position: static !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 33px !important;
  margin: 0 !important;
  padding: 0 9px !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  border: 1px solid rgba(35,240,216,.18) !important;
  border-radius: 10px !important;
  color: #f7fffd !important;
  background: rgba(255,255,255,.045) !important;
  box-sizing: border-box !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  outline: none !important;
}
#flyerSheet .flyer-item-label-v117 > input:focus {
  border-color: rgba(35,240,216,.68) !important;
  box-shadow: 0 0 0 3px rgba(35,240,216,.10) !important;
}
#flyerSheet .flyer-item-tools-v117 {
  display: grid !important;
  grid-template-columns: 31px minmax(64px, 1fr) minmax(54px, .72fr) minmax(76px, .96fr) 31px !important;
  align-items: center !important;
  gap: 5px !important;
  min-width: 0 !important;
  padding-top: 7px !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
}
#flyerSheet .flyer-item-tools-v117 > select,
#flyerSheet .flyer-move-btn,
#flyerSheet .flyer-fit-cycle-v117,
#flyerSheet .flyer-feature-btn {
  position: static !important;
  min-width: 0 !important;
  height: 33px !important;
  margin: 0 !important;
  padding: 0 6px !important;
  overflow: hidden !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 9px !important;
  color: rgba(255,255,255,.88) !important;
  background: rgba(255,255,255,.055) !important;
  box-sizing: border-box !important;
  font-size: 8.6px !important;
  font-weight: 900 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#flyerSheet .flyer-item-tools-v117 > select { width: 100% !important; }
#flyerSheet .flyer-move-btn {
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  font-size: 15px !important;
}
#flyerSheet .flyer-fit-cycle-v117 {
  color: rgba(81,246,211,.93) !important;
  border-color: rgba(35,240,216,.17) !important;
  background: rgba(35,240,216,.065) !important;
}
#flyerSheet .flyer-feature-btn.active {
  border-color: rgba(255,63,134,.46) !important;
  color: #fff !important;
  background: linear-gradient(135deg, rgba(255,63,134,.24), rgba(35,240,216,.16)) !important;
}
#flyerSheet .flyer-item-zoom-v117 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 4px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 6px 8px 4px !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.025) !important;
}
#flyerSheet .flyer-item-zoom-v117 > span {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  height: auto !important;
  color: rgba(255,255,255,.52) !important;
  background: transparent !important;
  font-size: 8.2px !important;
  font-weight: 850 !important;
}
#flyerSheet .flyer-item-zoom-v117 > span b { color: #51f6d3 !important; font-size: 8.8px !important; }
#flyerSheet .flyer-item-zoom-v117 > input[type="range"] {
  position: static !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  accent-color: #23f0d8 !important;
}
#flyerSheet .flyer-note-v117 { margin: 0 !important; }

/* Preview uses all available space without stretching the export. */
#flyerSheet .flyer-preview-panel-v117 .flyer-canvas-shell {
  display: grid !important;
  place-items: start center !important;
  min-height: 520px !important;
  max-height: 76dvh !important;
  padding: 10px !important;
  overflow: auto !important;
  border: 1px solid rgba(35,240,216,.16) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(35,240,216,.08), transparent 34%),
    rgba(1,6,10,.92) !important;
  box-sizing: border-box !important;
}
#flyerSheet .flyer-preview-panel-v117 canvas {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 44px rgba(0,0,0,.42) !important;
}

/* Account entry for shops and standalone service providers. */
#meSheet .account-flyer-tool-v117 {
  position: relative !important;
  overflow: hidden !important;
  border-color: rgba(35,240,216,.42) !important;
  background: linear-gradient(115deg, rgba(35,240,216,.96), rgba(81,246,169,.93)) !important;
  color: #021014 !important;
}
#meSheet .account-flyer-tool-v117::after {
  content: '' !important;
  position: absolute !important;
  inset: -80% auto -80% -32% !important;
  width: 22% !important;
  pointer-events: none !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.65), transparent) !important;
  transform: rotate(12deg) !important;
  animation: vcV117ToolSheen 4.8s ease-in-out infinite !important;
}
#meSheet .account-flyer-tool-v117 b,
#meSheet .account-flyer-tool-v117 small { color: #021014 !important; }

@keyframes vcV117ToolSheen {
  0%, 68% { transform: translateX(-150%) rotate(12deg); opacity: 0; }
  73% { opacity: .72; }
  90%, 100% { transform: translateX(680%) rotate(12deg); opacity: 0; }
}
@keyframes vcV117PickerIn {
  from { opacity: 0; transform: translate3d(0, 8px, 0) scale(.99); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}
#flyerSheet[open] .flyer-pick-v117 { animation: vcV117PickerIn .28s cubic-bezier(.2,.75,.22,1) both !important; }
#flyerSheet[open] .flyer-pick-v117:nth-child(2) { animation-delay: 28ms !important; }
#flyerSheet[open] .flyer-pick-v117:nth-child(3) { animation-delay: 52ms !important; }
#flyerSheet[open] .flyer-pick-v117:nth-child(4) { animation-delay: 76ms !important; }

@media (min-width: 1100px) {
  #flyerSheet .flyer-preview-panel-v117 { position: sticky !important; top: 0 !important; }
}
@media (hover:hover) and (pointer:fine) {
  #flyerSheet .flyer-pick-v117,
  #flyerSheet .flyer-pick-v117 .flyer-pick-media > img {
    transition: transform .20s ease, border-color .20s ease, box-shadow .20s ease !important;
  }
  #flyerSheet .flyer-pick-v117:hover {
    border-color: rgba(35,240,216,.38) !important;
    transform: translateY(-1px) !important;
  }
  #flyerSheet .flyer-pick-v117:hover .flyer-pick-media > img { transform: scale(1.025) !important; }
}
@media (max-width: 1199px) and (min-width: 960px) {
  #flyerSheet .flyer-studio-v117 {
    grid-template-columns: minmax(470px, 540px) minmax(320px, 1fr) !important;
  }
  #flyerSheet .flyer-control-row-v117 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #flyerSheet .flyer-product-picker-v117 { grid-template-columns: 1fr !important; max-height: 500px !important; }
}
@media (max-width: 959px) {
  #flyerSheet .sheet-card.flyer-card {
    width: min(920px, calc(100vw - 24px)) !important;
    max-width: min(920px, calc(100vw - 24px)) !important;
  }
  #flyerSheet .flyer-studio-v117 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-intro-v117,
  #flyerSheet .flyer-controls-v117,
  #flyerSheet .flyer-preview-panel-v117 { grid-column: 1 !important; }
  #flyerSheet .flyer-preview-panel-v117 { position: static !important; }
  #flyerSheet .flyer-preview-panel-v117 .flyer-canvas-shell { min-height: 380px !important; max-height: 66dvh !important; }
}
@media (max-width: 719px) {
  #flyerSheet .sheet-card.flyer-card {
    width: 100vw !important;
    max-width: 100vw !important;
  }
  #flyerSheet .flyer-studio-v117 { gap: 11px !important; }
  #flyerSheet .flyer-intro-v117 {
    grid-template-columns: 43px minmax(0, 1fr) !important;
    min-height: 0 !important;
    padding: 9px 10px !important;
    border-radius: 16px !important;
  }
  #flyerSheet .flyer-intro-v117 > span { width: 41px !important; height: 41px !important; min-width: 41px !important; border-radius: 14px !important; }
  #flyerSheet .flyer-intro-v117 b { font-size: 13px !important; }
  #flyerSheet .flyer-intro-v117 small { font-size: 10px !important; }
  #flyerSheet .flyer-intro-v117 em { font-size: 9px !important; }
  #flyerSheet .flyer-control-row-v117 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 7px !important; }
  #flyerSheet .flyer-product-picker-v117 { grid-template-columns: 1fr !important; max-height: 455px !important; }
  #flyerSheet .flyer-pick-select-v117 { grid-template-columns: 100px minmax(0, 1fr) !important; }
  #flyerSheet .flyer-pick-v117 .flyer-pick-media { width: 100px !important; height: 92px !important; }
  #flyerSheet .flyer-item-tools-v117 {
    grid-template-columns: 30px minmax(58px, 1fr) minmax(50px, .70fr) minmax(70px, .94fr) 30px !important;
    gap: 4px !important;
  }
  #flyerSheet .flyer-item-tools-v117 > select,
  #flyerSheet .flyer-fit-cycle-v117,
  #flyerSheet .flyer-feature-btn { padding-inline: 4px !important; font-size: 8px !important; }
  #flyerSheet .flyer-preview-panel-v117 .flyer-canvas-shell { min-height: 310px !important; padding: 7px !important; }
}
@media (max-width: 389px) {
  #flyerSheet .flyer-control-row-v117 { grid-template-columns: 1fr !important; }
  #flyerSheet .flyer-pick-select-v117 { grid-template-columns: 88px minmax(0, 1fr) !important; gap: 7px !important; }
  #flyerSheet .flyer-pick-v117 .flyer-pick-media { width: 88px !important; height: 88px !important; }
  #flyerSheet .flyer-item-tools-v117 {
    grid-template-columns: 29px minmax(54px, 1fr) minmax(47px, .68fr) minmax(66px, .90fr) 29px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  #flyerSheet[open] .flyer-pick-v117,
  #meSheet .account-flyer-tool-v117::after,
  #flyerSheet .flyer-pick-v117,
  #flyerSheet .flyer-pick-v117 .flyer-pick-media > img {
    animation: none !important;
    transition: none !important;
  }
}

/* v117 narrow-card control shield: all five per-photo tools remain inside the
   picker card on compact desktop and mobile widths. */
#flyerSheet .flyer-item-tools-v117 {
  grid-template-columns: 28px minmax(0, 1.05fr) minmax(0, .82fr) minmax(0, 1.05fr) 28px !important;
  gap: 3px !important;
}
#flyerSheet .flyer-item-tools-v117 > select,
#flyerSheet .flyer-item-tools-v117 > button {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
@media (max-width: 619px) {
  #flyerSheet .flyer-item-tools-v117 {
    grid-template-columns: 28px minmax(0, 1fr) minmax(0, .78fr) minmax(0, 1fr) 28px !important;
    gap: 3px !important;
  }
}
@media (max-width: 374px) {
  #flyerSheet .flyer-item-tools-v117 {
    grid-template-columns: 27px minmax(0, 1fr) minmax(0, .72fr) minmax(0, .94fr) 27px !important;
  }
}

/* ============================================================================
   v118.0.0 · Full-screen smart Flyer Studio
   Large live canvas, modern theme gallery, custom brand controls, touch-safe
   drag ordering and responsive Design / Preview workspaces.
   ========================================================================== */

#flyerSheet[open] {
  padding: 14px !important;
  place-items: center !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 14% 8%, rgba(35,240,216,.09), transparent 34%),
    radial-gradient(circle at 88% 15%, rgba(255,63,134,.08), transparent 30%),
    rgba(0,3,6,.82) !important;
  backdrop-filter: blur(16px) saturate(1.08) !important;
}
#flyerSheet .sheet-card.flyer-card {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  flex-direction: column !important;
  width: min(1880px, calc(100vw - 28px)) !important;
  max-width: min(1880px, calc(100vw - 28px)) !important;
  height: min(1040px, calc(100dvh - 28px)) !important;
  max-height: min(1040px, calc(100dvh - 28px)) !important;
  min-height: min(720px, calc(100dvh - 28px)) !important;
  margin: 0 auto !important;
  padding: 10px 12px 12px !important;
  overflow: hidden !important;
  border: 1px solid rgba(35,240,216,.22) !important;
  border-radius: 28px !important;
  background:
    radial-gradient(circle at 2% 0%, rgba(35,240,216,.08), transparent 26%),
    radial-gradient(circle at 99% 0%, rgba(255,63,134,.07), transparent 24%),
    linear-gradient(145deg, rgba(2,9,13,.995), rgba(1,5,9,.995)) !important;
  box-shadow: 0 40px 140px rgba(0,0,0,.78), 0 0 0 1px rgba(255,255,255,.035) inset !important;
  box-sizing: border-box !important;
}
#flyerSheet .sheet-card.flyer-card > .sheet-bar {
  flex: 0 0 auto !important;
  width: 54px !important;
  height: 4px !important;
  margin: 0 auto 3px !important;
  opacity: .66 !important;
}
#flyerSheet .sheet-card.flyer-card > .sheet-title {
  position: relative !important;
  top: auto !important;
  z-index: 30 !important;
  flex: 0 0 auto !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 6px 62px 7px 8px !important;
  border-bottom: 1px solid rgba(255,255,255,.065) !important;
  background: transparent !important;
  backdrop-filter: none !important;
}
#flyerSheet .sheet-card.flyer-card > .sheet-title small {
  margin: 0 0 2px !important;
  font-size: 10px !important;
  line-height: 1 !important;
  letter-spacing: .15em !important;
}
#flyerSheet .sheet-card.flyer-card > .sheet-title h3 {
  margin: 0 !important;
  color: #f5fffd !important;
  font-size: clamp(17px, 1.18vw, 23px) !important;
  line-height: 1.05 !important;
  letter-spacing: -.025em !important;
}
#flyerSheet .sheet-card.flyer-card > .sheet-title .xbtn {
  position: absolute !important;
  top: 4px !important;
  right: 6px !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 15px !important;
  background: rgba(255,255,255,.085) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
}
#flyerSheet .flyer-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  overflow: hidden !important;
  padding: 10px 0 0 !important;
}
#flyerSheet .flyer-studio-v118 {
  display: grid !important;
  grid-template-columns: minmax(560px, .92fr) minmax(560px, 1.18fr) !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  grid-template-areas:
    "intro command"
    "controls preview" !important;
  align-items: stretch !important;
  gap: 10px 12px !important;
  height: 100% !important;
  min-height: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
}
#flyerSheet .flyer-intro-v118 {
  grid-area: intro !important;
  grid-column: auto !important;
  min-height: 58px !important;
  padding: 8px 11px !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 93% 2%, rgba(255,63,134,.13), transparent 30%),
    linear-gradient(112deg, rgba(35,240,216,.13), rgba(7,19,25,.96) 54%, rgba(255,255,255,.035)) !important;
}
#flyerSheet .flyer-intro-v118 > span {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  border-radius: 14px !important;
}
#flyerSheet .flyer-intro-v118 b { font-size: 14px !important; }
#flyerSheet .flyer-intro-v118 small { font-size: 10px !important; }
#flyerSheet .flyer-intro-v118 em { font-size: 9px !important; }
#flyerSheet .flyer-command-bar-v118 {
  grid-area: command !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-width: 0 !important;
  min-height: 58px !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.055), rgba(35,240,216,.035)) !important;
}
#flyerSheet .flyer-command-bar-v118 > div {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-command-bar-v118 button {
  min-height: 39px !important;
  padding: 0 13px !important;
  border-radius: 13px !important;
  white-space: nowrap !important;
}
#flyerSheet .flyer-auto-design-v118 {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  color: #021014 !important;
  background: linear-gradient(128deg, #23f0d8, #51f6a9 58%, #ffd166) !important;
  box-shadow: 0 10px 28px rgba(35,240,216,.16) !important;
}
#flyerSheet .flyer-auto-design-v118 svg { width: 17px !important; height: 17px !important; }
#flyerSheet .flyer-command-bar-v118 > small {
  min-width: 0 !important;
  max-width: 330px !important;
  color: rgba(255,255,255,.52) !important;
  font-size: 9.5px !important;
  line-height: 1.3 !important;
  text-align: right !important;
}
#flyerSheet .flyer-mobile-tabs-v118 { display: none !important; }

#flyerSheet .flyer-controls-v118 {
  grid-area: controls !important;
  grid-column: auto !important;
  align-content: start !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 10px 11px 16px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 20px !important;
  background: linear-gradient(155deg, rgba(8,20,25,.94), rgba(2,8,12,.98)) !important;
}
#flyerSheet .flyer-controls-v118::-webkit-scrollbar,
#flyerSheet .flyer-preview-panel-v118 .flyer-canvas-shell::-webkit-scrollbar,
#flyerSheet .flyer-theme-strip-v118::-webkit-scrollbar { width: 7px !important; height: 7px !important; }
#flyerSheet .flyer-controls-v118::-webkit-scrollbar-thumb,
#flyerSheet .flyer-preview-panel-v118 .flyer-canvas-shell::-webkit-scrollbar-thumb,
#flyerSheet .flyer-theme-strip-v118::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(35,240,216,.46), rgba(255,63,134,.34)) !important;
}
#flyerSheet .flyer-theme-gallery-v118 {
  display: grid !important;
  grid-template-columns: minmax(150px, .34fr) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 9px !important;
  min-width: 0 !important;
  padding: 9px !important;
  border: 1px solid rgba(35,240,216,.13) !important;
  border-radius: 16px !important;
  background: rgba(35,240,216,.035) !important;
}
#flyerSheet .flyer-theme-gallery-v118 > div:first-child {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-theme-gallery-v118 b {
  color: #f4fffd !important;
  font-size: 11px !important;
}
#flyerSheet .flyer-theme-gallery-v118 small {
  color: rgba(255,255,255,.48) !important;
  font-size: 8.5px !important;
  line-height: 1.3 !important;
}
#flyerSheet .flyer-theme-strip-v118 {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(84px, 98px) !important;
  gap: 6px !important;
  min-width: 0 !important;
  padding: 1px 2px 4px !important;
  overflow-x: auto !important;
  overscroll-behavior-inline: contain !important;
  scroll-snap-type: x proximity !important;
}
#flyerSheet .flyer-theme-chip-v118 {
  display: grid !important;
  grid-template-columns: 29px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  height: 40px !important;
  padding: 5px 7px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 12px !important;
  color: rgba(255,255,255,.78) !important;
  background: rgba(255,255,255,.045) !important;
  scroll-snap-align: start !important;
  box-sizing: border-box !important;
}
#flyerSheet .flyer-theme-chip-v118 > i {
  position: relative !important;
  display: block !important;
  width: 29px !important;
  height: 29px !important;
  overflow: hidden !important;
  border-radius: 9px !important;
  background: linear-gradient(135deg, var(--c1), var(--c2) 58%, var(--c3)) !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.14) inset !important;
}
#flyerSheet .flyer-theme-chip-v118 > i::after {
  content: '' !important;
  position: absolute !important;
  inset: 7px -6px -8px 10px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.46) !important;
  filter: blur(4px) !important;
}
#flyerSheet .flyer-theme-chip-v118 > span {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: inherit !important;
  font-size: 8.3px !important;
  font-weight: 900 !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#flyerSheet .flyer-theme-chip-v118.active {
  border-color: rgba(35,240,216,.62) !important;
  color: #f6fffd !important;
  background: linear-gradient(135deg, rgba(35,240,216,.13), rgba(255,63,134,.08)) !important;
  box-shadow: 0 0 0 1px rgba(35,240,216,.10), 0 9px 22px rgba(0,0,0,.22) !important;
}
#flyerSheet .flyer-slider-grid-v118 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 7px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-custom-panel-v118 {
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.028) !important;
}
#flyerSheet .flyer-custom-panel-v118 > summary {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 42px !important;
  padding: 0 12px !important;
  cursor: pointer !important;
  color: rgba(255,255,255,.88) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  list-style: none !important;
}
#flyerSheet .flyer-custom-panel-v118 > summary::-webkit-details-marker { display: none !important; }
#flyerSheet .flyer-custom-panel-v118 > summary::after {
  content: '+' !important;
  margin-left: auto !important;
  color: #51f6d3 !important;
  font-size: 18px !important;
  font-weight: 500 !important;
}
#flyerSheet .flyer-custom-panel-v118[open] > summary::after { content: '−' !important; }
#flyerSheet .flyer-custom-grid-v118 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 7px !important;
  padding: 0 10px 9px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-custom-grid-v118 > label {
  display: grid !important;
  align-content: start !important;
  gap: 5px !important;
  min-width: 0 !important;
  padding: 8px !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 12px !important;
  background: rgba(0,0,0,.16) !important;
}
#flyerSheet .flyer-custom-grid-v118 small { font-size: 8.4px !important; color: rgba(255,255,255,.54) !important; }
#flyerSheet .flyer-custom-grid-v118 select,
#flyerSheet .flyer-custom-grid-v118 input[type="color"] {
  width: 100% !important;
  min-width: 0 !important;
  height: 35px !important;
  margin: 0 !important;
  border-radius: 9px !important;
}
#flyerSheet .flyer-custom-grid-v118 input[type="color"] {
  padding: 3px !important;
  cursor: pointer !important;
}
#flyerSheet .flyer-radius-control-v118 { grid-column: span 3 !important; }
#flyerSheet .flyer-radius-control-v118 > span {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}
#flyerSheet .flyer-radius-control-v118 input[type="range"] { width: 100% !important; accent-color: #23f0d8 !important; }
#flyerSheet .flyer-toggle-grid-v118 {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 6px !important;
  padding: 0 10px 10px !important;
}
#flyerSheet .flyer-toggle-grid-v118 > label,
#flyerSheet .flyer-item-flags-v118 > label {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  min-height: 35px !important;
  padding: 5px 7px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.035) !important;
  color: rgba(255,255,255,.72) !important;
  font-size: 8.2px !important;
  font-weight: 850 !important;
  text-align: center !important;
}
#flyerSheet .flyer-toggle-grid-v118 input,
#flyerSheet .flyer-item-flags-v118 input { accent-color: #23f0d8 !important; }
#flyerSheet .flyer-creative-brief-v118 {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
  padding: 9px 10px !important;
  border: 1px solid rgba(255,63,134,.13) !important;
  border-radius: 15px !important;
  background: linear-gradient(135deg, rgba(255,63,134,.045), rgba(35,240,216,.025)) !important;
}
#flyerSheet .flyer-creative-brief-v118 > small { color: rgba(255,255,255,.58) !important; font-size: 8.7px !important; }
#flyerSheet .flyer-creative-brief-v118 textarea {
  width: 100% !important;
  min-height: 58px !important;
  max-height: 110px !important;
  resize: vertical !important;
  box-sizing: border-box !important;
}

#flyerSheet .flyer-product-picker-v117 {
  max-height: none !important;
  overflow: visible !important;
  padding-right: 1px !important;
  scrollbar-gutter: auto !important;
}
#flyerSheet .flyer-pick-v118 {
  grid-template-rows: auto auto auto auto auto !important;
  overflow: visible !important;
  content-visibility: auto !important;
  contain-intrinsic-size: 310px !important;
}
#flyerSheet .flyer-pick-v118.is-touch-dragging {
  z-index: 80 !important;
  opacity: .92 !important;
  transform: scale(.985) rotate(.15deg) !important;
  box-shadow: 0 24px 64px rgba(0,0,0,.52), 0 0 0 2px rgba(35,240,216,.42) !important;
}
#flyerSheet .flyer-item-advanced-v118 {
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 11px !important;
  background: rgba(255,255,255,.025) !important;
}
#flyerSheet .flyer-item-advanced-v118 > summary {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 34px !important;
  padding: 0 9px !important;
  list-style: none !important;
  cursor: pointer !important;
}
#flyerSheet .flyer-item-advanced-v118 > summary::-webkit-details-marker { display: none !important; }
#flyerSheet .flyer-item-advanced-v118 > summary span {
  color: rgba(255,255,255,.76) !important;
  font-size: 8.6px !important;
  font-weight: 900 !important;
}
#flyerSheet .flyer-item-advanced-v118 > summary small {
  margin-left: auto !important;
  color: rgba(81,246,211,.66) !important;
  font-size: 7.7px !important;
}
#flyerSheet .flyer-item-advanced-v118 > summary::after { content: '+' !important; color: #51f6d3 !important; }
#flyerSheet .flyer-item-advanced-v118[open] > summary::after { content: '−' !important; }
#flyerSheet .flyer-item-focal-grid-v118 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
  padding: 2px 8px 7px !important;
}
#flyerSheet .flyer-item-focal-grid-v118 label {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-item-focal-grid-v118 label > span {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 5px !important;
  color: rgba(255,255,255,.46) !important;
  font-size: 7.5px !important;
}
#flyerSheet .flyer-item-focal-grid-v118 label > span b { color: #51f6d3 !important; font-size: 7.7px !important; }
#flyerSheet .flyer-item-focal-grid-v118 input[type="range"] { width: 100% !important; accent-color: #23f0d8 !important; }
#flyerSheet .flyer-item-flags-v118 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 5px !important;
  padding: 0 8px 8px !important;
}
#flyerSheet .flyer-item-flags-v118 > label { min-height: 30px !important; font-size: 7.8px !important; }

#flyerSheet .flyer-preview-panel-v118 {
  grid-area: preview !important;
  grid-column: auto !important;
  position: relative !important;
  top: auto !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto auto auto !important;
  align-content: stretch !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 9px !important;
  overflow: hidden !important;
  border: 1px solid rgba(35,240,216,.12) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(35,240,216,.07), transparent 31%),
    linear-gradient(150deg, rgba(4,14,19,.98), rgba(1,6,10,.99)) !important;
}
#flyerSheet .flyer-preview-toolbar-v118 {
  display: grid !important;
  grid-template-columns: minmax(120px, 1fr) minmax(210px, .78fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  min-height: 43px !important;
  padding: 0 2px 7px !important;
}
#flyerSheet .flyer-preview-toolbar-v118 > div {
  display: grid !important;
  gap: 1px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-preview-toolbar-v118 > div b { font-size: 11px !important; color: #f4fffd !important; }
#flyerSheet .flyer-preview-toolbar-v118 > div small { font-size: 8px !important; color: rgba(81,246,211,.68) !important; }
#flyerSheet .flyer-preview-toolbar-v118 > label {
  display: grid !important;
  grid-template-columns: auto minmax(80px, 1fr) 42px !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  color: rgba(255,255,255,.52) !important;
  font-size: 8px !important;
}
#flyerSheet .flyer-preview-toolbar-v118 input[type="range"] { width: 100% !important; min-width: 0 !important; accent-color: #23f0d8 !important; }
#flyerSheet .flyer-preview-toolbar-v118 > label b { color: #51f6d3 !important; font-size: 8.5px !important; text-align: right !important; }
#flyerSheet .flyer-preview-toolbar-v118 > button { min-height: 35px !important; padding: 0 11px !important; border-radius: 11px !important; font-size: 8.7px !important; }
#flyerSheet .flyer-preview-panel-v118 .flyer-canvas-shell {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  min-height: 0 !important;
  height: 100% !important;
  max-height: none !important;
  padding: 13px !important;
  overflow: auto !important;
  border-radius: 16px !important;
  background:
    linear-gradient(45deg, rgba(255,255,255,.025) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.025) 75%),
    linear-gradient(45deg, rgba(255,255,255,.025) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.025) 75%),
    radial-gradient(circle at 50% 5%, rgba(35,240,216,.075), transparent 34%),
    #010509 !important;
  background-position: 0 0, 10px 10px, 0 0, 0 0 !important;
  background-size: 20px 20px, 20px 20px, auto, auto !important;
  box-sizing: border-box !important;
}
#flyerSheet .flyer-canvas-stage-v118 {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: max-content !important;
  min-width: min(100%, 280px) !important;
  min-height: 100% !important;
}
#flyerSheet .flyer-preview-panel-v118 canvas {
  display: block !important;
  max-width: none !important;
  max-height: none !important;
  width: auto;
  height: auto;
  border-radius: 16px !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.58), 0 0 0 1px rgba(255,255,255,.08) !important;
  transition: width .18s ease, height .18s ease, opacity .18s ease !important;
}
#flyerSheet .flyer-preview-loader-v118 {
  position: absolute !important;
  inset: 0 !important;
  z-index: 6 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  border-radius: 16px !important;
  background: rgba(1,7,11,.76) !important;
  backdrop-filter: blur(8px) !important;
}
#flyerSheet .flyer-preview-loader-v118[hidden] { display: none !important; }
#flyerSheet .flyer-preview-loader-v118 i {
  width: 9px !important;
  height: 9px !important;
  border-radius: 999px !important;
  background: #23f0d8 !important;
  animation: vcV118PreviewDot 1s ease-in-out infinite alternate !important;
}
#flyerSheet .flyer-preview-loader-v118 i:nth-child(2) { background: #ff3f86 !important; animation-delay: .16s !important; }
#flyerSheet .flyer-preview-loader-v118 span { color: rgba(255,255,255,.70) !important; font-size: 9px !important; }
#flyerSheet .flyer-export-progress { margin: 7px 0 0 !important; }
#flyerSheet .flyer-export-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 7px !important;
  padding-top: 7px !important;
}
#flyerSheet .flyer-export-actions button { min-height: 40px !important; border-radius: 13px !important; }
#flyerSheet .flyer-caption-box {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: end !important;
  gap: 7px !important;
  min-width: 0 !important;
  padding-top: 7px !important;
}
#flyerSheet .flyer-caption-box > small { grid-column: 1 / -1 !important; }
#flyerSheet .flyer-caption-box textarea { min-height: 50px !important; max-height: 78px !important; resize: vertical !important; }
#flyerSheet .flyer-caption-box button { min-height: 40px !important; border-radius: 12px !important; }
#flyerSheet .flyer-studio-v118.is-preview-focus-v118 {
  grid-template-columns: 0 minmax(0, 1fr) !important;
}
#flyerSheet .flyer-studio-v118.is-preview-focus-v118 .flyer-intro-v118,
#flyerSheet .flyer-studio-v118.is-preview-focus-v118 .flyer-controls-v118 {
  visibility: hidden !important;
  pointer-events: none !important;
  overflow: hidden !important;
  opacity: 0 !important;
}
#flyerSheet .flyer-studio-v118.is-preview-focus-v118 .flyer-command-bar-v118 {
  grid-column: 1 / -1 !important;
  justify-content: flex-end !important;
}

html.flyer-touch-sorting-v118,
html.flyer-touch-sorting-v118 body { overflow: hidden !important; touch-action: none !important; }

@keyframes vcV118PreviewDot {
  from { transform: translateY(2px) scale(.78); opacity: .48; }
  to { transform: translateY(-2px) scale(1.08); opacity: 1; }
}
@keyframes vcV118StudioIn {
  from { opacity: 0; transform: translate3d(0, 5px, 0) scale(.997); }
  to { opacity: 1; transform: none; }
}
#flyerSheet[open] .flyer-studio-v118 { animation: vcV118StudioIn .22s cubic-bezier(.2,.78,.24,1) both !important; }

@media (hover:hover) and (pointer:fine) {
  #flyerSheet .flyer-theme-chip-v118,
  #flyerSheet .flyer-command-bar-v118 button,
  #flyerSheet .flyer-preview-toolbar-v118 button,
  #flyerSheet .flyer-toggle-grid-v118 label {
    transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease !important;
  }
  #flyerSheet .flyer-theme-chip-v118:hover,
  #flyerSheet .flyer-command-bar-v118 button:hover,
  #flyerSheet .flyer-preview-toolbar-v118 button:hover { transform: translateY(-1px) !important; }
}

@media (max-width: 1399px) and (min-width: 1100px) {
  #flyerSheet .flyer-studio-v118 {
    grid-template-columns: minmax(505px, .94fr) minmax(480px, 1.06fr) !important;
  }
  #flyerSheet .flyer-theme-gallery-v118 { grid-template-columns: 135px minmax(0, 1fr) !important; }
  #flyerSheet .flyer-slider-grid-v118 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  #flyerSheet .flyer-custom-grid-v118 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #flyerSheet .flyer-radius-control-v118 { grid-column: span 2 !important; }
  #flyerSheet .flyer-toggle-grid-v118 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media (max-width: 1099px) {
  #flyerSheet[open] { padding: 0 !important; align-items: stretch !important; }
  #flyerSheet .sheet-card.flyer-card {
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 100dvh !important;
    padding: 6px 8px calc(8px + env(safe-area-inset-bottom)) !important;
    border-radius: 0 !important;
    border-inline: 0 !important;
  }
  #flyerSheet .sheet-card.flyer-card > .sheet-title { min-height: 43px !important; padding-block: 4px 6px !important; }
  #flyerSheet .flyer-body { padding-top: 7px !important; }
  #flyerSheet .flyer-studio-v118 {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto minmax(0, 1fr) !important;
    grid-template-areas:
      "intro"
      "command"
      "tabs"
      "workspace" !important;
    gap: 7px !important;
  }
  #flyerSheet .flyer-intro-v118 { grid-area: intro !important; }
  #flyerSheet .flyer-command-bar-v118 { grid-area: command !important; min-height: 50px !important; }
  #flyerSheet .flyer-command-bar-v118 > small { display: none !important; }
  #flyerSheet .flyer-mobile-tabs-v118 {
    grid-area: tabs !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 5px !important;
    min-height: 42px !important;
    padding: 4px !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 14px !important;
    background: rgba(255,255,255,.035) !important;
  }
  #flyerSheet .flyer-mobile-tabs-v118 button {
    min-height: 34px !important;
    border: 0 !important;
    border-radius: 10px !important;
    color: rgba(255,255,255,.58) !important;
    background: transparent !important;
    font-size: 10px !important;
    font-weight: 950 !important;
  }
  #flyerSheet .flyer-mobile-tabs-v118 button.active {
    color: #021014 !important;
    background: linear-gradient(130deg, #23f0d8, #51f6a9) !important;
    box-shadow: 0 7px 18px rgba(35,240,216,.13) !important;
  }
  #flyerSheet .flyer-controls-v118,
  #flyerSheet .flyer-preview-panel-v118 {
    grid-area: workspace !important;
    grid-column: 1 !important;
    min-height: 0 !important;
    height: 100% !important;
  }
  #flyerSheet .flyer-studio-v118[data-mobile-panel="design"] .flyer-preview-panel-v118,
  #flyerSheet .flyer-studio-v118[data-mobile-panel="preview"] .flyer-controls-v118 { display: none !important; }
  #flyerSheet .flyer-studio-v118[data-mobile-panel="design"] .flyer-controls-v118,
  #flyerSheet .flyer-studio-v118[data-mobile-panel="preview"] .flyer-preview-panel-v118 { display: grid !important; }
  #flyerSheet .flyer-preview-panel-v118 .flyer-canvas-shell { min-height: 0 !important; max-height: none !important; }
  #flyerSheet .flyer-product-picker-v117 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #flyerSheet .flyer-theme-gallery-v118 { grid-template-columns: minmax(130px, .3fr) minmax(0, 1fr) !important; }
  #flyerSheet .flyer-studio-v118.is-preview-focus-v118 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-studio-v118.is-preview-focus-v118 .flyer-intro-v118,
  #flyerSheet .flyer-studio-v118.is-preview-focus-v118 .flyer-controls-v118 { visibility: visible !important; opacity: 1 !important; }
}

@media (max-width: 719px) {
  #flyerSheet .sheet-card.flyer-card { padding-inline: 6px !important; }
  #flyerSheet .sheet-card.flyer-card > .sheet-title h3 { font-size: 16px !important; }
  #flyerSheet .flyer-intro-v118 {
    grid-template-columns: 37px minmax(0, 1fr) !important;
    min-height: 48px !important;
    padding: 6px 8px !important;
    border-radius: 14px !important;
  }
  #flyerSheet .flyer-intro-v118 > span { width: 35px !important; height: 35px !important; min-width: 35px !important; border-radius: 11px !important; }
  #flyerSheet .flyer-intro-v118 b { font-size: 12px !important; }
  #flyerSheet .flyer-intro-v118 small { font-size: 8.8px !important; -webkit-line-clamp: 1 !important; display: -webkit-box !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }
  #flyerSheet .flyer-intro-v118 em { display: none !important; }
  #flyerSheet .flyer-command-bar-v118 { padding: 5px !important; min-height: 45px !important; }
  #flyerSheet .flyer-command-bar-v118 > div { display: grid !important; grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(0, .8fr)) !important; width: 100% !important; gap: 5px !important; }
  #flyerSheet .flyer-command-bar-v118 button { min-height: 35px !important; padding: 0 7px !important; font-size: 8.2px !important; border-radius: 10px !important; }
  #flyerSheet .flyer-auto-design-v118 svg { width: 14px !important; height: 14px !important; }
  #flyerSheet .flyer-controls-v118 { padding: 7px 7px 14px !important; border-radius: 16px !important; }
  #flyerSheet .flyer-theme-gallery-v118 { grid-template-columns: minmax(0, 1fr) !important; gap: 5px !important; padding: 7px !important; }
  #flyerSheet .flyer-theme-gallery-v118 > div:first-child small { display: none !important; }
  #flyerSheet .flyer-theme-strip-v118 { grid-auto-columns: 87px !important; }
  #flyerSheet .flyer-control-row-v117 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #flyerSheet .flyer-slider-grid-v118 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-custom-grid-v118 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #flyerSheet .flyer-radius-control-v118 { grid-column: span 2 !important; }
  #flyerSheet .flyer-toggle-grid-v118 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #flyerSheet .flyer-product-picker-v117 { grid-template-columns: minmax(0, 1fr) !important; gap: 7px !important; }
  #flyerSheet .flyer-pick-select-v117 { grid-template-columns: 92px minmax(0, 1fr) !important; }
  #flyerSheet .flyer-pick-v117 .flyer-pick-media { width: 92px !important; height: 88px !important; }
  #flyerSheet .flyer-item-focal-grid-v118 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-preview-panel-v118 { padding: 6px !important; border-radius: 16px !important; }
  #flyerSheet .flyer-preview-toolbar-v118 { grid-template-columns: minmax(0, 1fr) auto !important; gap: 6px !important; }
  #flyerSheet .flyer-preview-toolbar-v118 > label { grid-column: 1 / -1 !important; grid-row: 2 !important; }
  #flyerSheet .flyer-preview-toolbar-v118 > button { grid-column: 2 !important; grid-row: 1 !important; }
  #flyerSheet .flyer-preview-panel-v118 .flyer-canvas-shell { padding: 7px !important; }
  #flyerSheet .flyer-export-actions { gap: 5px !important; }
  #flyerSheet .flyer-export-actions button { min-height: 37px !important; font-size: 9px !important; }
  #flyerSheet .flyer-caption-box { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-caption-box button { width: 100% !important; }
}

@media (max-width: 374px) {
  #flyerSheet .flyer-control-row-v117 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-custom-grid-v118 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-radius-control-v118 { grid-column: span 1 !important; }
  #flyerSheet .flyer-command-bar-v118 button { font-size: 7.6px !important; padding-inline: 4px !important; }
}

@media (prefers-reduced-motion: reduce) {
  #flyerSheet[open] .flyer-studio-v118,
  #flyerSheet .flyer-preview-loader-v118 i,
  #flyerSheet .flyer-preview-panel-v118 canvas,
  #flyerSheet .flyer-theme-chip-v118,
  #flyerSheet .flyer-command-bar-v118 button,
  #flyerSheet .flyer-preview-toolbar-v118 button {
    animation: none !important;
    transition: none !important;
  }
}

/* v118 mobile/tablet preview: reserve a generous live-canvas lane while the
   export controls remain reachable by scrolling inside the Preview tab. */
@media (max-width: 1099px) {
  #flyerSheet .flyer-studio-v118[data-mobile-panel="preview"] .flyer-preview-panel-v118 {
    grid-template-rows: auto auto auto auto auto !important;
    align-content: start !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
  }
  #flyerSheet .flyer-studio-v118[data-mobile-panel="preview"] .flyer-canvas-shell {
    width: 100% !important;
    height: auto !important;
    min-height: clamp(280px, 38dvh, 520px) !important;
    flex: none !important;
  }
}

/* v118.0.0 mobile preview-focus geometry: the Preview tab uses the full
   workspace instead of leaving design-only intro and command rows visible. */
@media (max-width: 1099px) {
  #flyerSheet .flyer-studio-v118[data-mobile-panel="preview"] {
    grid-template-rows: auto minmax(0, 1fr) !important;
    grid-template-areas: "tabs" "workspace" !important;
  }
  #flyerSheet .flyer-studio-v118[data-mobile-panel="preview"] > .flyer-intro-v118,
  #flyerSheet .flyer-studio-v118[data-mobile-panel="preview"] > .flyer-command-bar-v118 {
    display: none !important;
  }
}

/* v118 compact-desktop polish: keep the live model generous even on 1100px
   laptop windows while all editor and export controls remain visible. */
@media (min-width: 1100px) and (max-width: 1240px) {
  #flyerSheet .flyer-intro-v118 {
    min-height: 54px !important;
    padding: 6px 9px !important;
  }
  #flyerSheet .flyer-intro-v118 > span {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
  }
  #flyerSheet .flyer-intro-v118 small {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important;
  }
  #flyerSheet .flyer-intro-v118 em,
  #flyerSheet .flyer-command-bar-v118 > small { display: none !important; }
  #flyerSheet .flyer-command-bar-v118 {
    min-height: 54px !important;
    padding: 6px !important;
  }
  #flyerSheet .flyer-command-bar-v118 > div {
    display: grid !important;
    grid-template-columns: 1.25fr .88fr .88fr !important;
    width: 100% !important;
    gap: 5px !important;
  }
  #flyerSheet .flyer-command-bar-v118 button {
    min-width: 0 !important;
    min-height: 36px !important;
    padding-inline: 7px !important;
    font-size: 8.3px !important;
  }
  #flyerSheet .flyer-preview-toolbar-v118 {
    min-height: 38px !important;
    padding-bottom: 5px !important;
    gap: 6px !important;
  }
  #flyerSheet .flyer-export-actions { padding-top: 5px !important; }
  #flyerSheet .flyer-export-actions button { min-height: 36px !important; }
  #flyerSheet .flyer-caption-box { padding-top: 5px !important; }
  #flyerSheet .flyer-caption-box textarea {
    min-height: 42px !important;
    max-height: 50px !important;
  }
  #flyerSheet .flyer-caption-box button { min-height: 36px !important; }
}

/* v118 desktop live-preview priority: keep the social caption available in one
   compact row so the flyer itself remains the visual hero. */
@media (min-width: 1100px) {
  #flyerSheet .flyer-caption-box {
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 7px !important;
    padding-top: 5px !important;
  }
  #flyerSheet .flyer-caption-box > small { display: none !important; }
  #flyerSheet .flyer-caption-box textarea {
    min-height: 40px !important;
    height: 40px !important;
    max-height: 40px !important;
    resize: none !important;
  }
  #flyerSheet .flyer-caption-box button { min-height: 40px !important; }
}

/* ============================================================================
   v119.0.0 · Selection-first simple Flyer Studio
   Nothing is placed on a flyer until the user chooses it. Common design work is
   automatic; advanced controls stay folded away, per-item photo shapes use
   visible buttons instead of the unreliable dropdown, and preview zoom is a
   real 50–200% canvas zoom on desktop, tablet and phone.
   ========================================================================== */

#flyerSheet .flyer-studio-v119 {
  grid-template-columns: minmax(520px, .86fr) minmax(620px, 1.14fr) !important;
  gap: 9px 12px !important;
}
#flyerSheet .flyer-controls-v119 {
  display: flex !important;
  flex-direction: column !important;
  align-content: initial !important;
  gap: 8px !important;
  padding: 9px 10px 15px !important;
}
/* Selection is the first task. Expert surfaces follow it and stay closed. */
#flyerSheet .flyer-basic-row-v119 { order: 1 !important; }
#flyerSheet .flyer-picker-head-v119 { order: 2 !important; }
#flyerSheet .flyer-picker-tools-v119 { order: 3 !important; }
#flyerSheet .flyer-product-picker-v119 { order: 4 !important; }
#flyerSheet .flyer-advanced-design-v119 { order: 5 !important; }
#flyerSheet .flyer-copy-panel-v119 { order: 6 !important; }
#flyerSheet .flyer-note-v117 { order: 7 !important; }

#flyerSheet .flyer-intro-v119 {
  min-height: 54px !important;
  background:
    radial-gradient(circle at 94% 2%, rgba(255,63,134,.12), transparent 29%),
    linear-gradient(112deg, rgba(35,240,216,.12), rgba(7,19,25,.96) 54%, rgba(255,255,255,.03)) !important;
}
#flyerSheet .flyer-intro-v119 em {
  color: rgba(81,246,211,.72) !important;
  font-style: normal !important;
}
#flyerSheet .flyer-command-bar-v119 > div:first-child {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
}
#flyerSheet .flyer-command-bar-v119 button:disabled,
#flyerSheet .flyer-export-actions button:disabled {
  opacity: .42 !important;
  filter: saturate(.42) !important;
  cursor: not-allowed !important;
  transform: none !important;
}
#flyerSheet .flyer-more-tools-v119 {
  position: relative !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-more-tools-v119 > summary {
  display: grid !important;
  place-items: center !important;
  min-height: 39px !important;
  padding: 0 13px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 13px !important;
  color: rgba(255,255,255,.78) !important;
  background: rgba(255,255,255,.045) !important;
  cursor: pointer !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  list-style: none !important;
  white-space: nowrap !important;
}
#flyerSheet .flyer-more-tools-v119 > summary::-webkit-details-marker { display: none !important; }
#flyerSheet .flyer-more-tools-v119 > div {
  position: absolute !important;
  z-index: 120 !important;
  top: calc(100% + 6px) !important;
  right: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(120px, 1fr) !important;
  gap: 5px !important;
  min-width: 174px !important;
  padding: 7px !important;
  border: 1px solid rgba(35,240,216,.18) !important;
  border-radius: 14px !important;
  background: rgba(3,12,17,.985) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.48) !important;
}
#flyerSheet .flyer-more-tools-v119 > div button { width: 100% !important; }

#flyerSheet .flyer-basic-row-v119 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-basic-row-v119 > label {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
  padding: 8px !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 13px !important;
  background: rgba(255,255,255,.027) !important;
}
#flyerSheet .flyer-basic-row-v119 small {
  color: rgba(255,255,255,.52) !important;
  font-size: 8.5px !important;
  font-weight: 900 !important;
}
#flyerSheet .flyer-basic-row-v119 select {
  width: 100% !important;
  min-width: 0 !important;
  height: 37px !important;
  margin: 0 !important;
  border-radius: 10px !important;
}

#flyerSheet .flyer-picker-head-v119 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: end !important;
  gap: 8px !important;
  padding: 7px 2px 0 !important;
}
#flyerSheet .flyer-picker-head-v119 > div {
  display: grid !important;
  justify-content: initial !important;
  gap: 2px !important;
}
#flyerSheet .flyer-picker-head-v119 b {
  color: #f6fffd !important;
  font-size: 12px !important;
  line-height: 1.15 !important;
}
#flyerSheet .flyer-picker-head-v119 small {
  color: rgba(81,246,211,.66) !important;
  font-size: 8.5px !important;
  line-height: 1.3 !important;
}
#flyerSheet .flyer-picker-head-v119 > span {
  display: inline-grid !important;
  place-items: center !important;
  min-width: 48px !important;
  height: 27px !important;
  padding: 0 9px !important;
  border: 1px solid rgba(35,240,216,.18) !important;
  border-radius: 999px !important;
  color: #51f6d3 !important;
  background: rgba(35,240,216,.055) !important;
  font-size: 9px !important;
  font-weight: 1000 !important;
}
#flyerSheet .flyer-picker-tools-v119 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-picker-tools-v119 > label {
  display: grid !important;
  grid-template-columns: 18px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  height: 39px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.035) !important;
}
#flyerSheet .flyer-picker-tools-v119 svg { width: 16px !important; height: 16px !important; color: rgba(81,246,211,.72) !important; }
#flyerSheet .flyer-picker-tools-v119 input {
  width: 100% !important;
  min-width: 0 !important;
  height: 35px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  color: #f6fffd !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 10px !important;
}
#flyerSheet .flyer-picker-tools-v119 > button {
  min-height: 39px !important;
  padding: 0 11px !important;
  border-radius: 12px !important;
  font-size: 8.7px !important;
}

#flyerSheet .flyer-product-picker-v119 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 7px !important;
  min-width: 0 !important;
  padding: 1px !important;
  overflow: visible !important;
}
#flyerSheet .flyer-pick-v119 {
  grid-template-rows: auto !important;
  gap: 0 !important;
  min-width: 0 !important;
  padding: 6px !important;
  overflow: hidden !important;
  border-radius: 15px !important;
  cursor: pointer !important;
  content-visibility: auto !important;
  contain-intrinsic-size: 92px !important;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease !important;
}
#flyerSheet .flyer-pick-v119:not(.active) {
  border-color: rgba(255,255,255,.075) !important;
  background: linear-gradient(150deg, rgba(9,23,29,.86), rgba(2,8,12,.94)) !important;
  box-shadow: none !important;
}
#flyerSheet .flyer-pick-v119.active {
  grid-column: 1 / -1 !important;
  grid-template-rows: auto auto auto !important;
  gap: 7px !important;
  cursor: default !important;
  contain-intrinsic-size: 220px !important;
}
#flyerSheet .flyer-pick-select-v119 {
  grid-template-columns: 84px minmax(0, 1fr) !important;
  gap: 8px !important;
  cursor: pointer !important;
}
#flyerSheet .flyer-pick-v119 .flyer-pick-media {
  width: 84px !important;
  height: 76px !important;
  border-radius: 12px !important;
}
#flyerSheet .flyer-pick-v119.active .flyer-pick-select-v119 {
  grid-template-columns: 108px minmax(0, 1fr) !important;
}
#flyerSheet .flyer-pick-v119.active .flyer-pick-media {
  width: 108px !important;
  height: 94px !important;
}
#flyerSheet .flyer-pick-v119 .flyer-pick-copy {
  grid-template-rows: minmax(31px, auto) 16px 22px !important;
  align-content: center !important;
  gap: 3px !important;
  padding: 1px !important;
}
#flyerSheet .flyer-pick-v119 .flyer-pick-copy > b {
  min-height: 31px !important;
  font-size: 10px !important;
  line-height: 1.15 !important;
  -webkit-line-clamp: 2 !important;
}
#flyerSheet .flyer-pick-v119 .flyer-pick-copy > small {
  height: 16px !important;
  line-height: 16px !important;
  font-size: 8.4px !important;
}
#flyerSheet .flyer-selection-state-v119 {
  display: inline-grid !important;
  place-items: center !important;
  justify-self: start !important;
  width: auto !important;
  min-width: 58px !important;
  height: 22px !important;
  padding: 0 8px !important;
  border: 1px solid rgba(35,240,216,.19) !important;
  border-radius: 999px !important;
  color: #51f6d3 !important;
  background: rgba(35,240,216,.055) !important;
  font-size: 7.8px !important;
  font-style: normal !important;
  font-weight: 950 !important;
}
#flyerSheet .flyer-pick-v119.active .flyer-selection-state-v119 {
  color: rgba(255,255,255,.72) !important;
  border-color: rgba(255,63,134,.22) !important;
  background: rgba(255,63,134,.065) !important;
}
#flyerSheet .flyer-pick-v119:not(.active) .flyer-drag-handle { display: none !important; }
#flyerSheet .flyer-pick-v119 .flyer-drag-handle {
  cursor: grab !important;
  touch-action: none !important;
}
#flyerSheet .flyer-pick-v119 .flyer-drag-handle:active { cursor: grabbing !important; }
#flyerSheet .flyer-selected-tools-v119,
#flyerSheet .flyer-item-advanced-v119 { display: none !important; }
#flyerSheet .flyer-pick-v119.active .flyer-selected-tools-v119 {
  display: grid !important;
  grid-template-columns: 36px minmax(0, 1fr) 36px !important;
  gap: 6px !important;
  min-width: 0 !important;
  padding-top: 6px !important;
  border-top: 1px solid rgba(255,255,255,.065) !important;
}
#flyerSheet .flyer-pick-v119.active .flyer-item-advanced-v119 { display: block !important; }
#flyerSheet .flyer-selected-tools-v119 > button {
  min-width: 0 !important;
  height: 34px !important;
  margin: 0 !important;
  border-radius: 10px !important;
}
#flyerSheet .flyer-item-advanced-v119 > summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 38px !important;
}
#flyerSheet .flyer-item-advanced-v119 > summary > span {
  display: grid !important;
  gap: 1px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-item-advanced-v119 > summary > span > span,
#flyerSheet .flyer-item-advanced-v119 > summary > span { color: rgba(255,255,255,.82) !important; }
#flyerSheet .flyer-item-advanced-v119 > summary small {
  display: block !important;
  margin: 1px 0 0 !important;
  color: rgba(255,255,255,.44) !important;
  font-size: 7.4px !important;
  line-height: 1.2 !important;
}
#flyerSheet .flyer-item-editor-v119 {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
  padding: 2px 8px 9px !important;
}
#flyerSheet .flyer-choice-block-v119 {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-choice-block-v119 > small {
  color: rgba(255,255,255,.48) !important;
  font-size: 7.8px !important;
  font-weight: 900 !important;
}
#flyerSheet .flyer-choice-pills-v119 {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 5px !important;
  min-width: 0 !important;
}
#flyerSheet [data-flyer-fit-group].flyer-choice-pills-v119 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
#flyerSheet .flyer-choice-pills-v119 > button {
  min-width: 0 !important;
  min-height: 32px !important;
  padding: 0 5px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 9px !important;
  color: rgba(255,255,255,.66) !important;
  background: rgba(255,255,255,.035) !important;
  font-size: 7.6px !important;
  font-weight: 950 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#flyerSheet .flyer-choice-pills-v119 > button.active {
  color: #021014 !important;
  border-color: rgba(35,240,216,.62) !important;
  background: linear-gradient(130deg, #23f0d8, #51f6a9) !important;
  box-shadow: 0 7px 18px rgba(35,240,216,.12) !important;
}
#flyerSheet .flyer-picker-empty-v119 {
  grid-column: 1 / -1 !important;
  display: grid !important;
  place-items: center !important;
  gap: 4px !important;
  min-height: 110px !important;
  padding: 18px !important;
  border: 1px dashed rgba(35,240,216,.22) !important;
  border-radius: 15px !important;
  color: rgba(255,255,255,.72) !important;
  background: rgba(35,240,216,.025) !important;
  text-align: center !important;
}
#flyerSheet .flyer-picker-empty-v119 small { color: rgba(255,255,255,.42) !important; font-size: 8.5px !important; }

#flyerSheet .flyer-advanced-design-v119,
#flyerSheet .flyer-copy-panel-v119 {
  min-width: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 15px !important;
  background: rgba(255,255,255,.026) !important;
}
#flyerSheet .flyer-advanced-design-v119 > summary,
#flyerSheet .flyer-copy-panel-v119 > summary {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 47px !important;
  padding: 7px 11px !important;
  cursor: pointer !important;
  list-style: none !important;
}
#flyerSheet .flyer-advanced-design-v119 > summary::-webkit-details-marker,
#flyerSheet .flyer-copy-panel-v119 > summary::-webkit-details-marker { display: none !important; }
#flyerSheet .flyer-advanced-design-v119 > summary > span,
#flyerSheet .flyer-copy-panel-v119 > summary > span {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-advanced-design-v119 > summary b,
#flyerSheet .flyer-copy-panel-v119 > summary b { color: #f5fffd !important; font-size: 10px !important; }
#flyerSheet .flyer-advanced-design-v119 > summary small,
#flyerSheet .flyer-copy-panel-v119 > summary small { color: rgba(255,255,255,.43) !important; font-size: 8px !important; line-height: 1.3 !important; }
#flyerSheet .flyer-advanced-design-v119 > summary::after,
#flyerSheet .flyer-copy-panel-v119 > summary::after {
  content: '+' !important;
  margin-left: auto !important;
  color: #51f6d3 !important;
  font-size: 19px !important;
  font-weight: 500 !important;
}
#flyerSheet .flyer-advanced-design-v119[open] > summary::after,
#flyerSheet .flyer-copy-panel-v119[open] > summary::after { content: '−' !important; }
#flyerSheet .flyer-advanced-body-v119,
#flyerSheet .flyer-copy-body-v119 {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
  padding: 0 9px 10px !important;
}
#flyerSheet .flyer-copy-body-v119 > button { min-height: 39px !important; border-radius: 12px !important; }
#flyerSheet .flyer-advanced-body-v119 .flyer-theme-gallery-v118 {
  grid-template-columns: minmax(130px, .30fr) minmax(0, 1fr) !important;
}

#flyerSheet .flyer-preview-toolbar-v119 {
  grid-template-columns: minmax(110px, 1fr) minmax(330px, 1.05fr) auto !important;
  gap: 8px !important;
}
#flyerSheet .flyer-preview-zoom-v119 {
  display: grid !important;
  grid-template-columns: 34px minmax(180px, 1fr) auto 34px !important;
  align-items: center !important;
  gap: 5px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-preview-zoom-v119 > button {
  min-width: 0 !important;
  width: auto !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 8px !important;
  border-radius: 10px !important;
  font-size: 11px !important;
}
#flyerSheet .flyer-preview-zoom-v119 > button:first-child,
#flyerSheet .flyer-preview-zoom-v119 > button:last-child { padding: 0 !important; font-size: 17px !important; }
#flyerSheet .flyer-preview-zoom-v119 > label {
  display: grid !important;
  grid-template-columns: auto minmax(90px, 1fr) 40px !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  color: rgba(255,255,255,.48) !important;
  font-size: 7.8px !important;
}
#flyerSheet .flyer-preview-zoom-v119 input[type="range"] {
  width: 100% !important;
  min-width: 0 !important;
  accent-color: #23f0d8 !important;
}
#flyerSheet .flyer-preview-zoom-v119 b { color: #51f6d3 !important; font-size: 8px !important; text-align: right !important; }
#flyerSheet .flyer-preview-panel-v119 .flyer-canvas-shell {
  place-items: start center !important;
  scroll-behavior: smooth !important;
}
#flyerSheet .flyer-canvas-stage-v118 {
  width: auto !important;
  height: auto !important;
  min-width: 100% !important;
  min-height: 100% !important;
  align-content: center !important;
  justify-content: center !important;
}
#flyerSheet .flyer-preview-panel-v119 canvas {
  flex: 0 0 auto !important;
  transform-origin: center center !important;
  will-change: width, height !important;
}
/* The canvas itself contains the polished empty state; avoid duplicate copy. */
#flyerSheet .flyer-empty-preview-v119 { display: none !important; }

@media (hover:hover) and (pointer:fine) {
  #flyerSheet .flyer-pick-v119:not(.active):hover {
    border-color: rgba(35,240,216,.28) !important;
    background: linear-gradient(150deg, rgba(10,31,36,.92), rgba(2,9,13,.96)) !important;
    transform: translateY(-1px) !important;
  }
  #flyerSheet .flyer-choice-pills-v119 > button:hover,
  #flyerSheet .flyer-picker-tools-v119 > button:hover { border-color: rgba(35,240,216,.34) !important; }
}

@media (max-width: 1399px) and (min-width: 1100px) {
  #flyerSheet .flyer-studio-v119 {
    grid-template-columns: minmax(500px, .94fr) minmax(500px, 1.06fr) !important;
  }
  #flyerSheet .flyer-preview-toolbar-v119 {
    grid-template-columns: minmax(90px, .72fr) minmax(300px, 1.28fr) auto !important;
  }
}

@media (max-width: 1099px) {
  #flyerSheet .flyer-studio-v119 {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  #flyerSheet .flyer-controls-v119 { display: flex !important; }
  #flyerSheet .flyer-studio-v119[data-mobile-panel="preview"] .flyer-preview-panel-v119 { display: grid !important; }
  #flyerSheet .flyer-studio-v119[data-mobile-panel="design"] .flyer-preview-panel-v119 { display: none !important; }
  #flyerSheet .flyer-studio-v119[data-mobile-panel="preview"] .flyer-controls-v119 { display: none !important; }
  #flyerSheet .flyer-command-bar-v119 > div:first-child { width: auto !important; display: flex !important; }
  #flyerSheet .flyer-more-tools-v119 > div { left: 0 !important; right: auto !important; }
  #flyerSheet .flyer-preview-toolbar-v119 {
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
  }
  #flyerSheet .flyer-preview-zoom-v119 {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    grid-template-columns: 34px minmax(0, 1fr) auto 34px !important;
  }
  #flyerSheet .flyer-preview-toolbar-v119 > #flyerPreviewFocusBtn {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }
}

@media (max-width: 719px) {
  #flyerSheet .flyer-intro-v119 { min-height: 46px !important; }
  #flyerSheet .flyer-command-bar-v119 {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 6px !important;
    min-height: 43px !important;
  }
  #flyerSheet .flyer-command-bar-v119 > div:first-child { flex: 1 1 auto !important; }
  #flyerSheet .flyer-command-bar-v119 .flyer-auto-design-v118 { flex: 1 1 auto !important; min-width: 0 !important; }
  #flyerSheet .flyer-command-bar-v119 > small { display: none !important; }
  #flyerSheet .flyer-more-tools-v119 > summary { min-height: 35px !important; padding: 0 9px !important; font-size: 8px !important; }
  #flyerSheet .flyer-basic-row-v119 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 5px !important; }
  #flyerSheet .flyer-basic-row-v119 > label { padding: 6px !important; }
  #flyerSheet .flyer-basic-row-v119 select { height: 35px !important; font-size: 9px !important; }
  #flyerSheet .flyer-picker-tools-v119 { grid-template-columns: minmax(0, 1fr) auto !important; gap: 5px !important; }
  #flyerSheet .flyer-picker-tools-v119 > button { padding-inline: 8px !important; font-size: 7.8px !important; }
  #flyerSheet .flyer-product-picker-v119 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 6px !important; }
  #flyerSheet .flyer-pick-v119 { padding: 5px !important; }
  #flyerSheet .flyer-pick-v119:not(.active) .flyer-pick-select-v119 {
    grid-template-columns: 62px minmax(0, 1fr) !important;
    gap: 6px !important;
  }
  #flyerSheet .flyer-pick-v119:not(.active) .flyer-pick-media {
    width: 62px !important;
    height: 67px !important;
  }
  #flyerSheet .flyer-pick-v119:not(.active) .flyer-pick-copy {
    grid-template-rows: minmax(29px, auto) 14px 20px !important;
    gap: 2px !important;
  }
  #flyerSheet .flyer-pick-v119:not(.active) .flyer-pick-copy > b { min-height: 29px !important; font-size: 8.4px !important; }
  #flyerSheet .flyer-pick-v119:not(.active) .flyer-pick-copy > small { height: 14px !important; line-height: 14px !important; font-size: 7.2px !important; }
  #flyerSheet .flyer-pick-v119:not(.active) .flyer-selection-state-v119 { min-width: 48px !important; height: 20px !important; padding: 0 6px !important; font-size: 6.8px !important; }
  #flyerSheet .flyer-pick-v119.active .flyer-pick-select-v119 { grid-template-columns: 88px minmax(0, 1fr) !important; }
  #flyerSheet .flyer-pick-v119.active .flyer-pick-media { width: 88px !important; height: 82px !important; }
  #flyerSheet .flyer-choice-pills-v119 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #flyerSheet [data-flyer-fit-group].flyer-choice-pills-v119 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  #flyerSheet .flyer-advanced-body-v119 .flyer-theme-gallery-v118 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-preview-zoom-v119 > label > span { display: none !important; }
  #flyerSheet .flyer-preview-zoom-v119 > label { grid-template-columns: minmax(0, 1fr) 38px !important; }
  #flyerSheet .flyer-preview-zoom-v119 > button { font-size: 8px !important; }
}

@media (max-width: 374px) {
  #flyerSheet .flyer-product-picker-v119 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-pick-v119.active { grid-column: auto !important; }
  #flyerSheet .flyer-picker-head-v119 { grid-template-columns: minmax(0, 1fr) auto !important; }
  #flyerSheet .flyer-choice-pills-v119,
  #flyerSheet [data-flyer-fit-group].flyer-choice-pills-v119 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #flyerSheet .flyer-preview-zoom-v119 { grid-template-columns: 32px minmax(0, 1fr) 46px 32px !important; }
}

@media (prefers-reduced-motion: reduce) {
  #flyerSheet .flyer-pick-v119,
  #flyerSheet .flyer-preview-panel-v119 canvas,
  #flyerSheet .flyer-choice-pills-v119 > button,
  #flyerSheet .flyer-more-tools-v119 > div {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

@media (max-width: 1099px) {
  #flyerSheet .flyer-studio-v119[data-mobile-panel="design"] .flyer-controls-v119 { display: flex !important; }
  #flyerSheet .flyer-studio-v119[data-mobile-panel="preview"] .flyer-controls-v119 { display: none !important; }
}

/* v119 preview zoom must respond immediately while the slider is dragged. */
#flyerSheet .flyer-preview-panel-v119 #flyerCanvas {
  max-width: none !important;
  max-height: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  transition: opacity .14s ease !important;
}

/* ============================================================================
   v120.0.0 · Large clean professional Flyer Studio
   Larger photo-first cards, readable item controls, expanded clean themes,
   balanced composition and an optional crop panel that keeps the first view calm.
   ========================================================================== */

#flyerSheet .flyer-studio-v120 {
  grid-template-columns: minmax(570px, .90fr) minmax(650px, 1.10fr) !important;
  gap: 10px 14px !important;
}
#flyerSheet .flyer-intro-v120 {
  background:
    radial-gradient(circle at 95% -8%, rgba(255,207,74,.14), transparent 31%),
    radial-gradient(circle at 5% 110%, rgba(35,240,216,.13), transparent 34%),
    linear-gradient(112deg, rgba(35,240,216,.105), rgba(6,17,23,.97) 52%, rgba(255,255,255,.025)) !important;
}
#flyerSheet .flyer-command-bar-v120,
#flyerSheet .flyer-controls-v120,
#flyerSheet .flyer-preview-panel-v120 {
  border-color: rgba(35,240,216,.13) !important;
}

/* Bigger selection cards without turning the picker into a wall of controls. */
#flyerSheet .flyer-pick-v120 {
  border-radius: 17px !important;
  padding: 7px !important;
  background:
    radial-gradient(circle at 95% 0%, rgba(35,240,216,.055), transparent 36%),
    linear-gradient(148deg, rgba(10,27,33,.92), rgba(2,8,12,.97)) !important;
}
#flyerSheet .flyer-pick-v120:not(.active) .flyer-pick-select-v119 {
  grid-template-columns: 94px minmax(0, 1fr) !important;
  gap: 9px !important;
}
#flyerSheet .flyer-pick-v120:not(.active) .flyer-pick-media {
  width: 94px !important;
  height: 84px !important;
}
#flyerSheet .flyer-pick-v120.active .flyer-pick-select-v119 {
  grid-template-columns: 132px minmax(0, 1fr) !important;
  gap: 11px !important;
}
#flyerSheet .flyer-pick-v120.active .flyer-pick-media {
  width: 132px !important;
  height: 118px !important;
}
#flyerSheet .flyer-pick-v120 .flyer-pick-media {
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: inset 0 0 0 1px rgba(35,240,216,.06), 0 10px 26px rgba(0,0,0,.24) !important;
  background: radial-gradient(circle at 50% 44%, rgba(35,240,216,.12), rgba(2,8,12,.96) 72%) !important;
}
#flyerSheet .flyer-pick-v120 .flyer-pick-media::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(118deg, transparent 20%, rgba(255,255,255,.10) 46%, transparent 70%) !important;
  transform: translateX(-135%) !important;
  transition: transform .48s ease !important;
}
#flyerSheet .flyer-pick-v120 .flyer-pick-copy {
  grid-template-rows: minmax(38px, auto) 18px 24px !important;
  gap: 4px !important;
}
#flyerSheet .flyer-pick-v120 .flyer-pick-copy > b {
  min-height: 38px !important;
  font-size: 11.5px !important;
  line-height: 1.18 !important;
  letter-spacing: -.01em !important;
}
#flyerSheet .flyer-pick-v120.active .flyer-pick-copy > b {
  font-size: 13px !important;
  line-height: 1.17 !important;
}
#flyerSheet .flyer-pick-v120 .flyer-pick-copy > small {
  height: 18px !important;
  line-height: 18px !important;
  font-size: 9.3px !important;
}
#flyerSheet .flyer-pick-v120 .flyer-selection-state-v119 {
  min-width: 64px !important;
  height: 24px !important;
  padding-inline: 10px !important;
  font-size: 8.5px !important;
}

/* “Adjust this item” is now deliberately readable. */
#flyerSheet .flyer-item-advanced-v120 {
  overflow: hidden !important;
  border: 1px solid rgba(35,240,216,.13) !important;
  border-radius: 14px !important;
  background: linear-gradient(145deg, rgba(35,240,216,.035), rgba(255,255,255,.018)) !important;
}
#flyerSheet .flyer-item-advanced-v120 > summary {
  min-height: 48px !important;
  padding: 8px 11px !important;
  cursor: pointer !important;
  list-style: none !important;
}
#flyerSheet .flyer-item-advanced-v120 > summary::-webkit-details-marker { display: none !important; }
#flyerSheet .flyer-item-advanced-v120 > summary > span {
  color: #f5fffd !important;
  font-size: 11.5px !important;
  font-weight: 1000 !important;
  letter-spacing: -.01em !important;
}
#flyerSheet .flyer-item-advanced-v120 > summary > small {
  color: rgba(255,255,255,.58) !important;
  font-size: 9px !important;
  line-height: 1.28 !important;
  text-align: right !important;
}
#flyerSheet .flyer-item-advanced-v120 > summary::after {
  content: '+' !important;
  display: grid !important;
  place-items: center !important;
  width: 25px !important;
  height: 25px !important;
  margin-left: 7px !important;
  border-radius: 50% !important;
  color: #071114 !important;
  background: linear-gradient(135deg, #23f0d8, #66f2a8) !important;
  font-size: 17px !important;
  line-height: 1 !important;
}
#flyerSheet .flyer-item-advanced-v120[open] > summary::after { content: '−' !important; }
#flyerSheet .flyer-item-editor-v120 {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  padding: 3px 10px 11px !important;
}
#flyerSheet .flyer-item-editor-v120 > .flyer-item-label-v117,
#flyerSheet .flyer-item-editor-v120 > .flyer-crop-fine-v120,
#flyerSheet .flyer-item-editor-v120 > .flyer-item-flags-v118 {
  grid-column: 1 / -1 !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-item-label-v117 small,
#flyerSheet .flyer-item-editor-v120 .flyer-choice-block-v119 > small,
#flyerSheet .flyer-item-editor-v120 .flyer-item-zoom-v117 > span {
  color: rgba(255,255,255,.66) !important;
  font-size: 9.2px !important;
  font-weight: 950 !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-item-label-v117 input {
  min-height: 40px !important;
  font-size: 11px !important;
  border-radius: 11px !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-item-zoom-v117 {
  min-width: 0 !important;
  padding: 8px 9px !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.025) !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-item-zoom-v117 b {
  color: #51f6d3 !important;
  font-size: 10px !important;
}
#flyerSheet .flyer-item-editor-v120 input[type='range'] {
  width: 100% !important;
  min-width: 0 !important;
  accent-color: #23f0d8 !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-choice-pills-v119 > button {
  min-height: 37px !important;
  font-size: 9px !important;
  border-radius: 11px !important;
}
#flyerSheet .flyer-crop-fine-v120 {
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 13px !important;
  background: rgba(1,7,11,.38) !important;
}
#flyerSheet .flyer-crop-fine-v120 > summary {
  display: grid !important;
  grid-template-columns: minmax(0, .38fr) minmax(0, .62fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 43px !important;
  padding: 7px 10px !important;
  cursor: pointer !important;
  list-style: none !important;
}
#flyerSheet .flyer-crop-fine-v120 > summary::-webkit-details-marker { display: none !important; }
#flyerSheet .flyer-crop-fine-v120 > summary > span {
  color: #eafffa !important;
  font-size: 10px !important;
  font-weight: 1000 !important;
}
#flyerSheet .flyer-crop-fine-v120 > summary > small {
  color: rgba(255,255,255,.46) !important;
  font-size: 8.4px !important;
  line-height: 1.25 !important;
}
#flyerSheet .flyer-crop-fine-v120 > summary::after {
  content: '＋' !important;
  color: #51f6d3 !important;
  font-size: 16px !important;
}
#flyerSheet .flyer-crop-fine-v120[open] > summary::after { content: '−' !important; }
#flyerSheet .flyer-crop-fine-v120 > div {
  display: grid !important;
  gap: 9px !important;
  padding: 0 9px 10px !important;
}
#flyerSheet .flyer-reset-photo-v120 {
  justify-self: start !important;
  min-height: 35px !important;
  border-radius: 11px !important;
  font-size: 8.8px !important;
}

/* More room for the enlarged clean theme collection. */
#flyerSheet .flyer-studio-v120 .flyer-theme-strip-v118 {
  grid-auto-columns: 112px !important;
  gap: 7px !important;
  padding-bottom: 7px !important;
}
#flyerSheet .flyer-studio-v120 .flyer-theme-chip-v118 {
  min-height: 83px !important;
  padding: 7px !important;
  border-radius: 14px !important;
}
#flyerSheet .flyer-studio-v120 .flyer-theme-chip-v118 > i {
  min-height: 49px !important;
  border-radius: 10px !important;
}
#flyerSheet .flyer-studio-v120 .flyer-theme-chip-v118 > span {
  font-size: 8.7px !important;
  line-height: 1.15 !important;
}

@media (hover:hover) and (pointer:fine) {
  #flyerSheet .flyer-pick-v120:hover .flyer-pick-media::after { transform: translateX(135%) !important; }
  #flyerSheet .flyer-pick-v120:hover { box-shadow: 0 14px 34px rgba(0,0,0,.24) !important; }
  #flyerSheet .flyer-theme-chip-v118:hover { transform: translateY(-2px) !important; }
}

@media (max-width: 1399px) and (min-width: 1100px) {
  #flyerSheet .flyer-studio-v120 {
    grid-template-columns: minmax(530px, .95fr) minmax(520px, 1.05fr) !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-select-v119 { grid-template-columns: 122px minmax(0, 1fr) !important; }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-media { width: 122px !important; height: 108px !important; }
}

@media (max-width: 1099px) {
  #flyerSheet .flyer-studio-v120 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-item-editor-v120 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 719px) {
  #flyerSheet .flyer-pick-v120:not(.active) .flyer-pick-select-v119 {
    grid-template-columns: 70px minmax(0, 1fr) !important;
    gap: 7px !important;
  }
  #flyerSheet .flyer-pick-v120:not(.active) .flyer-pick-media {
    width: 70px !important;
    height: 74px !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-select-v119 {
    grid-template-columns: 106px minmax(0, 1fr) !important;
    gap: 8px !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-media {
    width: 106px !important;
    height: 98px !important;
  }
  #flyerSheet .flyer-pick-v120 .flyer-pick-copy > b {
    min-height: 35px !important;
    font-size: 9.6px !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-copy > b { font-size: 11px !important; }
  #flyerSheet .flyer-pick-v120 .flyer-pick-copy > small { font-size: 8px !important; }
  #flyerSheet .flyer-item-advanced-v120 > summary {
    grid-template-columns: minmax(0, 1fr) auto !important;
    min-height: 47px !important;
  }
  #flyerSheet .flyer-item-advanced-v120 > summary > small { display: none !important; }
  #flyerSheet .flyer-item-editor-v120 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-item-editor-v120 > * { grid-column: 1 !important; }
  #flyerSheet .flyer-crop-fine-v120 > summary { grid-template-columns: minmax(0, 1fr) auto !important; }
  #flyerSheet .flyer-crop-fine-v120 > summary > small { display: none !important; }
  #flyerSheet .flyer-studio-v120 .flyer-theme-strip-v118 { grid-auto-columns: 100px !important; }
  #flyerSheet .flyer-studio-v120 .flyer-theme-chip-v118 { min-height: 77px !important; }
}

@media (max-width: 374px) {
  #flyerSheet .flyer-pick-v120:not(.active) .flyer-pick-select-v119 { grid-template-columns: 82px minmax(0, 1fr) !important; }
  #flyerSheet .flyer-pick-v120:not(.active) .flyer-pick-media { width: 82px !important; height: 78px !important; }
}

@media (prefers-reduced-motion: reduce) {
  #flyerSheet .flyer-pick-v120,
  #flyerSheet .flyer-pick-v120 .flyer-pick-media::after,
  #flyerSheet .flyer-theme-chip-v118 {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
}

/* v120 final readability pass: larger selected media and touch-friendly item controls. */
#flyerSheet .flyer-item-advanced-v120 > summary > span {
  font-size: 13px !important;
  line-height: 1.18 !important;
}
#flyerSheet .flyer-item-advanced-v120 > summary > small {
  font-size: 10.2px !important;
  line-height: 1.3 !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-item-label-v117 small,
#flyerSheet .flyer-item-editor-v120 .flyer-choice-block-v119 > small,
#flyerSheet .flyer-item-editor-v120 .flyer-item-zoom-v117 > span {
  font-size: 10.4px !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-item-label-v117 input {
  min-height: 43px !important;
  font-size: 12px !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-item-zoom-v117 b {
  font-size: 11.2px !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-choice-pills-v119 > button {
  min-height: 40px !important;
  font-size: 10.3px !important;
}
#flyerSheet .flyer-crop-fine-v120 > summary > span {
  font-size: 11.3px !important;
}
#flyerSheet .flyer-crop-fine-v120 > summary > small {
  font-size: 9.4px !important;
}
#flyerSheet .flyer-reset-photo-v120 {
  min-height: 38px !important;
  font-size: 10px !important;
}

@media (min-width: 1400px) {
  #flyerSheet .flyer-pick-v120:not(.active) .flyer-pick-select-v119 {
    grid-template-columns: 102px minmax(0, 1fr) !important;
  }
  #flyerSheet .flyer-pick-v120:not(.active) .flyer-pick-media {
    width: 102px !important;
    height: 92px !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-select-v119 {
    grid-template-columns: 148px minmax(0, 1fr) !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-media {
    width: 148px !important;
    height: 132px !important;
  }
  #flyerSheet .flyer-pick-v120 .flyer-pick-copy > b { font-size: 12px !important; }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-copy > b { font-size: 14px !important; }
}

@media (min-width: 1100px) and (max-width: 1399px) {
  #flyerSheet .flyer-pick-v120:not(.active) .flyer-pick-select-v119 {
    grid-template-columns: 94px minmax(0, 1fr) !important;
  }
  #flyerSheet .flyer-pick-v120:not(.active) .flyer-pick-media {
    width: 94px !important;
    height: 86px !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-select-v119 {
    grid-template-columns: 130px minmax(0, 1fr) !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-media {
    width: 130px !important;
    height: 118px !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-copy > b { font-size: 13.2px !important; }
}

@media (min-width: 720px) and (max-width: 1099px) {
  #flyerSheet .flyer-pick-v120.active .flyer-pick-select-v119 {
    grid-template-columns: 128px minmax(0, 1fr) !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-media {
    width: 128px !important;
    height: 116px !important;
  }
}

@media (max-width: 719px) {
  #flyerSheet .flyer-pick-v120.active .flyer-pick-select-v119 {
    grid-template-columns: 112px minmax(0, 1fr) !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-media {
    width: 112px !important;
    height: 104px !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-copy > b {
    font-size: 11.8px !important;
    line-height: 1.18 !important;
  }
  #flyerSheet .flyer-item-advanced-v120 > summary > span { font-size: 12px !important; }
  #flyerSheet .flyer-item-editor-v120 .flyer-item-label-v117 small,
  #flyerSheet .flyer-item-editor-v120 .flyer-choice-block-v119 > small,
  #flyerSheet .flyer-item-editor-v120 .flyer-item-zoom-v117 > span { font-size: 10px !important; }
  #flyerSheet .flyer-item-editor-v120 .flyer-choice-pills-v119 > button {
    min-height: 41px !important;
    font-size: 10px !important;
  }
}

@media (max-width: 374px) {
  #flyerSheet .flyer-pick-v120.active .flyer-pick-select-v119 {
    grid-template-columns: 104px minmax(0, 1fr) !important;
  }
  #flyerSheet .flyer-pick-v120.active .flyer-pick-media {
    width: 104px !important;
    height: 98px !important;
  }
}

/* v120 final control clarity: photo choices use the full editor width. */
#flyerSheet .flyer-item-editor-v120 > .flyer-choice-block-v119 {
  grid-column: 1 / -1 !important;
}
#flyerSheet .flyer-item-editor-v120 [data-flyer-shape-group].flyer-choice-pills-v119 {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
#flyerSheet .flyer-item-editor-v120 [data-flyer-fit-group].flyer-choice-pills-v119 {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-choice-pills-v119 > button {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
@media (max-width: 430px) {
  #flyerSheet .flyer-item-editor-v120 [data-flyer-shape-group].flyer-choice-pills-v119 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ============================================================================
   v121.0.0 · Visible theme library, editable flyer identity and pro crop studio
   ========================================================================== */
#flyerSheet .flyer-studio-v121 {
  --v121-panel: rgba(8, 19, 25, .92);
  --v121-line: rgba(35, 240, 216, .18);
}
#flyerSheet .flyer-intro-v121 {
  min-height: 50px !important;
  padding: 9px 12px !important;
  border-color: rgba(35,240,216,.20) !important;
  background: linear-gradient(135deg, rgba(35,240,216,.10), rgba(255,63,134,.055), rgba(8,16,23,.94)) !important;
}
#flyerSheet .flyer-intro-v121 > div { align-content: center !important; }
#flyerSheet .flyer-intro-v121 > div > b { font-size: 14px !important; line-height: 1.15 !important; }
#flyerSheet .flyer-command-bar-v121 { min-height: 45px !important; }
#flyerSheet .flyer-command-bar-v121 > div { width: 100% !important; }
#flyerSheet .flyer-command-bar-v121 .flyer-auto-design-v118 { min-height: 40px !important; }

/* All 24 themes are now in the main design flow, not hidden inside Advanced. */
#flyerSheet .flyer-theme-gallery-v121 {
  position: relative !important;
  grid-template-columns: minmax(126px, .27fr) minmax(0, 1fr) !important;
  padding: 10px !important;
  border-color: rgba(35,240,216,.24) !important;
  background: linear-gradient(145deg, rgba(35,240,216,.075), rgba(255,255,255,.025)) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.18) !important;
}
#flyerSheet .flyer-theme-gallery-v121 > div:first-child b {
  font-size: 12.5px !important;
  letter-spacing: -.01em !important;
}
#flyerSheet .flyer-theme-gallery-v121 > div:first-child small {
  display: block !important;
  font-size: 9.2px !important;
  line-height: 1.35 !important;
}
#flyerSheet .flyer-studio-v121 .flyer-theme-strip-v118 {
  grid-auto-columns: 108px !important;
  gap: 7px !important;
  max-width: 100% !important;
  padding: 2px 2px 8px !important;
}
#flyerSheet .flyer-studio-v121 .flyer-theme-chip-v118 {
  grid-template-columns: 1fr !important;
  grid-template-rows: 44px auto !important;
  gap: 5px !important;
  min-height: 74px !important;
  padding: 6px !important;
  border-radius: 14px !important;
}
#flyerSheet .flyer-studio-v121 .flyer-theme-chip-v118 > i {
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  border-radius: 9px !important;
}
#flyerSheet .flyer-studio-v121 .flyer-theme-chip-v118 > span {
  font-size: 9.1px !important;
  line-height: 1.15 !important;
  text-align: center !important;
}
#flyerSheet .flyer-studio-v121 .flyer-theme-chip-v118.active {
  border-color: rgba(35,240,216,.80) !important;
  box-shadow: 0 0 0 2px rgba(35,240,216,.12), 0 12px 24px rgba(0,0,0,.28) !important;
}

/* Store/brand name and main title are first-class editable fields. */
#flyerSheet .flyer-primary-copy-v121 {
  display: grid !important;
  grid-template-columns: minmax(170px, .42fr) minmax(230px, .58fr) !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.025) !important;
}
#flyerSheet .flyer-primary-copy-v121 label { display: grid !important; gap: 5px !important; min-width: 0 !important; }
#flyerSheet .flyer-primary-copy-v121 small {
  color: rgba(255,255,255,.62) !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}
#flyerSheet .flyer-primary-copy-v121 input {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 44px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(35,240,216,.16) !important;
  border-radius: 12px !important;
  color: #f7fffd !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  background: rgba(2,9,13,.82) !important;
}
#flyerSheet .flyer-primary-copy-v121 input:focus {
  border-color: rgba(35,240,216,.72) !important;
  box-shadow: 0 0 0 3px rgba(35,240,216,.10) !important;
  outline: none !important;
}

/* Professional crop stage: zoom and direct drag positioning. */
#flyerSheet .flyer-crop-fine-v121 > summary { min-height: 52px !important; }
#flyerSheet .flyer-crop-fine-v121 > summary > span { font-size: 13px !important; }
#flyerSheet .flyer-crop-fine-v121 > summary > small { font-size: 10px !important; }
#flyerSheet .flyer-crop-stage-v121 {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  min-height: 145px !important;
  overflow: hidden !important;
  touch-action: none !important;
  cursor: grab !important;
  user-select: none !important;
  border: 1px solid rgba(35,240,216,.28) !important;
  border-radius: 15px !important;
  background: radial-gradient(circle at 25% 15%, rgba(35,240,216,.12), transparent 48%), #02090e !important;
}
#flyerSheet .flyer-crop-stage-v121.is-dragging { cursor: grabbing !important; border-color: rgba(35,240,216,.75) !important; }
#flyerSheet .flyer-crop-stage-v121 img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  pointer-events: none !important;
  transform: scale(var(--flyer-crop-zoom, 1)) !important;
  transform-origin: center !important;
  transition: transform .12s ease, object-position .12s ease !important;
}
#flyerSheet .flyer-crop-stage-v121.is-dragging img { transition: none !important; }
#flyerSheet .flyer-crop-stage-v121 > span {
  position: absolute !important;
  left: 50% !important;
  bottom: 9px !important;
  transform: translateX(-50%) !important;
  max-width: calc(100% - 18px) !important;
  padding: 6px 10px !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 999px !important;
  color: #f5fffd !important;
  font-size: 9.5px !important;
  font-weight: 900 !important;
  text-align: center !important;
  white-space: nowrap !important;
  background: rgba(0,5,8,.72) !important;
  backdrop-filter: blur(8px) !important;
}
#flyerSheet .flyer-position-panel-v121 { display: grid !important; gap: 6px !important; }
#flyerSheet .flyer-position-panel-v121 > small { color: rgba(255,255,255,.62) !important; font-size: 10px !important; font-weight: 900 !important; }
#flyerSheet .flyer-position-grid-v121 {
  display: grid !important;
  grid-template-columns: repeat(3, 42px) !important;
  gap: 5px !important;
  justify-content: start !important;
}
#flyerSheet .flyer-position-grid-v121 button {
  display: grid !important;
  place-items: center !important;
  width: 42px !important;
  height: 38px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 10px !important;
  color: rgba(255,255,255,.78) !important;
  font-size: 15px !important;
  background: rgba(255,255,255,.045) !important;
}
#flyerSheet .flyer-position-grid-v121 button.active,
#flyerSheet .flyer-position-grid-v121 button:hover {
  border-color: rgba(35,240,216,.65) !important;
  color: #05110f !important;
  background: #23f0d8 !important;
}
#flyerSheet .flyer-item-focal-grid-v121 label > span { font-size: 10px !important; }
#flyerSheet .flyer-crop-fine-v121 .flyer-reset-photo-v120 {
  min-height: 42px !important;
  padding: 0 14px !important;
  font-size: 10.5px !important;
}

/* Keep the studio calm: extra help is disclosed only when requested. */
#flyerSheet .flyer-copy-panel-v121 > summary { min-height: 46px !important; }
#flyerSheet .flyer-copy-panel-v121 > summary b { font-size: 11.5px !important; }
#flyerSheet .flyer-note-v117 { display: none !important; }

@media (min-width: 1600px) {
  #flyerSheet .flyer-studio-v121 .flyer-theme-strip-v118 { grid-auto-columns: 116px !important; }
  #flyerSheet .flyer-studio-v121 .flyer-theme-chip-v118 { min-height: 80px !important; }
}
@media (max-width: 1099px) {
  #flyerSheet .flyer-theme-gallery-v121 { grid-template-columns: minmax(0, 1fr) !important; gap: 7px !important; }
  #flyerSheet .flyer-theme-gallery-v121 > div:first-child small { display: block !important; }
  #flyerSheet .flyer-primary-copy-v121 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-crop-stage-v121 { min-height: 170px !important; }
}
@media (max-width: 719px) {
  #flyerSheet .flyer-theme-gallery-v121 { padding: 8px !important; }
  #flyerSheet .flyer-theme-gallery-v121 > div:first-child b { font-size: 12px !important; }
  #flyerSheet .flyer-theme-gallery-v121 > div:first-child small { font-size: 8.8px !important; }
  #flyerSheet .flyer-studio-v121 .flyer-theme-strip-v118 { grid-auto-columns: 96px !important; }
  #flyerSheet .flyer-studio-v121 .flyer-theme-chip-v118 { min-height: 72px !important; }
  #flyerSheet .flyer-primary-copy-v121 { padding: 8px !important; }
  #flyerSheet .flyer-primary-copy-v121 input { min-height: 46px !important; font-size: 12.5px !important; }
  #flyerSheet .flyer-crop-stage-v121 { min-height: 158px !important; }
  #flyerSheet .flyer-position-grid-v121 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; width: 100% !important; }
  #flyerSheet .flyer-position-grid-v121 button { width: 100% !important; min-height: 42px !important; }
}
@media (prefers-reduced-motion: reduce) {
  #flyerSheet .flyer-crop-stage-v121 img,
  #flyerSheet .flyer-studio-v121 .flyer-theme-chip-v118 { transition: none !important; transform: none !important; }
}

/* ============================================================================
   v121.0.0 · Visible themes, live flyer identity editing and professional crop
   ========================================================================== */
#flyerSheet .flyer-intro-v121 {
  min-height: 50px !important;
  padding: 9px 12px !important;
  border-color: rgba(35,240,216,.18) !important;
  background: linear-gradient(135deg, rgba(35,240,216,.075), rgba(255,63,134,.045), rgba(255,255,255,.02)) !important;
}
#flyerSheet .flyer-intro-v121 > div { align-content: center !important; }
#flyerSheet .flyer-intro-v121 > div > b { font-size: 13px !important; letter-spacing: -.015em !important; }
#flyerSheet .flyer-command-bar-v121 { min-height: 46px !important; }
#flyerSheet .flyer-command-bar-v121 > div { width: 100% !important; justify-content: space-between !important; }

/* Themes are a first-class control, never hidden inside Advanced Design. */
#flyerSheet .flyer-theme-gallery-v121 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
  padding: 11px !important;
  overflow: hidden !important;
  border: 1px solid rgba(35,240,216,.24) !important;
  border-radius: 17px !important;
  background:
    radial-gradient(circle at 98% 0%, rgba(255,63,134,.10), transparent 35%),
    linear-gradient(145deg, rgba(35,240,216,.075), rgba(6,16,23,.88)) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.18), 0 0 0 1px rgba(255,255,255,.025) inset !important;
}
#flyerSheet .flyer-theme-gallery-v121 > div:first-child {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}
#flyerSheet .flyer-theme-gallery-v121 > div:first-child > b {
  color: #f3fffc !important;
  font-size: 12.5px !important;
  font-weight: 1000 !important;
}
#flyerSheet .flyer-theme-gallery-v121 > div:first-child > small {
  max-width: 62% !important;
  color: rgba(231,255,250,.58) !important;
  font-size: 9.4px !important;
  line-height: 1.28 !important;
  text-align: right !important;
}
#flyerSheet .flyer-theme-gallery-v121 .flyer-theme-strip-v118 {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-template-rows: repeat(2, 64px) !important;
  grid-auto-columns: 116px !important;
  gap: 7px !important;
  padding: 2px 2px 8px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x proximity !important;
  scrollbar-gutter: stable !important;
}
#flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 39px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 7px !important;
  width: 100% !important;
  height: 64px !important;
  min-height: 64px !important;
  padding: 7px !important;
  border-radius: 14px !important;
  scroll-snap-align: start !important;
  transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease !important;
}
#flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 > i {
  width: 39px !important;
  height: 47px !important;
  min-height: 47px !important;
  border-radius: 11px !important;
}
#flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 > span {
  display: -webkit-box !important;
  overflow: hidden !important;
  color: inherit !important;
  font-size: 9.5px !important;
  font-weight: 950 !important;
  line-height: 1.18 !important;
  text-overflow: clip !important;
  white-space: normal !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}
#flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118.active::after {
  content: '✓' !important;
  position: absolute !important;
  top: 4px !important;
  right: 4px !important;
  display: grid !important;
  place-items: center !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  color: #031214 !important;
  background: #43f2cf !important;
  box-shadow: 0 4px 12px rgba(35,240,216,.28) !important;
  font-size: 10px !important;
  font-weight: 1000 !important;
}

/* Store identity and main title are always visible and update the preview live. */
#flyerSheet .flyer-primary-copy-v121 {
  display: grid !important;
  grid-template-columns: minmax(0, .42fr) minmax(0, .58fr) !important;
  gap: 9px !important;
  padding: 10px !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 16px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.018)) !important;
}
#flyerSheet .flyer-primary-copy-v121 > label {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-primary-copy-v121 small {
  color: rgba(224,255,249,.66) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}
#flyerSheet .flyer-primary-copy-v121 input {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 45px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(35,240,216,.15) !important;
  border-radius: 12px !important;
  color: #f7fffd !important;
  background: rgba(1,8,12,.66) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  outline: none !important;
}
#flyerSheet .flyer-primary-copy-v121 input:focus {
  border-color: rgba(35,240,216,.72) !important;
  box-shadow: 0 0 0 3px rgba(35,240,216,.10) !important;
}
#flyerSheet .flyer-copy-panel-v121 { border-color: rgba(255,255,255,.075) !important; }

/* The item editor is readable and the crop surface behaves like a real image editor. */
#flyerSheet .flyer-item-advanced-v120 > summary {
  min-height: 55px !important;
  padding: 9px 11px !important;
}
#flyerSheet .flyer-item-advanced-v120 > summary > span {
  font-size: 14px !important;
  font-weight: 1000 !important;
}
#flyerSheet .flyer-item-advanced-v120 > summary > small {
  font-size: 10.8px !important;
  line-height: 1.32 !important;
}
#flyerSheet .flyer-item-editor-v120 {
  gap: 11px !important;
  padding: 5px 11px 13px !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-item-label-v117 small,
#flyerSheet .flyer-item-editor-v120 .flyer-choice-block-v119 > small,
#flyerSheet .flyer-item-editor-v120 .flyer-item-zoom-v117 > span {
  font-size: 11px !important;
  line-height: 1.25 !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-item-label-v117 input {
  min-height: 46px !important;
  padding-inline: 12px !important;
  font-size: 12.4px !important;
}
#flyerSheet .flyer-item-editor-v120 .flyer-choice-pills-v119 > button {
  min-height: 43px !important;
  font-size: 10.7px !important;
  font-weight: 950 !important;
}
#flyerSheet .flyer-crop-fine-v121 {
  border-color: rgba(35,240,216,.18) !important;
  background: linear-gradient(150deg, rgba(35,240,216,.045), rgba(1,7,11,.72)) !important;
}
#flyerSheet .flyer-crop-fine-v121 > summary {
  min-height: 52px !important;
  grid-template-columns: minmax(125px, .35fr) minmax(0, .65fr) auto !important;
  padding: 8px 11px !important;
}
#flyerSheet .flyer-crop-fine-v121 > summary > span { font-size: 12.2px !important; }
#flyerSheet .flyer-crop-fine-v121 > summary > small { font-size: 10px !important; }
#flyerSheet .flyer-crop-fine-v121 > div { gap: 11px !important; padding: 0 11px 12px !important; }
#flyerSheet .flyer-crop-stage-v121 {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  min-height: 180px !important;
  overflow: hidden !important;
  border: 1px solid rgba(35,240,216,.30) !important;
  border-radius: 15px !important;
  outline: none !important;
  cursor: grab !important;
  touch-action: none !important;
  user-select: none !important;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px),
    #061018 !important;
  background-size: 33.333% 33.333% !important;
  box-shadow: 0 14px 36px rgba(0,0,0,.26) inset !important;
}
#flyerSheet .flyer-crop-stage-v121:focus-visible {
  border-color: #43f2cf !important;
  box-shadow: 0 0 0 3px rgba(35,240,216,.13), 0 14px 36px rgba(0,0,0,.26) inset !important;
}
#flyerSheet .flyer-crop-stage-v121.is-dragging { cursor: grabbing !important; }
#flyerSheet .flyer-crop-stage-v121 > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  transform: scale(var(--flyer-crop-zoom, 1)) !important;
  transform-origin: center !important;
  transition: transform .12s ease, object-position .12s ease !important;
  pointer-events: none !important;
  -webkit-user-drag: none !important;
}
#flyerSheet .flyer-crop-stage-v121.is-dragging > img { transition: none !important; }
#flyerSheet .flyer-crop-stage-v121::before,
#flyerSheet .flyer-crop-stage-v121::after {
  content: '' !important;
  position: absolute !important;
  z-index: 2 !important;
  pointer-events: none !important;
  background: rgba(255,255,255,.30) !important;
}
#flyerSheet .flyer-crop-stage-v121::before { left: 50% !important; top: 0 !important; width: 1px !important; height: 100% !important; }
#flyerSheet .flyer-crop-stage-v121::after { top: 50% !important; left: 0 !important; height: 1px !important; width: 100% !important; }
#flyerSheet .flyer-crop-stage-v121 > span {
  position: absolute !important;
  z-index: 3 !important;
  left: 50% !important;
  bottom: 10px !important;
  transform: translateX(-50%) !important;
  max-width: calc(100% - 20px) !important;
  padding: 6px 10px !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  border-radius: 999px !important;
  color: rgba(255,255,255,.91) !important;
  background: rgba(0,5,9,.72) !important;
  backdrop-filter: blur(8px) !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  text-align: center !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}
#flyerSheet .flyer-position-panel-v121 {
  display: grid !important;
  grid-template-columns: minmax(95px, .28fr) minmax(0, .72fr) !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 9px !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 13px !important;
  background: rgba(255,255,255,.025) !important;
}
#flyerSheet .flyer-position-panel-v121 > small {
  color: rgba(230,255,250,.65) !important;
  font-size: 10.5px !important;
  font-weight: 950 !important;
}
#flyerSheet .flyer-position-grid-v121 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(34px, 1fr)) !important;
  gap: 5px !important;
}
#flyerSheet .flyer-position-grid-v121 > button {
  min-width: 0 !important;
  min-height: 36px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 9px !important;
  color: rgba(255,255,255,.78) !important;
  background: rgba(255,255,255,.04) !important;
  font-size: 15px !important;
}
#flyerSheet .flyer-position-grid-v121 > button.active,
#flyerSheet .flyer-position-grid-v121 > button:hover {
  border-color: rgba(35,240,216,.56) !important;
  color: #051516 !important;
  background: #43f2cf !important;
}
#flyerSheet .flyer-item-focal-grid-v121 label {
  min-width: 0 !important;
  padding: 9px 10px !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.025) !important;
}
#flyerSheet .flyer-item-focal-grid-v121 span { font-size: 10.5px !important; }
#flyerSheet .flyer-reset-photo-v120 { min-height: 41px !important; padding: 0 14px !important; font-size: 10.7px !important; }

@media (min-width: 1600px) {
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-strip-v118 {
    grid-auto-columns: 126px !important;
  }
  #flyerSheet .flyer-primary-copy-v121 input { font-size: 13px !important; }
  #flyerSheet .flyer-crop-stage-v121 { min-height: 230px !important; }
}

@media (max-width: 1099px) {
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-strip-v118 {
    grid-auto-columns: 108px !important;
    grid-template-rows: repeat(2, 61px) !important;
  }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 {
    height: 61px !important;
    min-height: 61px !important;
  }
  #flyerSheet .flyer-primary-copy-v121 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-crop-stage-v121 { min-height: 205px !important; }
}

@media (max-width: 719px) {
  #flyerSheet .flyer-theme-gallery-v121 { padding: 9px !important; }
  #flyerSheet .flyer-theme-gallery-v121 > div:first-child {
    display: grid !important;
    justify-items: start !important;
    gap: 2px !important;
  }
  #flyerSheet .flyer-theme-gallery-v121 > div:first-child > small {
    display: block !important;
    max-width: none !important;
    font-size: 8.8px !important;
    text-align: left !important;
  }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-strip-v118 {
    grid-auto-columns: 101px !important;
    grid-template-rows: repeat(2, 58px) !important;
    gap: 6px !important;
  }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 {
    grid-template-columns: 32px minmax(0, 1fr) !important;
    height: 58px !important;
    min-height: 58px !important;
    padding: 6px !important;
  }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 > i {
    width: 32px !important;
    height: 42px !important;
    min-height: 42px !important;
  }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 > span { font-size: 8.8px !important; }
  #flyerSheet .flyer-primary-copy-v121 { padding: 8px !important; gap: 8px !important; }
  #flyerSheet .flyer-primary-copy-v121 input { min-height: 44px !important; font-size: 11.5px !important; }
  #flyerSheet .flyer-item-advanced-v120 > summary { min-height: 52px !important; }
  #flyerSheet .flyer-item-advanced-v120 > summary > span { font-size: 13px !important; }
  #flyerSheet .flyer-crop-fine-v121 > summary {
    grid-template-columns: minmax(0, 1fr) auto !important;
    min-height: 49px !important;
  }
  #flyerSheet .flyer-crop-fine-v121 > summary > small { display: none !important; }
  #flyerSheet .flyer-crop-stage-v121 { min-height: 170px !important; }
  #flyerSheet .flyer-position-panel-v121 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-position-grid-v121 > button { min-height: 39px !important; }
}

@media (max-width: 374px) {
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-strip-v118 { grid-auto-columns: 94px !important; }
  #flyerSheet .flyer-crop-stage-v121 { min-height: 155px !important; }
}

@media (hover:hover) and (pointer:fine) {
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(35,240,216,.48) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.22) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118,
  #flyerSheet .flyer-crop-stage-v121 > img {
    transition: none !important;
    animation: none !important;
  }
}

/* ============================================================================
   v121.0.0 · Launch-ready visible themes, editable identity and pro crop studio
   The 24 themes are always discoverable, essential copy is edited in the main
   flow, and crop positioning supports direct drag plus a precise position pad.
   ========================================================================== */

#flyerSheet .flyer-studio-v121 {
  grid-template-columns: minmax(590px, .92fr) minmax(680px, 1.08fr) !important;
  gap: 10px 14px !important;
}
#flyerSheet .flyer-controls-v121 {
  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
  padding: 10px 11px 16px !important;
}
/* Keep the launch-critical controls visible and predictable. */
#flyerSheet .flyer-controls-v121 .flyer-basic-row-v119 { order: 1 !important; }
#flyerSheet .flyer-controls-v121 .flyer-theme-gallery-v121 { order: 2 !important; }
#flyerSheet .flyer-controls-v121 .flyer-primary-copy-v121 { order: 3 !important; }
#flyerSheet .flyer-controls-v121 .flyer-picker-head-v119 { order: 4 !important; }
#flyerSheet .flyer-controls-v121 .flyer-picker-tools-v119 { order: 5 !important; }
#flyerSheet .flyer-controls-v121 .flyer-product-picker-v119 { order: 6 !important; }
#flyerSheet .flyer-controls-v121 .flyer-advanced-design-v119 { order: 7 !important; }
#flyerSheet .flyer-controls-v121 .flyer-copy-panel-v121 { order: 8 !important; }
#flyerSheet .flyer-controls-v121 .flyer-note-v117 { order: 9 !important; }

#flyerSheet .flyer-intro-v121 {
  min-height: 52px !important;
  padding: 9px 12px !important;
  background:
    radial-gradient(circle at 96% -18%, rgba(255,63,134,.17), transparent 35%),
    radial-gradient(circle at 1% 125%, rgba(35,240,216,.17), transparent 38%),
    linear-gradient(112deg, rgba(35,240,216,.10), rgba(5,15,21,.97) 52%, rgba(255,255,255,.025)) !important;
}
#flyerSheet .flyer-intro-v121 b { font-size: 14px !important; letter-spacing: -.015em !important; }
#flyerSheet .flyer-command-bar-v121 { min-height: 48px !important; }

/* Visible, usable 24-theme gallery. */
#flyerSheet .flyer-theme-gallery-v121 {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: stretch !important;
  gap: 8px !important;
  padding: 10px !important;
  overflow: hidden !important;
  border: 1px solid rgba(35,240,216,.22) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(255,63,134,.09), transparent 37%),
    linear-gradient(145deg, rgba(9,31,35,.94), rgba(3,11,16,.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 10px 28px rgba(0,0,0,.16) !important;
}
#flyerSheet .flyer-theme-gallery-v121::after {
  content: '24' !important;
  position: absolute !important;
  top: 9px !important;
  right: 10px !important;
  display: grid !important;
  place-items: center !important;
  min-width: 27px !important;
  height: 21px !important;
  padding: 0 6px !important;
  border: 1px solid rgba(35,240,216,.25) !important;
  border-radius: 999px !important;
  color: #9fffee !important;
  background: rgba(3,17,20,.76) !important;
  font-size: 9px !important;
  font-weight: 1000 !important;
}
#flyerSheet .flyer-theme-gallery-v121 > div:first-child {
  display: grid !important;
  gap: 2px !important;
  padding-right: 38px !important;
}
#flyerSheet .flyer-theme-gallery-v121 > div:first-child b {
  color: #f4fffd !important;
  font-size: 12.5px !important;
  line-height: 1.15 !important;
}
#flyerSheet .flyer-theme-gallery-v121 > div:first-child small {
  display: block !important;
  color: rgba(255,255,255,.56) !important;
  font-size: 9.3px !important;
  line-height: 1.35 !important;
}
#flyerSheet .flyer-theme-gallery-v121 .flyer-theme-strip-v118 {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  grid-auto-columns: auto !important;
  align-items: stretch !important;
  gap: 7px !important;
  max-height: 213px !important;
  padding: 1px 3px 5px 1px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scroll-snap-type: y proximity !important;
  scrollbar-gutter: stable !important;
}
#flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 {
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 7px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 48px !important;
  height: auto !important;
  padding: 6px 8px !important;
  border-radius: 13px !important;
  color: rgba(255,255,255,.82) !important;
  background: rgba(255,255,255,.042) !important;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease !important;
}
#flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 > i {
  width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  border-radius: 10px !important;
}
#flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 > span {
  overflow: visible !important;
  font-size: 9.5px !important;
  line-height: 1.16 !important;
  text-overflow: clip !important;
  white-space: normal !important;
}
#flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118.active {
  border-color: rgba(35,240,216,.72) !important;
  color: #f8fffd !important;
  background: linear-gradient(135deg, rgba(35,240,216,.17), rgba(255,63,134,.08)) !important;
  box-shadow: 0 0 0 1px rgba(35,240,216,.13) inset, 0 8px 22px rgba(0,0,0,.18) !important;
}

/* Store identity and main headline stay in the primary workflow. */
#flyerSheet .flyer-primary-copy-v121 {
  display: grid !important;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr) !important;
  gap: 8px !important;
  min-width: 0 !important;
  padding: 10px !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 17px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(35,240,216,.025)) !important;
}
#flyerSheet .flyer-primary-copy-v121 > label {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
}
#flyerSheet .flyer-primary-copy-v121 small {
  color: rgba(165,255,238,.75) !important;
  font-size: 9.5px !important;
  font-weight: 900 !important;
  letter-spacing: .02em !important;
}
#flyerSheet .flyer-primary-copy-v121 input {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 44px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 13px !important;
  color: #f7fffd !important;
  background: rgba(1,8,12,.72) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  box-shadow: none !important;
}
#flyerSheet .flyer-primary-copy-v121 input:focus {
  border-color: rgba(35,240,216,.62) !important;
  box-shadow: 0 0 0 3px rgba(35,240,216,.09) !important;
}

/* Professional direct-manipulation crop editor. */
#flyerSheet .flyer-crop-fine-v121 {
  overflow: hidden !important;
  border-color: rgba(35,240,216,.18) !important;
  background: linear-gradient(145deg, rgba(35,240,216,.045), rgba(2,9,13,.96)) !important;
}
#flyerSheet .flyer-crop-fine-v121 > summary {
  min-height: 53px !important;
  padding: 9px 11px !important;
}
#flyerSheet .flyer-crop-fine-v121 > summary > span {
  font-size: 12.5px !important;
  line-height: 1.15 !important;
}
#flyerSheet .flyer-crop-fine-v121 > summary > small {
  font-size: 10px !important;
  line-height: 1.3 !important;
}
#flyerSheet .flyer-crop-fine-v121 > div {
  gap: 11px !important;
  padding: 0 10px 12px !important;
}
#flyerSheet .flyer-crop-stage-v121 {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  min-height: 190px !important;
  aspect-ratio: 16 / 10 !important;
  overflow: hidden !important;
  border: 1px solid rgba(35,240,216,.28) !important;
  border-radius: 16px !important;
  cursor: grab !important;
  touch-action: none !important;
  user-select: none !important;
  background:
    linear-gradient(45deg, rgba(255,255,255,.025) 25%, transparent 25% 75%, rgba(255,255,255,.025) 75%),
    linear-gradient(45deg, rgba(255,255,255,.025) 25%, rgba(2,9,13,.88) 25% 75%, rgba(255,255,255,.025) 75%) !important;
  background-size: 18px 18px !important;
  background-position: 0 0, 9px 9px !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.025), 0 12px 30px rgba(0,0,0,.20) !important;
}
#flyerSheet .flyer-crop-stage-v121:focus-visible {
  outline: 3px solid rgba(35,240,216,.22) !important;
  outline-offset: 2px !important;
}
#flyerSheet .flyer-crop-stage-v121.is-dragging { cursor: grabbing !important; }
#flyerSheet .flyer-crop-stage-v121 img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  transform: scale(var(--flyer-crop-zoom, 1)) !important;
  transform-origin: center !important;
  pointer-events: none !important;
  user-select: none !important;
  transition: transform .14s ease, object-position .14s ease !important;
  will-change: transform, object-position !important;
}
#flyerSheet .flyer-crop-stage-v121.is-dragging img { transition: none !important; }
#flyerSheet .flyer-crop-stage-v121 > span {
  position: absolute !important;
  left: 50% !important;
  bottom: 9px !important;
  z-index: 2 !important;
  max-width: calc(100% - 20px) !important;
  padding: 5px 9px !important;
  transform: translateX(-50%) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 999px !important;
  color: #effffc !important;
  background: rgba(1,7,10,.68) !important;
  backdrop-filter: blur(10px) !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  text-align: center !important;
  pointer-events: none !important;
}
#flyerSheet .flyer-position-panel-v121 {
  display: grid !important;
  grid-template-columns: minmax(95px, auto) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
}
#flyerSheet .flyer-position-panel-v121 > small {
  color: rgba(255,255,255,.60) !important;
  font-size: 9.5px !important;
  font-weight: 850 !important;
  line-height: 1.3 !important;
}
#flyerSheet .flyer-position-grid-v121 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(38px, 1fr)) !important;
  gap: 5px !important;
  justify-self: end !important;
  width: min(100%, 190px) !important;
}
#flyerSheet .flyer-position-grid-v121 > button {
  display: grid !important;
  place-items: center !important;
  min-width: 0 !important;
  min-height: 38px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 10px !important;
  color: rgba(255,255,255,.76) !important;
  background: rgba(255,255,255,.045) !important;
  font-size: 15px !important;
  font-weight: 900 !important;
}
#flyerSheet .flyer-position-grid-v121 > button.active,
#flyerSheet .flyer-position-grid-v121 > button:hover {
  border-color: rgba(35,240,216,.54) !important;
  color: #06100f !important;
  background: linear-gradient(135deg, #23f0d8, #61f3b8) !important;
}
#flyerSheet .flyer-item-focal-grid-v121 {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
#flyerSheet .flyer-item-focal-grid-v121 label {
  padding: 8px 9px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.025) !important;
}
#flyerSheet .flyer-item-focal-grid-v121 span { font-size: 9.5px !important; }
#flyerSheet .flyer-item-focal-grid-v121 b { color: #73fbe4 !important; font-size: 10px !important; }

@media (hover:hover) and (pointer:fine) {
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(35,240,216,.34) !important;
    background: rgba(35,240,216,.08) !important;
  }
}

@media (max-width: 1399px) and (min-width: 1100px) {
  #flyerSheet .flyer-studio-v121 {
    grid-template-columns: minmax(540px, .94fr) minmax(560px, 1.06fr) !important;
  }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-strip-v118 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    max-height: 226px !important;
  }
}

@media (max-width: 1099px) {
  #flyerSheet .flyer-studio-v121 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-strip-v118 {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 719px) {
  #flyerSheet .flyer-controls-v121 { gap: 7px !important; padding: 7px 7px 14px !important; }
  #flyerSheet .flyer-theme-gallery-v121 {
    gap: 6px !important;
    padding: 8px !important;
    border-radius: 15px !important;
  }
  #flyerSheet .flyer-theme-gallery-v121 > div:first-child b { font-size: 11.5px !important; }
  #flyerSheet .flyer-theme-gallery-v121 > div:first-child small { font-size: 8.7px !important; }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-strip-v118 {
    grid-template-columns: none !important;
    grid-auto-flow: column !important;
    grid-auto-columns: 112px !important;
    max-height: none !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
  }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 {
    grid-template-columns: 31px minmax(0, 1fr) !important;
    min-height: 45px !important;
    scroll-snap-align: start !important;
  }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 > i {
    width: 31px !important;
    height: 31px !important;
    min-height: 31px !important;
  }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 > span { font-size: 8.8px !important; }
  #flyerSheet .flyer-primary-copy-v121 {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 7px !important;
    padding: 8px !important;
  }
  #flyerSheet .flyer-primary-copy-v121 input { min-height: 42px !important; font-size: 11.5px !important; }
  #flyerSheet .flyer-crop-stage-v121 { min-height: 165px !important; }
  #flyerSheet .flyer-position-panel-v121 { grid-template-columns: minmax(0, 1fr) !important; }
  #flyerSheet .flyer-position-grid-v121 { justify-self: stretch !important; width: 100% !important; }
  #flyerSheet .flyer-item-focal-grid-v121 { grid-template-columns: minmax(0, 1fr) !important; }
}

@media (prefers-reduced-motion: reduce) {
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118,
  #flyerSheet .flyer-crop-stage-v121 img {
    transition: none !important;
    animation: none !important;
  }
}

/* v121 launch fix: visible theme chooser must never be flex-shrunk away inside
   the scrollable Design column. The column scrolls; the controls keep their
   readable intrinsic height on every viewport. */
#flyerSheet .flyer-controls-v121 > .flyer-theme-gallery-v121,
#flyerSheet .flyer-controls-v121 > .flyer-primary-copy-v121,
#flyerSheet .flyer-controls-v121 > .flyer-basic-row-v119,
#flyerSheet .flyer-controls-v121 > .flyer-picker-head-v119,
#flyerSheet .flyer-controls-v121 > .flyer-picker-tools-v119,
#flyerSheet .flyer-controls-v121 > .flyer-advanced-design-v119,
#flyerSheet .flyer-controls-v121 > .flyer-copy-panel-v121,
#flyerSheet .flyer-controls-v121 > .flyer-note-v117 {
  flex: 0 0 auto !important;
}
#flyerSheet .flyer-theme-gallery-v121 .flyer-theme-strip-v118 {
  min-height: 48px !important;
}
@media (max-width: 719px) {
  #flyerSheet .flyer-theme-gallery-v121 { min-height: 103px !important; }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-strip-v118 {
    grid-template-rows: 45px !important;
    min-height: 51px !important;
  }
  #flyerSheet .flyer-theme-gallery-v121 .flyer-theme-chip-v118 {
    height: 45px !important;
    min-height: 45px !important;
  }
}

/* ============================================================================
   v124.0.0 · Localized account tools + full-width desktop Services workspace
   ========================================================================== */

/* The Inventory tool is a bright primary action, so both title and supporting
   copy use deliberate dark ink instead of low-contrast white. */
#inventoryOpenBtn.inventory-account-tool {
  color: #031815 !important;
  background:
    radial-gradient(circle at 86% 12%, rgba(255,255,255,.34), transparent 28%),
    linear-gradient(135deg, #20e6d1 0%, #55eda7 100%) !important;
  border-color: rgba(116,255,225,.72) !important;
  box-shadow: 0 12px 30px rgba(15,218,184,.16), inset 0 1px 0 rgba(255,255,255,.45) !important;
}
#inventoryOpenBtn.inventory-account-tool b {
  color: #021612 !important;
  font-size: 15px !important;
  line-height: 1.15 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.28) !important;
}
#inventoryOpenBtn.inventory-account-tool small {
  color: rgba(1,42,34,.86) !important;
  font-size: 9.5px !important;
  font-weight: 780 !important;
  line-height: 1.35 !important;
  text-shadow: none !important;
}
#inventoryOpenBtn.inventory-account-tool:hover,
#inventoryOpenBtn.inventory-account-tool:focus-visible {
  border-color: #b5fff0 !important;
  box-shadow: 0 16px 36px rgba(15,218,184,.24), 0 0 0 3px rgba(45,245,207,.12) !important;
}

@media (min-width: 1100px) {
  /* Earlier service rules capped the grid at 880px, leaving half of a wide
     desktop empty. The directory now owns the complete content lane. */
  body.directory-open #directoryView.directory {
    padding-right: 30px !important;
    padding-left: 30px !important;
    padding-bottom: 112px !important;
  }
  body.directory-open #directoryView .section-head,
  body.directory-open #directoryView #directoryTabs,
  body.directory-open #directoryView .chips,
  body.directory-open #directoryView .inline-search,
  body.directory-open #directoryList.discovery-v114-grid,
  body.directory-open #directoryList.discovery-v114-grid.service-grid {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  body.directory-open #directoryView .inline-search {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  body.directory-open #directoryList.discovery-v114-grid,
  body.directory-open #directoryList.discovery-v114-grid.service-grid {
    grid-template-columns: repeat(auto-fill, minmax(225px, 1fr)) !important;
    gap: 14px !important;
    align-content: start !important;
    padding-bottom: 28px !important;
  }
  body.directory-open #directoryList .discovery-v114-card {
    width: 100% !important;
    max-width: none !important;
  }

  /* On directory pages the assistant belongs to the page, not to the hidden
     feed card. It is centered in the desktop content lane just like elsewhere. */
  body.directory-open #globalAiDock,
  body.directory-open .vi-ai-dock#globalAiDock {
    position: fixed !important;
    left: calc(50vw + 123px) !important;
    right: auto !important;
    bottom: 18px !important;
    width: min(760px, calc(100vw - 330px)) !important;
    max-width: 760px !important;
    transform: translateX(-50%) !important;
    z-index: 160 !important;
  }
  body.directory-open #globalAiDock .vi-ai-search {
    width: 100% !important;
    box-shadow: 0 20px 48px rgba(0,0,0,.48), 0 0 0 1px rgba(45,245,207,.08) !important;
  }
}

@media (min-width: 1100px) and (max-width: 1279px) {
  body.directory-open #directoryList.discovery-v114-grid,
  body.directory-open #directoryList.discovery-v114-grid.service-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #inventoryOpenBtn.inventory-account-tool { transition: none !important; }
}

/* ViConnects v133 · calm, accountable notifications */
#notificationList{display:grid;gap:10px;min-width:0}.notification-v133-toolbar{position:sticky;top:-10px;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid rgba(34,244,214,.18);border-radius:18px;background:rgba(7,15,18,.95);backdrop-filter:blur(18px);box-shadow:0 10px 30px rgba(0,0,0,.22)}.notification-v133-toolbar>div:first-child strong,.notification-v133-toolbar>div:first-child span{display:block}.notification-v133-toolbar>div:first-child strong{font-size:14px}.notification-v133-toolbar>div:first-child span{margin-top:2px;color:rgba(237,255,252,.58);font-size:9px}.notification-v133-toolbar>div:last-child{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}.notification-v133-toolbar button,.notification-v133-toolbar select{min-height:34px;border:1px solid rgba(255,255,255,.11);border-radius:11px;padding:6px 9px;background:#111b1f;color:#f3fffc;font:inherit;font-size:9px;font-weight:900}.notification-v133-toolbar select{padding-right:25px}.notification-v133-toolbar button:disabled{opacity:.4}.notification-v133-sound.active{border-color:rgba(34,244,214,.34)!important;background:rgba(34,244,214,.09)!important;color:#7fffe8!important}.notification-v133-readall{color:#8fffe8!important}.notification-v133-list{display:grid;gap:8px}.notification-v133-item{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;border:1px solid rgba(255,255,255,.075);border-radius:19px;background:rgba(255,255,255,.035);overflow:hidden;transition:transform .18s ease,border-color .18s ease,background .18s ease}.notification-v133-item:hover{transform:translateY(-1px);border-color:rgba(34,244,214,.25)}.notification-v133-item.unread{border-color:rgba(34,244,214,.32);background:linear-gradient(135deg,rgba(34,244,214,.1),rgba(255,47,126,.055));box-shadow:inset 3px 0 #22f4d6}.notification-v133-item .notification-card{width:100%;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;opacity:1!important;text-align:left;grid-template-columns:42px minmax(0,1fr) auto;padding:11px}.notification-v133-item .notification-card>span:nth-child(2){min-width:0}.notification-v133-item .notification-card strong,.notification-v133-item .notification-card small,.notification-v133-item .notification-card time{display:block}.notification-v133-item .notification-card strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.notification-v133-item .notification-card small{margin-top:3px;font-size:10px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.notification-v133-item .notification-card time{margin-top:4px;color:rgba(237,255,252,.43);font-size:8px}.notification-v133-item .notification-card>b{display:grid;place-items:center;min-width:23px;background:none!important;color:#55f4d8!important}.notification-v133-item .notification-card>b i{width:8px;height:8px;border-radius:50%;background:#22f4d6;box-shadow:0 0 0 5px rgba(34,244,214,.09),0 0 15px rgba(34,244,214,.75)}.notification-v133-read{width:38px;border:0;border-left:1px solid rgba(255,255,255,.07);background:rgba(34,244,214,.04);color:#67f8df;font-size:13px;font-weight:1000}.notification-v133-read:hover{background:rgba(34,244,214,.12)}.notification-v133-empty{min-height:210px;display:grid;place-items:center;align-content:center;gap:10px;color:rgba(237,255,252,.64);text-align:center}.notification-v133-empty span{width:54px;height:54px;display:grid;place-items:center;border-radius:20px;border:1px solid rgba(34,244,214,.2);background:rgba(34,244,214,.07);color:#55f4d8;font-size:22px}.notification-v133-empty b{font-size:13px}
@media(max-width:620px){.notification-v133-toolbar{align-items:flex-start;display:grid}.notification-v133-toolbar>div:last-child{justify-content:flex-start}.notification-v133-toolbar button,.notification-v133-toolbar select{flex:1 1 auto}.notification-v133-item .notification-card{grid-template-columns:38px minmax(0,1fr) auto;padding:9px}.notification-v133-item .notification-card .notif-icon{width:38px;height:38px;border-radius:14px}.notification-v133-read{width:34px}}
@media(prefers-reduced-motion:reduce){.notification-v133-item{transition:none}.notification-v133-item .notification-card>b i{box-shadow:none}}

/* ============================================================================
   v137.0.0 · Precise location, useful empty markets and conversational Vi AI
   ========================================================================== */
.market-empty-v137{
  min-height:100%;height:auto!important;scroll-snap-align:start;overflow:auto!important;
  background:
    radial-gradient(circle at 14% 10%,rgba(34,244,214,.14),transparent 32%),
    radial-gradient(circle at 88% 88%,rgba(255,47,126,.09),transparent 30%),
    linear-gradient(155deg,#031315 0%,#03070b 54%,#08070d 100%)!important;
  color:#f5fffd;
}
.market-empty-v137-inner{width:min(920px,calc(100% - 30px));min-height:100%;margin:0 auto;padding:clamp(86px,12vh,132px) 0 calc(138px + var(--safe-bottom));display:grid;place-items:center;align-content:center;gap:18px;text-align:center;box-sizing:border-box}
.market-empty-v137-visual{position:relative;width:118px;height:118px;display:grid;place-items:center;margin-bottom:2px}
.market-empty-v137-visual i{position:absolute;inset:20px;border:1px solid rgba(53,246,213,.34);border-radius:50%;animation:marketRadar137 2.8s ease-out infinite}
.market-empty-v137-visual i:nth-of-type(2){animation-delay:.8s}.market-empty-v137-visual i:nth-of-type(3){animation-delay:1.6s}
.market-empty-v137-pin{position:relative;z-index:2;width:62px;height:62px;border-radius:24px;display:grid;place-items:center;background:linear-gradient(145deg,#1df1cf,#4ef0a5);color:#001814;box-shadow:0 22px 55px rgba(24,235,198,.24),inset 0 1px 0 rgba(255,255,255,.55)}
.market-empty-v137-pin svg{width:30px;height:30px;stroke:currentColor;fill:none;stroke-width:1.9}
@keyframes marketRadar137{0%{transform:scale(.45);opacity:.8}75%,100%{transform:scale(1.7);opacity:0}}
.market-empty-v137-copy{max-width:660px}.market-empty-v137-copy>small{display:block;color:#4ff5d6;font-size:10px;font-weight:1000;letter-spacing:.17em}.market-empty-v137-copy h1{margin:7px 0 8px;font-size:clamp(27px,4.3vw,49px);line-height:1.02;letter-spacing:-.055em;text-wrap:balance}.market-empty-v137-copy p{max-width:610px;margin:0 auto;color:rgba(236,255,251,.68);font-size:clamp(13px,1.45vw,16px);line-height:1.55;text-wrap:balance}
.market-empty-v137-post{margin-top:18px;min-height:52px;border:1px solid rgba(100,255,224,.66);border-radius:18px;padding:8px 18px 8px 9px;display:inline-flex;align-items:center;gap:10px;background:linear-gradient(135deg,#24f0d0,#4beaa7);color:#001915;font-weight:1000;box-shadow:0 16px 38px rgba(34,244,214,.19);transition:transform .18s ease,box-shadow .18s ease}
.market-empty-v137-post span{width:36px;height:36px;border-radius:13px;display:grid;place-items:center;background:rgba(0,20,17,.12);font-size:24px;line-height:1}.market-empty-v137-post:hover{transform:translateY(-2px);box-shadow:0 22px 48px rgba(34,244,214,.26)}
.nearby-market-v137{width:100%;max-width:920px;margin-top:8px;padding:14px;border:1px solid rgba(56,240,211,.15);border-radius:28px;background:rgba(6,18,21,.72);box-shadow:0 24px 70px rgba(0,0,0,.25);backdrop-filter:blur(20px);text-align:left}
.nearby-market-v137-head{display:flex;align-items:center;gap:10px;padding:2px 3px 12px}.nearby-market-v137-head>span{width:38px;height:38px;border-radius:14px;display:grid;place-items:center;background:rgba(35,240,205,.1);color:#43f3d3}.nearby-market-v137-head svg{width:19px;height:19px;fill:none;stroke:currentColor}.nearby-market-v137-head b,.nearby-market-v137-head small{display:block}.nearby-market-v137-head b{font-size:14px}.nearby-market-v137-head small{margin-top:2px;color:rgba(237,255,252,.54);font-size:10px}
.nearby-market-v137-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.nearby-market-v137-card{min-width:0;min-height:82px;display:grid;grid-template-columns:66px minmax(0,1fr) 20px;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.085);border-radius:20px;padding:8px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.025));color:#f4fffd;text-align:left;transition:transform .18s ease,border-color .18s ease,background .18s ease}
.nearby-market-v137-card:hover,.nearby-market-v137-card:focus-visible{transform:translateY(-2px);border-color:rgba(43,244,218,.34);background:linear-gradient(145deg,rgba(43,244,218,.095),rgba(255,255,255,.03))}.nearby-market-v137-card.is-loading{opacity:.65;pointer-events:none}
.nearby-market-v137-media{width:66px;height:62px;border-radius:15px;overflow:hidden;display:grid;place-items:center;background:#0a1518}.nearby-market-v137-media img{width:100%;height:100%;object-fit:cover}.nearby-market-v137-copy{min-width:0}.nearby-market-v137-copy strong,.nearby-market-v137-copy small,.nearby-market-v137-copy em{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nearby-market-v137-copy strong{font-size:13px}.nearby-market-v137-copy small{margin-top:4px;color:rgba(237,255,252,.62);font-size:9px}.nearby-market-v137-copy em{margin-top:4px;color:#4df2d2;font-size:9px;font-style:normal;font-weight:900}.nearby-market-v137-arrow{color:#5cf4d7;font-size:24px;text-align:center}

/* The dock is the single entry point for AI. The old header AI control is gone. */
.vi-ai-dock#globalAiDock{width:min(760px,calc(100vw - 36px))!important;max-width:760px!important;grid-template-columns:minmax(0,1fr)!important;gap:7px!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;z-index:190!important}
.vi-ai-dock#globalAiDock .vi-ai-search{height:54px!important;grid-template-columns:minmax(0,1fr) 46px!important;border-radius:21px!important;padding:5px!important;background:linear-gradient(145deg,rgba(4,14,17,.92),rgba(6,9,14,.9))!important;border-color:rgba(57,244,213,.25)!important;box-shadow:0 22px 55px rgba(0,0,0,.46),0 0 0 1px rgba(34,244,214,.04)!important}
.vi-ai-dock#globalAiDock .vi-ai-search input{height:44px!important;padding:0 14px!important;font-size:14px!important;font-weight:760!important;letter-spacing:-.015em!important}.vi-ai-dock#globalAiDock .vi-ai-search input::placeholder{color:rgba(226,255,250,.59)!important}
.vi-ai-dock#globalAiDock .vi-ai-search button{width:46px!important;height:44px!important;border-radius:16px!important;font-size:20px!important;transition:transform .16s ease,filter .16s ease!important}.vi-ai-dock#globalAiDock .vi-ai-search button:hover{transform:translateX(1px)!important;filter:brightness(1.05)!important}.vi-ai-dock#globalAiDock .vi-ai-search button.is-busy{animation:viAiPulse137 1.1s ease-in-out infinite}
@keyframes viAiPulse137{50%{opacity:.64;transform:scale(.94)}}
.vi-ai-dock#globalAiDock .vi-ai-mini-panel{max-height:min(64dvh,560px)!important;border-radius:27px!important;padding:12px!important;background:linear-gradient(160deg,rgba(3,14,17,.98),rgba(9,11,18,.97))!important;border-color:rgba(42,244,212,.24)!important;box-shadow:0 30px 90px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.06)!important}
.global-ai-v137-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:2px 38px 8px 4px;border-bottom:1px solid rgba(255,255,255,.065)}.global-ai-v137-head b{font-size:13px}.global-ai-v137-head small{color:#54f3d4;font-size:9px;font-weight:900}
.global-ai-v137-welcome{min-height:132px;display:grid;grid-template-columns:52px minmax(0,1fr);align-items:center;gap:13px;padding:16px;border-radius:21px;background:radial-gradient(circle at 4% 0,rgba(40,244,210,.12),transparent 45%),rgba(255,255,255,.025)}.global-ai-v137-welcome b{font-size:18px}.global-ai-v137-welcome p{margin:5px 0 0;color:rgba(237,255,252,.67);font-size:12px;line-height:1.5}
.global-ai-v137-thread{display:grid;gap:8px;max-height:330px;overflow:auto;padding:4px 2px;overscroll-behavior:contain}.global-ai-v137-bubble{max-width:88%;display:grid;grid-template-columns:30px minmax(0,1fr);gap:8px;align-items:start}.global-ai-v137-bubble.user{justify-self:end;grid-template-columns:minmax(0,1fr);max-width:82%}.global-ai-v137-bubble.user>span{display:none}.global-ai-v137-bubble>span{width:30px;height:30px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(145deg,#21efd0,#ff3f86);color:#031312;font-size:10px;font-weight:1000}.global-ai-v137-bubble p{margin:0;border:1px solid rgba(255,255,255,.09);border-radius:16px 16px 16px 5px;padding:10px 12px;background:rgba(255,255,255,.052);color:#effffb;font-size:12px;line-height:1.46;white-space:pre-wrap}.global-ai-v137-bubble.user p{border-radius:16px 16px 5px 16px;border-color:rgba(42,244,212,.2);background:rgba(42,244,212,.11)}.global-ai-v137-bubble.pending p{min-width:70px}.global-ai-v137-bubble.pending .twin-dots{margin:3px auto}
.global-ai-v137-suggestions{display:flex;gap:7px;overflow:auto;padding:2px 0;scrollbar-width:none}.global-ai-v137-suggestions::-webkit-scrollbar{display:none}.global-ai-v137-suggestions button{flex:0 0 auto;max-width:290px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid rgba(42,244,212,.18);border-radius:999px;padding:8px 11px;background:rgba(42,244,212,.075);color:#ddfff9;font-size:10px;font-weight:850}.global-ai-v137-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.global-ai-v137-results .result-card{min-width:0;border-radius:16px;padding:8px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09)}

@media(min-width:1100px){
  body:not(.directory-open) .vi-ai-dock#globalAiDock{left:calc(50% + 120px)!important;width:min(760px,calc(100vw - 360px))!important}
  .market-empty-v137-inner{padding-top:100px}
}
@media(max-width:820px){
  .nearby-market-v137-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .market-empty-v137-inner{width:min(100% - 22px,720px);padding-top:76px}
}
@media(max-width:520px){
  .market-empty-v137-inner{width:calc(100% - 16px);padding:52px 0 calc(134px + var(--safe-bottom));gap:13px;align-content:center}
  .market-empty-v137-visual{width:86px;height:86px}.market-empty-v137-pin{width:52px;height:52px;border-radius:19px}.market-empty-v137-pin svg{width:25px;height:25px}
  .market-empty-v137-copy h1{font-size:28px}.market-empty-v137-copy p{font-size:12px;line-height:1.48}.market-empty-v137-post{min-height:48px;margin-top:14px;border-radius:16px;font-size:12px}.market-empty-v137-post span{width:32px;height:32px}
  .nearby-market-v137{padding:10px;border-radius:22px}.nearby-market-v137-head{padding-bottom:9px}.nearby-market-v137-head small{display:none}.nearby-market-v137-grid{gap:7px}.nearby-market-v137-card{min-height:70px;grid-template-columns:48px minmax(0,1fr) 12px;gap:7px;padding:6px;border-radius:16px}.nearby-market-v137-media{width:48px;height:52px;border-radius:12px}.nearby-market-v137-copy strong{font-size:11px}.nearby-market-v137-copy small,.nearby-market-v137-copy em{font-size:8px}.nearby-market-v137-arrow{font-size:18px}
  .vi-ai-dock#globalAiDock{bottom:calc(76px + var(--safe-bottom))!important;width:calc(100vw - 18px)!important;max-width:none!important}.vi-ai-dock#globalAiDock .vi-ai-search{height:50px!important;grid-template-columns:minmax(0,1fr) 42px!important}.vi-ai-dock#globalAiDock .vi-ai-search input{height:40px!important;font-size:12.5px!important;padding:0 10px!important}.vi-ai-dock#globalAiDock .vi-ai-search button{width:42px!important;height:40px!important}.vi-ai-dock#globalAiDock .vi-ai-mini-panel{max-height:55dvh!important;border-radius:23px!important;padding:10px!important}.global-ai-v137-thread{max-height:290px}.global-ai-v137-bubble{max-width:94%}.global-ai-v137-bubble.user{max-width:90%}.global-ai-v137-bubble p{font-size:11px;padding:9px 10px}.global-ai-v137-results{grid-template-columns:1fr}.global-ai-v137-welcome{grid-template-columns:42px minmax(0,1fr);min-height:112px;padding:12px}.global-ai-v137-welcome b{font-size:16px}.global-ai-v137-welcome p{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.market-empty-v137-visual i,.vi-ai-dock#globalAiDock .vi-ai-search button.is-busy{animation:none!important}.market-empty-v137-post,.nearby-market-v137-card,.vi-ai-dock#globalAiDock .vi-ai-search button{transition:none!important}}

/* v137.0.0 · Current-market services action and balanced empty-market controls */
.market-empty-v137-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
}
.market-empty-v137-copy .market-empty-v137-actions .market-empty-v137-post {
  margin-top: 0 !important;
}
.market-empty-v137-services {
  min-height: 46px;
  padding: 0 18px;
  border: 1px solid rgba(69, 240, 209, .32);
  border-radius: 16px;
  background: rgba(8, 26, 29, .88);
  color: #eafffb;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  box-shadow: inset 0 1px rgba(255, 255, 255, .05);
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.market-empty-v137-services svg { width: 19px; height: 19px; color: #42ead0; }
.market-empty-v137-services:hover,
.market-empty-v137-services:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(69, 240, 209, .7);
  background: rgba(12, 45, 47, .96);
  outline: none;
}
@media (max-width: 520px) {
  .market-empty-v137-actions { display: grid; grid-template-columns: 1fr; }
  .market-empty-v137-actions > button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .market-empty-v137-services { transition: none; }
}

/* v139.0.1 · Stable local-area editing and keyboard-safe conversational Vi AI */
#locationSheet .location-market-card{overscroll-behavior:contain}
.location-manual-zone{position:relative;display:grid;gap:9px;margin:12px 0 14px;padding:11px;border:1px solid rgba(46,244,211,.2);border-radius:20px;background:linear-gradient(145deg,rgba(35,244,207,.075),rgba(255,255,255,.025));box-shadow:inset 0 1px rgba(255,255,255,.04)}
.location-manual-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 3px}.location-manual-head strong,.location-manual-head small{display:block}.location-manual-head strong{font-size:12px;color:#f3fffc}.location-manual-head small{margin-top:2px;color:rgba(235,255,251,.58);font-size:9px;line-height:1.35}.location-manual-head>span{width:30px;height:30px;border-radius:11px;display:grid;place-items:center;background:rgba(42,244,212,.1);color:#5df5dc;font-size:18px;font-weight:1000}
.location-manual-zone .location-manual-search{margin:0!important;border-color:rgba(50,245,213,.26)!important;background:rgba(2,10,13,.76)!important}.location-manual-zone .location-search-results{max-height:150px!important;margin:0;overscroll-behavior:contain}
.location-context-card.is-refreshing,.location-context-summary.is-refreshing,#nearbyAreaGrid.is-refreshing{opacity:.78;filter:saturate(.88);transition:opacity .16s ease,filter .16s ease}.location-context-card.is-refreshing::after,#nearbyAreaGrid.is-refreshing::after{content:"";position:absolute;right:12px;top:12px;width:9px;height:9px;border-radius:50%;background:#2cf2d2;box-shadow:0 0 0 5px rgba(44,242,210,.08);animation:vc-v138-pulse 1.15s ease-in-out infinite;pointer-events:none}#nearbyAreaGrid{position:relative}
.nearby-area-option{position:relative}.nearby-area-option.is-local{border-color:rgba(44,242,210,.26)!important;background:linear-gradient(145deg,rgba(44,242,210,.075),rgba(255,255,255,.035))!important}.nearby-area-option.is-local:not(.is-current):not(.is-selected)::after{content:"LOCAL";position:absolute;right:9px;bottom:7px;color:rgba(54,245,211,.72);font-size:7px;font-weight:1000;letter-spacing:.12em}
@keyframes vc-v138-pulse{0%,100%{transform:scale(.78);opacity:.45}50%{transform:scale(1);opacity:1}}

.global-ai-v138-shell{min-height:0;height:100%;display:flex;flex-direction:column;gap:9px}.global-ai-v138-scroll{min-height:0;display:grid;gap:10px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(46,244,213,.35) transparent;padding:1px 2px 6px}.global-ai-v138-scroll::-webkit-scrollbar{width:5px}.global-ai-v138-scroll::-webkit-scrollbar-thumb{border-radius:999px;background:rgba(52,244,211,.32)}
.global-ai-v137-head{align-items:center!important;flex:0 0 auto}.global-ai-v137-head>div{min-width:0;display:grid;gap:2px}.global-ai-v137-head>div>b{font-size:14px}.global-ai-v137-head>div>small{font-size:8px!important;text-transform:uppercase;letter-spacing:.12em;color:rgba(222,255,248,.55)!important}.global-ai-v137-head>em{font-style:normal;flex:0 0 auto;max-width:42%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid rgba(44,242,210,.17);border-radius:999px;padding:5px 8px;color:#50f0d4;font-size:9px;font-weight:900;background:rgba(44,242,210,.06)}
.global-ai-results-head-v138{display:flex;align-items:end;justify-content:space-between;gap:10px;padding:9px 2px 0;border-top:1px solid rgba(255,255,255,.065)}.global-ai-results-head-v138>div{min-width:0;display:grid}.global-ai-results-head-v138 small{color:rgba(228,255,250,.58);font-size:8px;text-transform:uppercase;letter-spacing:.11em;font-weight:900}.global-ai-results-head-v138 b{font-size:14px;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.global-ai-results-head-v138>span{flex:0 0 auto;color:#4cf1d4;font-size:9px;font-weight:900;text-align:right}.global-ai-results-note-v138{margin:-3px 2px 1px;color:rgba(232,255,251,.62);font-size:10px;line-height:1.4}
.global-ai-v137-results{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}.ai-market-result-v138{position:relative;min-width:0;display:grid!important;grid-template-columns:70px minmax(0,1fr) 25px!important;align-items:center!important;gap:9px!important;min-height:84px!important;padding:7px!important;text-align:left!important;overflow:hidden!important;border-radius:18px!important;border:1px solid rgba(255,255,255,.09)!important;background:linear-gradient(145deg,rgba(255,255,255,.062),rgba(4,13,17,.84))!important;box-shadow:0 12px 26px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.055)!important;transition:transform .16s ease,border-color .16s ease,background .16s ease!important}.ai-market-result-v138:hover,.ai-market-result-v138:focus-visible{transform:translateY(-1px);border-color:rgba(45,244,213,.40)!important;background:linear-gradient(145deg,rgba(45,244,213,.10),rgba(4,13,17,.90))!important;outline:none}
.ai-market-result-v138-media{position:relative;display:block;width:70px;height:70px;border-radius:14px;overflow:hidden;background:radial-gradient(circle at 50% 30%,rgba(48,244,215,.13),rgba(3,8,12,.9));border:1px solid rgba(255,255,255,.10)}.ai-market-result-v138-media img{display:block;width:100%!important;height:100%!important;border-radius:0!important;object-fit:contain!important;background:rgba(255,255,255,.025)!important}.ai-market-result-v138.is-service .ai-market-result-v138-media img{object-fit:cover!important}.ai-market-result-v138-media i{position:absolute;left:5px;top:5px;max-width:calc(100% - 10px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:999px;padding:3px 5px;background:rgba(3,12,15,.82);color:#46f1d2;font-style:normal;font-size:6.5px;font-weight:1000;letter-spacing:.08em}
.ai-market-result-v138-copy{min-width:0;display:grid;gap:3px}.ai-market-result-v138-copy strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;color:#fff;font-size:11px;line-height:1.18}.ai-market-result-v138-copy em{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#4cf1d4;font-style:normal;font-size:8.8px;font-weight:850}.ai-market-result-v138-copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:rgba(230,255,250,.58);font-size:8.4px}.ai-market-result-v138>b{width:25px;height:25px;display:grid;place-items:center;border-radius:10px;color:#061615;background:#47efd0}.ai-market-result-v138>b svg{width:13px;height:13px}

@media(min-width:821px){body.global-ai-chat-open #globalAiDock{left:50%!important;bottom:24px!important;transform:translateX(-50%)!important;width:min(780px,72vw)!important;max-width:780px!important;grid-template-columns:minmax(0,1fr)!important;z-index:260!important}body.global-ai-chat-open #globalAiDock .vi-ai-mini-panel{max-height:min(70vh,690px)!important;min-height:330px!important;margin-bottom:8px!important;padding:14px!important;border-radius:28px!important}body.global-ai-chat-open #globalAiDock .global-ai-v138-scroll{max-height:min(61vh,600px)}body.global-ai-chat-open #globalAiDock .global-ai-v137-thread{max-height:none!important;overflow:visible!important}}
@media(max-width:820px){#locationSheet .location-market-card{padding-top:max(14px,env(safe-area-inset-top))!important}.location-manual-zone{margin-top:9px;padding:9px;border-radius:18px}.location-manual-head small{font-size:8.5px}.location-manual-zone .location-search-results{max-height:122px!important}.nearby-area-option.is-local:not(.is-current):not(.is-selected)::after{display:none}body.global-ai-chat-open{overflow:hidden!important;overscroll-behavior:none!important}body.global-ai-chat-open .bottom-nav,body.global-ai-chat-open .desktop-shell,body.global-ai-chat-open .desktop-sidebar{visibility:hidden!important;pointer-events:none!important}body.global-ai-chat-open #globalAiDock,body.global-ai-chat-open .vi-ai-dock#globalAiDock{position:fixed!important;left:0!important;right:0!important;top:var(--vc-vvo,0px)!important;bottom:auto!important;transform:none!important;width:100vw!important;max-width:none!important;height:var(--vc-vvh,100dvh)!important;min-height:0!important;margin:0!important;padding:calc(7px + env(safe-area-inset-top)) 8px calc(7px + env(safe-area-inset-bottom))!important;display:flex!important;flex-direction:column!important;gap:7px!important;background:radial-gradient(circle at 20% 4%,rgba(35,239,207,.12),transparent 42%),radial-gradient(circle at 96% 20%,rgba(255,57,133,.10),transparent 38%),#02070b!important;z-index:420!important;overflow:hidden!important;box-sizing:border-box!important}body.global-ai-chat-open #globalAiDock .vi-ai-mini-panel{order:1!important;flex:1 1 auto!important;min-height:0!important;max-height:none!important;width:100%!important;margin:0!important;padding:10px!important;border-radius:24px 24px 18px 18px!important;overflow:hidden!important;display:block!important;background:linear-gradient(160deg,rgba(4,12,16,.97),rgba(7,18,23,.96))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.07)!important}body.global-ai-chat-open #globalAiDock .vi-ai-search{order:2!important;flex:0 0 auto!important;width:100%!important;height:52px!important;margin:0!important;padding:5px!important;border-radius:20px!important;grid-template-columns:minmax(0,1fr) 42px!important;background:rgba(5,13,17,.98)!important;box-shadow:0 -10px 32px rgba(0,0,0,.36),0 0 0 1px rgba(45,244,213,.13)!important}body.global-ai-chat-open #globalAiDock .vi-ai-search input{height:42px!important;font-size:14px!important;padding:0 12px!important}body.global-ai-chat-open #globalAiDock .vi-ai-search button{width:42px!important;height:42px!important;border-radius:16px!important}body.global-ai-chat-open #globalAiDock .global-ai-v138-shell{height:100%!important;min-height:0!important}body.global-ai-chat-open #globalAiDock .global-ai-v138-scroll{flex:1 1 auto!important;min-height:0!important;overflow:auto!important;padding:2px 1px 12px!important;scroll-padding-bottom:16px!important}body.global-ai-chat-open #globalAiDock .global-ai-v137-thread{max-height:none!important;overflow:visible!important;padding:4px 1px!important}body.global-ai-chat-open #globalAiDock .global-ai-v137-head{padding:3px 38px 9px 4px!important;background:rgba(4,12,16,.94)!important;position:sticky!important;top:0!important;z-index:4!important}body.global-ai-chat-open #globalAiDock .vi-ai-panel-close{position:absolute!important;right:15px!important;top:calc(15px + env(safe-area-inset-top))!important;z-index:8!important}body.global-ai-chat-open #globalAiDock .global-ai-v137-results{grid-template-columns:1fr!important}.ai-market-result-v138{grid-template-columns:82px minmax(0,1fr) 28px!important;min-height:96px!important;border-radius:20px!important}.ai-market-result-v138-media{width:82px;height:82px;border-radius:16px}.ai-market-result-v138-copy strong{font-size:12px}.global-ai-v137-bubble p{font-size:12px!important}body.global-ai-keyboard-open.global-ai-chat-open #globalAiDock{top:var(--vc-vvo,0px)!important;height:var(--vc-vvh,100dvh)!important}body.global-ai-keyboard-open.global-ai-chat-open #globalAiDock .global-ai-v137-welcome{display:none!important}body.global-ai-keyboard-open.global-ai-chat-open #globalAiDock .global-ai-v137-thread{max-height:132px!important}body.global-ai-keyboard-open.global-ai-chat-open #globalAiDock .global-ai-v137-results{display:grid!important}}
@media(max-width:380px){body.global-ai-chat-open #globalAiDock{padding-left:6px!important;padding-right:6px!important}.ai-market-result-v138{grid-template-columns:68px minmax(0,1fr) 25px!important;min-height:82px!important;padding:6px!important}.ai-market-result-v138-media{width:68px;height:68px}.global-ai-v137-head b{font-size:12px}.global-ai-v137-head small{font-size:8px}}
@media(prefers-reduced-motion:reduce){.location-context-card,.location-context-summary,.nearby-area-grid,.ai-market-result-v138{transition:none!important}.location-context-card.is-refreshing::after,#nearbyAreaGrid.is-refreshing::after{animation:none!important}}

/* ============================================================================
   v139.0.1 · More globe, bottom buying-area picker, clear AI/dialog controls
   - compact More trigger uses a lightweight rotating globe instead of dots
   - buying-area search lives after nearby markets and duplicate summary is gone
   - Vi AI close action is part of the sticky header, never inside chat content
   - mobile Details title/close respect safe areas and gallery arrows hug the sides
   ========================================================================== */

/* Header More control */
#statusDot.tools-more-trigger,
.ghost-dot.action-menu-trigger.tools-more-trigger {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 74px !important;
  max-width: 88px !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 8px 0 10px !important;
  display: inline-flex !important;
  grid-template-columns: none !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  border-radius: 999px !important;
  color: #effffb !important;
  background: linear-gradient(145deg, rgba(255,255,255,.085), rgba(30,244,210,.055)) !important;
  border: 1px solid rgba(255,255,255,.17) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.08) !important;
  overflow: hidden !important;
}
#statusDot.tools-more-trigger > i { display: none !important; }
#statusDot.tools-more-trigger > b {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}
#statusDot .tools-more-label {
  display: inline-block !important;
  min-width: 0 !important;
  color: currentColor !important;
  font-size: 9px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  letter-spacing: .055em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}
#statusDot .tools-orbit {
  position: relative !important;
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  color: #45efd1 !important;
  filter: drop-shadow(0 0 7px rgba(48,244,215,.42)) !important;
}
#statusDot .tools-orbit svg {
  width: 20px !important;
  height: 20px !important;
  overflow: visible !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.55 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  animation: vc-v139-globe-spin 5.4s linear infinite !important;
}
#statusDot .tools-orbit-ring {
  stroke: #ff4f8d !important;
  stroke-width: 2 !important;
  stroke-dasharray: 4 4 !important;
  animation: vc-v139-orbit-dash 1.6s linear infinite !important;
}
#statusDot.tools-more-trigger:hover,
#statusDot.tools-more-trigger:focus-visible {
  border-color: rgba(52,244,211,.44) !important;
  background: linear-gradient(145deg, rgba(52,244,211,.14), rgba(255,73,137,.07)) !important;
  outline: none !important;
}
#statusDot.tools-more-trigger.is-open {
  color: #031512 !important;
  background: linear-gradient(135deg, #2cf1d4, #67efad) !important;
  border-color: rgba(255,255,255,.48) !important;
}
#statusDot.tools-more-trigger.is-open .tools-orbit { color: #05201b !important; }
#statusDot.tools-more-trigger.is-open .tools-orbit-ring { stroke: #8f164a !important; }
@keyframes vc-v139-globe-spin { to { transform: rotate(360deg); } }
@keyframes vc-v139-orbit-dash { to { stroke-dashoffset: -16; } }

@media (min-width: 1100px) {
  .topbar #statusDot.tools-more-trigger,
  .topbar .ghost-dot.action-menu-trigger.tools-more-trigger {
    flex: 0 0 78px !important;
    width: 78px !important;
    min-width: 78px !important;
    max-width: 78px !important;
  }
}
@media (min-width: 1100px) and (max-width: 1320px) {
  .topbar #statusDot.tools-more-trigger,
  .topbar .ghost-dot.action-menu-trigger.tools-more-trigger {
    flex-basis: 68px !important;
    width: 68px !important;
    min-width: 68px !important;
    max-width: 68px !important;
    padding-inline: 7px !important;
  }
  #statusDot .tools-more-label { font-size: 8px !important; }
  #statusDot .tools-orbit,
  #statusDot .tools-orbit svg { width: 18px !important; height: 18px !important; flex-basis: 18px !important; }
}
@media (max-width: 560px) {
  #statusDot.tools-more-trigger,
  .ghost-dot.action-menu-trigger.tools-more-trigger {
    min-width: 68px !important;
    max-width: 72px !important;
    padding: 0 7px 0 8px !important;
    gap: 5px !important;
  }
  #statusDot .tools-more-label { font-size: 8px !important; letter-spacing: .035em !important; }
  #statusDot .tools-orbit,
  #statusDot .tools-orbit svg { width: 18px !important; height: 18px !important; flex-basis: 18px !important; }
}
@media (max-width: 420px) {
  .location-row .area-chip { max-width: 142px !important; }
  .location-row .account-top-chip { max-width: 92px !important; }
  #statusDot.tools-more-trigger,
  .ghost-dot.action-menu-trigger.tools-more-trigger { min-width: 61px !important; max-width: 61px !important; padding-inline: 6px !important; gap: 4px !important; }
  #statusDot .tools-more-label { font-size: 7.2px !important; }
  #statusDot .tools-orbit,
  #statusDot .tools-orbit svg { width: 17px !important; height: 17px !important; flex-basis: 17px !important; }
}

/* Location: nearby choices first, manual buying-area selection last. */
#locationSheet .location-market-card {
  padding-bottom: max(18px, env(safe-area-inset-bottom, 0px)) !important;
  scroll-padding-bottom: 18px !important;
}
#locationSheet .nearby-market-section {
  margin: 8px 0 10px !important;
  padding-bottom: 2px !important;
}
#locationSheet .location-manual-zone-bottom {
  position: relative !important;
  margin: 14px 0 2px !important;
  padding: 12px !important;
  border: 1px solid rgba(53,244,213,.28) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 92% 8%, rgba(255,72,137,.12), transparent 32%),
    linear-gradient(145deg, rgba(35,244,207,.11), rgba(255,255,255,.035)) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
#locationSheet .location-manual-zone-bottom::before {
  content: '' !important;
  position: absolute !important;
  left: 18px !important;
  right: 18px !important;
  top: 0 !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, transparent, #32efd2, #ff4f8d, transparent) !important;
  opacity: .85 !important;
}
#locationSheet .location-manual-zone-bottom .location-manual-head {
  align-items: center !important;
  gap: 10px !important;
}
#locationSheet .location-manual-zone-bottom .location-manual-head > span {
  width: 36px !important;
  height: 36px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 14px !important;
  background: rgba(47,241,210,.12) !important;
  border: 1px solid rgba(47,241,210,.20) !important;
  color: #48efd2 !important;
  font-size: 19px !important;
}
#locationSheet .location-manual-zone-bottom .location-manual-search {
  min-height: 48px !important;
  border-radius: 17px !important;
  background: rgba(2,10,13,.88) !important;
}
#locationSheet .location-manual-zone-bottom .location-search-results {
  max-height: 132px !important;
  margin-top: 1px !important;
}
#locationSheet .location-context-summary { display: none !important; }

@media (max-width: 560px) {
  #locationSheet .location-manual-zone-bottom { margin-top: 12px !important; padding: 10px !important; border-radius: 19px !important; }
  #locationSheet .location-manual-zone-bottom .location-manual-head strong { font-size: 13px !important; }
  #locationSheet .location-manual-zone-bottom .location-manual-head small { font-size: 8.7px !important; line-height: 1.35 !important; }
  #locationSheet .location-manual-zone-bottom .location-manual-head > span { width: 32px !important; height: 32px !important; border-radius: 12px !important; }
  #locationSheet .location-manual-zone-bottom .location-manual-search { min-height: 45px !important; }
}

/* Vi AI close belongs to the sticky header instead of floating over messages. */
#globalAiPanel .global-ai-v137-head {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto 38px !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 48px !important;
  padding: 5px 4px 10px !important;
}
#globalAiPanel .global-ai-v137-head .vi-ai-panel-close,
body.global-ai-chat-open #globalAiDock .global-ai-v137-head .vi-ai-panel-close {
  position: static !important;
  inset: auto !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.07) !important;
  color: #fff !important;
  font-size: 20px !important;
  line-height: 1 !important;
  box-shadow: none !important;
  z-index: 6 !important;
}
#globalAiPanel .global-ai-v137-head .vi-ai-panel-close:hover,
#globalAiPanel .global-ai-v137-head .vi-ai-panel-close:focus-visible {
  border-color: rgba(255,88,145,.38) !important;
  background: rgba(255,66,129,.13) !important;
  outline: none !important;
}
@media (max-width: 820px) {
  body.global-ai-chat-open #globalAiDock .global-ai-v137-head {
    grid-template-columns: minmax(0,1fr) auto 38px !important;
    padding: 4px 3px 9px !important;
    top: 0 !important;
  }
  body.global-ai-chat-open #globalAiDock .global-ai-v137-head > em { max-width: 108px !important; }
}
@media (max-width: 380px) {
  #globalAiPanel .global-ai-v137-head { gap: 5px !important; grid-template-columns: minmax(0,1fr) auto 34px !important; }
  #globalAiPanel .global-ai-v137-head .vi-ai-panel-close { width: 34px !important; height: 34px !important; min-width: 34px !important; min-height: 34px !important; }
  #globalAiPanel .global-ai-v137-head > em { max-width: 82px !important; font-size: 8px !important; }
}

/* Details: safe header and side-mounted gallery navigation. */
#detailSheet .detail-media { position: relative !important; }
#detailSheet .detail-nav-btn {
  position: absolute !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  z-index: 12 !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  border-radius: 16px !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  color: #fff !important;
  background: rgba(2,8,11,.68) !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.34) !important;
  opacity: .92 !important;
}
#detailSheet .detail-nav-btn.prev { left: 12px !important; right: auto !important; }
#detailSheet .detail-nav-btn.next { right: 12px !important; left: auto !important; }
#detailSheet .detail-nav-btn svg { width: 19px !important; height: 19px !important; stroke: currentColor !important; stroke-width: 2.5 !important; }
#detailSheet .detail-nav-btn:hover,
#detailSheet .detail-nav-btn:focus-visible {
  opacity: 1 !important;
  color: #041512 !important;
  background: linear-gradient(135deg, #2cf1d4, #59efad) !important;
  border-color: rgba(255,255,255,.48) !important;
  outline: none !important;
}

@media (max-width: 899px) {
  #detailSheet .detail-card > .sheet-bar { display: none !important; }
  #detailSheet .detail-card > .sheet-title {
    position: sticky !important;
    top: 0 !important;
    z-index: 30 !important;
    min-height: calc(66px + env(safe-area-inset-top, 0px)) !important;
    margin: 0 -10px !important;
    padding: calc(14px + env(safe-area-inset-top, 0px)) 12px 10px 14px !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 42px !important;
    align-items: center !important;
    gap: 10px !important;
    background: linear-gradient(180deg, rgba(2,8,11,.995), rgba(2,8,11,.96)) !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    backdrop-filter: blur(16px) !important;
  }
  #detailSheet .detail-card > .sheet-title > div { min-width: 0 !important; display: grid !important; gap: 2px !important; }
  #detailSheet .detail-card > .sheet-title small {
    display: block !important;
    color: #42efd1 !important;
    font-size: 7.5px !important;
    font-weight: 1000 !important;
    letter-spacing: .13em !important;
    line-height: 1 !important;
  }
  #detailSheet .detail-card > .sheet-title h3 {
    max-width: none !important;
    margin: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    color: #fff !important;
    font-size: clamp(16px, 4.8vw, 21px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.035em !important;
  }
  #detailSheet .detail-card > .sheet-title .xbtn {
    position: static !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    align-self: center !important;
    border-radius: 15px !important;
    background: rgba(255,255,255,.08) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: none !important;
  }
  #detailSheet #detailBody { padding-top: 8px !important; }
  #detailSheet .detail-nav-btn {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    border-radius: 14px !important;
  }
  #detailSheet .detail-nav-btn.prev { left: 8px !important; }
  #detailSheet .detail-nav-btn.next { right: 8px !important; }
}

@media (max-width: 420px) {
  #detailSheet .detail-card > .sheet-title {
    min-height: calc(62px + env(safe-area-inset-top, 0px)) !important;
    padding-top: calc(12px + env(safe-area-inset-top, 0px)) !important;
  }
  #detailSheet .detail-card > .sheet-title h3 { font-size: 17px !important; }
  #detailSheet .detail-nav-btn { width: 36px !important; height: 36px !important; min-width: 36px !important; min-height: 36px !important; border-radius: 13px !important; }
  #detailSheet .detail-nav-btn svg { width: 17px !important; height: 17px !important; }
}

@media (prefers-reduced-motion: reduce) {
  #statusDot .tools-orbit svg,
  #statusDot .tools-orbit-ring { animation: none !important; }
}

/* v139 desktop Details title bar also keeps the close action in normal flow. */
#detailSheet .detail-card > .sheet-title {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 42px !important;
  align-items: center !important;
  gap: 12px !important;
}
#detailSheet .detail-card > .sheet-title > div { min-width: 0 !important; }
#detailSheet .detail-card > .sheet-title .xbtn {
  position: static !important;
  inset: auto !important;
  justify-self: end !important;
  align-self: center !important;
  margin: 0 !important;
}

/* v139 final gallery control refinement: arrows live below media, never over it. */
#detailSheet .detail-gallery-nav {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0,1fr) 44px !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 9px 0 8px !important;
  padding: 7px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 19px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(34,244,214,.035)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
}
#detailSheet .detail-gallery-nav .detail-nav-btn {
  position: static !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  justify-self: center !important;
  border-radius: 14px !important;
  background: rgba(3,11,14,.84) !important;
  border-color: rgba(53,244,213,.22) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.24) !important;
}
#detailSheet .detail-gallery-position {
  min-width: 0 !important;
  display: grid !important;
  place-items: center !important;
  gap: 1px !important;
  text-align: center !important;
}
#detailSheet .detail-gallery-position b {
  color: #f5fffd !important;
  font-size: 12px !important;
  font-weight: 1000 !important;
  letter-spacing: .02em !important;
}
#detailSheet .detail-gallery-position small {
  color: rgba(231,255,250,.52) !important;
  font-size: 7.5px !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}
#detailSheet .detail-thumbs { margin-top: 0 !important; }

@media (max-width: 899px) {
  #detailSheet .detail-card > .sheet-title {
    min-height: max(72px, calc(64px + env(safe-area-inset-top, 0px))) !important;
    padding-top: max(28px, calc(12px + env(safe-area-inset-top, 0px))) !important;
  }
  #detailSheet .detail-gallery-nav {
    grid-template-columns: 40px minmax(0,1fr) 40px !important;
    margin: 7px 0 7px !important;
    padding: 6px !important;
    border-radius: 17px !important;
  }
  #detailSheet .detail-gallery-nav .detail-nav-btn {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    border-radius: 13px !important;
  }
}

@media (max-width: 420px) {
  #detailSheet .detail-card > .sheet-title {
    min-height: max(70px, calc(62px + env(safe-area-inset-top, 0px))) !important;
    padding-top: max(27px, calc(11px + env(safe-area-inset-top, 0px))) !important;
  }
  #detailSheet .detail-gallery-nav {
    grid-template-columns: 38px minmax(0,1fr) 38px !important;
    gap: 7px !important;
  }
  #detailSheet .detail-gallery-nav .detail-nav-btn {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
  }
}

/* v139 close button remains fully inside the Details title bar at every width. */
#detailSheet .detail-card > .sheet-title .xbtn,
#detailSheet .detail-card > .sheet-title .detail-close-btn {
  transform: none !important;
  translate: none !important;
}

/* v139 final media-grid correction: reserve explicit rows for image, controls and thumbnails. */
#detailSheet .detail-v113-media {
  grid-template-rows: minmax(0, 1fr) auto auto !important;
}
@media (max-width: 899px) {
  #detailSheet .detail-v113-media {
    grid-template-rows: auto auto auto !important;
    align-content: start !important;
  }
}

/* v139 responsive gallery placement: compact lower-corner dock on desktop, separate row on touch layouts. */
#detailSheet .detail-v113-media {
  grid-template-rows: minmax(0, 1fr) auto !important;
}
#detailSheet .detail-gallery-nav {
  position: absolute !important;
  left: 14px !important;
  right: auto !important;
  bottom: 86px !important;
  z-index: 14 !important;
  width: 188px !important;
  margin: 0 !important;
  padding: 6px !important;
  grid-template-columns: 40px minmax(0,1fr) 40px !important;
  border-radius: 17px !important;
  background: rgba(2,10,13,.82) !important;
  backdrop-filter: blur(14px) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.055) !important;
}
#detailSheet .detail-gallery-nav .detail-nav-btn {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
}
@media (max-width: 899px) {
  #detailSheet .detail-v113-media {
    grid-template-rows: auto auto auto !important;
    align-content: start !important;
  }
  #detailSheet .detail-gallery-nav {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    margin: 7px 0 !important;
    padding: 6px !important;
    grid-template-columns: 40px minmax(0,1fr) 40px !important;
    background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(34,244,214,.035)) !important;
    backdrop-filter: none !important;
  }
}

/* ============================================================================
   v140.0.0 · Visible More globe + safe empty-market header + edge-to-edge shelf
   - resets legacy .ghost-dot span dimensions so More and the globe stay visible
   - measures the mobile command row without clipping its final control
   - keeps empty-market content below the complete mobile header
   - stretches contextual product/service cards across the available stage
   ========================================================================== */

/* Legacy .ghost-dot span rules assigned every child a 9px green dot. Restore
   the semantic label and SVG globe without changing the tools-menu behavior. */
#statusDot.tools-more-trigger {
  opacity: 1 !important;
  overflow: visible !important;
  isolation: isolate !important;
}
#statusDot .tools-more-label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: auto !important;
  min-width: max-content !important;
  max-width: none !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  animation: none !important;
  transform: none !important;
  opacity: 1 !important;
  overflow: visible !important;
}
#statusDot .tools-orbit {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  max-width: 20px !important;
  max-height: 20px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
  animation: none !important;
  transform: none !important;
  opacity: 1 !important;
  overflow: visible !important;
}
#statusDot.pulse .tools-more-label,
#statusDot.pulse .tools-orbit {
  animation: none !important;
  transform: none !important;
}
#statusDot .tools-orbit svg {
  display: block !important;
  opacity: 1 !important;
}

/* The empty state may render before a product shelf exists. It therefore uses
   the measured header variable when available and a conservative safe fallback. */
@media (max-width: 1099px) {
  .market-empty-v137-inner {
    padding-top: calc(var(--vc-mobile-header-bottom, 148px) + 16px) !important;
    align-content: start !important;
  }
}

/* Contextual recommendation cards use the complete stage instead of leaving an
   unintentional black gutter on the right. The action rail begins below them. */
@media (max-width: 1099px) {
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf {
    left: 6px !important;
    right: 6px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
  }
  .smart-shop-shelf-window,
  .smart-shop-shelf-track {
    width: 100% !important;
    max-width: none !important;
  }
  .smart-shop-shelf-track {
    justify-content: stretch !important;
    grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(0, 1fr)) !important;
  }
  .smart-shop-product {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}
@media (min-width: 1100px) {
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf {
    left: 16px !important;
    right: 16px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
  }
  .smart-shop-shelf-window,
  .smart-shop-shelf-track {
    width: 100% !important;
    max-width: none !important;
  }
  .smart-shop-shelf-track {
    justify-content: stretch !important;
    grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(0, 1fr)) !important;
  }
  .smart-shop-product {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}

/* Reserve a real final column for More on phones. Flex compression previously
   turned the label and globe into a single glowing dot on narrower devices. */
@media (max-width: 719px) {
  .topbar .location-row {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 40px minmax(66px, 92px) 72px !important;
    align-items: center !important;
    gap: 7px !important;
    overflow: visible !important;
  }
  .topbar .location-row > * { min-width: 0 !important; }
  .location-row .area-chip {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }
  .location-row .tiny-lang {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
  }
  .location-row .account-top-chip {
    width: 100% !important;
    min-width: 66px !important;
    max-width: 92px !important;
  }
  #statusDot.tools-more-trigger,
  .ghost-dot.action-menu-trigger.tools-more-trigger {
    flex: 0 0 72px !important;
    width: 72px !important;
    min-width: 72px !important;
    max-width: 72px !important;
    padding-inline: 8px !important;
    gap: 5px !important;
    overflow: visible !important;
  }
  #statusDot .tools-more-label {
    font-size: 8.3px !important;
    letter-spacing: .04em !important;
  }
  #statusDot .tools-orbit,
  #statusDot .tools-orbit svg {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
    flex-basis: 18px !important;
  }
}
@media (max-width: 380px) {
  .topbar .location-row {
    grid-template-columns: minmax(0, 1fr) 38px 66px 68px !important;
    gap: 6px !important;
  }
  .location-row .tiny-lang {
    width: 38px !important;
    min-width: 38px !important;
  }
  #statusDot.tools-more-trigger,
  .ghost-dot.action-menu-trigger.tools-more-trigger {
    flex-basis: 68px !important;
    width: 68px !important;
    min-width: 68px !important;
    max-width: 68px !important;
    padding-inline: 7px !important;
  }
  #statusDot .tools-more-label { font-size: 7.8px !important; }
}

@media (prefers-reduced-motion: reduce) {
  #statusDot .tools-orbit svg,
  #statusDot .tools-orbit-ring { animation: none !important; }
}

/* ============================================================================
   v141.0.0 · Alternating commerce shelf, premium chat, visible More and 4 plans
   ========================================================================== */

/* More remains readable on the darkest side of the mobile header. */
#statusDot.tools-more-trigger,
.ghost-dot.action-menu-trigger.tools-more-trigger {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 42px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(91,255,222,.36) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 82% 22%, rgba(255,63,139,.21), transparent 38%),
    linear-gradient(145deg, rgba(8,31,32,.96), rgba(8,12,18,.98)) !important;
  box-shadow: 0 8px 26px rgba(0,0,0,.42), 0 0 0 1px rgba(35,241,207,.05), inset 0 1px 0 rgba(255,255,255,.09) !important;
  color: #f5fffd !important;
  opacity: 1 !important;
}
#statusDot.tools-more-trigger::after {
  content: '';
  position: absolute;
  inset: -5px;
  z-index: -1;
  border-radius: 20px;
  opacity: .62;
  background: radial-gradient(circle at 75% 45%, rgba(38,245,207,.23), transparent 56%);
  filter: blur(8px);
  pointer-events: none;
}
#statusDot .tools-more-label {
  display: inline-flex !important;
  width: auto !important;
  height: auto !important;
  min-width: max-content !important;
  padding: 0 !important;
  color: #f5fffd !important;
  font-size: 9.5px !important;
  font-weight: 1000 !important;
  letter-spacing: .065em !important;
  line-height: 1 !important;
  text-shadow: 0 1px 10px rgba(0,0,0,.85) !important;
  opacity: 1 !important;
}
#statusDot > b { display: none !important; }
#statusDot .tools-orbit {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  max-width: 24px !important;
  max-height: 24px !important;
  border: 1px solid rgba(255,255,255,.38) !important;
  border-radius: 50% !important;
  background: conic-gradient(from 40deg, #2af0ca, #4e91ff, #ff3e88, #2af0ca) !important;
  box-shadow: 0 0 0 3px rgba(42,240,202,.10), 0 0 18px rgba(42,240,202,.36), inset 0 0 0 3px rgba(3,12,16,.76) !important;
  overflow: visible !important;
  opacity: 1 !important;
}
#statusDot .tools-orbit svg {
  width: 17px !important;
  height: 17px !important;
  padding: 2px !important;
  overflow: visible !important;
  stroke: #fff !important;
  stroke-width: 1.75 !important;
  fill: rgba(3,15,18,.72) !important;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,.75)) !important;
  opacity: 1 !important;
  animation: vc-v141-globe-spin 4.8s linear infinite !important;
}
#statusDot:hover,
#statusDot:focus-visible,
#statusDot[aria-expanded="true"] {
  border-color: rgba(91,255,222,.68) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.48), 0 0 24px rgba(42,240,202,.22), inset 0 1px 0 rgba(255,255,255,.12) !important;
}
@keyframes vc-v141-globe-spin { to { transform: rotate(360deg); } }

/* Contextual shelf: products and services share the stage but retain their own
   visual identity. JS alternates both types every four seconds. */
.smart-shop-shelf {
  overflow: visible !important;
  padding: 4px !important;
  border: 1px solid rgba(107,247,224,.16) !important;
  border-radius: 17px !important;
  background:
    radial-gradient(circle at 8% -20%, rgba(42,240,202,.16), transparent 42%),
    radial-gradient(circle at 92% 115%, rgba(255,55,126,.11), transparent 42%),
    linear-gradient(180deg, rgba(4,18,22,.91), rgba(3,7,12,.94)) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.055) !important;
  backdrop-filter: blur(18px) saturate(1.15) !important;
}
.smart-shop-shelf[data-group-kind="services"] {
  border-color: rgba(82,180,255,.24) !important;
  background:
    radial-gradient(circle at 7% -18%, rgba(42,240,202,.17), transparent 42%),
    radial-gradient(circle at 92% 112%, rgba(104,91,255,.18), transparent 46%),
    linear-gradient(180deg, rgba(5,20,28,.94), rgba(3,7,14,.96)) !important;
}
.smart-shop-shelf-head {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto auto !important;
  grid-template-areas: "title ai page" "shop shop shop" !important;
  align-items: center !important;
  gap: 2px 7px !important;
  min-height: 37px !important;
  margin: 0 0 4px !important;
  padding: 5px 8px 5px 10px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 12px !important;
  background: linear-gradient(105deg, rgba(5,14,18,.94), rgba(12,22,28,.91), rgba(6,11,17,.95)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
}
.smart-shop-shelf-title {
  grid-area: title !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: #f6fffd !important;
  font-size: 11.5px !important;
  font-weight: 1000 !important;
  line-height: 1.15 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.smart-shop-shelf-shop {
  grid-area: shop !important;
  display: block !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: hidden !important;
  color: rgba(228,246,243,.60) !important;
  font-size: 8.8px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.smart-shop-shelf-ai {
  grid-area: ai !important;
  align-self: center !important;
  padding: 3px 6px !important;
  border: 1px solid rgba(42,240,202,.24) !important;
  border-radius: 999px !important;
  background: rgba(42,240,202,.10) !important;
  color: #9ff8e5 !important;
  font-size: 7.5px !important;
  font-weight: 1000 !important;
  white-space: nowrap !important;
}
.smart-shop-shelf[data-group-kind="services"] .smart-shop-shelf-ai {
  border-color: rgba(100,168,255,.33) !important;
  background: linear-gradient(115deg, rgba(42,240,202,.12), rgba(93,87,255,.16)) !important;
  color: #d9fbff !important;
}
.smart-shop-shelf-page {
  grid-area: page !important;
  min-width: 29px !important;
  padding: 3px 6px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.07) !important;
  color: rgba(255,255,255,.80) !important;
  font-size: 7.5px !important;
  font-weight: 1000 !important;
  text-align: center !important;
}
.smart-shop-shelf-window,
.smart-shop-shelf-track {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}
.smart-shop-shelf-window { overflow: hidden !important; }
.smart-shop-shelf-track {
  display: grid !important;
  grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(0,1fr)) !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  gap: 6px !important;
  min-height: 96px !important;
}
.smart-shop-product {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 96px !important;
  grid-template-rows: minmax(0,1fr) 23px !important;
  padding: 3px 3px 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(42,240,202,.30) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(42,240,202,.13), transparent 48%),
    linear-gradient(150deg, rgba(10,26,31,.97), rgba(4,8,13,.98)) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.045) !important;
  transition: transform .20s ease, border-color .20s ease, box-shadow .20s ease !important;
}
.smart-shop-product:nth-child(3n+2) { border-color: rgba(92,151,255,.31) !important; }
.smart-shop-product:nth-child(3n) { border-color: rgba(255,74,140,.28) !important; }
.smart-shop-product:hover,
.smart-shop-product:focus-visible {
  z-index: 2 !important;
  transform: translateY(-2px) !important;
  border-color: rgba(91,255,221,.72) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.42), 0 0 20px rgba(42,240,202,.12) !important;
}
.smart-shop-product-image {
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 3px !important;
  border-radius: 9px !important;
  object-fit: contain !important;
  object-position: center !important;
  background: radial-gradient(circle at 50% 38%, rgba(255,255,255,.055), rgba(2,8,12,.22)) !important;
  filter: drop-shadow(0 6px 9px rgba(0,0,0,.30)) !important;
}
.smart-shop-product-price {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  height: 23px !important;
  padding: 0 5px !important;
  overflow: hidden !important;
  border-radius: 0 0 8px 8px !important;
  background: linear-gradient(90deg, rgba(42,240,202,.10), rgba(255,255,255,.035)) !important;
  color: #f7fffd !important;
  font-size: 8.5px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.smart-shop-product.is-service {
  border-color: rgba(71,199,255,.44) !important;
  background:
    radial-gradient(circle at 50% -8%, rgba(56,207,255,.23), transparent 54%),
    linear-gradient(155deg, rgba(6,31,39,.98), rgba(6,9,21,.98)) !important;
}
.smart-shop-product.is-service::before {
  top: 5px !important;
  left: 5px !important;
  padding: 2px 5px !important;
  border: 1px solid rgba(125,255,233,.34) !important;
  background: rgba(2,13,18,.88) !important;
  color: #9effe9 !important;
  font-size: 6px !important;
  box-shadow: 0 4px 13px rgba(0,0,0,.46) !important;
}
.smart-shop-product.is-service .smart-shop-product-image {
  padding: 0 !important;
  object-fit: cover !important;
  background: linear-gradient(145deg, rgba(31,161,196,.24), rgba(7,11,22,.8)) !important;
  filter: saturate(.98) contrast(1.04) !important;
}
.smart-shop-product.is-service .smart-shop-product-price {
  background: linear-gradient(90deg, rgba(42,240,202,.18), rgba(77,93,255,.14)) !important;
  color: #edfffb !important;
}

/* Chat room. AI is optional and collapsible; conversation owns the screen. */
#chatSheet[open] .chat-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(112,245,222,.16) !important;
  background:
    radial-gradient(circle at 15% -20%, rgba(42,240,202,.13), transparent 38%),
    radial-gradient(circle at 100% 110%, rgba(255,55,126,.10), transparent 35%),
    #03070b !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.56), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
#chatSheet[open] .chat-sticky-head {
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-height: 74px !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, rgba(5,13,17,.98), rgba(4,8,13,.94)) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.035) !important;
  backdrop-filter: blur(22px) !important;
}
.chat-peer-head {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  min-width: 0 !important;
}
.chat-peer-avatar {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 46px !important;
  width: 46px !important;
  height: 46px !important;
  overflow: hidden !important;
  border: 1px solid rgba(42,240,202,.38) !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.06) !important;
  box-shadow: 0 0 0 3px rgba(42,240,202,.07) !important;
}
.chat-peer-avatar::after {
  content: '';
  position: absolute;
  right: 2px;
  bottom: 2px;
  width: 9px;
  height: 9px;
  border: 2px solid #071014;
  border-radius: 50%;
  background: #2af0ca;
}
.chat-peer-avatar img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.chat-peer-copy { display: block !important; min-width: 0 !important; }
#chatSheet[open] .chat-peer-copy small {
  display: block !important;
  color: #62efd2 !important;
  font-size: 8px !important;
  font-weight: 1000 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
#chatSheet[open] .chat-peer-copy h3 {
  max-width: min(48vw, 420px) !important;
  margin: 2px 0 0 !important;
  overflow: hidden !important;
  color: #fff !important;
  font-size: 17px !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#chatSheet[open] .chat-peer-copy em {
  display: block !important;
  margin-top: 3px !important;
  color: rgba(225,241,239,.54) !important;
  font-size: 9.5px !important;
  font-style: normal !important;
  line-height: 1.2 !important;
}
.chat-head-actions { display: flex !important; align-items: center !important; gap: 8px !important; }
#chatAiToggle.chat-ai-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  min-width: 52px !important;
  min-height: 40px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(107,243,220,.22) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.055) !important;
  color: #dffff8 !important;
  font-size: 10px !important;
  font-weight: 1000 !important;
}
#chatAiToggle svg { width: 17px !important; height: 17px !important; fill: none !important; stroke: currentColor !important; stroke-width: 1.75 !important; }
#chatAiToggle.active {
  border-color: rgba(42,240,202,.52) !important;
  background: linear-gradient(135deg, rgba(42,240,202,.17), rgba(255,55,126,.11)) !important;
  box-shadow: 0 0 22px rgba(42,240,202,.10) !important;
}
#chatSheet[open] .chat-sticky-head .xbtn {
  position: static !important;
  flex: 0 0 40px !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.065) !important;
}
#chatSheet[open] .chat-product {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex: 0 0 auto !important;
  min-height: 56px !important;
  margin: 9px 12px 5px !important;
  padding: 7px 9px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 16px !important;
  background: linear-gradient(120deg, rgba(255,255,255,.055), rgba(42,240,202,.035)) !important;
}
#chatSheet[open] .chat-product:empty { display: none !important; }
#chatSheet[open] .chat-product img { flex: 0 0 42px !important; width: 42px !important; height: 42px !important; border-radius: 12px !important; object-fit: cover !important; }
#chatSheet[open] .chat-product span { min-width: 0 !important; flex: 1 1 auto !important; }
#chatSheet[open] .chat-product b { display: block !important; overflow: hidden !important; color: #f5fffd !important; font-size: 11px !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
#chatSheet[open] .chat-product small { display: block !important; margin-top: 2px !important; overflow: hidden !important; color: rgba(225,241,239,.54) !important; font-size: 9px !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
#chatSheet[open] .chat-product > i { color: rgba(106,248,221,.74) !important; font-size: 22px !important; font-style: normal !important; }
#chatSheet[open] #chatAiDock.chat-ai-dock {
  position: relative !important;
  top: auto !important;
  z-index: 4 !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  flex: 0 0 auto !important;
  gap: 6px !important;
  margin: 4px 12px 6px !important;
  padding: 7px !important;
  overflow: visible !important;
  border: 1px solid rgba(42,240,202,.12) !important;
  border-radius: 15px !important;
  background: rgba(6,17,21,.78) !important;
  backdrop-filter: blur(14px) !important;
}
#chatSheet[open] #chatAiDock.hidden { display: none !important; }
#chatSheet[open] #chatAiDock button {
  min-width: 0 !important;
  padding: 8px 5px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.045) !important;
  color: rgba(242,255,252,.86) !important;
  font-size: 8.5px !important;
  font-weight: 900 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#chatSheet[open] .chat-ai-answer {
  flex: 0 0 auto !important;
  max-height: 34dvh !important;
  margin: 3px 12px 7px !important;
  overflow: auto !important;
}
#chatSheet[open] .chat-ai-answer.hidden { display: none !important; }
#chatSheet[open] .chat-ai-result {
  padding: 11px !important;
  border: 1px solid rgba(42,240,202,.18) !important;
  border-radius: 17px !important;
  background: linear-gradient(145deg, rgba(11,31,34,.96), rgba(15,12,24,.95)) !important;
  box-shadow: 0 11px 28px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
#chatSheet[open] .chat-ai-result .primary.wide { min-height: 39px !important; margin-top: 8px !important; border-radius: 12px !important; }
#chatSheet[open] .chat-messages {
  position: relative !important;
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  min-height: 0 !important;
  padding: 10px 14px 18px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scroll-padding-bottom: 90px !important;
  overscroll-behavior: contain !important;
  background:
    radial-gradient(circle at 90% 5%, rgba(42,240,202,.035), transparent 34%),
    linear-gradient(180deg, rgba(1,5,8,.20), rgba(2,5,9,.72)) !important;
}
.chat-message-loader,
.chat-empty-state {
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 8px !important;
  min-height: 210px !important;
  margin: auto !important;
  padding: 24px !important;
  color: rgba(236,250,247,.68) !important;
  text-align: center !important;
}
.chat-empty-state > span { display: grid !important; place-items: center !important; width: 58px !important; height: 58px !important; border: 1px solid rgba(42,240,202,.20) !important; border-radius: 21px !important; background: rgba(42,240,202,.07) !important; }
.chat-empty-state svg { width: 25px !important; height: 25px !important; fill: none !important; stroke: #70f4da !important; }
.chat-empty-state b { color: #f6fffd !important; font-size: 14px !important; }
.chat-empty-state small { max-width: 300px !important; font-size: 10px !important; line-height: 1.45 !important; }
.chat-day-separator {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  margin: 10px 0 14px !important;
  color: rgba(222,240,237,.44) !important;
}
.chat-day-separator::before,
.chat-day-separator::after { content: '' !important; flex: 1 1 auto !important; height: 1px !important; background: linear-gradient(90deg, transparent, rgba(255,255,255,.08)) !important; }
.chat-day-separator::after { background: linear-gradient(90deg, rgba(255,255,255,.08), transparent) !important; }
.chat-day-separator span { padding: 4px 8px !important; border: 1px solid rgba(255,255,255,.07) !important; border-radius: 999px !important; background: rgba(255,255,255,.035) !important; font-size: 8px !important; font-weight: 800 !important; }
.chat-message-row { display: flex !important; width: 100% !important; margin: 0 0 8px !important; }
.chat-message-row.mine { justify-content: flex-end !important; }
.chat-message-row.theirs { justify-content: flex-start !important; }
#chatSheet .chat-bubble {
  display: block !important;
  width: fit-content !important;
  min-width: 80px !important;
  max-width: min(78%, 520px) !important;
  margin: 0 !important;
  padding: 9px 11px 7px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 17px 17px 17px 5px !important;
  background: linear-gradient(145deg, rgba(29,35,42,.96), rgba(17,22,29,.98)) !important;
  color: #f5fbfa !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
#chatSheet .chat-bubble.mine {
  border-color: rgba(42,240,202,.24) !important;
  border-radius: 17px 17px 5px 17px !important;
  background: linear-gradient(145deg, rgba(27,212,180,.96), rgba(23,167,144,.96)) !important;
  color: #011512 !important;
  box-shadow: 0 9px 22px rgba(0,0,0,.22), 0 0 20px rgba(42,240,202,.06) !important;
}
.chat-sender-name { display: block !important; margin: 0 0 3px !important; color: rgba(151,248,227,.82) !important; font-size: 8.5px !important; font-weight: 1000 !important; }
.chat-message-body { display: grid !important; gap: 5px !important; min-width: 0 !important; }
.chat-message-text { display: block !important; overflow-wrap: anywhere !important; font-size: 12px !important; line-height: 1.42 !important; white-space: pre-wrap !important; }
#chatSheet .chat-bubble time { display: flex !important; align-items: center !important; justify-content: flex-end !important; gap: 4px !important; margin-top: 4px !important; color: rgba(225,241,239,.43) !important; font-size: 7.5px !important; font-style: normal !important; line-height: 1 !important; }
#chatSheet .chat-bubble.mine time { color: rgba(1,30,24,.55) !important; }
#chatSheet .chat-bubble .ticks.read { color: #eafffb !important; }
#chatSheet .chat-bubble.mine .ticks.read { color: #064d40 !important; }
#chatSheet .chat-img { width: min(260px, 100%) !important; max-height: 300px !important; border-radius: 12px !important; object-fit: cover !important; }
#chatSheet[open] .chat-image-preview,
#chatSheet[open] .emoji-panel { flex: 0 0 auto !important; margin-inline: 12px !important; }
#chatSheet[open] .chat-input {
  position: relative !important;
  inset: auto !important;
  z-index: 10 !important;
  display: grid !important;
  grid-template-columns: 44px 44px minmax(0,1fr) 50px !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  gap: 7px !important;
  margin: 0 !important;
  padding: 9px 12px calc(10px + env(safe-area-inset-bottom)) !important;
  border-top: 1px solid rgba(255,255,255,.075) !important;
  background: rgba(3,8,12,.97) !important;
  backdrop-filter: blur(20px) !important;
}
#chatSheet[open] .chat-input .attach-btn,
#chatSheet[open] .chat-input .emoji-btn {
  width: 44px !important;
  height: 44px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.05) !important;
  color: rgba(241,255,252,.82) !important;
}
#chatSheet[open] #chatText {
  width: 100% !important;
  height: 46px !important;
  min-width: 0 !important;
  padding: 0 14px !important;
  border: 1px solid rgba(42,240,202,.23) !important;
  border-radius: 15px !important;
  background: rgba(255,255,255,.045) !important;
  color: #fff !important;
  font-size: 12px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}
#chatSheet[open] #chatText:focus { border-color: rgba(42,240,202,.58) !important; box-shadow: 0 0 0 3px rgba(42,240,202,.08) !important; }
#chatSheet[open] .chat-send-icon {
  width: 50px !important;
  height: 50px !important;
  border-radius: 16px !important;
  box-shadow: 0 9px 24px rgba(42,240,202,.16) !important;
}

/* Four-package pricing, one clear ladder from free to annual business. */
.package-v141-intro {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 12px 0 !important;
  padding: 13px 14px !important;
  border: 1px solid rgba(42,240,202,.17) !important;
  border-radius: 18px !important;
  background: linear-gradient(130deg, rgba(42,240,202,.075), rgba(255,55,126,.04)), rgba(255,255,255,.025) !important;
}
.package-v141-intro > span { display: grid !important; place-items: center !important; flex: 0 0 42px !important; width: 42px !important; height: 42px !important; border-radius: 14px !important; background: linear-gradient(135deg, rgba(42,240,202,.18), rgba(255,55,126,.13)) !important; color: #9ff7e4 !important; }
.package-v141-intro svg { width: 21px !important; height: 21px !important; fill: none !important; stroke: currentColor !important; }
.package-v141-intro h4 { margin: 0 !important; color: #fff !important; font-size: 14px !important; }
.package-v141-intro p { margin: 4px 0 0 !important; color: rgba(230,246,243,.60) !important; font-size: 9.5px !important; line-height: 1.45 !important; }
.pricing-grid:has(.package-v141) {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
}
.pricing-plan.package-v141 {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  padding: 13px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 88% 0%, rgba(42,240,202,.10), transparent 36%),
    linear-gradient(150deg, rgba(14,23,29,.96), rgba(6,9,14,.98)) !important;
  box-shadow: 0 15px 35px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
.pricing-plan.package-v141.current { border-color: rgba(42,240,202,.52) !important; box-shadow: 0 15px 35px rgba(0,0,0,.28), 0 0 24px rgba(42,240,202,.09) !important; }
.pricing-plan.package-v141 .plan-price { margin: 9px 0 !important; color: #f8fffd !important; font-size: 19px !important; }
.plan-capacity-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 6px !important;
  margin: 0 0 10px !important;
}
.plan-capacity-grid > span {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-height: 48px !important;
  min-width: 0 !important;
  padding: 7px 8px !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.035) !important;
}
.plan-capacity-grid small { overflow: hidden !important; color: rgba(225,242,239,.50) !important; font-size: 7.5px !important; font-weight: 800 !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.plan-capacity-grid b { margin-top: 3px !important; color: #8df5df !important; font-size: 12px !important; }
.pricing-plan.package-v141 ul { flex: 1 1 auto !important; margin-block: 4px 10px !important; }
.pricing-plan.package-v141 li { font-size: 9px !important; line-height: 1.4 !important; }

@media (min-width: 720px) {
  #chatSheet[open] .chat-card {
    position: fixed !important;
    left: 50% !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    width: min(860px, calc(100vw - 80px)) !important;
    max-width: 860px !important;
    height: min(86dvh, 780px) !important;
    min-height: 560px !important;
    max-height: 780px !important;
    padding: 0 !important;
    transform: translate(-50%, -50%) !important;
    border-radius: 28px !important;
  }
  #chatSheet[open] .chat-sticky-head { border-radius: 28px 28px 0 0 !important; }
  .smart-shop-shelf-track { gap: 8px !important; min-height: 118px !important; }
  .smart-shop-product { height: 118px !important; grid-template-rows: minmax(0,1fr) 25px !important; }
  .smart-shop-product-price { height: 25px !important; font-size: 9px !important; }
}
@media (max-width: 1099px) {
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf { left: 7px !important; right: 7px !important; width: auto !important; max-width: none !important; }
}
@media (max-width: 719px) {
  .topbar .location-row { grid-template-columns: minmax(0,1fr) 40px minmax(66px,92px) 78px !important; gap: 6px !important; }
  #statusDot.tools-more-trigger,
  .ghost-dot.action-menu-trigger.tools-more-trigger { width: 78px !important; min-width: 78px !important; max-width: 78px !important; padding-inline: 8px !important; }
  #statusDot .tools-more-label { font-size: 8.6px !important; }
  #statusDot .tools-orbit { flex-basis: 22px !important; width: 22px !important; height: 22px !important; min-width: 22px !important; min-height: 22px !important; max-width: 22px !important; max-height: 22px !important; }
  #statusDot .tools-orbit svg { width: 16px !important; height: 16px !important; }
  .smart-shop-shelf { padding: 3px !important; border-radius: 14px !important; }
  .smart-shop-shelf-head { min-height: 34px !important; padding: 4px 6px 4px 8px !important; gap: 1px 5px !important; }
  .smart-shop-shelf-title { font-size: 9.3px !important; }
  .smart-shop-shelf-shop { font-size: 7.4px !important; }
  .smart-shop-shelf-ai { padding: 2px 4px !important; font-size: 6.3px !important; }
  .smart-shop-shelf-page { min-width: 25px !important; padding: 2px 4px !important; font-size: 6.4px !important; }
  .smart-shop-shelf-track { gap: 4px !important; min-height: 86px !important; }
  .smart-shop-product { height: 86px !important; grid-template-rows: minmax(0,1fr) 21px !important; border-radius: 10px !important; }
  .smart-shop-product-price { height: 21px !important; font-size: 7.1px !important; }
  .smart-shop-product.is-service::before { top: 3px !important; left: 3px !important; padding: 1px 3px !important; font-size: 5px !important; }
  #chatSheet[open] .chat-card {
    position: fixed !important;
    inset: var(--vc-vvo, 0px) 0 auto 0 !important;
    left: 0 !important;
    right: 0 !important;
    top: var(--vc-vvo, 0px) !important;
    bottom: auto !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: var(--vc-vvh, 100dvh) !important;
    min-height: var(--vc-vvh, 100dvh) !important;
    max-height: var(--vc-vvh, 100dvh) !important;
    padding: 0 !important;
    transform: none !important;
    border: 0 !important;
    border-radius: 0 !important;
  }
  #chatSheet[open] .chat-sticky-head { padding-top: calc(10px + env(safe-area-inset-top)) !important; }
  #chatSheet[open] .chat-peer-copy h3 { max-width: 44vw !important; font-size: 15px !important; }
  #chatSheet[open] .chat-peer-copy em { max-width: 44vw !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
  #chatSheet[open] #chatAiDock.chat-ai-dock { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  #chatSheet[open] .chat-ai-answer { max-height: 30dvh !important; }
  #chatSheet .chat-bubble { max-width: 84% !important; }
  .pricing-grid:has(.package-v141) { grid-template-columns: 1fr !important; }
}
@media (min-width: 720px) and (max-width: 1199px) {
  .pricing-grid:has(.package-v141) { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}
@media (max-width: 380px) {
  .topbar .location-row { grid-template-columns: minmax(0,1fr) 38px 64px 74px !important; gap: 5px !important; }
  #statusDot.tools-more-trigger,
  .ghost-dot.action-menu-trigger.tools-more-trigger { width: 74px !important; min-width: 74px !important; max-width: 74px !important; padding-inline: 7px !important; gap: 5px !important; }
  #statusDot .tools-more-label { font-size: 8px !important; }
  #chatSheet[open] .chat-input { grid-template-columns: 40px 40px minmax(0,1fr) 46px !important; gap: 6px !important; padding-inline: 8px !important; }
  #chatSheet[open] .chat-input .attach-btn,
  #chatSheet[open] .chat-input .emoji-btn { width: 40px !important; height: 40px !important; }
  #chatSheet[open] .chat-send-icon { width: 46px !important; height: 46px !important; }
}
@media (prefers-reduced-motion: reduce) {
  #statusDot .tools-orbit svg,
  .smart-shop-product { animation: none !important; transition: none !important; }
}


/* ============================================================================
   v143.0.0 · Refined commerce shelf, keyboard-safe chat and readable packages
   ========================================================================== */

/* More is a real labelled control on every dark header, not a decorative dot. */
#statusDot.tools-more-trigger,
.ghost-dot.action-menu-trigger.tools-more-trigger {
  isolation: isolate !important;
  min-width: 92px !important;
  width: 92px !important;
  max-width: 92px !important;
  min-height: 44px !important;
  gap: 8px !important;
  padding-inline: 11px 8px !important;
  border-color: rgba(105,255,226,.54) !important;
  background: linear-gradient(145deg, rgba(7,35,35,.98), rgba(7,10,17,.99)) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.48), 0 0 22px rgba(42,240,202,.13), inset 0 1px 0 rgba(255,255,255,.11) !important;
}
#statusDot .tools-more-label {
  flex: 1 1 auto !important;
  font-size: 10.2px !important;
  letter-spacing: .07em !important;
  text-align: center !important;
}
#statusDot .tools-orbit {
  flex-basis: 27px !important;
  width: 27px !important;
  height: 27px !important;
  min-width: 27px !important;
  min-height: 27px !important;
  max-width: 27px !important;
  max-height: 27px !important;
  border-color: rgba(255,255,255,.58) !important;
  box-shadow: 0 0 0 3px rgba(42,240,202,.12), 0 0 20px rgba(42,240,202,.42), inset 0 0 0 3px rgba(3,12,16,.78) !important;
}
#statusDot .tools-orbit svg { width: 19px !important; height: 19px !important; animation-name: vc-v142-globe-spin !important; }
@keyframes vc-v142-globe-spin { to { transform: rotate(360deg); } }

/* The contextual shelf is light on chrome and heavy on useful media. */
.smart-shop-shelf {
  padding: 2px !important;
  border-color: rgba(100,245,221,.15) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, rgba(2,10,14,.82), rgba(2,6,10,.90)) !important;
  box-shadow: 0 13px 30px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.035) !important;
  backdrop-filter: blur(14px) saturate(1.08) !important;
}
.smart-shop-shelf[data-group-kind="services"] {
  border-color: rgba(73,194,255,.20) !important;
  background: linear-gradient(180deg, rgba(3,14,20,.86), rgba(2,6,12,.93)) !important;
}
.smart-shop-shelf-head {
  display: flex !important;
  width: max-content !important;
  max-width: calc(100% - 8px) !important;
  min-height: 25px !important;
  margin: 2px auto 4px !important;
  padding: 3px 5px 3px 9px !important;
  gap: 5px !important;
  border-color: rgba(255,255,255,.075) !important;
  border-radius: 999px !important;
  background: rgba(4,12,16,.91) !important;
  box-shadow: 0 7px 18px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.045) !important;
}
.smart-shop-shelf-title {
  flex: 0 1 auto !important;
  max-width: min(46vw, 320px) !important;
  font-size: 9.2px !important;
  letter-spacing: -.01em !important;
}
.smart-shop-shelf-shop {
  display: none !important;
}
.smart-shop-shelf-ai,
.smart-shop-shelf-page {
  flex: 0 0 auto !important;
  padding: 2px 5px !important;
  font-size: 6.7px !important;
}
.smart-shop-shelf-track {
  gap: 6px !important;
  min-height: 104px !important;
  transition: opacity .16s ease, transform .16s ease, filter .16s ease !important;
}
.smart-shop-shelf.is-swapping .smart-shop-shelf-track {
  opacity: .18 !important;
  transform: translateY(4px) scale(.992) !important;
  filter: blur(1.2px) !important;
}
.smart-shop-product {
  height: 104px !important;
  grid-template-rows: minmax(0,1fr) 25px !important;
  padding: 3px 3px 0 !important;
  border-radius: 12px !important;
  background: rgba(5,13,18,.96) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.31), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
.smart-shop-product-image {
  padding: 2px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.01)) !important;
}
.smart-shop-product.is-service .smart-shop-product-image { object-fit: cover !important; }
.smart-shop-product-price {
  height: 25px !important;
  font-size: 8.5px !important;
  background: rgba(4,10,14,.94) !important;
}
.smart-shop-shelf.is-entering .smart-shop-product {
  animation: vc-v142-card-in .48s cubic-bezier(.2,.8,.2,1) both !important;
  animation-delay: calc(var(--vc-smart-shop-order, 0) * 65ms) !important;
}
@keyframes vc-v142-card-in {
  from { opacity: 0; transform: translateY(8px) scale(.965); filter: blur(2px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: none; }
}

/* Chat stays structurally stable when the Android keyboard changes the visual viewport. */
#chatSheet[open] .chat-card {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  padding: 0 !important;
  background: linear-gradient(180deg, rgba(3,8,12,.995), rgba(2,5,9,.995)) !important;
}
#chatSheet[open] .sheet-bar { display: none !important; }
#chatSheet[open] .chat-sticky-head {
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  width: 100% !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 13px 14px 12px !important;
  border-radius: inherit inherit 0 0 !important;
  background: linear-gradient(180deg, rgba(7,15,20,.995), rgba(4,9,14,.975)) !important;
  box-shadow: 0 11px 28px rgba(0,0,0,.33), inset 0 1px 0 rgba(255,255,255,.055) !important;
}
#chatSheet[open] .chat-peer-head { min-width: 0 !important; flex: 1 1 auto !important; }
#chatSheet[open] .chat-peer-avatar { width: 44px !important; height: 44px !important; flex-basis: 44px !important; }
#chatSheet[open] .chat-peer-copy { min-width: 0 !important; }
#chatSheet[open] .chat-peer-copy h3 {
  max-width: none !important;
  font-size: 16px !important;
  line-height: 1.08 !important;
}
#chatSheet[open] .chat-peer-copy em { font-size: 9.5px !important; }
#chatSheet[open] .chat-head-actions { flex: 0 0 auto !important; gap: 7px !important; }
#chatSheet[open] .chat-ai-btn,
#chatSheet[open] .chat-sticky-head .xbtn {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  border-radius: 14px !important;
}
#chatSheet[open] .chat-ai-btn { display: grid !important; grid-template-columns: 15px auto !important; place-content: center !important; gap: 3px !important; }
#chatSheet[open] .chat-ai-btn svg { width: 15px !important; height: 15px !important; }
#chatSheet[open] .chat-ai-btn span { font-size: 8px !important; }
#chatSheet[open] .chat-product { margin: 7px 12px 2px !important; }
#chatSheet[open] #chatAiDock.chat-ai-dock { position: relative !important; top: auto !important; margin: 5px 12px !important; }
#chatSheet[open] .chat-ai-answer { max-height: min(31dvh, 260px) !important; }
#chatSheet[open] .chat-messages {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  padding: 12px 14px 14px !important;
  scroll-padding-top: 12px !important;
  scroll-padding-bottom: 82px !important;
}
#chatSheet[open] .chat-input {
  position: relative !important;
  bottom: auto !important;
  flex: 0 0 auto !important;
  padding: 9px 12px calc(10px + env(safe-area-inset-bottom)) !important;
  background: linear-gradient(180deg, rgba(4,9,14,.97), rgba(2,6,10,.995)) !important;
}
#chatSheet .chat-bubble { max-width: min(78%, 540px) !important; }
#chatSheet .chat-message-text { font-size: 13px !important; }

/* The package chooser is large enough to read and compare without squinting. */
#pricingSheet .pricing-card {
  width: min(1380px, calc(100vw - 285px)) !important;
  max-width: 1380px !important;
  max-height: 94dvh !important;
  padding: 18px 20px 24px !important;
}
.package-v142-intro {
  padding: 15px 17px !important;
}
.package-v142-intro h4 { font-size: 16px !important; }
.package-v142-intro p { font-size: 11px !important; }
.pricing-grid:has(.package-v142) {
  grid-template-columns: repeat(4, minmax(235px,1fr)) !important;
  gap: 13px !important;
}
.pricing-plan.package-v142 {
  min-height: 440px !important;
  padding: 16px !important;
  border-radius: 23px !important;
}
.pricing-plan.package-v142 .plan-head h4 { font-size: 17px !important; }
.pricing-plan.package-v142 .plan-head small { font-size: 10px !important; }
.pricing-plan.package-v142 .plan-price { margin: 13px 0 !important; font-size: 24px !important; line-height: 1.05 !important; }
.pricing-plan.package-v142 .plan-capacity-grid { gap: 8px !important; margin-bottom: 13px !important; }
.pricing-plan.package-v142 .plan-capacity-grid > span { min-height: 59px !important; padding: 9px 10px !important; }
.pricing-plan.package-v142 .plan-capacity-grid small { font-size: 9px !important; }
.pricing-plan.package-v142 .plan-capacity-grid b { font-size: 14px !important; }
.pricing-plan.package-v142 ul { margin-block: 7px 14px !important; padding-left: 19px !important; }
.pricing-plan.package-v142 li { margin: 6px 0 !important; font-size: 11.5px !important; line-height: 1.45 !important; }
.pricing-plan.package-v142 .plan-feature-pills span { min-height: 27px !important; font-size: 10px !important; }
.pricing-plan.package-v142 .primary { min-height: 48px !important; font-size: 13px !important; }

@media (min-width: 720px) {
  .smart-shop-shelf-track { min-height: 120px !important; gap: 8px !important; }
  .smart-shop-product { height: 120px !important; grid-template-rows: minmax(0,1fr) 27px !important; }
  .smart-shop-product-price { height: 27px !important; font-size: 9.5px !important; }
}
@media (max-width: 1199px) {
  #pricingSheet .pricing-card { width: min(980px, calc(100vw - 44px)) !important; }
  .pricing-grid:has(.package-v142) { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}
@media (max-width: 719px) {
  .topbar .location-row { grid-template-columns: minmax(0,1fr) 40px minmax(66px,100px) 86px !important; }
  #statusDot.tools-more-trigger,
  .ghost-dot.action-menu-trigger.tools-more-trigger { width: 86px !important; min-width: 86px !important; max-width: 86px !important; min-height: 42px !important; padding-inline: 9px 7px !important; }
  #statusDot .tools-more-label { font-size: 9px !important; }
  #statusDot .tools-orbit { flex-basis: 24px !important; width: 24px !important; height: 24px !important; min-width: 24px !important; min-height: 24px !important; max-width: 24px !important; max-height: 24px !important; }
  #statusDot .tools-orbit svg { width: 17px !important; height: 17px !important; }
  .smart-shop-shelf-head { max-width: calc(100% - 6px) !important; min-height: 24px !important; margin-bottom: 3px !important; }
  .smart-shop-shelf-title { max-width: 55vw !important; font-size: 8.6px !important; }
  .smart-shop-shelf-ai,.smart-shop-shelf-page { font-size: 6.2px !important; }
  .smart-shop-shelf-track { min-height: 96px !important; gap: 5px !important; }
  .smart-shop-product { height: 96px !important; grid-template-rows: minmax(0,1fr) 24px !important; }
  .smart-shop-product-price { height: 24px !important; font-size: 8px !important; }
  #chatSheet[open] .chat-card {
    position: fixed !important;
    inset: var(--vc-vvo, 0px) 0 auto 0 !important;
    width: 100vw !important;
    height: var(--vc-vvh, 100dvh) !important;
    min-height: var(--vc-vvh, 100dvh) !important;
    max-height: var(--vc-vvh, 100dvh) !important;
    border-radius: 0 !important;
  }
  #chatSheet[open] .chat-sticky-head {
    padding: calc(10px + env(safe-area-inset-top)) 10px 10px !important;
    border-radius: 0 !important;
  }
  #chatSheet[open] .chat-peer-avatar { width: 39px !important; height: 39px !important; flex-basis: 39px !important; }
  #chatSheet[open] .chat-peer-copy h3 { max-width: 45vw !important; font-size: 15px !important; }
  #chatSheet[open] .chat-peer-copy em { display: none !important; }
  #chatSheet[open] .chat-ai-btn,
  #chatSheet[open] .chat-sticky-head .xbtn { width: 39px !important; height: 39px !important; min-width: 39px !important; min-height: 39px !important; border-radius: 13px !important; }
  #chatSheet[open] .chat-product { margin-inline: 9px !important; }
  #chatSheet[open] .chat-messages { padding-inline: 10px !important; }
  #chatSheet[open] .chat-input { grid-template-columns: 41px 41px minmax(0,1fr) 48px !important; gap: 6px !important; padding-inline: 8px !important; }
  #chatSheet .chat-bubble { max-width: 86% !important; }
  #pricingSheet[open] { align-items: stretch !important; padding: 0 !important; }
  #pricingSheet .pricing-card { width: 100vw !important; height: 100dvh !important; max-height: 100dvh !important; padding: calc(14px + env(safe-area-inset-top)) 13px calc(18px + env(safe-area-inset-bottom)) !important; border-radius: 0 !important; }
  .pricing-grid:has(.package-v142) { grid-template-columns: 1fr !important; }
  .pricing-plan.package-v142 { min-height: auto !important; padding: 16px !important; }
  .pricing-plan.package-v142 .plan-price { font-size: 23px !important; }
}
@media (max-width: 380px) {
  .topbar .location-row { grid-template-columns: minmax(0,1fr) 38px 64px 82px !important; }
  #statusDot.tools-more-trigger,
  .ghost-dot.action-menu-trigger.tools-more-trigger { width: 82px !important; min-width: 82px !important; max-width: 82px !important; }
}
@media (prefers-reduced-motion: reduce) {
  #statusDot .tools-orbit svg,
  .smart-shop-shelf.is-entering .smart-shop-product,
  .smart-shop-shelf-track { animation: none !important; transition: none !important; }
}

/* ============================================================================
   v143.0.0 · Calm chat header, luminous More, elevated commerce shelf and
   larger package comparison
   ========================================================================== */

/* More is one coherent luminous control. The globe no longer sits in a black
   inner disc or creates a dark patch against the mobile header. */
#statusDot.tools-more-trigger,
.ghost-dot.action-menu-trigger.tools-more-trigger {
  isolation: isolate !important;
  overflow: hidden !important;
  border-color: rgba(111,255,226,.62) !important;
  background:
    radial-gradient(circle at 88% 18%, rgba(255,255,255,.18), transparent 31%),
    linear-gradient(135deg, rgba(22,244,220,.23), rgba(30,117,111,.18) 48%, rgba(7,16,22,.96)) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.34), 0 0 20px rgba(42,240,202,.15), inset 0 1px 0 rgba(255,255,255,.16) !important;
}
#statusDot.tools-more-trigger::after { display: none !important; }
#statusDot .tools-more-label {
  color: #f5fffd !important;
  font-weight: 1000 !important;
  text-shadow: 0 1px 8px rgba(0,0,0,.45) !important;
}
#statusDot .tools-orbit {
  overflow: hidden !important;
  border: 1px solid rgba(212,255,247,.46) !important;
  background: linear-gradient(145deg, rgba(126,255,231,.24), rgba(42,240,202,.10)) !important;
  box-shadow: 0 0 0 2px rgba(42,240,202,.08), 0 0 13px rgba(42,240,202,.26), inset 0 1px 0 rgba(255,255,255,.20) !important;
}
#statusDot .tools-orbit svg {
  padding: 3px !important;
  fill: none !important;
  stroke: #f5fffd !important;
  stroke-width: 1.8 !important;
  filter: none !important;
}
#statusDot:hover,
#statusDot:focus-visible,
#statusDot[aria-expanded="true"] {
  background:
    radial-gradient(circle at 88% 18%, rgba(255,255,255,.22), transparent 33%),
    linear-gradient(135deg, rgba(22,244,220,.30), rgba(40,151,137,.21) 50%, rgba(7,16,22,.97)) !important;
}

/* Commerce shelf header is now a proper section label, aligned to the top-left
   with a store mark, readable title and compact AI/page metadata. */
.smart-shop-shelf {
  padding: 5px 7px 7px !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 7% -45%, rgba(42,240,202,.16), transparent 45%),
    radial-gradient(circle at 96% 130%, rgba(255,55,126,.09), transparent 42%),
    linear-gradient(180deg, rgba(3,13,18,.91), rgba(2,7,11,.95)) !important;
  box-shadow: 0 16px 38px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.045) !important;
}
.smart-shop-shelf-head {
  display: grid !important;
  grid-template-columns: 31px minmax(0,1fr) auto auto !important;
  grid-template-areas: "mark title ai page" "mark shop ai page" !important;
  align-items: center !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 40px !important;
  margin: 0 0 6px !important;
  padding: 5px 7px 5px 6px !important;
  gap: 1px 7px !important;
  overflow: hidden !important;
  border: 1px solid rgba(112,244,220,.13) !important;
  border-radius: 13px !important;
  background: linear-gradient(105deg, rgba(18,43,45,.70), rgba(7,18,24,.91) 46%, rgba(7,11,18,.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 8px 18px rgba(0,0,0,.18) !important;
}
.smart-shop-shelf-mark {
  grid-area: mark !important;
  display: grid !important;
  place-items: center !important;
  width: 31px !important;
  height: 31px !important;
  border: 1px solid rgba(119,255,230,.20) !important;
  border-radius: 10px !important;
  background: linear-gradient(145deg, rgba(42,240,202,.18), rgba(255,255,255,.055)) !important;
  color: #bfffee !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.smart-shop-shelf-mark svg {
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.55 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.smart-shop-shelf[data-group-kind="services"] .smart-shop-shelf-mark {
  border-color: rgba(103,188,255,.25) !important;
  background: linear-gradient(145deg, rgba(54,199,255,.18), rgba(100,87,255,.10)) !important;
  color: #c9f5ff !important;
}
.smart-shop-shelf-title {
  grid-area: title !important;
  align-self: end !important;
  max-width: none !important;
  color: #f7fffd !important;
  font-size: 11.8px !important;
  font-weight: 1000 !important;
  line-height: 1.08 !important;
  letter-spacing: -.012em !important;
}
.smart-shop-shelf-shop {
  grid-area: shop !important;
  display: block !important;
  align-self: start !important;
  color: rgba(226,247,243,.57) !important;
  font-size: 8.2px !important;
  font-weight: 720 !important;
  line-height: 1.1 !important;
}
.smart-shop-shelf-ai {
  grid-area: ai !important;
  padding: 4px 7px !important;
  border-color: rgba(42,240,202,.28) !important;
  background: rgba(42,240,202,.11) !important;
  color: #baffef !important;
  font-size: 7px !important;
}
.smart-shop-shelf-page {
  grid-area: page !important;
  min-width: 31px !important;
  padding: 4px 6px !important;
  color: rgba(245,255,253,.79) !important;
  font-size: 7px !important;
}
.smart-shop-shelf-window { border-radius: 13px !important; }
.smart-shop-shelf-track { gap: 8px !important; }
.smart-shop-product { border-radius: 14px !important; }

@media (min-width: 1100px) {
  .smart-shop-shelf { top: calc(var(--vc-topbar-bottom, 77px) + 4px) !important; }
  .smart-shop-shelf-head { min-height: 43px !important; }
  .smart-shop-shelf-title { font-size: 12.5px !important; }
  .smart-shop-shelf-shop { font-size: 8.8px !important; }
  .smart-shop-shelf-track { min-height: 124px !important; }
  .smart-shop-product { height: 124px !important; grid-template-rows: minmax(0,1fr) 28px !important; }
  .smart-shop-product-price { height: 28px !important; font-size: 10px !important; }
}
@media (max-width: 1099px) {
  .smart-shop-shelf { top: calc(var(--vc-mobile-header-bottom, 138px) + 2px) !important; }
}
@media (max-width: 719px) {
  .smart-shop-shelf { padding: 4px 5px 6px !important; border-radius: 15px !important; }
  .smart-shop-shelf-head {
    grid-template-columns: 28px minmax(0,1fr) auto auto !important;
    min-height: 36px !important;
    margin-bottom: 5px !important;
    padding: 4px 5px !important;
    gap: 1px 5px !important;
    border-radius: 11px !important;
  }
  .smart-shop-shelf-mark { width: 28px !important; height: 28px !important; border-radius: 9px !important; }
  .smart-shop-shelf-mark svg { width: 15px !important; height: 15px !important; }
  .smart-shop-shelf-title { max-width: none !important; font-size: 9.4px !important; }
  .smart-shop-shelf-shop { display: none !important; }
  .smart-shop-shelf-ai,
  .smart-shop-shelf-page { padding: 3px 5px !important; font-size: 6.2px !important; }
  .smart-shop-shelf-track { gap: 5px !important; }
}

/* Chat header: a normal back chevron replaces the floating X. The participant
   identity always occupies the header, and sparse conversations rest nearer
   the composer instead of climbing into the device status area. */
#chatSheet[open] .chat-card {
  padding: 0 !important;
  background:
    radial-gradient(circle at 12% -18%, rgba(42,240,202,.10), transparent 34%),
    linear-gradient(180deg, #03090d, #02070a) !important;
}
#chatSheet[open] .chat-sticky-head {
  display: grid !important;
  grid-template-columns: 42px minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 9px !important;
  min-height: 72px !important;
  padding: 11px 13px !important;
  margin: 0 !important;
  border-bottom: 1px solid rgba(116,244,221,.11) !important;
  background:
    radial-gradient(circle at 15% 0, rgba(42,240,202,.12), transparent 42%),
    linear-gradient(180deg, rgba(7,18,23,.995), rgba(4,10,15,.985)) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.27), inset 0 1px 0 rgba(255,255,255,.045) !important;
}
#chatSheet[open] .chat-back-btn {
  position: static !important;
  display: grid !important;
  place-items: center !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  border: 1px solid rgba(116,244,221,.16) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.055) !important;
  color: #effffc !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}
#chatSheet[open] .chat-back-btn svg {
  width: 20px !important;
  height: 20px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#chatSheet[open] .chat-back-btn:hover,
#chatSheet[open] .chat-back-btn:focus-visible {
  border-color: rgba(42,240,202,.48) !important;
  background: rgba(42,240,202,.12) !important;
}
#chatSheet[open] .chat-peer-head { min-width: 0 !important; }
#chatSheet[open] .chat-peer-copy h3 { max-width: 100% !important; }
#chatSheet[open] .chat-head-actions { justify-self: end !important; }
#chatSheet[open] .chat-ai-btn {
  width: 44px !important;
  height: 42px !important;
  min-width: 44px !important;
  min-height: 42px !important;
  border-radius: 14px !important;
}
#chatSheet[open] .chat-messages {
  display: flex !important;
  flex-direction: column !important;
  padding: 18px 14px 14px !important;
  scroll-padding-top: 18px !important;
  scroll-padding-bottom: 84px !important;
}
#chatSheet[open] .chat-messages > :first-child { margin-top: auto !important; }
#chatSheet[open] .chat-message-row,
#chatSheet[open] .chat-day-separator { flex: 0 0 auto !important; }
#chatSheet[open] .chat-input {
  border-top: 1px solid rgba(255,255,255,.055) !important;
  box-shadow: 0 -12px 30px rgba(0,0,0,.18) !important;
}

@media (max-width: 719px) {
  #chatSheet[open] .chat-sticky-head {
    grid-template-columns: 39px minmax(0,1fr) 39px !important;
    min-height: calc(65px + env(safe-area-inset-top)) !important;
    padding: calc(9px + env(safe-area-inset-top)) 9px 9px !important;
    gap: 8px !important;
  }
  #chatSheet[open] .chat-back-btn,
  #chatSheet[open] .chat-ai-btn {
    width: 39px !important;
    height: 39px !important;
    min-width: 39px !important;
    min-height: 39px !important;
    border-radius: 13px !important;
  }
  #chatSheet[open] .chat-peer-avatar { width: 39px !important; height: 39px !important; flex-basis: 39px !important; }
  #chatSheet[open] .chat-peer-copy small { font-size: 7px !important; }
  #chatSheet[open] .chat-peer-copy h3 { max-width: 100% !important; font-size: 14px !important; }
  #chatSheet[open] .chat-messages { padding: 16px 10px 12px !important; }
}

/* Package comparison now behaves like a true workspace: bigger cards, roomier
   capacity tiles and legible prices on desktop, tablet and phone. */
#pricingSheet .pricing-card {
  width: min(1510px, calc(100vw - 238px)) !important;
  max-width: 1510px !important;
  max-height: 96dvh !important;
  padding: 20px 22px 28px !important;
}
#pricingSheet .current-plan-box.active-plan-box {
  min-height: 86px !important;
  padding: 16px 18px !important;
  border-radius: 28px !important;
}
.package-v143-intro {
  min-height: 82px !important;
  padding: 18px 20px !important;
  border-radius: 25px !important;
}
.package-v143-intro > span { width: 48px !important; height: 48px !important; flex-basis: 48px !important; border-radius: 17px !important; }
.package-v143-intro h4 { font-size: 18px !important; }
.package-v143-intro p { max-width: 920px !important; font-size: 12px !important; line-height: 1.5 !important; }
.pricing-grid:has(.package-v143) {
  grid-template-columns: repeat(4, minmax(260px,1fr)) !important;
  gap: 16px !important;
}
.pricing-plan.package-v143 {
  min-height: 500px !important;
  padding: 20px !important;
  border-radius: 27px !important;
}
.pricing-plan.package-v143 .plan-head { gap: 11px !important; }
.pricing-plan.package-v143 .plan-head > span { width: 44px !important; height: 44px !important; min-width: 44px !important; border-radius: 15px !important; }
.pricing-plan.package-v143 .plan-head h4 { font-size: 19px !important; }
.pricing-plan.package-v143 .plan-head small { font-size: 10.5px !important; }
.pricing-plan.package-v143 .plan-price { margin: 16px 0 !important; font-size: 28px !important; }
.pricing-plan.package-v143 .plan-capacity-grid { gap: 10px !important; margin-bottom: 16px !important; }
.pricing-plan.package-v143 .plan-capacity-grid > span { min-height: 68px !important; padding: 11px 12px !important; border-radius: 17px !important; }
.pricing-plan.package-v143 .plan-capacity-grid small { font-size: 9.5px !important; }
.pricing-plan.package-v143 .plan-capacity-grid b { font-size: 16px !important; }
.pricing-plan.package-v143 ul { margin-block: 9px 17px !important; padding-left: 21px !important; }
.pricing-plan.package-v143 li { margin: 7px 0 !important; font-size: 12.5px !important; line-height: 1.5 !important; }
.pricing-plan.package-v143 .plan-feature-pills { gap: 7px !important; }
.pricing-plan.package-v143 .plan-feature-pills span { min-height: 29px !important; padding-inline: 10px !important; font-size: 10.5px !important; }
.pricing-plan.package-v143 .primary { min-height: 53px !important; border-radius: 17px !important; font-size: 13.5px !important; }

@media (max-width: 1399px) {
  #pricingSheet .pricing-card { width: min(1080px, calc(100vw - 42px)) !important; }
  .pricing-grid:has(.package-v143) { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}
@media (max-width: 719px) {
  #pricingSheet .pricing-card {
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    padding: calc(15px + env(safe-area-inset-top)) 13px calc(20px + env(safe-area-inset-bottom)) !important;
  }
  #pricingSheet .current-plan-box.active-plan-box { min-height: 92px !important; padding: 15px !important; }
  .package-v143-intro { min-height: 94px !important; padding: 16px !important; }
  .package-v143-intro h4 { font-size: 17px !important; }
  .package-v143-intro p { font-size: 11.5px !important; }
  .pricing-grid:has(.package-v143) { grid-template-columns: 1fr !important; gap: 14px !important; }
  .pricing-plan.package-v143 { min-height: 430px !important; padding: 19px !important; }
  .pricing-plan.package-v143 .plan-head h4 { font-size: 18px !important; }
  .pricing-plan.package-v143 .plan-price { font-size: 27px !important; }
  .pricing-plan.package-v143 .plan-capacity-grid > span { min-height: 64px !important; }
}

@media (prefers-reduced-motion: reduce) {
  #statusDot .tools-orbit svg { animation: none !important; }
}

/* ============================================================================
   v144.0.0 · Anchored mobile chat, direct package cards and compact store shelf
   ========================================================================== */

/* Chat is anchored to the visual viewport as one flex room. Android WebView may
   pan focused inputs, so the dialog owns the viewport and only messages scroll. */
html:has(body.chat-room-open),
body.chat-room-open {
  height: 100% !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
}
#chatSheet[open] {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}
#chatSheet[open] .chat-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  overflow: hidden !important;
}
#chatSheet[open] .chat-sticky-head {
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) auto !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: 0 !important;
  z-index: 30 !important;
}
#chatSheet[open] .chat-peer-head {
  min-width: 0 !important;
  overflow: hidden !important;
}
#chatSheet[open] .chat-peer-copy {
  min-width: 0 !important;
  overflow: hidden !important;
}
#chatSheet[open] .chat-peer-copy h3 {
  max-width: 100% !important;
}
#chatSheet[open] .chat-head-actions {
  display: grid !important;
  grid-template-columns: auto 40px !important;
  align-items: center !important;
  justify-self: end !important;
  gap: 7px !important;
  min-width: 0 !important;
}
#chatSheet[open] #chatAiToggle.chat-ai-btn {
  display: inline-grid !important;
  grid-template-columns: 15px auto !important;
  place-content: center !important;
  gap: 4px !important;
  width: auto !important;
  min-width: 64px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 9px !important;
  border-radius: 14px !important;
  white-space: nowrap !important;
}
#chatSheet[open] #chatAiToggle.chat-ai-btn span {
  display: inline !important;
  color: #effffb !important;
  font-size: 8.5px !important;
  font-weight: 1000 !important;
  letter-spacing: .025em !important;
  line-height: 1 !important;
}
#chatSheet[open] .chat-close-btn.xbtn {
  position: static !important;
  inset: auto !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 40px !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 0 2px !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.06) !important;
  color: #f6fffd !important;
  font-size: 23px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}
#chatSheet[open] .chat-close-btn.xbtn:hover,
#chatSheet[open] .chat-close-btn.xbtn:focus-visible {
  border-color: rgba(255,93,145,.48) !important;
  background: rgba(255,55,126,.12) !important;
}
#chatSheet[open] .chat-messages {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}
#chatSheet[open] .chat-input {
  position: relative !important;
  inset: auto !important;
  flex: 0 0 auto !important;
}

@media (max-width: 719px) {
  #chatSheet[open] {
    position: fixed !important;
    inset: var(--vc-vvo, 0px) 0 auto 0 !important;
    display: block !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: var(--vc-vvh, 100dvh) !important;
    min-height: var(--vc-vvh, 100dvh) !important;
    max-height: var(--vc-vvh, 100dvh) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #02070a !important;
  }
  #chatSheet[open] .chat-card {
    position: absolute !important;
    inset: 0 !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    border: 0 !important;
    border-radius: 0 !important;
  }
  #chatSheet[open] .chat-sticky-head {
    grid-template-columns: 38px minmax(0, 1fr) auto !important;
    gap: 7px !important;
    min-height: calc(62px + env(safe-area-inset-top)) !important;
    padding: calc(8px + env(safe-area-inset-top)) 8px 8px !important;
    border-radius: 0 !important;
  }
  #chatSheet[open] .chat-back-btn {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    border-radius: 12px !important;
  }
  #chatSheet[open] .chat-peer-head { gap: 7px !important; }
  #chatSheet[open] .chat-peer-avatar {
    flex-basis: 36px !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 12px !important;
  }
  #chatSheet[open] .chat-peer-copy small { font-size: 6.5px !important; }
  #chatSheet[open] .chat-peer-copy h3 { font-size: 13.5px !important; }
  #chatSheet[open] .chat-peer-copy em { display: none !important; }
  #chatSheet[open] .chat-head-actions {
    grid-template-columns: 58px 38px !important;
    gap: 5px !important;
  }
  #chatSheet[open] #chatAiToggle.chat-ai-btn {
    width: 58px !important;
    min-width: 58px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding-inline: 6px !important;
    border-radius: 12px !important;
  }
  #chatSheet[open] #chatAiToggle.chat-ai-btn svg {
    width: 14px !important;
    height: 14px !important;
  }
  #chatSheet[open] #chatAiToggle.chat-ai-btn span { font-size: 7.6px !important; }
  #chatSheet[open] .chat-close-btn.xbtn {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    border-radius: 12px !important;
    font-size: 21px !important;
  }
  #chatSheet[open] .chat-messages {
    padding: 13px 10px 11px !important;
    scroll-padding-top: 13px !important;
    scroll-padding-bottom: 78px !important;
  }
  body.chat-keyboard-open #chatSheet[open] .chat-sticky-head {
    min-height: calc(54px + env(safe-area-inset-top)) !important;
    padding-top: calc(6px + env(safe-area-inset-top)) !important;
    padding-bottom: 6px !important;
  }
  body.chat-keyboard-open #chatSheet[open] .chat-peer-avatar {
    flex-basis: 33px !important;
    width: 33px !important;
    height: 33px !important;
  }
  body.chat-keyboard-open #chatSheet[open] .chat-peer-copy small { display: none !important; }
  body.chat-keyboard-open #chatSheet[open] .chat-product { display: none !important; }
}

/* The package sheet starts directly with the four package cards. The summary
   and explanation panels are intentionally absent from this chooser. */
#pricingSheet .current-plan-box.active-plan-box,
#pricingSheet .package-v141-intro,
#pricingSheet .package-v142-intro,
#pricingSheet .package-v143-intro,
#pricingSheet .package-v144-intro {
  display: none !important;
}
#pricingSheet .pricing-body {
  padding-top: 7px !important;
}
#pricingSheet .pricing-body > .pricing-section {
  margin-top: 0 !important;
}
.pricing-grid:has(.package-v144) {
  grid-template-columns: repeat(4, minmax(260px, 1fr)) !important;
  gap: 16px !important;
}
.pricing-plan.package-v144 {
  min-height: 500px !important;
}
@media (max-width: 1399px) {
  .pricing-grid:has(.package-v144) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 719px) {
  #pricingSheet .pricing-body { padding-top: 3px !important; }
  .pricing-grid:has(.package-v144) { grid-template-columns: 1fr !important; gap: 14px !important; }
  .pricing-plan.package-v144 { min-height: 430px !important; }
}

/* Compact commerce cards: on wide screens they become small premium horizontal
   cards instead of stretching into giant empty panels. On phones the proven
   three-up photo layout remains compact and touch friendly. */
.smart-shop-shelf {
  padding: 4px 6px 6px !important;
  border-radius: 16px !important;
}
.smart-shop-shelf-head {
  grid-template-columns: 27px minmax(0, 1fr) auto auto !important;
  min-height: 34px !important;
  margin-bottom: 5px !important;
  padding: 3px 6px 3px 5px !important;
  gap: 1px 6px !important;
  border-radius: 11px !important;
}
.smart-shop-shelf-mark {
  width: 27px !important;
  height: 27px !important;
  border-radius: 9px !important;
}
.smart-shop-shelf-mark svg {
  width: 15px !important;
  height: 15px !important;
}
.smart-shop-shelf-title { font-size: 10.8px !important; }
.smart-shop-shelf-shop { font-size: 7.5px !important; }
.smart-shop-shelf-ai,
.smart-shop-shelf-page {
  padding: 3px 5px !important;
  font-size: 6.5px !important;
}
.smart-shop-shelf-window {
  overflow: hidden !important;
}
.smart-shop-shelf-track {
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  flex-wrap: nowrap !important;
  gap: 9px !important;
  min-height: 82px !important;
  padding: 0 4px 2px !important;
}
.smart-shop-product {
  display: grid !important;
  grid-template-columns: 64px minmax(0, 1fr) !important;
  grid-template-rows: 1fr !important;
  align-items: stretch !important;
  flex: 0 1 196px !important;
  width: clamp(148px, 11.5vw, 196px) !important;
  min-width: 148px !important;
  max-width: 196px !important;
  height: 82px !important;
  padding: 6px !important;
  gap: 8px !important;
  border-radius: 15px !important;
  background:
    radial-gradient(circle at 0 0, rgba(42,240,202,.08), transparent 45%),
    linear-gradient(145deg, rgba(8,22,27,.98), rgba(5,9,14,.99)) !important;
  box-shadow: 0 9px 22px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.045) !important;
}
.smart-shop-product-image {
  width: 64px !important;
  height: 70px !important;
  min-width: 64px !important;
  min-height: 70px !important;
  padding: 3px !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-radius: 11px !important;
  background: rgba(255,255,255,.025) !important;
  object-fit: contain !important;
}
.smart-shop-product.is-service .smart-shop-product-image {
  padding: 0 !important;
  object-fit: cover !important;
}
.smart-shop-product-copy {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
.smart-shop-product-title {
  display: -webkit-box !important;
  min-width: 0 !important;
  margin: 0 0 6px !important;
  overflow: hidden !important;
  color: #f7fffd !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  line-height: 1.25 !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}
.smart-shop-product-price {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  align-self: flex-start !important;
  width: auto !important;
  max-width: 100% !important;
  height: 20px !important;
  min-height: 20px !important;
  padding: 0 8px !important;
  overflow: hidden !important;
  border: 1px solid rgba(42,240,202,.14) !important;
  border-radius: 999px !important;
  background: rgba(42,240,202,.08) !important;
  color: #cffff3 !important;
  font-size: 7.5px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.smart-shop-product.is-service .smart-shop-product-price {
  border-color: rgba(84,194,255,.20) !important;
  background: linear-gradient(90deg, rgba(42,240,202,.10), rgba(80,111,255,.11)) !important;
}
@media (min-width: 1800px) {
  .smart-shop-product {
    flex-basis: 204px !important;
    width: 204px !important;
    max-width: 204px !important;
  }
}
@media (min-width: 720px) and (max-width: 1099px) {
  .smart-shop-shelf-track { gap: 7px !important; min-height: 80px !important; }
  .smart-shop-product {
    grid-template-columns: 58px minmax(0, 1fr) !important;
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 178px !important;
    height: 80px !important;
    padding: 5px !important;
    gap: 7px !important;
  }
  .smart-shop-product-image {
    width: 58px !important;
    height: 68px !important;
    min-width: 58px !important;
    min-height: 68px !important;
  }
  .smart-shop-product-title { font-size: 9.4px !important; }
}
@media (max-width: 719px) {
  .smart-shop-shelf-track {
    display: grid !important;
    grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(0, 1fr)) !important;
    justify-content: stretch !important;
    gap: 5px !important;
    min-height: 82px !important;
    padding: 0 !important;
  }
  .smart-shop-product {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: minmax(0, 1fr) 21px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 82px !important;
    padding: 3px 3px 0 !important;
    gap: 0 !important;
    border-radius: 10px !important;
  }
  .smart-shop-product-image {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 2px !important;
    border: 0 !important;
    border-radius: 8px !important;
  }
  .smart-shop-product-copy { display: contents !important; }
  .smart-shop-product-title { display: none !important; }
  .smart-shop-product-price {
    display: flex !important;
    align-self: stretch !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: none !important;
    height: 21px !important;
    min-height: 21px !important;
    padding: 0 4px !important;
    border: 0 !important;
    border-radius: 0 0 8px 8px !important;
    font-size: 7px !important;
    text-align: center !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .smart-shop-product,
  .smart-shop-shelf-track { transition: none !important; animation: none !important; }
}

/* v144 keyboard guard: older mobile rules fixed the header at 50% and then
   translated it left, which could hide the back button and participant block
   when Android opened the keyboard. Keep the whole header inside the room. */
@media (max-width: 719px) {
  body.chat-room-open.chat-keyboard-open #chatSheet[open] .chat-sticky-head {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    flex: 0 0 auto !important;
  }
}

/* ============================================================================
   v145.0.0 · Borderless four-card commerce rail and focused tabbed profile
   ========================================================================== */

/* The recommendation rail is now only a row of useful cards. The former
   full-width tinted panel, heading, Vi AI badge and page counter are absent. */
.reel-card.is-active > .smart-shop-shelf,
.smart-shop-shelf,
.smart-shop-shelf[data-group-kind="services"],
.smart-shop-shelf[data-group-kind="products"] {
  top: calc(var(--vc-topbar-bottom, 77px) + 2px) !important;
  align-items: stretch !important;
  gap: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.smart-shop-shelf::before,
.smart-shop-shelf::after,
.smart-shop-shelf-head {
  display: none !important;
  content: none !important;
}
.smart-shop-shelf-window {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  padding: 1px 0 5px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.smart-shop-shelf-track {
  display: grid !important;
  grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(0, 172px)) !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 1440px !important;
  min-height: 76px !important;
  margin: 0 auto !important;
  padding: 0 6px !important;
}
.smart-shop-product {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) !important;
  grid-template-rows: 1fr !important;
  align-items: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 172px !important;
  height: 76px !important;
  padding: 5px !important;
  gap: 7px !important;
  overflow: hidden !important;
  border: 1px solid rgba(102, 250, 222, .30) !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 0 0, rgba(42, 240, 202, .11), transparent 48%),
    linear-gradient(145deg, rgba(8, 20, 25, .97), rgba(4, 8, 13, .985)) !important;
  box-shadow: 0 9px 23px rgba(0, 0, 0, .40), inset 0 1px 0 rgba(255, 255, 255, .065) !important;
  backdrop-filter: blur(12px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.08) !important;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}
.smart-shop-product:nth-child(4n + 2) { border-color: rgba(104, 151, 255, .34) !important; }
.smart-shop-product:nth-child(4n + 3) { border-color: rgba(255, 169, 55, .35) !important; }
.smart-shop-product:nth-child(4n) { border-color: rgba(255, 83, 146, .33) !important; }
.smart-shop-product::after {
  display: block !important;
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .025) !important;
  pointer-events: none !important;
}
.smart-shop-product:hover,
.smart-shop-product:focus-visible {
  transform: translateY(-3px) scale(1.015) !important;
  border-color: rgba(102, 255, 226, .74) !important;
  box-shadow: 0 14px 30px rgba(0, 0, 0, .48), 0 0 22px rgba(42, 240, 202, .14), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}
.smart-shop-product-image {
  width: 58px !important;
  height: 66px !important;
  min-width: 58px !important;
  min-height: 66px !important;
  padding: 2px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, .08) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, .035) !important;
  object-fit: contain !important;
  object-position: center !important;
  filter: none !important;
}
.smart-shop-product.is-service .smart-shop-product-image {
  padding: 0 !important;
  object-fit: cover !important;
}
.smart-shop-product.is-service::before {
  top: 7px !important;
  left: 7px !important;
  padding: 2px 4px !important;
  border-radius: 999px !important;
  background: rgba(3, 11, 16, .84) !important;
  color: #baffef !important;
  font-size: 5.5px !important;
  letter-spacing: .045em !important;
}
.smart-shop-product-copy {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
.smart-shop-product-title {
  display: -webkit-box !important;
  min-width: 0 !important;
  margin: 0 0 6px !important;
  overflow: hidden !important;
  color: #f7fffd !important;
  font-size: 9.5px !important;
  font-weight: 950 !important;
  line-height: 1.22 !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}
.smart-shop-product-price {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  align-self: flex-start !important;
  width: auto !important;
  max-width: 100% !important;
  height: 19px !important;
  min-height: 19px !important;
  padding: 0 7px !important;
  overflow: hidden !important;
  border: 1px solid rgba(42, 240, 202, .18) !important;
  border-radius: 999px !important;
  background: rgba(42, 240, 202, .09) !important;
  color: #d7fff6 !important;
  font-size: 6.8px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.smart-shop-product.is-service .smart-shop-product-price {
  border-color: rgba(94, 183, 255, .22) !important;
  background: linear-gradient(90deg, rgba(42, 240, 202, .10), rgba(80, 111, 255, .12)) !important;
}
.smart-shop-card-skeleton {
  min-width: 0 !important;
  height: 76px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: linear-gradient(105deg, rgba(255, 255, 255, .035), rgba(42, 240, 202, .07), rgba(255, 255, 255, .035)) !important;
  box-shadow: 0 9px 23px rgba(0, 0, 0, .28) !important;
}

/* The profile is a fixed-height workspace. Header, tabs and save controls stay
   visible while only the selected panel scrolls, preventing one giant page. */
#meSheet.me-v145-sheet .me-v145-card {
  display: flex !important;
  flex-direction: column !important;
  width: min(980px, calc(100vw - 34px)) !important;
  max-width: 980px !important;
  height: min(850px, calc(100dvh - 28px)) !important;
  min-height: min(620px, calc(100dvh - 28px)) !important;
  max-height: calc(100dvh - 28px) !important;
  padding: 15px 18px 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(115, 248, 223, .17) !important;
  border-radius: 28px !important;
  background:
    radial-gradient(circle at 8% -12%, rgba(42, 240, 202, .10), transparent 34%),
    radial-gradient(circle at 96% 108%, rgba(255, 55, 126, .07), transparent 35%),
    linear-gradient(180deg, rgba(4, 11, 15, .995), rgba(3, 7, 11, .995)) !important;
  box-shadow: 0 32px 96px rgba(0, 0, 0, .58), inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}
#meSheet .sheet-bar,
#meSheet .me-v145-title,
#meSheet .me-v112-intro,
#meSheet .me-v145-tabs,
#meSheet .me-v145-savebar {
  flex: 0 0 auto !important;
}
#meSheet .me-v145-title {
  min-height: 50px !important;
  margin: 0 !important;
  padding: 0 0 5px !important;
}
#meSheet .me-v145-title h3 { font-size: 19px !important; }
#meSheet .me-v112-intro {
  margin: 0 0 9px !important;
  color: rgba(232, 249, 246, .58) !important;
  font-size: 10px !important;
}
#meSheet .me-v145-tabs {
  position: relative !important;
  z-index: 36 !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
  width: 100% !important;
  margin: 0 0 10px !important;
  padding: 6px !important;
  border: 1px solid rgba(255, 255, 255, .085) !important;
  border-radius: 18px !important;
  background: rgba(5, 12, 16, .94) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .045) !important;
  backdrop-filter: blur(18px) saturate(1.12) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.12) !important;
}
#meSheet .me-v145-tab {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  min-height: 45px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 1px solid transparent !important;
  border-radius: 13px !important;
  background: transparent !important;
  color: rgba(237, 251, 248, .58) !important;
  font-size: 10.5px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: color .18s ease, border-color .18s ease, background .18s ease, transform .18s ease !important;
}
#meSheet .me-v145-tab svg {
  flex: 0 0 17px !important;
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#meSheet .me-v145-tab:hover,
#meSheet .me-v145-tab:focus-visible {
  color: #f5fffd !important;
  background: rgba(255, 255, 255, .05) !important;
}
#meSheet .me-v145-tab.is-active {
  border-color: rgba(83, 255, 222, .26) !important;
  background:
    radial-gradient(circle at 20% 0, rgba(42, 240, 202, .16), transparent 54%),
    linear-gradient(135deg, rgba(42, 240, 202, .13), rgba(80, 99, 255, .09)) !important;
  color: #effffb !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 7px 18px rgba(0, 0, 0, .20) !important;
}
#meSheet .me-v145-tab.is-active svg { color: #64f5d8 !important; }
#meSheet .me-v145-panel {
  display: none !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 3px 12px 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(42, 240, 202, .60) transparent !important;
}
#meSheet .me-v145-panel.is-active {
  display: grid !important;
  align-content: start !important;
  gap: 10px !important;
  animation: vc-v145-profile-panel-in .24s cubic-bezier(.2, .8, .2, 1) both !important;
}
#meSheet .me-v145-panel[hidden] { display: none !important; }
#meSheet .me-v145-panel::-webkit-scrollbar { width: 5px !important; }
#meSheet .me-v145-panel::-webkit-scrollbar-thumb { border-radius: 999px !important; background: rgba(42, 240, 202, .56) !important; }
@keyframes vc-v145-profile-panel-in {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}
#meSheet .me-v112-section,
#meSheet .me-v112-overview,
#meSheet .me-v145-panel-intro {
  margin: 0 !important;
  padding: 12px !important;
  border: 1px solid rgba(255, 255, 255, .085) !important;
  border-radius: 20px !important;
  background: linear-gradient(145deg, rgba(255, 255, 255, .042), rgba(255, 255, 255, .018)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}
#meSheet .me-v112-section-head { margin-bottom: 9px !important; }
#meSheet .me-v112-section-head h4 { font-size: 14px !important; }
#meSheet .me-v112-signin {
  padding: 0 !important;
  overflow: hidden !important;
}
#meSheet .me-v112-signin .signin-card {
  min-height: 62px !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 0 !important;
  border-radius: 20px !important;
  background: linear-gradient(110deg, rgba(42, 240, 202, .055), rgba(255, 255, 255, .02)) !important;
}
#meSheet .signin-card.is-active-account {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 62px !important;
  padding: 11px 14px !important;
}
#meSheet .signin-card.is-active-account > div:first-child { min-width: 0 !important; }
#meSheet .signin-card.is-active-account > div:first-child b,
#meSheet .signin-card.is-active-account > div:first-child small {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#meSheet .signin-card.is-active-account > div:first-child b { font-size: 12px !important; }
#meSheet .signin-card.is-active-account > div:first-child small { margin-top: 3px !important; font-size: 9px !important; }
#meSheet .me-v112-signed-pill {
  min-height: 34px !important;
  padding: 5px 10px 5px 6px !important;
  border-radius: 999px !important;
  font-size: 9px !important;
}
#meSheet .me-v145-identity-layout {
  display: grid !important;
  grid-template-columns: minmax(210px, .72fr) minmax(0, 1.65fr) !important;
  gap: 10px !important;
  align-items: stretch !important;
}
#meSheet .me-v145-identity-layout .profile-editor-avatar {
  height: 100% !important;
  min-height: 126px !important;
  margin: 0 !important;
  padding: 12px !important;
  grid-template-columns: 72px minmax(0, 1fr) !important;
  align-content: center !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, rgba(42, 240, 202, .08), rgba(255, 255, 255, .035)) !important;
}
#meSheet .me-v145-identity-layout .avatar-wrap {
  width: 72px !important;
  height: 72px !important;
}
#meSheet .me-v112-fields {
  align-content: start !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
#meSheet .me-v112-fields input,
#meSheet .me-v112-fields textarea {
  min-height: 47px !important;
  border-radius: 15px !important;
}
#meSheet .me-v112-fields textarea {
  min-height: 62px !important;
  resize: vertical !important;
}
#meSheet .me-v145-panel-intro {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  min-height: 72px !important;
}
#meSheet .me-v145-panel-intro > div { min-width: 0 !important; }
#meSheet .me-v145-panel-intro small {
  color: #58efd2 !important;
  font-size: 7px !important;
  font-weight: 1000 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}
#meSheet .me-v145-panel-intro h4 { margin: 2px 0 0 !important; font-size: 15px !important; }
#meSheet .me-v145-panel-intro p { margin: 4px 0 0 !important; color: rgba(231, 247, 244, .55) !important; font-size: 9.5px !important; }
#meSheet .me-v145-panel-icon {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 42px !important;
  width: 42px !important;
  height: 42px !important;
  border: 1px solid rgba(42, 240, 202, .20) !important;
  border-radius: 14px !important;
  background: rgba(42, 240, 202, .09) !important;
  color: #9ff8e5 !important;
}
#meSheet .me-v145-panel-icon svg { width: 21px !important; height: 21px !important; fill: none !important; stroke: currentColor !important; stroke-width: 1.65 !important; }
#meSheet .me-v112-overview {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 9px !important;
}
#meSheet .me-v112-overview > * {
  grid-column: auto !important;
  min-height: 76px !important;
  border-radius: 17px !important;
}
#meSheet .me-v112-overview #profileTrustOpen {
  grid-column: auto !important;
  width: 100% !important;
}
#meSheet .me-v112-service .service-provider-toggle {
  max-width: 430px !important;
  min-height: 44px !important;
  padding: 8px 11px !important;
  border-radius: 15px !important;
  font-size: 10px !important;
}
#meSheet .me-v112-service .service-profile-fields.open {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 10px !important;
  border-radius: 17px !important;
}
#meSheet .me-v112-service .service-profile-fields select,
#meSheet .me-v112-service .service-profile-fields input {
  min-height: 47px !important;
  border-radius: 15px !important;
}
#meSheet .me-v112-service .profile-cover-editor,
#meSheet .me-v112-service .me-v112-service-note {
  grid-column: 1 / -1 !important;
}
#meSheet .me-v112-preferences .profile-switches {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
#meSheet .me-v112-preferences .profile-switches label {
  min-height: 50px !important;
  padding: 9px 11px !important;
  border-radius: 15px !important;
  font-size: 10px !important;
}
#meSheet .me-v112-tool-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
#meSheet .me-v112-tool-grid button {
  min-height: 70px !important;
  padding: 10px 11px !important;
  border-radius: 16px !important;
}
#meSheet .me-v112-tool-grid button b { font-size: 11px !important; }
#meSheet .me-v112-tool-grid button small { font-size: 8px !important; line-height: 1.25 !important; }
#meSheet .me-v113-logout {
  min-height: 56px !important;
  margin-top: 9px !important;
  border-radius: 16px !important;
}
#meSheet .me-v145-savebar {
  position: relative !important;
  z-index: 42 !important;
  bottom: auto !important;
  margin: 0 -2px !important;
  padding: 9px 2px calc(10px + env(safe-area-inset-bottom)) !important;
  background: linear-gradient(180deg, rgba(3, 8, 12, .48), rgba(3, 8, 12, .995) 36%) !important;
}
#meSheet .me-v145-savebar #saveProfile {
  min-height: 48px !important;
  border-radius: 15px !important;
}

@media (min-width: 720px) and (max-width: 1099px) {
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf { top: calc(var(--vc-mobile-header-bottom, 138px) + 2px) !important; }
  .smart-shop-shelf-track {
    grid-template-columns: repeat(var(--vc-smart-shop-cols), minmax(0, 1fr)) !important;
    gap: 6px !important;
    min-height: 72px !important;
    padding-inline: 4px !important;
  }
  .smart-shop-product {
    grid-template-columns: 52px minmax(0, 1fr) !important;
    max-width: none !important;
    height: 72px !important;
    padding: 4px !important;
    gap: 6px !important;
    border-radius: 13px !important;
  }
  .smart-shop-product-image {
    width: 52px !important;
    height: 62px !important;
    min-width: 52px !important;
    min-height: 62px !important;
  }
  .smart-shop-product-title { font-size: 8.5px !important; }
  .smart-shop-product-price { height: 18px !important; min-height: 18px !important; font-size: 6.2px !important; padding-inline: 6px !important; }
  #meSheet .me-v112-tool-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media (max-width: 719px) {
  .reel-card.is-active > .smart-shop-shelf,
  .smart-shop-shelf {
    top: calc(var(--vc-mobile-header-bottom, 138px) + 2px) !important;
    left: 5px !important;
    right: 5px !important;
    width: auto !important;
    max-width: none !important;
  }
  .smart-shop-shelf-window { padding: 0 0 4px !important; }
  .smart-shop-shelf-track {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 4px !important;
    min-height: 84px !important;
    padding: 0 !important;
  }
  .smart-shop-product {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: minmax(0, 1fr) 20px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 84px !important;
    padding: 2px 2px 0 !important;
    gap: 0 !important;
    border-radius: 11px !important;
    background: linear-gradient(155deg, rgba(7, 19, 23, .97), rgba(3, 8, 12, .985)) !important;
  }
  .smart-shop-product-image {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 1px !important;
    border: 0 !important;
    border-radius: 9px 9px 7px 7px !important;
  }
  .smart-shop-product.is-service::before { display: none !important; }
  .smart-shop-product-copy { display: contents !important; }
  .smart-shop-product-title { display: none !important; }
  .smart-shop-product-price {
    display: flex !important;
    align-self: stretch !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: none !important;
    height: 20px !important;
    min-height: 20px !important;
    padding: 0 3px !important;
    border: 0 !important;
    border-radius: 0 0 9px 9px !important;
    background: rgba(2, 9, 12, .94) !important;
    font-size: 6.5px !important;
    text-align: center !important;
  }
  .smart-shop-card-skeleton { height: 84px !important; border-radius: 11px !important; }

  #meSheet.me-v145-sheet {
    padding: 0 !important;
    background: #02070a !important;
  }
  #meSheet.me-v145-sheet .me-v145-card {
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: calc(8px + env(safe-area-inset-top)) 9px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
  }
  #meSheet .sheet-bar { margin-top: 1px !important; }
  #meSheet .me-v145-title { min-height: 46px !important; padding-bottom: 3px !important; }
  #meSheet .me-v145-title h3 { font-size: 17px !important; }
  #meSheet .me-v112-intro {
    max-width: calc(100% - 52px) !important;
    margin-bottom: 7px !important;
    overflow: hidden !important;
    font-size: 8.5px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  #meSheet .me-v145-tabs {
    gap: 4px !important;
    margin-bottom: 8px !important;
    padding: 4px !important;
    border-radius: 15px !important;
  }
  #meSheet .me-v145-tab {
    flex-direction: column !important;
    gap: 2px !important;
    min-height: 47px !important;
    padding: 4px 2px !important;
    border-radius: 11px !important;
    font-size: 7.4px !important;
    line-height: 1 !important;
  }
  #meSheet .me-v145-tab svg { width: 15px !important; height: 15px !important; flex-basis: 15px !important; }
  #meSheet .me-v145-panel { padding: 0 2px 10px 0 !important; }
  #meSheet .me-v145-panel.is-active { gap: 8px !important; }
  #meSheet .me-v112-section,
  #meSheet .me-v112-overview,
  #meSheet .me-v145-panel-intro {
    padding: 9px !important;
    border-radius: 17px !important;
  }
  #meSheet .signin-card.is-active-account {
    grid-template-columns: minmax(0, 1fr) auto !important;
    min-height: 54px !important;
    padding: 9px 10px !important;
  }
  #meSheet .signin-card.is-active-account > div:first-child small { display: none !important; }
  #meSheet .me-v112-signed-pill { min-height: 31px !important; padding: 4px 8px 4px 5px !important; font-size: 7.5px !important; }
  #meSheet .me-v145-identity-layout { grid-template-columns: 1fr !important; gap: 8px !important; }
  #meSheet .me-v145-identity-layout .profile-editor-avatar {
    min-height: 90px !important;
    grid-template-columns: 62px minmax(0, 1fr) !important;
    padding: 9px !important;
  }
  #meSheet .me-v145-identity-layout .avatar-wrap { width: 62px !important; height: 62px !important; }
  #meSheet .me-v112-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }
  #meSheet .me-v112-fields input,
  #meSheet .me-v112-fields textarea {
    min-height: 44px !important;
    padding-inline: 11px !important;
    border-radius: 13px !important;
    font-size: 11px !important;
  }
  #meSheet .me-v112-fields textarea { min-height: 58px !important; }
  #meSheet .me-v145-panel-intro { min-height: 62px !important; }
  #meSheet .me-v145-panel-intro p { display: none !important; }
  #meSheet .me-v112-overview { grid-template-columns: 1fr !important; gap: 7px !important; }
  #meSheet .me-v112-overview > * { min-height: 67px !important; }
  #meSheet .me-v112-service .me-v112-section-head {
    display: grid !important;
    align-items: stretch !important;
    gap: 8px !important;
  }
  #meSheet .me-v112-service .service-provider-toggle {
    max-width: none !important;
    width: 100% !important;
  }
  #meSheet .me-v112-service .service-profile-fields.open { grid-template-columns: 1fr !important; }
  #meSheet .me-v112-service .profile-cover-editor,
  #meSheet .me-v112-service .me-v112-service-note { grid-column: auto !important; }
  #meSheet .me-v112-preferences .profile-switches { grid-template-columns: 1fr !important; }
  #meSheet .me-v112-tool-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 6px !important; }
  #meSheet .me-v112-tool-grid button { min-height: 66px !important; padding: 9px !important; border-radius: 14px !important; }
  #meSheet .me-v145-savebar {
    grid-template-columns: auto minmax(0, 1fr) !important;
    gap: 7px !important;
    margin-inline: -1px !important;
    padding: 8px 1px calc(8px + env(safe-area-inset-bottom)) !important;
  }
  #meSheet .me-v145-savebar .language-inline button { width: 42px !important; min-width: 42px !important; height: 42px !important; }
  #meSheet .me-v145-savebar #saveProfile { min-height: 44px !important; }
}

@media (max-width: 360px) {
  .smart-shop-shelf-track { gap: 3px !important; }
  .smart-shop-product { height: 80px !important; grid-template-rows: minmax(0, 1fr) 19px !important; }
  .smart-shop-product-price { height: 19px !important; min-height: 19px !important; font-size: 5.9px !important; }
  #meSheet .me-v145-tab { font-size: 6.8px !important; }
  #meSheet .me-v112-fields { grid-template-columns: 1fr !important; }
  #meSheet .me-v112-fields textarea,
  #meSheet .me-v112-fields .pin-help { grid-column: auto !important; }
}

@media (prefers-reduced-motion: reduce) {
  .smart-shop-product,
  .smart-shop-shelf-track,
  #meSheet .me-v145-panel.is-active {
    transition: none !important;
    animation: none !important;
  }
}

/* v145 release marker for the unchanged four-plan workspace sizing. */
#pricingSheet .pricing-plan.package-v145 { min-height: 500px !important; }
@media (max-width: 719px) {
  #pricingSheet .pricing-plan.package-v145 { min-height: 430px !important; }
}

/* v145 focused actions: Save profile is only relevant while editing identity or
   service/contact details. Business and Tools remain clean, self-contained tabs. */
#meSheet .me-v145-card[data-me-active-tab="business"] .me-v145-savebar,
#meSheet .me-v145-card[data-me-active-tab="tools"] .me-v145-savebar {
  display: none !important;
}

/* Four-up phone cards keep a readable name instead of becoming anonymous
   thumbnails. The compact three-row layout still fits the top commerce rail. */
@media (max-width: 719px) {
  .smart-shop-shelf-track { min-height: 96px !important; }
  .smart-shop-product {
    height: 96px !important;
    grid-template-rows: minmax(0, 1fr) 20px 19px !important;
  }
  .smart-shop-product-copy {
    display: contents !important;
  }
  .smart-shop-product-title {
    display: -webkit-box !important;
    align-self: stretch !important;
    width: 100% !important;
    height: 20px !important;
    min-height: 20px !important;
    margin: 0 !important;
    padding: 2px 4px 1px !important;
    overflow: hidden !important;
    background: rgba(4, 12, 16, .93) !important;
    color: rgba(246, 255, 252, .92) !important;
    font-size: 6.1px !important;
    font-weight: 900 !important;
    line-height: 1.12 !important;
    text-align: center !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }
  .smart-shop-product-price {
    height: 19px !important;
    min-height: 19px !important;
    border-radius: 0 0 9px 9px !important;
    font-size: 6.1px !important;
  }
  .smart-shop-card-skeleton { height: 96px !important; }
}
@media (max-width: 360px) {
  .smart-shop-shelf-track { min-height: 90px !important; }
  .smart-shop-product {
    height: 90px !important;
    grid-template-rows: minmax(0, 1fr) 19px 18px !important;
  }
  .smart-shop-product-title {
    height: 19px !important;
    min-height: 19px !important;
    font-size: 5.6px !important;
  }
  .smart-shop-product-price {
    height: 18px !important;
    min-height: 18px !important;
    font-size: 5.6px !important;
  }
  .smart-shop-card-skeleton { height: 90px !important; }
}

/* v145 density refinement: tablet/desktop profile dialogs hug the active tab
   instead of reserving a tall empty canvas. Long panels scroll inside a calm,
   bounded workspace; phones remain genuinely full-screen and top-anchored. */
@media (min-width: 720px) {
  #meSheet.me-v145-sheet .me-v145-card {
    height: auto !important;
    min-height: 0 !important;
    max-height: min(720px, calc(100dvh - 28px)) !important;
  }
  #meSheet .me-v145-panel {
    flex: 0 1 auto !important;
    max-height: min(520px, calc(100dvh - 210px)) !important;
  }
}
@media (max-width: 719px) {
  #meSheet.me-v145-sheet {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    min-width: 100vw !important;
    max-width: 100vw !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    overflow: hidden !important;
    transform: none !important;
  }
  #meSheet.me-v145-sheet .me-v145-card {
    position: relative !important;
    inset: auto !important;
    transform: none !important;
  }
  #meSheet .me-v145-panel {
    flex: 1 1 auto !important;
    max-height: none !important;
  }
}


/* ============================================================================
   v146.0.0 · Visible mobile More, five focused account tabs and Flyer capacity
   ========================================================================== */

/* The whole globe shell remains steady while an asymmetric inner grid and marker
   turn visibly. This reads as a real rotating world instead of a symmetric icon
   that appears frozen. */
#statusDot.tools-more-trigger,
.ghost-dot.action-menu-trigger.tools-more-trigger {
  box-sizing: border-box !important;
  overflow: visible !important;
  border-color: rgba(92, 255, 222, .62) !important;
  background:
    radial-gradient(circle at 84% 22%, rgba(83, 255, 223, .14), transparent 34%),
    linear-gradient(145deg, rgba(7, 39, 37, .99), rgba(5, 11, 17, .995)) !important;
}
#statusDot .tools-orbit svg {
  overflow: visible !important;
  animation: none !important;
  transform: none !important;
}
#statusDot .tools-globe-shell {
  fill: rgba(42, 240, 202, .055) !important;
  stroke: rgba(224, 255, 249, .92) !important;
}
#statusDot .tools-globe-grid {
  transform-box: fill-box !important;
  transform-origin: center !important;
  animation: vc-v146-globe-grid-turn 3.6s linear infinite !important;
}
#statusDot .tools-globe-marker {
  fill: #ff4d9a !important;
  stroke: #fff !important;
  stroke-width: .55 !important;
  filter: drop-shadow(0 0 2.5px rgba(255, 77, 154, .9)) !important;
  animation: vc-v146-globe-marker-pulse 1.8s ease-in-out infinite !important;
}
@keyframes vc-v146-globe-grid-turn {
  to { transform: rotate(360deg); }
}
@keyframes vc-v146-globe-marker-pulse {
  0%, 100% { opacity: .72; }
  50% { opacity: 1; }
}

@media (max-width: 719px) {
  .topbar .location-row {
    box-sizing: border-box !important;
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    margin-inline: 0 !important;
    grid-template-columns: minmax(0, 1fr) 38px minmax(58px, 82px) 88px !important;
    gap: 5px !important;
    overflow: visible !important;
  }
  #statusDot.tools-more-trigger,
  .ghost-dot.action-menu-trigger.tools-more-trigger {
    justify-self: end !important;
    width: 88px !important;
    min-width: 88px !important;
    max-width: 88px !important;
    min-height: 43px !important;
    padding: 0 7px 0 10px !important;
    gap: 7px !important;
    border-radius: 999px !important;
  }
  #statusDot .tools-more-label {
    min-width: 0 !important;
    font-size: 8.8px !important;
    letter-spacing: .055em !important;
  }
  #statusDot .tools-orbit {
    flex: 0 0 25px !important;
    width: 25px !important;
    height: 25px !important;
    min-width: 25px !important;
    min-height: 25px !important;
    max-width: 25px !important;
    max-height: 25px !important;
  }
  #statusDot .tools-orbit svg {
    width: 18px !important;
    height: 18px !important;
  }
}
@media (max-width: 380px) {
  .topbar .location-row {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    grid-template-columns: minmax(0, 1fr) 36px 57px 84px !important;
    gap: 4px !important;
  }
  .location-row .tiny-lang { width: 36px !important; min-width: 36px !important; }
  .location-row .account-top-chip { min-width: 57px !important; max-width: 57px !important; padding-inline: 5px !important; }
  #statusDot.tools-more-trigger,
  .ghost-dot.action-menu-trigger.tools-more-trigger {
    width: 84px !important;
    min-width: 84px !important;
    max-width: 84px !important;
    padding-inline: 8px 6px !important;
    gap: 6px !important;
  }
  #statusDot .tools-more-label { font-size: 8.1px !important; }
}

/* Five focused profile destinations remain legible across phone, tablet and
   desktop. Package and Balance are no longer crowded into a Business panel. */
#meSheet .me-v146-tabs {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
#meSheet .me-v146-single-panel {
  align-content: start !important;
}
#meSheet .me-v146-single-panel .me-v112-overview {
  display: block !important;
  padding: 12px !important;
}
#meSheet .me-v146-single-panel .account-plan-card,
#meSheet .me-v146-single-panel .account-wallet-card {
  width: 100% !important;
  min-height: 110px !important;
  margin: 0 !important;
  border-radius: 22px !important;
}
#meSheet .me-v146-trust-tool {
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  justify-items: start !important;
  gap: 1px 10px !important;
  min-height: 74px !important;
  padding: 12px 14px !important;
  border-color: rgba(90, 255, 222, .24) !important;
  background: linear-gradient(135deg, rgba(42, 240, 202, .11), rgba(78, 101, 255, .08)) !important;
}
#meSheet .me-v146-trust-tool > span {
  grid-row: 1 / 3 !important;
  display: grid !important;
  place-items: center !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, .07) !important;
  font-size: 18px !important;
}
#meSheet .me-v146-trust-tool b { font-size: 12px !important; }
#meSheet .me-v146-trust-tool small { font-size: 8.5px !important; opacity: .62 !important; }
#meSheet .me-v145-card[data-me-active-tab="package"] .me-v145-savebar,
#meSheet .me-v145-card[data-me-active-tab="balance"] .me-v145-savebar,
#meSheet .me-v145-card[data-me-active-tab="tools"] .me-v145-savebar {
  display: none !important;
}
@media (max-width: 719px) {
  #meSheet .me-v146-tabs { gap: 3px !important; padding: 5px !important; }
  #meSheet .me-v146-tabs .me-v145-tab {
    min-height: 48px !important;
    gap: 3px !important;
    padding-inline: 2px !important;
    border-radius: 11px !important;
    font-size: 6.3px !important;
  }
  #meSheet .me-v146-tabs .me-v145-tab svg {
    width: 14px !important;
    height: 14px !important;
    flex-basis: 14px !important;
  }
  #meSheet .me-v146-single-panel .me-v112-overview { padding: 9px !important; }
  #meSheet .me-v146-single-panel .account-plan-card,
  #meSheet .me-v146-single-panel .account-wallet-card {
    min-height: 104px !important;
  }
}
@media (max-width: 360px) {
  #meSheet .me-v146-tabs .me-v145-tab {
    flex-direction: column !important;
    min-height: 50px !important;
    font-size: 5.8px !important;
    line-height: 1 !important;
  }
}

/* Flyer is a first-class comparison capacity in every public package. */
#pricingSheet .pricing-plan.package-v146 { min-height: 530px !important; }
#pricingSheet .pricing-plan.package-v146 .plan-capacity-grid > [data-plan-capacity="flyer"] {
  grid-column: 1 / -1 !important;
  min-height: 58px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  border-color: rgba(88, 255, 223, .22) !important;
  background:
    radial-gradient(circle at 100% 0, rgba(255, 79, 156, .12), transparent 45%),
    linear-gradient(135deg, rgba(42, 240, 202, .10), rgba(74, 94, 255, .07)) !important;
}
#pricingSheet .pricing-plan.package-v146 .plan-capacity-grid > [data-plan-capacity="flyer"] small {
  font-size: 10px !important;
}
#pricingSheet .pricing-plan.package-v146 .plan-capacity-grid > [data-plan-capacity="flyer"] b {
  margin: 0 !important;
  color: #effffb !important;
  font-size: 13px !important;
  text-align: right !important;
}
@media (max-width: 719px) {
  #pricingSheet .pricing-plan.package-v146 { min-height: 470px !important; }
}

@media (prefers-reduced-motion: reduce) {
  #statusDot .tools-globe-grid,
  #statusDot .tools-globe-marker {
    animation: none !important;
  }
}

/* ============================================================================
   v147.0.0 · Direct Package/Balance profile destinations
   ========================================================================== */

/* Each profile tab now behaves as its own compact page. Package and Balance
   render the complete destination inside the workspace instead of a summary
   card that sends the user through another step. */
#meSheet .me-v147-direct-panel {
  align-content: start !important;
  gap: 0 !important;
  padding-right: 2px !important;
}
#meSheet .me-v147-package-body,
#meSheet .me-v147-balance-body {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}
#meSheet .me-v147-direct-loading,
#meSheet .me-v147-direct-empty {
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 9px !important;
  min-height: 180px !important;
  padding: 24px !important;
  border: 1px solid rgba(94, 255, 222, .14) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 50% 0, rgba(42, 240, 202, .09), transparent 48%),
    rgba(255, 255, 255, .025) !important;
  color: rgba(241, 255, 251, .82) !important;
  text-align: center !important;
}
#meSheet .me-v147-direct-empty small {
  max-width: 430px !important;
  color: rgba(231, 248, 244, .58) !important;
  line-height: 1.4 !important;
}
#meSheet .me-v147-direct-empty button {
  min-height: 40px !important;
  border-radius: 14px !important;
}

/* Direct package comparison: no duplicate outer panel, just four polished
   cards. Two columns keep tablet/desktop dense; phones use one readable card. */
#meSheet .me-v147-package-body {
  display: block !important;
}
#meSheet .me-v147-package-body .pricing-section {
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
#meSheet .me-v147-package-body .pricing-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 11px !important;
}
#meSheet .me-v147-package-body .pricing-plan.package-v147 {
  min-width: 0 !important;
  min-height: 438px !important;
  padding: 15px !important;
  border-radius: 23px !important;
  border-color: rgba(255, 255, 255, .105) !important;
  background:
    radial-gradient(circle at 8% -4%, rgba(42, 240, 202, .13), transparent 34%),
    linear-gradient(150deg, rgba(255, 255, 255, .066), rgba(255, 255, 255, .025)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045), 0 14px 34px rgba(0, 0, 0, .18) !important;
}
#meSheet .me-v147-package-body .pricing-plan.package-v147.current {
  border-color: rgba(75, 255, 218, .38) !important;
  background:
    radial-gradient(circle at 8% -4%, rgba(42, 240, 202, .21), transparent 38%),
    linear-gradient(150deg, rgba(42, 240, 202, .085), rgba(255, 255, 255, .026)) !important;
}
#meSheet .me-v147-package-body .pricing-plan.package-v147 .plan-capacity-grid {
  gap: 8px !important;
}
#meSheet .me-v147-package-body .pricing-plan.package-v147 .plan-capacity-grid > span {
  min-height: 58px !important;
  border-radius: 16px !important;
}
#meSheet .me-v147-package-body .pricing-plan.package-v147 [data-plan-capacity="flyer"] {
  grid-column: 1 / -1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  border-color: rgba(88, 255, 223, .22) !important;
  background:
    radial-gradient(circle at 100% 0, rgba(255, 79, 156, .12), transparent 45%),
    linear-gradient(135deg, rgba(42, 240, 202, .10), rgba(74, 94, 255, .07)) !important;
}
#meSheet .me-v147-package-body .pricing-plan.package-v147 [data-plan-capacity="flyer"] b {
  margin: 0 !important;
  text-align: right !important;
}
#meSheet .me-v147-package-body .pricing-plan.package-v147 .plan-actions {
  position: sticky !important;
  bottom: 0 !important;
  padding-top: 5px !important;
  background: linear-gradient(180deg, transparent, rgba(4, 10, 14, .88) 34%) !important;
}

/* Full Merchant account inside Balance tab. The hero, three metrics,
   withdrawal, sales, purchases and report appear immediately. */
#meSheet .me-v147-balance-body {
  display: grid !important;
  gap: 12px !important;
}
#meSheet .me-v147-balance-body .me-v147-wallet-hero {
  min-height: 124px !important;
  padding: 16px !important;
  border: 1px solid rgba(92, 255, 222, .18) !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 12% 0, rgba(42, 240, 202, .18), transparent 40%),
    linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .035)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 42px rgba(0, 0, 0, .20) !important;
}
#meSheet .me-v147-balance-body .me-v147-wallet-hero h3 {
  margin: 2px 0 0 !important;
  color: #f5fffd !important;
  font-size: clamp(25px, 4vw, 36px) !important;
  letter-spacing: -.05em !important;
}
#meSheet .me-v147-balance-body .me-v147-wallet-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 9px !important;
}
#meSheet .me-v147-balance-body .me-v147-wallet-stats > span {
  display: grid !important;
  align-content: center !important;
  min-height: 76px !important;
  padding: 11px !important;
  border: 1px solid rgba(255, 255, 255, .09) !important;
  border-radius: 19px !important;
  background: linear-gradient(145deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .022)) !important;
}
#meSheet .me-v147-balance-body .me-v147-wallet-stats b {
  color: #effffb !important;
  font-size: 15px !important;
}
#meSheet .me-v147-balance-body .me-v147-wallet-stats small {
  margin-top: 4px !important;
  color: rgba(234, 250, 246, .56) !important;
  font-size: 9.5px !important;
}
#meSheet .me-v147-balance-body .seller-fee-note,
#meSheet .me-v147-balance-body .me-v147-withdraw-box,
#meSheet .me-v147-balance-body .wallet-section {
  margin: 0 !important;
  border-radius: 21px !important;
}
#meSheet .me-v147-balance-body .seller-fee-note {
  min-height: 66px !important;
}
#meSheet .me-v147-balance-body .me-v147-withdraw-box {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto !important;
  gap: 8px !important;
  padding: 12px !important;
  border: 1px solid rgba(255, 255, 255, .095) !important;
  background: linear-gradient(145deg, rgba(255, 255, 255, .05), rgba(42, 240, 202, .025)) !important;
}
#meSheet .me-v147-balance-body .me-v147-withdraw-box input {
  min-width: 0 !important;
  min-height: 48px !important;
  border-radius: 15px !important;
}
#meSheet .me-v147-balance-body .me-v147-withdraw-box button {
  min-width: 170px !important;
  min-height: 48px !important;
  border-radius: 15px !important;
  white-space: nowrap !important;
}
#meSheet .me-v147-balance-body .wallet-section {
  padding: 13px !important;
  border: 1px solid rgba(255, 255, 255, .085) !important;
  background: linear-gradient(145deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .017)) !important;
}
#meSheet .me-v147-balance-body .wallet-section h4 {
  margin: 0 0 10px !important;
  color: #effffb !important;
  font-size: 14px !important;
}
#meSheet .me-v147-balance-body .wallet-order {
  margin-top: 8px !important;
  border-radius: 18px !important;
}
#meSheet .me-v147-balance-body .report-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

/* Dynamic page copy remains compact and clearly belongs to the selected tab. */
#meSheet .me-v145-title #meSheetKicker {
  color: #52f3d4 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}
#meSheet .me-v145-title #meSheetHeading {
  transition: opacity .16s ease, transform .16s ease !important;
}

@media (min-width: 1180px) {
  #meSheet.me-v145-sheet .me-v145-card {
    width: min(1080px, calc(100vw - 34px)) !important;
    max-width: 1080px !important;
  }
}

@media (max-width: 719px) {
  #meSheet.me-v145-sheet .me-v145-card {
    width: 100vw !important;
    max-width: 100vw !important;
    height: var(--vc-vvh, 100dvh) !important;
    min-height: var(--vc-vvh, 100dvh) !important;
    max-height: var(--vc-vvh, 100dvh) !important;
    padding: max(10px, env(safe-area-inset-top)) 10px max(5px, env(safe-area-inset-bottom)) !important;
    border-radius: 0 !important;
  }
  #meSheet .me-v145-title {
    min-height: 47px !important;
  }
  #meSheet .me-v112-intro {
    min-height: 26px !important;
    margin-bottom: 7px !important;
    line-height: 1.32 !important;
  }
  #meSheet .me-v147-package-body .pricing-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  #meSheet .me-v147-package-body .pricing-plan.package-v147 {
    min-height: 425px !important;
    padding: 13px !important;
    border-radius: 21px !important;
  }
  #meSheet .me-v147-balance-body .me-v147-wallet-hero {
    min-height: 112px !important;
    padding: 13px !important;
    border-radius: 23px !important;
  }
  #meSheet .me-v147-balance-body .me-v147-wallet-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }
  #meSheet .me-v147-balance-body .me-v147-wallet-stats > span {
    min-height: 70px !important;
    padding: 8px !important;
    border-radius: 17px !important;
  }
  #meSheet .me-v147-balance-body .me-v147-wallet-stats b {
    font-size: 12px !important;
  }
  #meSheet .me-v147-balance-body .me-v147-wallet-stats small {
    font-size: 7.8px !important;
    line-height: 1.15 !important;
  }
  #meSheet .me-v147-balance-body .me-v147-withdraw-box {
    grid-template-columns: 1fr !important;
    padding: 10px !important;
  }
  #meSheet .me-v147-balance-body .me-v147-withdraw-box button {
    width: 100% !important;
    min-width: 0 !important;
  }
  #meSheet .me-v147-balance-body .report-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 370px) {
  #meSheet .me-v147-balance-body .me-v147-wallet-stats {
    grid-template-columns: 1fr !important;
  }
  #meSheet .me-v147-balance-body .me-v147-wallet-stats > span {
    min-height: 58px !important;
  }
}

/* v147 colour lock: form controls have browser-dependent default text colours.
   Pin the account workspace and dynamic page title to the premium light palette. */
#meSheet.me-v145-sheet .me-v145-card {
  color: #f4fffc !important;
}
#meSheet .me-v145-title #meSheetHeading {
  color: #f4fffc !important;
  -webkit-text-fill-color: #f4fffc !important;
}