/* FlipFinder — mobile web (≤767px). Loaded via a media-gated <link>, so nothing
   here can touch the desktop layout. Mobile-only markup ships with the `hidden`
   attribute and is revealed here with a `[hidden]` override; desktop never
   sees it.

   The mobile layer is organised around one idea: each screen answers one
   question first, and everything else waits behind a tap.
   - money first      — net profit is the largest figure on rows and detail
                         screens; the score ring is the supporting cue;
   - one-line summary — the KPI tile grids become a single summary block;
   - fold the rest    — secondary panels collapse to a 52px row with a summary
                         ([data-m-collapse], wired up in app.js);
   - bottom sheets    — filters, account and record-sale slide up from the thumb
                         zone instead of sitting inline;
   - a touch floor    — 44px targets, 16px inputs (no iOS focus zoom), 11px+
                         labels. */

/* ═══════════ Touch + type floor ═══════════ */
.small { font-size: 12px; }
.btn--sm { min-height: 44px; padding: 0 14px; font-size: 13px; justify-content: center; }
.linkbtn { display: inline-flex; align-items: center; min-height: 44px; padding: 0 8px; font-size: 13px; }
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
select, textarea { font-size: 16px !important; }            /* <16px makes iOS zoom on focus */
.fieldlbl input, .fieldlbl select, .fieldlbl textarea,
.miniform input, .miniform select, .rolepick { min-height: 44px; }
input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--violet); }
.checklbl { min-height: 44px; font-size: 14px; }
.statrow__k, .badge, .notif__kind, .kpi__label { font-size: 11px; }
.pill { font-size: 10.5px; }
.notif__time { font-size: 11px; }
.backlink { display: flex; align-items: center; min-height: 44px; margin: -10px 0 2px; font-size: 12px; }
::selection { background: rgba(124, 92, 255, 0.45); color: #fff; }
:focus-visible { outline: 2px solid var(--violet); outline-offset: 2px; }
html.has-sheet { overflow: hidden; }

/* ═══════════ App shell ═══════════ */
body.app { display: block; }
.sidebar { display: none; }
.main { min-height: 100vh; display: flex; flex-direction: column; }

.content {
  padding: 16px 15px calc(80px + env(safe-area-inset-bottom));
  flex: 1;
}
.stack { gap: 16px; }

/* Topbar → compact header: brand mark, title, page action, account */
.topbar { height: 54px; padding: 0 8px 0 15px; gap: 10px; }
.topbar::before {
  content: ""; width: 22px; height: 22px; flex: none;
  background: linear-gradient(135deg, #7c5cff, #22d3ee);
  clip-path: polygon(0 0, 100% 0, 100% 62%, 62% 100%, 0 100%);
}
.topbar__title { font-size: 16px; font-weight: 800; letter-spacing: -0.3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.topbar__crumb { display: none; }
.topbar__actions { margin-left: auto; gap: 0; flex: none; }
.topbar__search { display: none; }
.topbar__actions > .btn { display: none; }   /* Add is a bottom tab */
.topbar__btn { display: none; }               /* Alerts is a bottom tab */
.topbar__icon[hidden], .topbar__me[hidden] {
  all: unset; box-sizing: border-box; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; color: var(--text-muted);
}
.topbar__icon svg { width: 20px; height: 20px; }
.topbar__icon:active { color: var(--text); }
.topbar__me .avatar { width: 30px; height: 30px; font-size: 11px; }

.flashes { padding: 12px 15px 0; }
.demobar { padding: 9px 15px; font-size: 12px; }
.btn { white-space: nowrap; }

/* ═══════════ Bottom tab bar ═══════════ */
.mnav[hidden] {
  display: grid; grid-auto-flow: column; grid-auto-columns: 1fr;
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 45;
  background: #0a0b0f; border-top: 1px solid var(--line-strong);
  padding: 8px 4px calc(8px + env(safe-area-inset-bottom));
}
.mnav__item {
  all: unset; box-sizing: border-box; cursor: pointer; position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  min-height: 48px; color: var(--text-muted);
}
.mnav__ico { position: relative; display: flex; }
.mnav__ico svg { width: 22px; height: 22px; display: block; }
.mnav__label { font-size: 11px; font-weight: 600; letter-spacing: 0.02em; }
.mnav__item.is-on { color: var(--text); }
.mnav__item.is-on .mnav__ico { color: var(--violet); }
.mnav__item.is-on::after {
  content: ""; position: absolute; bottom: -1px; width: 18px; height: 2px; background: var(--violet);
}
.mnav__badge {
  position: absolute; top: -5px; right: -11px;
  background: var(--grad-hot); color: #07080b;
  font-family: var(--font-mono); font-size: 10px; font-weight: 600; padding: 1px 4px; line-height: 1.4;
}

/* ═══════════ Bottom sheets (account, record sale) ═══════════ */
.fsheet-backdrop[hidden] {
  display: block; position: fixed; inset: 0; z-index: 50;
  background: rgba(5, 6, 9, 0.72);
  opacity: 0; pointer-events: none; transition: opacity 0.2s ease;
}
.fsheet-backdrop.is-open { opacity: 1; pointer-events: auto; }

.msheet[hidden], .salegroup {
  display: flex; flex-direction: column; gap: 12px;
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 55;
  max-height: 86vh; overflow-y: auto; overscroll-behavior: contain;
  margin: 0; padding: 6px 15px calc(18px + env(safe-area-inset-bottom));
  background: var(--panel);
  border-width: 2px 0 0; border-style: solid; border-image: var(--grad-violet) 1;
  transform: translateY(105%); visibility: hidden;
  transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 0.28s;
}
.msheet.is-open, .salegroup.is-open {
  transform: none; visibility: visible;
  transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}
.msheet__head[hidden], .msheet__head {
  display: flex; align-items: center; gap: 12px; min-height: 56px;
  border-bottom: 1px solid var(--line); margin: 0 -15px 2px; padding: 0 6px 0 15px;
}
.msheet__title { font-size: 16px; font-weight: 700; }
.msheet__close {
  all: unset; box-sizing: border-box; cursor: pointer; margin-left: auto;
  display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; color: var(--text-muted);
}
.msheet__close svg { width: 20px; height: 20px; }

/* account sheet */
.acctsheet .msheet__head .avatar { width: 34px; height: 34px; font-size: 12px; }
.acctsheet__live { margin: 6px 0 0; font-size: 11px; }
.acctsheet__links { display: flex; flex-direction: column; margin: 0 -15px; }
.acctsheet__link {
  display: flex; align-items: center; justify-content: space-between;
  min-height: 52px; padding: 0 17px 0 15px; border-bottom: 1px solid var(--line);
  font-size: 15px; font-weight: 600; color: var(--text);
}
.acctsheet__link:first-child { border-top: 1px solid var(--line); }
.acctsheet__link span { color: var(--text-muted); font-size: 18px; }
.acctsheet__link:active { background: rgba(124, 92, 255, 0.09); }
.acctsheet__ws select { width: 100%; }
.acctsheet__out { min-height: 48px; margin-top: 4px; font-size: 14px; }

/* ═══════════ Collapsible panels ═══════════ */
/* app.js adds .is-collapsible / .is-collapsed on mobile only. */
.is-collapsible > [data-m-head] {
  position: relative; cursor: pointer; -webkit-tap-highlight-color: transparent;
  min-height: 52px; padding-right: 44px;
}
.is-collapsible > .panel__head[data-m-head] { display: flex; align-items: center; gap: 12px; justify-content: flex-start; }
.is-collapsible > [data-m-head]::after {
  content: ""; position: absolute; right: 19px; top: 50%;
  width: 7px; height: 7px; border-right: 1.5px solid var(--text-muted); border-bottom: 1.5px solid var(--text-muted);
  transform: translateY(-75%) rotate(45deg); transition: transform 0.2s ease;
}
.is-collapsed > [data-m-head]::after { transform: translateY(-50%) rotate(-45deg); }
.is-collapsible > [data-m-head]:active { background: rgba(255, 255, 255, 0.025); }
.is-collapsed > :not([data-m-head]):not([data-m-keep]):not(.detail-head__grad) { display: none !important; }
.is-collapsed > .panel__head[data-m-head] { border-bottom-color: transparent; }
/* inside a folding header only the title + summary speak */
.is-collapsible > .panel__head[data-m-head] > :not(:first-child):not(.m-sum) { display: none; }
.is-collapsible > .panel__head[data-m-head] > div > .mono { display: none; }
.is-collapsible > [data-m-head]:not(.panel__head) {
  display: flex; flex-direction: column; justify-content: center;
  margin: -15px -15px 0; padding: 14px 44px 14px 15px;
}
.is-collapsible > .detail-head__grad + [data-m-head] { margin-top: -15px; }
.is-collapsed:has(> [data-m-head]:not(.panel__head)) { padding-bottom: 0; }
.is-collapsed > [data-m-head]:not(.panel__head) > .mono { display: none; }
.is-collapsible > .panel__head .panel__title, .is-collapsible > [data-m-head] .panel__title { font-size: 15px; }
.m-sum[hidden] { display: inline; margin-left: auto; font-size: 12px; color: var(--text-muted); white-space: nowrap; }
.m-sum .pill { vertical-align: middle; }


/* ═══════════ Shared: money-first summary block ═══════════ */
.msummary[hidden] { display: block; padding: 2px 0 0; }
.msummary__hero { font-size: clamp(36px, 11vw, 44px); font-weight: 600; letter-spacing: -1.5px; line-height: 1; }
.msummary__k { margin-top: 7px; font-size: 13px; color: var(--text-muted); }
.msummary__line {
  display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 14px; padding-top: 12px;
  border-top: 1px solid var(--line); font-size: 14px; font-weight: 600;
}
.msummary__line .muted { font-family: var(--font-ui); font-size: 12.5px; font-weight: 500; }
.kpigrid, .kpi-rail > .kpi { display: none; }

/* decision block — listing detail + inventory item */
.mdecide[hidden] {
  display: block; position: relative;
  margin: 0 0 16px; padding: 18px 15px 16px;
  background: var(--panel); border: 1px solid var(--line);
}
.mdecide::before { content: ""; position: absolute; left: -1px; right: -1px; top: -1px; height: 2px; background: var(--grad-violet); }
.mdecide[data-tier="hot"]::before { background: var(--grad-mint); }
.mdecide[data-tier="pass"]::before { background: var(--grad-hot); }
.mdecide__title {
  margin: 0 0 16px; font-size: 17px; font-weight: 700; line-height: 1.3; letter-spacing: -0.2px; text-wrap: balance;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.mdecide__flag { margin: -4px 0 16px; padding: 12px; border: 1px solid rgba(255, 92, 43, 0.35); background: rgba(255, 92, 43, 0.07); }
.mdecide__flag p { margin: 8px 0 0; font-size: 13px; line-height: 1.45; color: #ffcfc2; }
.mdecide__main { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.mdecide__net { font-size: clamp(36px, 11vw, 44px); font-weight: 600; letter-spacing: -1.5px; line-height: 1; }
.mdecide__netk { margin-top: 7px; font-size: 13px; color: var(--text-muted); }
.mdecide__score { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: none; }
.mdecide__score .ring, .mdecide__score .ring svg { width: 58px; height: 58px; }
.mdecide__score .ring__track, .mdecide__score .ring__val { stroke-width: 3; }
.mdecide__score .ring__num { font-size: 17px; }
.mdecide__tier { font-size: 11px; font-weight: 600; letter-spacing: 0.12em; color: #c3b4ff; }
.mdecide[data-tier="hot"] .mdecide__tier { color: #a8f0d5; }
.mdecide[data-tier="pass"] .mdecide__tier { color: #ffb9a5; }
.mdecide__flow {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px;
  margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line);
  font-size: 15px; font-weight: 600;
}
.mdecide__k { font-family: var(--font-ui); font-size: 12.5px; font-weight: 500; color: var(--text-muted); margin-right: 3px; }
.mdecide__arrow { color: var(--text-muted); }
.mdecide__auction { margin-top: 8px; font-size: 12.5px; color: #7dd8ff; }
.detail-info p.auctiontag { display: none; }                         /* shown in the decision block */
.lcell-item__text .auctiontag { font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mdecide__evidence { margin-top: 6px; font-size: 12px; color: var(--text-muted); }
.mdecide__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; margin-bottom: 12px; font-size: 12px; }
.mdecide--inv .mdecide__title { font-size: 16px; margin-bottom: 14px; }
.mdecide__empty { font-size: 14px; color: var(--text-muted); }
.targetform { display: flex; gap: 8px; margin-top: 12px; }
.targetform__field {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px;
  min-height: 48px; padding: 0 12px; border: 1px solid var(--line-strong); background: var(--field);
  font-size: 13px; color: var(--text-muted);
}
.targetform__field input { flex: 1; min-width: 0; border: 0; background: transparent; color: var(--text); font-family: var(--font-mono); padding: 0; min-height: 0; }
.targetform .btn { min-height: 48px; padding: 0 18px; font-size: 14px; }

/* sticky action bar above the tab bar */
.mactions[hidden], .detail-head__aside .actions {
  display: flex; gap: 10px;
  position: fixed; left: 0; right: 0; z-index: 30;
  bottom: calc(64px + env(safe-area-inset-bottom));
  padding: 10px 15px;
  background: #0a0b0f; border-top: 1px solid var(--line-strong);
}
.mactions__primary { flex: 1; min-height: 48px; justify-content: center; font-size: 15px; }

/* ═══════════ Sign in ═══════════ */
body.auth { display: block; min-height: 100vh; }
.auth__aside { display: none; }
.auth__panel {
  min-height: 100vh; padding: 20px 24px 32px;
  background:
    radial-gradient(420px 320px at 92% 6%, rgba(124, 92, 255, 0.30), transparent 70%),
    radial-gradient(380px 300px at 4% 94%, rgba(34, 211, 238, 0.14), transparent 70%),
    var(--bg);
  justify-content: flex-start; gap: 40px; border-right: 0;
}
/* Card sits under the brand; spare height goes below it (short pages like
   "password reset sent" used to sink to the bottom of the screen). */
.auth__card { max-width: none; }
.auth__panel > .mono.small { margin-top: auto; }
.auth__card form { gap: 14px; }
.auth__card input[type="email"],
.auth__card input[type="password"],
.auth__card input[type="text"] { min-height: 48px; padding: 14px; }
.auth__card button[type="submit"], .auth__card .button { min-height: 52px; font-size: 15px; text-align: center; justify-content: center; }
.auth__card label { font-size: 12px; }
.auth__panel > .mono.small { margin-bottom: 8px; }

/* ═══════════ Dashboard ═══════════ */
.layouttoggle { display: none; }
.dash-grid, .deals-grid { display: block; }
.dash-grid > .panel, .dash-grid > .panel--flush { margin-bottom: 16px; }
.dash-grid > .stack { gap: 0; }
.dash-grid > .stack > .panel + .panel { margin-top: -1px; }
.deals-grid .kpi-rail { position: static; margin-top: 16px; }
.panel__head { padding: 14px 15px; }
.panel { padding: 15px; }
.panel--flush { padding: 0; }

/* deal rows: same anatomy as a listings row — score · item · profit */
.dealrow {
  grid-template-columns: auto minmax(0, 1fr) auto; gap: 0 12px;
  padding: 12px 15px; color: inherit;
}
.dealrow .ring { grid-row: 1; grid-column: 1; width: 38px; height: 38px; }
.dealrow .ring svg { width: 38px; height: 38px; }
.dealrow .ring__num { font-size: 12px; }
.dealrow .min-w-0 { grid-row: 1; grid-column: 2; }
.dealrow .watchrow__label { font-size: 15px; font-weight: 600; }
.dealrow .min-w-0 > .mono { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 3px; }
.dealrow .r.pos { grid-row: 1; grid-column: 3; text-align: right; font-size: 17px; font-weight: 700; letter-spacing: -0.3px; }
.dealrow .r.pos .muted { font-size: 12px; font-weight: 400; letter-spacing: 0; margin-top: 2px; }
.dealrow:active { background: rgba(124, 92, 255, 0.09); }

.watchrow { grid-template-columns: minmax(0, 1fr) auto; padding: 13px 15px; }
.watchrow .spark { display: none; }
.comprow { padding: 12px 15px; }

/* ═══════════ Listings — scan list ═══════════ */
.filters {
  position: sticky; top: 54px; z-index: 56; display: flex; flex-direction: row; gap: 8px;
  background: var(--bg); margin: -16px -15px 12px; padding: 10px 15px; border-bottom: 1px solid var(--line);
}
.filters__trigger[hidden] {
  display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0;
  min-height: 44px; padding: 0 12px;
  background: var(--panel); border: 1px solid var(--line-strong); color: var(--text);
  font-family: var(--font-ui); font-size: 14px; font-weight: 700; cursor: pointer;
}
.filters__trigger:active { background: var(--field); border-color: var(--violet); }
.filters__trigger-ico { width: 18px; height: 18px; flex: none; color: var(--violet); }
.filters__trigger-count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 20px; height: 20px; padding: 0 5px;
  background: var(--grad-violet); color: #07080b;
  font-family: var(--font-mono); font-size: 11px; font-weight: 700;
}
.filters__trigger-hint { margin-left: auto; color: var(--text-muted); font-size: 12px; font-weight: 500; font-family: var(--font-mono); }
.filters__sort[hidden] {
  display: flex; align-items: center; gap: 6px; flex: none; position: relative;
  min-height: 44px; padding: 0 0 0 11px;
  background: var(--panel); border: 1px solid var(--line-strong); color: var(--text);
}
.filters__sort svg { width: 16px; height: 16px; flex: none; color: var(--violet); pointer-events: none; }
.filters__sort select {
  appearance: none; -webkit-appearance: none; border: 0; background: transparent; color: inherit;
  font-family: var(--font-ui); font-weight: 600; height: 42px; padding: 0 12px 0 0; max-width: 10.5em; cursor: pointer;
}
.filters__meta { display: none; }

/* active filters as removable chips */
.fchips[hidden] {
  display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none;
  margin: 0 -15px 12px; padding: 0 15px;
}
.fchips::-webkit-scrollbar { display: none; }
.fchip {
  flex: none; display: inline-flex; align-items: center; gap: 8px;
  min-height: 40px; padding: 0 10px 0 13px;
  border: 1px solid rgba(124, 92, 255, 0.4); background: rgba(124, 92, 255, 0.12);
  color: #d9d0ff; font-size: 13px; font-weight: 600;
}
.fchip svg { width: 14px; height: 14px; color: #b9a8ff; }
.fchip--clear { background: none; border-color: var(--line-strong); color: var(--text-muted); padding-right: 13px; }

/* filter sheet */
.chips {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 55;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; align-content: start;
  max-height: 86vh; overflow-y: auto; overscroll-behavior: contain;
  padding: 6px 15px calc(18px + env(safe-area-inset-bottom));
  background: var(--panel);
  border-width: 2px 0 0; border-style: solid; border-image: var(--grad-violet) 1;
  transform: translateY(105%); visibility: hidden;
  transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 0.28s;
}
.chips.is-open { transform: none; visibility: visible; transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1); }
.chips__head[hidden] {
  display: flex; align-items: center; justify-content: space-between; grid-column: 1 / -1;
  min-height: 56px; margin: 0 -15px; padding: 0 6px 0 15px; border-bottom: 1px solid var(--line);
}
.chips__head-title { font-size: 16px; font-weight: 700; }
.chips__close {
  all: unset; box-sizing: border-box; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; font-size: 26px; line-height: 1; color: var(--text-muted);
}
.chips > * { box-sizing: border-box; }
.chips__q { grid-column: 1 / -1; min-width: 0; width: 100%; height: 48px; padding: 0 13px; }
.chips > select { height: 48px; padding: 0 10px; width: 100%; min-width: 0; }
.chips__num { gap: 6px; height: 48px; border: 1px solid var(--line-strong); padding: 0 10px; font-size: 12px; white-space: nowrap; flex-wrap: nowrap; color: var(--text-muted); }
.chips__num input { flex: 1; width: auto; min-width: 0; border: 0; background: transparent; padding: 0; color: var(--text); }
.chips__apply {
  grid-column: 1 / -1; min-height: 52px; justify-content: center; margin-top: 4px;
  background: var(--grad-violet); color: #07080b; border: 0; font-size: 15px; font-weight: 700;
}
.chips__apply-d { display: none; }
.chips__apply-m[hidden] { display: inline; }
.chips__reset { grid-column: 1 / -1; min-height: 44px; justify-content: center; }

/* rows: score · title / ask → resale · source · age · net profit */
.ltable__head { display: none; }
.ltable { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.ltable__empty { grid-column: 1 / -1; }
.ltable__row {
  display: flex; align-items: center; gap: 12px;
  padding: 13px 15px; border-bottom: 1px solid var(--line);
}
.ltable__row:active { background: rgba(124, 92, 255, 0.09); }
.ltable__row > :not(.lcell-item):not(.lm-side) { display: none; }   /* desktop columns */
.lcell-item { flex: 1; min-width: 0; gap: 12px; }
.lcell-item > .thumb { display: none; }
.lm-ring[hidden] { display: block; flex: none; width: 38px; text-align: center; }
.lm-ring > .muted { display: block; color: var(--text-dim); }        /* unscored: no ring */
.lm-ring .ring, .lm-ring .ring svg { width: 38px; height: 38px; }
.lm-ring .ring__num { font-size: 12px; }
.lcell-item__text { gap: 4px; }
.lcell-item__title { font-size: 15px; }
.lcell-item__text > .mono.small.muted { display: none; }   /* description snippet */
.lcell-item__sub[hidden] {
  display: block; font-size: 12.5px; color: var(--text); font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.lcell-item__sub .lm-meta { color: var(--text-muted); font-weight: 400; }
.lm-side[hidden] { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; flex: none; }
.lcell-item__text .flagpills--d { display: none; }               /* the side column carries it */
.itable__title .flagpill { font-size: 9.5px; padding: 1px 5px; margin-left: 4px; }
.lm-net { font-size: 17px; font-weight: 700; letter-spacing: -0.3px; }
.lm-margin { font-size: 12px; color: var(--text-muted); }
.pager { padding: 12px 15px; }
.pager .btn--sm { min-width: 84px; }

/* ═══════════ Listing detail ═══════════ */
.detail-head { margin-bottom: 16px; }
.detail-head > .detail-head__grad { display: none; }        /* the decision block carries the tier edge */
.detail-head__body { display: block; padding: 0; }
.detail-head__body > .detail-photo { display: none; }
.mphotos[hidden] {
  display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x mandatory;
  padding: 15px 15px 0;
}
.mphotos::-webkit-scrollbar { display: none; }
.mphotos a { flex: none; scroll-snap-align: start; }
.mphotos img { display: block; width: 104px; height: 104px; object-fit: cover; background: var(--field); border: 1px solid var(--line); }
.detail-info { padding: 14px 15px 15px; }
.detail-info .badges { margin-bottom: 0; gap: 8px; }
.detail-info .statrow, .detail-info .flagnote { display: none; }   /* both live in the decision block */
.detail-info .h2 { margin: 10px 0 0; font-size: 13px; font-weight: 500; line-height: 1.45; letter-spacing: 0; color: var(--text-muted); }  /* full title */
.detail-desc {
  margin: 10px 0 0; font-size: 13px; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.detail-head__aside { display: block; padding: 0; border: 0; }
.detail-head__aside .ring--lg { display: none; }
.detail-head__aside .actions { width: auto; flex-direction: row; flex-wrap: nowrap; align-items: stretch; }
.detail-head__aside .actions > a[href^="http"] { display: none; }    /* lives in the header */
.detail-head__aside .actions > .btn { flex: 1; }
.detail-head__aside .actions > .buyform { display: none; }       /* mobile confirms the paid price in a sheet */
.detail-head__aside .actions > .buybtn[hidden] { display: inline-flex; flex: 1.5; }
.detail-head__aside .actions > form { flex: 1.5; display: flex; }

/* mark-as-bought sheet */
.msheet .fieldlbl input { width: 100%; min-height: 52px; font-family: var(--font-mono); font-weight: 600; }
.buysheet__hint { margin: 0; line-height: 1.5; }
.buysheet__go { min-height: 52px; font-size: 15px; margin-top: 4px; }
.detail-head__aside .actions .btn { width: 100%; min-height: 48px; justify-content: center; font-size: 14px; }

.detail-grid { display: flex; flex-direction: column; align-items: stretch; gap: 16px; padding-bottom: 76px; }
.detail-grid > *, .detail-grid > .stack > * { min-width: 0; }
.detail-grid > .stack { display: contents; }
.breakdown__row { grid-template-columns: 1fr auto; row-gap: 6px; }
.breakdown__row .breakdown__track { grid-column: 1 / -1; order: 3; }
.histchart { height: 150px; }

/* folded panels in priority order, as one list */
.detail-grid--listing { gap: 0; }
.detail-grid--listing > .panel, .detail-grid--listing > .stack > .panel { margin-top: -1px; }
.dp-why { order: 1; }
.dp-history { order: 2; }
.dp-comps { order: 3; }
.dp-ident { order: 4; }
.dp-activity { order: 5; }
.dp-history.is-collapsible { padding: 0; }
.dp-history.is-collapsible > .panel__head { padding: 14px 44px 14px 15px; }

/* ═══════════ Inventory item ═══════════ */
.detail-grid--inv .invitem { order: 1; }
.detail-grid--inv .invproj { order: 2; }
.detail-grid--inv .invcosts { order: 3; }
.detail-grid--inv > .stack > :last-child { order: 4; }       /* photos */
.detail-grid--inv { gap: 12px; padding-bottom: 76px; }
.panel > .detail-head__grad[style] { margin: -15px -15px 15px !important; }   /* inline -20px overflows 15px panels */

/* item panel → just the status switcher (+ notes / source link) */
.invitem > .panel__head, .invitem > .statrow { display: none; }
.invitem > p { margin-top: 0 !important; }
.invitem:not(:has(.statusbar, p, a)) { display: none; }
.invitem .statusbar {
  display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 0;
  margin: 0; padding: 0; border: 0;
}
.invitem p + .statusbar, .invitem .mono + .statusbar { margin-top: 14px; }
.invitem .statusbar .btn { min-height: 44px; margin-left: -1px; font-size: 13px; }

/* projection / sold panel → folded breakdown (the number is in the summary) */
.invproj > div[style*="font-size:34px"] { display: none; }
.invproj.is-collapsible > [data-m-head] { min-height: 30px; }

/* add-cost form */
.invcosts .miniform {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
  margin: 0; padding: 12px 15px 15px;
}
.invcosts .miniform > input[name="note"], .invcosts .miniform > .btn { grid-column: 1 / -1; }
.invcosts .miniform input, .invcosts .miniform select { width: 100%; min-width: 0; }

/* photos */
.photogrid { grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 12px 15px; }
.photo__bar { flex-wrap: wrap; }
.photoupload { margin: 0; padding: 0 15px 15px; }
.photoupload input[type="file"] { flex: 1 1 100%; width: 100%; min-width: 0; min-height: 44px; padding: 8px 0; font-size: 14px !important; }
.photoupload .btn { flex: 1; }

/* record sale → bottom sheet */
.salegroup { border-top-width: 2px; }
.salegroup__mhead[hidden] { display: flex; }
.salegroup > .miniform-title { display: none; }
.salegroup .fieldlbl { flex-direction: column; align-items: stretch; gap: 6px; font-size: 12px; }
.salegroup .fieldlbl input, .salegroup .fieldlbl select { max-width: none; width: 100%; min-height: 48px; }
.salegroup > .btn { min-height: 52px; font-size: 15px; justify-content: center; margin-top: 4px; }

/* ═══════════ Add listing ═══════════ */
.formgrid { grid-template-columns: minmax(0, 1fr); }
.formgrid .fieldlbl > input, .formgrid .fieldlbl > select, .formgrid .fieldlbl > textarea { width: 100%; min-width: 0; box-sizing: border-box; }
.formgrid .fieldlbl input, .formgrid .fieldlbl select, .formgrid .fieldlbl textarea { min-height: 48px; }
.fieldlbl { font-size: 12px; }
.fieldlbl.span2 { grid-column: 1; }
form.panel > div[style*="display:flex"] .btn { flex: 1; min-height: 48px; font-size: 14px; }
.addproj--empty { display: none; }
.addproj {
  position: sticky; bottom: calc(72px + env(safe-area-inset-bottom));
  z-index: 20; margin: 0 -15px; border-left: 0; border-right: 0;
}
.addproj .calcrows, .addproj > .mono.small.muted { display: none; }
.addproj > div[style*="font-size:34px"] { font-size: 28px !important; margin: 8px 0 0 !important; }

/* ═══════════ Inventory list ═══════════ */
.invtabs { overflow-x: auto; flex-wrap: nowrap; gap: 4px; padding: 8px 15px; scrollbar-width: none; }
.invtabs::-webkit-scrollbar { display: none; }
.invtabs .invtab { flex: none; white-space: nowrap; display: inline-flex; align-items: center; min-height: 44px; padding: 0 13px; font-size: 13px; }
.invtabs > span[style] { display: none !important; }   /* CSV lives in the account sheet, Add is a tab */
.invtabs .ltabs__note { display: none; }               /* the tab name says it on a phone */

.itable__head { display: none; }
.itable { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.itable__empty { grid-column: 1 / -1; }
.itable__row { display: flex; align-items: center; gap: 12px; padding: 12px 15px; border-bottom: 1px solid var(--line); }
.itable__row:active { background: rgba(124, 92, 255, 0.09); }
.itable__row > :not(.itable__item):not(.im-side) { display: none; }
.itable__item { flex: 1; min-width: 0; gap: 12px; }
.itable__thumb { width: 44px; height: 44px; }
.itable__title { font-size: 15px; font-weight: 600; }
.itable__item .mono.small.muted:not(.itable__sub) { display: none; }
.itable__sub[hidden] {
  display: flex; align-items: center; gap: 8px; margin-top: 5px;
  font-size: 12.5px; white-space: nowrap; overflow: hidden;
}
.im-side[hidden] { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; flex: none; }
.im-net { font-size: 17px; font-weight: 700; letter-spacing: -0.3px; }
.im-k { font-size: 12px; color: var(--text-muted); }

.stack > .dash-grid > .panel { margin-bottom: 0; }
.stack > .dash-grid > .panel + .panel { margin-top: -1px; }

/* ═══════════ Alerts drawer → full-screen sheet ═══════════ */
.drawer { top: 0; width: 100%; box-shadow: none; }
.drawer.is-open { z-index: 60; }
.drawer__head { padding: 6px 6px 6px 15px; padding-top: calc(6px + env(safe-area-inset-top)); min-height: 56px; }
.drawer__head .panel__title { font-size: 16px; }
.drawer__head-actions { gap: 4px; }
.drawer__head-actions [data-drawer-close] { width: 44px; justify-content: center; font-size: 26px; }
.notif { padding: 15px; }
.notif__title { font-size: 14px; }
.notif--read { opacity: 0.62; }

/* ═══════════ Workspace admin / review — stack the grids ═══════════ */
.srcgrid { grid-template-columns: 1fr; }
.mtable__head { display: none; }
.mtable__row { grid-template-columns: 1fr; gap: 8px; padding: 14px 15px; }
.reviewrow { grid-template-columns: 1fr; gap: 10px; padding: 14px 15px; }
.reviewrow .rolepick, .reviewrow .btn { width: 100%; }
.reviewrow a { overflow-wrap: anywhere; }
.inviterow { flex-wrap: wrap; }
.inviterow input { flex-basis: 100%; }