/* La / Reverie: mint and violet glass, compact real listings, shared control tokens.
   Structure, touch overlays, form hooks and the native-shell contract stay in the base styles. */
:root {
  --brand: #007d70;
  --brand-dark: #00665c;
  --brand-soft: #e8f8f1;
  --accent: #007d70;
  --accent-dark: #00665c;
  --ink: #123b37;
  --muted: #60736e;
  --label: #48635a;
  --bg: #f5f8f6;
  --soft: #edf2ef;
  --soft-hover: #e4ede7;
  --line: #dee9e3;
  --line-strong: #bdcfc5;
  --surface: #fff;
  --raised: #fff;
  --glass: rgba(255, 255, 255, .94);
  --tile-blue: #f2eafc;
  --tile-green: #e8f8f1;
  --tile-red: #f5eefc;
  --tile-yellow: #effaf3;
  --mine: #e8f8f1;
  --unread: #f2eafc;
  --info-soft: #f2eafc;
  --info-ink: #7541b5;
  --drop-soft: #f2eafc;
  --drop-ink: #7541b5;
  --ok-soft: #e8f8f1;
  --ok-ink: #00665c;
  --spectrum: linear-gradient(125deg, #fff, #a4f3c7 25%, #fff 50%, #c69cfc 80%, #fff);
  --action-fill: linear-gradient(120deg, var(--surface), var(--tile-green) 60%, var(--tile-blue));
  --action-rim: linear-gradient(130deg, #9a75fc, #e2c1fd 35%, #c69cfc 68%, #9a75fc);
  --action-shadow: 0 3px 14px #01627209;
  --shadow: 0 8px 28px #0162720b;
  --wrap: 1320px;
}
body.kinetic { background: radial-gradient(ellipse at 0 35%, #a4f3c71c, transparent 48%), radial-gradient(ellipse at 100% 55%, #c69cfc1f, transparent 54%), var(--bg); }
.kinetic .page, .kinetic .page > *, .kinetic .discovery > *, .kinetic .card-body { min-width: 0; }
.kinetic :is(.search-layout, .results, .filters, .sortbar, .sort-group) { min-width: 0; }
.kinetic .sort-group { max-width: 100%; }
.kinetic .site-header { background: transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.kinetic .topbar { border: 0; }
.kinetic .mainbar { width: calc(100% - 24px); height: auto; min-height: 66px; padding: 10px 18px; margin: 4px auto 12px; border: 1px solid var(--line); border-radius: 30px; background: var(--glass); box-shadow: var(--shadow); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); }
.kinetic .site-header .logo img { order: 0; }
.kinetic .logo { letter-spacing: -.045em; }
.kinetic .logo img { border-radius: 11px; }
.kinetic .searchbar, .kinetic .app-home-search { border-radius: 999px; background: var(--action-fill) padding-box, var(--spectrum) border-box; }
.search-mark { width: 24px; height: 24px; flex: 0 0 auto; border-radius: 7px; object-fit: contain; }
.kinetic .message-icon { fill: currentColor; stroke: none; }
.kinetic .message-icon path { stroke: none; }
.kinetic .badge, .kinetic .dialog .badge { background: #c69cfc; color: #123b37; border-color: transparent; font-weight: 750; }
.kinetic .btn, .kinetic .btn:hover, .kinetic .pill, .kinetic .pill:hover, .kinetic .chat-attach { box-shadow: var(--action-shadow); }
.kinetic .btn, html[data-app] .kinetic .btn { min-width: 0; max-width: 100%; white-space: normal; height: auto; min-height: 44px; }
.kinetic .btn-primary:hover, .kinetic .btn-accent:hover { background: var(--action-fill) padding-box, var(--action-rim) border-box; }
.kinetic .btn-oauth-apple, .kinetic .btn-oauth-apple:hover { background: #000; color: #fff; border-color: #000; }
.kinetic .category-pill, .kinetic .subcats .pill { background: var(--soft); }
.kinetic .category-pill.on, .kinetic .category-pill.on:hover { background: var(--brand-soft); border-color: var(--line); color: var(--brand-dark); box-shadow: none; }
.kinetic .discovery { display: block; margin-bottom: 12px; }
.kinetic .discovery-heading { min-height: 0; margin-bottom: 7px; }
.kinetic .discovery-heading h1 { font-size: 32px; line-height: 1.15; font-weight: 550; white-space: normal; overflow-wrap: anywhere; }
.discovery-note { margin: 0 0 13px; font-size: 13px; color: var(--muted); }
.kinetic .category-pills { gap: 7px; }
.kinetic .category-pill { min-width: 0; min-height: 33px; padding: 6px 13px; }
.kinetic .home-catalog { margin: 5px 0 0; }
.kinetic .home-catalog > summary { min-height: 28px; }
.kinetic .home-catalog-grid { top: 100%; }
.kinetic .section-head { margin-top: 18px; margin-bottom: 11px; }
.kinetic .section-head h2 { font-size: 18px; font-weight: 650; }
.kinetic .card { --card-tint: var(--tile-green); border-radius: 23px; background: linear-gradient(135deg, var(--surface), var(--card-tint)) padding-box, var(--spectrum) border-box; box-shadow: 0 5px 22px #01627207; }
.kinetic .card-tone-1, .kinetic .card-tone-3 { --card-tint: var(--tile-blue); }
.kinetic .card-tone-2 { --card-tint: var(--tile-green); }
.kinetic .card-photo { border-radius: 17px; }
.kinetic .card-price { color: var(--ink); }
.kinetic .card .fav { box-shadow: 0 2px 8px #01627214; }
.kinetic .fav.on { color: var(--brand-dark); }
.kinetic .fresh-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-flow: dense; align-items: stretch; gap: 13px; }
.kinetic .fresh-grid .card-photo { height: clamp(108px, 14svh, 142px); aspect-ratio: auto; }
.kinetic .fresh-grid .card-body { padding: 8px 9px 7px; }
.kinetic .fresh-grid .card-price { margin-top: 3px; }
.kinetic .fresh-grid .card-tags { margin: 3px 0; }
.kinetic .fresh-grid .card-meta { font-size: 10px; }
.kinetic .fresh-grid .card-approx { font-size: 10px; }
.kinetic .chat { background: var(--surface); }
.kinetic .chat-log { background: linear-gradient(145deg, var(--bg), var(--tile-blue)); }
.kinetic .mine .msg-body { background: linear-gradient(120deg, var(--tile-green), var(--surface)) padding-box, var(--spectrum) border-box; }
.kinetic .dialog.unread { background: linear-gradient(110deg, var(--surface), var(--tile-blue)); }
.kinetic .dialog-row { background: var(--tile-green); }
.kinetic .tabbar .tab-brand-icon { width: 28px; height: 28px; object-fit: contain; border-radius: 8px; }
.kinetic .tabbar .tab-post-icon { width: 38px; height: 38px; margin-top: -6px; margin-bottom: -4px; }
.kinetic .tabbar .tab-add { color: var(--brand-dark) !important; }
.kinetic .tabbar a { min-width: 0; }
@media (min-width: 1101px) {
  .kinetic .fresh-grid > .card:first-child { grid-column: span 2; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 4px; }
  .kinetic .fresh-grid > .card:first-child .card-photo { height: clamp(185px, 24svh, 222px); min-height: 0; }
  .kinetic .fresh-grid > .card:first-child .card-body { display: flex; flex-direction: column; justify-content: center; padding: 25px 12px 14px; }
  .kinetic .fresh-grid > .card:nth-child(4):nth-last-child(2), .kinetic .fresh-grid > .card:nth-child(5):last-child { grid-column: span 2; }
}
@media (min-width: 641px) and (max-width: 1100px) {
  .kinetic .fresh-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .kinetic .search-layout { grid-template-columns: minmax(0, 1fr); }
  .kinetic .mainbar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; padding: 10px; border-radius: 24px; }
  .kinetic .mainbar .logo { grid-area: 1 / 1; min-width: 0; font-size: 22px; gap: 5px; }
  .kinetic .mainbar .logo img { width: 32px; height: 32px; }
  .kinetic .usernav { grid-area: 1 / 2; justify-self: end; min-width: 0; max-width: 100%; gap: 4px; margin: 0; flex-wrap: wrap; justify-content: flex-end; }
  .kinetic .usernav .avatar-link { margin: 0; }
  .kinetic .mainbar .header-city { grid-area: 2 / 1; min-width: 0; max-width: 100%; margin: 0; }
  .kinetic .header-city label { width: 100%; min-width: 0; }
  .kinetic .header-city select { width: 100%; min-width: 0; max-width: 100%; }
  .kinetic .mainbar .searchbar { grid-area: 2 / 2; width: 100%; min-width: 0; height: 40px; }
  .kinetic .mainbar .search-submit { width: 28px; }
  .kinetic .mainbar .searchbar input[type="search"] { font-size: 12px; }
  .kinetic .header-languages a { min-width: 23px; }
  .kinetic .tabbar { left: 8px; right: 8px; bottom: calc(6px + env(safe-area-inset-bottom)); padding: 4px 2px; border: 1px solid var(--line); border-radius: 30px; background: var(--glass); box-shadow: var(--shadow); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); }
  .kinetic .tabbar a { padding: 5px 1px 3px; border-radius: 26px; font-size: 10px; overflow-wrap: anywhere; }
  .kinetic .tabbar a.on { background: var(--brand-soft); color: var(--brand-dark); }
  .kinetic .tabbar .tab-add.on { background: transparent; }
}
@media (max-width: 640px) {
  .kinetic .page { padding-top: 12px; }
  .kinetic .discovery-heading, html[data-app] .discovery-heading { gap: 7px; margin-bottom: 9px; }
  .kinetic .discovery-heading h1 { font-size: 25px; line-height: 1.2; }
  .discovery-note { display: none; }
  .kinetic .category-pills { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
  .kinetic .category-pill { padding: 5px 3px; min-height: 34px; font-size: 10px; line-height: 1.2; overflow-wrap: anywhere; white-space: normal; }
  .kinetic .home-catalog { margin-top: 2px; }
  .kinetic .home-catalog > summary { font-size: 10px; min-height: 24px; }
  .kinetic .app-home-brand { margin-bottom: 9px; }
  .kinetic .app-home-brand .logo { font-size: 25px; }
  .kinetic .app-home-brand .logo img { width: 36px; height: 36px; }
  .kinetic .app-home-search { margin-bottom: 13px; min-height: 44px; gap: 6px; padding-left: 8px; }
  .kinetic .app-home-search input[type="search"] { font-size: 13px; padding-left: 2px; padding-right: 2px; }
  .kinetic .app-home-search .btn { padding: 7px 12px; min-height: 34px; font-size: 12px; }
  .kinetic .section-head { margin-top: 13px; margin-bottom: 9px; }
  .kinetic .section-head h2 { font-size: 16px; }
  .kinetic .fresh-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; align-items: start; }
  .kinetic .fresh-grid .card { padding: 4px; border-radius: 19px; }
  .kinetic .fresh-grid .card-photo { height: clamp(90px, 14svh, 118px); border-radius: 14px; }
  .kinetic .fresh-grid .card:nth-child(4n + 2) .card-photo { height: clamp(96px, 15svh, 126px); }
  .kinetic .fresh-grid .card-body { padding: 6px 5px; }
  .kinetic .fresh-grid .card-title { font-size: 12px; }
  .kinetic .fresh-grid .card-price { font-size: 15px; line-height: 1.25; }
  .kinetic .fresh-grid .card-meta, .kinetic .fresh-grid .card-approx { font-size: 10px; line-height: 1.3; }
  .kinetic .fresh-grid .card-approx, .kinetic .fresh-grid .card-meta + .card-meta { display: none; }
  .kinetic .fresh-grid .card-tags { margin: 2px 0; }
  .kinetic .fresh-grid .tag { font-size: 9px; padding: 1px 4px; }
  .kinetic .fresh-grid .card .fav { width: 30px; height: 30px; top: 9px; right: 9px; }
  .kinetic .form-card, .kinetic .auth-card { max-width: 100%; }
  .kinetic .pills, .kinetic .subcats, .kinetic .form-actions { min-width: 0; }
  .kinetic .pill { max-width: 100%; white-space: normal; }
  .kinetic .chat-head, .kinetic .chat-form, .kinetic .msg { min-width: 0; }
  .kinetic .price-input { grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); }
}
@media (prefers-color-scheme: dark) {
  :root { --brand: #a4f3c7; --brand-dark: #a4f3c7; --brand-soft: #203e34; --accent: #a4f3c7; --accent-dark: #a4f3c7; --ink: #e9f5ed; --muted: #aec4b9; --label: #c5d8cd; --bg: #111c1a; --soft: #202e29; --soft-hover: #2b3d34; --line: #344c40; --line-strong: #648272; --surface: #1b2a24; --raised: #2b3d34; --glass: rgba(27, 42, 36, .95); --tile-blue: #332943; --tile-green: #203e34; --tile-red: #30283e; --tile-yellow: #253d31; --mine: #203e34; --unread: #332943; --spectrum: linear-gradient(125deg, #648272, #345a46 32%, #1b2a24 52%, #705993 82%, #344c40); --shadow: 0 8px 28px #0003; }
  body.kinetic { background: radial-gradient(ellipse at 0 35%, #a4f3c708, transparent 48%), radial-gradient(ellipse at 100% 55%, #c69cfc0c, transparent 54%), var(--bg); }
  :root { --info-soft: #332943; --info-ink: #c69cfc; --drop-soft: #332943; --drop-ink: #c69cfc; --ok-soft: #203e34; --ok-ink: #a4f3c7; }
  .kinetic .btn-oauth-apple, .kinetic .btn-oauth-apple:hover { background: #fff; color: #000; border-color: #fff; }
}
@media (prefers-contrast: more) { :root { --muted: #405e52; --line: #8aa898; --brand: #00665c; } .kinetic .card { border-color: var(--line); } }
@media (prefers-contrast: more) and (prefers-color-scheme: dark) { :root { --muted: #d4e6da; --line: #8aa898; --brand: #a4f3c7; } }
@media (prefers-reduced-transparency: reduce) { .kinetic .mainbar, .kinetic .tabbar { background: var(--surface); backdrop-filter: none; -webkit-backdrop-filter: none; } }
