/* OKNO — Desktop-collage Web-core */
@import url("https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,500;0,9..144,600;1,9..144,500&family=Manrope:wght@400;500;600;700&display=swap");

:root {
  --ink: #2A2426;
  --ink-soft: #4A4143;
  --muted: #6F6567;
  --line: #D9CFD0;
  --line-soft: #E8E0E1;
  --line-strong: #2A2426;
  --bg: #F3ECEA;
  --bg-2: #FAF6F5;
  --paper: #FFFFFF;
  --paper-soft: #FBF8F7;
  --powder: #EED9DA;
  --accent: #9E5B63;
  --accent-hot: #8F4E56;
  --accent-deep: #6F3C43;
  --accent-soft: #F3E4E5;
  --cutout: 0 10px 28px rgba(42, 36, 38, 0.08);
  --cutout-hover: 0 14px 36px rgba(42, 36, 38, 0.12);
  --fuchsia-glow: rgba(158, 91, 99, 0.12);
  --fuchsia-shadow: 0 8px 20px rgba(42, 36, 38, 0.1);
  --radius: 16px;
  --radius-sm: 10px;
  --radius-pill: 999px;
  --dock: 4.4rem;
  --font-mono: "Manrope", "Segoe UI", sans-serif;
  --font: "Manrope", "Segoe UI", sans-serif;
  --font-display: "Fraunces", "Times New Roman", serif;
  --max: 1120px;
  --paper-tex: none;
  --gingham: none;
  --gingham-size: auto;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  font-family: var(--font);
  color: var(--ink);
  letter-spacing: 0.01em;
  background-color: #F4EFED;
  background-image:
    radial-gradient(ellipse 80% 50% at 10% -10%, rgba(238, 217, 218, 0.7), transparent 55%),
    radial-gradient(ellipse 70% 45% at 95% 5%, rgba(232, 220, 214, 0.55), transparent 50%),
    linear-gradient(180deg, #F7F2F0 0%, #F1EAE8 100%);
  background-attachment: fixed;
  line-height: 1.55;
  padding-bottom: calc(var(--dock) + 14px);
  position: relative;
  overflow-x: hidden;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
body::before,
body::after { display: none; }
.sky-blobs,
.sparkle-layer { display: none !important; }

:focus-visible {
  outline: 2px solid var(--accent-hot);
  outline-offset: 2px;
}

a { color: inherit; }
img { max-width: 100%; height: auto; display: block; }
/* Жёсткие рамки для медиа — чтобы фото не раздувало вёрстку */
.win-screen img,
.card-media img,
.hero-photo img,
.desk-hero-media img,
.hot-pill img,
.chat-ava img,
.chat-head img,
.chat-listing img,
.vk-avatar,
.tmblr-media img,
.cat-ico,
.seller-chip img,
.ticket .qr {
  max-width: 100%;
  object-fit: cover;
}
button, input, select, textarea { font: inherit; color: inherit; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.muted, .hint { color: var(--muted); font-size: .92rem; }
.empty { color: var(--muted); padding: 1.2rem 0; text-align: center; }

.shell-top, .command-bar, .app-hub, .main, .flash, .dock {
  position: relative;
  z-index: 1;
}

h1, h2, h3, .display, .board-title, .logo-word, .vk-name {
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--ink);
}
h1, h2, h3 { margin: 0 0 .5rem; }
h1 { font-size: clamp(1.85rem, 4vw, 2.6rem); font-style: italic; }
h2 { font-size: 1.45rem; font-style: italic; }
h3 { font-size: 1.15rem; }
.display em, .board-title em {
  font-style: italic;
  font-weight: 400;
  text-decoration: underline;
  text-decoration-style: wavy;
  text-underline-offset: .18em;
  text-decoration-thickness: 1px;
}
h1 em, h2 em {
  font-style: italic;
  text-decoration: none;
}

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
  min-height: 44px; padding: .55rem 1.2rem;
  border: 1px solid var(--line); border-radius: 12px;
  background: var(--paper); color: var(--ink);
  text-decoration: none; cursor: pointer;
  font-weight: 600; font-family: var(--font);
  letter-spacing: 0.01em; text-transform: none; font-size: .92rem;
  box-shadow: var(--cutout);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}
.btn::before { display: none; }
.btn:hover { transform: translateY(-1px); box-shadow: var(--cutout-hover); border-color: var(--ink-soft); }
.btn-primary, .btn-drop, .btn-buy {
  background: var(--ink);
  color: #FFFFFF;
  border-style: solid;
  border-width: 1px;
  border-color: var(--ink);
  box-shadow: var(--cutout);
}
.btn-primary:hover, .btn-drop:hover, .btn-buy:hover {
  background: var(--accent-deep);
  color: #fff;
  border-color: var(--accent-deep);
  box-shadow: var(--cutout-hover);
}
.btn-ghost {
  background: transparent;
  border-style: solid;
  border-color: var(--line);
  color: var(--ink-soft);
}
.btn-wide { width: 100%; }
.btn-sm { min-height: 36px; padding: .28rem .75rem; font-size: .82rem; }
.cta-xl { min-height: 52px; font-size: 1rem; letter-spacing: 0.01em; }
.icon-btn {
  width: 44px; height: 44px; display: grid; place-items: center;
  border: 1px solid var(--line); border-radius: 12px;
  background: var(--paper); cursor: pointer; color: var(--ink);
  box-shadow: none;
  transition: transform .15s ease, background .15s, border-color .15s;
}
.icon-btn:hover { transform: translateY(-1px); border-color: var(--ink-soft); }
.icon-btn.is-fav { background: var(--accent-soft); border-style: solid; }
.icon-btn svg { width: 18px; height: 18px; stroke-width: 2; }
.icon-btn img { width: 16px; height: 14px; display: block; }

.main {
  max-width: var(--max); margin: 0 auto; padding: 1rem 1.1rem 3.5rem;
  background: transparent;
  border-radius: 0;
}
.flash {
  max-width: var(--max); margin: .65rem auto; padding: .75rem 1.15rem;
  border: 1px solid var(--line); background: var(--paper);
  border-radius: var(--radius-sm); box-shadow: var(--cutout);
}
.flash.ok { background: var(--accent-soft); border-color: #E0C4C6; }
.flash.err { background: #fff; border-color: #D9A0A4; }

/* —— Top hub —— */
.app-hub {
  position: sticky; top: 0; z-index: 60;
  background: rgba(255, 255, 255, 0.92);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 rgba(255,255,255,.6);
}
.app-hub-inner {
  max-width: 1200px; margin: 0 auto;
  padding: .55rem 1rem .65rem;
  display: grid; gap: .55rem;
}
.hub-row-top {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  gap: .55rem .55rem;
  align-items: center;
}
.hub-row-top:not(:has(.mode-switch)) {
  grid-template-columns: auto minmax(0, 1fr) auto;
}
.hub-brand {
  display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; min-width: 0;
}
.hub-tray {
  display: flex; align-items: center; gap: .3rem; flex-wrap: wrap; justify-content: flex-end;
}
.hub-cta-group {
  display: flex; align-items: center; gap: .35rem; flex-wrap: wrap; justify-content: flex-end;
}
.hub-mode {
  display: none;
}
.mode-switch {
  position: relative;
  flex: none;
  z-index: 90;
  isolation: isolate;
}
.mode-switch-btn {
  display: inline-flex; align-items: center; gap: .3rem;
  min-height: 34px; padding: 0 .7rem 0 .85rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-pill);
  background: var(--paper-soft);
  color: var(--ink);
  font: inherit; font-weight: 650; font-size: .82rem;
  cursor: pointer;
}
.mode-switch-btn:hover { border-color: var(--accent); }
.mode-switch-caret { opacity: .7; transition: transform .15s ease; }
.mode-switch.is-open .mode-switch-caret { transform: rotate(180deg); }
.mode-switch-menu {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 100;
  min-width: max(100%, 11rem);
  padding: .35rem;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  box-shadow: var(--cutout);
}
.mode-switch-menu[hidden] { display: none !important; }
.mode-switch-menu form { margin: 0; }
.mode-switch-option {
  display: block; width: 100%;
  border: 0; background: transparent;
  text-align: left; cursor: pointer;
  padding: .55rem .7rem;
  border-radius: 8px;
  font: inherit; font-weight: 600; font-size: .86rem;
  color: var(--ink); white-space: nowrap;
}
.mode-switch-option:hover {
  background: var(--accent-soft);
}
.mode-switch-option.is-on {
  background: var(--powder);
  cursor: default;
}
.mode-switch-option:disabled {
  opacity: 1;
}
.hub-row-seek.hub-search {
  display: grid; grid-template-columns: 1.5fr .7fr auto;
  gap: .4rem; align-items: center;
  background: #fff; border: 1.5px dashed var(--ink); border-radius: 2px 14px 4px 10px;
  padding: .3rem .35rem;
  box-shadow: var(--cutout);
  width: 100%;
}
.hub-search-spacer { display: none; }
.hub-search .seek-q, .hub-search .command-city {
  display: flex; align-items: center; gap: .4rem;
  min-height: 40px; padding: 0 .75rem;
  border: 0; background: transparent; box-shadow: none; border-radius: 4px;
}
.hub-search input {
  border: 0; outline: none; background: transparent; width: 100%;
  font-weight: 500; letter-spacing: 0.04em; color: var(--ink); min-width: 0;
  font-family: var(--font-mono);
}
.hub-search svg { width: 16px; height: 16px; color: var(--accent); flex: none; }
.hub-search-go {
  min-height: 40px !important; padding: 0 1rem !important;
  border-radius: 3px 12px 4px 10px !important;
}
.hub-pill {
  display: inline-flex; align-items: center; gap: .35rem;
  min-height: 40px; padding: 0 .7rem;
  border: 1.5px dashed var(--ink); border-radius: 4px 14px;
  background: #fff; text-decoration: none; font-weight: 600; font-size: .68rem;
  letter-spacing: 0.06em; text-transform: uppercase;
  font-family: var(--font-mono);
  color: var(--ink-soft); box-shadow: 1px 1px 0 var(--ink);
}
.hub-pill svg { width: 16px; height: 16px; color: var(--accent); }
.hub-pill i {
  min-width: 1.1rem; height: 1.1rem; padding: 0 .25rem;
  border-radius: 50%; background: var(--powder); color: var(--ink);
  border: 1px solid var(--ink);
  font-size: .7rem; font-style: normal; display: inline-grid; place-items: center;
}
body.is-home .hub-row-seek { display: none; }
@media (max-width: 860px) {
  .hub-row-top {
    grid-template-columns: auto auto 1fr;
  }
  .hub-row-top:not(:has(.mode-switch)) {
    grid-template-columns: auto 1fr;
  }
  .hub-cta-group { grid-column: 1 / -1; justify-content: stretch; }
  .hub-cta-group .hub-cta-primary { flex: 1; }
  .hub-pill-desk span { display: none; }
  .hub-row-seek.hub-search { grid-template-columns: 1fr auto; }
  .hub-search-city { display: none; }
  .hub-tray { justify-content: flex-end; }
}
@media (max-width: 520px) {
  .shell-user { max-width: 9ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mode-switch-btn span { max-width: 10ch; overflow: hidden; text-overflow: ellipsis; }
}

/* Shell legacy bits still used inside hub */
.shell-top {
  max-width: var(--max); margin: 0 auto; padding: .75rem 1.1rem;
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
}
.logo {
  display: inline-flex; align-items: center; gap: .5rem;
  text-decoration: none; font-weight: 500;
}
.logo-mark {
  width: 40px; height: 40px; display: grid; place-items: center;
  border-radius: 3px 12px 4px 10px;
  background: var(--powder);
  border: 2px solid var(--ink);
  box-shadow: var(--cutout);
}
.logo-mark svg { width: 20px; height: 20px; }
.logo-mark svg rect,
.logo-mark svg path { stroke: #4A3738 !important; }
.logo-word {
  font-size: 1.55rem;
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 500;
  color: var(--ink);
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  letter-spacing: 0.04em;
}
.shell-actions { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.shell-ico {
  position: relative; width: 44px; height: 44px; display: grid; place-items: center;
  border: 1.5px dashed var(--ink); border-radius: 3px 12px;
  background: #fff; text-decoration: none; color: var(--accent);
  box-shadow: var(--cutout);
}
.shell-ico svg { width: 18px; height: 18px; stroke-width: 2; }
.shell-ico .dot, .dot {
  display: inline-flex; min-width: 1rem; height: 1rem; padding: 0 .25rem;
  border-radius: 50%; background: var(--powder); color: var(--ink);
  border: 1px solid var(--ink);
  font-size: .65rem; align-items: center; justify-content: center; font-style: normal;
  font-weight: 700;
}
.shell-ico .dot { position: absolute; top: -3px; right: -3px; }
.shell-user {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 .95rem;
  border: 1.5px dashed var(--ink); border-radius: 4px 14px;
  text-decoration: none; background: #fff;
  font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; font-size: .72rem;
  color: var(--ink-soft); box-shadow: var(--cutout);
}

/* Search — pill / tablet */
.command-bar {
  max-width: var(--max); margin: .15rem auto 0; padding: 0 1.1rem;
  display: grid; gap: .55rem;
}
@media (min-width: 720px) {
  .command-bar {
    grid-template-columns: 1.7fr .75fr;
    background: rgba(255, 255, 255, 0.55);
    border: 2px solid var(--line);
    border-radius: var(--radius-pill);
    padding: .45rem .55rem;
    box-shadow: inset 0 2px 8px rgba(74, 55, 56, 0.12), var(--fuchsia-shadow);
    backdrop-filter: blur(10px);
  }
}
.command-bar .seek-q, .command-city, .seek-q {
  display: flex; align-items: center; gap: .55rem;
  min-height: 52px; padding: 0 1.15rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: var(--radius-pill);
  box-shadow: inset 0 3px 10px rgba(74, 55, 56, 0.1);
}
@media (min-width: 720px) {
  .command-bar .seek-q, .command-city {
    border: 0; box-shadow: none; background: transparent; min-height: 46px;
  }
}
.command-bar input, .seek-q input {
  border: 0; outline: none; background: transparent; width: 100%;
  color: var(--ink); font-weight: 600;
}
.command-bar input::placeholder { color: var(--muted); font-weight: 500; }
.command-hint {
  display: none;
  font-size: .7rem; font-weight: 800; color: var(--accent-soft);
  border: 1.5px solid var(--line); border-radius: 8px; padding: .1rem .35rem;
}
@media (min-width: 900px) { .command-hint { display: inline-block; } }
.command-bar svg, .seek-q svg {
  width: 18px; height: 18px; color: var(--accent); flex: none; stroke-width: 2;
}
.command-q, .seek-field { position: relative; }
.seek-suggest {
  position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 120;
  margin: 0; padding: .4rem; list-style: none;
  background: rgba(255, 255, 255, 0.98);
  border: 2px solid var(--line);
  border-radius: var(--radius-sm);
  box-shadow: var(--fuchsia-shadow);
}
.seek-suggest[hidden] { display: none; }
.seek-suggest li {
  display: flex; gap: .5rem; align-items: center;
  padding: .65rem .75rem; cursor: pointer; border-radius: 14px;
  font-weight: 600;
}
.seek-suggest li:hover, .seek-suggest li.is-on { background: #F8EAEA; }
.seek-suggest .sg-ico {
  width: 32px; height: 32px; border: 2px solid var(--line); border-radius: 12px;
  display: grid; place-items: center; color: var(--accent); background: #F8EAEA;
}
.seek-suggest .sg-muted { color: var(--muted); }
.seek-suggest b { color: var(--accent-hot); }

/* Dock */
.dock, .dock-v2 {
  position: fixed; left: .55rem; right: .55rem; bottom: .5rem; z-index: 50;
  display: grid; grid-template-columns: repeat(5, 1fr);
  background: rgba(255, 255, 255, 0.96);
  border: 1.5px dashed var(--ink);
  border-radius: 6px 18px;
  padding: .35rem .25rem calc(.35rem + env(safe-area-inset-bottom));
  box-shadow: var(--cutout);
  backdrop-filter: blur(8px);
}
.dock a, .dock-v2 a {
  position: relative;
  display: flex; flex-direction: column; align-items: center; gap: .12rem;
  text-decoration: none; font-size: .58rem; color: var(--muted);
  padding: .35rem 0; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
  font-family: var(--font-mono);
  border-radius: 4px 10px;
}
.dock svg, .dock-v2 svg { width: 18px; height: 18px; stroke-width: 2; }
.dock .is-on, .dock-v2 .is-on {
  color: var(--ink); background: var(--powder);
}
.dock-fab {
  color: var(--ink) !important;
  transform: translateY(-8px);
}
.dock-fab-mark {
  width: 36px; height: 36px; display: grid; place-items: center;
  border: 2px solid var(--ink); border-radius: 50%;
  background: #4A3738; color: #fff;
  font-size: 1.25rem; font-weight: 700; line-height: 1;
  box-shadow: var(--cutout);
}
.dock-fab.is-on .dock-fab-mark,
.dock-fab:hover .dock-fab-mark { background: var(--powder); color: var(--ink); }
.dock-dot {
  position: absolute; top: 2px; right: calc(50% - 18px);
  min-width: .9rem; height: .9rem; padding: 0 .2rem;
  border-radius: 50%; background: var(--ink); color: #fff;
  font-size: .58rem; font-style: normal; display: inline-grid; place-items: center;
}
@media (min-width: 760px) {
  body { padding-bottom: 0; }
  .dock, .dock-v2 { display: none; }
}

/* Hero */
.desk, .hype-hero, .cafe-hero { margin: 1rem 0 .5rem; }
.desk-seek .desk-window {
  display: grid; gap: .85rem;
  position: relative;
  z-index: 5;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.15rem 1.2rem 1.25rem;
  box-shadow: var(--cutout);
  overflow: visible;
}
.desk-seek-head { display: grid; gap: .2rem; }
.desk-seek-head .display { font-size: clamp(1.7rem, 3.5vw, 2.35rem); margin: 0; }
.desk-seek-form {
  display: grid; gap: .55rem;
  grid-template-columns: 1fr;
}
@media (min-width: 720px) {
  .desk-seek-form {
    grid-template-columns: 1.4fr .7fr auto;
    align-items: stretch;
  }
}
.desk-quick {
  display: flex; flex-wrap: wrap; gap: .4rem;
}
.chip-action {
  border-style: dashed !important;
  box-shadow: 1px 1px 0 var(--ink);
}
.chip-hot {
  background: var(--powder) !important;
  border-style: solid !important;
}
.desk-lede { margin: 0; font-size: 1rem; }
.hype-hero-bg { display: none !important; }
.hype-kicker, .eyebrow {
  display: inline-flex; align-items: center; gap: .35rem;
  margin: 0; font-size: .72rem; color: var(--muted);
  text-transform: uppercase; letter-spacing: .12em; font-weight: 600;
  font-family: var(--font-mono);
}
.eyebrow::before { display: none; }
.display {
  margin: 0;
  font-size: clamp(2.1rem, 5vw, 3.1rem);
  line-height: 1.05; font-weight: 500; font-style: italic;
}
.lede { margin: .5rem 0 0; color: var(--muted); max-width: 36ch; font-size: 1.05rem; letter-spacing: 0.02em; }

.desk-hero-card, .desk-hero-mini {
  display: grid; grid-template-columns: 110px 1fr;
  border: 1.5px dashed var(--ink);
  border-radius: 3px 14px 4px 10px;
  overflow: hidden; text-decoration: none; background: #fff;
  box-shadow: var(--cutout);
  max-width: 420px;
}
.desk-hero-media {
  position: relative; overflow: hidden;
  aspect-ratio: 1; border-right: 1px dashed var(--ink);
  transform: none; margin: 0; border: 0; box-shadow: none;
}
.desk-hero-media img {
  width: 100%; height: 100%; object-fit: cover; max-height: none; aspect-ratio: 1;
}
.desk-hero-meta {
  padding: .7rem .85rem; display: grid; gap: .2rem; align-content: center;
}
.desk-hero-meta strong {
  font-size: 1.1rem; font-family: var(--font-mono); color: var(--ink); letter-spacing: 0.08em;
}
.desk-hero-meta s { color: var(--muted); font-family: var(--font-mono); }
.desk-hero-meta p {
  margin: 0; font-weight: 500; font-family: var(--font-display); font-style: italic;
  color: var(--ink); transform: rotate(-1deg); transform-origin: left;
}
.desk-hero-where { font-size: .72rem; color: var(--muted); letter-spacing: 0.04em; font-family: var(--font-mono); }

.section-bow {
  display: flex; justify-content: center; margin: .15rem 0 .85rem;
  opacity: .85;
}
.section-bow img { width: 40px; height: auto; }
.board-deco { display: none; }

.filters-sticky {
  position: sticky; top: 4.2rem; z-index: 40;
  background: var(--paper) !important;
}
.filters, .filters-v2 {
  box-shadow: var(--cutout);
}
.filters select, .filters a.chip, .chip {
  font-family: var(--font-mono);
  letter-spacing: 0.06em;
  text-transform: none;
  font-size: .78rem;
}

.empty-postcard {
  max-width: 360px; margin: 1.5rem auto; padding: 1.5rem 1.25rem;
  border: 1.5px dashed var(--ink); border-radius: 4px 18px 6px 14px;
  background: linear-gradient(rgba(255,255,255,.9), rgba(255,255,255,.9)), var(--paper-tex);
  box-shadow: var(--cutout);
  text-align: center; display: grid; gap: .55rem; justify-items: center;
}
.empty-title {
  margin: 0; font-family: var(--font-display); font-style: italic;
  font-size: 1.45rem; color: var(--ink);
}
.empty-actions { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; margin-top: .35rem; }

.prose p, .form label span, .lede, .vk-about-line, .chat-bubble p {
  font-family: var(--font);
  letter-spacing: 0.02em;
}
.form input, .form select, .form textarea,
.hub-search input, .card-price, .clock-digits {
  font-family: var(--font-mono);
}
.hub-mode-btn, .hub-pill, .shell-user, .cat {
  font-family: var(--font-mono);
}

/* hot-urg styled in Hot rail block */

@media (max-width: 759px) {
  .win:hover, .card:hover,
  .desk-hero-card:hover, .btn:hover, .icon-btn:hover {
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .win, .card, .btn, .icon-btn, .card-title, .stamp-urg, .badge-disc {
    transition: none !important;
    animation: none !important;
    transform: none !important;
  }
  .win:hover, .card:hover { transform: none !important; }
}

.kicker {
  display: flex; align-items: end; justify-content: space-between; gap: 1rem;
  margin: .6rem 0 1.1rem;
}
.kicker p { margin: .3rem 0 0; color: var(--muted); }
.kicker-actions { display: flex; flex-wrap: wrap; gap: .4rem; }

/* Hot rail */
.hot-rail {
  position: relative;
  margin: 0 0 1.6rem;
  padding: 1.05rem 1rem 1.15rem;
  background: color-mix(in srgb, var(--powder) 42%, var(--paper));
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: visible;
}
.hot-rail::before,
.hot-rail::after {
  content: "";
  position: absolute;
  left: 12px; right: 12px;
  height: 10px;
  pointer-events: none;
  opacity: .55;
  background:
    radial-gradient(circle at 8px 0, transparent 6px, color-mix(in srgb, var(--accent) 35%, var(--line)) 6.5px) 0 0 / 16px 10px repeat-x;
}
.hot-rail::before { top: 7px; }
.hot-rail::after {
  bottom: 7px;
  transform: scaleY(-1);
}
.hot-rail-head {
  display: flex; justify-content: space-between; gap: .65rem;
  margin: .35rem 0 .85rem; align-items: end; position: relative; z-index: 1;
}
.hot-rail-head h2 {
  margin: 0;
  font-size: clamp(1.35rem, 3vw, 1.7rem);
  font-style: italic; font-weight: 500;
  color: var(--ink);
}
.hot-rail-head em {
  font-style: italic;
  color: var(--accent-deep);
  text-decoration: underline;
  text-decoration-style: wavy;
  text-underline-offset: .18em;
  text-decoration-thickness: 1px;
}
.hot-rail-sub {
  margin: .25rem 0 0;
  color: var(--muted);
  font-size: .86rem;
  font-weight: 500;
}
.hot-rail-track {
  display: flex; gap: .75rem; overflow-x: auto;
  padding: .15rem .05rem .35rem;
  position: relative; z-index: 1;
  scrollbar-width: thin;
}
.hot-pill {
  flex: 0 0 248px;
  display: grid; grid-template-columns: 72px 1fr; gap: .65rem;
  align-items: center; text-decoration: none;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: .55rem .6rem;
  box-shadow: var(--cutout);
  color: var(--ink);
  transition: transform .2s ease, box-shadow .2s ease;
}
.hot-pill:hover { transform: translateY(-3px); }
.hot-pill-photo {
  display: block; width: 72px; height: 72px;
  border-radius: 50%; overflow: hidden; flex: none;
  border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--powder) 70%, transparent);
  background: var(--powder);
}
.hot-pill-photo img,
.hot-pill img {
  width: 100% !important; height: 100% !important;
  max-width: none !important; max-height: none !important;
  object-fit: cover; display: block;
}
.hot-pill-body { min-width: 0; display: grid; gap: .12rem; }
.hot-pill-price { display: flex; align-items: baseline; gap: .35rem; flex-wrap: wrap; }
.hot-pill strong,
.hot-pill-price strong {
  font-size: 1.05rem; color: var(--ink);
  font-family: var(--font-display); font-weight: 600; font-style: italic;
}
.hot-pill-disc {
  font-size: .72rem; font-weight: 700;
  color: var(--accent-deep);
  background: var(--accent-soft);
  padding: .1rem .4rem; border-radius: 999px;
}
.hot-pill-title {
  font-size: .88rem; font-weight: 600; color: var(--ink-soft);
  line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.hot-urg {
  display: inline-block; margin-top: .2rem; width: fit-content;
  font-size: .68rem; font-weight: 650; letter-spacing: 0.02em;
  text-transform: none; font-family: var(--font);
  padding: .12rem .45rem; border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--line));
  background: var(--accent-soft); color: var(--accent-deep);
}

/* Board */
.board-head {
  display: flex; align-items: end; justify-content: space-between; gap: .75rem; margin: 0 0 .85rem;
}
.board-title { margin: 0; font-size: 1.85rem; font-style: italic; font-weight: 500; }
.board-title em {
  font-style: italic;
  color: var(--ink);
  background: none;
  -webkit-background-clip: initial; background-clip: initial;
}
.board-tools { display: flex; gap: .4rem; }
.board-head::after,
.board::before {
  content: "";
  display: none;
}
.board-deco { display: none !important; }
.board-deco img { display: none; }

.cats, .cats-media {
  display: flex; gap: .5rem; overflow-x: auto; padding: 0 0 1rem;
}
.cat {
  display: inline-flex; align-items: center; gap: .4rem; flex: none;
  text-decoration: none; padding: .45rem .85rem;
  border: 1.5px dashed var(--ink); border-radius: 4px 16px 6px 12px;
  background: var(--paper); font-size: .72rem; font-weight: 600;
  letter-spacing: 0.06em; text-transform: uppercase;
  font-family: var(--font-mono);
  color: var(--ink-soft); box-shadow: var(--cutout);
  transition: transform .15s ease, background .15s;
}
.cat:hover { transform: translate(-1px, -1px); }
.cat-ico {
  width: 22px; height: 22px;
  border-radius: 0; object-fit: contain;
  background: transparent; border: 0;
  color: var(--accent-deep); flex: none;
  display: block;
}
.cat.is-on .cat-ico { color: var(--ink); }
svg.cat-ico { overflow: visible; }
.cat.is-on {
  background: var(--powder);
  color: var(--ink); border-style: solid;
  box-shadow: var(--cutout-hover);
}

.filters, .filters-v2 {
  display: flex; gap: .45rem; overflow-x: auto; flex-wrap: nowrap;
  margin-bottom: 1.25rem; padding: .55rem;
  background: var(--paper);
  border: 1.5px dashed var(--ink);
  border-radius: 2px 18px 4px 12px;
  box-shadow: var(--cutout);
}
.filters select, .filters a.chip, .chip {
  flex: none; min-height: 40px; padding: 0 .9rem;
  border: 1.5px dotted var(--ink); border-radius: 3px 12px;
  background: #fff; text-decoration: none; font-size: .75rem;
  display: inline-flex; align-items: center; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--ink-soft);
  cursor: pointer; box-shadow: 1px 1px 0 var(--ink);
}
.chip.is-on, .filters a.chip.is-on {
  background: var(--powder); border-style: solid; color: var(--ink);
}

/* Window cards — postcard / sticker collage */
.feed, .feed-bento {
  display: grid; grid-template-columns: 1fr; gap: 1.25rem;
}
@media (min-width: 700px) { .feed-bento { grid-template-columns: repeat(2, 1fr); gap: 1.35rem; } }
@media (min-width: 1000px) { .feed-bento { grid-template-columns: repeat(3, 1fr); gap: 1.45rem; } }

.win, .card {
  display: flex; flex-direction: column;
  background-color: var(--paper);
  background-image: linear-gradient(rgba(255,255,255,.88), rgba(255,255,255,.88)), var(--paper-tex);
  background-size: cover;
  border: 1.5px dashed var(--ink);
  border-radius: 4px 18px 6px 14px;
  overflow: hidden;
  box-shadow: var(--cutout);
  transition: transform .18s ease, box-shadow .18s ease;
  position: relative;
}
/* 2 variants only */
.win:nth-child(odd), .card:nth-child(odd) {
  border-radius: 3px 18px 4px 14px;
  border-style: dashed;
}
.win:nth-child(even), .card:nth-child(even) {
  border-radius: 16px 3px 14px 4px;
  border-style: dotted;
}
.win:hover, .card:hover {
  transform: translate(-2px, -2px);
  box-shadow: var(--cutout-hover);
  z-index: 2;
}
.win.is-in, .card.is-in { animation: soft-in .45s ease both; }
@keyframes soft-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

.win-bar { display: none; }

.win-screen, .card-media {
  position: relative; display: block;
  aspect-ratio: 4 / 3;
  height: auto;
  max-height: none;
  margin: .75rem .75rem 0;
  border-radius: 2px 10px 2px 10px;
  overflow: hidden;
  background: var(--powder);
  text-decoration: none;
  border: 1.5px solid var(--ink);
  box-shadow: none;
  transform: none;
}
.win:nth-child(even) .win-screen,
.card:nth-child(even) .card-media {
  transform: none;
  border-radius: 10px 2px 10px 2px;
  margin: .75rem .75rem 0;
}
.win-featured .win-screen {
  aspect-ratio: 4 / 3;
  max-height: none;
  border-radius: 2px 10px;
}
.win-screen > img, .card-media img {
  width: 100%; height: 100%; max-height: none; object-fit: cover;
}
.win-screen-fade { display: none; }

/* Tape on every 6th card photo */
.feed .win:nth-child(6n) .win-screen::after {
  content: "";
  position: absolute; top: -6px; right: 18%;
  width: 52px; height: 18px;
  background: url("/assets/img/stickers/tape-pink.png") center / cover no-repeat;
  transform: rotate(8deg);
  z-index: 3;
  pointer-events: none;
  opacity: .9;
}

/* Stamps */
.badge-disc, .stamp {
  position: absolute; z-index: 2;
  display: grid; place-items: center;
  text-align: center;
  font-family: var(--font-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  box-shadow: var(--cutout);
}
.badge-disc {
  top: .5rem; left: .5rem;
  width: 48px; height: 48px; padding: .15rem;
  border-radius: 50%;
  background: var(--powder);
  color: var(--ink);
  border: 2px solid var(--ink);
  font-size: .65rem;
  transform: rotate(-12deg);
}
.badge-seats, .stamp-seats { display: none; }
.badge-tape {
  position: absolute; top: .55rem; right: 0; z-index: 2;
  padding: .28rem .7rem .28rem .55rem;
  background: url("/assets/img/stickers/tape-pink.png"), var(--powder);
  background-blend-mode: multiply;
  background-size: cover;
  color: var(--ink);
  border: 1px solid var(--ink);
  border-right: 0;
  border-radius: 2px 0 0 2px;
  font-family: var(--font-mono);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  box-shadow: 1px 1px 0 var(--ink);
}
.win-timer { display: none; }
.seller-chip {
  position: absolute; left: .45rem; bottom: .45rem; z-index: 2;
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .2rem .55rem .2rem .2rem; background: #fff;
  border: 1px solid var(--ink); border-radius: 2px 8px;
  font-size: .68rem; font-weight: 600; letter-spacing: 0.04em;
  font-family: var(--font-mono);
  color: var(--ink-soft);
  box-shadow: 1px 1px 0 var(--ink);
  transform: none;
  max-width: calc(100% - 1rem);
}
.win-screen .seller-chip img {
  width: 20px; height: 20px; border-radius: 2px; object-fit: cover; border: 1px solid var(--ink);
}
.seller-chip span {
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.win-body, .card-body {
  padding: .7rem .85rem .35rem;
  display: grid; gap: .4rem; flex: 1;
  align-content: start;
}
.card-price { margin: 0; }
.card-price strong {
  font-size: 1.45rem; font-family: var(--font-mono);
  color: var(--ink); font-weight: 700; letter-spacing: 0.08em;
}
.card-price s {
  color: var(--muted); margin-left: .35rem; font-size: .85rem;
  font-family: var(--font-mono); letter-spacing: 0.04em;
}
.card-left, .stamp-urg {
  font-size: .68rem; color: var(--ink); font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
  font-family: var(--font-mono);
  display: inline-flex; align-self: start; width: fit-content;
  padding: .28rem .55rem;
  border: 1.5px dashed var(--ink);
  border-radius: 2px 10px;
  background: var(--powder);
  transform: rotate(-3deg);
  box-shadow: 1px 1px 0 var(--ink);
  line-height: 1.2;
}
.card-title {
  margin: .05rem 0 0; font-size: 1.2rem; font-weight: 500;
  font-family: var(--font-display); font-style: italic;
  color: var(--ink); transform: rotate(-1deg); transform-origin: left center;
  letter-spacing: 0.01em;
}
.card-title a { text-decoration: none; }
.win-meta, .card-meta {
  display: grid; gap: .15rem; margin: 0;
  color: var(--muted); font-size: .72rem; font-weight: 500;
  letter-spacing: 0.04em; font-family: var(--font-mono);
}
.win-meta span { display: inline-flex; align-items: center; gap: .3rem; }
.win-meta svg { width: 13px; height: 13px; color: var(--accent); stroke-width: 2; flex: none; }
.card-rating, .card-rating-inline { margin: 0; font-size: .72rem; }
.star { color: #C9A8A9; }
.star.on { color: var(--ink); }

.win-foot {
  display: grid; grid-template-columns: 1fr auto; gap: .5rem;
  padding: .55rem .85rem .9rem;
  align-items: center;
  margin-top: auto;
}

/* Clock */
.clock {
  display: inline-flex; align-items: center; gap: .35rem;
  background: rgba(255, 255, 255, 0.95); border: 2px solid var(--line);
  border-radius: var(--radius-pill); padding: .2rem .5rem;
  box-shadow: 0 4px 10px rgba(74, 55, 56, 0.12);
}
.clock-ring { width: 22px; height: 22px; transform: rotate(-90deg); }
.clock-lg .clock-ring { width: 36px; height: 36px; }
.clock-bg { fill: none; stroke: #E8C8C9; stroke-width: 3; }
.clock-fg { fill: none; stroke: var(--accent-hot); stroke-width: 3; stroke-linecap: round; }
.clock-digits { font-size: .78rem; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--ink-soft); }
.clock-lg .clock-digits { font-size: 1.05rem; color: var(--accent-hot); }

/* Listing */
.split { display: grid; gap: 1.25rem; }
@media (min-width: 900px) { .split { grid-template-columns: 1.3fr .7fr; align-items: start; } }
.hero-photo {
  border: 2px solid var(--line); border-radius: var(--radius);
  overflow: hidden; background: #F2D6D7;
  box-shadow: var(--fuchsia-shadow);
  max-height: 420px;
}
.hero-photo img {
  width: 100%; height: auto; max-height: 420px; aspect-ratio: 4/3; object-fit: cover;
}
.prose h2 { margin: 1.1rem 0 .4rem; font-size: 1.15rem; }
.prose p { margin: 0 0 .7rem; color: var(--ink-soft); }
.buy-box {
  background: var(--paper);
  border: 1.5px dashed var(--ink);
  border-radius: 4px 20px 6px 14px;
  padding: 1.2rem; display: grid; gap: .5rem;
  box-shadow: var(--cutout);
  position: sticky; top: .75rem;
}
.buy-box h1 { margin: 0; font-size: 1.65rem; font-style: italic; }
.buy-meta {
  display: flex; align-items: flex-start; gap: .45rem;
  margin: 0; color: var(--ink-soft); line-height: 1.4;
}
.buy-meta svg {
  width: 15px !important; height: 15px !important;
  flex: none; margin-top: .2rem; color: var(--accent);
}
.buy-meta span { min-width: 0; }
.timer-lg {
  display: flex; align-items: center; gap: .5rem;
  margin: .1rem 0;
}
.timer-lg .clock {
  padding: .25rem .55rem;
}
.price-row { display: flex; align-items: baseline; gap: .45rem; flex-wrap: wrap; margin: 0; }
.price-row strong {
  font-size: 1.35rem; color: var(--ink); font-family: var(--font);
  letter-spacing: 0.1em; font-weight: 700;
}
.disc-mark {
  background: var(--powder);
  color: var(--ink); border: 1.5px dashed var(--ink); padding: .2rem .55rem;
  border-radius: 50%; font-size: .72rem; font-weight: 700;
  letter-spacing: 0.06em; transform: rotate(-8deg);
  box-shadow: var(--cutout);
}
.map-embed, #map {
  border: 2px solid var(--line); border-radius: var(--radius);
  background: #F8EAEA; height: 260px; overflow: hidden;
}
.preview-bar {
  display: flex; flex-wrap: wrap; gap: .45rem; align-items: center;
  margin: 0 0 .85rem; padding: .65rem .9rem;
  border: 1px solid var(--line); background: var(--paper);
  border-radius: var(--radius-sm); color: var(--ink);
}
.preview-bar span { color: var(--ink); font-weight: 600; }
.reviews { display: grid; gap: .65rem; margin-top: .85rem; }
.review {
  background: #fff; border: 2px solid var(--line);
  border-radius: var(--radius-sm); padding: .9rem;
  box-shadow: 0 6px 16px rgba(74, 55, 56, 0.1);
}

.form {
  display: grid; gap: .7rem; max-width: 480px;
  background: rgba(255, 255, 255, 0.95);
  border: 2px solid var(--line);
  border-radius: var(--radius);
  padding: 1.2rem;
  box-shadow: var(--fuchsia-shadow);
}
.form.wide { max-width: 720px; }
.form label span {
  display: block; font-weight: 700; margin-bottom: .25rem;
  color: var(--muted); font-size: .85rem;
}
.form input, .form select, .form textarea {
  width: 100%; min-height: 46px; padding: .55rem .9rem;
  border: 2px solid var(--line); border-radius: 16px;
  background: #FFFFFF; color: var(--ink);
  box-shadow: inset 0 2px 6px rgba(74, 55, 56, 0.08);
}
.form input[type="checkbox"],
.form input[type="radio"] {
  width: 1.15rem;
  height: 1.15rem;
  min-width: 1.15rem;
  min-height: 1.15rem;
  margin: .15rem 0 0;
  padding: 0;
  flex: none;
  align-self: flex-start;
  border-radius: 5px;
  border: 1.5px solid var(--ink);
  background: #fff;
  box-shadow: none;
  accent-color: var(--ink);
  cursor: pointer;
}
.form input:focus, .form select:focus, .form textarea:focus {
  outline: none; border-color: var(--accent); background: #fff;
}
.form textarea { min-height: 110px; resize: vertical; }
.form-grid-2 { display: grid; gap: .7rem; }
@media (min-width: 640px) { .form-grid-2 { grid-template-columns: 1fr 1fr; } }
.phone-box, .callcheck-box { display: flex; gap: .45rem; align-items: center; flex-wrap: wrap; }
.phone-prefix, .callcheck-number {
  padding: .5rem .75rem; border: 2px solid var(--line);
  border-radius: 14px; background: #F8EAEA; font-weight: 700;
}

.dash { display: grid; grid-template-columns: repeat(2, 1fr); gap: .65rem; margin: 0 0 1.1rem; }
@media (min-width: 760px) { .dash { grid-template-columns: repeat(4, 1fr); } }
.stat {
  background: #fff; border: 2px solid var(--line); border-radius: var(--radius-sm);
  padding: .9rem; box-shadow: 0 6px 16px rgba(74, 55, 56, 0.1);
}
.stat span { display: block; color: var(--muted); font-size: .8rem; font-weight: 700; }
.stat b { font-size: 1.3rem; color: var(--accent-hot); font-family: var(--font-display); }

.table {
  width: 100%; border-collapse: collapse; background: #fff;
  border: 2px solid var(--line); border-radius: var(--radius); overflow: hidden;
  box-shadow: 0 8px 20px rgba(74, 55, 56, 0.1);
}
.table th, .table td {
  text-align: left; padding: .65rem .75rem; border-bottom: 1px solid #F8EAEA; font-size: .9rem;
}
.table th { background: #F8EAEA; color: var(--muted); font-weight: 700; }

.ticket {
  max-width: 400px; margin: 0 auto; text-align: center;
  background: #fff; border: 2px solid var(--line-strong);
  border-radius: var(--radius); padding: 1.4rem;
  box-shadow: var(--fuchsia-shadow);
}
.ticket code {
  display: inline-block; margin: .45rem 0; padding: .45rem .85rem;
  background: linear-gradient(135deg, var(--accent-hot), var(--accent-deep));
  color: #fff; border: 0; border-radius: var(--radius-pill); font-weight: 800;
}
.ticket .qr { width: 160px; margin: .85rem auto; border-radius: 16px; }

.notif-list { display: grid; gap: .55rem; max-width: 700px; }
.notif-item {
  display: flex; gap: .75rem; justify-content: space-between;
  padding: .9rem; border: 2px solid var(--line); border-radius: var(--radius-sm);
  background: #fff; text-decoration: none;
  box-shadow: 0 4px 12px rgba(74, 55, 56, 0.08);
}
.notif-item.is-new { background: #F8EAEA; border-color: var(--line-strong); }
.notif-body { display: grid; gap: .15rem; min-width: 0; }
.notif-meta { font-size: .8rem; white-space: nowrap; color: var(--muted); }

.tabs { display: flex; gap: .4rem; flex-wrap: wrap; margin: 0 0 .85rem; }
.tabs a, .vk-tab {
  padding: .45rem .9rem; border: 2px solid var(--line); border-radius: var(--radius-pill);
  text-decoration: none; background: #fff; color: var(--muted); font-size: .9rem; font-weight: 700;
}
.tabs a.is-on, .vk-tab.is-on {
  background: linear-gradient(135deg, var(--accent-hot), var(--accent-deep));
  color: #fff; border-color: transparent;
}

.steps { display: flex; gap: .4rem; flex-wrap: wrap; margin: 0 0 .85rem; }
.steps b {
  flex: 1; min-width: 28px; height: 8px; border-radius: 999px;
  background: #F2D6D7; display: block;
}
.steps b.is-on, .steps b.on { background: linear-gradient(90deg, var(--accent-hot), var(--accent-deep)); }
.step {
  padding: .35rem .75rem; border: 2px solid var(--line); border-radius: var(--radius-pill);
  background: #fff; color: var(--muted); font-size: .85rem; font-weight: 700;
}
.step.is-on { background: #F2D6D7; color: var(--accent-hot); border-color: var(--accent); }
.view-toggle { display: flex; gap: .35rem; }

.wizard .step { display: none; border: 0; padding: 0; background: transparent; border-radius: 0; color: inherit; font-size: inherit; font-weight: inherit; }
.wizard .step.is-on { display: grid; gap: .7rem; }

/* —— Messenger —— */
.msg-top {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: .65rem; margin: 0 0 .55rem;
}
.msg-top h1 {
  margin: 0;
  font-size: clamp(1.35rem, 3vw, 1.75rem);
  font-style: italic;
}
.msg-top-main { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; }
.msg-badge {
  display: inline-flex; align-items: center;
  padding: .2rem .6rem; border-radius: var(--radius-pill);
  background: var(--accent-hot); color: #fff;
  font-size: .72rem; font-weight: 700;
}
.msg-badge.soft {
  background: var(--accent-soft); color: var(--accent-deep);
}
.msg-top-actions { display: flex; flex-wrap: wrap; gap: .35rem; }
.msg-filters {
  display: flex; gap: .35rem; overflow-x: auto;
  margin: 0 0 .75rem; padding-bottom: .1rem; scrollbar-width: none;
}
.msg-filters::-webkit-scrollbar { display: none; }
.msg-chip {
  flex: 0 0 auto; padding: .38rem .8rem;
  border-radius: var(--radius-pill); border: 1px solid var(--line);
  background: var(--paper); text-decoration: none; color: var(--muted);
  font-size: .84rem; font-weight: 600; cursor: pointer;
}
.msg-chip:hover { border-color: var(--accent); color: var(--ink); }
.msg-chip.is-on {
  background: var(--ink); color: var(--paper); border-color: var(--ink);
}
.msg-chip.soft {
  background: var(--accent-soft); border-color: var(--line); color: var(--ink-soft);
}
button.msg-chip { font: inherit; }

.vk-profile, .vk-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--cutout);
  overflow: hidden;
}

.chat-shell {
  display: grid; gap: 0;
  min-height: min(70vh, 660px);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--cutout);
}
@media (min-width: 860px) {
  .chat-shell { grid-template-columns: minmax(280px, 34%) 1fr; }
}
@media (max-width: 859px) {
  .chat-shell.has-thread .chat-list { display: none; }
  .chat-shell:not(.has-thread) .chat-pane { display: none; }
  .chat-shell { min-height: min(76vh, 700px); border-radius: var(--radius-sm); }
}

.chat-list {
  display: flex; flex-direction: column;
  background: var(--paper-soft);
  max-height: 42vh; overflow: auto;
  border-bottom: 1px solid var(--line);
}
@media (min-width: 860px) {
  .chat-list {
    border-bottom: 0; border-right: 1px solid var(--line);
    max-height: none;
  }
}
.chat-search {
  position: sticky; top: 0; z-index: 2;
  display: flex; align-items: center; gap: .45rem;
  margin: .65rem .65rem .3rem; padding: .48rem .8rem;
  border-radius: var(--radius-pill);
  background: var(--paper); border: 1px solid var(--line);
}
.chat-search-ico { color: var(--muted); display: grid; place-items: center; flex: none; }
.chat-search-ico svg { width: 18px; height: 18px; }
.chat-search input {
  border: 0; outline: none; background: transparent; width: 100%; min-width: 0;
  font-size: .92rem; color: var(--ink); box-shadow: none;
}
.chat-search input::placeholder { color: var(--muted); }
.chat-list-empty {
  padding: 2rem 1.2rem; text-align: center; color: var(--muted);
  display: grid; gap: .7rem; justify-items: center;
}
.chat-illo {
  width: 52px; height: 52px; border-radius: 14px;
  display: grid; place-items: center;
  background: var(--accent-soft); color: var(--accent-hot);
}
.chat-illo.lg { width: 68px; height: 68px; border-radius: 18px; }
.chat-illo svg { width: 26px; height: 26px; }
.chat-illo.lg svg { width: 32px; height: 32px; }

.chat-row {
  display: flex; gap: .7rem; align-items: flex-start;
  padding: .72rem .8rem; text-decoration: none; color: inherit;
  border-bottom: 1px solid var(--line-soft);
  transition: background .12s ease;
}
.chat-row:hover { background: var(--paper); }
.chat-row.is-on {
  background: var(--paper);
  box-shadow: inset 3px 0 0 var(--accent-hot);
}
.chat-row.has-unread strong { font-weight: 700; color: var(--ink); }
.chat-ava { flex: none; }
.chat-ava img {
  width: 46px !important; height: 46px !important;
  max-width: 46px !important; max-height: 46px !important;
  border-radius: 50%; object-fit: cover;
  background: var(--powder); border: 0;
}
.chat-row-body { flex: 1; min-width: 0; display: grid; gap: .1rem; }
.chat-row-top, .chat-row-bot {
  display: flex; justify-content: space-between; gap: .5rem; align-items: baseline;
}
.chat-row-top strong {
  font-size: .93rem; font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  color: var(--ink); font-family: var(--font);
}
.chat-row-top time { flex: none; color: var(--muted); font-size: .72rem; font-weight: 600; }
.chat-preview {
  color: var(--muted); font-size: .84rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
}
.chat-unread {
  flex: none; min-width: 1.2rem; height: 1.2rem; padding: 0 .3rem;
  border-radius: var(--radius-pill); background: var(--accent-hot); color: #fff;
  font-size: .68rem; font-style: normal; font-weight: 700;
  display: inline-grid; place-items: center;
}
.chat-tag {
  display: inline-block; margin-top: .12rem;
  font-size: .7rem; color: var(--accent-deep);
  background: var(--accent-soft); padding: .1rem .45rem; border-radius: var(--radius-pill);
  max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.chat-tag.soft { background: var(--bg-2); color: var(--muted); }

.chat-pane {
  display: flex; flex-direction: column;
  min-height: 420px; min-width: 0; background: var(--paper);
}
.chat-empty {
  flex: 1; display: grid; place-items: center; padding: 2rem 1.2rem;
  background: var(--paper-soft);
}
.chat-empty-card {
  text-align: center; max-width: 340px;
  display: grid; gap: .55rem; justify-items: center;
}
.chat-empty-card h2 {
  margin: 0; font-size: 1.25rem; color: var(--ink);
  font-family: var(--font-display); font-style: italic; font-weight: 500;
}
.chat-empty-card p { margin: 0; color: var(--muted); font-size: .92rem; }
.chat-empty-cta { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; margin-top: .35rem; }

.chat-back { display: none; flex: none; min-width: 36px; padding: 0 .5rem !important; }
@media (max-width: 859px) {
  .chat-back { display: inline-flex; }
}
.chat-head {
  display: flex; gap: .65rem; align-items: center;
  padding: .7rem .85rem; border-bottom: 1px solid var(--line);
  background: var(--paper); flex: none;
}
.chat-head > img {
  width: 42px !important; height: 42px !important;
  max-width: 42px !important; max-height: 42px !important;
  border-radius: 50%; object-fit: cover; flex: none; background: var(--powder);
}
.chat-head-main { flex: 1; min-width: 0; }
.chat-head-main strong {
  display: block; font-size: .98rem; font-weight: 650;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  color: var(--ink); font-family: var(--font);
}
.chat-head-main span { color: var(--muted); font-size: .78rem; }
.chat-head-actions { display: flex; flex-wrap: wrap; gap: .3rem; flex: none; }

.chat-listing {
  display: flex; gap: .65rem; align-items: center;
  margin: .55rem .75rem 0; padding: .55rem .65rem;
  border-radius: var(--radius-sm); text-decoration: none; color: inherit;
  background: var(--paper-soft); border: 1px solid var(--line); flex: none;
}
.chat-listing:hover { border-color: var(--accent); }
.chat-listing img {
  width: 44px !important; height: 44px !important;
  max-width: 44px !important; max-height: 44px !important;
  border-radius: 8px; object-fit: cover; flex: none; background: var(--powder);
}
.chat-listing strong {
  display: block; font-size: .86rem; color: var(--ink); font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.chat-listing span { color: var(--muted); font-size: .78rem; }
.chat-listing > div { min-width: 0; flex: 1; }
.chat-listing-go {
  margin-left: auto; color: var(--accent-hot);
  font-size: .78rem; font-weight: 700; flex: none;
}

.chat-msgs {
  flex: 1; overflow: auto; padding: .9rem 1rem .4rem;
  display: flex; flex-direction: column; gap: .4rem;
  background:
    radial-gradient(ellipse 70% 40% at 8% 0%, rgba(158, 91, 99, 0.08), transparent 55%),
    var(--bg);
  min-height: 0;
}
.chat-day { display: flex; justify-content: center; margin: .4rem 0; }
.chat-day span {
  padding: .18rem .6rem; border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--ink) 55%, transparent);
  color: var(--paper);
  font-size: .7rem; font-weight: 600;
}
.chat-start-hint {
  text-align: center; color: var(--muted); padding: 1.4rem .5rem; font-size: .9rem;
}
.chat-bubble {
  max-width: min(78%, 420px); padding: .55rem .78rem .35rem;
  border-radius: 16px;
  background: var(--paper);
  box-shadow: 0 1px 2px rgba(42, 36, 38, 0.06);
  border: 1px solid var(--line-soft);
}
.chat-bubble.mine {
  align-self: flex-end;
  background: var(--powder);
  border-color: color-mix(in srgb, var(--accent) 28%, var(--line-soft));
  border-bottom-right-radius: 5px;
}
.chat-bubble.theirs {
  align-self: flex-start;
  border-bottom-left-radius: 5px;
}
.chat-bubble p {
  margin: 0; white-space: pre-wrap; line-height: 1.45;
  color: var(--ink); font-size: .95rem; font-weight: 500;
}
.chat-bubble footer {
  display: flex; justify-content: flex-end; align-items: center; gap: .25rem;
  margin-top: .12rem;
}
.chat-bubble time { font-size: .68rem; color: var(--muted); }
.chat-ticks { font-size: .7rem; color: var(--muted); letter-spacing: -.1em; }
.chat-ticks.read { color: var(--accent-deep); }

.chat-quick {
  display: flex; gap: .35rem; overflow-x: auto;
  padding: .45rem .75rem .25rem; scrollbar-width: none;
  background: var(--paper); border-top: 1px solid var(--line-soft); flex: none;
}
.chat-quick::-webkit-scrollbar { display: none; }

.chat-compose {
  display: grid; grid-template-columns: 1fr auto; gap: .45rem; align-items: end;
  padding: .55rem .7rem .75rem; border-top: 1px solid var(--line);
  background: var(--paper); flex: none;
}
.chat-compose input,
.chat-compose textarea {
  border: 1px solid var(--line); border-radius: 22px;
  padding: .65rem .95rem; resize: none; min-height: 44px; max-height: 120px;
  outline: none; background: var(--paper-soft); width: 100%;
  box-shadow: none; font-size: .95rem; color: var(--ink);
}
.chat-compose textarea:focus,
.chat-compose input:focus {
  border-color: var(--accent); background: var(--paper);
}
.chat-compose textarea::placeholder { color: var(--muted); }
.chat-send {
  width: 44px; height: 44px; border-radius: 50%; border: 0;
  background: var(--accent-hot); color: #fff; cursor: pointer;
  display: grid; place-items: center;
  box-shadow: 0 4px 12px rgba(42, 36, 38, 0.18);
  transition: transform .15s ease, background .15s ease;
}
.chat-send:hover { background: var(--accent-deep); transform: scale(1.04); }
.chat-send svg { width: 18px; height: 18px; }

/* VK cover / avatar sizes */
.vk-cover {
  height: 160px;
  background: linear-gradient(135deg, #F2D6D7, #6B5051 55%, #F2D6D7);
  border-radius: var(--radius) var(--radius) 0 0;
  background-size: cover; background-position: center;
  position: relative;
}
.vk-cover[style*="--cover"] { background-image: linear-gradient(180deg, rgba(74, 55, 56,.25), rgba(74, 55, 56,.35)), var(--cover); }
.vk-cover-shade { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(74, 55, 56, 0.25)); }
.vk-avatar {
  width: 84px !important; height: 84px !important;
  max-width: 84px !important; max-height: 84px !important;
  border-radius: 50%; object-fit: cover;
  border: 4px solid #fff; background: #F2D6D7;
  box-shadow: 0 8px 18px rgba(74, 55, 56, 0.25);
}
.vk-identity, .vk-body, .vk-card { padding: .9rem 1.1rem; }
.vk-counters, .vk-tabs, .vk-id-actions { display: flex; flex-wrap: wrap; gap: .4rem; padding: .55rem 1.1rem; }
.vk-counter {
  text-decoration: none; padding: .4rem .75rem;
  border: 1px solid var(--line); border-radius: var(--radius-pill);
  background: var(--paper-soft); font-weight: 700; color: var(--ink);
}
.vk-counter.is-on { background: var(--accent-soft); border-color: var(--accent); color: var(--ink); }
.vk-counter b { display: block; color: var(--ink); font-family: var(--font-display); }
.vk-counter span { font-size: .75rem; color: var(--muted); }
.vk-layout { display: grid; gap: .85rem; }
@media (min-width: 900px) { .vk-layout { grid-template-columns: 1fr .7fr; } }
.vk-status { color: var(--muted); margin: .2rem 0 0; }
.vk-about-line { color: var(--ink-soft); }

.tmblr-masonry { display: grid; gap: .65rem; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
.tmblr-post, .tmblr-tile {
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  overflow: hidden; background: var(--paper);
  box-shadow: var(--cutout); color: var(--ink);
}
.tmblr-media { aspect-ratio: 1; max-height: 220px; overflow: hidden; }
.tmblr-media img {
  width: 100%; height: 100%; max-height: 220px; aspect-ratio: 1;
  object-fit: cover; background: #F2D6D7;
}
.tmblr-post-head {
  display: flex; gap: .55rem; align-items: center; padding: .7rem .85rem;
}
.tmblr-post-head img {
  width: 40px !important; height: 40px !important;
  max-width: 40px !important; max-height: 40px !important;
  border-radius: 50%; object-fit: cover;
}
.tmblr-body { padding: 0 .85rem .85rem; color: var(--ink-soft); }

@media (max-width: 640px) {
  .shell-actions .btn-drop { display: none; }
  .win-screen { margin: .5rem .55rem 0; max-height: 200px; }
}

.warn-box {
  border: 1.5px dashed var(--ink);
  background: var(--powder);
  padding: .85rem 1rem;
  margin: .75rem 0 1rem;
  border-radius: 4px 16px 8px 12px;
  box-shadow: var(--cutout);
}
.warn-box p {
  margin: 0 0 .7rem;
  color: var(--ink);
  font-size: .9rem;
  line-height: 1.45;
  font-weight: 500;
}
.warn-box p strong {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
}
.check-row {
  display: flex;
  gap: .65rem;
  align-items: flex-start;
  margin: 0;
  cursor: pointer;
  font-size: .88rem;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.4;
}
.check-row input {
  width: 1.15rem !important;
  height: 1.15rem !important;
  min-width: 1.15rem !important;
  min-height: 1.15rem !important;
  margin: .12rem 0 0 !important;
  padding: 0 !important;
  flex: none !important;
  border-radius: 5px !important;
  box-shadow: none !important;
}
.check-row span {
  display: block !important;
  margin: 0 !important;
  font-weight: 600 !important;
  font-size: .88rem !important;
  color: var(--ink) !important;
  line-height: 1.4;
}
html[data-theme="dark"] .warn-box {
  background: color-mix(in srgb, var(--powder) 35%, var(--paper));
}
.price-type,
.service-mode {
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: .8rem 1rem; margin: 0 0 .85rem;
  background: var(--paper-soft);
  color: var(--ink);
}
.price-type legend,
.service-mode legend {
  padding: 0 .35rem; font-weight: 700;
  color: var(--ink);
  font-size: .95rem;
}
.price-type label,
.service-mode label {
  display: flex; align-items: center; gap: .45rem;
  margin: .35rem 0; font-weight: 600;
  color: var(--ink);
  cursor: pointer;
}
.live-disc {
  margin: 0; font-weight: 650; color: var(--accent-deep);
}
.form label span {
  color: var(--ink-soft) !important;
}
.form .hint,
.wizard .hint {
  color: var(--muted);
}
.seek-field { position: relative; }
.command-city.seek-field .seek-suggest { left: 0; right: 0; }

.sell-row-actions { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
.empty-card { text-align: center; padding: 1.5rem; color: var(--muted); }

.urg-critical .card-left, .urg-critical .win-bar-title { color: var(--accent-hot); }
.urg-soon .card-left { color: var(--accent-deep); }

.desk + .hot-rail,
.desk + .board {
  position: relative;
}
.tabs a.is-on, .vk-tab.is-on {
  background: var(--powder);
  color: var(--ink); border-style: solid;
}
.msg-badge {
  display: inline-flex; align-items: center;
  padding: .2rem .6rem; border-radius: var(--radius-pill);
  background: var(--accent-soft); color: var(--accent-deep);
  border: 1px solid var(--line);
  font-size: .72rem; font-weight: 700; letter-spacing: 0;
}
.msg-chip.is-on {
  background: var(--ink); color: var(--paper); border-color: var(--ink);
}
.chat-send {
  background: var(--accent-hot) !important; color: #fff !important;
  border: 0 !important;
  box-shadow: 0 4px 12px rgba(42, 36, 38, 0.18) !important;
  border-radius: 50% !important;
}
.chat-row.is-on { box-shadow: inset 3px 0 0 var(--accent-hot); }
.icon-btn img { width: 16px; height: 14px; display: block; image-rendering: pixelated; }
.y2k-wave, .collage-wave { display: none; }
.eyebrow {
  font-family: var(--font-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: .72rem;
  color: var(--muted);
}
.lede { letter-spacing: 0.02em; max-width: 42ch; }
hr, .hr-deco {
  border: 0; height: 24px; margin: 1.2rem 0;
  background: url("/assets/img/deco/sprig.svg") center / 72px no-repeat;
}


/* —— Кабинет мастера —— */
.cab-hub {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.1rem 1.15rem 1rem;
  margin: 0 0 1.25rem;
  box-shadow: var(--cutout);
  color: var(--ink);
}
.cab-hub-main {
  display: flex; flex-wrap: wrap; gap: 1rem;
  justify-content: space-between; align-items: center;
  margin-bottom: .9rem;
}
.cab-hub-who { display: flex; gap: .75rem; align-items: center; min-width: 0; }
.cab-hub-ava {
  width: 64px; height: 64px; border-radius: 50%; object-fit: cover;
  border: 3px solid #fff; box-shadow: 0 6px 16px rgba(74, 55, 56,.25);
  background: #F2D6D7; flex: none;
}
.cab-hub-kicker {
  margin: 0; font-size: .75rem; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: var(--accent-hot);
}
.cab-hub-who h1 { margin: .1rem 0; font-size: 1.35rem; }
.cab-hub-cta { display: flex; flex-wrap: wrap; gap: .4rem; }
.cab-hub-nav {
  display: flex; gap: .4rem; overflow-x: auto; flex-wrap: nowrap;
  margin: 0 0 .9rem; padding-bottom: .15rem;
}
.cab-hub-link {
  flex: none; display: inline-flex; align-items: center; gap: .35rem;
  min-height: 40px; padding: 0 .85rem;
  border: 1px solid var(--line); border-radius: var(--radius-pill);
  background: var(--paper-soft); text-decoration: none; font-weight: 650; font-size: .85rem;
  color: var(--ink);
}
.cab-hub-link.is-on {
  background: var(--ink);
  color: var(--paper); border-color: var(--ink);
}
.cab-hub-link b, .cab-hub-link i {
  min-width: 1.2rem; height: 1.2rem; padding: 0 .3rem;
  border-radius: 999px; background: rgba(255,255,255,.25);
  font-size: .72rem; font-style: normal; display: inline-grid; place-items: center;
}
.cab-hub-link.is-on b, .cab-hub-link.is-on i { background: rgba(255,255,255,.3); color: #fff; }
.cab-hub-form { margin: 0; padding: 0; border: 0; background: transparent; }
.cab-hub-form button {
  border: 0; background: transparent; cursor: pointer;
  font: inherit; font-weight: 800; color: inherit; padding: 0;
}
.cab-hub-stats {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem;
}
@media (min-width: 700px) {
  .cab-hub-stats { grid-template-columns: repeat(4, 1fr); }
}
.cab-stat {
  background: var(--paper-soft); border: 1px solid var(--line);
  border-radius: var(--radius-sm); padding: .65rem .75rem;
}
.cab-stat span { display: block; color: var(--muted); font-size: .75rem; font-weight: 700; }
.cab-stat b { font-size: 1.15rem; color: var(--ink); font-family: var(--font-display); font-weight: 650; }

.cab-list-head { margin: 0 0 .75rem; }
.cab-list-head h2 { margin: 0 0 .25rem; }
.cab-empty { display: grid; gap: .75rem; justify-items: start; }

.cab-windows { display: grid; gap: .85rem; }
.cab-win {
  display: grid; grid-template-columns: 110px 1fr; gap: .85rem;
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
  padding: .7rem; box-shadow: var(--cutout);
  color: var(--ink);
}
@media (max-width: 560px) {
  .cab-win { grid-template-columns: 88px 1fr; }
}
.cab-win-media {
  display: block; border-radius: 16px; overflow: hidden;
  aspect-ratio: 1; max-height: 110px; background: #F2D6D7;
}
.cab-win-media img { width: 100%; height: 100%; object-fit: cover; }
.cab-win-body { min-width: 0; display: grid; gap: .3rem; align-content: start; }
.cab-win-top {
  display: flex; justify-content: space-between; gap: .5rem; align-items: baseline;
}
.cab-win-top h3 { margin: 0; font-size: 1.05rem; }
.cab-win-top a { text-decoration: none; }
.cab-win-price { font-weight: 800; color: var(--accent-hot); white-space: nowrap; }
.cab-win-meta { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; margin: 0; }
.cab-pill {
  display: inline-flex; padding: .15rem .5rem; border-radius: var(--radius-pill);
  background: var(--bg-2); font-size: .75rem; font-weight: 700; color: var(--ink-soft);
}
.cab-pill.ok { background: var(--accent-soft); color: var(--accent-deep); }
.cab-pill.busy { background: var(--powder); color: var(--ink); }
.cab-win-actions {
  display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; margin-top: .25rem;
}
.cab-win-actions form { margin: 0; display: inline; }
.cab-del { color: #4A3738 !important; border-color: #F2D6D7 !important; }
.cab-del:hover { background: #F8EAEA !important; }

/* Report listing */
.report-box {
  margin-top: .85rem;
  border: 1px dashed var(--line);
  border-radius: var(--radius-sm);
  padding: .55rem .75rem;
  background: rgba(255, 255, 255, 0.45);
}
.report-box summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--muted);
  list-style: none;
}
.report-box summary::-webkit-details-marker { display: none; }
.report-box[open] summary { color: var(--accent-hot); margin-bottom: .35rem; }

/* Theme toggle */
.theme-toggle { cursor: pointer; font: inherit; }
.theme-toggle .theme-ico-moon { display: none; }
html[data-theme="dark"] .theme-toggle .theme-ico-sun { display: none; }
html[data-theme="dark"] .theme-toggle .theme-ico-moon { display: block; }

/* Dark theme — clean readable night */
html[data-theme="dark"] {
  --ink: #F5F0EF;
  --ink-soft: #D9D0CE;
  --muted: #A89C9A;
  --line: #3F3839;
  --line-soft: #2F292A;
  --line-strong: #D9CFD0;
  --bg: #141112;
  --bg-2: #1B1718;
  --paper: #1F1B1C;
  --paper-soft: #262122;
  --powder: #3A2F31;
  --accent: #E2B4B7;
  --accent-hot: #E8C2C4;
  --accent-deep: #C98A8F;
  --accent-soft: #32282A;
  --cutout: 0 12px 32px rgba(0, 0, 0, 0.35);
  --cutout-hover: 0 16px 40px rgba(0, 0, 0, 0.45);
  --fuchsia-glow: rgba(226, 180, 183, 0.12);
  --fuchsia-shadow: 0 10px 24px rgba(0, 0, 0, 0.35);
  color-scheme: dark;
}
html[data-theme="dark"] body {
  background-color: #121011;
  background-image:
    radial-gradient(ellipse 70% 45% at 8% -5%, rgba(90, 55, 60, 0.28), transparent 55%),
    radial-gradient(ellipse 60% 40% at 95% 0%, rgba(55, 48, 52, 0.4), transparent 50%),
    linear-gradient(180deg, #161314 0%, #121011 100%);
  color: var(--ink);
}
html[data-theme="dark"] body::before,
html[data-theme="dark"] body::after { display: none; }
html[data-theme="dark"] .sparkle-layer { display: none !important; }
html[data-theme="dark"] .shell-ico,
html[data-theme="dark"] .shell-user,
html[data-theme="dark"] .hub-pill,
html[data-theme="dark"] .hub-mode,
html[data-theme="dark"] .hub-search,
html[data-theme="dark"] .app-hub,
html[data-theme="dark"] .dock {
  background: rgba(34, 28, 29, 0.96);
  color: var(--ink-soft);
  border-color: var(--line);
  box-shadow: 0 1px 0 rgba(0,0,0,.35);
}
html[data-theme="dark"] .win,
html[data-theme="dark"] .card,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .form,
html[data-theme="dark"] .ticket,
html[data-theme="dark"] .cab-hub,
html[data-theme="dark"] .cab-win,
html[data-theme="dark"] .buy-box,
html[data-theme="dark"] .filters,
html[data-theme="dark"] .desk-window,
html[data-theme="dark"] .seek-suggest,
html[data-theme="dark"] .empty-postcard {
  background: var(--paper);
  border-color: var(--line);
  box-shadow: 0 8px 24px rgba(0,0,0,.28);
}
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
  background: var(--paper-soft);
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme="dark"] .report-box {
  background: rgba(34, 28, 29, 0.6);
}
html[data-theme="dark"] .cab-pill { background: #3D3234; color: #E4D0D2; }
html[data-theme="dark"] .cab-pill.ok { background: #2d3a30; color: #b8d4c0; }
html[data-theme="dark"] .cab-pill.busy { background: #3a2a30; color: #E8C8C9; }
html[data-theme="dark"] .muted,
html[data-theme="dark"] .hint { color: var(--muted); }
html[data-theme="dark"] a { color: var(--ink); }
html[data-theme="dark"] .btn-ghost {
  background: transparent;
  color: var(--ink-soft);
  border-color: var(--line);
}
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-drop,
html[data-theme="dark"] .btn-buy {
  background: #E8C2C4;
  color: #1F1516;
  border-color: #E8C2C4;
  box-shadow: var(--cutout);
}
html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-drop:hover,
html[data-theme="dark"] .btn-buy:hover {
  background: #fff;
  color: #1F1516;
}
html[data-theme="dark"] .btn {
  background: var(--paper-soft);
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme="dark"] .logo-mark {
  background: var(--powder);
}
html[data-theme="dark"] .logo-mark svg rect,
html[data-theme="dark"] .logo-mark svg path { stroke: #F2D6D7 !important; }
html[data-theme="dark"] .badge-disc,
html[data-theme="dark"] .badge-tape,
html[data-theme="dark"] .card-left,
html[data-theme="dark"] .stamp-urg {
  background: var(--powder);
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme="dark"] .hub-mode-btn.is-on {
  background: var(--powder);
  color: var(--ink);
}
html[data-theme="dark"] .main {
  background: transparent;
}
html[data-theme="dark"] .win,
html[data-theme="dark"] .card,
html[data-theme="dark"] .empty-postcard {
  background-image: none;
}
html[data-theme="dark"] .dock-fab-mark {
  background: #F2D6D7;
  color: #4A3738;
  border-color: #F2D6D7;
}
html[data-theme="dark"] .chip.is-on,
html[data-theme="dark"] .cat.is-on,
html[data-theme="dark"] .seek-suggest li:hover,
html[data-theme="dark"] .seek-suggest li.is-on {
  background: var(--powder);
}
html[data-theme="dark"] .ux-coach {
  background: #F2D6D7;
  color: #4A3738;
}
html[data-theme="dark"] .ux-coach::after {
  border-top-color: #F2D6D7;
}
html[data-theme="dark"] .filter-field select,
html[data-theme="dark"] .seek-suggest {
  background: var(--paper-soft);
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme="dark"] .desk-window {
  background: var(--paper);
  border-color: var(--line);
}

/* ========== Layout 4 — structure polish ========== */
.desk-seek-head { display: grid; gap: .15rem; }
.desk-seek-head .display { font-size: clamp(1.7rem, 3.5vw, 2.35rem) !important; margin: 0; }
.desk-quick { display: flex; flex-wrap: wrap; gap: .4rem; }
.chip-action { border-style: dashed !important; box-shadow: 1px 1px 0 var(--ink); }
.chip-hot { background: var(--powder) !important; border-style: solid !important; }
.desk-lede { margin: 0 !important; font-size: 1rem; max-width: 48ch; }
.desk-hero-card, .desk-hero-mini { display: none; }

.board-toolbar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: .65rem; margin: 0 0 .85rem;
}
.board-toolbar-main { display: flex; align-items: baseline; gap: .55rem; min-width: 0; }
.board-toolbar .board-title { margin: 0; }
.board-count {
  display: inline-grid; place-items: center;
  min-width: 1.7rem; height: 1.7rem; padding: 0 .35rem;
  border: 1.5px dashed var(--ink); border-radius: 50%;
  background: var(--powder); font-family: var(--font-mono);
  font-size: .75rem; font-weight: 700; letter-spacing: 0.04em;
}
.board-toolbar-actions { display: flex; flex-wrap: wrap; gap: .35rem; }
.board-cats { margin-bottom: .35rem; }
.board-filters {
  display: grid !important; gap: .55rem;
  padding: .7rem !important;
  overflow: visible !important;
  flex-wrap: nowrap !important;
}
.filter-row { display: flex; flex-wrap: wrap; gap: .4rem; align-items: end; }
.filter-row-selects { display: grid; gap: .45rem; grid-template-columns: 1fr 1fr; width: 100%; }
@media (min-width: 720px) {
  .filter-row-selects { grid-template-columns: repeat(4, 1fr); }
}
.filter-field {
  display: grid; gap: .2rem; min-width: 0;
  font-family: var(--font-mono); font-size: .68rem; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--muted); font-weight: 600;
}
.filter-field select {
  width: 100%; min-height: 40px; padding: 0 .65rem;
  border: 1.5px dotted var(--ink); border-radius: 3px 12px;
  background: #fff; color: var(--ink); font-family: var(--font-mono);
  font-size: .78rem; letter-spacing: 0.02em; text-transform: none;
  box-shadow: 1px 1px 0 var(--ink);
}

.win-foot {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: .45rem !important;
}
.win-foot .btn-buy { width: 100%; }
.win-foot-side {
  display: flex; align-items: center; gap: .4rem;
}
.win-foot-open { flex: 1; }
.win-foot .icon-btn { flex: none; }

.buy-actions { display: grid; gap: .55rem; margin-top: .35rem; }
.buy-actions-row {
  display: flex; gap: .4rem; align-items: stretch;
}
.buy-grow { flex: 1; margin: 0; }
.buy-actions-row .fav-btn {
  width: 46px; min-width: 46px; padding: 0;
  display: grid; place-items: center;
}
.report-form {
  margin-top: .6rem; max-width: none; box-shadow: none !important;
  border: 0 !important; padding: 0 !important; background: transparent !important;
}
.btn-link {
  border: 0; background: transparent; cursor: pointer;
  font-family: var(--font-mono); font-size: .75rem; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--muted); text-decoration: underline;
  text-underline-offset: .2em; padding: .35rem 0;
}
.btn-link:hover { color: var(--ink); }
.cab-del.btn-link { color: #4A3738; }

.cab-hub-cta {
  display: flex; flex-wrap: wrap; gap: .45rem; align-items: center;
}
.cab-hub-cta-side {
  display: flex; flex-wrap: wrap; gap: .35rem; align-items: center;
}
.cab-hub-cta-side form { margin: 0; }
.cab-hub-nav {
  display: flex; gap: .35rem; overflow-x: auto; flex-wrap: nowrap;
  padding-bottom: .15rem; scrollbar-width: none;
}
.cab-hub-nav::-webkit-scrollbar { display: none; }
.cab-hub-link {
  flex: 0 0 auto;
}

.hot-rail-head {
  display: flex; justify-content: space-between; align-items: center; gap: .5rem;
}
.board-kicker .kicker-actions { display: flex; gap: .35rem; }

@media (max-width: 759px) {
  .hub-cta-primary { min-height: 42px; }
  .filters-sticky { top: 3.6rem; }
}

.main, .app-hub, .flash, .dock { position: relative; z-index: 1; }

.seek-field { position: relative; }
.seek-suggest {
  position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 80;
  margin: 0; padding: .35rem;
  list-style: none;
  background: #fff;
  border: 1.5px dashed var(--ink);
  border-radius: 4px 16px 6px 12px;
  box-shadow: var(--cutout);
  max-height: min(50vh, 320px); overflow: auto;
  animation: suggest-in .22s cubic-bezier(.2,.9,.2,1);
}
.seek-suggest[hidden] { display: none; }
@keyframes suggest-in {
  from { opacity: 0; transform: translateY(-6px) scale(.98); }
  to { opacity: 1; transform: none; }
}
.seek-suggest li {
  display: grid; grid-template-columns: auto 1fr auto; gap: .55rem; align-items: center;
  padding: .55rem .65rem; border-radius: 3px 10px;
  cursor: pointer; font-family: var(--font-mono); font-size: .86rem;
  letter-spacing: 0.02em;
}
.seek-suggest li:hover, .seek-suggest li.is-on {
  background: var(--powder);
}
.seek-suggest .sg-ico {
  width: 28px; height: 28px; display: grid; place-items: center;
  border: 1px dashed var(--ink); border-radius: 50%; background: #fff;
}
.seek-suggest .sg-ico svg { width: 14px; height: 14px; }
.seek-suggest .sg-text { min-width: 0; }
.seek-suggest .sg-hint {
  font-size: .65rem; text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--muted); white-space: nowrap;
}
.seek-suggest b { font-weight: 700; color: var(--ink); }
.seek-field.has-suggest { z-index: 30; }

.ux-hint {
  display: inline-flex; align-items: center; gap: .45rem;
  margin: .15rem 0 0; padding: .4rem .7rem;
  border: 1.5px dashed var(--ink); border-radius: 999px;
  background: rgba(255,255,255,.85);
  font-family: var(--font-mono); font-size: .72rem; letter-spacing: 0.04em;
  color: var(--ink-soft);
  animation: hint-pop .5s cubic-bezier(.2,.9,.2,1) both;
  transition: opacity .25s ease;
}
.ux-hint img { width: 16px; height: 16px; }
.ux-hint.is-dim { opacity: .45; }
@keyframes hint-pop {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

.ux-coach {
  position: absolute; left: 0; right: 0; bottom: calc(100% + 8px);
  display: flex; align-items: center; gap: .4rem; justify-content: center;
  padding: .45rem .7rem;
  background: #4A3738; color: #fff;
  border-radius: 4px 14px; font-family: var(--font-mono);
  font-size: .7rem; letter-spacing: 0.04em;
  box-shadow: var(--cutout);
  opacity: 0; transform: translateY(6px);
  transition: .3s ease; pointer-events: none; z-index: 5;
}
.ux-coach.is-on { opacity: 1; transform: none; }
.ux-coach::after {
  content: ""; position: absolute; left: 1.2rem; bottom: -6px;
  border: 6px solid transparent; border-top-color: #4A3738;
}

.feed .win, .feed .card, .hot-pill, .cab-win, .desk-window, .buy-box {
  opacity: 0; transform: translateY(14px);
  transition: opacity .45s ease, transform .45s cubic-bezier(.2,.9,.2,1), box-shadow .18s ease;
  transition-delay: var(--stagger, 0ms);
}
.feed .win.is-in, .feed .card.is-in, .hot-pill.is-in, .cab-win.is-in, .desk-window.is-in, .buy-box.is-in {
  opacity: 1; transform: none;
}

.btn { transition: transform .15s ease, box-shadow .15s ease, background .15s ease, filter .15s ease; }
.btn:active { transform: translate(1px, 1px); box-shadow: 1px 1px 0 var(--ink); }
.btn-pulse-soft { animation: soft-pulse 2.4s ease-in-out infinite; }
@keyframes soft-pulse {
  0%, 100% { box-shadow: 2px 2px 0 #4A3738; }
  50% { box-shadow: 3px 3px 0 #4A3738, 0 0 0 4px rgba(242,214,215,.55); }
}

.fav-btn.fav-burst { animation: fav-pop .45s cubic-bezier(.2,.9,.2,1); }
@keyframes fav-pop {
  0% { transform: scale(1); }
  40% { transform: scale(1.2) rotate(-8deg); }
  100% { transform: scale(1); }
}

.chip, .cat, .hub-pill, .shell-ico {
  transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
}
.chip:hover, .cat:hover, .hub-pill:hover, .shell-ico:hover {
  transform: translate(-1px, -1px);
}

.dock-fab-mark {
  transition: transform .2s cubic-bezier(.2,.9,.2,1), background .15s ease;
}
.dock-fab:hover .dock-fab-mark { transform: scale(1.08) rotate(90deg); }

.stamp-urg { animation: stamp-wiggle 3.5s ease-in-out infinite; }
@keyframes stamp-wiggle {
  0%, 100% { transform: rotate(-3deg); }
  50% { transform: rotate(-5deg) translateY(-1px); }
}

.desk-window {
  animation: desk-in .55s cubic-bezier(.2,.9,.2,1) both;
}
@keyframes desk-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

@media (max-width: 720px) {
}
@media (prefers-reduced-motion: reduce) {
  .btn-pulse-soft, .stamp-urg, .desk-window { animation: none !important; }
  .feed .win, .feed .card, .hot-pill, .cab-win, .desk-window, .buy-box {
    opacity: 1 !important; transform: none !important; transition: none !important;
  }
  .seek-suggest { animation: none; }
  .ux-hint { animation: none; }
}


/* ========== Audience 7 — cleaner, broader, photo scenic ========== */
h1, h2, h3, .display, .board-title, .logo-word, .vk-name {
  letter-spacing: -0.01em;
}
h1 { font-style: normal; font-weight: 600; }
h2 { font-style: normal; font-weight: 600; }
.display em, .board-title em {
  font-style: italic;
  font-weight: 500;
  text-decoration: none;
  color: var(--accent-hot);
}
.logo-word { font-style: italic; font-weight: 600; letter-spacing: 0.02em; }
.logo-mark {
  border-radius: 12px;
  background: var(--accent-soft);
  border: 1px solid var(--line);
  box-shadow: none;
}
.logo-mark svg rect,
.logo-mark svg path { stroke: var(--ink) !important; stroke-dasharray: none !important; }

/* Soft solid chrome instead of scrapbook dashes */
.hub-mode,
.hub-row-seek.hub-search,
.hub-pill,
.shell-ico,
.shell-user,
.dock,
.win, .card, .panel, .form, .ticket, .cab-hub, .cab-win, .buy-box,
.filters, .desk-window, .seek-suggest, .empty-postcard,
.cat, .chip, .hot-pill {
  border-style: solid !important;
  border-color: var(--line) !important;
  border-radius: var(--radius-sm) !important;
  box-shadow: var(--cutout) !important;
}
.hub-mode-btn {
  font-family: var(--font) !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
  font-size: .8rem !important;
}
.hub-mode-btn.is-on {
  background: var(--ink) !important;
  color: #fff !important;
  border-color: var(--ink) !important;
}
.hub-pill, .shell-ico, .hub-search input, .chip, .cat, .filter-field,
.cab-hub-kicker, .eyebrow {
  font-family: var(--font) !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
}
.hub-pill { font-size: .82rem !important; font-weight: 600; }
.chip, .cat {
  background: var(--paper) !important;
  color: var(--ink-soft) !important;
  box-shadow: none !important;
}
.chip.is-on, .cat.is-on, .chip-hot {
  background: var(--accent-soft) !important;
  color: var(--ink) !important;
  border-color: #E0C4C6 !important;
}

.win, .card, .desk-window, .empty-postcard, .cab-win, .buy-box, .form, .panel {
  background: var(--paper) !important;
  background-image: none !important;
}
.win-title, .card-title {
  font-family: var(--font) !important;
  font-style: normal !important;
  transform: none !important;
  font-weight: 650;
}
.win-price, .card-price, .desk-hero-price, .hot-pill strong, .cab-win-price {
  font-family: var(--font) !important;
  letter-spacing: 0 !important;
  font-variant-numeric: tabular-nums;
}

.dock {
  background: rgba(255,255,255,.94) !important;
  border-top: 1px solid var(--line) !important;
  backdrop-filter: blur(12px);
}
.dock a {
  font-family: var(--font) !important;
  font-size: .72rem !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.dock-fab-mark {
  border-radius: 14px !important;
  border-style: solid !important;
  background: var(--ink) !important;
  color: #fff !important;
  border-color: var(--ink) !important;
  box-shadow: none !important;
}

.filter-field select {
  border-style: solid !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  background: var(--paper) !important;
  font-family: var(--font) !important;
}

.section-bow { display: none !important; }
.ux-hint img { display: none !important; }
.ux-hint {
  border-style: solid !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.75) !important;
  color: var(--muted) !important;
}

/* Pinterest-style polaroid collage (not floating body cutouts) */
.scenic {
  display: block !important;
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}
.pin-shot {
  position: absolute;
  margin: 0;
  padding: 8px 8px 22px;
  background: #fff;
  border-radius: 2px;
  box-shadow:
    0 1px 0 rgba(255,255,255,.8) inset,
    0 14px 34px rgba(42, 36, 38, 0.14),
    0 2px 6px rgba(42, 36, 38, 0.08);
  opacity: .55;
  animation: pin-float 16s ease-in-out infinite;
  will-change: transform;
}
.pin-shot img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 1px;
  background: #eee;
}
.pin-tape {
  position: absolute;
  top: -8px;
  left: 50%;
  width: 46%;
  height: 16px;
  transform: translateX(-50%) rotate(-2deg);
  border-radius: 1px;
  opacity: .78;
  box-shadow: 0 1px 2px rgba(42,36,38,.12);
}
.pin-tape-a {
  background: linear-gradient(180deg, rgba(242,214,215,.55), rgba(232,200,202,.7));
}
.pin-tape-b {
  background: linear-gradient(180deg, rgba(232,220,210,.55), rgba(214,200,186,.72));
  transform: translateX(-50%) rotate(3deg);
}
.pin-tape-c {
  background: linear-gradient(180deg, rgba(220,228,232,.55), rgba(198,210,216,.7));
  width: 38%;
  left: 58%;
}
.si-1 { width: 156px; top: 10%; left: 2%; transform: rotate(-7deg); animation-delay: -1s; }
/* right stack — overlapping Pinterest column */
.si-2 { width: 168px; top: 9%; right: 3.5%; transform: rotate(7deg); animation-delay: -4s; opacity: .62; z-index: 3; }
.si-3 { width: 144px; bottom: 18%; left: 3%; transform: rotate(4deg); animation-delay: -7s; opacity: .52; }
.si-4 { width: 158px; top: 34%; right: 1.5%; transform: rotate(-8deg); animation-delay: -2s; opacity: .6; z-index: 2; }
.si-5 { width: 148px; top: 58%; right: 5.5%; transform: rotate(5deg); animation-delay: -9s; opacity: .58; z-index: 4; }
.si-6 { width: 128px; top: 38%; left: 6%; transform: rotate(-3deg); animation-delay: -5s; opacity: .48; }
@keyframes pin-float {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -8px; }
}
@media (max-width: 980px) {
  .si-5, .si-6 { display: none; }
  .pin-shot { opacity: .38; }
  .si-1, .si-2 { width: 120px; }
  .si-3, .si-4 { width: 110px; }
}
@media (max-width: 720px) {
  .scenic { display: none !important; }
}

html[data-theme="dark"] .pin-shot {
  background: #2A2425;
  opacity: .32;
  box-shadow: 0 16px 36px rgba(0,0,0,.4);
}
html[data-theme="dark"] .pin-tape-a {
  background: linear-gradient(180deg, rgba(226,180,183,.35), rgba(180,130,135,.5));
}
html[data-theme="dark"] .pin-tape-b {
  background: linear-gradient(180deg, rgba(180,160,150,.35), rgba(140,120,110,.5));
}
html[data-theme="dark"] .pin-tape-c {
  background: linear-gradient(180deg, rgba(150,160,170,.35), rgba(110,120,130,.5));
}
html[data-theme="dark"] .app-hub,
html[data-theme="dark"] .dock {
  background: rgba(24, 20, 21, 0.94) !important;
  border-color: var(--line) !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .main { background: transparent !important; }
html[data-theme="dark"] .hub-mode-btn.is-on {
  background: var(--accent) !important;
  color: #1F1516 !important;
  border-color: var(--accent) !important;
}
html[data-theme="dark"] .dock-fab-mark {
  background: #E8C2C4 !important;
  color: #1F1516 !important;
  border-color: #E8C2C4 !important;
}
html[data-theme="dark"] .chip.is-on,
html[data-theme="dark"] .cat.is-on,
html[data-theme="dark"] .chip-hot {
  background: var(--powder) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] .ux-hint {
  background: rgba(31, 27, 28, 0.85) !important;
  border-color: var(--line) !important;
  color: var(--muted) !important;
}

.muted, .hint { color: var(--muted); }
.prose p, .lede, .desk-lede { color: var(--ink-soft); font-size: 1.02rem; line-height: 1.55; }

@media (prefers-reduced-motion: reduce) {
  .pin-shot { animation: none !important; }
}

.empty-pin {
  width: min(150px, 46vw);
  margin: 0 auto .9rem;
  padding: 8px 8px 20px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(42,36,38,.12);
  transform: rotate(-2deg);
}
.empty-pin img {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  display: block;
}
html[data-theme="dark"] .empty-pin { background: #2A2425; }
.desk-seek-form input,
.hub-search input {
  font-size: 1rem !important;
  font-weight: 500 !important;
}
.desk-window {
  padding: 1.25rem 1.2rem !important;
}
.board-title, .desk-seek-head .display {
  font-size: clamp(1.65rem, 3.4vw, 2.2rem) !important;
  line-height: 1.15;
}


/* ========== Fix 9 — suggest above UI, no stacked controls ========== */
.desk-seek { position: relative; z-index: 8; }
.desk-seek .desk-window { overflow: visible !important; z-index: 8; }
.desk-seek-form { position: relative; z-index: 20; }
.seek-field { position: relative; }
.seek-field.has-suggest,
.seek-field:focus-within {
  z-index: 90;
}
.seek-suggest {
  z-index: 200 !important;
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 40px rgba(42,36,38,.18) !important;
}
html[data-theme="dark"] .seek-suggest {
  background: var(--paper-soft) !important;
  border-color: var(--line) !important;
}

/* Hub: stop button pile-up */
.app-hub { overflow: visible; }
.app-hub-inner { overflow: visible; }
.hub-row-top {
  display: grid !important;
  grid-template-columns: auto auto minmax(0, 1fr) auto !important;
  flex-wrap: nowrap;
  align-items: center;
  gap: .45rem .55rem;
}
.hub-row-top:not(:has(.mode-switch)) {
  grid-template-columns: auto minmax(0, 1fr) auto !important;
}
.hub-brand { flex: none; min-width: 0; }
.mode-switch { justify-self: start; }
.hub-tray {
  flex: none;
  justify-self: end;
  min-width: 0;
}
.hub-cta-group {
  flex: none;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  justify-content: flex-end;
  justify-self: end;
}
.hub-cta-group .hub-cta-primary {
  white-space: nowrap;
}
@media (max-width: 860px) {
  .hub-row-top {
    grid-template-columns: auto auto 1fr !important;
  }
  .hub-row-top:not(:has(.mode-switch)) {
    grid-template-columns: auto 1fr !important;
  }
  .hub-cta-group {
    grid-column: 1 / -1;
    justify-self: stretch;
  }
}
.hub-row-seek.hub-search {
  position: relative;
  z-index: 70;
  overflow: visible;
}
.hub-search-q,
.hub-search-city {
  position: relative;
  overflow: visible;
}
@media (max-width: 860px) {
  .hub-pill-desk { display: none !important; }
  .hub-cta-group { width: 100%; }
  .hub-cta-group .shell-user { display: none; }
  .hub-cta-group .hub-cta-primary,
  .hub-cta-group .shell-login { flex: 1; min-width: 0; }
}
@media (max-width: 520px) {
  .hub-mode { width: 100%; }
}

/* Pins: back to visible moodboard placement */
.scenic-pins .pin-shot {
  opacity: .55 !important;
  filter: saturate(.95) brightness(1.02);
}
.scenic { display: block !important; }
.si-5, .si-6 { display: block !important; }
@media (max-width: 980px) {
  .si-5 { display: none !important; }
  .si-6 { display: none !important; }
  .si-2 { width: 140px !important; top: 10% !important; right: 2% !important; }
  .si-4 { width: 132px !important; top: 42% !important; right: 1% !important; }
}
@media (max-width: 720px) {
  .scenic { display: none !important; }
}

/* Filters sticky below suggest */
.filters-sticky { z-index: 15 !important; }
.board { position: relative; z-index: 2; }
.hot-rail { position: relative; z-index: 1; }

/* Card foot: one clear row */
.win-foot {
  display: flex !important;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: .4rem !important;
  grid-template-columns: none !important;
}
.win-foot .btn-buy { flex: 1.2; width: auto; }
.win-foot-side { flex: 1; min-width: 0; }
.win-foot-open { flex: 1; min-width: 0; }


/* ========== Motion 13 — cool but calm Y2K motion ========== */
:root {
  --ease-out: cubic-bezier(.2, .9, .2, 1);
  --ease-spring: cubic-bezier(.34, 1.4, .64, 1);
}

/* Page enter */
.app-hub {
  animation: hub-in .55s var(--ease-out) both;
}
@keyframes hub-in {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: none; }
}
.main > .desk-seek,
.main > .kicker,
.main > .board,
.main > .cab-hub,
.main > .hot-rail {
  animation: section-rise .6s var(--ease-out) both;
}
.main > .hot-rail { animation-delay: .08s; }
.main > .board { animation-delay: .14s; }
@keyframes section-rise {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: none; }
}
.flash {
  animation: flash-in .4s var(--ease-spring) both;
}
@keyframes flash-in {
  from { opacity: 0; transform: translateY(-8px) scale(.98); }
  to { opacity: 1; transform: none; }
}

/* Logo + theme */
.logo-mark {
  transition: transform .25s var(--ease-spring), box-shadow .2s ease;
}
.logo:hover .logo-mark {
  transform: rotate(-6deg) scale(1.06);
}
.logo-word {
  transition: letter-spacing .25s ease, color .2s ease;
}
.logo:hover .logo-word { letter-spacing: 0.08em; }
.theme-toggle .theme-ico-sun,
.theme-toggle .theme-ico-moon {
  transition: transform .35s var(--ease-spring), opacity .2s ease;
}
.theme-toggle:hover .theme-ico-sun,
.theme-toggle:hover .theme-ico-moon {
  transform: rotate(20deg) scale(1.08);
}

/* Buttons */
.btn {
  transition: transform .18s var(--ease-spring), box-shadow .18s ease, background .18s ease, filter .18s ease, border-color .18s ease !important;
}
.btn:hover {
  transform: translateY(-2px) !important;
}
.btn:active {
  transform: translateY(1px) scale(.98) !important;
}
.btn-primary,
.btn-drop,
.btn-buy {
  position: relative;
  overflow: hidden;
}
.btn-primary::after,
.btn-drop::after,
.btn-buy::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.28) 50%, transparent 65%);
  transform: translateX(-120%);
  pointer-events: none;
}
.btn-primary:hover::after,
.btn-drop:hover::after,
.btn-buy:hover::after {
  animation: btn-sheen .7s ease;
}
@keyframes btn-sheen {
  to { transform: translateX(120%); }
}

/* Chips / cats */
.chip, .cat {
  transition: transform .2s var(--ease-spring), background .15s ease, border-color .15s ease, box-shadow .15s ease !important;
}
.chip:hover, .cat:hover {
  transform: translateY(-2px) scale(1.03);
}
.chip:active, .cat:active {
  transform: scale(.97);
}

/* Cards — lift + image zoom + gloss */
.feed .win,
.feed .card,
.hot-pill,
.cab-win {
  opacity: 0;
  transform: translateY(22px) scale(.985);
  transition: opacity .55s var(--ease-out), transform .55s var(--ease-out), box-shadow .22s ease;
  transition-delay: var(--stagger, 0ms);
}
.feed .win.is-in,
.feed .card.is-in,
.hot-pill.is-in,
.cab-win.is-in,
.desk-window.is-in,
.buy-box.is-in {
  opacity: 1;
  transform: none;
  animation: none;
}
.win:hover, .card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 18px 40px rgba(42, 36, 38, 0.14) !important;
}
.win-screen img,
.card-media img,
.hot-pill img {
  transition: transform .55s var(--ease-out), filter .35s ease;
  will-change: transform;
}
.win:hover .win-screen img,
.card:hover .card-media img,
.hot-pill:hover img {
  transform: scale(1.07);
  filter: saturate(1.05) contrast(1.02);
}
.win-screen::before,
.card-media::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(115deg, transparent 30%, rgba(255,255,255,.35) 48%, transparent 62%);
  transform: translateX(-130%);
  pointer-events: none;
  mix-blend-mode: soft-light;
}
.win:hover .win-screen::before,
.card:hover .card-media::before {
  animation: gloss-sweep .75s ease;
}
@keyframes gloss-sweep {
  to { transform: translateX(130%); }
}

/* Price pop when revealed */
.win.is-in .card-price strong,
.card.is-in .card-price strong {
  animation: price-pop .55s var(--ease-spring) both;
  animation-delay: calc(var(--stagger, 0ms) + .12s);
}
@keyframes price-pop {
  from { opacity: 0; transform: translateY(8px) scale(.94); }
  to { opacity: 1; transform: none; }
}

/* Urgency pulse */
.urg-critical .stamp-urg,
.urg-critical .badge-disc {
  animation: urg-pulse 1.4s ease-in-out infinite;
}
@keyframes urg-pulse {
  0%, 100% { transform: scale(1); filter: brightness(1); }
  50% { transform: scale(1.05); filter: brightness(1.08); }
}

/* Fav heart */
.fav-btn {
  transition: transform .2s var(--ease-spring), background .15s ease, border-color .15s ease !important;
}
.fav-btn:hover { transform: scale(1.1); }
.fav-btn.is-fav { animation: fav-land .45s var(--ease-spring); }
@keyframes fav-land {
  0% { transform: scale(.7); }
  55% { transform: scale(1.18); }
  100% { transform: scale(1); }
}

/* Dock */
.dock {
  animation: dock-up .5s var(--ease-out) .15s both;
}
@keyframes dock-up {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: none; }
}
.dock a {
  transition: transform .2s var(--ease-spring), color .15s ease !important;
}
.dock a:hover { transform: translateY(-3px); }
.dock a.is-on span {
  animation: dock-label .35s var(--ease-spring);
}
@keyframes dock-label {
  from { opacity: .4; transform: translateY(4px); }
  to { opacity: 1; transform: none; }
}
.dock-fab-mark {
  transition: transform .25s var(--ease-spring), box-shadow .2s ease !important;
  animation: fab-glow 2.8s ease-in-out infinite;
}
.dock-fab:hover .dock-fab-mark {
  transform: rotate(90deg) scale(1.08);
  animation: none;
}
@keyframes fab-glow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(158, 91, 99, 0); }
  50% { box-shadow: 0 0 0 8px rgba(158, 91, 99, 0.12); }
}

/* Search suggest */
.seek-suggest {
  animation: suggest-pop .28s var(--ease-spring) !important;
}
@keyframes suggest-pop {
  from { opacity: 0; transform: translateY(-8px) scale(.97); }
  to { opacity: 1; transform: none; }
}
.seek-suggest li {
  transition: background .15s ease, transform .15s ease;
}
.seek-suggest li:hover,
.seek-suggest li.is-on {
  transform: translateX(3px);
}

/* Pins sway */
.pin-shot {
  animation: pin-sway 14s ease-in-out infinite !important;
}
.si-2 { animation-duration: 16s !important; }
.si-3 { animation-duration: 18s !important; }
.si-4 { animation-duration: 15s !important; }
.si-5 { animation-duration: 17s !important; }
.si-6 { animation-duration: 19s !important; }
@keyframes pin-sway {
  0%, 100% { translate: 0 0; }
  40% { translate: 0 -12px; }
  70% { translate: 0 -4px; }
}

/* Hot rail scroll fade */
.hot-pill {
  transition: transform .25s var(--ease-spring), box-shadow .2s ease, opacity .55s var(--ease-out) !important;
}
.hot-pill:hover {
  transform: translateY(-4px) rotate(-1deg);
}

/* Mode switch */
.hub-mode-btn {
  transition: background .2s ease, color .2s ease, transform .2s var(--ease-spring) !important;
}
.hub-mode-btn.is-on {
  animation: mode-snap .35s var(--ease-spring);
}
@keyframes mode-snap {
  from { transform: scale(.92); }
  to { transform: scale(1); }
}

/* Forms / wizard steps */
.step.is-on {
  animation: step-in .35s var(--ease-out);
}
@keyframes step-in {
  from { opacity: 0; transform: translateX(12px); }
  to { opacity: 1; transform: none; }
}

.chip.is-press, .cat.is-press, .shell-ico.is-press, .hub-pill.is-press {
  transform: scale(.96) !important;
}

@media (prefers-reduced-motion: reduce) {
  .app-hub,
  .main > .desk-seek,
  .main > .kicker,
  .main > .board,
  .main > .cab-hub,
  .main > .hot-rail,
  .flash,
  .dock,
  .pin-shot,
  .dock-fab-mark,
  .urg-critical .stamp-urg,
  .urg-critical .badge-disc,
  .btn-primary::after,
  .btn-drop::after,
  .btn-buy::after,
  .win-screen::before,
  .card-media::before {
    animation: none !important;
  }
  .feed .win,
  .feed .card,
  .hot-pill,
  .cab-win {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .win:hover, .card:hover, .btn:hover, .chip:hover, .cat:hover, .dock a:hover {
    transform: none !important;
  }
  .win:hover .win-screen img,
  .card:hover .card-media img {
    transform: none !important;
  }
}



/* Right pins stack polish */
.si-2, .si-4, .si-5 {
  box-shadow:
    0 1px 0 rgba(255,255,255,.85) inset,
    0 16px 36px rgba(42, 36, 38, 0.16),
    0 2px 8px rgba(42, 36, 38, 0.08) !important;
}


/* ========== Dark 16 — readable, less bright surfaces ========== */
html[data-theme="dark"] {
  --ink: #F7F2F1 !important;
  --ink-soft: #E6DCDA !important;
  --muted: #B7AAA8 !important;
  --line: #3A3334 !important;
  --line-soft: #2A2425 !important;
  --bg: #0E0C0D !important;
  --bg-2: #151213 !important;
  --paper: #171415 !important;
  --paper-soft: #1C191A !important;
  --powder: #2A2224 !important;
  --accent: #D9A8AB !important;
  --accent-hot: #E4B6B9 !important;
  --accent-deep: #C48A8E !important;
  --accent-soft: #241E1F !important;
  --cutout: 0 10px 28px rgba(0,0,0,.45) !important;
  --cutout-hover: 0 14px 34px rgba(0,0,0,.55) !important;
}
html[data-theme="dark"] body {
  background-color: #0C0A0B !important;
  background-image:
    radial-gradient(ellipse 55% 35% at 12% 0%, rgba(70, 45, 48, 0.22), transparent 60%),
    linear-gradient(180deg, #100E0F 0%, #0C0A0B 100%) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .main {
  background: transparent !important;
}
html[data-theme="dark"] .app-hub,
html[data-theme="dark"] .dock,
html[data-theme="dark"] .hub-search,
html[data-theme="dark"] .hub-mode,
html[data-theme="dark"] .hub-pill,
html[data-theme="dark"] .shell-ico,
html[data-theme="dark"] .shell-user {
  background: rgba(18, 15, 16, 0.94) !important;
  color: var(--ink-soft) !important;
  border-color: var(--line) !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .win,
html[data-theme="dark"] .card,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .form,
html[data-theme="dark"] .ticket,
html[data-theme="dark"] .cab-hub,
html[data-theme="dark"] .cab-win,
html[data-theme="dark"] .buy-box,
html[data-theme="dark"] .filters,
html[data-theme="dark"] .desk-window,
html[data-theme="dark"] .empty-postcard,
html[data-theme="dark"] .vk-card,
html[data-theme="dark"] .tmblr-post,
html[data-theme="dark"] .follow-banner,
html[data-theme="dark"] .follow-cat-card,
html[data-theme="dark"] .seek-suggest {
  background: #171415 !important;
  background-image: none !important;
  border-color: #3A3334 !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.35) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .pin-shot {
  background: #1A1617 !important;
  opacity: .28 !important;
}
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] .display,
html[data-theme="dark"] .logo-word,
html[data-theme="dark"] .card-title,
html[data-theme="dark"] .win-title,
html[data-theme="dark"] a {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .muted,
html[data-theme="dark"] .hint,
html[data-theme="dark"] .lede,
html[data-theme="dark"] .desk-lede,
html[data-theme="dark"] .eyebrow,
html[data-theme="dark"] .prose p,
html[data-theme="dark"] .card-meta,
html[data-theme="dark"] .win-meta {
  color: #B7AAA8 !important;
}
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .filter-field select,
html[data-theme="dark"] .hub-search input {
  background: #1C191A !important;
  color: #F7F2F1 !important;
  border-color: #4A4143 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
  color: #8F8382 !important;
}
html[data-theme="dark"] .btn {
  background: #221C1D !important;
  color: #F0E8E7 !important;
  border-color: #4A4143 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .btn-ghost {
  background: transparent !important;
  color: #E6DCDA !important;
  border-color: #4A4143 !important;
}
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-drop,
html[data-theme="dark"] .btn-buy,
html[data-theme="dark"] .dock-fab-mark {
  background: #E4B6B9 !important;
  color: #1A1213 !important;
  border-color: #E4B6B9 !important;
}
html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-drop:hover,
html[data-theme="dark"] .btn-buy:hover {
  background: #F2D6D7 !important;
  color: #1A1213 !important;
}
html[data-theme="dark"] .chip,
html[data-theme="dark"] .cat,
html[data-theme="dark"] .hub-mode-btn {
  background: #1C191A !important;
  color: #E6DCDA !important;
  border-color: #3A3334 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .chip.is-on,
html[data-theme="dark"] .cat.is-on,
html[data-theme="dark"] .hub-mode-btn.is-on,
html[data-theme="dark"] .chip-hot {
  background: #2A2224 !important;
  color: #F7F2F1 !important;
  border-color: #6A5557 !important;
}
html[data-theme="dark"] .badge-disc,
html[data-theme="dark"] .badge-tape,
html[data-theme="dark"] .stamp-urg,
html[data-theme="dark"] .card-left {
  background: #2A2224 !important;
  color: #F0E8E7 !important;
  border-color: #5A484A !important;
}
html[data-theme="dark"] .flash.ok {
  background: #1F2A22 !important;
  border-color: #3A4A3C !important;
  color: #D8E6DA !important;
}
html[data-theme="dark"] .flash.err {
  background: #2A1A1C !important;
  border-color: #5A3A3E !important;
  color: #F0D0D2 !important;
}

/* Follow UI */
.follow-banner {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  margin: 0 0 .85rem; padding: .75rem .9rem;
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: var(--paper);
}
.follow-banner-form {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem; width: 100%; flex-wrap: wrap;
  margin: 0;
}
.follow-banner-form p { margin: 0; color: var(--ink-soft); }
.follow-banner-guest { margin: 0; color: var(--muted); }
.follow-section-title { margin: 1rem 0 .55rem; font-size: 1.05rem; }
.follow-cats { display: grid; gap: .55rem; margin-bottom: 1rem; }
.follow-cat-card {
  display: flex; align-items: center; gap: .55rem; flex-wrap: wrap;
  padding: .75rem .85rem; border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: var(--paper);
}
.follow-cat-card > div { flex: 1; min-width: 10rem; }
.follow-cat-card p { margin: .15rem 0 0; }
.service-mode { display: grid; gap: .4rem; }
.service-mode legend { margin-bottom: .15rem; }
.service-existing, .service-new { display: grid; gap: .55rem; }
.service-existing[hidden], .service-new[hidden] { display: none !important; }

/* Suggest above everything */
.seek-suggest.is-fixed {
  position: fixed !important;
  z-index: 4000 !important;
  max-height: min(50vh, 320px);
}
.desk-seek.has-open-suggest,
.hub-search.has-open-suggest { z-index: 80 !important; }
.filters-sticky { z-index: 10 !important; }


/* ========== Chat 17 — messenger polish + dark ========== */
.chat-shell,
.chat-pane,
.chat-list,
.chat-head,
.chat-quick,
.chat-compose {
  background: var(--paper);
}
.chat-list { background: var(--paper-soft); }
.chat-msgs {
  background:
    radial-gradient(ellipse 70% 40% at 8% 0%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 55%),
    var(--bg) !important;
}
.chat-bubble {
  box-shadow: 0 1px 2px rgba(42, 36, 38, 0.06) !important;
  border-radius: 16px !important;
}
.chat-bubble.mine {
  background: var(--powder) !important;
  border-color: color-mix(in srgb, var(--accent) 30%, var(--line)) !important;
  border-bottom-right-radius: 5px !important;
}
.chat-bubble.theirs {
  background: var(--paper) !important;
  border-color: var(--line) !important;
  border-bottom-left-radius: 5px !important;
}
.chat-bubble p { color: var(--ink) !important; }
.chat-bubble time,
.chat-preview,
.chat-head-main span,
.chat-listing span,
.chat-start-hint { color: var(--muted) !important; }
.chat-row-top strong,
.chat-head-main strong,
.chat-listing strong,
.chat-empty-card h2 { color: var(--ink) !important; }
.msg-chip.is-on {
  background: var(--ink) !important;
  color: var(--paper) !important;
  border-color: var(--ink) !important;
}
.chat-send {
  background: var(--accent-hot) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 50% !important;
}
.chat-compose textarea,
.chat-compose input {
  background: var(--paper-soft) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
  border-radius: 22px !important;
  box-shadow: none !important;
}
.chat-search {
  background: var(--paper) !important;
  border-color: var(--line) !important;
}
.chat-search input {
  background: transparent !important;
  color: var(--ink) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .chat-shell {
  background: #141112 !important;
  border-color: #3A3334 !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.4) !important;
}
html[data-theme="dark"] .chat-list {
  background: #121011 !important;
  border-color: #3A3334 !important;
}
html[data-theme="dark"] .chat-pane,
html[data-theme="dark"] .chat-head,
html[data-theme="dark"] .chat-quick,
html[data-theme="dark"] .chat-compose {
  background: #151213 !important;
  border-color: #3A3334 !important;
}
html[data-theme="dark"] .chat-empty {
  background: #121011 !important;
}
html[data-theme="dark"] .chat-msgs {
  background:
    radial-gradient(ellipse 60% 35% at 10% 0%, rgba(90, 55, 58, 0.28), transparent 55%),
    #0F0D0E !important;
}
html[data-theme="dark"] .chat-row {
  border-color: #2A2425 !important;
}
html[data-theme="dark"] .chat-row:hover,
html[data-theme="dark"] .chat-row.is-on {
  background: #1A1617 !important;
}
html[data-theme="dark"] .chat-row.is-on {
  box-shadow: inset 3px 0 0 #E4B6B9 !important;
}
html[data-theme="dark"] .chat-bubble.theirs {
  background: #1E1A1B !important;
  border-color: #3A3334 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .chat-bubble.mine {
  background: #2A2224 !important;
  border-color: #4A3A3C !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .chat-bubble p {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .chat-bubble time,
html[data-theme="dark"] .chat-ticks {
  color: #9A8E8C !important;
}
html[data-theme="dark"] .chat-ticks.read {
  color: #E4B6B9 !important;
}
html[data-theme="dark"] .chat-day span {
  background: rgba(255,255,255,.12) !important;
  color: #E6DCDA !important;
}
html[data-theme="dark"] .chat-listing {
  background: #1A1617 !important;
  border-color: #3A3334 !important;
}
html[data-theme="dark"] .chat-tag {
  background: #2A2224 !important;
  color: #E4B6B9 !important;
}
html[data-theme="dark"] .chat-tag.soft {
  background: #221C1D !important;
  color: #B7AAA8 !important;
}
html[data-theme="dark"] .chat-illo {
  background: #2A2224 !important;
  color: #E4B6B9 !important;
}
html[data-theme="dark"] .msg-chip {
  background: #1C191A !important;
  color: #E6DCDA !important;
  border-color: #3A3334 !important;
}
html[data-theme="dark"] .msg-chip.is-on {
  background: #E4B6B9 !important;
  color: #1A1213 !important;
  border-color: #E4B6B9 !important;
}
html[data-theme="dark"] .msg-chip.soft {
  background: #221C1D !important;
  color: #E6DCDA !important;
  border-color: #3A3334 !important;
}
html[data-theme="dark"] .msg-badge {
  background: #E4B6B9 !important;
  color: #1A1213 !important;
  border-color: transparent !important;
}
html[data-theme="dark"] .msg-badge.soft {
  background: #2A2224 !important;
  color: #E4B6B9 !important;
  border-color: #4A3A3C !important;
}
html[data-theme="dark"] .chat-compose textarea,
html[data-theme="dark"] .chat-compose input {
  background: #1C191A !important;
  color: #F7F2F1 !important;
  border-color: #4A4143 !important;
}
html[data-theme="dark"] .chat-compose textarea:focus {
  background: #221C1D !important;
  border-color: #E4B6B9 !important;
}
html[data-theme="dark"] .chat-search {
  background: #1C191A !important;
  border-color: #3A3334 !important;
}
html[data-theme="dark"] .chat-send {
  background: #E4B6B9 !important;
  color: #1A1213 !important;
}
html[data-theme="dark"] .chat-unread {
  background: #E4B6B9 !important;
  color: #1A1213 !important;
}
html[data-theme="dark"] .chat-listing-go {
  color: #E4B6B9 !important;
}
html[data-theme="dark"] .chat-empty-card h2,
html[data-theme="dark"] .chat-head-main strong,
html[data-theme="dark"] .chat-row-top strong,
html[data-theme="dark"] .chat-listing strong {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .msg-top a {
  color: inherit !important;
}


/* ========== Form contrast 20 ========== */
html[data-theme="dark"] .price-type,
html[data-theme="dark"] .service-mode {
  background: #1C191A !important;
  border-color: #4A4143 !important;
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .price-type legend,
html[data-theme="dark"] .service-mode legend,
html[data-theme="dark"] .price-type label,
html[data-theme="dark"] .service-mode label {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .form label span {
  color: #D8CECC !important;
}
html[data-theme="dark"] .form,
html[data-theme="dark"] .wizard .step.is-on {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .live-disc {
  color: #E4B6B9 !important;
}
html[data-theme="dark"] .form .hint,
html[data-theme="dark"] .wizard .hint {
  color: #B7AAA8 !important;
}


/* ========== Cab contrast 22 ========== */
.cab-hub,
.cab-win,
.cab-stat,
.empty-card,
.notif-item,
.ticket,
.follow-cat-card,
.follow-banner {
  color: var(--ink);
}
.cab-hub-who h1,
.cab-list-head h2,
.cab-win-top h3,
.cab-win-top a,
.cab-win-price,
.cab-stat b {
  color: var(--ink) !important;
}
.cab-hub-kicker {
  color: var(--accent-deep) !important;
  font-weight: 700 !important;
}
.cab-hub-link {
  background: var(--paper-soft) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
.cab-hub-link span,
.cab-hub-link button,
.cab-hub-form button {
  color: inherit !important;
}
.cab-hub-link.is-on {
  background: var(--ink) !important;
  color: var(--paper) !important;
  border-color: var(--ink) !important;
}
.cab-hub-link.is-on span,
.cab-hub-link.is-on button,
.cab-hub-link.is-on b,
.cab-hub-link.is-on i {
  color: var(--paper) !important;
}
.cab-hub-link b,
.cab-hub-link i {
  background: var(--powder) !important;
  color: var(--ink) !important;
}
.cab-hub .muted,
.cab-list-head .muted,
.cab-win-meta,
.cab-stat span,
.empty-card,
.notif-meta {
  color: var(--muted) !important;
}
.cab-win-body p,
.ticket p,
.notif-body,
.follow-cat-card p {
  color: var(--ink-soft);
}

html[data-theme="dark"] .cab-hub,
html[data-theme="dark"] .cab-win,
html[data-theme="dark"] .ticket,
html[data-theme="dark"] .empty-card,
html[data-theme="dark"] .notif-item {
  background: #171415 !important;
  border-color: #3A3334 !important;
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .cab-stat {
  background: #1C191A !important;
  border-color: #3A3334 !important;
}
html[data-theme="dark"] .cab-hub-link {
  background: #1C191A !important;
  color: #F0E8E7 !important;
  border-color: #4A4143 !important;
}
html[data-theme="dark"] .cab-hub-link.is-on {
  background: #E4B6B9 !important;
  color: #1A1213 !important;
  border-color: #E4B6B9 !important;
}
html[data-theme="dark"] .cab-hub-link.is-on span,
html[data-theme="dark"] .cab-hub-link.is-on button,
html[data-theme="dark"] .cab-hub-link.is-on b,
html[data-theme="dark"] .cab-hub-link.is-on i {
  color: #1A1213 !important;
}
html[data-theme="dark"] .cab-hub-link b,
html[data-theme="dark"] .cab-hub-link i {
  background: #2A2224 !important;
  color: #F0E8E7 !important;
}
html[data-theme="dark"] .cab-hub-link.is-on b,
html[data-theme="dark"] .cab-hub-link.is-on i {
  background: rgba(26,18,19,.18) !important;
  color: #1A1213 !important;
}
html[data-theme="dark"] .cab-hub-who h1,
html[data-theme="dark"] .cab-list-head h2,
html[data-theme="dark"] .cab-win-top h3,
html[data-theme="dark"] .cab-win-top a,
html[data-theme="dark"] .cab-stat b,
html[data-theme="dark"] .cab-win-price {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .cab-hub-kicker {
  color: #E4B6B9 !important;
}
html[data-theme="dark"] .cab-hub .muted,
html[data-theme="dark"] .cab-list-head .muted,
html[data-theme="dark"] .cab-stat span,
html[data-theme="dark"] .cab-win-meta,
html[data-theme="dark"] .empty-card,
html[data-theme="dark"] .notif-meta,
html[data-theme="dark"] .cab-win-body p {
  color: #B7AAA8 !important;
}
html[data-theme="dark"] .cab-pill {
  background: #2A2224 !important;
  color: #E6DCDA !important;
}
html[data-theme="dark"] .cab-pill.ok {
  background: #243028 !important;
  color: #D8E6DA !important;
}
html[data-theme="dark"] .cab-pill.busy {
  background: #2A2224 !important;
  color: #E4B6B9 !important;
}
html[data-theme="dark"] .cab-del {
  color: #E4B6B9 !important;
  border-color: #4A4143 !important;
}
html[data-theme="dark"] .notif-item.is-new {
  background: #1F1A1B !important;
  border-color: #5A484A !important;
}
html[data-theme="dark"] .cab-hub a:not(.btn):not(.cab-hub-link),
html[data-theme="dark"] .cab-win a:not(.btn) {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .cab-hub .btn-primary,
html[data-theme="dark"] .cab-empty .btn-primary {
  color: #1A1213 !important;
}


/* ========== Mode switch 25 ========== */
.app-hub { z-index: 80 !important; overflow: visible !important; }
.app-hub-inner, .hub-row-top, .hub-brand, .hub-tray { overflow: visible !important; }
.mode-switch {
  position: relative !important;
  z-index: 95 !important;
  flex: none !important;
}
.mode-switch.is-open { z-index: 120 !important; }
.mode-switch-menu {
  z-index: 130 !important;
  background: var(--paper) !important;
}
.hub-row-seek.hub-search { z-index: 20 !important; }
html[data-theme="dark"] .mode-switch-btn {
  background: #1C191A !important;
  color: #F0E8E7 !important;
  border-color: #4A4143 !important;
}
html[data-theme="dark"] .mode-switch-menu {
  background: #171415 !important;
  border-color: #3A3334 !important;
}
html[data-theme="dark"] .mode-switch-option {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .mode-switch-option:hover,
html[data-theme="dark"] .mode-switch-option.is-on {
  background: #2A2224 !important;
}


/* ========== Hot rail lace 27 ========== */
.hot-rail {
  background:
    radial-gradient(circle at 8% 18%, rgba(158, 91, 99, 0.1), transparent 42%),
    color-mix(in srgb, var(--powder) 38%, var(--paper)) !important;
  border-color: color-mix(in srgb, var(--accent) 22%, var(--line)) !important;
  box-shadow: var(--cutout) !important;
}
.hot-rail-head h2,
.hot-rail-head h2 em { color: var(--ink) !important; }
.hot-rail-head em { color: var(--accent-deep) !important; }
.hot-rail-sub { color: var(--muted) !important; }
.hot-pill {
  background: var(--paper) !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 18px rgba(42, 36, 38, 0.07) !important;
  color: var(--ink) !important;
}
.hot-pill:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 12px 26px rgba(42, 36, 38, 0.12) !important;
}
.hot-pill strong,
.hot-pill-price strong,
.hot-pill-title,
.hot-pill-body,
.hot-pill a { color: inherit; }
.hot-pill strong,
.hot-pill-price strong { color: var(--ink) !important; }
.hot-pill-title { color: var(--ink-soft) !important; }
.hot-pill-disc {
  color: var(--accent-deep) !important;
  background: var(--accent-soft) !important;
}
.hot-urg {
  color: var(--accent-deep) !important;
  background: var(--accent-soft) !important;
  border-color: color-mix(in srgb, var(--accent) 28%, var(--line)) !important;
}
.hot-rail-more {
  background: var(--paper) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}

html[data-theme="dark"] .hot-rail {
  background:
    radial-gradient(circle at 10% 20%, rgba(228, 182, 185, 0.12), transparent 45%),
    #1A1516 !important;
  border-color: #4A3A3C !important;
}
html[data-theme="dark"] .hot-rail::before,
html[data-theme="dark"] .hot-rail::after {
  background:
    radial-gradient(circle at 8px 0, transparent 6px, #5A484A 6.5px) 0 0 / 16px 10px repeat-x !important;
  opacity: .7;
}
html[data-theme="dark"] .hot-rail-head h2,
html[data-theme="dark"] .hot-pill,
html[data-theme="dark"] .hot-pill strong,
html[data-theme="dark"] .hot-pill-price strong {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .hot-rail-head em {
  color: #E4B6B9 !important;
}
html[data-theme="dark"] .hot-rail-sub,
html[data-theme="dark"] .hot-pill-title {
  color: #C9BDBB !important;
}
html[data-theme="dark"] .hot-pill {
  background: #221C1D !important;
  border-color: #4A4143 !important;
}
html[data-theme="dark"] .hot-pill-photo {
  border-color: #6A5557 !important;
  box-shadow: 0 0 0 3px rgba(228, 182, 185, 0.12) !important;
  background: #2A2224 !important;
}
html[data-theme="dark"] .hot-pill-disc,
html[data-theme="dark"] .hot-urg {
  background: #2A2224 !important;
  color: #E4B6B9 !important;
  border-color: #5A484A !important;
}
html[data-theme="dark"] .hot-rail-more {
  background: #1C191A !important;
  color: #F0E8E7 !important;
  border-color: #4A4143 !important;
}
html[data-theme="dark"] .hot-rail a.hot-pill {
  color: #F7F2F1 !important;
}


/* ========== Cat icons 28 ========== */
.cat {
  text-transform: none !important;
  letter-spacing: 0.01em !important;
  font-family: var(--font) !important;
  font-size: .84rem !important;
  font-weight: 600 !important;
  border-style: solid !important;
  border-radius: var(--radius-pill) !important;
}
.cat-ico,
svg.cat-ico {
  width: 20px !important;
  height: 20px !important;
  max-width: 20px !important;
  max-height: 20px !important;
  border: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  color: var(--accent-deep) !important;
}
.cat.is-on .cat-ico { color: var(--ink) !important; }
html[data-theme="dark"] .cat-ico,
html[data-theme="dark"] .cat.is-on .cat-ico {
  color: #E4B6B9 !important;
}


/* ========== Seller profile contrast 29 ========== */
.vk-profile {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--cutout);
  color: var(--ink);
  overflow: hidden;
}
.vk-name,
.vk-id-main h1,
.vk-card h3,
.vk-body,
.vk-body p,
.vk-rating b {
  color: var(--ink) !important;
}
.vk-status,
.vk-about-line,
.vk-counter span,
.tmblr-body {
  color: var(--muted) !important;
}
.vk-tab {
  background: var(--paper-soft) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
.vk-tab.is-on {
  background: var(--ink) !important;
  color: var(--paper) !important;
  border-color: var(--ink) !important;
}
.preview-bar {
  background: var(--paper) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}
.preview-bar span,
.preview-bar a:not(.btn-primary) {
  color: var(--ink) !important;
}
.vk-avatar {
  border-color: var(--paper) !important;
}

html[data-theme="dark"] .vk-profile,
html[data-theme="dark"] .vk-card,
html[data-theme="dark"] .tmblr-post,
html[data-theme="dark"] .tmblr-tile,
html[data-theme="dark"] .preview-bar,
html[data-theme="dark"] .review {
  background: #171415 !important;
  border-color: #3A3334 !important;
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .vk-name,
html[data-theme="dark"] .vk-id-main h1,
html[data-theme="dark"] .vk-card h3,
html[data-theme="dark"] .vk-body,
html[data-theme="dark"] .vk-body p,
html[data-theme="dark"] .vk-rating b,
html[data-theme="dark"] .preview-bar span,
html[data-theme="dark"] .preview-bar a:not(.btn-primary) {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .vk-status,
html[data-theme="dark"] .vk-about-line,
html[data-theme="dark"] .vk-counter span,
html[data-theme="dark"] .tmblr-body,
html[data-theme="dark"] .muted {
  color: #B7AAA8 !important;
}
html[data-theme="dark"] .vk-counter {
  background: #1C191A !important;
  border-color: #4A4143 !important;
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .vk-counter b {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .vk-counter.is-on {
  background: #2A2224 !important;
  border-color: #6A5557 !important;
  color: #E4B6B9 !important;
}
html[data-theme="dark"] .vk-tab {
  background: #1C191A !important;
  color: #E6DCDA !important;
  border-color: #4A4143 !important;
}
html[data-theme="dark"] .vk-tab.is-on {
  background: #E4B6B9 !important;
  color: #1A1213 !important;
  border-color: #E4B6B9 !important;
}
html[data-theme="dark"] .vk-avatar {
  border-color: #171415 !important;
}
html[data-theme="dark"] .vk-id-actions .btn-ghost,
html[data-theme="dark"] .preview-bar .btn-ghost {
  color: #E6DCDA !important;
  border-color: #4A4143 !important;
}
html[data-theme="dark"] .vk-id-actions .btn-primary,
html[data-theme="dark"] .preview-bar .btn-primary {
  color: #1A1213 !important;
}
html[data-theme="dark"] .vk-cover-edit,
html[data-theme="dark"] .vk-avatar-edit {
  color: #F7F2F1 !important;
  background: rgba(0,0,0,.55) !important;
}
html[data-theme="dark"] .service-row,
html[data-theme="dark"] .vk-side .vk-card p {
  color: #E6DCDA !important;
}


/* SBP pay demo */
.pay-sbp .sbp-qr { text-align: center; margin-bottom: .8rem; }
.sbp-qr-box {
  width: 148px; height: 148px; margin: 0 auto .55rem;
  display: grid; place-items: center;
  border: 2px dashed var(--ink); border-radius: 12px;
  font-family: var(--font-display); font-size: 1.6rem; font-weight: 600;
  background:
    repeating-linear-gradient(0deg, transparent, transparent 7px, color-mix(in srgb, var(--ink) 12%, transparent) 7px, color-mix(in srgb, var(--ink) 12%, transparent) 8px),
    repeating-linear-gradient(90deg, transparent, transparent 7px, color-mix(in srgb, var(--ink) 12%, transparent) 7px, color-mix(in srgb, var(--ink) 12%, transparent) 8px),
    var(--paper);
}
.pay-split { margin: .6rem 0; padding-left: 1.1rem; }
.pay-split li { margin: .2rem 0; }

/* Wallet chip + bank screen */
.wallet-chip {
  display: flex; align-items: center; gap: .75rem;
  margin: .85rem 0 1rem; padding: .85rem 1.05rem;
  text-decoration: none; color: var(--ink);
  background: var(--paper);
  border: 2px solid var(--ink);
  border-radius: 4px 18px 8px 14px;
  box-shadow: var(--cutout);
  transition: transform .15s ease, background .15s ease;
}
.wallet-chip:hover { transform: translateY(-1px); background: var(--powder); }
.wallet-chip-label {
  font-size: .72rem; text-transform: uppercase; letter-spacing: .08em;
  color: var(--muted); font-weight: 600;
}
.wallet-chip-sum { flex: 1; font-size: 1.35rem; font-family: var(--font-display); font-weight: 600; }
.wallet-chip-go { font-size: 1.2rem; opacity: .55; }

.wallet-bank { max-width: 32rem; margin: 0 auto; }
.wallet-bank-back { margin: 0 0 .75rem; }
.wallet-bank-back a { color: var(--muted); text-decoration: none; }
.wallet-bank-card {
  padding: 1.25rem 1.35rem 1.35rem;
  background: linear-gradient(145deg, color-mix(in srgb, var(--accent) 18%, var(--paper)), var(--paper));
  border: 2px solid var(--ink);
  border-radius: 6px 22px 10px 16px;
  box-shadow: var(--cutout);
}
.wallet-bank-label {
  margin: 0; font-size: .75rem; text-transform: uppercase; letter-spacing: .1em; color: var(--muted);
}
.wallet-bank-sum {
  margin: .35rem 0 .5rem; font-size: clamp(2rem, 6vw, 2.6rem);
  font-family: var(--font-display); font-weight: 600; line-height: 1.1;
}
.wallet-bank-hint { margin: 0 0 1rem; color: var(--muted); font-size: .9rem; }
.wallet-bank-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.wallet-bank-panel { margin-top: 1rem; }
.wallet-bank-pending { margin-top: 1.1rem; }
.wallet-bank-pending h2, .wallet-bank-ops h2 { font-size: 1.05rem; margin: 0 0 .55rem; }
.wallet-bank-ops { margin-top: 1.4rem; }
.wallet-ops-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.wallet-op {
  display: flex; justify-content: space-between; align-items: flex-start; gap: .75rem;
  padding: .7rem .85rem;
  border: 1.5px dashed var(--line); border-radius: 4px 12px;
  background: var(--paper);
}
.wallet-op div { display: grid; gap: .15rem; min-width: 0; }
.wallet-op b { white-space: nowrap; font-variant-numeric: tabular-nums; }
.wallet-op.is-in b { color: #2a7a4b; }
.wallet-op.is-out b { color: var(--accent-hot, #c45c5c); }
html[data-theme="dark"] .wallet-op.is-in b { color: #7dcea0; }

/* ========== Admin panel ========== */
.admin-hub { margin-bottom: 1rem; }
.admin-body { color: var(--ink); }
.admin-lede { margin: 0 0 1rem; max-width: 40rem; }
.admin-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .5rem;
  margin: 0 0 1.25rem;
}
@media (min-width: 700px) {
  .admin-stats { grid-template-columns: repeat(4, 1fr); }
}
.admin-table-wrap {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
  box-shadow: var(--cutout);
  margin: 0 0 1.25rem;
}
.admin-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 560px;
}
.admin-table th,
.admin-table td {
  text-align: left;
  padding: .75rem .9rem;
  border-bottom: 1px solid var(--line);
  font-size: .92rem;
  color: var(--ink);
  vertical-align: top;
}
.admin-table th {
  background: var(--paper-soft);
  color: var(--muted);
  font-weight: 700;
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.admin-table tbody tr:last-child td { border-bottom: 0; }
.admin-table a { color: var(--ink); text-decoration: underline; text-underline-offset: 2px; }
.admin-table .muted { color: var(--muted); font-size: .82rem; margin-top: .15rem; }
.admin-table form { margin: 0; }
.admin-user-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  justify-content: flex-end;
}
.admin-user-actions .inline-form { display: inline; }
.admin-inline { display: inline-block; margin: 0 .25rem .25rem 0; }
.admin-mod-card {
  margin-bottom: 1rem;
  padding: 1rem 1.1rem;
  color: var(--ink);
}
.admin-mod-card h2 { margin: 0 0 .35rem; font-size: 1.15rem; }
.admin-mod-card p { color: var(--ink-soft); }
.admin-mod-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  align-items: flex-end;
  margin-top: .85rem;
}
.admin-reject-form {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  align-items: flex-end;
  flex: 1;
  min-width: 220px;
  margin: 0;
}
.admin-reject-form label {
  flex: 1;
  min-width: 160px;
  margin: 0;
  display: grid;
  gap: .25rem;
}
.admin-reject-form label span {
  font-size: .8rem;
  font-weight: 700;
  color: var(--muted);
}
.admin-reject-form input {
  width: 100%;
  padding: .55rem .7rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--paper-soft);
  color: var(--ink);
  font: inherit;
}
.admin-body .form.wide {
  margin-top: .5rem;
  max-width: 420px;
}
.admin-body .form h3 {
  margin: 0 0 .5rem;
  font-size: 1.05rem;
  color: var(--ink);
}

html[data-theme="dark"] .admin-table-wrap,
html[data-theme="dark"] .admin-mod-card {
  background: #171415 !important;
  border-color: #3A3334 !important;
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .admin-table th {
  background: #1C191A !important;
  color: #B7AAA8 !important;
}
html[data-theme="dark"] .admin-table th,
html[data-theme="dark"] .admin-table td {
  border-bottom-color: #3A3334 !important;
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .admin-table a {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .admin-table .muted,
html[data-theme="dark"] .admin-lede,
html[data-theme="dark"] .admin-mod-card .muted,
html[data-theme="dark"] .admin-reject-form label span {
  color: #B7AAA8 !important;
}
html[data-theme="dark"] .admin-mod-card p {
  color: #E6DCDA !important;
}
html[data-theme="dark"] .admin-reject-form input {
  background: #1C191A !important;
  border-color: #4A4143 !important;
  color: #F7F2F1 !important;
}

/* ========== Admin payout dialog ========== */
.admin-dialog {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 0;
  max-width: min(440px, calc(100vw - 2rem));
  width: 100%;
  background: var(--paper);
  color: var(--ink);
  box-shadow: 0 18px 48px rgba(0,0,0,.28);
}
.admin-dialog::backdrop {
  background: rgba(20, 14, 16, .55);
}
.admin-dialog-form {
  margin: 0;
  max-width: none;
  padding: 1.1rem 1.15rem 1.2rem;
  gap: .75rem;
}
.admin-dialog-form h2 {
  margin: 0;
  font-size: 1.2rem;
  color: var(--ink);
}
.admin-dialog-meta {
  margin: 0;
  color: var(--muted);
  font-size: .92rem;
}
.admin-outcome {
  margin: 0;
  padding: .75rem .85rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--paper-soft);
  display: grid;
  gap: .45rem;
}
.admin-outcome legend {
  padding: 0 .25rem;
  font-size: .8rem;
  font-weight: 700;
  color: var(--muted);
}
.admin-dialog-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: .25rem;
}
.admin-receipt-field[hidden] { display: none !important; }

html[data-theme="dark"] .admin-dialog {
  background: #171415 !important;
  border-color: #3A3334 !important;
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .admin-dialog-form h2,
html[data-theme="dark"] .admin-dialog-form {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .admin-outcome {
  background: #1C191A !important;
  border-color: #3A3334 !important;
}
html[data-theme="dark"] .admin-dialog-meta,
html[data-theme="dark"] .admin-outcome legend {
  color: #B7AAA8 !important;
}

/* ========== Payout status badges & cards ========== */
.payout-badge {
  display: inline-flex;
  align-items: center;
  min-height: 1.55rem;
  padding: .15rem .55rem;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 750;
  letter-spacing: .02em;
  border: 1px solid var(--line);
  background: var(--paper-soft);
  color: var(--ink);
  white-space: nowrap;
}
.payout-badge.is-pending {
  background: #F6E7C8;
  border-color: #E2C78A;
  color: #6A4E12;
}
.payout-badge.is-paid {
  background: #D8F0DF;
  border-color: #9DD4AD;
  color: #1F6B3A;
}
.payout-badge.is-failed,
.payout-badge.is-rejected {
  background: #F4D9D9;
  border-color: #E0A8A8;
  color: #8A2F2F;
}
.payout-view-status { margin: 0 0 .35rem; }
.payout-view-dl {
  margin: 0;
  display: grid;
  gap: .55rem;
}
.payout-view-dl > div {
  display: grid;
  grid-template-columns: 7.5rem 1fr;
  gap: .5rem;
  align-items: start;
}
.payout-view-dl dt {
  margin: 0;
  color: var(--muted);
  font-size: .82rem;
  font-weight: 700;
}
.payout-view-dl dd {
  margin: 0;
  color: var(--ink);
  word-break: break-word;
}
.payout-view-receipt { margin-top: .35rem; }
.payout-receipt-preview {
  display: block;
  width: 100%;
  max-height: 280px;
  object-fit: contain;
  margin-top: .55rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--paper-soft);
}
.payout-card {
  display: grid;
  gap: .2rem;
  padding: .75rem .85rem;
  margin: 0 0 .55rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--paper);
}
.payout-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
}
.payout-card p { margin: 0; }
.payout-card.is-paid { border-color: #9DD4AD; }
.payout-card.is-pending { border-color: #E2C78A; }

html[data-theme="dark"] .payout-badge.is-pending {
  background: #3A3220;
  border-color: #6A5A32;
  color: #F0D9A0;
}
html[data-theme="dark"] .payout-badge.is-paid {
  background: #1F3A28;
  border-color: #3F6B4D;
  color: #A8E0B8;
}
html[data-theme="dark"] .payout-badge.is-failed,
html[data-theme="dark"] .payout-badge.is-rejected {
  background: #3A2222;
  border-color: #6A3A3A;
  color: #F0B0B0;
}
html[data-theme="dark"] .payout-card {
  background: #171415 !important;
  border-color: #3A3334 !important;
}
html[data-theme="dark"] .payout-view-dl dd,
html[data-theme="dark"] .payout-card-top strong {
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .payout-receipt-preview {
  background: #1C191A !important;
  border-color: #3A3334 !important;
}

/* ========== Moderation notices / ban wall ========== */
.ban-wall {
  min-height: 60vh;
  display: grid;
  place-items: center;
  padding: 2rem 1rem;
}
.ban-wall-card {
  max-width: 420px;
  width: 100%;
  padding: 1.4rem 1.3rem;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--cutout);
  color: var(--ink);
  display: grid;
  gap: .65rem;
}
.ban-wall-card h1 { margin: 0; font-size: 1.45rem; }
.ban-wall-card p { margin: 0; color: var(--ink-soft); white-space: pre-wrap; }
.mod-notice-dialog {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 0;
  max-width: min(440px, calc(100vw - 2rem));
  width: 100%;
  background: var(--paper);
  color: var(--ink);
  box-shadow: 0 18px 48px rgba(0,0,0,.28);
}
.mod-notice-dialog::backdrop { background: rgba(20, 14, 16, .6); }
.mod-notice-body {
  margin: 0;
  white-space: pre-wrap;
  color: var(--ink-soft);
  line-height: 1.45;
}
html[data-theme="dark"] .ban-wall-card,
html[data-theme="dark"] .mod-notice-dialog {
  background: #171415 !important;
  border-color: #3A3334 !important;
  color: #F7F2F1 !important;
}
html[data-theme="dark"] .ban-wall-card p,
html[data-theme="dark"] .mod-notice-body {
  color: #E6DCDA !important;
}

/* ========== Wizard step errors ========== */
.wizard-step-error {
  margin: .35rem 0 .75rem;
}
.wizard-step-error[hidden] {
  display: none !important;
}
.wizard .step.is-on .wizard-step-error:not([hidden]) {
  display: block;
}

/* ========== Admin hub pill ========== */
.hub-pill-admin {
  border-color: var(--ink);
  font-weight: 750;
}
.hub-pill-admin.is-on {
  background: var(--ink) !important;
  color: var(--paper) !important;
  border-color: var(--ink) !important;
}
.hub-pill-admin.is-on i {
  background: rgba(255,255,255,.25) !important;
  color: #fff !important;
}
html[data-theme="dark"] .hub-pill-admin {
  border-color: #E4B6B9;
  color: #F7F2F1;
}
html[data-theme="dark"] .hub-pill-admin.is-on {
  background: #E4B6B9 !important;
  color: #1A1213 !important;
  border-color: #E4B6B9 !important;
}
html[data-theme="dark"] .hub-pill-admin.is-on i {
  background: rgba(0,0,0,.2) !important;
  color: #1A1213 !important;
}