:root {
  color-scheme: light;
  --lolo-background: #07090D;
  --lolo-background-secondary: #0E1118;
  --lolo-elevated: #151923;
  --lolo-raised: #202735;
  --lolo-text: #F7F8FA;
  --lolo-text-secondary: #BEC4D0;
  --lolo-text-muted: #8C95A5;
  --lolo-gold: #FFC32B;
  --lolo-gold-hover: #FFD45C;
  --lolo-ai: #A78BFA;
  --lolo-success: #41D58D;
  --lolo-warning: #F6B84A;
  --lolo-danger: #FF6B6B;
  --lolo-admin: #68A8FF;
  --lolo-border: #2C3442;
  --lolo-focus: #FFE08A;
  --ink: #07090D;
  --muted: #606979;
  --line: #DDE1E8;
  --surface: #FFFFFF;
  --canvas: #F7F8FA;
  --peach: #FFF7DF;
  --mint: var(--lolo-success);
  --violet: var(--lolo-ai);
  --pink: var(--lolo-gold-hover);
  --coral: var(--lolo-gold);
  --danger: var(--lolo-danger);
  --success: var(--lolo-success);
  --shadow: 0 18px 48px rgba(7, 9, 13, 0.1);
  --radius: 18px;
}

* { box-sizing: border-box; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--canvas);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 15px;
  line-height: 1.5;
}
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid var(--lolo-focus); outline-offset: 3px; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }

.site-header {
  position: sticky;
  z-index: 30;
  top: 0;
  min-height: 74px;
  padding: 0 max(22px, calc((100vw - 1240px) / 2));
  display: grid;
  grid-template-columns: 230px 1fr auto;
  align-items: center;
  gap: 20px;
  border-bottom: 1px solid rgba(223, 226, 221, 0.9);
  background: rgba(250, 250, 247, 0.92);
  backdrop-filter: blur(18px);
}
.brand { min-width: 0; display: grid; grid-template-columns: 40px auto; grid-template-rows: 21px 16px; align-items: center; column-gap: 10px; }
.brand > .brand-mark { grid-row: 1 / 3; width: 40px; height: 44px; object-fit: contain; }
.brand > b { align-self: end; color: var(--ink); font-size: 17px; letter-spacing: -0.45px; }
.brand > b > em { color: var(--lolo-gold); font-style: normal; }
.brand > small { align-self: start; overflow: hidden; display: flex; align-items: center; gap: 5px; color: #858c86; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.7px; text-overflow: ellipsis; white-space: nowrap; }
.country-flag { width: 18px; height: 18px; flex: 0 0 18px; display: inline-grid; place-items: center; overflow: hidden; border: 1px solid rgba(23, 24, 23, 0.1); border-radius: 50%; background: #fff; font-size: 14px; font-style: normal; line-height: 1; box-shadow: 0 2px 6px rgba(23, 24, 23, 0.1); }
.desktop-nav { height: 100%; display: flex; align-items: center; justify-content: center; gap: 6px; }
.desktop-nav > a { position: relative; min-height: 42px; padding: 0 14px; display: inline-flex; align-items: center; border-radius: 12px; color: #5e655f; font-size: 13px; font-weight: 750; }
.desktop-nav > a:hover, .desktop-nav > a.active { color: var(--ink); background: #fff; }
.desktop-nav > a.active::after { content: ""; position: absolute; right: 15px; bottom: 7px; left: 15px; height: 2px; border-radius: 2px; background: var(--lolo-gold); }
.desktop-nav i { min-width: 17px; height: 17px; margin-left: 6px; padding: 0 4px; display: inline-grid; place-items: center; border-radius: 20px; color: #fff; background: var(--pink); font-size: 9px; font-style: normal; }
.header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.language-switcher select, .theme-toggle { height: 36px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: var(--surface); font-size: 11px; font-weight: 900; }
.language-switcher select { padding: 0 8px; }
.theme-toggle { width: 36px; padding: 0; display: grid; place-items: center; font-size: 17px; }
.text-button { padding: 10px; font-size: 13px; font-weight: 800; }
.primary-button, .dark-button, .outline-button {
  min-height: 46px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: 0; border-radius: 13px; font-weight: 850; transition: 160ms ease;
}
.primary-button { color: #07090D; background: linear-gradient(135deg, var(--lolo-gold), var(--lolo-gold-hover)); box-shadow: 0 9px 20px rgba(255, 195, 43, 0.2); }
.primary-button:hover { transform: translateY(-1px); box-shadow: 0 12px 26px rgba(255, 195, 43, 0.28); }
.primary-button.small { min-height: 40px; padding: 0 15px; font-size: 12px; }
.dark-button { color: #fff; background: var(--ink); }
.outline-button { border: 1px solid var(--line); background: #fff; }
.account-menu { position: relative; }
.account-menu summary { display: flex; align-items: center; gap: 8px; list-style: none; cursor: pointer; }
.account-menu summary::-webkit-details-marker { display: none; }
.account-menu summary > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--ink); font-weight: 900; }
.account-menu summary > b { max-width: 112px; overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.account-menu > div { position: absolute; top: 48px; right: 0; width: 220px; padding: 8px; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: var(--shadow); }
.account-menu > div a, .account-menu > div button { width: 100%; min-height: 39px; padding: 0 10px; display: flex; align-items: center; border: 0; border-radius: 9px; background: transparent; font-size: 12px; font-weight: 750; text-align: left; }
.account-menu > div a:hover, .account-menu > div button:hover { background: #f3f3ef; }
.site-main { width: min(1240px, calc(100% - 44px)); min-height: calc(100vh - 230px); margin: 0 auto; }
.flash { position: fixed; z-index: 80; top: 86px; right: 24px; max-width: 380px; padding: 14px 42px 14px 16px; border: 1px solid #dde0dc; border-radius: 13px; background: #fff; box-shadow: var(--shadow); font-weight: 750; }
.flash.success { border-color: #bde7d1; color: #136d4e; }
.flash.error { border-color: #f2b5bd; color: #a61f33; }
.flash button { position: absolute; top: 7px; right: 8px; width: 28px; height: 28px; border: 0; border-radius: 50%; background: #f2f3f0; }
.market-hero { position: relative; min-height: 390px; margin-top: 22px; padding: 62px 60px 38px; overflow: hidden; border-radius: 32px; background: radial-gradient(circle at 85% 10%, rgba(122, 86, 232, 0.22), transparent 32%), radial-gradient(circle at 8% 90%, rgba(184, 241, 213, 0.5), transparent 34%), linear-gradient(135deg, #fff3ee, #fff 58%, #f1edff); box-shadow: inset 0 0 0 1px rgba(225, 221, 218, 0.9); }
.market-hero::before, .market-hero::after { content: ""; position: absolute; border-radius: 50%; }
.market-hero::before { top: -110px; right: -85px; width: 280px; height: 280px; background: linear-gradient(135deg, var(--pink), var(--violet)); opacity: 0.16; }
.market-hero::after { bottom: 78px; left: -90px; width: 180px; height: 180px; border: 36px solid rgba(255, 90, 80, 0.1); }
.hero-copy { position: relative; z-index: 1; max-width: 700px; }
.eyebrow { color: var(--pink); font-size: 11px; font-weight: 950; letter-spacing: 1.4px; }
.hero-copy h1 { max-width: 710px; margin: 10px 0 8px; font-size: clamp(42px, 5.3vw, 74px); line-height: 0.99; letter-spacing: -4px; }
.hero-copy p { max-width: 620px; margin: 0; color: #636b65; font-size: 17px; }
.free-seal { position: absolute; z-index: 2; top: 48px; right: 55px; width: 126px; height: 126px; padding: 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; transform: rotate(5deg); border-radius: 50% 50% 50% 26%; color: #fff; background: var(--ink); text-align: center; box-shadow: 0 18px 30px rgba(20, 22, 20, 0.18); }
.free-seal b { color: var(--mint); font-size: 28px; letter-spacing: -1px; }
.free-seal span { margin-top: 3px; font-size: 9px; font-weight: 800; line-height: 1.25; }
.hero-search { position: relative; z-index: 3; margin-top: 50px; padding: 8px; display: grid; grid-template-columns: 1.2fr .85fr 1fr 130px; gap: 8px; border: 1px solid var(--line); border-radius: 20px; background: #fff; box-shadow: var(--shadow); }
.hero-search label { min-height: 65px; padding: 10px 14px; display: grid; grid-template-columns: 28px 1fr; grid-template-rows: 18px 28px; align-items: center; column-gap: 8px; border-radius: 13px; background: #f5f6f3; }
.hero-search label small { grid-column: 1 / 3; color: #858d87; font-size: 10px; font-weight: 850; text-transform: uppercase; letter-spacing: 0.6px; }
.hero-search label > span { color: var(--violet); font-size: 22px; }
.hero-search input, .hero-search select { width: 100%; padding: 0; border: 0; outline: 0; color: var(--ink); background: transparent; font-weight: 750; }
.hero-search button { border: 0; border-radius: 14px; color: #fff; background: var(--ink); font-weight: 900; }
.hero-search > input[type="hidden"] { display: none; }
.hero-search label:nth-child(2) { grid-template-columns: 28px 1fr 34px; }
.hero-search label:nth-child(2) small { grid-column: 1 / 4; }
.hero-search .geo-button { width: 32px; height: 32px; padding: 0; border-radius: 10px; color: #fff; background: var(--violet); font-size: 17px; }
.hero-search .geo-button { overflow: hidden; white-space: nowrap; }
.geo-button.is-locating { color: transparent; }
.geo-button.is-locating::after { content: ""; position: absolute; width: 13px; height: 13px; margin: 9px; inset: 0; border: 2px solid rgba(255,255,255,.45); border-top-color: #fff; border-radius: 50%; animation: location-spin .7s linear infinite; }
.geo-button { position: relative; }
@keyframes location-spin { to { transform: rotate(360deg); } }
.hero-search .hero-city { grid-template-columns: 28px 1fr; }
.hero-search .hero-city small { grid-column: 1 / 3; }
.hero-search .location-picker { min-width: 0; }
.hero-search .location-picker input { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hero-search .location-picker > button { display: none; }
.category-row { margin: 20px 0 12px; padding: 10px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; border: 1px solid var(--line); border-radius: 22px; background: #fff; }
.category-row a { min-height: 70px; padding: 9px; display: grid; grid-template-columns: 46px 1fr; align-items: center; gap: 9px; border-radius: 14px; }
.category-row a:hover { background: #f5f2ff; }
.category-row a > span { width: 45px; height: 45px; display: grid; place-items: center; border-radius: 13px; background: linear-gradient(135deg, var(--peach), #f0ecff); color: var(--violet); font-size: 19px; font-weight: 900; }
.category-row div { min-width: 0; display: flex; flex-direction: column; }
.category-row b { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.category-row small { margin-top: 3px; overflow: hidden; color: #939a95; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.trust-strip { margin: 22px 0 30px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.trust-strip article { min-height: 108px; padding: 20px; display: grid; grid-template-columns: 50px 1fr; align-items: center; gap: 14px; border: 1px solid var(--line); border-radius: 20px; background: #fff; }
.trust-strip article > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50% 50% 50% 18px; color: #123e2f; background: var(--mint); font-size: 19px; font-weight: 950; }
.trust-strip article:nth-child(2) > span { color: #5c3ccc; background: #ede7ff; }
.trust-strip article:nth-child(3) > span { color: #a22c3e; background: #ffe5e9; }
.trust-strip b { font-size: 13px; }
.trust-strip p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.section-heading { min-height: 95px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.section-heading > div > span { color: var(--pink); font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: 1px; }
.section-heading h1, .section-heading h2 { margin: 4px 0 0; font-size: 29px; letter-spacing: -1px; }
.section-heading > a { font-size: 12px; font-weight: 850; }
.sponsored-card { min-height: 112px; margin-bottom: 18px; padding: 22px 26px; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-radius: 22px; color: #fff; background: radial-gradient(circle at 15% 150%, rgba(184, 241, 213, 0.28), transparent 45%), linear-gradient(120deg, #171817, #3c315f); }
.sponsored-card small { color: var(--mint); font-size: 9px; font-weight: 900; letter-spacing: 1px; text-transform: uppercase; }
.sponsored-card h3 { margin: 4px 0; font-size: 21px; }
.sponsored-card p { margin: 0; color: #c7c9c7; font-size: 12px; }
.sponsored-card > a { min-width: 100px; padding: 12px 16px; border-radius: 11px; color: #171817; background: var(--mint); font-weight: 900; text-align: center; }
.listing-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; }
.listing-card { overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: #fff; transition: 180ms ease; }
.listing-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.listing-image { position: relative; aspect-ratio: 1.2; overflow: hidden; display: block; background: #eceeea; }
.listing-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 300ms ease; }
.listing-card:hover .listing-image img { transform: scale(1.025); }
.listing-image > span, .featured-badge, .urgent-badge, .top-badge { position: absolute; padding: 6px 8px; border-radius: 8px; font-size: 9px; font-weight: 900; backdrop-filter: blur(8px); }
.listing-image > span { bottom: 10px; left: 10px; color: #176a4e; background: rgba(231, 249, 241, 0.94); }
.featured-badge { top: 10px; right: 10px; color: #292b2a; border: 1px solid rgba(255,255,255,.72); background: rgba(255,255,255,.86); box-shadow: 0 8px 24px rgba(20,22,20,.12); }
.urgent-badge { top: 10px; left: 10px; color: #fff4c6; border: 1px solid rgba(255,220,117,.35); background: rgba(24,25,24,.86); box-shadow: 0 8px 25px rgba(20,22,20,.22); letter-spacing: .45px; }
.top-badge { top: 10px; left: 10px; color: #2d240d; border: 1px solid rgba(255,255,255,.55); background: rgba(255,218,104,.92); box-shadow: 0 8px 25px rgba(92,70,10,.18); letter-spacing: .35px; }
.listing-content { padding: 13px; }
.listing-location { overflow: hidden; color: #828a83; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.listing-location span { color: var(--violet); }
.listing-card h3 { height: 43px; margin: 7px 0 5px; overflow: hidden; font-size: 15px; line-height: 1.35; }
.listing-price { min-height: 35px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #eceeea; }
.listing-price b { font-size: 18px; letter-spacing: -0.5px; }
.listing-price small { color: #858d87; font-size: 10px; }
.seller-line { min-height: 44px; display: grid; grid-template-columns: 28px 1fr 16px; align-items: center; gap: 7px; }
.seller-line > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--ink); font-size: 10px; font-weight: 900; }
.seller-line b { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.seller-line i { width: 14px; height: 14px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--violet); font-size: 8px; font-style: normal; }
.card-actions { display: grid; grid-template-columns: 38px 1fr; gap: 6px; }
.card-actions form button { width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 10px; color: var(--pink); background: #fff; font-size: 18px; }
.card-actions > a { min-height: 38px; display: flex; align-items: center; justify-content: center; gap: 8px; border-radius: 10px; color: #fff; background: var(--ink); font-size: 11px; font-weight: 850; }
.sell-banner { margin: 40px 0 70px; padding: 30px 34px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-radius: 26px; background: linear-gradient(135deg, #ffe5dc, #f0eaff); }
.sell-banner > div { display: grid; grid-template-columns: 48px 1fr; }
.sell-banner > div > span { grid-row: 1 / 3; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; color: #fff; background: var(--ink); font-size: 24px; }
.sell-banner h2 { margin: 0 0 0 14px; font-size: 23px; }
.sell-banner p { margin: 2px 0 0 14px; color: var(--muted); font-size: 12px; }
.browse-layout { padding: 38px 0 70px; display: grid; grid-template-columns: 260px 1fr; gap: 28px; }
.filter-panel { position: sticky; top: 98px; height: max-content; padding: 22px; border: 1px solid var(--line); border-radius: 20px; background: #fff; }
.filter-panel h1 { margin: 4px 0 18px; font-size: 25px; }
.filter-panel form, .campaign-form, .settings-form, .expense-form, .auth-card form { display: flex; flex-direction: column; gap: 13px; }
.filter-panel label, .campaign-form label, .settings-form label, .expense-form label, .auth-card label, .listing-form label, .deal-grid label { display: flex; flex-direction: column; gap: 6px; color: #5f675f; font-size: 11px; font-weight: 800; }
input, select, textarea { width: 100%; min-height: 45px; padding: 0 12px; border: 1px solid #dfe2de; border-radius: 11px; outline: none; color: var(--ink); background: #fff; }
textarea { min-height: 110px; padding-top: 11px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--violet); box-shadow: 0 0 0 3px rgba(118, 87, 232, 0.09); }
.price-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.reset-link { color: var(--violet); font-size: 11px; font-weight: 800; text-align: center; }
.location-tools { min-height: 42px; padding: 7px; display: flex; align-items: center; gap: 8px; border-radius: 11px; background: #f1edff; }
.location-tools button { min-height: 30px; padding: 0 9px; border: 0; border-radius: 8px; color: #fff; background: var(--violet); font-size: 10px; font-weight: 850; }
.location-tools small { color: #635d78; font-size: 9px; }
.location-picker { position: relative; width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.location-picker > input { min-width: 0; }
.location-picker > [data-location-choose] { min-height: 34px; padding: 0 9px; border: 0; border-radius: 9px; color: var(--violet); background: #f1edff; font-size: 10px; font-weight: 900; }
.location-results { position: absolute; z-index: 70; top: calc(100% + 6px); right: 0; left: 0; max-height: 310px; padding: 7px; overflow-y: auto; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: 0 20px 45px rgba(23,24,23,.18); }
.location-results[hidden] { display: none; }
.location-results > button { width: 100%; min-height: 44px; padding: 7px 9px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 0; border-radius: 9px; color: var(--ink); background: transparent; text-align: left; }
.location-results > button:hover, .location-results > button:focus { outline: 0; background: var(--peach); }
.location-results b { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.location-results small, .location-results p { margin: 0; color: var(--muted); font-size: 10px; }
.location-results p { padding: 11px; }
.form-location { margin-top: 13px; }
.browse-results { min-width: 0; }
.results-heading { min-height: 76px; display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.results-heading span { color: var(--pink); font-size: 10px; font-weight: 900; text-transform: uppercase; }
.results-heading h2 { margin: 3px 0 0; font-size: 28px; }
.results-actions { display: flex; align-items: center; gap: 8px; }
.results-actions a, .results-actions button { min-height: 38px; padding: 0 12px; border: 0; border-radius: 10px; background: #eee9ff; color: #583dc4; font-size: 11px; font-weight: 850; }
.results-actions button { background: #fff; box-shadow: inset 0 0 0 1px var(--line); }
.browse-results .listing-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.empty-state { min-height: 390px; padding: 40px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px dashed #d7dad5; border-radius: 24px; background: #fff; text-align: center; }
.empty-state > span { width: 78px; height: 78px; display: grid; place-items: center; border-radius: 50% 50% 50% 25%; color: var(--violet); background: #eee9ff; font-size: 28px; font-weight: 900; }
.empty-state h1, .empty-state h2 { margin: 18px 0 7px; }
.empty-state p { max-width: 100%; margin: 0 0 20px; overflow-wrap: anywhere; color: var(--muted); }
.empty-actions { display: flex; gap: 9px; }
.listing-detail { padding: 38px 0 30px; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(390px, 0.9fr); gap: 34px; }
.detail-gallery { min-width: 0; }
.main-photo { position: relative; aspect-ratio: 1.1; overflow: hidden; border-radius: 25px; background: #eceeea; outline: none; touch-action: pan-y; }
.main-photo img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; }
.main-photo:focus-visible { box-shadow: 0 0 0 3px rgba(118,87,232,.28); }
.gallery-expand { position: absolute; z-index: 3; top: 16px; right: 16px; width: 44px; height: 44px; padding: 0; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.32); border-radius: 50%; color: #fff; background: rgba(15,17,16,.72); box-shadow: 0 8px 26px rgba(0,0,0,.2); backdrop-filter: blur(10px); font-size: 19px; font-weight: 900; cursor: pointer; transition: transform 160ms, background 160ms; }
.gallery-expand:hover { transform: scale(1.06); background: rgba(15,17,16,.92); }
.gallery-expand:focus-visible { outline: 3px solid rgba(255,255,255,.8); outline-offset: 2px; }
.gallery-arrow { position: absolute; z-index: 2; top: 50%; width: 48px; height: 48px; padding: 0; display: grid; place-items: center; transform: translateY(-50%); border: 1px solid rgba(255,255,255,.3); border-radius: 50%; color: #fff; background: rgba(15,17,16,.72); box-shadow: 0 8px 26px rgba(0,0,0,.2); backdrop-filter: blur(10px); font-size: 21px; font-weight: 900; cursor: pointer; transition: transform 160ms, background 160ms, opacity 160ms; }
.gallery-arrow:hover:not(:disabled) { transform: translateY(-50%) scale(1.06); background: rgba(15,17,16,.9); }
.gallery-arrow:focus-visible { outline: 3px solid rgba(255,255,255,.8); outline-offset: 2px; }
.gallery-arrow:disabled { opacity: .3; cursor: default; }
.gallery-previous { left: 16px; }
.gallery-next { right: 16px; }
.gallery-count { position: absolute; z-index: 2; right: 16px; bottom: 15px; padding: 6px 9px; border: 1px solid rgba(255,255,255,.25); border-radius: 20px; color: #fff; background: rgba(15,17,16,.7); backdrop-filter: blur(9px); font-size: 10px; font-weight: 900; }
.thumb-row { margin-top: 10px; display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.thumb-row button { aspect-ratio: 1; padding: 0; overflow: hidden; border: 2px solid transparent; border-radius: 11px; background: #eee; }
.thumb-row button.active { border-color: var(--pink); }
.thumb-row img { width: 100%; height: 100%; object-fit: cover; }
body.gallery-open { overflow: hidden; }
.gallery-lightbox[hidden] { display: none; }
.gallery-lightbox { position: fixed; z-index: 999; inset: 0; padding: 24px; display: grid; place-items: center; background: rgba(5,7,6,.92); backdrop-filter: blur(18px); overscroll-behavior: contain; }
.gallery-lightbox-dialog { width: min(1180px, 100%); height: min(820px, calc(100vh - 48px)); display: grid; grid-template-rows: auto minmax(0, 1fr); overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 24px; background: #0f1110; box-shadow: 0 28px 90px rgba(0,0,0,.58); }
.lightbox-toolbar { min-height: 64px; padding: 10px 12px 10px 20px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-bottom: 1px solid rgba(255,255,255,.1); color: #fff; background: rgba(22,25,23,.96); }
.lightbox-toolbar > span { min-width: 54px; color: #d7ddd8; font-size: 12px; font-weight: 900; letter-spacing: .04em; }
.lightbox-toolbar > div { display: flex; align-items: center; gap: 7px; }
.lightbox-toolbar button { min-width: 42px; height: 42px; padding: 0 12px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.14); border-radius: 12px; color: #fff; background: #282c29; font-size: 17px; font-weight: 900; cursor: pointer; transition: border-color 160ms, background 160ms, opacity 160ms, transform 160ms; }
.lightbox-toolbar button:hover:not(:disabled) { border-color: rgba(255,255,255,.34); background: #343936; transform: translateY(-1px); }
.lightbox-toolbar button:focus-visible, .lightbox-arrow:focus-visible { outline: 3px solid rgba(168,149,255,.85); outline-offset: 2px; }
.lightbox-toolbar button:disabled { opacity: .35; cursor: default; }
.lightbox-toolbar [data-gallery-zoom-reset] { min-width: 64px; font-size: 11px; }
.lightbox-toolbar .lightbox-close { margin-left: 5px; color: #171817; background: #fff; font-size: 24px; }
.lightbox-stage { position: relative; min-height: 0; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at center, #242825, #0b0d0c 68%); touch-action: none; }
.lightbox-viewport { width: 100%; height: 100%; display: grid; place-items: center; overflow: hidden; }
.lightbox-viewport img { width: 100%; height: 100%; object-fit: contain; transform: scale(var(--gallery-zoom, 1)); transform-origin: center; transition: transform 180ms ease; user-select: none; -webkit-user-drag: none; }
.lightbox-arrow { position: absolute; z-index: 2; top: 50%; width: 50px; height: 50px; padding: 0; display: grid; place-items: center; transform: translateY(-50%); border: 1px solid rgba(255,255,255,.25); border-radius: 50%; color: #fff; background: rgba(15,17,16,.78); box-shadow: 0 10px 30px rgba(0,0,0,.35); backdrop-filter: blur(12px); font-size: 21px; font-weight: 900; cursor: pointer; transition: transform 160ms, background 160ms, opacity 160ms; }
.lightbox-arrow:hover:not(:disabled) { transform: translateY(-50%) scale(1.06); background: rgba(50,55,52,.95); }
.lightbox-arrow:disabled { opacity: .22; cursor: default; }
.lightbox-previous { left: 18px; }
.lightbox-next { right: 18px; }
.detail-breadcrumb { display: flex; gap: 8px; color: #7b837c; font-size: 11px; }
.detail-title { margin-top: 18px; display: grid; grid-template-columns: 1fr 48px; gap: 10px; }
.detail-title > div > span { display: inline-block; padding: 5px 8px; border-radius: 7px; color: #176a4e; background: #e8f8f0; font-size: 9px; font-weight: 900; }
.detail-title h1 { margin: 9px 0 5px; font-size: 34px; line-height: 1.12; letter-spacing: -1.2px; }
.detail-title p { margin: 0; color: var(--muted); font-size: 11px; }
.detail-title form button { width: 46px; height: 46px; border: 1px solid var(--line); border-radius: 50%; color: var(--pink); background: #fff; font-size: 22px; }
.detail-title form button.saved { color: #fff; background: var(--pink); }
.detail-price { margin: 20px 0 12px; font-size: 35px; font-weight: 950; letter-spacing: -1.3px; }
.detail-description { color: #555d56; font-size: 14px; line-height: 1.7; }
.detail-specs { margin: 20px 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.detail-specs > div { padding: 12px; border-radius: 11px; background: #f1f3ef; }
.detail-specs dt { color: #8a918b; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.detail-specs dd { margin: 3px 0 0; font-size: 12px; font-weight: 800; }
.seller-panel { padding: 17px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.seller-profile { display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: 11px; }
.seller-profile > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--ink); font-weight: 900; }
.seller-profile small { color: #8b928c; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.seller-profile h3 { margin: 2px 0; font-size: 15px; }
.seller-profile h3 i { width: 14px; height: 14px; display: inline-grid; place-items: center; border-radius: 50%; color: #fff; background: var(--violet); font-size: 8px; font-style: normal; }
.seller-profile p { margin: 0; color: var(--muted); font-size: 10px; }
.contact-actions { margin-top: 13px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 7px; }
.contact-actions a, .contact-actions button { min-height: 42px; padding: 0 8px; font-size: 10px; }
.share-status { min-height: 16px; grid-column: 1 / -1; color: var(--muted); font-size: 10px; }
.listing-safety { margin-top: 10px; padding: 13px; display: grid; grid-template-columns: 30px 1fr; align-items: center; gap: 9px; border: 1px solid #f0dfac; border-radius: 14px; background: #fff9e8; }
.listing-safety > span, .safety-banner > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; color: #7b5200; background: #ffe7a0; font-weight: 950; }
.listing-safety p, .safety-banner p { margin: 0; color: #6d5d34; font-size: 10px; }
.deal-grid { margin-top: 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.deal-grid form { padding: 16px; border: 1px solid var(--line); border-radius: 17px; background: #fff; }
.deal-grid h3 { margin: 0 0 10px; font-size: 14px; }
.deal-grid textarea { min-height: 82px; }
.deal-grid input, .deal-grid textarea { margin-bottom: 8px; }
.deal-grid button { width: 100%; min-height: 42px; font-size: 11px; }
.report-box { margin-top: 13px; padding: 12px; border-radius: 12px; background: #f2f3f0; color: #666d67; font-size: 11px; }
.report-box summary { cursor: pointer; font-weight: 800; }
.report-box form { margin-top: 10px; display: grid; gap: 7px; }
.report-box button { min-height: 39px; border: 0; border-radius: 9px; color: #fff; background: var(--danger); font-weight: 800; }
.login-callout { min-height: 52px; margin-top: 12px; padding: 0 16px; display: flex; align-items: center; justify-content: center; border-radius: 13px; color: #fff; background: var(--ink); font-weight: 850; }
.auth-shell { min-height: calc(100vh - 74px); margin-right: calc((100vw - min(1240px, calc(100vw - 44px))) / -2); margin-left: calc((100vw - min(1240px, calc(100vw - 44px))) / -2); display: grid; grid-template-columns: 1fr 1fr; background: #fff; }
.auth-promo { padding: 55px max(45px, calc((100vw - 1240px) / 2 + 40px)); display: flex; flex-direction: column; justify-content: space-between; color: #fff; background: radial-gradient(circle at 100% 0, rgba(255, 79, 134, 0.36), transparent 34%), radial-gradient(circle at 0 100%, rgba(184, 241, 213, 0.25), transparent 33%), #171817; }
.brand-light > b { color: var(--lolo-text); }
.brand-light > small { color: #aeb7b0; }
.auth-promo h1 { max-width: 520px; margin: 10px 0; font-size: 54px; line-height: 1; letter-spacing: -2.5px; }
.auth-promo p { max-width: 500px; color: #b9c0ba; }
.auth-promo ul { margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; list-style: none; color: #d4d8d5; font-size: 12px; }
.auth-card { width: min(430px, calc(100% - 40px)); margin: auto; padding: 35px; border: 1px solid var(--line); border-radius: 24px; background: #fff; box-shadow: var(--shadow); }
.auth-card h1 { margin: 6px 0 20px; font-size: 32px; }
.auth-card > p { color: var(--muted); font-size: 12px; text-align: center; }
.auth-card > p a { color: var(--violet); font-weight: 850; }
.auth-card button { margin-top: 5px; }
.single-auth { display: flex; }
.form-page { padding: 44px 0 80px; }
.form-intro { max-width: 800px; margin-bottom: 28px; }
.form-intro h1 { margin: 6px 0; font-size: 45px; letter-spacing: -2px; }
.form-intro p { color: var(--muted); }
.listing-form { display: flex; flex-direction: column; gap: 16px; }
.form-section { padding: 28px; display: grid; grid-template-columns: 54px 1fr; gap: 20px; border: 1px solid var(--line); border-radius: 24px; background: #fff; }
.form-section > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50% 50% 50% 18px; color: #fff; background: var(--ink); font-weight: 900; }
.form-section h2 { margin: 0; font-size: 23px; }
.form-section h2 + p { margin: 3px 0 16px; color: var(--muted); font-size: 11px; }
.upload-zone { min-height: 180px; display: flex !important; flex-direction: column; align-items: center; justify-content: center; border: 1px dashed #cfd4ce; border-radius: 18px; background: #f7f8f5; cursor: pointer; }
.upload-zone input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.upload-zone b { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 16px; color: #fff; background: linear-gradient(135deg, var(--coral), var(--pink)); font-size: 26px; }
.upload-zone strong { margin-top: 9px; color: var(--ink); }
.upload-zone small { color: #8d948e; }
.upload-zone.ready { border-color: var(--violet); background: #f3f0ff; }
.photo-preview { margin-top: 12px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 9px; }
.photo-preview:empty { display: none; }
.photo-preview figure { position: relative; aspect-ratio: 1; margin: 0; overflow: hidden; border-radius: 13px; background: #eceeea; }
.photo-preview img { width: 100%; height: 100%; object-fit: cover; }
.photo-preview figure:first-child::after { content: "COVER"; position: absolute; left: 7px; bottom: 7px; padding: 3px 6px; border-radius: 6px; color: #fff; background: rgba(23, 24, 23, 0.78); font-size: 8px; font-weight: 900; letter-spacing: 0.6px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-grid .wide { grid-column: 1 / 3; }
.listing-form textarea { min-height: 160px; }
.field-help { margin-top: 6px; display: flex; justify-content: space-between; gap: 14px; color: var(--muted); font-size: 10px; font-weight: 500; }
.field-help b { flex: 0 0 auto; color: var(--violet); }
.condition-picker { margin: 0; padding: 0; border: 0; }
.condition-picker legend { margin-bottom: 7px; color: var(--ink); font-size: 11px; font-weight: 850; }
.condition-picker > div { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.condition-picker label { min-height: 78px; padding: 9px 6px; display: flex !important; flex-direction: column; align-items: center; justify-content: center; gap: 4px; border: 1px solid var(--line); border-radius: 13px; background: #fafaf7; cursor: pointer; text-align: center; }
.condition-picker input { position: absolute; opacity: 0; }
.condition-picker label > span { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 9px; color: var(--violet); background: #eeebff; font-size: 14px; }
.condition-picker label > b { font-size: 10px; }
.condition-picker label:has(input:checked) { border-color: var(--violet); background: #f5f2ff; box-shadow: inset 0 0 0 1px var(--violet); }
.condition-picker label:has(input:checked) > span { color: #fff; background: var(--violet); }
.ai-writer { padding: 16px; border: 1px solid #dcd5ff; border-radius: 18px; background: radial-gradient(circle at 95% 0, rgba(255, 79, 134, 0.12), transparent 30%), linear-gradient(135deg, #f7f4ff, #fff); }
.ai-writer-head { margin-bottom: 13px; display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 10px; }
.ai-writer-head > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px; color: #fff; background: linear-gradient(135deg, var(--violet), var(--pink)); box-shadow: 0 8px 18px rgba(118, 87, 232, 0.2); }
.ai-writer-head div { display: flex; flex-direction: column; }
.ai-writer-head b { font-size: 14px; }
.ai-writer-head small, .ai-writer-action small { color: var(--muted); font-size: 10px; }
.ai-writer-action { margin-top: 12px; display: flex; align-items: center; gap: 12px; }
.ai-writer-action button { min-height: 40px; padding: 0 15px; border: 0; border-radius: 11px; color: #fff; background: var(--violet); font-size: 11px; font-weight: 900; }
.choice-card { max-width: 420px; min-height: 70px; margin-top: 14px; padding: 12px; display: grid !important; grid-template-columns: 42px 1fr; align-items: center; gap: 11px; border: 1px solid var(--line); border-radius: 15px; background: #f8f7ff; cursor: pointer; }
.choice-card input { position: absolute; opacity: 0; }
.choice-card > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; color: var(--violet); background: #ebe7ff; font-size: 19px; font-weight: 900; }
.choice-card input:checked + span { color: #fff; background: var(--violet); }
.choice-card div { display: flex; flex-direction: column; }
.choice-card small { color: var(--muted); font-size: 10px; }
.smart-fields:empty::before { content: "✓"; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; color: var(--success); background: #e6f8ef; }
[data-category-field][hidden] { display: none !important; }
.contact-choice { margin-top: 18px; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: #fbfbf8; }
.contact-choice h3 { margin: 0 0 13px; font-size: 16px; }
.contact-choice .toggle-list { margin-top: 13px; display: grid; grid-template-columns: repeat(3, 1fr); }
.contact-choice .toggle-list label { grid-template-columns: 44px 1fr; background: #fff; border: 1px solid var(--line); }
.publish-note { margin-top: 18px; padding: 16px; display: grid; grid-template-columns: 40px 1fr auto; align-items: center; gap: 12px; border-radius: 16px; background: linear-gradient(135deg, #e6f8ef, #f1ecff); }
.publish-note > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--success); }
.publish-note p { margin: 0; color: #59635b; font-size: 11px; }
.compact-form-page { max-width: 850px; margin: 0 auto; }
.settings-form, .campaign-form { padding: 28px; border: 1px solid var(--line); border-radius: 22px; background: #fff; }
.toggle-list { display: flex; flex-direction: column; gap: 8px; }
.toggle-list label { min-height: 68px; padding: 12px; display: grid !important; grid-template-columns: 44px 1fr; align-items: center; gap: 10px; border-radius: 13px; background: #f4f5f2; cursor: pointer; }
.toggle-list input { position: absolute; opacity: 0; }
.toggle-list label > span { position: relative; width: 42px; height: 24px; border-radius: 20px; background: #cdd1cc; transition: 160ms; }
.toggle-list label > span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: 160ms; }
.toggle-list input:checked + span { background: var(--violet); }
.toggle-list input:checked + span::after { transform: translateX(18px); }
.toggle-list label div { display: flex; flex-direction: column; }
.toggle-list small { color: var(--muted); font-size: 10px; }
.dashboard-hero { min-height: 180px; margin-top: 25px; padding: 34px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-radius: 26px; background: linear-gradient(135deg, #ffe6df, #f1edff); }
.dashboard-hero h1 { margin: 5px 0; font-size: 42px; letter-spacing: -1.8px; }
.dashboard-hero p { margin: 0; color: var(--muted); }
.dashboard-actions { display: flex; align-items: center; gap: 9px; }
.metric-row { margin: 16px 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.metric-row article { min-height: 90px; padding: 17px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 17px; background: #fff; }
.metric-row small { color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.metric-row b { margin-top: 5px; font-size: 26px; }
.dashboard-grid { margin-bottom: 70px; display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 14px; }
.panel { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 20px; background: #fff; }
.panel-heading { min-height: 45px; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.panel-heading h1, .panel-heading h2 { margin: 0; font-size: 19px; }
.panel-heading a, .panel-heading span { color: var(--violet); font-size: 10px; font-weight: 850; }
.management-list, .offer-list, .campaign-list { display: flex; flex-direction: column; }
.management-list article { min-height: 88px; padding: 10px 0; display: grid; grid-template-columns: 70px 1fr auto; align-items: center; gap: 12px; border-top: 1px solid #eceeea; }
.management-list img { width: 70px; height: 64px; object-fit: cover; border-radius: 11px; }
.management-list small, .offer-list small, .campaign-list small { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.management-list h3, .offer-list h3, .campaign-list h3 { margin: 3px 0; font-size: 13px; }
.management-list article > div:last-child { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }
.management-list article > div:last-child a { font-size: 10px; font-weight: 800; }
.management-list .urgent-note { margin: 2px 0; color: #8a6000; font-size: 9px; font-weight: 800; }
.urgent-request { padding: 6px 8px; border: 1px solid #e2be55; border-radius: 7px; color: #5e4100; background: #fff7d9; font-size: 8px; font-weight: 900; cursor: pointer; }
.urgent-choice { margin: 18px 0 0; padding: 17px; display: grid !important; grid-template-columns: 38px 1fr; align-items: center; gap: 11px; border: 1px solid #e2be55; border-radius: 14px; background: linear-gradient(135deg,#fff7d9,#fff); cursor: pointer; }
.urgent-choice > input { position: absolute; opacity: 0; pointer-events: none; }
.urgent-choice > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: #07090D; background: var(--lolo-gold); font-size: 19px; }
.urgent-choice div { display: flex; flex-direction: column; }
.urgent-choice b { color: #5e4100; font-size: 13px; }
.urgent-choice small { color: #675b3d; font-size: 9px; line-height: 1.5; }
.urgent-choice:has(input:checked) { border-color: var(--lolo-gold); box-shadow: 0 0 0 3px rgba(255,195,43,.14); }
.urgent-choice.unavailable { opacity: .65; cursor: default; }
.top-choice { border-color: #f0d177; background: linear-gradient(135deg,#fff9e7,#fff); }
.top-choice > span { color: #362500; background: #ffd35b; }
.top-choice b { color: #7b5500; }
.top-choice:has(input:checked) { border-color: #dcae25; box-shadow: 0 0 0 3px rgba(220,174,37,.1); }
.top-request { border-color: #f0d177; color: #755000; background: #fff9e7; }
.offer-list article { min-height: 86px; padding: 12px 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #eceeea; }
.offer-list form { display: flex; gap: 5px; }
.offer-list button, .deal-list button { min-height: 34px; padding: 0 9px; border: 0; border-radius: 8px; background: #efebff; color: #5439c0; font-size: 9px; font-weight: 850; }
.empty-mini { padding: 30px 10px; color: var(--muted); font-size: 12px; text-align: center; }
.simple-page { padding: 30px 0 80px; }
.message-shell { min-height: calc(100vh - 130px); padding: 25px 0 45px; display: grid; grid-template-columns: 330px 1fr; gap: 13px; }
.safety-banner { grid-column: 1 / 3; padding: 11px 14px; display: grid; grid-template-columns: 30px 1fr; align-items: center; gap: 9px; border: 1px solid #f0dfac; border-radius: 14px; background: #fff9e8; }
.saved-search-list { display: flex; flex-direction: column; gap: 9px; }
.saved-search-list article { min-height: 72px; padding: 10px 12px; display: grid; grid-template-columns: 1fr 36px; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 15px; background: #fff; }
.saved-search-list article > a { min-width: 0; display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 10px; }
.saved-search-list article > a > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; color: var(--violet); background: #eee9ff; font-size: 18px; }
.saved-search-list article > a div { min-width: 0; display: flex; flex-direction: column; }
.saved-search-list small { overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.saved-search-list button { width: 34px; height: 34px; border: 0; border-radius: 10px; color: var(--danger); background: #fff0f2; font-size: 18px; }
.expense-page { padding: 28px 0 80px; }
.expense-hero { min-height: 190px; padding: 34px; display: flex; align-items: center; justify-content: space-between; gap: 24px; overflow: hidden; border: 1px solid var(--line); border-radius: 26px; background: radial-gradient(circle at 90% 15%, rgba(118,87,232,.2), transparent 30%), linear-gradient(135deg, #fff1ea, #fff 55%, #eeebff); }
.expense-hero h1 { margin: 5px 0 7px; font-size: clamp(36px, 5vw, 56px); line-height: 1; letter-spacing: -2.4px; }
.expense-hero p { max-width: 640px; margin: 0; color: var(--muted); }
.expense-hero-icon { width: 112px; height: 112px; flex: 0 0 112px; display: grid; place-items: center; transform: rotate(8deg); border-radius: 34px 34px 34px 12px; color: var(--mint); background: var(--ink); box-shadow: 0 22px 40px rgba(23,24,23,.16); font-size: 46px; font-weight: 900; }
.expense-metrics { margin: 14px 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.expense-metrics article { min-height: 92px; padding: 17px; display: flex; flex-direction: column; justify-content: center; border: 1px solid var(--line); border-radius: 17px; background: var(--surface); }
.expense-metrics small { color: var(--muted); font-size: 10px; font-weight: 850; text-transform: uppercase; letter-spacing: .4px; }
.expense-metrics b { margin-top: 3px; font-size: 25px; letter-spacing: -.8px; }
.expense-layout { display: grid; grid-template-columns: minmax(310px,.72fr) minmax(0,1.28fr); align-items: start; gap: 14px; }
.expense-form { position: sticky; top: 94px; padding: 23px; border: 1px solid var(--line); border-radius: 21px; background: var(--surface); box-shadow: var(--shadow); }
.expense-form .panel-heading > div { display: flex; align-items: center; gap: 9px; }
.expense-form .panel-heading span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: #fff; background: var(--violet); font-size: 18px; }
.expense-form .panel-heading h2 { margin: 0; font-size: 20px; }
.expense-form .form-grid { grid-template-columns: 1fr 1fr; }
.expense-hint { margin-top: -6px; color: var(--muted); font-size: 9px; line-height: 1.45; }
[data-custom-expense][hidden] { display: none !important; }
.expense-records { min-width: 0; }
.expense-breakdown { margin-bottom: 10px; display: flex; gap: 7px; overflow-x: auto; scrollbar-width: none; }
.expense-breakdown span { min-width: max-content; min-height: 42px; padding: 6px 10px 6px 7px; display: flex; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); color: var(--muted); font-size: 9px; font-weight: 750; }
.expense-breakdown i { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; color: var(--violet); background: #eee9ff; font-style: normal; font-size: 13px; }
.expense-breakdown b { margin-left: 4px; color: var(--ink); font-size: 10px; }
.expense-list { display: flex; flex-direction: column; gap: 8px; }
.expense-list > article { min-height: 88px; padding: 13px; display: grid; grid-template-columns: 46px minmax(0,1fr) auto 36px; align-items: center; gap: 11px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.expense-list > article > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: var(--violet); background: #eee9ff; font-size: 19px; font-weight: 900; }
.expense-list article > div { min-width: 0; }
.expense-list small { color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.expense-list h3 { margin: 3px 0 0; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.expense-list > article p { margin: 3px 0 0; overflow: hidden; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.expense-list > article > b { font-size: 16px; white-space: nowrap; }
.expense-list form button { width: 34px; height: 34px; border: 0; border-radius: 10px; color: var(--danger); background: #fff0f2; font-size: 18px; }
.expense-empty { min-height: 330px; }
.conversation-list, .chat-panel { overflow: hidden; border: 1px solid var(--line); border-radius: 21px; background: #fff; }
.conversation-list .panel-heading { padding: 20px; }
.conversation-list > a { min-height: 83px; padding: 10px 12px; display: grid; grid-template-columns: 54px 1fr 22px; align-items: center; gap: 10px; border-top: 1px solid #eceeea; }
.conversation-list > a.active { background: #f1eeff; }
.conversation-list img { width: 54px; height: 54px; object-fit: cover; border-radius: 12px; }
.conversation-list > a div { min-width: 0; display: flex; flex-direction: column; }
.conversation-list b, .conversation-list span, .conversation-list small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conversation-list b { font-size: 12px; }
.conversation-list span { font-size: 10px; }
.conversation-list small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.conversation-list i { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--pink); font-size: 9px; font-style: normal; }
.chat-panel { display: grid; grid-template-rows: 72px 1fr auto; }
.chat-panel > header { padding: 0 20px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid #eceeea; }
.chat-panel > header small { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.chat-panel > header h2 { margin: 1px 0; font-size: 17px; }
.chat-panel > header a { max-width: 240px; overflow: hidden; color: var(--violet); font-size: 10px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.message-stream { max-height: 560px; padding: 20px; overflow-y: auto; display: flex; flex-direction: column; gap: 9px; background: #f8f9f6; }
.message-stream article { max-width: 72%; padding: 10px 12px; align-self: flex-start; border-radius: 14px 14px 14px 5px; background: #fff; box-shadow: 0 5px 15px rgba(20, 23, 20, 0.05); }
.message-stream article.mine { align-self: flex-end; border-radius: 14px 14px 5px 14px; color: #fff; background: var(--violet); }
.message-stream b { font-size: 9px; }
.message-stream p { margin: 3px 0; font-size: 12px; }
.message-stream small { opacity: 0.68; font-size: 8px; }
.chat-form { padding: 12px; display: grid; grid-template-columns: 1fr 110px; gap: 8px; border-top: 1px solid #eceeea; }
.chat-form textarea { min-height: 56px; }
.deal-list { display: flex; flex-direction: column; gap: 9px; }
.deal-list article { min-height: 100px; padding: 12px; display: grid; grid-template-columns: 84px 1fr 150px auto; align-items: center; gap: 14px; border: 1px solid var(--line); border-radius: 17px; background: #fff; }
.deal-list img { width: 84px; height: 76px; object-fit: cover; border-radius: 12px; }
.deal-list small { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.deal-list h3 { margin: 4px 0; font-size: 15px; }
.deal-list p { margin: 0; color: var(--muted); font-size: 10px; }
.deal-list article > div:nth-child(3) { display: flex; flex-direction: column; align-items: flex-end; }
.deal-list article > div:nth-child(3) b { font-size: 18px; }
.deal-list article > div:nth-child(3) a { margin-top: 5px; color: var(--violet); font-size: 10px; font-weight: 800; }
.ads-hero { min-height: 270px; margin-top: 24px; padding: 38px; display: flex; align-items: center; justify-content: space-between; gap: 30px; border-radius: 28px; color: #fff; background: radial-gradient(circle at 80% 0, rgba(255, 79, 134, 0.42), transparent 37%), #171817; }
.ads-hero h1 { margin: 7px 0; font-size: 48px; letter-spacing: -2px; }
.ads-hero p { max-width: 590px; margin: 0; color: #b9c0ba; }
.ad-visual { width: 260px; min-height: 170px; padding: 25px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; transform: rotate(3deg); border-radius: 25px; color: var(--ink); background: linear-gradient(135deg, var(--mint), #efe9ff); }
.ad-visual span { padding: 4px 7px; border-radius: 6px; color: #fff; background: var(--pink); font-size: 9px; font-weight: 900; }
.ad-visual b { margin: 8px 0 4px; font-size: 25px; }
.ad-visual small { font-size: 10px; }
.login-callout.large { margin: 18px 0 70px; padding: 20px 24px; justify-content: space-between; }
.login-callout.large h2 { margin: 0; }
.login-callout.large p { margin: 3px 0; color: #bfc4c0; font-size: 11px; }
.ads-grid { margin: 18px 0 70px; display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 14px; }
.campaign-form .form-grid { grid-template-columns: 1fr 1fr; }
.campaign-form select[multiple] { min-height: 130px; padding: 8px; }
.campaign-list article { min-height: 90px; padding: 12px 0; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-top: 1px solid #eceeea; }
.campaign-list article > div:last-child { display: flex; flex-direction: column; align-items: flex-end; }
.legal-page { max-width: 800px; margin: 65px auto 90px; padding: 44px; border: 1px solid var(--line); border-radius: 25px; background: #fff; box-shadow: var(--shadow); }
.legal-page h1 { margin: 7px 0 16px; font-size: 46px; letter-spacing: -2px; }
.legal-page h2 { margin: 28px 0 7px; font-size: 21px; }
.legal-page p { color: #59625b; line-height: 1.8; }
.legal-hero { min-height: 310px; margin: 32px 0 18px; padding: 44px; display: flex; align-items: end; justify-content: space-between; gap: 25px; border-radius: 28px; color: #fff; background: radial-gradient(circle at 90% 15%, rgba(184,241,213,.25), transparent 30%), linear-gradient(135deg, #111c17, #24372e); }
.legal-hero h1 { max-width: 720px; margin: 7px 0 12px; font-size: clamp(38px, 6vw, 68px); line-height: .96; letter-spacing: -3px; }
.legal-hero p { max-width: 650px; color: #c7d0ca; line-height: 1.7; }
.legal-hero small { color: #92a098; font-size: 10px; }
.policy-grid { margin: 0 0 80px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.policy-grid > a { min-height: 155px; padding: 20px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--line); border-radius: 19px; background: #fff; transition: transform .2s, box-shadow .2s; }
.policy-grid > a:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.policy-grid > a > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: var(--ink); background: var(--mint); font-weight: 900; }
.policy-grid h2 { margin: 24px 0 5px; font-size: 17px; }
.policy-grid p { margin: 0; color: var(--pink); font-size: 10px; font-weight: 800; }
.legal-document > nav { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 30px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.legal-document > nav a { color: var(--pink); font-size: 10px; font-weight: 850; }
.legal-document > nav small { color: var(--muted); font-size: 9px; }
.legal-document section { scroll-margin-top: 100px; }
.legal-document section a { color: var(--pink); font-weight: 800; }
.legal-actions { margin-top: 36px; padding-top: 24px; display: flex; align-items: center; gap: 20px; border-top: 1px solid var(--line); }
.legal-request-shell { max-width: 980px; margin: 55px auto 85px; display: grid; grid-template-columns: .8fr 1.2fr; gap: 18px; }
.legal-request-shell > div, .legal-request-shell > form { padding: 35px; border: 1px solid var(--line); border-radius: 23px; background: #fff; box-shadow: var(--shadow); }
.legal-request-shell > div { color: #fff; background: var(--ink); }
.legal-request-shell > div h1 { margin: 8px 0 14px; font-size: 42px; letter-spacing: -2px; }
.legal-request-shell > div p { color: #b7c0ba; line-height: 1.7; }
.legal-request-shell > div a { color: var(--mint); font-size: 10px; font-weight: 800; }
.legal-request-shell > form { display: grid; gap: 13px; }
.legal-check { display: flex !important; flex-direction: row !important; align-items: flex-start; gap: 10px; color: #59625b; font-size: 10px; font-weight: 650; line-height: 1.5; }
.legal-check input { width: 18px !important; min-width: 18px; height: 18px !important; margin: 0; accent-color: var(--pink); }
.legal-check a { color: var(--pink); text-decoration: underline; }
.seller-legal { margin: 18px 0 0; padding: 16px; border: 1px solid #ffd0d7; border-radius: 13px; background: #fff7f8; }
.call-now { border-color: #9bd8bc !important; background: #effbf5 !important; }
.site-footer { min-height: 180px; padding: 42px max(22px, calc((100vw - 1240px) / 2)); display: grid; grid-template-columns: 1fr auto; align-items: start; gap: 20px; color: #fff; background: var(--ink); }
.site-footer p { color: #9da59f; font-size: 11px; }
.site-footer nav { max-width: 720px; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 14px 18px; color: #cdd1ce; font-size: 11px; font-weight: 750; }
.site-footer nav button { padding: 0; border: 0; color: var(--mint); background: transparent; font: inherit; cursor: pointer; }
.site-footer > small { grid-column: 1 / 3; padding-top: 15px; border-top: 1px solid #323532; color: #858c86; }
.cookie-panel { position: fixed; z-index: 100; inset: 0; padding: 20px; display: grid; place-items: end center; background: rgba(8,12,10,.52); backdrop-filter: blur(5px); }
.cookie-panel[hidden] { display: none; }
.cookie-card { position: relative; width: min(850px, 100%); padding: 25px; border: 1px solid #333b36; border-radius: 22px; color: #fff; background: #151a17; box-shadow: 0 25px 80px rgba(0,0,0,.4); }
.cookie-card h2 { margin: 5px 0 8px; font-size: 26px; }
.cookie-card > p { max-width: 680px; color: #aeb8b1; font-size: 11px; line-height: 1.6; }
.cookie-card > p a { color: var(--mint); }
.cookie-close { position: absolute; top: 15px; right: 17px; border: 0; color: #fff; background: transparent; font-size: 22px; cursor: pointer; }
.cookie-options { margin: 16px 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.cookie-options label { min-height: 62px; padding: 11px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 1px solid #333b36; border-radius: 12px; }
.cookie-options label span { display: flex; flex-direction: column; }
.cookie-options label b { font-size: 10px; }
.cookie-options label small { color: var(--mint); font-size: 8px; }
.cookie-options input { width: 17px; height: 17px; accent-color: var(--pink); }
.cookie-actions { display: flex; justify-content: flex-end; gap: 8px; }
.cookie-actions button { min-height: 38px; padding: 0 14px; border: 1px solid #465149; border-radius: 9px; color: #fff; background: #232a26; font-size: 9px; font-weight: 850; cursor: pointer; }
.mobile-nav { display: none; }

/* English administration */
.admin-body { color: #eef0ee; background: #111312; }
.admin-topbar { position: sticky; z-index: 35; top: 0; min-height: 76px; padding: 0 28px; display: grid; grid-template-columns: 250px 1fr 230px; align-items: center; gap: 20px; border-bottom: 1px solid #292c2a; background: rgba(17, 19, 18, 0.94); backdrop-filter: blur(17px); }
.admin-topbar nav { display: flex; align-items: center; justify-content: center; gap: 5px; }
.admin-topbar nav a { min-height: 38px; padding: 0 12px; display: flex; align-items: center; border-radius: 9px; color: #929b94; font-size: 11px; font-weight: 800; }
.admin-topbar nav a:hover, .admin-topbar nav a.active { color: #fff; background: #292d2a; }
.admin-person { display: grid; grid-template-columns: 36px 1fr; align-items: center; gap: 8px; }
.admin-person > span, .avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #17251e; background: var(--mint); font-size: 10px; font-weight: 900; }
.admin-person div { display: flex; flex-direction: column; }
.admin-person b { font-size: 10px; }
.admin-person small { color: #7f8881; font-size: 8px; }
.admin-main { width: min(1380px, calc(100% - 48px)); min-height: calc(100vh - 120px); margin: 0 auto; }
.admin-heading { min-height: 150px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.admin-heading > div > span { color: var(--mint); font-size: 9px; font-weight: 900; letter-spacing: 1.2px; }
.admin-heading h1 { margin: 4px 0; color: #fff; font-size: 35px; letter-spacing: -1.4px; }
.admin-heading p { margin: 0; color: #7f8881; font-size: 11px; }
.status-pill { padding: 9px 12px; display: flex; align-items: center; gap: 7px; border: 1px solid #2f3732; border-radius: 20px; color: #b9c1bb; font-size: 9px; font-weight: 800; }
.status-pill i { width: 8px; height: 8px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 0 4px rgba(184, 241, 213, 0.08); }
.admin-metrics { display: grid; grid-template-columns: repeat(6, 1fr); gap: 9px; }
.admin-metrics article { min-height: 92px; padding: 14px; display: grid; grid-template-columns: 35px 1fr; align-items: center; gap: 9px; border: 1px solid #2a2e2b; border-radius: 14px; background: #191c1a; }
.admin-metrics article > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: var(--mint); background: #252c28; font-size: 8px; font-weight: 950; }
.admin-metrics article div { display: flex; flex-direction: column; }
.admin-metrics small { color: #7f8881; font-size: 8px; text-transform: uppercase; }
.admin-metrics b { margin-top: 3px; color: #fff; font-size: 21px; }
.admin-grid { margin: 14px 0 70px; display: grid; grid-template-columns: 1fr 300px; gap: 12px; }
.admin-panel { border: 1px solid #2a2e2b; border-radius: 16px; background: #191c1a; }
.admin-panel-heading { min-height: 66px; padding: 14px 17px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid #292d2a; }
.admin-panel-heading span { color: var(--pink); font-size: 8px; font-weight: 900; letter-spacing: 1px; }
.admin-panel-heading h2 { margin: 3px 0 0; color: #fff; font-size: 16px; }
.admin-panel-heading > a { color: var(--mint); font-size: 9px; font-weight: 800; }
.legal-admin-list article { padding: 17px; display: grid; grid-template-columns: 1fr 90px 300px; align-items: start; gap: 14px; border-top: 1px solid #292d2a; }
.legal-admin-list article:first-child { border-top: 0; }
.legal-admin-list h3 { margin: 5px 0; color: #fff; font-size: 15px; }
.legal-admin-list p { margin: 0 0 7px; color: #aeb6b0; font-size: 10px; line-height: 1.6; }
.legal-admin-list small { color: #748078; font-size: 8px; }
.legal-admin-list form textarea { width: 100%; min-height: 65px; padding: 9px; border: 1px solid #363d38; border-radius: 8px; color: #fff; background: #111412; resize: vertical; }
.legal-admin-list form div { margin-top: 6px; display: flex; gap: 5px; }
.legal-admin-list form button { min-height: 28px; padding: 0 8px; border: 1px solid #3c453f; border-radius: 6px; color: #d7ddd8; background: #252a27; font-size: 7px; font-weight: 850; cursor: pointer; }
.email-metrics { grid-template-columns: repeat(3, minmax(150px, 220px)); }
.email-admin-grid { grid-template-columns: 1fr 330px; }
.email-log-list article { min-height: 68px; padding: 12px 15px; display: grid; grid-template-columns: 1fr 75px; align-items: center; gap: 8px; border-top: 1px solid #292d2a; }
.email-log-list article:first-child { border-top: 0; }
.email-log-list h3 { margin: 3px 0; color: #e7ebe8; font-size: 11px; }
.email-log-list p { margin: 0; color: #8f9992; font-size: 9px; }
.email-log-list small { color: #69726c; font-size: 8px; }
.email-test { padding: 20px; display: block; }
.email-test p { color: #8e9991; font-size: 10px; line-height: 1.6; }
.email-test form { margin-top: 18px; display: grid; gap: 12px; }
.email-test label { display: grid; gap: 6px; color: #bec5c0; font-size: 9px; font-weight: 800; }
.email-test input { min-height: 42px; padding: 0 11px; border: 1px solid #363d38; border-radius: 8px; color: #fff; background: #111412; }
.role-form select { width: 100%; min-height: 30px; padding: 0 6px; border: 1px solid #3a423d; border-radius: 7px; color: #dfe5e0; background: #232825; font-size: 8px; }
.urgent-admin-list article { min-height: 82px; padding: 13px 16px; display: grid; grid-template-columns: 1fr 120px 85px 320px; align-items: center; gap: 12px; border-top: 1px solid #292d2a; }
.urgent-admin-list article:first-child { border-top: 0; }
.urgent-admin-list h3 { margin: 4px 0; color: #fff; font-size: 13px; }
.urgent-admin-list p, .urgent-admin-list small { margin: 0; color: #7d8880; font-size: 8px; }
.urgent-admin-list > article > b { color: #ff758b; font-size: 11px; }
.urgent-admin-list form { display: grid; grid-template-columns: 1fr auto auto; gap: 5px; }
.urgent-admin-list input { min-height: 31px; padding: 0 8px; border: 1px solid #3a423d; border-radius: 7px; color: #fff; background: #111412; font-size: 8px; }
.urgent-admin-list button { padding: 0 8px; border: 1px solid #3a423d; border-radius: 7px; color: #fff; background: #262c28; font-size: 7px; font-weight: 850; }
.admin-table > div { min-height: 61px; padding: 10px 14px; display: grid; grid-template-columns: 35px 1fr 80px 100px 22px; align-items: center; gap: 9px; border-top: 1px solid #252825; }
.admin-table > div:first-child { border-top: 0; }
.admin-table > div > div { min-width: 0; display: flex; flex-direction: column; }
.admin-table b { overflow: hidden; color: #e6e9e6; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.admin-table small, .admin-table time { overflow: hidden; color: #737c75; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.admin-table > div > a { color: var(--mint); }
.status { width: max-content; padding: 4px 7px; border-radius: 20px; color: #b8c1ba; background: #2a2e2b; font-size: 8px; font-style: normal; font-weight: 900; text-transform: uppercase; }
.status.active, .status.resolved { color: #7ed7ae; background: #183126; }
.status.pending, .status.open { color: #f4c77b; background: #382d1b; }
.status.rejected, .status.suspended { color: #ee91a0; background: #3a1d23; }
.admin-actions { padding: 17px; border: 1px solid #2a2e2b; border-radius: 16px; background: linear-gradient(160deg, #1b1e1c, #1d2622); }
.admin-actions h2 { margin: 0 0 13px; color: #fff; font-size: 16px; }
.admin-actions > a { min-height: 65px; padding: 10px 0; display: grid; grid-template-columns: 32px 1fr 15px; align-items: center; gap: 9px; border-top: 1px solid #303531; }
.admin-actions > a > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; color: #111; background: var(--mint); font-size: 8px; font-weight: 900; }
.admin-actions > a div { display: flex; flex-direction: column; }
.admin-actions b { font-size: 10px; }
.admin-actions small { color: #7e8780; font-size: 8px; }
.admin-filters { display: flex; gap: 6px; }
.admin-filters a { padding: 7px 10px; border: 1px solid #303431; border-radius: 8px; color: #aab1ac; font-size: 9px; font-weight: 800; }
.admin-wide { margin-bottom: 70px; overflow: hidden; }
.admin-listing-table article { min-height: 86px; padding: 10px 13px; display: grid; grid-template-columns: 70px minmax(190px, 1fr) 105px 75px 245px 50px; align-items: center; gap: 11px; border-top: 1px solid #282c29; }
.admin-listing-table img { width: 70px; height: 64px; object-fit: cover; border-radius: 10px; }
.admin-listing-table small { color: #788079; font-size: 8px; text-transform: uppercase; }
.admin-listing-table h3 { margin: 3px 0; color: #fff; font-size: 12px; }
.admin-listing-table p { margin: 0; color: #939b95; font-size: 9px; }
.admin-listing-table article > b { color: #fff; font-size: 12px; }
.admin-listing-table form { display: flex; flex-wrap: wrap; gap: 5px; }
.admin-listing-table form select { width: 100%; min-height: 30px; padding: 0 7px; border: 1px solid #343835; border-radius: 7px; color: #d9ddda; background: #222522; font-size: 8px; }
.rejection-note { margin: 2px 0 5px; color: var(--danger); font-size: 9px; text-transform: capitalize; }
.admin-listing-table button, .admin-user-table button, .report-list button, .campaign-admin-list button { min-height: 30px; padding: 0 8px; border: 1px solid #333934; border-radius: 7px; color: #cad0cb; background: #242824; font-size: 8px; font-weight: 800; }
.admin-listing-table article > a, .report-list article > a { color: var(--mint); font-size: 8px; font-weight: 800; }
.admin-user-table header, .admin-user-table article { min-height: 58px; padding: 10px 15px; display: grid; grid-template-columns: minmax(240px, 1fr) 100px 80px 80px 90px 80px; align-items: center; gap: 10px; border-top: 1px solid #282c29; }
.admin-user-table header { min-height: 42px; border-top: 0; color: #6f7771; font-size: 8px; font-weight: 900; text-transform: uppercase; }
.admin-user-table article > div:first-child { display: grid; grid-template-columns: 35px 1fr; align-items: center; gap: 9px; }
.admin-user-table article > div:first-child > div { display: flex; flex-direction: column; }
.admin-user-table b { color: #fff; font-size: 10px; }
.admin-user-table small { color: #7d857f; font-size: 8px; }
.admin-user-table article > span { color: #aeb5af; font-size: 9px; }
.report-list article { min-height: 112px; padding: 14px; display: grid; grid-template-columns: 1fr 80px 190px 50px; align-items: center; gap: 14px; border-top: 1px solid #292d2a; }
.report-list article > div:first-child { display: grid; grid-template-columns: 38px 1fr; gap: 11px; }
.report-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 11px; color: #fff; background: var(--danger); font-weight: 950; }
.report-list h3 { margin: 3px 0; color: #fff; font-size: 13px; }
.report-list p { margin: 2px 0; color: #9aa19b; font-size: 9px; }
.report-list small { color: #6f7771; font-size: 8px; }
.report-list form { display: flex; gap: 5px; }
.campaign-admin-list article { min-height: 118px; padding: 15px; display: grid; grid-template-columns: 1fr 180px 210px; align-items: center; gap: 17px; border-top: 1px solid #292d2a; }
.campaign-admin-list h3 { margin: 4px 0; color: #fff; font-size: 14px; }
.campaign-admin-list p { margin: 0; color: #929a94; font-size: 9px; }
.campaign-admin-list a { color: var(--mint); font-size: 8px; }
.campaign-admin-list article > div:nth-child(2) { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }
.campaign-admin-list article > div:nth-child(2) b { color: #fff; font-size: 13px; }
.campaign-admin-list article > div:nth-child(2) small { color: #727a74; font-size: 8px; }
.campaign-admin-list form { display: flex; gap: 5px; }
.admin-footer { min-height: 50px; padding: 16px 24px; border-top: 1px solid #292c2a; color: #616963; font-size: 8px; text-align: center; }

@media (max-width: 1080px) {
  .site-header { grid-template-columns: 190px 1fr auto; }
  .desktop-nav > a { padding: 0 9px; }
  .desktop-nav > a:nth-child(5) { display: none; }
  .listing-grid { grid-template-columns: repeat(3, 1fr); }
  .category-row { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .category-row a { grid-template-columns: 40px 1fr; }
  .category-row a > span { width: 39px; height: 39px; }
  .browse-results .listing-grid { grid-template-columns: repeat(2, 1fr); }
  .admin-topbar { grid-template-columns: 210px 1fr 180px; }
  .admin-topbar nav a { padding: 0 8px; }
  .admin-metrics { grid-template-columns: repeat(3, 1fr); }
  .admin-listing-table article { grid-template-columns: 64px minmax(170px, 1fr) 95px 70px 100px 45px; }
  .admin-listing-table form { flex-direction: column; }
}

@media (max-width: 820px) {
  body { padding-bottom: 66px; }
  .site-header { min-height: 64px; padding: 0 15px; grid-template-columns: 1fr auto; }
  .site-header .brand { grid-template-columns: 36px auto; grid-template-rows: 18px 14px; }
  .brand > .brand-mark { width: 36px; height: 40px; }
  .desktop-nav { display: none; }
  .header-actions .text-button, .header-actions > .primary-button { display: none; }
  .account-menu summary > b { display: none; }
  .site-main { width: min(100% - 26px, 680px); }
  .market-hero { min-height: 380px; margin-top: 13px; padding: 38px 22px 22px; border-radius: 24px; }
  .hero-copy { padding-right: 35px; }
  .hero-copy h1 { font-size: 45px; letter-spacing: -2.7px; }
  .hero-copy p { font-size: 14px; }
  .free-seal { top: 20px; right: 17px; width: 82px; height: 82px; padding: 11px; }
  .free-seal b { font-size: 19px; }
  .free-seal span { font-size: 7px; }
  .hero-search { margin-top: 36px; grid-template-columns: 1fr 55px; }
  .hero-search label:nth-child(2), .hero-search .hero-city { display: none; }
  .hero-search button { font-size: 0; }
  .hero-search button span { font-size: 20px; }
  .hero-search .geo-button { display: none; }
  .category-row { margin-right: -13px; margin-left: -13px; padding: 10px 13px; display: flex; overflow-x: auto; border-right: 0; border-left: 0; border-radius: 0; scrollbar-width: none; }
  .category-row a { min-width: 155px; }
  .trust-strip { grid-template-columns: 1fr; }
  .trust-strip article { min-height: 86px; }
  .listing-grid, .browse-results .listing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .listing-content { padding: 10px; }
  .listing-card h3 { height: 39px; font-size: 13px; }
  .listing-price b { font-size: 15px; }
  .seller-line { display: none; }
  .card-actions { margin-top: 8px; }
  .sell-banner { padding: 22px; align-items: flex-start; flex-direction: column; }
  .browse-layout { display: block; padding-top: 20px; }
  .filter-panel { position: static; margin-bottom: 15px; }
  .filter-panel > div { display: none; }
  .filter-panel form { display: grid; grid-template-columns: 1fr 1fr; }
  .filter-panel form > label:first-child { grid-column: 1 / 3; }
  .price-fields { display: none; }
  .listing-detail { grid-template-columns: 1fr; padding-top: 20px; }
  .main-photo { border-radius: 19px; }
  .detail-title h1 { font-size: 28px; }
  .contact-actions { grid-template-columns: 1fr; }
  .deal-grid { grid-template-columns: 1fr; }
  .auth-shell { margin: 0 -13px; grid-template-columns: 1fr; }
  .auth-promo { display: none; }
  .auth-card { margin: 30px auto; }
  .form-intro h1 { font-size: 36px; }
  .form-section { padding: 20px; grid-template-columns: 1fr; }
  .form-section > span { width: 38px; height: 38px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .wide { grid-column: auto; }
  .photo-preview { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .condition-picker > div { grid-template-columns: repeat(2, 1fr); }
  .condition-picker label:last-child { grid-column: 1 / 3; }
  .ai-writer-action { align-items: flex-start; flex-direction: column; }
  .contact-choice .toggle-list { grid-template-columns: 1fr; }
  .publish-note { grid-template-columns: 35px 1fr; }
  .publish-note button { grid-column: 1 / 3; }
  .dashboard-hero { padding: 24px; flex-direction: column; align-items: flex-start; }
  .dashboard-actions { width: 100%; flex-wrap: wrap; }
  .metric-row { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .message-shell { grid-template-columns: 1fr; }
  .safety-banner { grid-column: 1; }
  .conversation-list { max-height: 300px; overflow-y: auto; }
  .chat-panel { min-height: 560px; }
  .deal-list article { grid-template-columns: 70px 1fr; }
  .deal-list img { width: 70px; height: 64px; }
  .deal-list article > div:nth-child(3), .deal-list article > form { grid-column: 2; align-items: flex-start; }
  .expense-layout { grid-template-columns: 1fr; }
  .expense-form { position: static; }
  .ads-hero { padding: 28px; }
  .ads-hero h1 { font-size: 37px; }
  .ad-visual { display: none; }
  .ads-grid { grid-template-columns: 1fr; }
  .legal-hero { min-height: 280px; padding: 28px; align-items: flex-start; flex-direction: column; }
  .legal-hero h1 { font-size: 42px; }
  .policy-grid { grid-template-columns: repeat(2, 1fr); }
  .legal-request-shell { margin: 25px 0 65px; grid-template-columns: 1fr; }
  .cookie-options { grid-template-columns: repeat(2, 1fr); }
  .cookie-actions { flex-wrap: wrap; }
  .legal-admin-list article { grid-template-columns: 1fr 80px; }
  .legal-admin-list form { grid-column: 1 / 3; }
  .urgent-admin-list article { grid-template-columns: 1fr 90px; }
  .urgent-admin-list article > i, .urgent-admin-list article > form, .urgent-admin-list article > small { grid-column: 1 / 3; }
  .site-footer { margin-bottom: -66px; padding: 34px 22px 90px; grid-template-columns: 1fr; }
  .site-footer nav { flex-wrap: wrap; }
  .site-footer > small { grid-column: 1; }
  .mobile-nav { position: fixed; z-index: 45; right: 0; bottom: 0; left: 0; min-height: 66px; padding: 5px 8px max(5px, env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid var(--line); background: rgba(255,255,255,.96); backdrop-filter: blur(18px); }
  .mobile-nav a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; color: #747b75; font-size: 8px; font-weight: 750; }
  .mobile-nav a span { font-size: 19px; }
  .mobile-nav .mobile-sell span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 13px; color: #fff; background: linear-gradient(135deg, var(--coral), var(--pink)); }
  .admin-topbar { min-height: 66px; padding: 0 14px; grid-template-columns: 1fr auto; }
  .admin-topbar nav { display: none; }
  .admin-person { grid-template-columns: 34px; }
  .admin-person div { display: none; }
  .admin-main { width: calc(100% - 24px); }
  .admin-heading { min-height: 125px; }
  .admin-heading h1 { font-size: 28px; }
  .admin-heading .status-pill, .admin-filters { display: none; }
  .admin-metrics { grid-template-columns: repeat(2, 1fr); }
  .admin-grid { grid-template-columns: 1fr; }
  .admin-listing-table article { grid-template-columns: 60px 1fr 75px; }
  .admin-listing-table article > b, .admin-listing-table article > i, .admin-listing-table article > a { display: none; }
  .admin-listing-table form { grid-column: 2 / 4; flex-direction: row; }
  .admin-user-table { overflow-x: auto; }
  .admin-user-table header, .admin-user-table article { min-width: 760px; }
  .report-list article { grid-template-columns: 1fr 80px; }
  .report-list article > form { grid-column: 1 / 3; }
  .campaign-admin-list article { grid-template-columns: 1fr; }
  .campaign-admin-list article > div:nth-child(2) { align-items: flex-start; }
}

@media (max-width: 480px) {
  .hero-copy h1 { font-size: 38px; }
  .listing-grid, .browse-results .listing-grid { grid-template-columns: 1fr 1fr; }
  .listing-image { aspect-ratio: 1; }
  .listing-location { font-size: 8px; }
  .listing-card h3 { font-size: 12px; }
  .listing-price small { display: none; }
  .card-actions { grid-template-columns: 34px 1fr; }
  .card-actions form button { width: 34px; height: 36px; }
  .card-actions > a { min-height: 36px; font-size: 9px; }
  .filter-panel form { grid-template-columns: 1fr; }
  .filter-panel form > label:first-child { grid-column: auto; }
  .filter-panel form > label:nth-child(4), .filter-panel .reset-link { display: none; }
  .expense-hero { min-height: 165px; padding: 24px; }
  .expense-hero-icon { width: 72px; height: 72px; flex-basis: 72px; border-radius: 22px 22px 22px 8px; font-size: 30px; }
  .expense-metrics { grid-template-columns: 1fr; }
  .expense-metrics article { min-height: 76px; }
  .expense-form .form-grid { grid-template-columns: 1fr; }
  .expense-list > article { grid-template-columns: 42px minmax(0,1fr) 34px; }
  .expense-list > article > b { grid-column: 2; grid-row: 2; }
  .expense-list > article > form { grid-column: 3; grid-row: 1 / 3; }
  .detail-specs { grid-template-columns: 1fr; }
  .thumb-row { grid-template-columns: repeat(5, 1fr); }
  .gallery-arrow { width: 40px; height: 40px; font-size: 18px; }
  .gallery-expand { top: 10px; right: 10px; width: 40px; height: 40px; }
  .gallery-previous { left: 10px; }
  .gallery-next { right: 10px; }
  .gallery-count { right: 10px; bottom: 10px; }
  .gallery-lightbox { padding: 0; }
  .gallery-lightbox-dialog { width: 100%; height: 100vh; height: 100dvh; border: 0; border-radius: 0; }
  .lightbox-toolbar { min-height: 60px; padding: max(8px, env(safe-area-inset-top)) 8px 8px 14px; }
  .lightbox-toolbar > div { gap: 5px; }
  .lightbox-toolbar button { min-width: 38px; height: 38px; padding: 0 9px; border-radius: 11px; }
  .lightbox-toolbar [data-gallery-zoom-reset] { min-width: 56px; }
  .lightbox-toolbar .lightbox-close { margin-left: 1px; }
  .lightbox-arrow { width: 42px; height: 42px; font-size: 18px; }
  .lightbox-previous { left: 10px; }
  .lightbox-next { right: 10px; }
  .auth-card { padding: 24px; }
  .management-list article { grid-template-columns: 60px 1fr; }
  .management-list img { width: 60px; height: 56px; }
  .management-list article > div:last-child { grid-column: 2; align-items: flex-start; flex-direction: row; }
  .chat-form { grid-template-columns: 1fr; }
  .chat-form button { min-height: 42px; }
  .legal-page { margin: 25px 0 60px; padding: 25px; }
  .legal-page h1 { font-size: 35px; }
  .policy-grid { grid-template-columns: 1fr; }
  .legal-request-shell > div, .legal-request-shell > form { padding: 24px; }
  .cookie-card { padding: 22px 16px 16px; }
  .cookie-options { grid-template-columns: 1fr 1fr; }
  .cookie-actions button { flex: 1; }
}

html[data-theme-effective="dark"] {
  color-scheme: dark;
  --ink: var(--lolo-text);
  --muted: var(--lolo-text-secondary);
  --line: var(--lolo-border);
  --surface: var(--lolo-elevated);
  --canvas: var(--lolo-background);
  --peach: var(--lolo-raised);
  --mint: var(--lolo-success);
  --violet: var(--lolo-ai);
  --pink: var(--lolo-gold-hover);
  --coral: var(--lolo-gold);
  --danger: var(--lolo-danger);
  --success: var(--lolo-success);
  --shadow: 0 20px 55px rgba(0,0,0,.35);
}
html[data-theme-effective="dark"] .site-header { border-color: var(--line); background: rgba(7,9,13,.9); }
html[data-theme-effective="dark"] .mobile-nav { background: rgba(14,17,24,.96); }
html[data-theme-effective="dark"] .market-hero { background: radial-gradient(circle at 85% 10%, rgba(167,139,250,.2), transparent 32%), radial-gradient(circle at 8% 90%, rgba(255,195,43,.1), transparent 34%), linear-gradient(135deg, #0E1118, #151923 58%, #202735); }
html[data-theme-effective="dark"] .hero-copy p { color: var(--muted); }
html[data-theme-effective="dark"] :is(
  .desktop-nav > a:hover, .desktop-nav > a.active, .outline-button, .account-menu > div,
  .flash, .hero-search, .category-row, .trust-strip article, .listing-card,
  .card-actions form button, .filter-panel, input, select, textarea, .results-actions button,
  .empty-state, .detail-title form button, .seller-panel, .deal-grid form, .auth-shell,
  .auth-card, .form-section, .contact-choice .toggle-list label, .settings-form,
  .campaign-form, .expense-form, .expense-metrics article, .expense-list > article, .metric-row article, .panel, .saved-search-list article,
  .conversation-list, .chat-panel, .message-stream article, .deal-list article,
  .legal-page, .policy-grid > a, .legal-request-shell > div, .legal-request-shell > form
) { color: var(--ink); background: var(--surface); }
html[data-theme-effective="dark"] :is(.hero-search label, .condition-picker label) { background: #222624; }
html[data-theme-effective="dark"] :is(.account-menu > div a:hover, .account-menu > div button:hover, .location-tools, .location-picker > [data-location-choose]) { background: #29263a; }
html[data-theme-effective="dark"] :is(.listing-price, .chat-panel header, .chat-form) { border-color: var(--line); }
html[data-theme-effective="dark"] .listing-safety,
html[data-theme-effective="dark"] .safety-banner { border-color: #6b5828; background: #292413; }
html[data-theme-effective="dark"] .sell-banner { background: linear-gradient(135deg, #3a2521, #292442); }
html[data-theme-effective="dark"] .seller-legal { border-color: #68343d; background: #2f1e21; }
html[data-theme-effective="dark"] .country-flag { border-color: #555; background: #fff; }
html[data-theme-effective="dark"] .free-seal { color: #fff; border: 1px solid #3c423e; background: #0b0d0c; }
html[data-theme-effective="dark"] .hero-search > button { color: #07090D; background: linear-gradient(135deg, var(--lolo-gold), var(--lolo-gold-hover)); }
html[data-theme-effective="dark"] :is(.dark-button, .card-actions > a, .login-callout) { color: #111311; background: #f4f5f3; }
html[data-theme-effective="dark"] :is(.account-menu summary > span, .seller-line > span, .seller-profile > span, .form-section > span, .sell-banner > div > span) { color: #07090D; background: linear-gradient(135deg, var(--lolo-gold), var(--lolo-gold-hover)); }
html[data-theme-effective="dark"] .site-footer { color: #f4f5f3; background: #080a09; }
html[data-theme-effective="dark"] .detail-description { color: #c6ccc7; }
html[data-theme-effective="dark"] .detail-specs > div { border: 1px solid var(--line); background: #1b1f1c; }
html[data-theme-effective="dark"] .detail-specs dt { color: #8f9991; }
html[data-theme-effective="dark"] .detail-specs dd { color: #f4f5f3; }
html[data-theme-effective="dark"] .call-now { color: #b8f1d5 !important; border-color: #3f765f !important; background: #15261e !important; }
html[data-theme-effective="dark"] :is(.listing-safety p, .safety-banner p) { color: #eadb9a; }
html[data-theme-effective="dark"] :is(.filter-panel label, .campaign-form label, .settings-form label, .expense-form label, .auth-card label, .listing-form label, .deal-grid label) { color: #b4bdb6; }
html[data-theme-effective="dark"] .expense-hero { background: radial-gradient(circle at 90% 15%, rgba(168,149,255,.18), transparent 30%), linear-gradient(135deg, #2d201b, #151816 55%, #211d38); }
html[data-theme-effective="dark"] .expense-hero-icon { color: #151816; background: var(--mint); }
html[data-theme-effective="dark"] .expense-breakdown i,
html[data-theme-effective="dark"] .expense-list > article > span { color: #d6ccff; background: #2b2742; }
html[data-theme-effective="dark"] .expense-list form button { color: #ff9aab; background: #341d22; }
html[data-theme-effective="dark"] .toggle-list label { border: 1px solid var(--line); color: var(--ink); background: #1b1f1c; }
html[data-theme-effective="dark"] .upload-zone {
  color: var(--ink);
  border-color: #465049;
  background: #1b1f1c;
}
html[data-theme-effective="dark"] .upload-zone strong { color: #f4f6f4; }
html[data-theme-effective="dark"] .upload-zone small { color: #aeb7b0; }
html[data-theme-effective="dark"] .upload-zone.ready { border-color: var(--violet); background: #242138; }
html[data-theme-effective="dark"] .ai-writer {
  color: var(--ink);
  border-color: #494166;
  background:
    radial-gradient(circle at 95% 0, rgba(255,111,158,.15), transparent 34%),
    linear-gradient(135deg, #211f2d, #191c1a);
}
html[data-theme-effective="dark"] .ai-writer :is(label, .ai-writer-head b) { color: #f4f6f4; }
html[data-theme-effective="dark"] .ai-writer :is(.ai-writer-head small, .ai-writer-action small) { color: #aeb7b0; }
html[data-theme-effective="dark"] .choice-card {
  color: var(--ink);
  border-color: #454052;
  background: #211f2a;
}
html[data-theme-effective="dark"] .choice-card b { color: #f4f6f4; }
html[data-theme-effective="dark"] .choice-card small { color: #aeb7b0; }
html[data-theme-effective="dark"] .choice-card > span { color: #cbbfff; background: #302a4d; }
html[data-theme-effective="dark"] .contact-choice {
  color: var(--ink);
  border-color: var(--line);
  background: #151816;
}
html[data-theme-effective="dark"] .contact-choice h3 { color: #f4f6f4; }
html[data-theme-effective="dark"] .urgent-choice {
  border-color: #6b5927;
  background: linear-gradient(135deg, #2d2818, #1b1d1b);
}
html[data-theme-effective="dark"] .urgent-choice b { color: #ffe49a; }
html[data-theme-effective="dark"] .urgent-choice small { color: #c8b98e; }
html[data-theme-effective="dark"] .top-choice {
  border-color: #6b5927;
  background: linear-gradient(135deg, #2d2818, #1b1d1b);
}
html[data-theme-effective="dark"] .top-choice b { color: #ffe49a; }
html[data-theme-effective="dark"] .top-choice small { color: #c8b98e; }
html[data-theme-effective="dark"] .publish-note {
  background: linear-gradient(135deg, #173127, #26213a);
}
html[data-theme-effective="dark"] .publish-note p { color: #d7ddd8; }
html[data-theme-effective="dark"] .message-stream { background: #111412; }
html[data-theme-effective="dark"] .message-stream article.mine { color: #fff; background: var(--violet); }
html[data-theme-effective="dark"] .legal-page p { color: #bcc5be; }
html[data-theme-effective="dark"] :is(.detail-breadcrumb, .legal-page nav, .legal-page nav small) { color: #9ba49d; }

/* Social media: mixed listing galleries, stories and vertical videos */
.main-photo > video,
.lightbox-viewport > video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  background: #080a09;
}
.main-photo > video[hidden], .lightbox-viewport > video[hidden] { display: none; }
.main-photo.is-video { background: #080a09; }
.main-photo.is-video .gallery-expand { top: 12px; right: 12px; }
.thumb-row button { position: relative; }
.thumb-row [data-gallery-type="video"]::after,
.thumb-row [data-media-type="video"]::after {
  content: "▶";
  position: absolute;
  inset: 50% auto auto 50%;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 50%;
  color: #fff;
  background: rgba(8,10,9,.72);
  box-shadow: 0 7px 20px rgba(0,0,0,.28);
  font-size: 10px;
  pointer-events: none;
}
.gallery-lightbox.is-video .lightbox-viewport { padding: 0; background: #080a09; }
.gallery-lightbox.is-video .lightbox-viewport > video { max-width: 100%; max-height: 100%; }
.thumb-row [data-media-type="video"]::after { display: none; }
.video-thumb-icon { position: absolute; inset: 50% auto auto 50%; width: 30px; height: 30px; display: grid; place-items: center; transform: translate(-50%, -50%); border: 1px solid rgba(255,255,255,.55); border-radius: 50%; color: #fff; background: rgba(8,10,9,.72); box-shadow: 0 7px 20px rgba(0,0,0,.28); font-size: 10px; pointer-events: none; }

.upload-zone.has-error { border-color: var(--danger); background: color-mix(in srgb, var(--danger) 7%, var(--surface)); }
.media-validation { display: block; margin: 7px 2px 0; color: var(--danger); font-size: 10px; font-weight: 800; }
.media-validation[hidden] { display: none; }
.media-upload-preview {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.media-upload-preview:empty { display: none; }
.media-preview-item { position: relative; min-width: 0; margin: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; color: #fff; background: #111; }
.media-upload-preview .media-preview-item { aspect-ratio: 16 / 10; }
[data-story-preview] { max-width: 250px; grid-template-columns: 1fr; }
[data-story-preview] .media-preview-item { aspect-ratio: 9 / 16; }
.media-preview-item > img, .media-preview-item > video { width: 100%; height: 100%; display: block; object-fit: cover; background: #090b0a; }
.media-preview-item > figcaption {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  left: 0;
  min-width: 0;
  padding: 24px 10px 9px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
  background: linear-gradient(transparent, rgba(0,0,0,.82));
  pointer-events: none;
}
.media-preview-item figcaption b { min-width: 0; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.media-preview-item figcaption small { flex: 0 0 auto; color: #e3e7e4; font-size: 8px; }
.media-preview-item figcaption [data-media-note]:empty { display: none; }
.media-preview-item figcaption [data-media-note]:not(:empty) { position: absolute; right: 8px; bottom: 30px; left: 8px; padding: 5px 7px; border-radius: 7px; color: #fff; background: rgba(23,24,23,.78); line-height: 1.3; }

.stories-section { margin: 28px 0 20px; }
.stories-heading { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.stories-heading h2 { margin: 0; font-size: 20px; letter-spacing: -.5px; }
.stories-heading p { margin: 2px 0 0; color: var(--muted); font-size: 10px; }
.stories-heading > a { color: var(--violet); font-size: 11px; font-weight: 900; }
.story-tray, [data-story-tray] {
  width: 100%;
  padding: 8px 2px 12px;
  display: flex;
  gap: 14px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
}
.story-tray::-webkit-scrollbar, [data-story-tray]::-webkit-scrollbar { display: none; }
[data-story-open] {
  width: 82px;
  min-width: 82px;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  scroll-snap-align: start;
  border: 0;
  color: var(--ink);
  background: transparent;
  text-align: center;
}
[data-story-open] .story-ring {
  position: relative;
  width: 76px;
  height: 76px;
  padding: 3px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: conic-gradient(from 220deg, #ff774f, #ff3f84, #8d4cff, #ffb43d, #ff774f);
  box-shadow: 0 8px 22px rgba(255,79,134,.2);
}
[data-story-open] .story-ring::before { content: ""; position: absolute; inset: 3px; border: 2px solid var(--surface); border-radius: inherit; pointer-events: none; }
[data-story-open] .story-ring > img,
[data-story-open] .story-ring > video,
[data-story-open] .story-ring > span {
  width: 66px;
  height: 66px;
  overflow: hidden;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(135deg, #2b2d2b, #5d466d);
  object-fit: cover;
  font-weight: 950;
}
[data-story-open] .story-ring > span > img { width: 100%; height: 100%; object-fit: cover; }
[data-story-open] .story-ring > i {
  position: absolute;
  right: 1px;
  bottom: 2px;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border: 2px solid var(--surface);
  border-radius: 50%;
  color: #fff;
  background: var(--violet);
  font-size: 8px;
  font-style: normal;
}
[data-story-open] > b { width: 100%; overflow: hidden; font-size: 10px; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
[data-story-open] > small { margin-top: -4px; color: var(--muted); font-size: 8px; }
[data-story-open]:hover .story-ring { transform: translateY(-2px); box-shadow: 0 11px 28px rgba(255,79,134,.28); }
[data-story-open]:focus-visible { outline: 3px solid color-mix(in srgb, var(--violet) 45%, transparent); outline-offset: 4px; border-radius: 16px; }
[data-story-open].story-seen .story-ring, [data-story-open][data-story-seen="true"] .story-ring { background: #aeb4af; box-shadow: none; }
.story-add .story-ring { padding: 0; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); }
.story-add .story-ring > span { color: var(--violet); background: color-mix(in srgb, var(--violet) 10%, var(--surface)); font-size: 26px; }

body.story-open { overflow: hidden; touch-action: none; }
.story-viewer[hidden] { display: none; }
.story-viewer {
  position: fixed;
  z-index: 1300;
  inset: 0;
  padding: 14px;
  display: grid;
  place-items: center;
  color: #fff;
  background: radial-gradient(circle at 50% 20%, #27232e 0, #0b0c0c 58%, #050606 100%);
  overscroll-behavior: contain;
}
.story-viewer-dialog {
  position: relative;
  width: min(470px, calc(100vw - 28px), calc(56.25dvh - 15.75px));
  height: min(840px, calc(100dvh - 28px));
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 26px;
  background: #080909;
  box-shadow: 0 34px 100px rgba(0,0,0,.62);
  isolation: isolate;
}
.story-viewer-dialog::before, .story-viewer-dialog::after { content: ""; position: absolute; z-index: 2; right: 0; left: 0; pointer-events: none; }
.story-viewer-dialog::before { top: 0; height: 150px; background: linear-gradient(rgba(0,0,0,.68), transparent); }
.story-viewer-dialog::after { bottom: 0; height: 230px; background: linear-gradient(transparent, rgba(0,0,0,.82)); }
.story-progress {
  position: absolute;
  z-index: 8;
  top: 11px;
  right: 10px;
  left: 10px;
  display: flex;
  gap: 4px;
}
.story-progress > span { height: 3px; flex: 1; overflow: hidden; border-radius: 4px; background: rgba(255,255,255,.3); }
.story-progress i { width: 100%; height: 100%; display: block; transform: scaleX(0); transform-origin: left; border-radius: inherit; background: #fff; will-change: transform; }
.story-viewer-header {
  position: absolute;
  z-index: 8;
  top: 23px;
  right: 10px;
  left: 10px;
  min-height: 46px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 38px 38px 38px;
  align-items: center;
  gap: 6px;
}
.story-viewer-avatar { width: 36px; height: 36px; overflow: hidden; display: grid; place-items: center; border: 2px solid rgba(255,255,255,.85); border-radius: 50%; color: #fff; background: linear-gradient(135deg, var(--pink), var(--violet)); font-size: 12px; font-weight: 950; }
.story-viewer-avatar img { width: 100%; height: 100%; object-fit: cover; }
.story-viewer-header > div { min-width: 0; display: flex; flex-direction: column; text-shadow: 0 2px 8px rgba(0,0,0,.65); }
.story-viewer-header b { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.story-viewer-header small { color: rgba(255,255,255,.7); font-size: 9px; }
.story-control {
  width: 36px;
  height: 36px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 50%;
  color: #fff;
  background: rgba(8,9,9,.36);
  backdrop-filter: blur(9px);
  font-size: 15px;
  font-weight: 900;
}
.story-control[data-story-close] { font-size: 24px; }
.story-control:hover { background: rgba(8,9,9,.66); }
.story-control:focus-visible, .story-viewer-footer a:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.story-viewer-stage { position: absolute; z-index: 1; inset: 0; overflow: hidden; display: grid; place-items: center; background: #090a09; touch-action: none; }
.story-viewer-stage > img, .story-viewer-stage > video { width: 100%; height: 100%; display: block; object-fit: cover; background: #090a09; }
.story-viewer-stage > img[hidden], .story-viewer-stage > video[hidden] { display: none; }
.story-hit { position: absolute; z-index: 3; top: 78px; bottom: 118px; width: 50%; padding: 0; border: 0; outline: none; background: transparent; }
.story-hit-previous { left: 0; }
.story-hit-next { right: 0; }
.story-hit:focus-visible { box-shadow: inset 0 0 0 2px rgba(255,255,255,.42); }
.story-loading { position: absolute; z-index: 4; inset: 0; display: grid; place-items: center; pointer-events: none; }
.story-loading[hidden] { display: none; }
.story-loading span { width: 34px; height: 34px; border: 3px solid rgba(255,255,255,.28); border-top-color: #fff; border-radius: 50%; animation: story-spin .75s linear infinite; }
@keyframes story-spin { to { transform: rotate(360deg); } }
.story-viewer-footer {
  position: absolute;
  z-index: 8;
  right: 15px;
  bottom: max(17px, env(safe-area-inset-bottom));
  left: 15px;
  display: grid;
  gap: 12px;
  pointer-events: none;
}
.story-viewer-footer p { max-width: 94%; margin: 0; display: -webkit-box; overflow: hidden; color: #fff; font-size: 13px; font-weight: 650; line-height: 1.45; text-shadow: 0 2px 10px rgba(0,0,0,.8); -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.story-viewer-footer p[hidden] { display: none; }
.story-viewer-footer a { min-height: 48px; padding: 0 18px; display: flex; align-items: center; justify-content: center; gap: 10px; border-radius: 15px; color: #171817; background: rgba(255,255,255,.96); box-shadow: 0 12px 30px rgba(0,0,0,.25); font-size: 12px; font-weight: 950; pointer-events: auto; }
.story-viewer-footer a:hover { transform: translateY(-1px); background: #fff; }
.story-viewer-footer a[hidden] { display: none; }
.story-viewer.is-paused .story-progress i { will-change: auto; }

[data-reels-feed], .reels-feed { width: min(520px, 100%); margin: 0 auto; display: grid; gap: 18px; }
[data-reel] {
  position: relative;
  width: 100%;
  max-height: min(820px, calc(100dvh - 120px));
  aspect-ratio: 9 / 16;
  overflow: hidden;
  scroll-snap-align: center;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 25px;
  color: #fff;
  background: #080909;
  box-shadow: 0 18px 55px rgba(23,24,23,.16);
}
[data-reel]::after { content: ""; position: absolute; z-index: 1; right: 0; bottom: 0; left: 0; height: 38%; background: linear-gradient(transparent, rgba(0,0,0,.78)); pointer-events: none; }
[data-reel] video { width: 100%; height: 100%; display: block; object-fit: cover; background: #080909; cursor: pointer; }
[data-reel] .reel-copy { position: absolute; z-index: 3; right: 70px; bottom: 27px; left: 18px; text-shadow: 0 2px 10px rgba(0,0,0,.72); }
[data-reel] .reel-copy h2, [data-reel] .reel-copy h3 { margin: 0 0 5px; color: #fff; font-size: 16px; }
[data-reel] .reel-copy p { margin: 0; display: -webkit-box; overflow: hidden; color: rgba(255,255,255,.84); font-size: 11px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
[data-reel] .reel-actions { position: absolute; z-index: 4; right: 13px; bottom: 24px; display: grid; gap: 10px; }
[data-reel] .reel-actions button, [data-reel] .reel-actions a, [data-reel-play], [data-reel-mute] { width: 44px; height: 44px; padding: 0; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; color: #fff; background: rgba(9,10,9,.55); backdrop-filter: blur(10px); font-size: 16px; font-weight: 900; }
[data-reel] [data-reel-progress] { position: absolute; z-index: 5; right: 0; bottom: 0; left: 0; height: 3px; transform: scaleX(0); transform-origin: left; background: #fff; will-change: transform; }
.listing-image > video { width: 100%; height: 100%; display: block; object-fit: cover; background: #090a09; }
.listing-video-badge { position: absolute; z-index: 2; right: 10px; bottom: 10px; min-width: 28px; height: 28px; padding: 0 8px; display: inline-flex; align-items: center; justify-content: center; gap: 4px; border: 1px solid rgba(255,255,255,.32); border-radius: 20px; color: #fff; background: rgba(8,10,9,.68); backdrop-filter: blur(9px); font-size: 9px; font-weight: 900; }

html[data-theme-effective="dark"] .stories-section { color: var(--ink); }
html[data-theme-effective="dark"] [data-story-open] { color: #f4f5f3; }
html[data-theme-effective="dark"] [data-story-open] .story-ring::before,
html[data-theme-effective="dark"] [data-story-open] .story-ring > i { border-color: var(--surface); }
html[data-theme-effective="dark"] .media-upload-preview { color: #fff; }
html[data-theme-effective="dark"] .upload-zone.has-error { border-color: var(--danger); background: #321b20; }

@media (max-width: 700px) {
  .media-upload-preview { grid-template-columns: 1fr 1fr; }
  .stories-section { margin-right: -14px; margin-left: -14px; }
  .stories-heading { padding: 0 14px; }
  .story-tray, [data-story-tray] { padding-right: 14px; padding-left: 14px; gap: 10px; }
  [data-story-open] { width: 72px; min-width: 72px; }
  [data-story-open] .story-ring { width: 68px; height: 68px; }
  [data-story-open] .story-ring > img,
  [data-story-open] .story-ring > video,
  [data-story-open] .story-ring > span { width: 58px; height: 58px; }
  .story-viewer { padding: 0; }
  .story-viewer-dialog { width: 100vw; height: 100dvh; border: 0; border-radius: 0; }
  .story-progress { top: max(8px, env(safe-area-inset-top)); }
  .story-viewer-header { top: max(20px, calc(env(safe-area-inset-top) + 12px)); }
  [data-reel] { max-height: none; border-radius: 0; box-shadow: none; }
}

@media (prefers-reduced-motion: reduce) {
  [data-story-open] .story-ring, .story-viewer-footer a, [data-reel] { transition: none !important; }
  .story-loading span { animation-duration: 1.5s; }
}

/* Server-rendered social components */
.story-experience { margin: 27px 0 22px; }
.story-heading { min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.story-heading > div { min-width: 0; }
.story-heading > div > span { color: var(--pink); font-size: 9px; font-weight: 950; letter-spacing: 1px; text-transform: uppercase; }
.story-heading h2 { display: inline; margin: 0 0 0 7px; font-size: 20px; letter-spacing: -.55px; }
.story-heading p { margin: 3px 0 0; color: var(--muted); font-size: 10px; }
.story-heading > a { flex: 0 0 auto; color: var(--violet); font-size: 11px; font-weight: 900; }
.story-bubble {
  width: 82px;
  min-width: 82px;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  scroll-snap-align: start;
  border: 0;
  color: var(--ink);
  background: transparent;
  text-align: center;
}
.story-bubble > span {
  position: relative;
  width: 76px;
  height: 76px;
  padding: 4px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: conic-gradient(from 220deg, #ff774f, #ff3f84, #8d4cff, #ffb43d, #ff774f);
  box-shadow: 0 8px 22px rgba(255,79,134,.2);
  transition: transform 160ms ease, box-shadow 160ms ease;
}
.story-bubble > span::before { content: ""; position: absolute; inset: 3px; border: 2px solid var(--surface); border-radius: inherit; pointer-events: none; }
.story-bubble > span > img { width: 66px; height: 66px; border-radius: 50%; object-fit: cover; background: #2a2d2b; }
.story-bubble > span > i {
  position: absolute;
  right: 1px;
  bottom: 2px;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border: 2px solid var(--surface);
  border-radius: 50%;
  color: #fff;
  background: var(--violet);
  font-size: 8px;
  font-style: normal;
}
.story-bubble > b { width: 100%; overflow: hidden; font-size: 10px; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.story-bubble:hover > span { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(255,79,134,.29); }
.story-bubble:focus-visible { outline: 3px solid color-mix(in srgb, var(--violet) 45%, transparent); outline-offset: 3px; border-radius: 15px; }
.story-bubble.seen > span, .story-bubble.story-seen > span, .story-bubble[data-story-seen="true"] > span { background: #aeb4af; box-shadow: none; }
.story-bubble.story-add > span { background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); }
.story-bubble.story-add > span::before { display: none; }
.story-bubble.story-add > span > i { position: static; width: 66px; height: 66px; border: 0; color: var(--violet); background: color-mix(in srgb, var(--violet) 10%, var(--surface)); font-size: 26px; }

.story-viewer-shell {
  position: relative;
  width: min(470px, calc(100vw - 28px), calc(56.25dvh - 15.75px));
  height: min(840px, calc(100dvh - 28px));
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 26px;
  background: #080909;
  box-shadow: 0 34px 100px rgba(0,0,0,.62);
  isolation: isolate;
}
.story-viewer-shell > header {
  position: absolute;
  z-index: 8;
  top: 23px;
  right: 10px;
  left: 10px;
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.story-owner { min-width: 0; display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 8px; text-shadow: 0 2px 9px rgba(0,0,0,.7); }
.story-owner > span { width: 36px; height: 36px; display: grid; place-items: center; border: 2px solid rgba(255,255,255,.86); border-radius: 50%; color: #fff; background: linear-gradient(135deg, var(--pink), var(--violet)); font-size: 12px; font-weight: 950; }
.story-owner > div { min-width: 0; display: flex; flex-direction: column; }
.story-owner b, .story-owner small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.story-owner b { color: #fff; font-size: 12px; }
.story-owner small { color: rgba(255,255,255,.7); font-size: 9px; }
.story-tools { flex: 0 0 auto; display: flex; gap: 6px; }
.story-tools button {
  width: 36px;
  height: 36px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 50%;
  color: #fff;
  background: rgba(8,9,9,.38);
  backdrop-filter: blur(9px);
  font-size: 15px;
  font-weight: 900;
}
.story-tools [data-story-close] { font-size: 24px; }
.story-tools button:hover { background: rgba(8,9,9,.68); }
.story-tools button:focus-visible, .story-caption a:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.story-stage { position: absolute; z-index: 1; inset: 0; overflow: hidden; display: grid; place-items: center; background: #090a09; touch-action: none; }
.story-stage > img, .story-stage > video { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; display: block; object-fit: cover; background: #090a09; }
.story-stage > img[hidden], .story-stage > video[hidden] { display: none; }
.story-gradient { position: absolute; z-index: 2; inset: 0; background: linear-gradient(rgba(0,0,0,.66), transparent 19%, transparent 62%, rgba(0,0,0,.84)); pointer-events: none; }
.story-nav { position: absolute; z-index: 3; top: 76px; bottom: 112px; width: 50%; padding: 0; border: 0; outline: 0; color: transparent; background: transparent; }
.story-nav-previous { left: 0; }
.story-nav-next { right: 0; }
.story-nav:focus-visible { box-shadow: inset 0 0 0 2px rgba(255,255,255,.42); }
.story-caption { position: absolute; z-index: 7; right: 15px; bottom: max(17px, env(safe-area-inset-bottom)); left: 15px; display: grid; gap: 12px; pointer-events: none; }
.story-caption p { max-width: 94%; margin: 0; display: -webkit-box; overflow: hidden; color: #fff; font-size: 13px; font-weight: 650; line-height: 1.45; text-shadow: 0 2px 10px rgba(0,0,0,.8); -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.story-caption p:empty { display: none; }
.story-caption a { min-height: 48px; border-radius: 15px; color: #171817; background: rgba(255,255,255,.96); box-shadow: 0 12px 30px rgba(0,0,0,.25); font-size: 12px; pointer-events: auto; }

.listing-media-composer > h2 { margin-bottom: 3px; }
.media-upload-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.media-upload-card { min-width: 0; padding: 16px; border: 1px solid var(--line); border-radius: 19px; background: color-mix(in srgb, var(--canvas) 70%, var(--surface)); }
.media-upload-card > div:first-child { min-height: 60px; display: grid; grid-template-columns: 38px minmax(0,1fr); grid-template-rows: auto auto; align-items: center; column-gap: 10px; }
.media-upload-card > div:first-child > span { grid-row: 1 / 3; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 11px; color: #fff; background: linear-gradient(135deg, var(--pink), var(--violet)); font-size: 14px; font-weight: 900; }
.media-upload-card h3 { margin: 0; font-size: 14px; }
.media-upload-card > div:first-child p { margin: 0; color: var(--muted); font-size: 9px; }
.media-upload-card .upload-zone { min-height: 145px; }
.media-preview { margin-top: 12px; display: grid; gap: 9px; }
.media-preview:empty { display: none; }
.video-preview { max-width: 100%; grid-template-columns: 1fr; }
.video-preview .media-preview-item { aspect-ratio: 16 / 10; }
.story-preview[data-story-preview] { max-width: none; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.story-preview .media-preview-item { aspect-ratio: 9 / 16; }
.story-composer { margin-top: 15px; padding: 18px; display: grid; grid-template-columns: minmax(180px, .85fr) minmax(250px, 1.15fr); gap: 14px; border: 1px solid color-mix(in srgb, var(--violet) 28%, var(--line)); border-radius: 20px; background: radial-gradient(circle at 95% 0, rgba(255,79,134,.1), transparent 35%), color-mix(in srgb, var(--violet) 6%, var(--surface)); }
.story-composer-copy { display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 11px; }
.story-composer-copy h3 { margin: 0; font-size: 15px; }
.story-composer-copy p { margin: 3px 0 0; color: var(--muted); font-size: 10px; }
.story-gradient-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: conic-gradient(from 210deg, var(--coral), var(--pink), var(--violet), #f7ad3c, var(--coral)); box-shadow: 0 7px 20px rgba(255,79,134,.2); }
.story-composer .story-upload-zone, .story-composer .story-caption-field, .story-composer .story-preview { grid-column: 1 / 3; }
.story-caption-field { color: var(--muted); font-size: 10px; font-weight: 800; }
.existing-media-list { margin-top: 10px; display: grid; gap: 7px; }
.existing-media-list article { padding: 7px; display: grid; grid-template-columns: 58px minmax(0,1fr); align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }
.existing-media-list img { width: 58px; height: 48px; border-radius: 8px; object-fit: cover; }
.existing-media-list article > div { min-width: 0; display: flex; flex-direction: column; }
.media-status { width: max-content; padding: 3px 6px; border-radius: 20px; font-size: 8px; font-weight: 900; text-transform: uppercase; }
.media-status.approved { color: #116c4a; background: #daf5e8; }
.media-status.pending { color: #775513; background: #fff0bf; }
.media-status.rejected { color: #a72538; background: #ffe0e5; }
.media-status.expired { color: #606760; background: #e9ece9; }

.dashboard-story-composer { margin: 12px 0 18px; padding: 15px; display: grid; gap: 11px; border: 1px solid color-mix(in srgb, var(--violet) 25%, var(--line)); border-radius: 16px; background: color-mix(in srgb, var(--violet) 6%, var(--surface)); }
.dashboard-story-composer p { margin: 3px 0 0; color: var(--muted); font-size: 10px; }
.story-file-button input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.story-file-button span { min-height: 42px; padding: 0 12px; display: flex; align-items: center; justify-content: center; border: 1px dashed var(--violet); border-radius: 11px; color: var(--violet); background: var(--surface); font-size: 10px; font-weight: 900; cursor: pointer; }
.seller-story-list, .seller-video-list { display: grid; gap: 8px; }
.seller-story-list > article, .seller-video-list > article { padding: 9px; display: grid; grid-template-columns: 62px minmax(0,1fr) auto; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); }
.seller-media-thumb { position: relative; width: 62px; height: 74px; overflow: hidden; border-radius: 10px; background: #111; }
.seller-media-thumb img { width: 100%; height: 100%; object-fit: cover; }
.seller-media-thumb span { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; background: rgba(0,0,0,.2); font-size: 17px; }
.seller-story-list article > div:nth-child(2), .seller-video-list article > div:nth-child(2) { min-width: 0; }
.seller-story-list h3, .seller-video-list h3 { margin: 4px 0 2px; overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.seller-story-list p, .seller-video-list p { margin: 0; color: var(--muted); font-size: 9px; }
.seller-story-list article > a, .seller-video-list article > a { color: var(--violet); font-size: 9px; font-weight: 900; }

.admin-media-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; padding-bottom: 48px; }
.admin-media-grid > .admin-panel { min-width: 0; }
.admin-panel-heading { margin-bottom: 12px; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.admin-panel-heading span { color: var(--violet); font-size: 9px; font-weight: 950; letter-spacing: .8px; }
.admin-panel-heading h2 { margin: 2px 0 0; font-size: 20px; }
.admin-panel-heading > small { color: var(--muted); font-size: 9px; }
.admin-media-list { display: grid; gap: 10px; }
.admin-media-list > article { padding: 10px; display: grid; grid-template-columns: 120px minmax(0,1fr); gap: 11px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.admin-media-preview { width: 120px; aspect-ratio: 9 / 12; overflow: hidden; border-radius: 10px; background: #090a09; }
.admin-media-preview img, .admin-media-preview video { width: 100%; height: 100%; display: block; object-fit: cover; }
.admin-media-copy { min-width: 0; }
.admin-media-copy > small { color: var(--muted); font-size: 8px; }
.admin-media-copy h3 { margin: 5px 0; font-size: 13px; }
.admin-media-copy p { margin: 4px 0; color: var(--muted); font-size: 9px; }
.admin-media-copy a { color: var(--violet); font-size: 9px; font-weight: 900; }
.admin-media-actions { grid-column: 1 / 3; padding-top: 8px; display: grid; grid-template-columns: auto 1fr; gap: 8px; border-top: 1px solid var(--line); }
.admin-media-actions form { display: flex; align-items: flex-end; gap: 6px; }
.admin-media-actions label { flex: 1; color: var(--muted); font-size: 8px; font-weight: 800; }
.admin-media-actions select { min-height: 34px; padding: 0 7px; font-size: 9px; }
.admin-media-actions button { min-height: 34px; padding: 0 10px; border: 0; border-radius: 9px; color: #fff; background: var(--success); font-size: 9px; font-weight: 900; }
.admin-media-actions form:last-child button { background: var(--danger); }

html[data-theme-effective="dark"] :is(.media-upload-card, .existing-media-list article, .dashboard-story-composer, .seller-story-list > article, .seller-video-list > article, .admin-media-list > article) { color: var(--ink); border-color: var(--line); background: var(--surface); }
html[data-theme-effective="dark"] .story-composer { background: radial-gradient(circle at 95% 0, rgba(255,111,158,.13), transparent 35%), #211f2d; }
html[data-theme-effective="dark"] .story-bubble { color: #f4f5f3; }
html[data-theme-effective="dark"] .story-bubble > span::before, html[data-theme-effective="dark"] .story-bubble > span > i { border-color: var(--surface); }

@media (max-width: 900px) {
  .media-upload-grid, .admin-media-grid { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .story-experience { margin-right: -14px; margin-left: -14px; }
  .story-heading { padding: 0 14px; }
  .story-heading p { max-width: 240px; }
  .story-bubble { width: 72px; min-width: 72px; }
  .story-bubble > span { width: 68px; height: 68px; }
  .story-bubble > span > img, .story-bubble.story-add > span > i { width: 58px; height: 58px; }
  .story-viewer-shell { width: 100vw; height: 100dvh; border: 0; border-radius: 0; }
  .story-viewer-shell > header { top: max(20px, calc(env(safe-area-inset-top) + 12px)); }
  .story-composer { grid-template-columns: 1fr; }
  .story-composer .story-upload-zone, .story-composer .story-caption-field, .story-composer .story-preview { grid-column: 1; }
  .story-preview[data-story-preview] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .seller-story-list > article, .seller-video-list > article { grid-template-columns: 54px minmax(0,1fr); }
  .seller-media-thumb { width: 54px; height: 66px; }
  .seller-story-list article > a, .seller-video-list article > a { grid-column: 2; }
  .admin-media-list > article { grid-template-columns: 86px minmax(0,1fr); }
  .admin-media-preview { width: 86px; }
  .admin-media-actions { grid-template-columns: 1fr; }
  .admin-media-actions form { align-items: stretch; flex-direction: column; }
}

/* Reels layouts emitted by the marketplace views */
.reels-section { margin: 28px 0 42px; }
.reels-heading p { margin: 3px 0 0; color: var(--muted); font-size: 10px; }
.reel-media { position: absolute; inset: 0; overflow: hidden; background: #080909; }
.reel-media > video { position: absolute; z-index: 1; inset: 0; }
.reel-shade { position: absolute; z-index: 2; inset: 0; background: linear-gradient(rgba(0,0,0,.08), transparent 42%, rgba(0,0,0,.82)); pointer-events: none; }
.reel-tap-target {
  position: absolute;
  z-index: 3;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: #fff;
  background: transparent;
  backdrop-filter: none;
}
.reel-tap-target > span { width: 62px; height: 62px; display: grid; place-items: center; margin: auto; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; background: rgba(8,9,9,.42); backdrop-filter: blur(10px); box-shadow: 0 10px 30px rgba(0,0,0,.22); font-size: 20px; transition: opacity 160ms, transform 160ms; }
[data-reel].is-playing .reel-tap-target > span { opacity: 0; transform: scale(.82); }
.reel-tap-target:focus-visible { outline: 3px solid #fff; outline-offset: -6px; }
[data-reel] .reel-copy { z-index: 5; }
.reel-seller { margin-bottom: 8px; display: flex; align-items: center; gap: 7px; }
.reel-seller > span { width: 30px; height: 30px; display: grid; place-items: center; border: 2px solid rgba(255,255,255,.8); border-radius: 50%; color: #fff; background: linear-gradient(135deg, var(--pink), var(--violet)); font-size: 9px; font-weight: 950; }
.reel-seller b { color: #fff; font-size: 11px; }
.reel-seller i { width: 14px; height: 14px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--violet); font-size: 8px; font-style: normal; }
[data-reel] .reel-copy strong { display: block; margin-top: 7px; color: #fff; font-size: 18px; }
[data-reel] .reel-copy > a { width: max-content; min-height: 38px; margin-top: 10px; padding: 0 13px; border-radius: 11px; color: #171817; background: rgba(255,255,255,.95); box-shadow: none; font-size: 10px; }
[data-reel] .reel-actions { z-index: 6; }
[data-reel] .reel-actions form { margin: 0; }
[data-reel] .reel-actions button, [data-reel] .reel-actions a { position: relative; }
[data-reel] .reel-actions button small { position: absolute; top: calc(100% + 1px); color: #fff; font-size: 7px; text-shadow: 0 2px 7px rgba(0,0,0,.8); }
[data-reel] .reel-progress { overflow: hidden; }
[data-reel] .reel-progress span { width: 100%; height: 100%; display: block; background: #fff; }
.reels-preview .reels-feed {
  width: 100%;
  max-width: none;
  padding: 2px 2px 12px;
  grid-auto-flow: column;
  grid-auto-columns: minmax(245px, 30%);
  grid-template-columns: none;
  gap: 13px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
}
.reels-preview .reels-feed::-webkit-scrollbar { display: none; }
.reels-preview [data-reel] { max-height: 520px; scroll-snap-align: start; }
.reels-page .reels-feed { width: min(520px, 100%); }

@media (max-width: 700px) {
  .reels-section { margin-right: -14px; margin-left: -14px; }
  .reels-heading { padding: 0 14px; }
  .reels-preview .reels-feed { padding-right: 14px; padding-left: 14px; grid-auto-columns: minmax(220px, 72vw); }
  .reels-preview [data-reel] { max-height: 480px; border-radius: 22px; }
  .reels-page [data-reel] { min-height: calc(100dvh - 126px); }
}

/* lolo Market v24 — shared native/web product experience */
:root {
  color-scheme: dark;
  --ink: var(--lolo-text);
  --muted: var(--lolo-text-secondary);
  --line: var(--lolo-border);
  --surface: var(--lolo-elevated);
  --canvas: var(--lolo-background);
  --peach: var(--lolo-raised);
  --mint: var(--lolo-success);
  --violet: var(--lolo-ai);
  --pink: var(--lolo-gold-hover);
  --coral: var(--lolo-gold);
  --danger: var(--lolo-danger);
  --success: var(--lolo-success);
  --shadow: 0 22px 64px rgba(0, 0, 0, 0.34);
  --lolo-radius-small: 12px;
  --lolo-radius-medium: 18px;
  --lolo-radius-large: 28px;
  --lolo-control-height: 48px;
  --lolo-header-height: 76px;
  --lolo-mobile-nav-height: 74px;
  --lolo-content-width: 1320px;
  --lolo-scrim-top: linear-gradient(180deg, rgba(7, 9, 13, 0.76), transparent 24%);
  --lolo-scrim-bottom: linear-gradient(0deg, rgba(7, 9, 13, 0.92), transparent 48%);
}

html[data-theme-effective="dark"],
html:not([data-theme-effective]) {
  color-scheme: dark;
  --ink: var(--lolo-text);
  --muted: var(--lolo-text-secondary);
  --line: var(--lolo-border);
  --surface: var(--lolo-elevated);
  --canvas: var(--lolo-background);
  --peach: var(--lolo-raised);
  --shadow: 0 22px 64px rgba(0, 0, 0, 0.34);
}

html[data-theme-effective="light"] {
  color-scheme: light;
  --ink: #07090D;
  --muted: #606979;
  --line: #DDE1E8;
  --surface: #FFFFFF;
  --canvas: #F7F8FA;
  --peach: #FFF7DF;
  --shadow: 0 20px 55px rgba(7, 9, 13, 0.1);
}

html {
  min-width: 320px;
  background: var(--canvas);
  scrollbar-color: var(--lolo-raised) transparent;
  text-size-adjust: 100%;
}

body.market-body {
  min-height: 100vh;
  min-height: 100dvh;
  color: var(--ink);
  background:
    radial-gradient(circle at 13% -6%, rgba(255, 195, 43, 0.075), transparent 27rem),
    radial-gradient(circle at 92% 12%, rgba(167, 139, 250, 0.065), transparent 25rem),
    var(--canvas);
  font-family: ui-rounded, "SF Pro Rounded", "SF Pro Display", Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
}

body.market-body :is(button, [role="button"], input, select, textarea) {
  touch-action: manipulation;
}

.brand {
  font-family: ui-rounded, "SF Pro Rounded", "SF Pro Display", Inter, ui-sans-serif, sans-serif;
}

.brand > b {
  font-size: 18px;
  font-weight: 840;
  letter-spacing: -0.55px;
}

.brand > small {
  color: var(--muted);
  letter-spacing: 0.55px;
}

.site-header {
  min-height: var(--lolo-header-height);
  padding-inline: max(24px, calc((100vw - var(--lolo-content-width)) / 2));
  grid-template-columns: 240px minmax(420px, 1fr) auto;
  border-color: color-mix(in srgb, var(--line) 82%, transparent);
  background: color-mix(in srgb, var(--canvas) 88%, transparent);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
  -webkit-backdrop-filter: blur(22px) saturate(1.35);
  backdrop-filter: blur(22px) saturate(1.35);
}

.desktop-nav {
  gap: 3px;
}

.desktop-nav > a {
  min-height: 44px;
  padding-inline: 13px;
  color: var(--muted);
  border: 1px solid transparent;
  font-size: 12px;
  font-weight: 760;
}

.desktop-nav > a:hover,
.desktop-nav > a.active,
html[data-theme-effective="dark"] .desktop-nav > a:hover,
html[data-theme-effective="dark"] .desktop-nav > a.active {
  color: var(--ink);
  border-color: color-mix(in srgb, var(--line) 72%, transparent);
  background: color-mix(in srgb, var(--surface) 84%, transparent);
}

.desktop-nav > a.active::after {
  right: 18px;
  bottom: 5px;
  left: 18px;
  height: 3px;
  background: var(--lolo-gold);
}

.language-switcher select,
.theme-toggle,
.account-menu summary > span {
  min-width: 44px;
  height: 44px;
  border-color: var(--line);
  border-radius: 14px;
  color: var(--ink);
  background: var(--surface);
}

.language-switcher select { padding-inline: 10px 28px; }
.theme-toggle { width: 44px; }
.account-menu summary { min-height: 44px; }
.account-menu summary > span { display: grid; color: #07090D; background: var(--lolo-gold); }
.account-menu > div { top: 52px; border-color: var(--line); color: var(--ink); background: var(--surface); }
.account-menu > div a,
.account-menu > div button { min-height: 44px; }

.site-main {
  width: min(var(--lolo-content-width), calc(100% - 48px));
  min-height: calc(100dvh - 250px);
}

.primary-button,
.dark-button,
.outline-button {
  min-height: var(--lolo-control-height);
  border-radius: 15px;
  font-weight: 820;
}

.primary-button,
html[data-theme-effective="dark"] .primary-button {
  color: #07090D;
  background: linear-gradient(135deg, var(--lolo-gold), var(--lolo-gold-hover));
  box-shadow: 0 10px 28px rgba(255, 195, 43, 0.17);
}

.primary-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 34px rgba(255, 195, 43, 0.24);
}

.dark-button,
html[data-theme-effective="dark"] .dark-button {
  color: var(--lolo-text);
  background: var(--lolo-raised);
}

.outline-button,
html[data-theme-effective="dark"] .outline-button {
  color: var(--ink);
  border: 1px solid var(--line);
  background: var(--surface);
}

.market-hero,
html[data-theme-effective="dark"] .market-hero {
  min-height: 430px;
  margin-top: 26px;
  padding: 62px 58px 38px;
  border: 1px solid var(--line);
  border-radius: 34px;
  color: var(--lolo-text);
  background:
    radial-gradient(circle at 88% 8%, rgba(167, 139, 250, 0.22), transparent 29%),
    radial-gradient(circle at 8% 105%, rgba(255, 195, 43, 0.14), transparent 31%),
    linear-gradient(140deg, #0E1118 0%, #151923 57%, #202735 100%);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.24);
}

.market-hero::before {
  top: -135px;
  right: -95px;
  width: 340px;
  height: 340px;
  background: linear-gradient(135deg, var(--lolo-ai), var(--lolo-admin));
  opacity: 0.11;
}

.market-hero::after {
  bottom: 84px;
  left: -100px;
  border-color: rgba(255, 195, 43, 0.1);
}

.hero-copy { max-width: 760px; }
.eyebrow,
.hero-copy .eyebrow { color: var(--lolo-gold); }
.hero-copy h1 {
  max-width: 760px;
  color: var(--lolo-text);
  font-size: clamp(42px, 5vw, 68px);
  line-height: 0.98;
  letter-spacing: -3.5px;
  text-wrap: balance;
}
.hero-copy p,
html[data-theme-effective="dark"] .hero-copy p {
  max-width: 660px;
  color: var(--lolo-text-secondary);
  font-size: clamp(15px, 1.45vw, 18px);
}

.free-seal,
html[data-theme-effective="dark"] .free-seal {
  top: 44px;
  right: 48px;
  color: var(--lolo-text);
  border: 1px solid var(--lolo-border);
  background: rgba(7, 9, 13, 0.82);
  box-shadow: 0 22px 44px rgba(0, 0, 0, 0.26);
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
}
.free-seal b { color: var(--lolo-gold); }

.hero-search,
html[data-theme-effective="dark"] .hero-search {
  margin-top: 52px;
  padding: 9px;
  grid-template-columns: minmax(260px, 1.3fr) minmax(220px, 0.88fr) minmax(220px, 0.95fr) minmax(142px, auto);
  gap: 8px;
  border-color: rgba(255, 255, 255, 0.1);
  border-radius: 22px;
  color: var(--lolo-text);
  background: rgba(7, 9, 13, 0.72);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.26);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}

.hero-search label,
html[data-theme-effective="dark"] .hero-search label {
  min-width: 0;
  min-height: 72px;
  color: var(--lolo-text);
  background: rgba(32, 39, 53, 0.78);
}

.hero-search label small { color: var(--lolo-text-muted); }
.hero-search label > span { color: var(--lolo-gold); }
.hero-search input,
.hero-search select { min-width: 0; color: var(--lolo-text); text-overflow: ellipsis; }
.hero-search input::placeholder { color: var(--lolo-text-secondary); opacity: 0.88; }
.hero-search > button,
html[data-theme-effective="dark"] .hero-search > button {
  min-height: 72px;
  padding-inline: 20px;
  color: #07090D;
  background: linear-gradient(135deg, var(--lolo-gold), var(--lolo-gold-hover));
}
.hero-search .geo-button,
html[data-theme-effective="dark"] .hero-search .geo-button {
  color: #07090D;
  background: var(--lolo-gold);
}

.story-experience {
  margin-block: 30px 24px;
  padding: 18px 20px 16px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
}

.story-heading { min-height: 50px; }
.story-heading > div > span { color: var(--lolo-gold); }
.story-heading h2 { color: var(--ink); font-size: 21px; }
.story-heading p { color: var(--muted); font-size: 11px; }
.story-heading > a { min-height: 44px; padding: 0 12px; display: inline-flex; align-items: center; color: var(--lolo-gold); }
.story-tray { padding-block: 9px 4px; gap: 13px; }
.story-bubble { color: var(--ink); }
.story-bubble > span {
  background: conic-gradient(from 210deg, var(--lolo-gold), var(--lolo-ai), var(--lolo-admin), var(--lolo-gold-hover), var(--lolo-gold));
  box-shadow: 0 10px 26px rgba(167, 139, 250, 0.15);
}
.story-bubble > span::before,
.story-bubble > span > i { border-color: var(--surface); }
.story-bubble > span > i { color: #07090D; background: var(--lolo-gold); }
.story-bubble.seen > span,
.story-bubble.story-seen > span,
.story-bubble[data-story-seen="true"] > span { background: var(--lolo-border); }
.story-bubble.story-add > span > i { color: #07090D; background: var(--lolo-gold); }

.category-row {
  margin-block: 18px 14px;
  padding: 12px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 9px;
  border-color: var(--line);
  border-radius: 24px;
  background: var(--surface);
}

.category-row a {
  min-width: 0;
  min-height: 76px;
  border: 1px solid transparent;
  border-radius: 16px;
}

.category-row a:hover,
.category-row a:focus-visible {
  border-color: color-mix(in srgb, var(--lolo-ai) 42%, var(--line));
  background: color-mix(in srgb, var(--lolo-ai) 9%, var(--surface));
}

.category-row a > span {
  color: var(--lolo-gold);
  background: linear-gradient(145deg, var(--lolo-raised), color-mix(in srgb, var(--lolo-ai) 18%, var(--lolo-raised)));
}
.category-row b { color: var(--ink); font-size: 12px; }
.category-row small { color: var(--muted); }

.taxonomy-discovery,
.taxonomy-chip-row {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
}
.taxonomy-discovery::-webkit-scrollbar,
.taxonomy-chip-row::-webkit-scrollbar { display: none; }
.taxonomy-chip,
[data-taxonomy-chip] {
  min-width: max-content;
  min-height: 44px;
  padding: 0 15px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  scroll-snap-align: start;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink);
  background: var(--surface);
  font-size: 12px;
  font-weight: 760;
}
.taxonomy-chip[aria-pressed="true"],
.taxonomy-chip.active,
[data-taxonomy-chip][aria-pressed="true"] {
  color: #07090D;
  border-color: var(--lolo-gold);
  background: var(--lolo-gold);
}

.trust-strip article,
.listing-card,
.filter-panel,
.empty-state,
.seller-panel,
.deal-grid form,
.form-section,
.auth-card,
.settings-form,
.campaign-form,
.expense-form,
.metric-row article,
.panel {
  color: var(--ink);
  border-color: var(--line);
  background: var(--surface);
}

.trust-strip article > span {
  color: #07090D;
  background: var(--lolo-gold);
}
.trust-strip article:nth-child(2) > span { color: #07090D; background: var(--lolo-ai); }
.trust-strip article:nth-child(3) > span { color: #07090D; background: var(--lolo-success); }

.section-heading { min-height: 90px; }
.section-heading > div > span,
.results-heading span { color: var(--lolo-gold); }
.section-heading > a { min-height: 44px; padding: 0 10px; display: inline-flex; align-items: center; }

.listing-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.listing-card {
  border-radius: 22px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.09);
  transform: translateZ(0);
}

.listing-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--lolo-gold) 45%, var(--line));
  box-shadow: 0 24px 55px rgba(0, 0, 0, 0.19);
}

.listing-image {
  aspect-ratio: 4 / 3;
  background: var(--lolo-background-secondary);
}

.listing-image::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: auto 0 0;
  height: 34%;
  background: linear-gradient(transparent, rgba(7, 9, 13, 0.34));
  pointer-events: none;
}

.listing-image > span,
.featured-badge,
.urgent-badge,
.top-badge {
  z-index: 2;
  min-height: 28px;
  padding: 6px 10px;
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.2);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  letter-spacing: 0.35px;
}

.listing-image > span {
  color: var(--lolo-text);
  background: rgba(7, 9, 13, 0.68);
}
.featured-badge {
  color: #FFE08A;
  border-color: rgba(255, 195, 43, 0.58);
  background: rgba(255, 195, 43, 0.16);
}
.urgent-badge {
  color: #FFE08A;
  border-color: var(--lolo-warning);
  background: rgba(7, 9, 13, 0.66);
}
.top-badge {
  color: #07090D;
  border-color: rgba(255, 255, 255, 0.42);
  background: rgba(167, 139, 250, 0.94);
}

.listing-content { padding: 15px; }
.listing-location { color: var(--muted); font-size: 10px; }
.listing-location span { color: var(--lolo-gold); }
.listing-card h3 { height: auto; min-height: 43px; color: var(--ink); font-size: 16px; }
.listing-price { min-height: 42px; border-color: var(--line); }
.listing-price b { color: var(--ink); font-size: 20px; }
.listing-price small { color: var(--muted); }
.seller-line > span { color: #07090D; background: var(--lolo-gold); }
.seller-line i { color: #07090D; background: var(--lolo-success); }
.card-actions { grid-template-columns: 44px 1fr; }
.card-actions form button {
  width: 44px;
  height: 44px;
  color: var(--lolo-gold);
  border-color: var(--line);
  background: var(--surface);
}
.card-actions > a,
html[data-theme-effective="dark"] .card-actions > a {
  min-height: 44px;
  color: #07090D;
  background: var(--lolo-gold);
}

.sponsored-card {
  border: 1px solid var(--line);
  color: var(--lolo-text);
  background:
    radial-gradient(circle at 12% 140%, rgba(255, 195, 43, 0.14), transparent 46%),
    linear-gradient(120deg, var(--lolo-background-secondary), var(--lolo-elevated));
}
.sponsored-card small { color: var(--lolo-gold); }
.sponsored-card > a { color: #07090D; background: var(--lolo-gold); }

.sell-banner,
html[data-theme-effective="dark"] .sell-banner,
.dashboard-hero,
html[data-theme-effective="dark"] .dashboard-hero {
  color: var(--ink);
  border: 1px solid var(--line);
  background:
    radial-gradient(circle at 88% 12%, rgba(167, 139, 250, 0.17), transparent 33%),
    linear-gradient(135deg, var(--surface), color-mix(in srgb, var(--lolo-gold) 7%, var(--surface)));
}
.sell-banner > div > span,
html[data-theme-effective="dark"] .sell-banner > div > span,
.form-section > span,
html[data-theme-effective="dark"] .form-section > span {
  color: #07090D;
  background: var(--lolo-gold);
}

.browse-layout {
  padding-top: 30px;
  grid-template-columns: 292px minmax(0, 1fr);
  gap: 30px;
}
.filter-panel { top: calc(var(--lolo-header-height) + 20px); padding: 24px; }
.filter-panel form { gap: 14px; }
.filter-panel label,
.campaign-form label,
.settings-form label,
.expense-form label,
.auth-card label,
.listing-form label,
.deal-grid label,
html[data-theme-effective="dark"] :is(.filter-panel label, .campaign-form label, .settings-form label, .expense-form label, .auth-card label, .listing-form label, .deal-grid label) {
  color: var(--muted);
  font-size: 11px;
}

input,
select,
textarea,
html[data-theme-effective="dark"] :is(input, select, textarea) {
  min-height: 48px;
  border-color: var(--line);
  border-radius: 13px;
  color: var(--ink);
  background: color-mix(in srgb, var(--surface) 84%, var(--canvas));
}
input::placeholder,
textarea::placeholder { color: var(--muted); opacity: 0.72; }
input:focus,
select:focus,
textarea:focus {
  border-color: var(--lolo-gold);
  box-shadow: 0 0 0 3px rgba(255, 195, 43, 0.15);
}
select:disabled,
input:disabled,
textarea:disabled { opacity: 0.58; cursor: not-allowed; }

.location-tools,
.location-picker > [data-location-choose],
html[data-theme-effective="dark"] :is(.location-tools, .location-picker > [data-location-choose]) {
  color: var(--ink);
  background: color-mix(in srgb, var(--lolo-ai) 12%, var(--surface));
}
.location-tools button { min-height: 36px; color: #07090D; background: var(--lolo-ai); }
.location-picker > [data-location-choose] { min-height: 38px; }
.location-results { border-color: var(--line); color: var(--ink); background: var(--surface); }
.location-results > button:hover,
.location-results > button:focus { background: color-mix(in srgb, var(--lolo-gold) 10%, var(--surface)); }

.browse-results .listing-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.results-heading { min-height: 82px; }
.results-actions a,
.results-actions button {
  min-height: 44px;
  color: var(--ink);
  border: 1px solid var(--line);
  background: var(--surface);
}

.listing-detail {
  padding-top: 34px;
  grid-template-columns: minmax(0, 1.08fr) minmax(380px, 0.82fr);
  align-items: start;
}
.main-photo {
  aspect-ratio: 4 / 3;
  border: 1px solid var(--line);
  border-radius: 26px;
  background: var(--lolo-background-secondary);
}
.gallery-expand,
.gallery-arrow,
.lightbox-arrow,
.lightbox-toolbar button {
  min-width: 44px;
  width: 44px;
  height: 44px;
  border-color: rgba(255, 255, 255, 0.2);
  color: var(--lolo-text);
  background: rgba(7, 9, 13, 0.62);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.thumb-row button { min-width: 44px; border-radius: 13px; background: var(--lolo-background-secondary); }
.thumb-row button.active { border-color: var(--lolo-gold); }
.gallery-lightbox { padding: 0; background: rgba(7, 9, 13, 0.96); }
.gallery-lightbox-dialog {
  width: 100%;
  height: 100dvh;
  border: 0;
  border-radius: 0;
  background: var(--lolo-background);
}
.lightbox-toolbar {
  min-height: 68px;
  padding-top: max(10px, env(safe-area-inset-top));
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(7, 9, 13, 0.74);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}
.lightbox-stage { background: var(--lolo-background); }
.gallery-lightbox.is-chrome-hidden .lightbox-toolbar,
.gallery-lightbox.is-chrome-hidden .lightbox-arrow,
.gallery-lightbox.is-chrome-hidden .gallery-count {
  opacity: 0;
  pointer-events: none;
  transform: translateY(-12px);
}
.gallery-lightbox.is-chrome-hidden .lightbox-arrow { transform: translateY(-50%) scale(0.85); }

.detail-info {
  position: sticky;
  top: calc(var(--lolo-header-height) + 20px);
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--surface);
  box-shadow: var(--shadow);
}
.detail-title h1 { color: var(--ink); text-wrap: balance; }
.detail-title > div > span { color: #07090D; background: var(--lolo-success); }
.detail-title form button { width: 48px; height: 48px; color: var(--lolo-gold); border-color: var(--line); background: var(--surface); }
.detail-price { color: var(--ink); }
.detail-description,
html[data-theme-effective="dark"] .detail-description { color: var(--muted); }
.detail-specs > div,
html[data-theme-effective="dark"] .detail-specs > div {
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--surface) 84%, var(--canvas));
}
.detail-specs dt,
html[data-theme-effective="dark"] .detail-specs dt { color: var(--muted); }
.detail-specs dd,
html[data-theme-effective="dark"] .detail-specs dd { color: var(--ink); }
.seller-panel { border-color: var(--line); background: color-mix(in srgb, var(--surface) 86%, var(--canvas)); }
.seller-profile > span,
html[data-theme-effective="dark"] .seller-profile > span { color: #07090D; background: var(--lolo-gold); }
.seller-profile i { color: #07090D; background: var(--lolo-success); }
.contact-actions { gap: 9px; }
.contact-actions > :is(a, button) { min-height: 48px; }
.call-now,
html[data-theme-effective="dark"] .call-now {
  color: #0B5B3D !important;
  border-color: color-mix(in srgb, var(--lolo-success) 60%, var(--line)) !important;
  background: color-mix(in srgb, var(--lolo-success) 12%, var(--surface)) !important;
}

.form-page { max-width: 1040px; margin-inline: auto; }
.form-intro h1 { color: var(--ink); font-size: clamp(36px, 5vw, 52px); text-wrap: balance; }
.form-section { border-radius: 24px; box-shadow: 0 12px 34px rgba(0, 0, 0, 0.06); }
.upload-zone,
html[data-theme-effective="dark"] .upload-zone {
  min-height: 190px;
  color: var(--ink);
  border-color: color-mix(in srgb, var(--lolo-gold) 42%, var(--line));
  background: color-mix(in srgb, var(--lolo-gold) 5%, var(--surface));
}
.upload-zone b { color: #07090D; background: var(--lolo-gold); }
.upload-zone.ready,
html[data-theme-effective="dark"] .upload-zone.ready {
  border-color: var(--lolo-ai);
  background: color-mix(in srgb, var(--lolo-ai) 9%, var(--surface));
}
.condition-picker label,
html[data-theme-effective="dark"] .condition-picker label {
  min-height: 88px;
  border-color: var(--line);
  background: color-mix(in srgb, var(--surface) 86%, var(--canvas));
}
.condition-picker label > span { color: var(--lolo-ai); background: color-mix(in srgb, var(--lolo-ai) 13%, var(--surface)); }
.condition-picker label:has(input:checked) {
  border-color: var(--lolo-gold);
  background: color-mix(in srgb, var(--lolo-gold) 9%, var(--surface));
  box-shadow: inset 0 0 0 1px var(--lolo-gold);
}
.condition-picker label:has(input:checked) > span { color: #07090D; background: var(--lolo-gold); }
.ai-writer,
html[data-theme-effective="dark"] .ai-writer {
  color: var(--ink);
  border-color: color-mix(in srgb, var(--lolo-ai) 42%, var(--line));
  background:
    radial-gradient(circle at 95% 0, rgba(167, 139, 250, 0.15), transparent 34%),
    color-mix(in srgb, var(--lolo-ai) 6%, var(--surface));
}
.ai-writer-head > span { color: #07090D; background: var(--lolo-ai); }
.ai-writer-action button { min-height: 44px; color: #07090D; background: var(--lolo-ai); }
.choice-card,
html[data-theme-effective="dark"] .choice-card {
  color: var(--ink);
  border-color: var(--line);
  background: color-mix(in srgb, var(--lolo-ai) 6%, var(--surface));
}
.choice-card input:checked + span { color: #07090D; background: var(--lolo-gold); }
.contact-choice,
html[data-theme-effective="dark"] .contact-choice { color: var(--ink); border-color: var(--line); background: var(--surface); }
.toggle-list label,
html[data-theme-effective="dark"] .toggle-list label { color: var(--ink); border: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 86%, var(--canvas)); }
.toggle-list input:checked + span { background: var(--lolo-gold); }
.legal-check input,
.cookie-options input { accent-color: var(--lolo-gold); }
.legal-check a { color: var(--lolo-gold); }

.urgent-request,
.urgent-choice,
.top-request,
.top-choice { border-color: color-mix(in srgb, var(--lolo-gold) 60%, var(--line)); }
.urgent-choice,
.top-choice,
html[data-theme-effective="dark"] .urgent-choice,
html[data-theme-effective="dark"] .top-choice {
  background: color-mix(in srgb, var(--lolo-gold) 8%, var(--surface));
}
.urgent-choice > span { color: #07090D; background: var(--lolo-gold); }
.top-choice > span { color: #07090D; background: var(--lolo-ai); }
.urgent-choice b,
.top-choice b,
html[data-theme-effective="dark"] :is(.urgent-choice b, .top-choice b) { color: var(--ink); }
.urgent-choice small,
.top-choice small,
html[data-theme-effective="dark"] :is(.urgent-choice small, .top-choice small) { color: var(--muted); }

.dashboard-hero { border-radius: 28px; }
.dashboard-hero h1 { color: var(--ink); }
.metric-row article { box-shadow: 0 10px 28px rgba(0, 0, 0, 0.06); }
.metric-row small { color: var(--muted); }
.metric-row b { color: var(--ink); }
.panel { border-radius: 20px; }
.panel-heading a,
.panel-heading span { color: var(--lolo-gold); }
.dashboard-story-composer,
html[data-theme-effective="dark"] .dashboard-story-composer {
  color: var(--ink);
  border-color: color-mix(in srgb, var(--lolo-ai) 32%, var(--line));
  background: color-mix(in srgb, var(--lolo-ai) 7%, var(--surface));
}
.story-file-button span { min-height: 44px; color: var(--lolo-ai); border-color: var(--lolo-ai); background: var(--surface); }

.auth-shell,
html[data-theme-effective="dark"] .auth-shell { background: var(--canvas); }
.auth-promo {
  background:
    radial-gradient(circle at 100% 0, rgba(167, 139, 250, 0.24), transparent 36%),
    radial-gradient(circle at 0 100%, rgba(255, 195, 43, 0.15), transparent 34%),
    var(--lolo-background-secondary);
}
.auth-card { border-color: var(--line); background: var(--surface); }
.auth-card > p a { color: var(--lolo-gold); }

.story-viewer,
.story-viewer-shell,
.story-viewer-dialog { background: var(--lolo-background); }
.story-viewer { overscroll-behavior: contain; }
.story-viewer-shell,
.story-viewer-dialog { border-color: rgba(255, 255, 255, 0.12); }
.story-tools button,
.story-control { width: 44px; height: 44px; }
.story-gradient { background: var(--lolo-scrim-top), var(--lolo-scrim-bottom); }
.story-caption a,
.story-viewer-footer a { min-height: 48px; color: #07090D; background: var(--lolo-gold); }
.story-viewer.is-chrome-hidden :is(.story-progress, .story-viewer-header, .story-viewer-footer),
.story-viewer.is-chrome-hidden .story-viewer-dialog::before,
.story-viewer.is-chrome-hidden .story-viewer-dialog::after,
.story-viewer.is-chrome-hidden .story-viewer-shell > :is(header, .story-progress),
.story-viewer.is-chrome-hidden .story-caption,
.story-viewer.is-chrome-hidden .story-gradient {
  opacity: 0;
  pointer-events: none;
}

.reels-page {
  margin-block: 16px 30px;
}
.reels-page .reels-heading { width: min(620px, 100%); margin-inline: auto; }
.reels-page .reels-feed {
  width: min(600px, 100%);
  height: min(820px, calc(100dvh - var(--lolo-header-height) - 30px));
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scroll-snap-type: y mandatory;
  scroll-padding-block: 0;
  scrollbar-width: none;
}
.reels-page .reels-feed::-webkit-scrollbar { display: none; }
.reels-page [data-reel] {
  height: 100%;
  min-height: 100%;
  max-height: none;
  aspect-ratio: auto;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  border-radius: 28px;
}
.reel-shade,
[data-reel]::after { background: var(--lolo-scrim-bottom); }
[data-reel] .reel-actions { right: 16px; bottom: 26px; gap: 12px; }
[data-reel] .reel-actions button,
[data-reel] .reel-actions a,
[data-reel-play],
[data-reel-mute] {
  width: 48px;
  height: 48px;
  border-color: rgba(255, 255, 255, 0.2);
  background: rgba(7, 9, 13, 0.5);
}
[data-reel] .reel-copy { right: 82px; bottom: 30px; left: 20px; }
[data-reel] .reel-copy h3 { font-size: clamp(18px, 3vw, 24px); text-wrap: balance; }
[data-reel] .reel-copy strong { color: var(--lolo-gold); font-size: 22px; }
[data-reel] .reel-copy > a { min-height: 44px; color: #07090D; background: var(--lolo-gold); }
.reel-seller > span { color: #07090D; border-color: rgba(255, 255, 255, 0.82); background: var(--lolo-gold); }
.reel-seller i { color: #07090D; background: var(--lolo-success); }
[data-reel].is-chrome-hidden :is(.reel-copy, .reel-actions, .reel-shade),
[data-reel].is-chrome-hidden::after {
  opacity: 0;
  pointer-events: none;
}
[data-reel].is-chrome-hidden .reel-tap-target > span { opacity: 0; }
[data-reel] :is(.reel-copy, .reel-actions, .reel-shade),
[data-reel]::after,
.story-viewer :is(.story-progress, .story-viewer-header, .story-viewer-footer, .story-caption, .story-gradient),
.gallery-lightbox :is(.lightbox-toolbar, .lightbox-arrow) {
  transition: opacity 180ms ease, transform 180ms ease;
}

/* Markup-ready immersive photo/video announcement shell. */
body.immersive-open {
  overflow: hidden;
  overscroll-behavior: none;
}
.immersive-market-overlay {
  --lolo-text: #F7F8FA;
  --lolo-text-secondary: #BEC4D0;
  --lolo-text-muted: #8C95A5;
  --lolo-background: #07090D;
  --lolo-background-secondary: #0E1118;
  position: fixed;
  z-index: 900;
  inset: 0;
  color: #F7F8FA;
  color-scheme: dark;
  background: #07090D;
  overscroll-behavior: contain;
}
.immersive-market-overlay[hidden] { display: none; }
.immersive-market-feed {
  width: 100%;
  height: 100dvh;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scroll-snap-type: y mandatory;
  scrollbar-width: none;
}
.immersive-market-feed::-webkit-scrollbar { display: none; }
.immersive-listing {
  position: relative;
  width: 100%;
  height: 100dvh;
  overflow: hidden;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  isolation: isolate;
  background: var(--lolo-background);
  cursor: pointer;
}
.immersive-media-track {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  touch-action: pan-x pan-y;
}
.immersive-media-track::-webkit-scrollbar { display: none; }
.immersive-media-item {
  position: relative;
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  background: var(--lolo-background);
}
.immersive-media-item { margin: 0; }
.immersive-media-item > :is(img, video) {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  background: var(--lolo-background);
}
.immersive-media-item[data-crop="cover"] > :is(img, video) { object-fit: cover; }
.immersive-scrim {
  position: absolute;
  z-index: 2;
  inset: 0;
  background: var(--lolo-scrim-top), var(--lolo-scrim-bottom);
  pointer-events: none;
}
.immersive-chrome {
  position: absolute;
  z-index: 4;
  inset: 0;
  pointer-events: none;
  transition: opacity 180ms ease;
}
.immersive-topbar {
  position: absolute;
  top: max(12px, env(safe-area-inset-top));
  right: 14px;
  left: 14px;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  pointer-events: auto;
}
.immersive-action-rail {
  position: absolute;
  right: 14px;
  bottom: max(104px, calc(env(safe-area-inset-bottom) + 90px));
  display: grid;
  gap: 12px;
  pointer-events: auto;
}
.immersive-action-rail form { margin: 0; }
.immersive-action-rail [hidden] { display: none !important; }
.immersive-topbar :is(button, a),
.immersive-action-rail :is(button, a) {
  width: 48px;
  height: 48px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  color: var(--lolo-text);
  background: rgba(7, 9, 13, 0.52);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.immersive-topbar :is(button, a):disabled,
.immersive-action-rail :is(button, a):disabled,
.immersive-media-arrow:disabled {
  opacity: 0.38;
  cursor: default;
}
.immersive-media-arrow {
  position: absolute;
  z-index: 6;
  top: 50%;
  width: 48px;
  height: 48px;
  padding: 0;
  display: grid;
  place-items: center;
  transform: translateY(-50%);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  color: var(--lolo-text);
  background: rgba(7, 9, 13, 0.52);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  pointer-events: auto;
}
.immersive-media-previous { left: 14px; }
.immersive-media-next { right: 14px; }
.immersive-media-count {
  position: absolute;
  z-index: 6;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(14px, env(safe-area-inset-bottom));
  min-width: 48px;
  min-height: 28px;
  padding: 5px 10px;
  border-radius: 999px;
  color: var(--lolo-text);
  background: rgba(7, 9, 13, 0.56);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  pointer-events: none;
}
.immersive-copy {
  position: absolute;
  right: 82px;
  bottom: max(32px, calc(env(safe-area-inset-bottom) + 22px));
  left: 18px;
  max-width: 600px;
  display: grid;
  gap: 7px;
  pointer-events: auto;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.78);
}
.immersive-copy h2 { margin: 0; color: var(--lolo-text); font-size: clamp(20px, 4vw, 30px); line-height: 1.1; text-wrap: balance; }
.immersive-copy p { margin: 0; display: -webkit-box; overflow: hidden; color: var(--lolo-text-secondary); -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.immersive-copy strong { color: var(--lolo-gold); font-size: clamp(20px, 4vw, 28px); }
.immersive-copy .primary-button {
  width: max-content;
  min-height: 44px;
  padding-inline: 16px;
  color: #07090D;
  text-shadow: none;
}
.immersive-badges {
  min-height: 30px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.immersive-badges :is(.featured-badge, .urgent-badge, .top-badge) {
  position: static;
  inset: auto;
}
.immersive-badges > span {
  min-height: 28px;
  padding: 5px 10px;
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 999px;
  color: var(--lolo-text);
  background: rgba(7, 9, 13, 0.56);
  font-size: 10px;
  font-weight: 800;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.immersive-listing.is-chrome-hidden :is(.immersive-chrome, .immersive-scrim) {
  opacity: 0;
  pointer-events: none;
}
.immersive-listing.is-chrome-hidden { cursor: none; }
.immersive-pagination {
  position: absolute;
  z-index: 5;
  top: max(16px, env(safe-area-inset-top));
  left: 50%;
  min-width: 46px;
  min-height: 28px;
  padding: 4px 10px;
  transform: translateX(-50%);
  border-radius: 999px;
  color: var(--lolo-text);
  background: rgba(7, 9, 13, 0.5);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

.gallery-immersive {
  position: absolute;
  z-index: 4;
  top: 68px;
  right: 16px;
  width: 44px;
  height: 44px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 195, 43, 0.55);
  border-radius: 50%;
  color: #07090D;
  background: var(--lolo-gold);
  box-shadow: 0 9px 26px rgba(0, 0, 0, 0.25);
  font-size: 19px;
  font-weight: 900;
}

.site-footer {
  color: var(--lolo-text);
  border-top: 1px solid var(--lolo-border);
  background: var(--lolo-background-secondary);
}
.site-footer p,
.site-footer > small { color: var(--lolo-text-muted); }
.site-footer nav { color: var(--lolo-text-secondary); }
.site-footer nav button { color: var(--lolo-gold); }

html[data-text-size="large"] { font-size: 118%; }
html[data-text-size="large"] :is(.listing-card h3, .hero-copy h1, .detail-title h1) { height: auto; max-height: none; }
html[data-text-size="large"] :is(.site-header, .mobile-nav) { --lolo-header-height: 84px; --lolo-mobile-nav-height: 84px; }

@media (max-width: 1180px) {
  .site-header { grid-template-columns: 205px 1fr auto; gap: 12px; }
  .desktop-nav > a { padding-inline: 9px; font-size: 11px; }
  .hero-search { grid-template-columns: minmax(240px, 1.2fr) minmax(190px, 0.8fr) minmax(190px, 0.9fr) 128px; }
  .browse-results .listing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 920px) {
  body.market-body { padding-bottom: calc(var(--lolo-mobile-nav-height) + env(safe-area-inset-bottom)); }
  .site-header {
    min-height: 66px;
    padding-inline: 16px;
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .desktop-nav { display: none; }
  .site-main { width: min(100% - 28px, 760px); }
  .header-actions { gap: 7px; }
  .header-actions .text-button,
  .header-actions > .primary-button { display: none; }
  .account-menu summary > b { display: none; }
  body.market-body .market-hero { padding: 42px 28px 26px; }
  body.market-body .hero-copy { padding-right: 72px; }
  body.market-body .hero-copy h1 { font-size: clamp(38px, 8vw, 55px); }
  body.market-body .free-seal { top: 24px; right: 22px; width: 88px; height: 88px; }
  body.market-body .hero-search { grid-template-columns: 1fr 1fr; margin-top: 38px; }
  body.market-body .hero-search > label:first-child { grid-column: 1 / 3; }
  body.market-body .hero-search label:nth-child(2),
  body.market-body .hero-search .hero-city { display: grid; }
  body.market-body .hero-search > button { min-height: 58px; grid-column: 1 / 3; font-size: 13px; }
  body.market-body .hero-search > button span { font-size: inherit; }
  .category-row { display: flex; overflow-x: auto; scrollbar-width: none; }
  .category-row a { min-width: 174px; scroll-snap-align: start; }
  .listing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .browse-layout { display: block; }
  .filter-panel { position: static; margin-bottom: 18px; }
  .filter-panel > div { display: block; }
  .filter-panel form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filter-panel form > label:first-child,
  .filter-panel form > .primary-button,
  .filter-panel form > .reset-link { grid-column: 1 / 3; }
  .price-fields { display: grid; }
  .listing-detail { grid-template-columns: 1fr; }
  .detail-info { position: static; }
  .mobile-nav {
    min-height: calc(var(--lolo-mobile-nav-height) + env(safe-area-inset-bottom));
    padding: 6px 8px max(6px, env(safe-area-inset-bottom));
    border-color: var(--lolo-border);
    background: rgba(14, 17, 24, 0.94);
    box-shadow: 0 -12px 36px rgba(0, 0, 0, 0.24);
    -webkit-backdrop-filter: blur(22px) saturate(1.35);
    backdrop-filter: blur(22px) saturate(1.35);
  }
  .mobile-nav a {
    min-width: 44px;
    min-height: 56px;
    color: var(--lolo-text-muted);
    font-size: 9px;
    font-weight: 720;
  }
  .mobile-nav a span { font-size: 21px; }
  .mobile-nav a:is(.active, [aria-current="page"]) { color: var(--lolo-gold); }
  .mobile-nav .mobile-sell { color: var(--lolo-text-secondary); }
  .mobile-nav .mobile-sell span {
    width: 50px;
    height: 50px;
    margin-top: -16px;
    border: 4px solid var(--lolo-background-secondary);
    border-radius: 50%;
    color: #07090D;
    background: var(--lolo-gold);
    box-shadow: 0 10px 28px rgba(255, 195, 43, 0.25);
  }
  .site-footer { margin-bottom: calc(-1 * (var(--lolo-mobile-nav-height) + env(safe-area-inset-bottom))); padding-bottom: calc(var(--lolo-mobile-nav-height) + env(safe-area-inset-bottom) + 38px); }
}

@media (max-width: 620px) {
  .site-main { width: min(100% - 24px, 560px); }
  .site-header .brand { grid-template-columns: 34px auto; }
  .brand > .brand-mark { width: 34px; height: 38px; }
  .brand > b { font-size: 16px; }
  .brand > small { font-size: 8px; }
  .language-switcher select,
  .theme-toggle,
  .account-menu summary > span { min-width: 42px; width: 42px; height: 42px; }
  .language-switcher select { width: auto; padding-inline: 7px 21px; }
  body.market-body .market-hero {
    min-height: 0;
    margin: 12px -2px 0;
    padding: 34px 18px 18px;
    border-radius: 26px;
  }
  body.market-body .hero-copy { padding-right: 0; }
  body.market-body .hero-copy h1 { margin-top: 8px; font-size: clamp(34px, 11vw, 48px); line-height: 1; letter-spacing: -2.2px; }
  body.market-body .hero-copy p { padding-right: 74px; font-size: 14px; }
  body.market-body .free-seal { top: 74px; right: 16px; width: 76px; height: 76px; padding: 9px; }
  body.market-body .free-seal b { font-size: 18px; }
  body.market-body .hero-search { margin-top: 28px; padding: 7px; grid-template-columns: 1fr; border-radius: 19px; }
  body.market-body .hero-search > label:first-child,
  body.market-body .hero-search > button { grid-column: auto; }
  body.market-body .hero-search label,
  html[data-theme-effective="dark"] .hero-search label { min-height: 64px; }
  body.market-body .hero-search label:nth-child(2),
  body.market-body .hero-search .hero-city { display: grid; }
  body.market-body .hero-search > button { min-height: 54px; }
  .story-experience { margin-right: -12px; margin-left: -12px; padding: 15px 12px 13px; border-right: 0; border-left: 0; border-radius: 0; }
  .story-heading { padding-inline: 2px; }
  .story-heading p { max-width: 225px; }
  .category-row { margin-right: -12px; margin-left: -12px; padding-inline: 12px; border-right: 0; border-left: 0; border-radius: 0; scroll-snap-type: x proximity; }
  .category-row a { min-width: 166px; }
  .trust-strip { gap: 9px; }
  .trust-strip article { min-height: 82px; padding: 15px; }
  .listing-grid,
  .browse-results .listing-grid { grid-template-columns: 1fr; gap: 16px; }
  .listing-card { border-radius: 22px; }
  .listing-image { aspect-ratio: 4 / 3; }
  .listing-content { padding: 14px; }
  .listing-card h3 { min-height: 0; font-size: 17px; }
  .seller-line { display: grid; }
  .listing-price b { font-size: 21px; }
  .card-actions { margin-top: 9px; grid-template-columns: 48px 1fr; }
  .card-actions form button { width: 48px; height: 48px; }
  .card-actions > a { min-height: 48px; font-size: 12px; }
  .filter-panel { margin-right: -2px; margin-left: -2px; padding: 18px; }
  .filter-panel form { display: grid; grid-template-columns: 1fr; }
  .filter-panel form > label:first-child,
  .filter-panel form > .primary-button,
  .filter-panel form > .reset-link { grid-column: auto; }
  .filter-panel form > label:nth-child(4),
  .filter-panel .reset-link { display: flex; }
  .price-fields { display: grid; }
  .results-heading { align-items: flex-start; flex-direction: column; }
  .results-actions { width: 100%; flex-wrap: wrap; }
  .results-actions :is(form, a, button) { flex: 1; }
  .main-photo { margin-inline: -12px; border-right: 0; border-left: 0; border-radius: 0; }
  .detail-info { margin: 0 -2px; padding: 18px; }
  .thumb-row { overflow-x: auto; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 66px; scrollbar-width: none; }
  .form-page { padding-top: 28px; }
  .form-section { padding: 18px; }
  .photo-preview { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .condition-picker > div { grid-template-columns: repeat(2, 1fr); }
  .condition-picker label:last-child { grid-column: auto; }
  .media-upload-grid { grid-template-columns: 1fr; }
  .story-preview[data-story-preview] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dashboard-hero { padding: 22px; }
  .metric-row { grid-template-columns: repeat(2, 1fr); }
  .reels-page {
    position: relative;
    margin: 0 calc(50% - 50vw);
  }
  .reels-page .reels-heading {
    position: absolute;
    z-index: 8;
    top: 0;
    right: 0;
    left: 0;
    min-height: 62px;
    padding: 0 14px;
    color: var(--lolo-text);
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.72);
    pointer-events: none;
  }
  .reels-page .reels-heading a { pointer-events: auto; }
  .reels-page .reels-heading p { color: var(--lolo-text-secondary); }
  .reels-page.is-chrome-hidden .reels-heading { opacity: 0; pointer-events: none; }
  .reels-page .reels-feed {
    width: 100vw;
    height: calc(100dvh - 66px - var(--lolo-mobile-nav-height) - env(safe-area-inset-bottom));
  }
  .reels-page [data-reel] {
    min-height: 100%;
    border: 0;
    border-radius: 0;
  }
  .reels-preview .reels-feed { grid-auto-columns: minmax(245px, 80vw); }
  .reels-preview [data-reel] { border-radius: 24px; }
  [data-reel] .reel-copy { right: 78px; bottom: 24px; left: 16px; }
  [data-reel] .reel-actions { right: 12px; bottom: 22px; }
  .story-viewer-shell,
  .story-viewer-dialog { width: 100vw; height: 100dvh; border: 0; border-radius: 0; }
  .immersive-media-item > :is(img, video) { object-fit: contain; }
  .immersive-copy { right: 76px; bottom: max(24px, calc(env(safe-area-inset-bottom) + 18px)); left: 16px; }
  .immersive-action-rail { right: 12px; bottom: max(92px, calc(env(safe-area-inset-bottom) + 76px)); }
  .site-footer { padding-inline: 20px; }
}

@media (max-width: 390px) {
  .site-header { padding-inline: 11px; }
  .header-actions { gap: 4px; }
  .language-switcher select { max-width: 54px; }
  body.market-body .hero-copy h1 { font-size: 34px; }
  body.market-body .hero-copy p { padding-right: 65px; font-size: 13px; }
  body.market-body .free-seal { width: 68px; height: 68px; }
  .story-heading p { display: none; }
  .mobile-nav a { font-size: 8px; }
  .mobile-nav .mobile-sell span { width: 46px; height: 46px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .listing-card:hover,
  .primary-button:hover { transform: none; }
  .reels-page .reels-feed,
  .immersive-market-feed,
  .immersive-media-track { scroll-snap-type: none; }
}

@media (prefers-contrast: more) {
  :root { --line: #566174; }
  html[data-theme-effective="light"] { --line: #596273; }
  :is(.listing-card, .filter-panel, .form-section, .panel, .story-experience, .category-row) { border-width: 2px; }
  button:focus-visible,
  a:focus-visible,
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible { outline-width: 4px; }
}

@media (forced-colors: active) {
  .primary-button,
  .urgent-badge,
  .top-badge,
  .mobile-nav .mobile-sell span { border: 2px solid ButtonText; color: ButtonText; background: ButtonFace; }
  .immersive-scrim,
  .reel-shade { display: none; }
}

@supports not ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
  .site-header,
  .mobile-nav,
  .hero-search,
  .free-seal,
  .gallery-arrow,
  .gallery-expand,
  .immersive-topbar :is(button, a),
  .immersive-action-rail :is(button, a) { background-color: var(--lolo-background-secondary); }
}

/* lolo Market v25 — coherent themes, assisted mobile flows and private workspaces */
html,
body { max-width: 100%; overflow-x: hidden; overflow-x: clip; }
body.market-body :is(main, section, article, aside, form, fieldset, div, label) { min-width: 0; }
body.market-body :is(h1, h2, h3, p, dd) { overflow-wrap: anywhere; }
[hidden] { display: none !important; }

html[data-theme-effective="light"] body.market-body {
  color: #07090D;
  background:
    radial-gradient(circle at 13% -6%, rgba(255, 195, 43, 0.09), transparent 27rem),
    radial-gradient(circle at 92% 12%, rgba(104, 168, 255, 0.08), transparent 25rem),
    #F7F8FA;
}

html[data-theme-effective="dark"] body.market-body {
  color: #F7F8FA;
  background:
    radial-gradient(circle at 13% -6%, rgba(255, 195, 43, 0.07), transparent 27rem),
    radial-gradient(circle at 92% 12%, rgba(167, 139, 250, 0.07), transparent 25rem),
    #07090D;
}

.member-banner {
  width: min(var(--lolo-content-width), calc(100% - 48px));
  min-height: 120px;
  margin: 18px auto 0;
  padding: 22px 24px;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--lolo-ai) 32%, var(--line));
  border-radius: 24px;
  color: var(--ink);
  background:
    radial-gradient(circle at 92% 10%, rgba(167, 139, 250, 0.18), transparent 25%),
    radial-gradient(circle at 3% 115%, rgba(255, 195, 43, 0.14), transparent 34%),
    var(--surface);
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.09);
}
.member-banner-mark {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 18px 18px 18px 6px;
  color: #07090D;
  background: linear-gradient(145deg, var(--lolo-gold), var(--lolo-gold-hover));
  box-shadow: 0 12px 28px rgba(255, 195, 43, 0.18);
  font-size: 23px;
}
.member-banner > div:nth-child(2) small { color: var(--lolo-ai); font-size: 9px; font-weight: 900; letter-spacing: 1.1px; }
.member-banner h2 { margin: 2px 0 3px; color: var(--ink); font-size: clamp(20px, 2.2vw, 28px); line-height: 1.08; letter-spacing: -0.7px; }
.member-banner p { max-width: 680px; margin: 0; color: var(--muted); font-size: 12px; }
.member-banner-actions { display: flex; align-items: center; justify-content: flex-end; gap: 9px; }
.member-banner-actions > a { min-height: 48px; flex: 0 0 auto; }
.app-store-link {
  min-width: 150px;
  min-height: 50px;
  padding: 7px 13px;
  display: grid;
  grid-template-columns: 28px 1fr;
  grid-template-rows: 15px 20px;
  align-items: center;
  border: 1px solid var(--lolo-border);
  border-radius: 14px;
  color: var(--lolo-text);
  background: var(--lolo-background-secondary);
}
.app-store-link > span { grid-row: 1 / 3; font-size: 26px; }
.app-store-link small { color: var(--lolo-text-secondary); font-size: 8px; line-height: 1; }
.app-store-link b { font-size: 15px; line-height: 1; }

.share-sheet {
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  margin: 0;
  padding: 20px;
  border: 0;
  color: var(--ink);
  background: rgba(7, 9, 13, 0.58);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.share-sheet::backdrop { background: rgba(7, 9, 13, 0.58); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.share-sheet[open],
.share-sheet.is-open { display: grid; place-items: center; }
.share-sheet-card {
  position: relative;
  width: min(620px, 100%);
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: 26px;
  color: var(--ink);
  background: var(--surface);
  box-shadow: 0 30px 100px rgba(0, 0, 0, 0.42);
}
.share-sheet-card h2 { margin: 5px 44px 4px 0; font-size: 28px; letter-spacing: -0.9px; }
.share-sheet-card > p { max-width: 520px; margin: 0 44px 22px 0; color: var(--muted); font-size: 12px; }
.share-sheet-close {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--ink);
  background: color-mix(in srgb, var(--surface) 82%, var(--canvas));
  font-size: 26px;
}
.share-network-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.share-network-grid :is(a, button) {
  min-height: 88px;
  padding: 11px 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 16px;
  color: var(--ink);
  background: color-mix(in srgb, var(--surface) 86%, var(--canvas));
  font-size: 11px;
  font-weight: 820;
  text-align: center;
}
.share-network-grid :is(a, button):hover { border-color: var(--lolo-gold); background: color-mix(in srgb, var(--lolo-gold) 8%, var(--surface)); }
.share-network-grid :is(a, button) > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; color: #07090D; background: var(--lolo-gold); font-size: 14px; font-weight: 950; }
.share-network-grid [data-share-network="facebook"] > span { color: #fff; background: #1877F2; }
.share-network-grid [data-share-network="x"] > span { color: #fff; background: #07090D; }
.share-network-grid [data-share-network="linkedin"] > span { color: #fff; background: #0A66C2; }
.share-network-grid [data-share-network="telegram"] > span { color: #fff; background: #229ED9; }
.share-network-grid [data-share-network="whatsapp"] > span { color: #fff; background: #168C4B; }
.share-sheet-card > small { min-height: 20px; margin-top: 12px; display: block; color: var(--muted); font-size: 10px; }

.message-hub-hero {
  min-height: 190px;
  margin-top: 22px;
  padding: 32px 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 28px;
  color: var(--lolo-text);
  background:
    radial-gradient(circle at 82% 0, rgba(104, 168, 255, 0.24), transparent 36%),
    radial-gradient(circle at 5% 130%, rgba(255, 195, 43, 0.16), transparent 38%),
    linear-gradient(135deg, #0E1118, #202735);
}
.message-hub-hero h1 { max-width: 760px; margin: 5px 0; color: var(--lolo-text); font-size: clamp(34px, 4.7vw, 55px); line-height: 1; letter-spacing: -2px; }
.message-hub-hero p { max-width: 650px; margin: 0; color: var(--lolo-text-secondary); }
.message-hub-mark { width: 102px; height: 102px; flex: 0 0 102px; display: grid; place-items: center; transform: rotate(8deg); border: 1px solid rgba(255,255,255,.14); border-radius: 34px 34px 34px 10px; color: #07090D; background: var(--lolo-gold); box-shadow: 0 18px 40px rgba(0,0,0,.28); font-size: 50px; }

.message-shell {
  min-height: 650px;
  padding: 16px 0 70px;
  grid-template-columns: minmax(280px, 350px) minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  align-items: stretch;
  gap: 14px;
}
.message-shell .safety-banner { grid-column: 1 / -1; min-height: 64px; padding: 13px 16px; color: var(--ink); border-color: color-mix(in srgb, var(--lolo-warning) 44%, var(--line)); background: color-mix(in srgb, var(--lolo-warning) 10%, var(--surface)); }
.message-shell .safety-banner > span { width: 34px; height: 34px; color: #07090D; background: var(--lolo-warning); }
.message-shell .safety-banner p { color: color-mix(in srgb, var(--ink) 76%, var(--muted)); font-size: 11px; line-height: 1.5; }
.conversation-list,
.chat-panel { color: var(--ink); border-color: var(--line); border-radius: 22px; background: var(--surface); box-shadow: 0 14px 38px rgba(0,0,0,.08); }
.conversation-list { align-self: stretch; max-height: 650px; overflow-y: auto; overscroll-behavior: contain; }
.conversation-list .panel-heading { min-height: 78px; padding: 16px 18px; align-items: center; border-bottom: 1px solid var(--line); }
.conversation-list .panel-heading > div { min-width: 0; }
.conversation-list .panel-heading small { color: var(--lolo-ai); font-size: 8px; font-weight: 900; letter-spacing: .8px; }
.conversation-list .panel-heading h2 { margin: 1px 0 0; font-size: 20px; }
.conversation-list .panel-heading > span { min-width: 30px; min-height: 30px; display: grid; place-items: center; border-radius: 999px; color: #07090D; background: var(--lolo-gold); }
.conversation-list > a { min-height: 92px; padding: 11px 13px; grid-template-columns: 58px minmax(0, 1fr) 24px; border-color: var(--line); }
.conversation-list > a:hover { background: color-mix(in srgb, var(--lolo-ai) 7%, var(--surface)); }
.conversation-list > a.active { box-shadow: inset 4px 0 0 var(--lolo-gold); background: color-mix(in srgb, var(--lolo-gold) 8%, var(--surface)); }
.conversation-list img { width: 58px; height: 58px; border: 1px solid var(--line); border-radius: 16px; background: var(--canvas); }
.conversation-list b { color: var(--ink); font-size: 13px; }
.conversation-list span { color: var(--ink); font-size: 10px; }
.conversation-list small { color: var(--muted); }
.conversation-list i { min-width: 22px; width: auto; height: 22px; padding: 0 5px; color: #07090D; background: var(--lolo-gold); }
.message-empty-mini { min-height: 370px; padding: 32px 22px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.message-empty-mini > span { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 19px 19px 19px 6px; color: #07090D; background: var(--lolo-ai); font-size: 25px; }
.message-empty-mini b { margin-top: 14px; font-size: 16px; }
.message-empty-mini p { margin: 5px 0 16px; color: var(--muted); font-size: 11px; }
.message-empty-mini a { min-height: 48px; }
.chat-panel { min-height: 650px; grid-template-rows: 82px minmax(0, 1fr) auto; }
.chat-panel > header { min-height: 82px; padding: 0 20px; border-color: var(--line); }
.chat-panel > header > div { min-width: 0; margin-right: auto; }
.chat-panel > header h2 { overflow: hidden; color: var(--ink); text-overflow: ellipsis; white-space: nowrap; }
.chat-panel > header small { color: var(--lolo-ai); font-weight: 850; }
.chat-listing-link { max-width: min(310px, 44%); min-height: 48px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--line); border-radius: 13px; color: var(--ink) !important; background: color-mix(in srgb, var(--surface) 85%, var(--canvas)); }
.chat-back { display: none; }
.message-stream { min-height: 430px; max-height: 650px; padding: 24px; gap: 11px; background: color-mix(in srgb, var(--canvas) 74%, var(--surface)); overscroll-behavior: contain; }
html[data-theme-effective="dark"] .message-stream { background: color-mix(in srgb, var(--canvas) 74%, var(--surface)); }
.message-stream article { max-width: min(74%, 640px); padding: 12px 14px; color: var(--ink); border: 1px solid var(--line); background: var(--surface); box-shadow: 0 7px 20px rgba(0,0,0,.06); }
.message-stream article.mine { color: #07090D; border-color: color-mix(in srgb, var(--lolo-gold) 66%, var(--line)); background: var(--lolo-gold); }
html[data-theme-effective="dark"] .message-stream article.mine { color: #07090D; background: var(--lolo-gold); }
.message-stream p { margin: 4px 0; font-size: 13px; line-height: 1.52; }
.message-stream small { font-size: 9px; }
.message-thread-empty,
.message-select-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.message-thread-empty { min-height: 100%; margin: auto; color: var(--muted); }
.message-thread-empty > span,
.message-select-empty > span { width: 70px; height: 70px; display: grid; place-items: center; border-radius: 24px 24px 24px 8px; color: #07090D; background: var(--lolo-ai); font-size: 28px; }
.message-thread-empty b { margin-top: 16px; color: var(--ink); font-size: 17px; }
.message-thread-empty p { max-width: 420px; margin: 6px 0; font-size: 11px; }
.message-select-empty { min-height: 100%; padding: 38px; }
.message-select-empty h2 { margin: 17px 0 5px; color: var(--ink); font-size: 24px; }
.message-select-empty p { max-width: 430px; margin: 0 0 18px; color: var(--muted); }
.chat-form { padding: 13px; grid-template-columns: minmax(0, 1fr) 120px; border-color: var(--line); background: var(--surface); }
.chat-form textarea { min-height: 64px; max-height: 180px; }
.chat-form > button { min-height: 64px; }
.message-send-error { grid-column: 1 / -1; min-height: 48px; padding: 8px 10px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid color-mix(in srgb, var(--danger) 48%, var(--line)); border-radius: 12px; color: var(--danger); background: color-mix(in srgb, var(--danger) 8%, var(--surface)); font-size: 11px; }
.message-send-error button { min-height: 48px; padding: 0 12px; border: 0; border-radius: 10px; color: #fff; background: var(--danger); font-weight: 850; }

.ad-package-section { padding: 20px 0 6px; }
.ad-package-section .section-heading { min-height: 92px; }
.ad-package-section .section-heading p { margin: 4px 0 0; color: var(--muted); }
.ad-package-notice { min-height: 74px; margin-bottom: 14px; padding: 14px 16px; display: grid; grid-template-columns: 38px minmax(0,1fr); align-items: center; gap: 12px; border: 1px solid color-mix(in srgb, var(--lolo-warning) 42%, var(--line)); border-radius: 17px; color: var(--ink); background: color-mix(in srgb, var(--lolo-warning) 9%, var(--surface)); }
.ad-package-notice > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 12px; color: #07090D; background: var(--lolo-warning); font-weight: 950; }
.ad-package-notice b { font-size: 13px; }
.ad-package-notice p { margin: 2px 0 0; color: var(--muted); font-size: 10px; }
.ad-package-notice.is-active { border-color: color-mix(in srgb, var(--lolo-success) 48%, var(--line)); background: color-mix(in srgb, var(--lolo-success) 9%, var(--surface)); }
.ad-package-notice.is-active > span { background: var(--lolo-success); }
.ad-package-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.ad-package-card { position: relative; min-height: 350px; padding: 25px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 23px; color: var(--ink); background: var(--surface); box-shadow: 0 12px 34px rgba(0,0,0,.07); }
.ad-package-card.recommended { border-color: color-mix(in srgb, var(--lolo-ai) 62%, var(--line)); background: radial-gradient(circle at 100% 0, rgba(167,139,250,.15), transparent 34%), var(--surface); }
.ad-package-card[data-package-status="active"] { border-color: color-mix(in srgb, var(--lolo-success) 56%, var(--line)); box-shadow: 0 15px 40px rgba(65,213,141,.09); }
.package-recommended { position: absolute; top: 16px; right: 16px; min-height: 28px; padding: 5px 10px; display: inline-flex; align-items: center; border-radius: 999px; color: #07090D; background: var(--lolo-ai); font-size: 8px; font-weight: 900; }
.ad-package-card > small { color: var(--lolo-gold); font-size: 9px; font-weight: 900; letter-spacing: .7px; text-transform: uppercase; }
.ad-package-card h3 { margin: 8px 0 1px; font-size: 22px; letter-spacing: -.5px; }
.ad-package-card strong { color: var(--ink); font-size: clamp(30px, 4vw, 42px); letter-spacing: -1.5px; }
.ad-package-card ul { margin: 22px 0; padding: 0; display: grid; gap: 11px; list-style: none; color: var(--muted); font-size: 11px; }
.ad-package-card li { display: flex; align-items: center; gap: 8px; }
.ad-package-card li > span { color: var(--lolo-success); font-weight: 950; }
.ad-package-card > button { min-height: 48px; margin-top: auto; border: 1px solid var(--line); border-radius: 14px; color: var(--muted); background: color-mix(in srgb, var(--surface) 80%, var(--canvas)); font-weight: 850; cursor: not-allowed; }
.package-checkout-link { min-height: 48px; margin-top: auto; padding: 0 14px; display: flex; align-items: center; justify-content: center; border-radius: 14px; color: #07090D; background: var(--lolo-success); font-size: 11px; font-weight: 900; text-align: center; }
.package-checkout-options { max-height: 242px; margin-top: auto; padding-top: 4px; display: grid; gap: 7px; overflow-y: auto; overscroll-behavior: contain; }
.package-checkout-options > small { color: var(--muted); font-size: 9px; font-weight: 800; }
.package-checkout-options form { margin: 0; }
.package-checkout-options button { width: 100%; min-height: 56px; padding: 8px 12px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; border: 0; border-radius: 13px; color: #07090D; background: var(--lolo-success); text-align: left; }
.package-checkout-options button > span { font-size: 10px; font-weight: 900; }
.package-checkout-options button > small { max-width: 100%; overflow: hidden; font-size: 9px; font-weight: 720; text-overflow: ellipsis; white-space: nowrap; }
.campaign-request-note { margin: -3px 0 3px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; color: var(--muted); background: color-mix(in srgb, var(--lolo-ai) 6%, var(--surface)); font-size: 10px; }
.catalog-field-help { margin-top: 6px; color: var(--muted); font-size: 9px; font-weight: 650; line-height: 1.4; }

.listing-promotion-unavailable { min-height: 58px; margin-top: 14px; padding: 10px 12px; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 10px; border: 1px dashed color-mix(in srgb, var(--lolo-warning) 48%, var(--line)); border-radius: 14px; color: var(--ink); background: color-mix(in srgb, var(--lolo-warning) 7%, var(--surface)); }
.listing-promotion-unavailable > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; color: #07090D; background: var(--lolo-warning); font-weight: 950; }
.listing-promotion-unavailable p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.45; }

.business-profile-link { min-height: 92px; margin-top: 15px; padding: 16px 18px; display: grid; grid-template-columns: 46px minmax(0, 1fr) 30px; align-items: center; gap: 13px; border: 1px solid color-mix(in srgb, var(--lolo-ai) 38%, var(--line)); border-radius: 19px; color: var(--ink); background: radial-gradient(circle at 100% 0, rgba(167,139,250,.15), transparent 32%), var(--surface); }
.business-profile-link > span { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 15px 15px 15px 5px; color: #07090D; background: var(--lolo-ai); font-size: 20px; }
.business-profile-link > div { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.business-profile-link b { font-size: 13px; }
.business-profile-link small { color: var(--muted); font-size: 10px; line-height: 1.45; }
.business-profile-link > strong { color: var(--lolo-ai); font-size: 20px; text-align: right; }
.business-profile-page { max-width: 1040px; margin-inline: auto; padding: 42px 0 80px; }
.business-status-panel { padding: 22px; border: 1px solid var(--line); border-radius: 23px; color: var(--ink); background: radial-gradient(circle at 100% 0, rgba(167,139,250,.13), transparent 30%), var(--surface); box-shadow: 0 14px 38px rgba(0,0,0,.07); }
.business-status-panel .panel-heading { min-height: 50px; }
.business-status-grid { margin-top: 14px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.business-status-grid article { min-width: 0; min-height: 84px; padding: 13px; display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 15px; background: color-mix(in srgb, var(--surface) 84%, var(--canvas)); }
.business-status-grid article > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: #07090D; background: var(--lolo-gold); font-size: 17px; font-weight: 950; }
.business-status-grid article:nth-child(2) > span { background: var(--lolo-ai); }
.business-status-grid article:nth-child(3) > span { background: var(--lolo-success); }
.business-status-grid article > div { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.business-status-grid small { color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .4px; text-transform: uppercase; }
.business-status-grid b { overflow-wrap: anywhere; font-size: 11px; line-height: 1.4; }
.business-status-grid a { color: var(--lolo-ai); text-decoration: underline; text-underline-offset: 2px; }
.business-capability { min-height: 48px; margin: 12px 0 0; padding: 9px 12px; display: flex; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 13px; color: var(--muted); background: color-mix(in srgb, var(--surface) 85%, var(--canvas)); font-size: 10px; line-height: 1.45; }
.business-capability > span { width: 28px; height: 28px; flex: 0 0 28px; display: grid; place-items: center; border-radius: 9px; color: #07090D; background: var(--lolo-warning); font-weight: 950; }
.business-capability.is-available > span { background: var(--lolo-success); }
.business-badge-disclosure { min-height: 68px; margin-top: 9px; padding: 11px 13px; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 10px; border: 1px dashed var(--line); border-radius: 14px; background: color-mix(in srgb, var(--surface) 88%, var(--canvas)); }
.business-badge-disclosure > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; color: #07090D; background: var(--lolo-warning); font-weight: 950; }
.business-badge-disclosure.is-matched { border-style: solid; border-color: color-mix(in srgb, var(--lolo-success) 48%, var(--line)); }
.business-badge-disclosure.is-matched > span { background: var(--lolo-success); }
.business-badge-disclosure b { color: var(--ink); font-size: 11px; }
.business-badge-disclosure p { margin: 2px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.business-profile-form { margin-top: 14px; padding: 24px; display: flex; flex-direction: column; gap: 15px; border: 1px solid var(--line); border-radius: 23px; color: var(--ink); background: var(--surface); box-shadow: 0 14px 38px rgba(0,0,0,.07); }
.business-profile-form label { display: flex; flex-direction: column; gap: 6px; color: var(--muted); font-size: 10px; font-weight: 850; }
.business-profile-form input:disabled { opacity: 1; color: var(--muted); background: color-mix(in srgb, var(--surface) 76%, var(--canvas)); }
.business-profile-form > button { align-self: flex-start; min-height: 48px; }
.authority-attestation { min-height: 84px; padding: 13px 14px; display: grid !important; grid-template-columns: 26px minmax(0, 1fr); align-items: center; gap: 11px; border: 1px solid color-mix(in srgb, var(--lolo-ai) 40%, var(--line)); border-radius: 15px; background: color-mix(in srgb, var(--lolo-ai) 6%, var(--surface)); cursor: pointer; }
.authority-attestation input { width: 24px; height: 24px; margin: 0; accent-color: var(--lolo-ai); }
.authority-attestation > span { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.authority-attestation b { color: var(--ink); font-size: 11px; line-height: 1.4; }
.authority-attestation small { color: var(--muted); font-size: 9px; line-height: 1.45; }
.authority-attestation:has(input:focus-visible) { outline: 3px solid var(--lolo-focus); outline-offset: 2px; }
.business-update-notice { min-height: 48px; margin: 0; padding: 9px 12px; display: flex; align-items: center; gap: 9px; border-radius: 12px; color: var(--muted); background: color-mix(in srgb, var(--lolo-warning) 7%, var(--surface)); font-size: 9px; line-height: 1.45; }
.business-update-notice > span { width: 26px; height: 26px; flex: 0 0 26px; display: grid; place-items: center; border-radius: 8px; color: #07090D; background: var(--lolo-warning); font-weight: 950; }
.business-submit-locked { min-height: 68px; margin-top: 14px; padding: 13px 15px; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 10px; border: 1px solid color-mix(in srgb, var(--danger) 50%, var(--line)); border-radius: 15px; color: var(--danger); background: color-mix(in srgb, var(--danger) 7%, var(--surface)); }
.business-submit-locked > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; color: #fff; background: var(--danger); font-weight: 950; }
.business-submit-locked p { margin: 0; font-size: 10px; line-height: 1.5; }

.admin-business-disclosure { min-height: 92px; margin-bottom: 14px; padding: 15px 17px; display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 13px; border: 1px solid #3e4237; border-radius: 15px; color: #eef0ee; background: #24251f; }
.admin-business-disclosure > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: #171817; background: var(--lolo-warning); font-weight: 950; }
.admin-business-disclosure b { font-size: 12px; }
.admin-business-disclosure p { max-width: 980px; margin: 3px 0 5px; color: #abb2ac; font-size: 9px; line-height: 1.5; }
.admin-business-disclosure small { color: #7f8881; font-size: 8px; }
.admin-business-disclosure a { color: var(--mint); text-decoration: underline; text-underline-offset: 2px; }
.business-review-list { display: flex; flex-direction: column; }
.business-review-card { padding: 20px; border-top: 1px solid #2a2e2b; }
.business-review-card:first-child { border-top: 0; }
.business-review-summary { min-width: 0; margin-bottom: 15px; display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: center; gap: 12px; }
.business-review-avatar { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 15px 15px 15px 5px; color: #171817; background: var(--lolo-ai); font-size: 18px; font-weight: 950; }
.business-review-summary > div:last-child { min-width: 0; }
.business-review-summary small { color: #747c76; font-size: 8px; }
.business-review-summary h2 { margin: 2px 0; overflow-wrap: anywhere; color: #fff; font-size: 17px; }
.business-review-summary p { margin: 0 0 4px; overflow-wrap: anywhere; color: #9ba39d; font-size: 9px; }
.business-review-summary code { color: var(--mint); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 9px; }
.business-review-states { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.business-review-lane { min-width: 0; padding: 15px; border: 1px solid #303531; border-radius: 14px; background: #1f2320; }
.business-review-lane.registry-lane { border-color: #4b4632; }
.business-review-lane.authority-lane { border-color: #3c3650; }
.business-review-lane-heading { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 10px; }
.business-review-lane-heading > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: #171817; background: var(--lolo-warning); font-weight: 950; }
.authority-lane .business-review-lane-heading > span { background: var(--lolo-ai); }
.business-review-lane-heading small { color: #767f78; font-size: 7px; font-weight: 900; letter-spacing: .8px; }
.business-review-lane-heading h3 { margin: 2px 0 0; color: #fff; font-size: 13px; text-transform: capitalize; }
.business-review-lane dl { margin: 13px 0; display: grid; gap: 5px; }
.business-review-lane dl > div { min-height: 32px; padding: 5px 7px; display: grid; grid-template-columns: minmax(120px, .8fr) minmax(0, 1.2fr); align-items: center; gap: 8px; border-radius: 8px; background: #252925; }
.business-review-lane dt { color: #727b74; font-size: 8px; }
.business-review-lane dd { margin: 0; overflow-wrap: anywhere; color: #d9ddda; font-size: 8px; text-align: right; }
.authority-review-copy { min-height: 109px; margin: 13px 0; padding: 10px; color: #a9b0aa; border-radius: 10px; background: #252925; font-size: 9px; line-height: 1.55; }
.business-review-lane form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; align-items: end; gap: 8px; }
.business-review-lane form label { display: flex; flex-direction: column; gap: 5px; color: #7f8881; font-size: 8px; font-weight: 800; }
.business-review-lane form :is(input, select) { min-width: 0; min-height: 48px; border-color: #393e3a; color: #eef0ee; background: #292d29; font-size: 9px; }
.business-review-lane form button { min-height: 48px; padding: 0 12px; border: 0; border-radius: 10px; color: #171817; background: var(--mint); font-size: 8px; font-weight: 900; }
.authority-lane form button { background: var(--lolo-ai); }

.price-insight {
  margin: 12px 0 18px;
  padding: 17px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--lolo-ai) 38%, var(--line));
  border-radius: 18px;
  color: var(--ink);
  background:
    radial-gradient(circle at 100% 0, rgba(167,139,250,.15), transparent 38%),
    color-mix(in srgb, var(--lolo-ai) 5%, var(--surface));
}
.price-insight-heading { display: flex; align-items: center; gap: 11px; }
.price-insight-heading > span { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; border-radius: 14px 14px 14px 5px; color: #07090D; background: var(--lolo-ai); font-size: 22px; font-weight: 950; }
.price-insight-heading > div { min-width: 0; }
.price-insight-heading small { color: var(--lolo-ai); font-size: 8px; font-weight: 900; letter-spacing: .8px; }
.price-insight h2 { margin: 2px 0 0; color: var(--ink); font-size: 16px; line-height: 1.2; }
.price-insight > p { margin: 11px 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.price-insight-range { margin: 12px 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.price-insight-range > span { min-height: 64px; padding: 9px; display: flex; flex-direction: column; justify-content: center; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface) 86%, var(--canvas)); }
.price-insight-range small { color: var(--muted); font-size: 8px; }
.price-insight-range b { color: var(--ink); overflow-wrap: anywhere; font-size: 12px; }
.price-insight > small { margin-top: 5px; display: block; color: var(--muted); font-size: 8px; line-height: 1.4; }
@keyframes price-insight-pulse { 50% { opacity: .55; transform: scale(.94); } }
.price-insight[data-price-insight][aria-busy="true"] .price-insight-heading > span { animation: price-insight-pulse 900ms ease-in-out infinite; }
.price-insight.is-within { border-color: color-mix(in srgb, var(--lolo-success) 52%, var(--line)); }
.price-insight.is-within .price-insight-heading > span { background: var(--lolo-success); }
.price-insight.is-above { border-color: color-mix(in srgb, var(--lolo-warning) 58%, var(--line)); }
.price-insight.is-above .price-insight-heading > span { background: var(--lolo-warning); }
.price-insight.is-below .price-insight-heading > span { background: var(--lolo-gold); }
.price-insight.is-unavailable { border-style: dashed; background: color-mix(in srgb, var(--surface) 88%, var(--canvas)); }

.ai-writer,
html[data-theme-effective="dark"] .ai-writer {
  overflow: hidden;
  border-color: color-mix(in srgb, var(--lolo-ai) 42%, var(--line));
  color: var(--ink);
  background:
    radial-gradient(circle at 100% 0, rgba(167,139,250,.16), transparent 36%),
    color-mix(in srgb, var(--lolo-ai) 5%, var(--surface));
}
.ai-writer[aria-busy="true"] .ai-writer-head > span { animation: price-insight-pulse 900ms ease-in-out infinite; }
.ai-writer.is-ready { border-color: color-mix(in srgb, var(--lolo-success) 54%, var(--line)); }
.ai-writer.is-error { border-color: color-mix(in srgb, var(--danger) 54%, var(--line)); }
.ai-writer.is-unavailable { border-style: dashed; background: color-mix(in srgb, var(--surface) 88%, var(--canvas)); }
.ai-writer-head small { max-width: 880px; line-height: 1.5; }
.ai-consent {
  min-height: 76px;
  margin-top: 13px;
  padding: 12px 14px;
  display: grid !important;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 11px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--ink);
  background: color-mix(in srgb, var(--surface) 86%, var(--canvas));
  cursor: pointer;
}
.ai-consent input { width: 24px; height: 24px; margin: 0; accent-color: var(--lolo-ai); }
.ai-consent > span { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ai-consent b { font-size: 11px; line-height: 1.4; }
.ai-consent small { color: var(--muted); font-size: 9px; line-height: 1.4; }
.ai-consent:has(input:focus-visible) { outline: 3px solid var(--lolo-focus); outline-offset: 2px; }
.ai-writer-action { min-width: 0; }
.ai-writer-action button { min-height: 48px; padding: 0 17px; flex: 0 0 auto; }
.ai-writer-action button:disabled { opacity: .48; cursor: not-allowed; }
.ai-writer-action small { min-width: 0; line-height: 1.45; }
.ai-guidance { margin-top: 13px; padding: 13px 15px; border: 1px solid var(--line); border-radius: 14px; background: color-mix(in srgb, var(--lolo-success) 7%, var(--surface)); }
.ai-guidance > b { color: var(--ink); font-size: 11px; }
.ai-guidance ul { margin: 7px 0 9px; padding-left: 19px; color: var(--ink); font-size: 10px; line-height: 1.5; }
.ai-guidance > small { display: block; color: var(--muted); font-size: 9px; line-height: 1.45; }

.seller-price-guide {
  padding: 16px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--lolo-gold) 50%, var(--line));
  border-radius: 18px;
  color: var(--ink);
  background:
    radial-gradient(circle at 100% 0, rgba(255,195,43,.15), transparent 36%),
    color-mix(in srgb, var(--lolo-gold) 5%, var(--surface));
}
.seller-price-head { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 10px; }
.seller-price-head > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px 13px 13px 5px; color: #07090D; background: var(--lolo-gold); font-size: 21px; font-weight: 950; }
.seller-price-head > div { min-width: 0; display: flex; flex-direction: column; }
.seller-price-head b { font-size: 14px; }
.seller-price-head small { color: var(--muted); font-size: 10px; line-height: 1.5; }
.seller-price-action { margin-top: 13px; display: flex; align-items: center; gap: 12px; }
.seller-price-action button { min-height: 48px; padding: 0 17px; flex: 0 0 auto; border: 0; border-radius: 12px; color: #07090D; background: var(--lolo-gold); font-size: 11px; font-weight: 900; }
.seller-price-action button:disabled { opacity: .48; cursor: not-allowed; }
.seller-price-action > small { min-width: 0; color: var(--muted); font-size: 10px; line-height: 1.45; }
.seller-price-guide.is-loading .seller-price-head > span { animation: price-insight-pulse 900ms ease-in-out infinite; }
.seller-price-guide.is-within { border-color: color-mix(in srgb, var(--lolo-success) 54%, var(--line)); }
.seller-price-guide.is-within .seller-price-head > span { background: var(--lolo-success); }
.seller-price-guide.is-above { border-color: color-mix(in srgb, var(--lolo-warning) 58%, var(--line)); }
.seller-price-guide.is-above .seller-price-head > span { background: var(--lolo-warning); }
.seller-price-guide.is-below .seller-price-head > span { background: var(--lolo-ai); }
.seller-price-guide.is-unavailable { border-style: dashed; background: color-mix(in srgb, var(--surface) 88%, var(--canvas)); }
.seller-price-guide.is-error { border-color: color-mix(in srgb, var(--danger) 54%, var(--line)); }
.seller-price-result { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.seller-price-result h3 { margin: 0; color: var(--ink); font-size: 16px; }
.seller-price-result > p { margin: 4px 0 11px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.seller-price-range { margin: 11px 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.seller-price-range > span { min-height: 64px; padding: 9px; display: flex; flex-direction: column; justify-content: center; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface) 86%, var(--canvas)); }
.seller-price-range small { color: var(--muted); font-size: 8px; }
.seller-price-range b { color: var(--ink); overflow-wrap: anywhere; font-size: 12px; }
.seller-price-result > small { margin-top: 5px; display: block; color: var(--muted); font-size: 8px; line-height: 1.45; }

.condition-picker label,
html[data-theme-effective="dark"] .condition-picker label {
  position: relative;
  min-height: 96px;
  padding: 12px 9px;
  border-width: 2px;
  transition: transform 150ms ease, border-color 150ms ease, background 150ms ease, box-shadow 150ms ease;
}
.condition-picker input { inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.condition-picker label:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--lolo-ai) 58%, var(--line)); }
.condition-picker label:has(input:focus-visible) { outline: 3px solid var(--lolo-focus); outline-offset: 3px; }
.condition-picker label:has(input:checked) { padding-right: 29px; }
.condition-picker label:has(input:checked)::after { content: "✓"; position: absolute; top: 8px; right: 8px; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; color: #07090D; background: var(--lolo-gold); font-size: 12px; font-weight: 950; }
.condition-picker label > span { width: 38px; height: 38px; border-radius: 12px; font-size: 17px; }
.condition-picker label > b { color: var(--ink); font-size: 11px; }

.admin-session { min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.admin-session .admin-person { min-width: 0; flex: 1 1 auto; }
.admin-logout { flex: 0 0 auto; }
.admin-logout button { min-width: 72px; min-height: 48px; padding: 0 10px; border: 1px solid #3a433d; border-radius: 11px; color: #eef0ee; background: #242925; font-size: 9px; font-weight: 850; }
.admin-logout button:hover { border-color: var(--lolo-gold); color: #07090D; background: var(--lolo-gold); }

@media (max-width: 920px) {
  .member-banner { width: min(100% - 28px, 760px); grid-template-columns: 48px minmax(0, 1fr); }
  .member-banner-mark { width: 48px; height: 48px; }
  .member-banner-actions { grid-column: 1 / -1; justify-content: flex-start; flex-wrap: wrap; }
  .ad-package-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ad-package-card:last-child { grid-column: 1 / -1; }
  .business-review-lane form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .business-review-lane form button { grid-column: 1 / -1; width: 100%; }
  .admin-session .admin-person div { display: none; }
}

@media (max-width: 760px) {
  .message-hub-hero { min-height: 155px; margin-top: 14px; padding: 25px 22px; border-radius: 24px; }
  .message-hub-hero h1 { font-size: clamp(30px, 9vw, 42px); letter-spacing: -1.4px; }
  .message-hub-hero p { font-size: 12px; }
  .message-hub-mark { width: 72px; height: 72px; flex-basis: 72px; border-radius: 24px 24px 24px 8px; font-size: 34px; }
  .message-shell { min-height: 0; padding-bottom: 28px; grid-template-columns: 1fr; grid-template-rows: auto auto; }
  .message-shell .safety-banner { grid-column: 1; }
  .message-shell:not(.has-active-conversation) .chat-panel { display: none; }
  .message-shell.has-active-conversation .conversation-list { display: none; }
  .conversation-list { width: 100%; max-height: none; }
  .chat-panel { width: 100%; min-height: calc(100dvh - 235px); }
  .chat-panel > header { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 10px; padding: 10px 12px; }
  .chat-back { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 14px; color: var(--ink); background: color-mix(in srgb, var(--surface) 84%, var(--canvas)); font-size: 18px; }
  .chat-listing-link { max-width: 150px; }
  .message-stream { min-height: 360px; max-height: none; }
  .share-network-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .business-status-grid { grid-template-columns: 1fr; }
  .business-review-states { grid-template-columns: 1fr; }
  .authority-review-copy { min-height: 0; }
}

@media (max-width: 620px) {
  .language-switcher select,
  .theme-toggle,
  .account-menu summary > span { min-width: 48px; width: 48px; height: 48px; }
  body.market-body :is(.primary-button, .outline-button, .dark-button, .results-actions button) { min-height: 48px; }
  .member-banner { width: calc(100% - 24px); margin-top: 12px; padding: 18px; gap: 13px; border-radius: 20px; }
  .member-banner > div:nth-child(2) { grid-column: 2; }
  .member-banner h2 { font-size: 20px; }
  .member-banner p { font-size: 11px; }
  .member-banner-actions { display: grid; grid-template-columns: 1fr; }
  .member-banner-actions > a { width: 100%; }
  .app-store-link { width: 100%; }
  .share-sheet { padding: 10px; align-items: end; }
  .share-sheet-card { padding: 25px 17px max(18px, env(safe-area-inset-bottom)); border-radius: 24px 24px 18px 18px; }
  .share-sheet-card h2 { font-size: 24px; }
  .share-network-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .share-network-grid :is(a, button) { min-height: 78px; }
  .message-hub-hero { margin-right: -2px; margin-left: -2px; }
  .message-hub-mark { display: none; }
  .message-shell .safety-banner { align-items: start; }
  .conversation-list > a { min-height: 88px; }
  .chat-panel { min-height: calc(100dvh - 210px); border-radius: 20px; }
  .chat-panel > header { grid-template-columns: 48px minmax(0, 1fr); min-height: 76px; }
  .chat-listing-link { grid-column: 2; max-width: 100%; min-height: 48px; justify-content: flex-start; padding: 0; overflow: hidden; border: 0; background: transparent; text-overflow: ellipsis; white-space: nowrap; }
  .message-stream { min-height: 330px; padding: 16px 13px; }
  .message-stream article { max-width: 88%; }
  .chat-form { grid-template-columns: 1fr; }
  .chat-form > button { min-height: 52px; }
  .ad-package-section .section-heading { align-items: flex-start; }
  .ad-package-grid { grid-template-columns: 1fr; }
  .ad-package-card:last-child { grid-column: auto; }
  .ad-package-card { min-height: 315px; padding: 22px; }
  .business-profile-page { padding: 28px 0 60px; }
  .business-status-panel,
  .business-profile-form { padding: 18px; border-radius: 19px; }
  .business-profile-link { grid-template-columns: 42px minmax(0, 1fr); padding: 14px; }
  .business-profile-link > span { width: 42px; height: 42px; }
  .business-profile-link > strong { display: none; }
  .business-profile-form > button { width: 100%; }
  .admin-business-disclosure { align-items: start; }
  .business-review-card { padding: 14px; }
  .business-review-lane { padding: 12px; }
  .business-review-lane form { grid-template-columns: 1fr; }
  .business-review-lane form button { grid-column: 1; }
  .ai-writer-action,
  .seller-price-action { align-items: stretch; flex-direction: column; }
  .ai-writer-action button,
  .seller-price-action button { width: 100%; }
  .seller-price-range { grid-template-columns: 1fr; }
  .condition-picker > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .condition-picker label:last-child { grid-column: 1 / -1; }
}

@media (max-width: 390px) {
  body.market-body .hero-copy p { padding-right: 0; }
  body.market-body .free-seal,
  html[data-theme-effective="dark"] body.market-body .free-seal {
    position: relative;
    top: auto;
    right: auto;
    width: max-content;
    max-width: 100%;
    height: auto;
    min-height: 48px;
    margin-top: 14px;
    padding: 9px 13px;
    flex-direction: row;
    gap: 7px;
    transform: none;
    border-radius: 14px;
  }
  body.market-body .free-seal b { font-size: 17px; letter-spacing: -.4px; }
  body.market-body .free-seal span { margin-top: 0; font-size: 8px; }
  body.market-body .hero-search { margin-top: 18px; }
  .member-banner { grid-template-columns: 42px minmax(0, 1fr); padding: 15px; }
  .member-banner-mark { width: 42px; height: 42px; border-radius: 14px 14px 14px 5px; }
  .member-banner h2 { font-size: 18px; }
  .message-hub-hero { padding: 22px 18px; }
  .message-hub-hero h1 { font-size: 30px; }
  .share-network-grid :is(a, button) { min-height: 72px; font-size: 10px; }
  .condition-picker > div { grid-template-columns: 1fr; }
  .condition-picker label:last-child { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .condition-picker label:hover { transform: none; }
}