/* ==========================================================================
   Posodi.si – account & owner area ("Moj račun", "Moja ponudba")
   --------------------------------------------------------------------------
   Only what app.css does not already have. Loaded on every page, so every
   selector is either prefixed (.ow-* owner, .ac-* account) or scoped to the
   body classes these templates set (.page-dash, .page-owner, .page-auth).
   Tokens, radii and shadows come from app.css :root – no new colours.

   Contents
     01  Shared bits (quiet rows, notices with actions, inline forms, heads)
     02  Auth pages (password toggle, state screens) and profile
     03  Dashboard: first visit, request cards, deadline chip, agenda, mini cards
     04  Items list
     05  Item form (sections, repeating rows, price preview, sticky actions)
     06  Images (upload, picked previews, tiles, tips)
     07  Owner calendar (.ocal extras, action bar, lists)
     08  Bookings list + booking detail
     09  Payouts
   ========================================================================== */


/* ==========================================================================
   01  Shared
   ========================================================================== */
.ow-inline-form { display: contents; }
.ow-narrow { max-width: 760px; }

/* A calm one-line state instead of an empty box ("Ni povpraševanj …") */
.ow-quiet {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 18px;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--surface);
  color: var(--muted);
  font-size: .9375rem;
  line-height: 1.45;
}
.ow-quiet > .icon { --icon-size: 18px; margin-top: 1px; color: var(--muted); }
.ow-quiet--sm { padding: 0; border: 0; background: none; font-size: var(--text-sm); }

/* Notices that carry an action (verify e-mail, connect payouts) */
.ow-notice__form { margin-top: 10px; }

/* Page head with breadcrumbs + status line under the title */
.ow-head .crumbs { margin-bottom: var(--s-3); }
.ow-head__status { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.ow-head__status > span:not(.pill) { min-width: 0; overflow-wrap: anywhere; }
.page-dash .page-head__actions .btn { flex: none; }

.ow-iconline { display: inline-flex; align-items: center; gap: 5px; }
.ow-dim .brow__thumb img { filter: saturate(.55); }

/* Step indicator reused from the booking flow (new item → photos → publish).
   ol.ow-steps: app.css's `ol[class] { margin: 0 }` reset outranks `.steps { margin-bottom }` */
ol.ow-steps { max-width: 560px; margin-bottom: var(--s-6); }

.js .ow-nojs { display: none; }


/* ==========================================================================
   02  Auth pages & profile
   ========================================================================== */
.page-auth .auth .panel { box-shadow: var(--shadow-1); }
.ac-label-row { display: flex; align-items: baseline; justify-content: space-between; gap: var(--s-3); }
.ac-label-row a { font-weight: 550; }

/* password + "Pokaži" */
.ac-pw .input { min-width: 0; }
.ac-pw__toggle { min-width: 84px; font-size: var(--text-sm); color: var(--ink-2); }

/* "Preveri e-pošto" / "Povezava je potekla" */
.ac-state { display: grid; justify-items: center; text-align: center; }
.ac-state .auth__lead { max-width: 40ch; }
.ac-state__icon {
  display: grid;
  place-items: center;
  width: 60px;
  height: 60px;
  margin-bottom: var(--s-4);
  border-radius: 50%;
  background: var(--canvas-deep);
  color: var(--ink-2);
}
.ac-state__icon .icon { --icon-size: 28px; }
.ac-state__icon--ok { background: var(--ok-50); color: var(--ok); }
.ac-state__icon--warn { background: var(--warn-50); color: var(--warn-ink); }
.ac-state__actions { justify-content: center; }

/* Profile: e-mail block */
.ac-email { display: flex; align-items: center; gap: 14px; }
.ac-email__icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--canvas);
  color: var(--ink-2);
}
.ac-email__text { min-width: 0; }
.ac-email__addr { font-weight: 620; overflow-wrap: anywhere; }
.ac-email__state { display: inline-flex; align-items: center; gap: 5px; font-size: var(--text-sm); font-weight: 600; }
.ac-email__state.is-ok { color: var(--ok-ink); }
.ac-email__state.is-warn { color: var(--warn-ink); }
.ac-email__verify {
  display: grid;
  gap: 10px;
  justify-items: start;
  margin-top: var(--s-4);
  padding: 14px 16px;
  border: 1px solid #EED6A8;
  border-radius: var(--r-md);
  background: var(--warn-50);
}
.ac-email__verify .small { color: var(--ink-2); }


/* ==========================================================================
   03  Dashboard
   ========================================================================== */
.page-owner .block__title { display: inline-flex; align-items: center; gap: 8px; }

/* First visit – one clear invitation with the blank hang tag */
.ow-start {
  display: grid;
  gap: var(--s-6);
  padding: clamp(24px, 4vw, 44px);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  background: var(--surface);
}
.ow-start__art { padding: 18px 0 18px 30px; margin-bottom: var(--s-3); }
.ow-start__art .tag { --tag-rot: -6deg; }
.ow-start__title { font-size: var(--text-2xl); margin-bottom: var(--s-2); }
.ow-start__intro p { color: var(--ink-2); max-width: 44ch; }
.ow-start__intro .btn { margin-top: var(--s-5); }
.ow-start__steps { display: grid; gap: 10px; }
.ow-start__steps li { display: flex; gap: 14px; align-items: flex-start; padding: 14px 16px; border-radius: var(--r-md); background: var(--canvas-soft); }
.ow-start__num {
  display: grid;
  place-items: center;
  flex: none;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--surface);
  box-shadow: inset 0 0 0 1.5px var(--line-strong);
  font-family: var(--font-display);
  font-weight: 700;
}
.ow-start__steps li:first-child .ow-start__num { background: var(--violet); color: #fff; box-shadow: none; }
.ow-start__step { font-weight: 650; }
@media (min-width: 900px) {
  .ow-start { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: var(--s-7); }
}

/* Reply deadline chip – owner.js turns it into a live countdown */
.ow-due {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 3px 11px 3px 9px;
  border-radius: var(--r-pill);
  background: var(--warn-50);
  color: var(--warn-ink);
  font-size: var(--text-sm);
  font-weight: 650;
  line-height: 1.2;
}
.ow-due.is-urgent, .ow-due.is-over { background: var(--danger-50); color: var(--danger-ink); }
.ow-due--inline { min-height: 0; padding: 0; background: none !important; }

/* Request cards ("Čakajo na tvoj odgovor") */
.ow-reqs { display: grid; gap: var(--s-3); }
.ow-req {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid #EED6A8;
  border-radius: var(--r-lg);
  background: var(--surface);
  box-shadow: var(--shadow-1);
}
.ow-req__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.ow-req__code { color: var(--muted); font-size: var(--text-xs); font-weight: 600; letter-spacing: .04em; font-variant-numeric: tabular-nums; }
.ow-req__body { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 4px 14px; align-items: start; }
.ow-req__thumb { grid-row: span 2; width: 64px; height: 64px; overflow: hidden; border-radius: var(--r-md); background: var(--canvas-deep); }
.ow-req__thumb img { width: 100%; height: 100%; object-fit: cover; }
.ow-req__thumb .ph .icon { width: 50%; }
.ow-req__info { min-width: 0; display: grid; gap: 3px; }
.ow-req__title { font-family: var(--font-body); font-size: var(--text-md); font-weight: 650; line-height: 1.3; letter-spacing: 0; }
.ow-req__title a { color: var(--ink); text-decoration: none; }
.ow-req__title a:hover { text-decoration: underline; text-underline-offset: .18em; }
.ow-req__when { color: var(--ink-2); font-weight: 550; }
.ow-req__units { margin-left: 8px; color: var(--muted); font-weight: 500; white-space: nowrap; }
.ow-req__who { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: var(--text-sm); }
.ow-req__money { grid-column: 2; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; }
.ow-req__amount { font-family: var(--font-display); font-size: var(--text-lg); font-weight: 680; font-variant-numeric: tabular-nums; }
.ow-req__note { color: var(--muted); font-size: var(--text-xs); font-weight: 550; }
.ow-req__msg {
  padding: 10px 14px;
  border-radius: var(--r-md);
  background: var(--canvas-soft);
  color: var(--ink-2);
  font-size: var(--text-sm);
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ow-req__msg::before { content: "»"; }
.ow-req__msg::after { content: "«"; }
.ow-req__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ow-req__actions .btn { width: 100%; }
.ow-req__more { grid-column: 1 / -1; min-height: 38px; }
@media (min-width: 560px) {
  .ow-req { padding: 18px 20px; }
  .ow-req__body { grid-template-columns: 88px minmax(0, 1fr) auto; }
  .ow-req__thumb { grid-row: auto; width: 88px; height: 66px; }
  .ow-req__money { grid-column: 3; flex-direction: column; align-items: flex-end; gap: 0; text-align: right; }
  .ow-req__actions { display: flex; flex-wrap: wrap; }
  .ow-req__actions .btn { width: auto; }
  .ow-req__actions > form .btn, .ow-req__actions > .btn--primary { min-width: 140px; }
  .ow-req__more { margin-left: auto; grid-column: auto; min-height: 44px; }
}

/* Upcoming rentals as an agenda with a date block */
.ow-agenda { border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); overflow: hidden; }
.ow-agenda > li + li { border-top: 1px solid var(--line); }
.ow-agenda__item {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 12px 16px;
  color: var(--ink);
  text-decoration: none;
}
.ow-agenda__item:hover { background: var(--canvas-soft); }
.ow-agenda__item:hover .ow-agenda__title { text-decoration: underline; text-underline-offset: .18em; }
.ow-agenda__item:focus-visible { outline-offset: -2px; }
.ow-agenda__date {
  display: grid;
  justify-items: center;
  gap: 2px;
  padding: 7px 0 8px;
  border-radius: var(--r-md);
  background: var(--ok-50);
  color: var(--ok-ink);
  line-height: 1;
}
.ow-agenda__wd, .ow-agenda__mon { font-size: .6875rem; font-weight: 650; }
.ow-agenda__day { font-family: var(--font-display); font-size: 1.375rem; font-weight: 720; font-variant-numeric: tabular-nums; }
.ow-agenda__main { min-width: 0; display: grid; gap: 3px; }
.ow-agenda__title { font-weight: 620; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ow-agenda__meta { display: flex; flex-wrap: wrap; gap: 2px 14px; color: var(--muted); font-size: var(--text-sm); }
.ow-agenda__meta > span { display: inline-flex; align-items: center; gap: 5px; }
.ow-agenda__side { display: grid; justify-items: end; gap: 2px; text-align: right; }
.ow-agenda__rel { color: var(--muted); font-size: var(--text-xs); font-weight: 600; }
.ow-agenda__rel.is-soon { color: var(--violet); }
.ow-agenda__amount { font-family: var(--font-display); font-weight: 650; font-variant-numeric: tabular-nums; }

/* Mini item cards – same anatomy as the public card (tag over the photo) */
.ow-minis { display: grid; gap: var(--s-6) var(--s-3); grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 720px) { .ow-minis { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-6) var(--s-4); } }
@media (max-width: 380px) { .ow-mini__tag { margin-left: 8px; } .ow-mini__tag .tag__amount { font-size: 1.0625rem; } }
.ow-mini { position: relative; display: grid; grid-template-rows: auto 1fr; grid-template-columns: minmax(0, 1fr); min-width: 0; }
.ow-mini__media { grid-row: 1; grid-column: 1; position: relative; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--r-lg); background: var(--canvas-deep); }
.ow-mini__media img { width: 100%; height: 100%; object-fit: cover; }
.ow-mini__media::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(23, 38, 43, .06); pointer-events: none; }
.ow-mini__status { position: absolute; top: 8px; left: 8px; z-index: 1; }
.ow-mini__status .pill { box-shadow: 0 1px 3px rgba(23, 38, 43, .18); }
.ow-mini__status .pill--muted, .ow-mini__status .pill--neutral { background: var(--surface); }
.ow-mini__tag { grid-row: 1; grid-column: 1; align-self: end; justify-self: start; z-index: 2; margin: 0 0 -16px 12px; pointer-events: none; }
.ow-mini__body { grid-row: 2; display: grid; gap: 6px; align-content: start; padding: 26px 2px 0; }
.ow-mini__title {
  color: var(--ink);
  font-weight: 620;
  line-height: 1.3;
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ow-mini__title:hover { text-decoration: underline; text-underline-offset: .18em; }
.ow-mini__links { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: var(--text-sm); }
.ow-mini__links a { display: inline-flex; align-items: center; gap: 5px; font-weight: 600; text-decoration: none; }
.ow-mini__links a:hover { text-decoration: underline; }


/* ==========================================================================
   04  Items list
   ========================================================================== */
.ow-items { display: grid; gap: var(--s-3); }
.ow-item {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 14px 16px;
  align-items: start;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--surface);
}
.ow-item__media { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--r-md); background: var(--canvas-deep); }
.ow-item__media img { width: 100%; height: 100%; object-fit: cover; }
.ow-item__media .ph .icon { width: 34%; }
.ow-item__nophoto { position: absolute; left: 0; right: 0; bottom: 6px; color: var(--muted); font-size: .6875rem; font-weight: 650; text-align: center; }
.ow-item__main { min-width: 0; display: grid; gap: 10px; }
.ow-item__top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.ow-item__title { font-family: var(--font-body); font-size: var(--text-md); font-weight: 650; line-height: 1.3; letter-spacing: 0; min-width: 0; overflow-wrap: anywhere; }
.ow-item__title a { color: var(--ink); text-decoration: none; }
.ow-item__title a:hover { text-decoration: underline; text-underline-offset: .18em; }
.ow-item__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; color: var(--muted); font-size: var(--text-sm); }
.ow-item__price { display: inline-flex; padding: 6px 0 2px 16px; }
.ow-item__price .tag { --tag-h: 30px; --hole-x: 10px; --chamfer: 9px; }
.ow-item__price .tag__amount { font-size: 1.0625rem; }
.ow-item__price .tag__unit { font-size: .75rem; }
.ow-item__fact { display: inline-flex; align-items: center; gap: 5px; }
.ow-item__fact.is-busy { color: var(--ok-ink); font-weight: 600; }
.ow-item__note { display: flex; align-items: flex-start; gap: 7px; color: var(--muted); font-size: var(--text-sm); line-height: 1.45; }
.ow-item__note > .icon { margin-top: 2px; }
.ow-item__note.is-danger { padding: 9px 12px; border-radius: var(--r-sm); background: var(--danger-50); color: var(--danger-ink); }
.ow-item__note.is-danger strong { font-weight: 650; }
.ow-item__actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.ow-more { margin-left: auto; }
.ow-dots { fill: currentColor; stroke: none; }
.ow-more .menu__panel { min-width: 220px; }
.ow-menu-danger, .ow-menu-danger .icon { color: var(--danger-ink) !important; }
.ow-item.is-archived .ow-item__media img { filter: grayscale(1); opacity: .7; }
.ow-item.is-archived .ow-item__title a { color: var(--ink-2); }
/* an open "⋯" menu must float above the next card */
.ow-item { position: relative; }
.ow-item:has(.ow-more[open]) { z-index: 5; }
@media (max-width: 519px) {
  /* phone: thumbnail + title on top, facts and notes use the full card width */
  .ow-item { grid-template-columns: 76px minmax(0, 1fr); gap: 12px; }
  .ow-item__main { display: contents; }
  .ow-item__media { grid-row: 1; grid-column: 1; }
  .ow-item__top { grid-row: 1; grid-column: 2; align-self: center; }
  .ow-item__meta, .ow-item__note { grid-column: 1 / -1; }
  .ow-item__meta { gap: 6px 14px; }
  /* phone: secondary actions become icon buttons; the label stays for screen readers */
  .ow-item__actions .btn--secondary { width: 40px; padding: 0; }
  .ow-item__actions .btn--secondary > span {
    position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap;
  }
}
@media (min-width: 720px) {
  .ow-item { grid-template-columns: 148px minmax(0, 1fr); padding: 16px; }
  .ow-item__actions { grid-column: 2; padding-top: 12px; }
}

.ow-archive { margin-top: var(--s-6); }
.ow-archive > summary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 2px;
  color: var(--ink-2);
  font-weight: 620;
  list-style: none;
  cursor: pointer;
}
.ow-archive > summary::-webkit-details-marker { display: none; }
.ow-archive > summary .chev { transition: rotate var(--t-fast); rotate: -90deg; }
.ow-archive[open] > summary .chev { rotate: 0deg; }


/* ==========================================================================
   05  Item form
   ========================================================================== */
.ow-jump { margin-bottom: var(--s-5); }
@media (min-width: 960px) {
  .ow-jump { flex-wrap: wrap; margin-inline: 0; padding-inline: 0; overflow: visible; }
}
ul.ow-errlist { margin: 4px 0 0; padding-left: 1.1em; list-style: disc; }
.ow-errlist li + li { margin-top: 2px; }
.ow-errlist a { color: var(--danger-ink); font-weight: 650; }
[data-error-summary]:focus { outline: 2px solid var(--danger); outline-offset: 2px; }

.ow-form { display: grid; gap: var(--s-4); }
.ow-form > .panel + .panel { margin-top: 0; }
.ow-sec { scroll-margin-top: calc(var(--header-h) + var(--s-4)); }
.ow-sec__head { margin-bottom: var(--s-5); }
.ow-sec__title { font-size: var(--text-xl); }
.ow-sec__title .opt { font-family: var(--font-body); font-size: var(--text-sm); font-weight: 400; color: var(--muted); letter-spacing: 0; }
.ow-sec__intro { margin-top: 4px; color: var(--muted); font-size: var(--text-sm); max-width: 62ch; }
.ow-w-md { max-width: 420px; }
[id="ow-tiers"], [id="ow-handover"] { scroll-margin-top: calc(var(--header-h) + var(--s-6)); }

/* pricing mode as two option cards */
.ow-radio-2 .check__text { font-weight: 620; }
.ow-radio-2 .check__text small { margin-top: 3px; font-weight: 400; line-height: 1.45; }
@media (min-width: 640px) { .ow-radio-2 .checks { grid-template-columns: 1fr 1fr; } }

/* repeating rows: tiers and specs */
.ow-tiers > .help { margin-bottom: 4px; }
.ow-rows { display: grid; gap: 8px; }
.ow-tiers .ow-rows:not(:empty) { margin-bottom: 4px; }
.ow-row { display: grid; gap: 8px; align-items: center; }
.ow-row--tier { grid-template-columns: 1.4rem minmax(0, 9rem) 1.4rem minmax(0, 13rem) 36px; justify-content: start; }
.ow-row__word { color: var(--muted); font-weight: 600; font-size: var(--text-sm); }
.ow-row__arrow { text-align: center; }
.ow-row__min .input, .ow-row__price .input { min-width: 0; }
.ow-row__remove { color: var(--muted); }
.ow-row__remove:hover { color: var(--danger-ink); }
@media (max-width: 559px) {
  .ow-row--tier {
    grid-template-columns: 1.4rem minmax(0, 1fr) 36px;
    padding: 10px 10px 10px 12px;
    border-radius: var(--r-md);
    background: var(--canvas-soft);
  }
  .ow-row--tier .ow-row__word { grid-area: 1 / 1; }
  .ow-row--tier .ow-row__min { grid-area: 1 / 2; }
  .ow-row--tier .ow-row__remove { grid-area: 1 / 3; }
  .ow-row--tier .ow-row__arrow { grid-area: 2 / 1; text-align: left; }
  .ow-row--tier .ow-row__price { grid-area: 2 / 2 / 3 / 4; }
}
.ow-row--spec { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr) 36px; }
.ow-row--head { color: var(--muted); font-size: var(--text-xs); font-weight: 600; }
.ow-rows.is-empty .ow-row--head { display: none; }
@media (max-width: 559px) {
  .ow-row--spec:not(.ow-row--head) {
    grid-template-columns: minmax(0, 1fr) 36px;
    padding: 8px 8px 8px 10px;
    border-radius: var(--r-md);
    background: var(--canvas-soft);
  }
  .ow-row--spec [name="spec_k[]"] { grid-area: 1 / 1; font-weight: 600; }
  .ow-row--spec [name="spec_v[]"] { grid-area: 2 / 1; }
  .ow-row--spec .ow-row__remove { grid-area: 1 / 2; }
  .ow-row--head { display: none; }
}

/* live price examples */
.ow-calc { padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--canvas-soft); }
.ow-calc__title { font-size: var(--text-sm); font-weight: 650; color: var(--ink-2); }
.ow-calc__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; margin-top: 10px; }
.ow-calc__row { display: grid; gap: 2px; padding: 9px 12px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); }
.ow-calc__row dt { color: var(--muted); font-size: var(--text-xs); font-weight: 600; }
.ow-calc__row dd { font-family: var(--font-display); font-size: 1.1875rem; font-weight: 680; font-variant-numeric: tabular-nums; line-height: 1.2; }
.ow-calc__per { display: block; color: var(--muted); font-family: var(--font-body); font-size: var(--text-xs); font-weight: 500; }
.ow-calc__per.is-discount { color: var(--ok-ink); font-weight: 600; }

/* handover days fill the width on phones */
.ow-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; max-width: 470px; }
.ow-days .toggle-chip span { width: 100%; min-width: 0; padding: 0; }
.ow-days .toggle-chip input:not(:checked) + span { color: var(--muted); }

.ow-instant { max-width: 640px; }
.ow-instant__title { display: inline-flex; align-items: center; gap: 6px; font-weight: 650; }
.ow-instant__title .icon { color: var(--ok-ink); }
.ow-instant .check__text small { margin-top: 3px; }

/* pickup details visible only after confirmation */
.ow-private { padding: 16px; border: 1px dashed var(--line-strong); border-radius: var(--r-md); background: var(--canvas-soft); }
.ow-private__head { display: flex; align-items: center; gap: 7px; margin-bottom: var(--s-4); color: var(--ink-2); font-size: var(--text-sm); font-weight: 650; }
.ow-private .form { gap: var(--s-4); }

/* floating save bar */
.ow-actions { position: sticky; bottom: 0; z-index: 20; padding-bottom: max(12px, env(safe-area-inset-bottom)); margin-top: var(--s-2); }
.ow-actions__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: rgba(255, 255, 255, .97);
  box-shadow: var(--shadow-2);
}
.ow-actions__hint { margin-right: auto; color: var(--muted); font-size: var(--text-sm); }
@media (max-width: 559px) {
  .ow-actions__hint { display: none; }
  .ow-actions__inner { padding: 10px; gap: 8px; }
  .ow-actions__inner .btn { flex: 1 1 auto; padding-inline: 14px; }
  .ow-actions__inner .btn--ghost { flex: 0 1 auto; }
}


/* ==========================================================================
   06  Images
   ========================================================================== */
.ow-media { display: grid; gap: var(--s-6); align-items: start; }
@media (min-width: 1200px) {
  .ow-media { grid-template-columns: minmax(0, 1fr) 300px; }
  .ow-media__side { position: sticky; top: calc(var(--header-h) + var(--s-5)); }
}
.ow-media__side > .panel + .panel { margin-top: 0; }

.ow-upload { display: grid; gap: var(--s-4); }
.ow-drop { padding-block: var(--s-7); }
.ow-drop__pick { color: var(--violet); text-decoration: underline; text-underline-offset: .2em; }
.ow-upload__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.js .ow-upload:not(.has-files) .ow-upload__actions { display: none; }
.ow-upload.has-files .ow-drop { padding-block: var(--s-4); }
.ow-upload.has-files .ow-drop .dropzone__hint { display: none; }
@media (max-width: 519px) { .ow-upload__actions .btn { flex: 1 1 100%; } }

.ow-picked { padding: 14px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); }
.ow-picked__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 12px; margin-bottom: 12px; }
.ow-picked__count { font-weight: 620; }
.ow-picked__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 8px; }
.ow-picked__item { position: relative; aspect-ratio: 1; overflow: hidden; border-radius: var(--r-sm); background: var(--canvas-deep); }
.ow-picked__item img { width: 100%; height: 100%; object-fit: cover; }
.ow-picked__name { display: none; }
.ow-picked__item.is-noprev .ow-picked__name {
  display: grid;
  place-items: center;
  height: 100%;
  padding: 8px;
  color: var(--muted);
  font-size: var(--text-xs);
  text-align: center;
  overflow-wrap: anywhere;
}
.ow-picked__rm {
  position: absolute;
  top: 4px;
  right: 4px;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(23, 38, 43, .72);
  color: #fff;
}
.ow-picked__rm:hover { background: var(--ink); }
.ow-picked .field-error { margin-top: 10px; }

.ow-imgs .img-tile__badge { display: inline-flex; align-items: center; gap: 4px; box-shadow: 0 1px 3px rgba(23, 38, 43, .18); }
.ow-imgs .img-tile__badge .icon { --icon-size: 13px; fill: currentColor; }
.ow-imgs__num {
  position: absolute;
  top: 8px;
  left: 8px;
  display: grid;
  place-items: center;
  min-width: 24px;
  height: 24px;
  padding: 0 6px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .92);
  color: var(--ink);
  font-size: var(--text-xs);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.ow-imgs .img-tile__bar .btn--sm:not(.btn--icon) { padding: 0 10px; }
@media (min-width: 720px) { .ow-imgs { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); } }

.ow-noimg {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 18px 20px;
  border: 1.5px dashed var(--line-strong);
  border-radius: var(--r-lg);
  color: var(--muted);
}
.ow-noimg .icon { --icon-size: 26px; flex: none; }

.ow-next .btn + .btn { margin-top: var(--s-2); }
.ow-tips .panel__title { font-size: var(--text-md); font-family: var(--font-body); font-weight: 650; letter-spacing: 0; }
.ow-tips__list { display: grid; gap: 9px; font-size: var(--text-sm); color: var(--ink-2); }
.ow-tips__list li { display: flex; align-items: flex-start; gap: 8px; }
.ow-tips__list .icon { margin-top: 2px; color: var(--ok); }


/* ==========================================================================
   07  Owner calendar
   ========================================================================== */
.ow-cal { position: relative; display: grid; gap: var(--s-4); }
.ow-cal__bar {
  position: sticky;
  top: var(--header-h);
  z-index: 8;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 18px;
  margin-inline: calc(var(--s-2) * -1);
  padding: 10px var(--s-2);
  background: var(--canvas);
}
.ow-cal__nav { display: flex; gap: 6px; }
.ow-cal__hint { display: flex; align-items: flex-start; gap: 6px; flex: 1 1 280px; color: var(--muted); font-size: var(--text-sm); line-height: 1.45; }
.ow-cal__hint .icon { flex: none; margin-top: 2px; }
.ow-cal__months { display: grid; gap: var(--s-4); transition: opacity .15s; }
.ow-cal.is-loading .ow-cal__months { opacity: .55; }
.ow-cal__legend { border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); }
.ow-swatch-buffer { background: repeating-linear-gradient(90deg, var(--line-hover) 0 4px, transparent 4px 7px) center / 100% 2px no-repeat; }

.ow-cal .ocal__head { padding-bottom: var(--s-3); }
.ow-ocal-meta { color: var(--muted); font-size: var(--text-sm); text-align: right; }
.ow-cal .ocal__day { cursor: default; }
.ow-cal .ocal__day:hover { background: none; }
.ow-cal .ocal__day:not(.is-past):hover { background: var(--canvas-soft); }
.ow-cal .ocal__day.is-out:not(.is-past):hover { background: var(--canvas-deep); }
.ow-cal .ocal__day.is-blocked:hover { filter: brightness(.98); }
/* the whole cell is a button; bars (links) and labels sit on top */
.ow-day {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
}
.ow-day:disabled { cursor: default; }
.ow-day:focus-visible { outline: 2px solid var(--violet); outline-offset: -2px; border-radius: 2px; }
.ow-cal .ocal__num, .ow-cal .ocal__block { position: relative; z-index: 1; pointer-events: none; }
.ow-cal .ocal__bar--buffer { pointer-events: none; }
.ow-lane-gap { display: block; flex: none; height: 22px; }
.ow-cal .ocal__day.is-out .ocal__bar { opacity: .45; }
.ow-cal .ocal__day.is-past .ocal__bar { filter: saturate(.6); }
.ow-cal .ocal__day.ow-is-preview { background: color-mix(in srgb, var(--violet-50) 85%, transparent); box-shadow: inset 0 0 0 1px var(--violet-200); }
/* selection reads as one band: top/bottom edges everywhere, sides only at its ends */
.ow-cal .ocal__day.is-selected { background: var(--violet-50); box-shadow: inset 0 2px 0 var(--violet), inset 0 -2px 0 var(--violet); }
.ow-cal .ocal__day.is-selected.ow-sel-start { box-shadow: inset 2px 0 0 var(--violet), inset 0 2px 0 var(--violet), inset 0 -2px 0 var(--violet); }
.ow-cal .ocal__day.is-selected.ow-sel-end { box-shadow: inset -2px 0 0 var(--violet), inset 0 2px 0 var(--violet), inset 0 -2px 0 var(--violet); }
.ow-cal .ocal__day.is-selected.ow-sel-start.ow-sel-end { box-shadow: inset 0 0 0 2px var(--violet); }
.ow-cal .ocal__day.ow-is-picked {
  background: repeating-linear-gradient(-45deg, var(--violet-100) 0 5px, var(--surface) 5px 10px);
  box-shadow: inset 0 0 0 2px var(--violet);
}
@media (max-width: 719px) {
  .ow-lane-gap { height: 8px; }
  .ow-ocal-meta { font-size: var(--text-xs); }
  .ow-cal .ocal__head { padding: var(--s-3) var(--s-3) var(--s-2); }
  .ow-cal__bar { top: var(--header-h); }
}

/* floating action bar (selection / closed block) */
.ow-cal__action {
  position: sticky;
  bottom: max(12px, env(safe-area-inset-bottom));
  z-index: 30;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  padding: 14px 16px;
  border-radius: var(--r-lg);
  background: var(--ink);
  color: #fff;
  box-shadow: var(--shadow-3);
  animation: toast-in .2s var(--ease-out);
}
.ow-act__text { flex: 1 1 280px; min-width: 0; display: grid; gap: 6px; }
.ow-act__title { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-weight: 650; }
.ow-act__title > .icon { margin-right: -4px; }
.ow-act__n { padding: 2px 9px; border-radius: var(--r-pill); background: rgba(255, 255, 255, .14); font-size: var(--text-xs); font-weight: 650; }
.ow-act__sub { color: #C3CEC9; font-size: var(--text-sm); }
.ow-act__warn { display: flex; align-items: center; gap: 6px; color: #F6D58E; font-size: var(--text-sm); font-weight: 550; }
.ow-act__note { min-height: 40px; max-width: 420px; border-color: transparent; }
.ow-act__btns { display: flex; flex-wrap: wrap; gap: 8px; }
.ow-cal__action .btn--ghost { --btn-fg: #fff; --btn-bg-hover: rgba(255, 255, 255, .1); }
.ow-cal__action .btn--secondary { --btn-bg: transparent; --btn-fg: #fff; --btn-bd: rgba(255, 255, 255, .45); --btn-bg-hover: rgba(255, 255, 255, .08); --btn-bd-hover: #fff; }
.ow-cal__action :focus-visible { outline-color: var(--manila); }
@media (max-width: 559px) {
  .ow-act__btns { flex: 1 1 100%; }
  .ow-act__btns .btn { flex: 1 1 auto; }
  .ow-act__btns .btn--ghost { flex: 0 1 auto; }
}

/* side panels: upcoming list, blocks, iCal */
.ow-cal-side { display: grid; gap: var(--s-4); margin-top: var(--s-6); grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); align-items: start; }
.ow-cal-side > .panel + .panel { margin-top: 0; }
.ow-cal-side > .panel:last-child { grid-column: 1 / -1; }
.ow-cal-list > li + li { border-top: 1px solid var(--line); }
.ow-cal-bk { display: flex; align-items: center; gap: 12px; padding: 10px 0; color: var(--ink); text-decoration: none; }
.ow-cal-bk:hover .ow-cal-bk__name { text-decoration: underline; text-underline-offset: .18em; }
.ow-cal-bk__dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--line-strong); }
.ow-dot--confirmed { background: var(--ok); }
.ow-dot--requested { background: var(--warn); }
.ow-dot--pending_payment { background: var(--violet-200); }
.ow-cal-bk__main { flex: 1; min-width: 0; display: grid; }
.ow-cal-bk__name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ow-cal-bk__when { color: var(--muted); font-size: var(--text-sm); }
.ow-cal-blk { display: flex; align-items: center; gap: 12px; padding: 8px 0; }
.ow-cal-blk__icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 32px;
  height: 32px;
  border-radius: var(--r-sm);
  background: repeating-linear-gradient(-45deg, #E2E8E3 0 4px, var(--surface) 4px 8px);
  box-shadow: inset 0 0 0 1px var(--line-strong);
  color: var(--ink-2);
}
.ow-blockform { display: grid; gap: 12px; justify-items: start; margin-top: var(--s-5); padding-top: var(--s-4); border-top: 1px solid var(--line); }
.ow-blockform__title { font-size: var(--text-sm); font-weight: 650; }
.ow-blockform__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; width: 100%; }
.ow-blockform__note { grid-column: 1 / -1; }
.ow-ical__text { color: var(--ink-2); margin-bottom: var(--s-3); max-width: 70ch; }
.ow-ical__url { font-size: var(--text-sm); text-overflow: ellipsis; color: var(--ink-2); }


/* ==========================================================================
   08  Bookings list + booking detail
   ========================================================================== */
.ow-filter { margin-bottom: var(--s-5); }
@media (min-width: 960px) { .ow-filter { flex-wrap: wrap; margin-inline: 0; padding-inline: 0; } }
.ow-list--attention { border-color: #EED6A8; }
.ow-brow__money { display: inline-flex; align-items: baseline; gap: 8px; }
.ow-brow__payout { color: var(--muted); font-size: var(--text-xs); font-weight: 550; white-space: nowrap; }
@media (min-width: 720px) {
  .ow-brow__money { flex-direction: column; align-items: flex-end; gap: 0; }
}

/* deadline banner on a request */
.ow-deadline {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 6px 14px;
  margin-bottom: var(--s-5);
  padding: 14px 18px;
  border: 1px solid #EED6A8;
  border-radius: var(--r-lg);
  background: var(--warn-50);
}
.ow-deadline__icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: var(--surface); color: var(--warn-ink); }
.ow-deadline__icon .icon { --icon-size: 22px; }
.ow-deadline__title { font-weight: 700; color: var(--ink); }
.ow-deadline__text p:not(.ow-deadline__title) { color: var(--ink-2); font-size: var(--text-sm); }
.ow-deadline__left {
  grid-column: 2;
  justify-self: start;
  padding: 3px 12px;
  border-radius: var(--r-pill);
  background: var(--surface);
  color: var(--warn-ink);
  font-family: var(--font-display);
  font-size: var(--text-md);
  font-weight: 700;
  white-space: nowrap;
}
.ow-deadline__left.is-urgent, .ow-deadline__left.is-over { color: var(--danger-ink); }
@media (min-width: 560px) {
  .ow-deadline { grid-template-columns: auto minmax(0, 1fr) auto; }
  .ow-deadline__left { grid-column: 3; justify-self: end; font-size: var(--text-lg); }
}

/* layout: summary, answer, details (answer first on phones, right column on desktop) */
.ow-bk { display: grid; gap: var(--s-4); grid-template-areas: "sum" "act" "det"; }
.ow-bk__sum { grid-area: sum; }
.ow-bk__act { grid-area: act; display: grid; gap: var(--s-3); align-content: start; }
.ow-bk__det { grid-area: det; }
.ow-bk .panel + .panel { margin-top: 0; }
.ow-bk__det { display: grid; gap: var(--s-4); align-content: start; }
.ow-bk__det.stack > * + * { margin-top: 0; }
@media (min-width: 1200px) {
  .ow-bk { grid-template-columns: minmax(0, 1fr) 340px; grid-template-areas: "sum act" "det act"; gap: var(--s-5); align-items: start; }
  .ow-bk__act { position: sticky; top: calc(var(--header-h) + var(--s-5)); }
}

.ow-bk__item { display: flex; align-items: center; gap: 14px; }
.ow-bk__thumb { flex: none; width: 88px; height: 66px; overflow: hidden; border-radius: var(--r-md); background: var(--canvas-deep); }
.ow-bk__thumb img { width: 100%; height: 100%; object-fit: cover; }
.ow-bk__thumb .ph .icon { width: 40%; }
.ow-bk__title { font-size: var(--text-lg); line-height: 1.25; }
.ow-bk__title a { color: var(--ink); text-decoration: none; }
.ow-bk__title a:hover { text-decoration: underline; text-underline-offset: .15em; }

.ow-dates {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 10px 12px;
  margin-top: var(--s-5);
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--canvas-soft);
}
.ow-dates__d { display: grid; gap: 1px; min-width: 0; }
.ow-dates__label { color: var(--muted); font-size: var(--text-xs); font-weight: 650; }
.ow-dates__day { font-family: var(--font-display); font-size: var(--text-lg); font-weight: 650; line-height: 1.2; letter-spacing: -.01em; }
.ow-dates__year { color: var(--muted); font-size: var(--text-xs); }
.ow-dates__sep { color: var(--line-hover); }
.ow-dates__units { grid-column: 1 / -1; display: flex; align-items: baseline; gap: 6px; padding-top: 10px; border-top: 1px solid var(--line); color: var(--muted); font-size: var(--text-sm); }
@media (max-width: 559px) { .ow-dates__day { font-size: var(--text-md); } }
.ow-dates__n { color: var(--ink); font-family: var(--font-display); font-size: var(--text-xl); font-weight: 700; line-height: 1; }
@media (min-width: 560px) {
  .ow-dates { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto; padding: 16px 20px; }
  .ow-dates__units { grid-column: auto; flex-direction: column; align-items: center; gap: 2px; padding: 0 0 0 18px; border-top: 0; border-left: 1px solid var(--line); }
}

.ow-renter { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; margin-top: var(--s-5); padding-top: var(--s-5); border-top: 1px solid var(--line); }
.ow-renter .person { min-width: 0; }
.ow-renter .person__meta { overflow-wrap: anywhere; }
.ow-renter .person__meta a { color: var(--ink-2); }
.ow-renter__contact { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 519px) {
  .ow-renter__contact { width: 100%; }
  .ow-renter__contact .btn { flex: 1; min-height: 44px; }
}

.ow-msg { margin: var(--s-4) 0 0; padding: 12px 16px; border-radius: var(--r-md); background: var(--canvas-soft); }
.ow-msg--own { background: var(--violet-50); }
.ow-msg__by { margin-bottom: 4px; color: var(--muted); font-size: var(--text-xs); font-weight: 650; }
.ow-msg__text { margin: 0; color: var(--ink-2); font-size: .9375rem; line-height: 1.55; overflow-wrap: anywhere; }

/* answer panel */
.ow-answer .form { gap: var(--s-4); }
.ow-answer__note { margin-top: var(--s-4); line-height: 1.45; }
.ow-fold { margin-top: var(--s-3); }
.ow-fold > summary { list-style: none; }
.ow-fold > summary::-webkit-details-marker { display: none; }
.ow-fold[open] > summary { display: none; }
.ow-fold__body {
  gap: var(--s-3);
  padding: 16px;
  border: 1px solid var(--line-strong);
  border-radius: var(--r-md);
  background: var(--canvas-soft);
  animation: pop-in .15s var(--ease-out);
}
.ow-fold__title { font-weight: 700; }
.ow-fold__btns { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.ow-fold__btns .btn--danger { flex: 1 1 auto; }
.ow-fold--danger { margin-top: 0; }
.ow-fold--danger .ow-fold__body { border-color: #F1C1BA; background: var(--danger-50); }
.ow-state { display: flex; align-items: center; gap: 8px; }
.ow-state .icon { color: var(--muted); }
.ow-state--ok .icon { color: var(--ok); }
.ow-state--danger .icon { color: var(--danger); }
.ow-bk__cal { justify-content: center; }

/* money */
.ow-payout { margin-top: 2px; padding-top: 12px; border-top: 1px dashed var(--line-strong); }
.ow-payout dt { color: var(--ink); font-weight: 650; }
.ow-payout dd { color: var(--ok-ink); font-family: var(--font-display); font-size: var(--text-lg); font-weight: 720; }
.ow-refund dt, .ow-refund dd { color: var(--ink); font-weight: 650; }
.ow-paynote { display: flex; align-items: flex-start; gap: 8px; margin-top: var(--s-4); padding-top: 14px; border-top: 1px solid var(--line); color: var(--ink-2); font-size: var(--text-sm); line-height: 1.45; }
.ow-paynote .icon { flex: none; margin-top: 1px; color: var(--muted); }
/* app.css's `ol[class] { padding: 0 }` reset outranks `.timeline { padding-left }` */
.page-dash ol.timeline { padding-left: 22px; }
.ow-tl-extra { margin-top: 2px; color: var(--ink-2); font-size: var(--text-sm); overflow-wrap: anywhere; }

/* phone: answer bar at the bottom of the screen */
.ow-stickybar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  gap: 8px;
  padding: 10px var(--gutter) max(10px, env(safe-area-inset-bottom));
  border-top: 1px solid var(--line);
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 -10px 24px -14px rgba(23, 38, 43, .3);
  animation: toast-in .2s var(--ease-out);
}
.ow-stickybar[hidden] { display: none; }
@media (min-width: 960px) { .ow-stickybar { display: none !important; } }
body.has-stickybar .site-footer { padding-bottom: calc(var(--s-5) + 72px); }


/* ==========================================================================
   09  Payouts
   ========================================================================== */
.ow-connect {
  display: grid;
  gap: var(--s-5);
  margin-bottom: var(--s-7);
  padding: clamp(20px, 3vw, 32px);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--surface);
}
.ow-connect--plain { grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--s-4); }
.ow-connect--warn { border-color: #EED6A8; }
.ow-connect--ok { border-color: #BFE0CC; }
.ow-connect__lead { display: flex; align-items: flex-start; gap: var(--s-4); }
.ow-connect__icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 48px;
  height: 48px;
  border-radius: var(--r-md);
  background: var(--canvas-deep);
  color: var(--ink-2);
}
.ow-connect__icon .icon { --icon-size: 24px; }
.ow-connect__icon--violet { background: var(--violet-50); color: var(--violet); }
.ow-connect__icon--ok { background: var(--ok-50); color: var(--ok); }
.ow-connect__icon--warn { background: var(--warn-50); color: var(--warn-ink); }
.ow-connect__title { font-size: var(--text-xl); }
.ow-connect__body p { margin-top: 6px; color: var(--ink-2); max-width: 64ch; }
.ow-connect__steps { display: grid; gap: var(--s-4); }
.ow-connect__steps li { display: flex; align-items: flex-start; gap: 12px; }
.ow-connect__steps .small { margin-top: 2px; }
.ow-connect__num {
  display: grid;
  place-items: center;
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--violet-50);
  color: var(--violet);
  font-family: var(--font-display);
  font-weight: 700;
}
@media (min-width: 900px) {
  .ow-connect__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); padding: var(--s-5) 0; border-block: 1px solid var(--line); }
}
@media (max-width: 519px) {
  .ow-connect__lead { flex-direction: column; gap: var(--s-3); }
  .ow-connect--plain { grid-template-columns: 1fr; gap: var(--s-3); }
  .ow-connect__cta .btn { flex: 1 1 100%; }
}
.ow-connect__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
.ow-connect__cta .small { max-width: 44ch; }
.ow-checks { display: flex; flex-wrap: wrap; gap: 8px; }
.ow-checks li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 0 12px 0 10px;
  border-radius: var(--r-pill);
  font-size: var(--text-sm);
  font-weight: 600;
}
.ow-checks .is-ok { background: var(--ok-50); color: var(--ok-ink); }
.ow-checks .is-todo { background: var(--canvas-soft); color: var(--muted); box-shadow: inset 0 0 0 1px var(--line-strong); }
.ow-paytable td strong { font-weight: 650; }