/* Studio OS — Phone layout (see mobile.jsx). Everything here is gated to
   ≤760px so desktop and iPad layouts are untouched. */

:root { --mb-tabs-h: 64px; --mb-safe-b: env(safe-area-inset-bottom, 0px); }

.mb-tabs, .mb-sheet, .mb-detail-bar, .mb-overlay { display: none; }

@media (max-width: 760px) {

  /* ── Shell ─────────────────────────────────────────────────────── */
  .app { height: 100dvh; }
  .sidebar { display: none; }
  .main { padding-bottom: calc(var(--mb-tabs-h) + var(--mb-safe-b)); }

  .topbar { padding: 0 8px 0 12px; gap: 8px; }
  .topbar .brand-wordmark, .topbar .brand-tagline { display: none; }
  .topbar-search { flex: 1 1 0; min-width: 0; width: auto; max-width: none; margin: 0; }
  .topbar-search input { min-width: 0; width: 100%; }
  .topbar-right > .icon-btn:first-child { display: none; } /* theme toggle lives in More */
  .topbar-search .kbd { display: none; }
  .topbar-search input { font-size: 16px; } /* no iOS zoom-on-focus */
  .topbar-right { gap: 2px; }
  .topbar-divider { display: none; }
  .topbar .icon-btn { width: 40px; height: 40px; }
  .gs-results { position: fixed; left: 8px; right: 8px; top: calc(var(--topbar-h) + 4px); width: auto; max-height: 70dvh; }

  /* Bottom tab bar */
  .mb-tabs {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    padding: 4px 4px calc(6px + var(--mb-safe-b));
    background: var(--bg-rail); border-top: 1px solid var(--border);
  }
  .mb-tab {
    flex: 1; min-width: 0; min-height: 54px; position: relative;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    color: var(--text-muted); border-radius: 8px;
  }
  .mb-tab-glyph { font-size: 17px; line-height: 1; }
  .mb-tab-label { font-size: 10.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; padding: 0 2px; }
  .mb-tab.on { color: color-mix(in oklab, var(--accent) 80%, var(--text-primary)); }
  .mb-tab.on::before {
    content: ""; position: absolute; top: -5px; left: 30%; right: 30%; height: 2px; border-radius: 2px;
    background: var(--accent); box-shadow: 0 0 8px var(--accent);
  }

  /* More sheet (full screen above the tab bar) */
  .mb-sheet {
    display: flex; flex-direction: column; position: fixed; z-index: 55;
    left: 0; right: 0; top: var(--topbar-h); bottom: calc(var(--mb-tabs-h) + var(--mb-safe-b));
    background: var(--bg);
  }
  .mb-sheet-head { display: flex; align-items: center; gap: 8px; padding: 12px 12px 8px 16px; border-bottom: 1px solid var(--border); }
  .mb-sheet-kicker { position: absolute; opacity: 0; pointer-events: none; }
  .mb-sheet-title { flex: 1; margin: 0; font-size: 22px; font-weight: 600; letter-spacing: -0.02em; }
  .mb-sheet-body { flex: 1; overflow-y: auto; padding: 4px 16px 24px; }
  .mb-group { margin-top: 14px; }
  .mb-group-title {
    display: flex; justify-content: space-between; margin: 16px 0 6px;
    font-size: 10.5px; letter-spacing: 0.09em; text-transform: uppercase; color: var(--text-muted);
  }
  .mb-group-list { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); overflow: hidden; }
  .mb-row {
    display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; padding: 0 12px;
    border-bottom: 1px solid color-mix(in oklab, var(--border) 70%, transparent); text-align: left; color: var(--text-primary);
  }
  .mb-group-list > .mb-row:last-child { border-bottom: none; }
  .mb-row.on { background: color-mix(in oklab, var(--accent) 8%, transparent); }
  .mb-row.dim { color: var(--text-muted); }
  .mb-row-static { padding-right: 4px; }
  .mb-row-cta { margin-top: 16px; border: 1px solid color-mix(in oklab, var(--accent) 35%, var(--border)); border-radius: var(--radius); background: var(--surface); }
  .mb-row-cta + .mb-row { margin-top: 8px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
  .mb-row-glyph { width: 20px; text-align: center; color: var(--accent); font-size: 15px; flex-shrink: 0; }
  .mb-row-num { width: 14px; font-size: 11px; color: var(--text-muted); }
  .mb-row-label { flex: 1; min-width: 0; font-size: 15px; }
  .mb-row-sub { display: block; font-size: 12px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mb-row-chev { color: var(--text-faint); font-size: 18px; }
  .mb-tag { font-size: 9.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted); border: 1px solid var(--border-strong); border-radius: 4px; padding: 0 5px; white-space: nowrap; }
  .mb-help { font-size: 13px; color: var(--text-secondary); margin: 10px 0 4px; line-height: 1.5; }
  .mb-icon-btn {
    width: 44px; height: 44px; flex-shrink: 0; border-radius: 8px; display: grid; place-items: center;
    font-size: 17px; color: var(--text-primary);
  }
  .mb-icon-btn:disabled { opacity: 0.3; }
  .mb-icon-btn.danger { color: var(--red); }
  .mb-icon-btn.add { color: var(--green); font-size: 20px; }
  .mb-text-btn { min-height: 44px; padding: 0 10px; color: var(--accent); font-weight: 500; }

  /* Bottom sheets (column picker, channel card) */
  .mb-overlay {
    display: flex; align-items: flex-end; position: fixed; inset: 0; z-index: 70;
    background: oklch(0.10 0.005 65 / 0.62);
  }
  .mb-bottom-sheet {
    width: 100%; max-height: 88dvh; display: flex; flex-direction: column;
    background: var(--surface); border-top: 1px solid var(--border-strong); border-radius: 16px 16px 0 0;
    padding: 8px 16px calc(16px + var(--mb-safe-b)); box-shadow: 0 -12px 40px rgba(0,0,0,0.5);
  }
  .mb-grab { width: 40px; height: 4px; border-radius: 2px; background: var(--border-strong); margin: 0 auto 10px; flex-shrink: 0; }
  .mb-bs-head { display: flex; align-items: baseline; justify-content: space-between; }
  .mb-bs-head h3 { margin: 0; font-size: 17px; font-weight: 600; }
  .mb-bs-head .mono { font-size: 11px; color: var(--text-muted); }
  .mb-check { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; border-bottom: 1px solid var(--border); text-align: left; color: var(--text-primary); }
  .mb-box { width: 22px; height: 22px; border-radius: 5px; border: 1.5px solid var(--border-strong); display: grid; place-items: center; font-size: 13px; flex-shrink: 0; }
  .mb-box.on { background: var(--accent); border-color: var(--accent); color: oklch(0.17 0.01 60); }
  .mb-check-label { flex: 1; font-size: 15px; }
  .mb-check-note { font-size: 10.5px; color: var(--text-muted); }
  .mb-bs-done { width: 100%; height: 46px; margin-top: 12px; justify-content: center; }

  /* ── Page chrome shared by modules ─────────────────────────────── */
  .dashboard, .bookings, .contacts, .invoicing, .inventory, .maintenance,
  .sessionlogs, .inputsheets, .recall { padding: 16px 16px 32px; }
  .main > div:not([class]) { padding: 16px 16px 32px; } /* Settings root */
  .page-head { flex-direction: column; gap: 14px; margin-bottom: 16px; padding-bottom: 16px; }
  .page-title { font-size: 30px; margin-top: 8px; }
  .page-head-r { width: 100%; min-width: 0; }
  .stat-strip {
    display: flex; overflow-x: auto; gap: 8px; margin: 0 -16px 16px; padding: 0 16px;
    scroll-snap-type: x proximity;
  }
  .stat-strip > * { flex: 0 0 140px; scroll-snap-align: start; }
  button, .tb-btn { min-height: 36px; }

  /* ── Master–detail: list first, detail full screen when a row is tapped */
  .bk-body, .sl-body, .mt-body, .ct-body, .iv-body, .inv-body { display: block; }
  .bk-body > .bk-detail { width: auto; }
  :is(.bk-detail, .sl-detail, .mt-detail, .ct-detail, .iv-detail, .drawer) { display: none; }
  .main[data-mdetail="open"] :is(.bk-detail, .sl-detail, .mt-detail, .ct-detail, .iv-detail):not(.empty),
  .main[data-mdetail="open"] .drawer:not(.drawer--closed) {
    display: flex; flex-direction: column;
    position: fixed; z-index: 50; left: 0; right: 0; width: auto; max-height: none;
    top: calc(var(--topbar-h) + 48px); bottom: auto;
    height: calc(100dvh - var(--topbar-h) - 48px - var(--mb-tabs-h) - var(--mb-safe-b));
    margin: 0; border-radius: 0; border-left: none; border-right: none; transform: none; opacity: 1;
    overflow-y: auto; padding-bottom: 24px; background: var(--bg);
  }
  .main[data-mdetail="open"] .drawer:not(.drawer--closed) { display: flex; }
  .main[data-mdetail="open"] .drawer .drawer-scroll { overflow-y: auto; }
  .main[data-mdetail="open"] .mb-detail-bar {
    display: flex; align-items: center; position: fixed; z-index: 51; left: 0; right: 0;
    top: var(--topbar-h); height: 48px; padding: 0 8px; background: var(--bg-rail); border-bottom: 1px solid var(--border);
  }
  .mb-detail-back {
    display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 10px;
    font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-secondary);
  }
  .mb-detail-back span { font-size: 22px; font-family: var(--font-sans); color: var(--text-primary); }
  .main[data-mdetail="open"] :is(.bk-detail-close, .ct-detail-close, .drawer-close) { display: none; }

  /* ── Dashboard ─────────────────────────────────────────────────── */
  .db-rooms { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .db-body { grid-template-columns: 1fr; }
  .db-action-title { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.3; }
  .db-action-cta { height: 36px; }

  /* ── Bookings ──────────────────────────────────────────────────── */
  .bk-header { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 12px; }
  .bk-header-l { width: 100%; justify-content: space-between; }
  .bk-header-c { width: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; padding: 10px 0 0; border-top: 1px solid var(--border); border-left: none; }
  .bk-header-c .bk-stat { padding: 0; border: none; min-width: 0; }
  .bk-header-r { width: 100%; display: flex; gap: 8px; }
  .bk-view-toggle { flex: 1; display: flex; }
  .bk-view-toggle button { flex: 1; min-height: 38px; }
  .bk-header-r .tb-btn { min-height: 40px; }
  .bk-month-grid { min-width: 0 !important; }
  .bk-month-bar, .bk-pill { font-size: 9px; }
  .bk-cal-wrap { overflow-x: auto; }

  /* ── Inventory (Gear) ──────────────────────────────────────────── */
  .inventory .status-pills, .inventory .room-selector, .inventory .stat-strip { display: none; }
  .inventory .filter-bar { flex-direction: column; align-items: stretch; gap: 8px; }
  .inventory .filter-bar-stack, .inventory .filter-bar { min-width: 0; max-width: 100%; }
  .inventory .cat-tabs { width: calc(100% + 32px); min-width: 0; max-width: none; margin: 0 -16px; padding: 0 16px; flex: 0 0 auto; }
  .inventory .cat-tab { flex-shrink: 0; min-height: 40px; }
  .inventory .filter-bar-right:empty { display: none; }
  .inventory .toolbar { flex-wrap: nowrap; gap: 8px; }
  .inventory .toolbar-l .tb-btn.ghost,
  .inventory .toolbar-r .tb-toggle,
  .inventory .toolbar-r > .tb-btn { display: none; } /* import, print, bulk, view, settings: desktop jobs */
  .inventory .toolbar-r { margin-left: auto; min-width: 0; }
  .inventory .toolbar .tb-btn { min-height: 40px; }
  .mg-more { width: 100%; min-height: 48px; margin-top: 8px; }
  .mg-list { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); overflow: hidden; }
  .mg-row {
    display: flex; align-items: center; gap: 12px; width: 100%; min-height: 58px; padding: 8px 12px;
    border-bottom: 1px solid color-mix(in oklab, var(--border) 70%, transparent); text-align: left; color: var(--text-primary);
  }
  .mg-row:last-child { border-bottom: none; }
  .mg-row.selected { background: color-mix(in oklab, var(--accent) 8%, transparent); }
  .mg-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
  .mg-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
  .mg-name { font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mg-brand { color: var(--text-muted); }
  .mg-sub { font-size: 10.5px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mg-flag { color: oklch(0.85 0.14 80); }
  .mg-status { font-size: 9.5px; letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; }

  /* ── Input sheets ──────────────────────────────────────────────── */
  .inputsheets .is-sidebar, .inputsheets .is-add-rail { display: none; }
  .inputsheets .is-body { display: block; padding: 0; }
  .inputsheets .session-head { flex-direction: column; gap: 12px; }
  .inputsheets .sh-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .inputsheets .wb-tabs { overflow-x: auto; flex-wrap: nowrap; }
  .inputsheets .song-meta { flex-wrap: wrap; gap: 8px; }

  .mis-presets { display: flex; gap: 2px; padding: 3px; margin: 4px 0 8px; border-radius: 8px; background: var(--surface-2); border: 1px solid var(--border); }
  .mis-presets button { flex: 1; min-height: 38px; border-radius: 6px; font-size: 13px; font-weight: 500; color: var(--text-secondary); white-space: nowrap; }
  .mis-presets button.on { background: color-mix(in oklab, var(--accent) 16%, var(--surface-3)); color: color-mix(in oklab, var(--accent) 70%, var(--text-primary)); box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--accent) 45%, transparent); }
  .mis-meta { display: flex; align-items: center; gap: 12px; font-size: 10.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 6px; }
  .mis-meta button { min-height: 32px; color: var(--accent); font: inherit; letter-spacing: inherit; }
  .mis-spacer { flex: 1; }
  .mis-table { margin: 0 -16px; border-top: 1px solid var(--border); }
  .mis-thead {
    position: sticky; top: 0; z-index: 3; display: flex; align-items: center; gap: 8px; height: 30px; padding: 0 10px 0 12px;
    background: var(--surface); border-bottom: 1px solid var(--border-strong);
    font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.09em; text-transform: uppercase; color: var(--text-secondary);
  }
  .mis-sec {
    position: sticky; top: 30px; z-index: 2; display: flex; align-items: center; gap: 8px; width: 100%; min-height: 40px; padding: 0 10px 0 0;
    background: var(--bg-rail); border-bottom: 1px solid var(--border); text-align: left; color: var(--text-primary);
  }
  .mis-sec-rail { width: 4px; align-self: stretch; background: var(--sec); }
  .mis-sec-chev { width: 12px; font-size: 11px; color: var(--text-secondary); }
  .mis-sec-label { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 600; color: var(--sec); }
  .mis-sec-count { font-size: 10px; color: var(--text-muted); }
  .mis-row {
    display: flex; align-items: center; gap: 8px; width: 100%; min-height: 54px; padding: 5px 10px 5px 12px;
    border-bottom: 1px solid color-mix(in oklab, var(--border) 60%, transparent); text-align: left; color: var(--text-primary);
  }
  .mis-row:nth-of-type(even) { background: color-mix(in oklab, var(--surface) 45%, transparent); }
  .mis-row.selected { background: color-mix(in oklab, var(--accent) 10%, transparent); }
  .mis-c-ch { width: 22px; flex-shrink: 0; text-align: right; font-size: 14px; font-weight: 600; color: var(--sec, var(--text-secondary)); }
  .mis-thead .mis-c-ch { font-size: 9.5px; font-weight: 400; color: inherit; }
  .mis-c-src { width: 104px; flex-shrink: 0; min-width: 0; display: flex; flex-direction: column; }
  .mis-c-x { flex: 1; min-width: 0; }
  .mis-c-tk { width: 22px; flex-shrink: 0; text-align: right; font-size: 12px; color: var(--text-secondary); }
  .mis-c-go { width: 10px; flex-shrink: 0; color: var(--text-faint); font-size: 14px; }
  .mis-src-name { display: flex; align-items: center; gap: 5px; font-size: 14px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mis-src-name .is-src-icon { width: 15px; height: 15px; flex-shrink: 0; color: var(--text-secondary); }
  .mis-text { display: flex; flex-direction: column; min-width: 0; }
  .mis-main { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mis-text.notes .mis-main { font-family: var(--font-serif); font-style: italic; color: var(--text-secondary); }
  .mis-sub { font-size: 10.5px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mis-brand { color: var(--text-muted); }
  .mis-dim { color: var(--text-faint); }
  .mis-flags { display: inline-flex; gap: 3px; }
  .mis-flags span { font-family: var(--font-mono); font-size: 9.5px; line-height: 16px; padding: 0 5px; border-radius: 3px; border: 1px solid var(--border); color: var(--text-faint); }
  .mis-flags .on, .mcs-flags .on { border-color: transparent; }
  .f48 { background: oklch(0.35 0.10 25); color: oklch(0.92 0.06 25) !important; }
  .fpad { background: oklch(0.36 0.08 80); color: oklch(0.94 0.06 85) !important; }
  .fhpf { background: oklch(0.33 0.07 240); color: oklch(0.90 0.05 240) !important; }
  .fph { background: oklch(0.33 0.07 300); color: oklch(0.90 0.05 300) !important; }
  .mis-gain { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; }
  .mis-gain-bar { display: inline-block; width: 44px; height: 4px; border-radius: 2px; background: var(--surface-3); overflow: hidden; }
  .mis-gain-bar.wide { flex: 1; width: auto; height: 6px; }
  .mis-gain-bar span { display: block; height: 100%; background: linear-gradient(90deg, var(--green), var(--accent)); }
  .mis-tl { display: inline-flex; align-items: center; gap: 6px; padding-right: 7px; border-radius: 4px; background: var(--surface-2); overflow: hidden; font-size: 11.5px; white-space: nowrap; }
  .mis-tl-rail { width: 3px; align-self: stretch; background: var(--tl); }

  /* Channel card */
  .mcs { max-height: 90dvh; }
  .mcs-head { display: flex; align-items: flex-start; gap: 12px; padding: 4px 0 10px; }
  .mcs-num {
    width: 52px; height: 52px; border-radius: 10px; flex-shrink: 0; display: grid; place-items: center;
    font-size: 20px; font-weight: 600; color: var(--sec); border: 1px solid var(--sec); background: color-mix(in oklab, var(--sec) 14%, transparent);
  }
  .mcs-title { flex: 1; min-width: 0; }
  .mcs-kicker { font-size: 10px; letter-spacing: 0.09em; text-transform: uppercase; color: var(--sec); }
  .mcs-name { display: flex; align-items: center; gap: 8px; font-size: 22px; font-weight: 600; letter-spacing: -0.02em; }
  .mcs-name .is-src-icon { width: 20px; height: 20px; color: var(--text-secondary); }
  .mcs-pos { font-size: 13px; color: var(--text-secondary); }
  .mcs-body { flex: 1; overflow-y: auto; margin: 0 -16px; padding: 0 16px; }
  .mcs-field { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 8px 0; border-bottom: 1px solid var(--border); }
  .mcs-field.col { flex-direction: column; align-items: stretch; gap: 8px; }
  .mcs-k { width: 74px; flex-shrink: 0; font-size: 10px; letter-spacing: 0.09em; text-transform: uppercase; color: var(--text-muted); }
  .mcs-field.col .mcs-k { width: auto; }
  .mcs-v { flex: 1; min-width: 0; font-size: 15px; }
  .mcs-sub { font-size: 11.5px; color: var(--text-muted); }
  .mcs-flags { display: flex; gap: 6px; }
  .mcs-flags button, .mcs-ph {
    flex: 1; min-height: 46px; border-radius: 8px; display: grid; place-items: center;
    font-family: var(--font-mono); font-size: 13px; font-weight: 600; border: 1px solid var(--border-strong); color: var(--text-faint);
  }
  .mcs-flags button:disabled { opacity: 1; }
  .mcs-gain { display: flex; align-items: center; gap: 10px; }
  .mcs-gain-n { font-size: 16px; font-weight: 600; min-width: 34px; text-align: right; }
  .mcs-notes { width: 100%; font: 15px/1.5 var(--font-sans); padding: 8px 10px; resize: none; }
  .mcs-notes-view { font-family: var(--font-serif); font-style: italic; color: var(--text-secondary); }
  .mcs-nav { display: flex; gap: 8px; padding-top: 10px; border-top: 1px solid var(--border); }
  .mcs-nav .tb-btn { flex: 1; min-height: 52px; height: auto; gap: 8px; justify-content: space-between; text-align: left; }
  .mcs-nav .tb-btn:last-child { text-align: right; }
  .mcs-nav .tb-btn > span:not([aria-hidden]) { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; font-size: 13px; }
  .mcs-nav .tb-btn .mono { font-size: 10px; color: var(--text-muted); }
  .mcs-nav [aria-hidden] { font-size: 20px; }

  /* ── Rolodex ───────────────────────────────────────────────────── */
  .ct-toolbar { flex-direction: column; align-items: stretch; gap: 8px; }
  .ct-tabs-wrap { overflow-x: auto; }
  .ct-toolbar-r { justify-content: space-between; }
  .ct-row { grid-template-columns: 44px minmax(0, 1fr); }
  .ct-row-tail { display: none; }
  .ct-row-body > * { min-width: 0; }

  /* ── Maintenance ───────────────────────────────────────────────── */
  .mt-sched-track { overflow-x: auto; margin: 0 -16px; padding: 0 16px 4px; }

  /* ── Settings / modals ─────────────────────────────────────────── */
  .st-tabs { flex-wrap: wrap; gap: 8px; }
  .st-tabs .st-autosave { width: 100%; justify-content: flex-end; }
  .st-row-r { width: 100%; min-width: 0; max-width: 100%; }
  .st-row-r .st-input, .st-row-r input, .st-row-r .cs-wrap { width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; }
  .modal, [class*="modal-card"] { width: calc(100vw - 16px) !important; max-width: none !important; max-height: 90dvh; }
  .modal-grid { grid-template-columns: 1fr !important; }
}

/* ── Phone screens from the Claude Design mockups (mobile-screens.jsx) ── */
@media (max-width: 760px) {
  /* Replace desktop chrome on the screens that have a phone version */
  .bookings > .page-head, .bookings > .bk-header, .bookings > .inv-search-bar, .bookings > .bk-filters,
  .inventory > .page-head, .inventory .toolbar,
  .inventory .filter-bar-stack > div:not(.filter-bar) { display: none; }
  .bookings, .inventory { padding-top: 12px; }

  /* Tab bar + More: line icons */
  .mb-tab svg { flex-shrink: 0; }
  .mb-row-glyph { display: inline-flex; justify-content: center; }
  .mb-profile { display: flex; align-items: center; gap: 12px; margin-top: 12px; padding: 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); }
  .mb-avatar { width: 44px; height: 44px; border-radius: 22px; display: grid; place-items: center; font-size: 13px; font-weight: 600; flex-shrink: 0;
    background: linear-gradient(180deg, oklch(0.55 0.08 55), oklch(0.38 0.06 50)); color: oklch(0.96 0.01 80); }

  /* Shared pieces */
  .ms-page { padding: 12px 16px 32px; }
  .ms-k { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-secondary); font-weight: 500; display: inline-flex; align-items: center; gap: 8px; }
  .ms-k.small { font-size: 10px; }
  .ms-k.strong { color: var(--text-primary); }
  .ms-gap { display: flex; margin: 24px 0 10px; }
  .ms-meta { font-size: 13px; color: var(--text-secondary); }
  .ms-meta.small { font-size: 12px; }
  .serif { font-family: var(--font-serif); font-style: italic; }
  .ms-h1 { margin: 6px 0 0; font-size: 28px; font-weight: 500; letter-spacing: -0.02em; line-height: 1.15; }
  .ms-h2 { margin: 0; flex: 1; font-size: 24px; font-weight: 500; letter-spacing: -0.02em; }
  .ms-row-head { display: flex; align-items: center; gap: 4px; margin-bottom: 12px; }
  .ms-gear-head { margin-bottom: 14px; }
  .ms-stack { display: flex; flex-direction: column; gap: 8px; }
  .ms-card { display: flex; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; text-align: left; color: var(--text-primary); width: 100%; }
  .ms-btn {
    min-height: 44px; padding: 0 14px; border-radius: 8px; border: 1px solid var(--border-strong); background: transparent;
    color: var(--text-primary); font-size: 14px; font-weight: 500; display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex-shrink: 0; white-space: nowrap;
  }
  .ms-btn.primary { background: var(--accent); border-color: var(--accent); color: oklch(0.18 0.01 60); }
  .ms-btn.dashed { border-style: dashed; }
  .ms-btn.full { width: 100%; }
  .ms-btn.tiny { min-height: 36px; padding: 0 10px; font-family: var(--font-mono); font-size: 11px; }
  .ms-btn.ok { color: var(--green); border-color: color-mix(in oklab, var(--green) 45%, transparent); }
  .ms-btn-row { display: flex; gap: 8px; margin-top: 16px; }
  .ms-btn-row > .ms-btn { flex: 1; }
  .ms-icon { width: 44px; height: 44px; flex-shrink: 0; border-radius: 8px; display: grid; place-items: center; color: var(--text-primary); font-size: 22px; border: 1px solid transparent; }
  .ms-icon.on { border-color: var(--border-strong); }
  .ms-icon.primary { background: var(--accent); color: oklch(0.18 0.01 60); }
  .ms-icon.sm { width: 40px; height: 40px; font-size: 20px; }
  .ms-link { min-height: 40px; padding: 0 8px; color: var(--accent); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; }
  .ms-link.danger { color: var(--red); margin-top: 16px; }
  .ms-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; display: inline-block; }
  .ms-dot.live { background: oklch(0.72 0.20 25); margin-right: 6px; }
  .ms-pip { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 6px var(--accent); }
  .ms-count { font-size: 12px; color: var(--accent); padding: 2px 8px; border: 1px solid color-mix(in oklab, var(--accent) 45%, var(--border)); border-radius: 10px; }
  .ms-section-head { display: flex; align-items: center; justify-content: space-between; margin: 24px 0 10px; }
  .ms-empty { padding: 16px; color: var(--text-secondary); text-align: center; }
  .ms-spacer { flex: 1; }
  .ms-num { display: block; font-size: 20px; font-weight: 500; font-variant-numeric: tabular-nums; }
  .ms-num.ok { color: var(--green); }
  .ms-num.warn { color: var(--red); }
  .ms-late { color: var(--red); font-size: 12px; }
  .ms-ok { color: var(--green); font-size: 12px; }
  .ms-chips { display: flex; gap: 6px; overflow-x: auto; margin: 0 -16px; padding: 4px 16px 10px; }
  .ms-chip { flex-shrink: 0; min-height: 36px; padding: 0 12px; border-radius: 18px; border: 1px solid var(--border-strong); display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-primary); white-space: nowrap; }
  .ms-chip.on { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 14%, transparent); }
  .ms-acc { color: var(--accent); font-size: 11px; }
  .ms-list { border: 1px solid var(--border); border-radius: 10px; background: var(--surface); overflow: hidden; }
  .ms-list-row { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 0 14px; border-bottom: 1px solid var(--border); text-align: left; color: var(--text-primary); }
  .ms-list-row:last-child { border-bottom: none; }
  .ms-list-main { flex: 1; min-width: 0; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .ms-chev { color: var(--text-faint); font-size: 18px; }
  .ms-input { width: 100%; box-sizing: border-box; padding: 10px 12px; border-radius: 8px; font: 15px/1.5 var(--font-sans); resize: none; margin-top: 10px; min-height: 44px; }
  .ms-state { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 600; }
  @keyframes ms-pip { 0%, 100% { opacity: 1 } 50% { opacity: 0.4 } }
  .ms-dot.pulse { animation: ms-pip 1.4s ease-in-out infinite; }
  @media (prefers-reduced-motion: reduce) { .ms-dot.pulse { animation: none; } }

  /* Today */
  .ms-hero { padding: 4px 0 16px; }
  .ms-hero .ms-meta { margin-top: 4px; }
  .ms-room { position: relative; overflow: hidden; display: flex; text-align: left; width: 100%; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; color: var(--text-primary); }
  .ms-room.dark { background: transparent; border-style: dashed; }
  .ms-room-rail { width: 4px; flex-shrink: 0; background: var(--rc); box-shadow: 0 0 10px var(--rc); }
  .ms-room.dark .ms-room-rail { opacity: 0.4; box-shadow: none; }
  .ms-room-body { flex: 1; min-width: 0; padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
  .ms-room-top { display: flex; justify-content: space-between; align-items: center; }
  .ms-room-artist { font-size: 17px; font-weight: 500; }
  .ms-room-artist.serif { font-size: 16px; font-weight: 400; color: var(--text-secondary); }
  .ms-room-note { font-size: 12px; color: var(--green); }
  .ms-room-note.late { color: var(--red); }
  .ms-action { gap: 12px; padding: 12px; align-items: center; }
  .ms-sev { width: 4px; align-self: stretch; border-radius: 2px; flex-shrink: 0; }
  .ms-action-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
  .ms-action-title { font-size: 14px; font-weight: 500; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .ms-action .ms-meta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .ms-money { flex-direction: column; padding: 14px; }
  .ms-money-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .ms-money-grid > span { display: flex; flex-direction: column; }
  .ms-bar { display: block; height: 6px; margin-top: 12px; border-radius: 3px; background: var(--surface-3); overflow: hidden; }
  .ms-bar span { display: block; height: 100%; background: linear-gradient(90deg, var(--green), var(--accent)); }

  /* Bookings agenda */
  .ms-agenda { padding-bottom: 8px; }
  .ms-week-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
  .ms-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
  .ms-day { min-height: 60px; border-radius: 10px; border: 1px solid var(--border); background: var(--surface); color: var(--text-primary); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; }
  .ms-day-dow { font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-secondary); }
  .ms-day-n { font-size: 17px; font-weight: 500; }
  .ms-day-dots { font-size: 9px; line-height: 1; color: var(--accent); min-height: 9px; }
  .ms-day.today .ms-day-n { color: var(--accent); }
  .ms-day.on { background: var(--accent); border-color: var(--accent); color: oklch(0.18 0.01 60); }
  .ms-day.on .ms-day-dow, .ms-day.on .ms-day-dots, .ms-day.on .ms-day-n { color: oklch(0.18 0.01 60); }
  .ms-empty-card { flex-direction: column; align-items: center; gap: 12px; padding: 20px; border-style: dashed; background: transparent; color: var(--text-secondary); }
  .ms-ev { overflow: hidden; min-height: 64px; }
  .ms-ev.selected { border-color: var(--accent); }
  .ms-ev-time { width: 64px; flex-shrink: 0; padding: 12px 0 12px 12px; display: flex; flex-direction: column; gap: 2px; font-size: 13px; font-weight: 500; }
  .ms-ev-time span { font-size: 12px; font-weight: 400; color: var(--text-secondary); }
  .ms-ev-rail { width: 3px; margin: 10px 0; border-radius: 2px; flex-shrink: 0; background: var(--rc); }
  .ms-ev-body { flex: 1; min-width: 0; padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
  .ms-ev-top { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
  .ms-ev-title { font-size: 16px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .ms-ev-status { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; flex-shrink: 0; }

  /* Live session log */
  .sessionlogs:has(.ms-log) { padding: 0; }
  .ms-back-row { display: flex; align-items: center; gap: 4px; margin: 0 0 4px -10px; }
  .ms-clock { flex-direction: column; padding: 16px; margin-top: 14px; }
  .ms-clock.live { border-color: color-mix(in oklab, oklch(0.72 0.20 25) 55%, var(--border)); }
  .ms-clock-top { display: flex; justify-content: space-between; align-items: center; }
  .ms-timer { font-size: 44px; font-weight: 500; letter-spacing: -0.02em; margin: 8px 0 4px; font-variant-numeric: tabular-nums; }
  .ms-clock-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-top: 12px; border-top: 1px solid var(--border); font-size: 14px; }
  .ms-clock-grid > div { display: flex; flex-direction: column; gap: 2px; }
  .ms-rows { flex-direction: column; padding: 0 14px; }
  .ms-rows > .ms-btn.full { margin: 10px 0; }
  .ms-crew { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border); }
  .ms-avatar { width: 36px; height: 36px; border-radius: 18px; background: var(--surface-3); display: grid; place-items: center; font-size: 12px; flex-shrink: 0; }
  .ms-crew-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
  .ms-crew-name { font-size: 14.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .ms-addcrew { padding: 10px 0; }
  .ms-addcrew .ms-btn-row { margin-top: 8px; }
  .ms-addcrew select.ms-input { margin-top: 0; flex: 1; }
  .ms-exp { align-items: center; gap: 12px; padding: 10px 12px; }
  .ms-expform { padding: 12px; display: block; }
  .ms-total { display: flex; align-items: baseline; justify-content: space-between; margin-top: 16px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 10px; }
  .ms-total .ms-num { color: var(--accent); }

  /* Input sheet header */
  .inputsheets:has(.ms-sheet-head) { padding-top: 8px; }
  .ms-sheet-head .ms-back-row { margin-bottom: 8px; }
  .ms-sheet-title { flex: 1; min-width: 0; }
  .ms-sheet-name { font-size: 17px; font-weight: 600; letter-spacing: -0.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .ms-sheet-name em { font-family: var(--font-serif); font-weight: 500; color: var(--accent); }
  .ms-sep { color: var(--text-faint); font-weight: 400; }
  .ms-stats { display: flex; gap: 14px; font-size: 10.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-secondary); margin-bottom: 4px; }
}
@media (max-width: 760px) {
  .ms-kicker { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-secondary); }
}
@media (max-width: 760px) {
  /* Location filter has an inline display:flex */
  .inventory .filter-bar-stack > div:not(.filter-bar) { display: none !important; }
  /* Type filters as pill chips, like the mockup */
  .inventory .cat-tabs { background: none; border: none; box-shadow: none; gap: 6px; padding-top: 2px; padding-bottom: 6px; }
  .inventory .cat-tab { border: 1px solid var(--border-strong); border-radius: 20px; padding: 0 14px; background: transparent; }
  .inventory .cat-tab.active { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 14%, transparent); }
  .inventory .cat-tab::before, .inventory .cat-tab::after { display: none; }
}
@media (max-width: 760px) {
  .mis-table { margin: 0; border: 1px solid var(--border); border-radius: 10px; overflow: clip; }
  .mis-sec { top: 30px; }
}

/* ── Today: compact dark rooms, grouped attention, money empty state ── */
@media (max-width: 760px) {
  .ms-dark-strip { flex-direction: column; gap: 8px; padding: 12px 14px; border-style: dashed; background: transparent; }
  .ms-dark-rooms { display: flex; flex-wrap: wrap; gap: 6px; }
  .ms-dark-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-secondary);
    padding: 3px 8px; border: 1px solid var(--border); border-radius: 12px; }
  .ms-dark-strip strong { color: var(--text-primary); font-weight: 500; }

  .ms-group { flex-direction: column; overflow: hidden; }
  .ms-group-head { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 60px; padding: 10px 12px; text-align: left; color: var(--text-primary); }
  .ms-group-glyph { width: 28px; height: 28px; border-radius: 6px; display: grid; place-items: center; background: var(--surface-3); border: 1px solid var(--border); font-size: 13px; flex-shrink: 0; }
  .ms-group-n { font-size: 11px; color: var(--text-secondary); margin-left: 4px; }
  .ms-group.open .ms-group-head { border-bottom: 1px solid var(--border); }
  .ms-group .ms-action { display: flex; gap: 12px; padding: 10px 12px; align-items: center; border-bottom: 1px solid color-mix(in oklab, var(--border) 60%, transparent); }
  .ms-group .ms-action:last-child { border-bottom: none; }
  .ms-sev.thin { width: 3px; }
  .ms-wrap { white-space: normal !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

  .ms-money-empty { display: flex; flex-direction: column; gap: 6px; }
  .ms-link-inline { display: block; margin-top: 10px; font-size: 13px; font-weight: 500; color: var(--accent); }
  .ms-money-empty .ms-link-inline { margin-top: 0; }

  /* ── Shared top bar on phones ── */
  /* No notifications feature yet: the bell is hidden rather than dead */
  .topbar-right .icon-btn[title="Notifications"] { display: none; }
  .topbar .avatar-btn { width: 40px; height: 40px; border-radius: 20px; }
  .role-switch { padding: 2px; }

  /* Search: a full-screen sheet instead of a dropdown */
  .gs-results {
    position: fixed !important; left: 0 !important; right: 0 !important; width: auto !important;
    top: var(--topbar-h) !important; bottom: calc(var(--mb-tabs-h) + var(--mb-safe-b)) !important; max-height: none !important;
    border-radius: 0 !important; border-left: none !important; border-right: none !important; margin: 0 !important;
    overflow-y: auto; z-index: 65; background: var(--bg) !important; box-shadow: none !important; padding: 4px 0 16px;
  }
  .gs-group-head { padding: 14px 16px 6px !important; }
  .gs-item { display: flex !important; flex-direction: column; align-items: flex-start !important; justify-content: center; gap: 2px;
    min-height: 56px; padding: 8px 16px !important; width: 100%; border-radius: 0 !important; }
  .gs-item-label { font-size: 15px; white-space: normal; overflow: visible; }
  .gs-item-sub { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  .gs-foot { display: none !important; }
  .gs-empty { padding: 24px 16px !important; }
  .gs-clear { width: 40px; height: 40px; }

  /* Role menu: a bottom sheet */
  .role-menu {
    position: fixed !important; left: 0 !important; right: 0 !important; top: auto !important; bottom: 0 !important; width: auto !important;
    border-radius: 16px 16px 0 0 !important; padding: 8px 8px calc(16px + var(--mb-safe-b)) !important; z-index: 80 !important;
    box-shadow: 0 0 0 100vmax oklch(0.10 0.005 65 / 0.6), 0 -12px 40px rgba(0,0,0,0.5) !important;
  }
  .role-menu::before { content: ""; display: block; width: 40px; height: 4px; border-radius: 2px; background: var(--border-strong); margin: 0 auto 8px; }
  .role-menu-item { min-height: 56px; }
}
@media (max-width: 760px) {
  /* The top bar hosts search results and the role sheet, so it must sit
     above full-screen details (50) and the More sheet (55). */
  .topbar { z-index: 66; }
}
@media (max-width: 760px) {
  .gs-item-sub { margin-left: 0 !important; text-align: left !important; }
}

/* ═══ Pop-ups as phone sheets (StudiOS Mobile · Pop-ups rows) ═══════════ */
@media (max-width: 760px) {
  /* Mobile-only sheets (mobile-screens.jsx) */
  .msh-overlay { position: fixed; inset: 0; z-index: 90; display: flex; align-items: flex-end; background: oklch(0.08 0.004 65 / 0.66); }
  .msh {
    width: 100%; max-height: calc(100dvh - 44px); display: flex; flex-direction: column;
    background: var(--surface); border-top: 1px solid var(--border-strong); border-radius: 18px 18px 0 0; box-shadow: 0 -16px 48px rgba(0,0,0,0.55);
  }
  .msh-grab { width: 40px; height: 4px; border-radius: 2px; background: var(--border-strong); margin: 8px auto 0; flex-shrink: 0; }
  .msh-head { display: flex; align-items: center; gap: 8px; padding: 8px 8px 10px 20px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
  .msh-title { flex: 1; min-width: 0; }
  .msh-title h2 { margin: 0; font-size: 19px; font-weight: 600; letter-spacing: -0.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .msh-sub { display: block; font-size: 12.5px; color: var(--text-secondary); font-weight: 400; }
  .msh-x { width: 44px; height: 44px; border-radius: 22px; background: var(--surface-3); color: var(--text-primary); font-size: 16px; display: grid; place-items: center; flex-shrink: 0; }
  .msh-body { flex: 1; overflow-y: auto; padding: 4px 20px 20px; }
  .msh-foot { display: flex; gap: 10px; padding: 12px 20px calc(16px + var(--mb-safe-b)); border-top: 1px solid var(--border); flex-shrink: 0; }
  .msh-foot > .msh-btn { flex: 1; }
  .msh-stack { display: flex; flex-direction: column; gap: 6px; width: 100%; }
  .msh.compact .msh-foot { border-top: none; padding-top: 4px; }
  .msh-btn { min-height: 50px; padding: 0 18px; border-radius: 10px; border: 1px solid var(--border-strong); font-size: 15px; font-weight: 500; color: var(--text-primary); display: inline-flex; align-items: center; justify-content: center; }
  .msh-btn.primary { background: var(--accent); border-color: var(--accent); color: oklch(0.17 0.01 60); font-weight: 600; }
  .msh-btn.primary:disabled { opacity: 0.45; }
  .msh-btn.danger { background: oklch(0.62 0.17 25); border-color: oklch(0.62 0.17 25); color: #fff; font-weight: 600; }
  .msh-btn.ghost { border-color: transparent; color: var(--text-secondary); }
  .msh-field { display: flex; flex-direction: column; gap: 6px; margin-top: 16px; }
  .msh-label { display: flex; align-items: baseline; gap: 4px; font-size: 13px; font-weight: 500; color: var(--text-primary); }
  .msh-req { color: var(--accent); }
  .msh-hint { margin-left: auto; font-size: 11.5px; font-weight: 400; color: var(--text-muted); }
  .msh-input { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 50px; padding: 0 14px; border-radius: 10px; font-size: 16px; box-sizing: border-box; }
  .msh-amount { border: 1px solid var(--border); background: var(--bg); }
  .msh-amount input { flex: 1; min-width: 0; border: none; background: transparent; font: 500 24px var(--font-mono); padding: 0; height: 48px; }
  .msh-pre { color: var(--text-muted); font-size: 18px; }
  .msh-chips { display: flex; flex-wrap: wrap; gap: 8px; }
  .msh-chip { min-height: 40px; padding: 0 14px; border-radius: 20px; border: 1px solid var(--border-strong); display: inline-flex; align-items: center; gap: 7px; font-size: 14px; color: var(--text-primary); }
  .msh-chip.on { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 16%, transparent); }
  .msh-seg { display: flex; gap: 2px; padding: 3px; border-radius: 10px; background: var(--bg); border: 1px solid var(--border); }
  .msh-seg button { flex: 1; min-height: 42px; border-radius: 8px; font-size: 14px; font-weight: 500; color: var(--text-secondary); }
  .msh-seg button.on { background: color-mix(in oklab, var(--accent) 18%, var(--surface-3)); color: color-mix(in oklab, var(--accent) 70%, var(--text-primary)); box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--accent) 45%, transparent); }
  .msh-toggle { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 56px; margin-top: 8px; text-align: left; color: var(--text-primary); }
  .msh-toggle-text { flex: 1; font-size: 15px; }
  .msh-switch { width: 50px; height: 30px; border-radius: 15px; background: var(--border-strong); position: relative; flex-shrink: 0; transition: background 0.15s; }
  .msh-switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 12px; background: oklch(0.96 0.005 80); transition: left 0.15s; }
  .msh-switch.on { background: var(--accent); }
  .msh-switch.on::after { left: 23px; }
  .msh-upload { position: relative; width: 100%; box-sizing: border-box; border-style: dashed; color: var(--text-secondary); }
  .msh-upload input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
  .msh-file { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 6px 4px 6px 6px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg); }
  .msh-file-thumb { width: 44px; height: 44px; flex-shrink: 0; border-radius: 6px; object-fit: cover; background: var(--surface-3); display: grid; place-items: center; font-size: 11px; color: var(--text-secondary); }
  .msh-file-name { flex: 1; min-width: 0; font-size: 14px; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .msh-file .msh-btn { min-height: 44px; padding: 0 12px; }
  .msh-err { margin-left: 0; color: oklch(0.72 0.16 25); }
  .msh-confirm { text-align: center; padding-top: 14px; }
  .msh-confirm-icon { width: 56px; height: 56px; border-radius: 28px; margin: 0 auto 12px; background: oklch(0.30 0.08 25); color: oklch(0.88 0.10 25); font-size: 24px; font-weight: 600; display: grid; place-items: center; }
  .msh-confirm h2 { margin: 0; font-size: 20px; font-weight: 600; }
  .msh-confirm p { margin: 8px 0 0; font-size: 14px; color: var(--text-secondary); line-height: 1.5; }
  .msh .bk-combobox input, .msh .bk-combobox .mf-input { font-size: 16px; min-height: 50px; border-radius: 10px; }

  /* Every existing dialog → bottom sheet */
  .modal-overlay, .ni-overlay { padding: 0 !important; display: flex !important; align-items: flex-end !important; justify-content: stretch !important;
    background: oklch(0.08 0.004 65 / 0.66) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  .modal, .ni-modal {
    position: relative; width: 100% !important; max-width: none !important; max-height: calc(100dvh - 44px) !important; margin: 0 !important;
    border-radius: 18px 18px 0 0 !important; border-left: none !important; border-right: none !important; border-bottom: none !important;
    padding-top: 12px; background: var(--surface) !important; box-shadow: 0 -16px 48px rgba(0,0,0,0.55) !important;
  }
  .modal::before, .ni-modal::before { content: ""; position: absolute; top: 8px; left: 50%; width: 40px; height: 4px; margin-left: -20px; border-radius: 2px; background: var(--border-strong); }
  .modal-head, .ni-head { padding: 8px 8px 10px 20px !important; gap: 8px; }
  .modal-title, .ni-title { font-size: 19px !important; font-weight: 600 !important; }
  .modal-close, .ni-close { width: 44px !important; height: 44px !important; border-radius: 22px !important; border: none !important; background: var(--surface-3) !important; color: var(--text-primary) !important; font-size: 16px !important; flex-shrink: 0; }
  .modal-body, .ni-body { padding: 4px 20px 0 !important; }
  .modal-grid { gap: 16px; padding-top: 12px; }
  /* Footer stays pinned so Save/Create is always reachable */
  .modal-body > .modal-foot { position: sticky; bottom: 0; z-index: 2; margin: 20px -20px 0; }
  .modal-foot, .ni-foot { padding: 12px 20px calc(16px + var(--mb-safe-b)) !important; background: var(--surface); border-top: 1px solid var(--border); gap: 10px; }
  .modal-foot > *, .ni-foot > * { flex: 1; }
  .modal-foot .tb-btn, .ni-foot .tb-btn, .ni-foot button { min-height: 50px !important; height: auto !important; font-size: 15px !important; justify-content: center; border-radius: 10px !important; }
  .modal-foot .tb-btn.ghost { border-color: transparent; }

  /* Fields: one column, 16px text (no iOS zoom), 50px tall */
  .mf-row { grid-template-columns: 1fr; gap: 16px; }
  .mf-row:has(input[type="date"]), .mf-row:has(input[type="time"]), .mf-row:has(input[type="number"]):not(:has(input[type="text"])),
  .mf-row:has(.cs-wrap):not(:has(input[type="text"])):not(:has(input[type="email"])) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .mf-span2 { grid-column: auto; }
  .mf-label { font-size: 13px; color: var(--text-primary); }
  .mf-hint { font-size: 11.5px; }
  .modal .mf-input, .modal input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), .modal select, .modal textarea, .modal .cs-wrap,
  .ni-modal input:not([type="checkbox"]):not([type="radio"]), .ni-modal select, .ni-modal textarea, .ni-modal .cs-wrap, .ni-select, .ni-input {
    font-size: 16px !important; min-height: 50px !important; height: auto !important; border-radius: 10px !important; padding-left: 14px; padding-right: 14px;
  }
  .modal textarea, .ni-modal textarea { padding-top: 12px !important; padding-bottom: 12px !important; min-height: 92px !important; }
  .mf-input-prefix .mf-input { padding-left: 26px !important; }
  .modal .cs-wrap .cs-value { font-size: 16px; }
  .bk-allday-toggle { min-height: 48px; font-size: 15px; }

  /* New event: type tabs as scrolling chips with a fade */
  .bk-type-selector { display: flex !important; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 12px 20px 2px !important; border-bottom: none !important; flex-shrink: 0;
    -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
  .bk-type-btn { flex-shrink: 0; min-height: 40px; padding: 0 14px !important; border-radius: 20px !important; border: 1px solid var(--border-strong) !important; white-space: nowrap; font-size: 14px !important; }
  .bk-type-btn.active { border-color: var(--accent) !important; background: color-mix(in oklab, var(--accent) 16%, transparent) !important; }
  .bk-type-btn.active::after { display: none; }

  /* New invoice */
  .ni-grid2, .ni-row { grid-template-columns: 1fr !important; }
  /* Line items as cards: kind + amount, description, qty × rate */
  .ni-line.head { display: none !important; }
  .ni-line:not(.head) {
    display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto !important;
    grid-template-areas: "kind kind amt" "desc desc desc" "qty rate del"; gap: 8px !important;
    padding: 12px; margin-bottom: 10px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg);
  }
  .ni-line:not(.head) > :nth-child(1) { grid-area: desc; }
  .ni-line:not(.head) > :nth-child(2) { grid-area: kind; justify-self: start; width: auto !important; min-width: 140px; }
  .ni-line:not(.head) > :nth-child(3) { grid-area: qty; }
  .ni-line:not(.head) > :nth-child(4) { grid-area: rate; }
  .ni-line:not(.head) > .ni-line-amt { grid-area: amt; align-self: center; font-size: 16px; }
  .ni-line:not(.head) > .ni-line-del { grid-area: del; width: 44px; height: 50px; border-radius: 10px; border: 1px solid var(--border); font-size: 18px; }
  .ni-line .ni-input.num { text-align: left !important; }
  .ni-addline { width: 100%; min-height: 48px; justify-content: center; border-radius: 10px !important; }
  .ni-foot { flex-direction: column; align-items: stretch !important; gap: 10px !important; }
  .ni-total { display: flex; justify-content: space-between; align-items: baseline; }
  .ni-total-v { font-size: 22px !important; }
  .ni-foot-actions { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px !important; }
  .ni-foot-actions > :last-child { grid-column: 1 / -1; order: -1; }
  .ni-foot-actions .tb-btn { min-height: 50px !important; height: auto !important; font-size: 15px !important; justify-content: center; border-radius: 10px !important; }
  .ni-foot-actions .tb-btn:not(.ghost) { background: var(--accent) !important; color: oklch(0.17 0.01 60) !important; border-color: var(--accent) !important; font-weight: 600; }

  /* Dropdowns → bottom sheet list */
  .cs-list {
    left: 0 !important; right: 0 !important; width: auto !important; top: auto !important; bottom: 0 !important;
    max-height: 60dvh !important; border-radius: 18px 18px 0 0 !important; padding: 16px 8px calc(12px + var(--mb-safe-b)) !important; z-index: 200 !important;
    box-shadow: 0 0 0 100vmax oklch(0.08 0.004 65 / 0.66), 0 -12px 40px rgba(0,0,0,0.5) !important; background: var(--surface) !important;
  }
  .cs-list::before { content: ""; display: block; width: 40px; height: 4px; border-radius: 2px; background: var(--border-strong); margin: -8px auto 8px; }
  .cs-option { min-height: 52px; display: flex; align-items: center; padding: 0 14px !important; font-size: 16px !important; border-radius: 8px; }
  .cs-option.cs-selected { color: var(--accent); }
  .cs-option.cs-selected::after { content: "✓"; margin-left: auto; }

  /* Search pickers (client, staff, gear) */
  .bk-combobox-pop { max-height: 50dvh; border-radius: 12px; }
  .bk-combobox-pop [class*="opt"]:not([class*="opt-"]) { min-height: 56px; }
  .bk-combobox input { font-size: 16px !important; }

  /* New session log picker → sheet */
  .sl-picker { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; max-height: 70dvh; overflow-y: auto; margin: 0;
    background: var(--surface); border-top: 1px solid var(--border-strong); border-radius: 18px 18px 0 0; padding: 12px 20px calc(20px + var(--mb-safe-b));
    box-shadow: 0 0 0 100vmax oklch(0.08 0.004 65 / 0.66), 0 -12px 40px rgba(0,0,0,0.5); }
  .sl-picker-head { display: flex; align-items: center; justify-content: space-between; font-size: 19px !important; font-weight: 600; letter-spacing: -0.01em !important; text-transform: none !important; color: var(--text-primary) !important; font-family: var(--font-sans) !important; padding: 4px 0 10px; }
  .sl-picker-head button { width: 44px; height: 44px; border-radius: 22px; background: var(--surface-3); font-size: 18px; }
  .sl-picker-row { min-height: 60px; padding: 8px 4px !important; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; border-bottom: 1px solid var(--border); width: 100%; }
  .sl-picker-artist { font-size: 16px; }
  .sl-picker-meta { font-size: 12px; }
}
@media (max-width: 760px) {
  /* Any text field on a phone: 16px, so iOS never zooms on focus */
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]), textarea, select { font-size: 16px !important; }
  .ct-detail input:not([type="checkbox"]):not([type="radio"]), .ct-detail textarea,
  .drawer input:not([type="checkbox"]):not([type="radio"]), .drawer textarea { min-height: 46px; border-radius: 10px; }
}
@media (max-width: 760px) {
  /* Short choices as chips (custom-select.jsx) */
  .cs-chips { display: flex; flex-wrap: wrap; gap: 8px; }
  .cs-chip { min-height: 42px; padding: 0 14px; border-radius: 21px; border: 1px solid var(--border-strong); font-size: 14.5px; color: var(--text-primary); background: transparent; white-space: nowrap; }
  .cs-chip.on { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 16%, transparent); color: color-mix(in oklab, var(--accent) 65%, var(--text-primary)); font-weight: 500; }
  .cs-chip:disabled { opacity: 0.4; }
  /* A chip row can't share a line with another field */
  .mf-row:has(.cs-chips) { grid-template-columns: 1fr !important; }

  /* New invoice · step 2 back button */
  .ni-back { width: 44px; height: 44px; margin-left: -12px; font-size: 26px; color: var(--text-primary); flex-shrink: 0; }

  /* Invoice line cards: label the qty and rate fields */
  .ni-line:not(.head) { grid-template-areas: "kind kind amt" "desc desc desc" "qlab rlab ." "qty rate del" !important; row-gap: 4px !important; }
  .ni-line:not(.head) > :nth-child(1) { margin-bottom: 6px; }
  .ni-line:not(.head)::before, .ni-line:not(.head)::after {
    font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.09em; text-transform: uppercase; color: var(--text-muted); padding-left: 2px;
  }
  .ni-line:not(.head)::before { content: "Qty"; grid-area: qlab; }
  .ni-line:not(.head)::after { content: "Rate"; grid-area: rlab; }

  /* Add / edit contact: Save stays pinned at the bottom */
  .main[data-mdetail="open"] .ct-edit-footer {
    position: sticky; bottom: -24px; z-index: 2; margin: 16px -20px -24px; padding: 12px 20px calc(16px + var(--mb-safe-b));
    background: var(--bg); border-top: 1px solid var(--border); display: flex; gap: 10px;
  }
  .main[data-mdetail="open"] .ct-edit-footer .ct-edit-footer-r { flex: 1; display: flex; gap: 10px; }
  .main[data-mdetail="open"] .ct-edit-footer .tb-btn { flex: 1; min-height: 50px; font-size: 15px; justify-content: center; border-radius: 10px; }
}
@media (max-width: 760px) { .ni-head-l { flex: 1; min-width: 0; text-align: left; } }

/* ── Bookings pass ─────────────────────────────────────────────────────── */
@media (max-width: 760px) {
  .ms-week-head .ms-icon { width: 44px; height: 44px; }
  .ms-month-btn { display: inline-flex; align-items: baseline; gap: 8px; min-height: 44px; padding: 0 6px; border-radius: 8px; }
  .ms-month-btn:active { background: var(--surface-2); }
  .ms-filter-on { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 0 12px; border-radius: 22px;
    border: 1px solid var(--accent); background: color-mix(in oklab, var(--accent) 14%, transparent); font-size: 13.5px; color: var(--text-primary); }
  .ms-filter-on [aria-hidden] { color: var(--text-secondary); font-size: 12px; }
  .ms-chips { scrollbar-width: none; }
  .ms-chips::-webkit-scrollbar { display: none; }

  /* Day dots in room colours */
  .ms-day-dots { display: inline-flex; gap: 3px; height: 6px; align-items: center; }
  .ms-day-dots i { width: 5px; height: 5px; border-radius: 50%; display: block; }
  .ms-day.on .ms-day-dots i { box-shadow: 0 0 0 1.5px oklch(0.18 0.01 60 / .55); }

  /* Week at a glance */
  .ms-week-sum { display: flex; align-items: center; gap: 14px; margin-top: 10px; font-size: 11.5px; letter-spacing: 0.04em; color: var(--text-secondary); }
  .ms-week-sum > :last-child { margin-left: auto; color: var(--accent); }
  .ms-sum-hold { min-height: 32px; padding: 0 10px; border-radius: 16px; border: 1px dashed oklch(0.82 0.16 80 / .7); color: oklch(0.88 0.14 80); font: inherit; letter-spacing: inherit; }
  .ms-sum-hold.on { border-style: solid; background: oklch(0.82 0.16 80 / .14); }
  .ms-status-chip { margin-top: 8px; }

  /* Holds/tentative look provisional; conflicts are flagged on the card */
  .ms-ev.pending { border-style: dashed; border-color: oklch(0.82 0.16 80 / .55); background: transparent; }
  .ms-ev.pending .ms-ev-rail { background: repeating-linear-gradient(180deg, var(--rc) 0 4px, transparent 4px 7px); }
  .ms-ev-foot { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
  .ms-conflict { font-size: 10.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--red); padding: 1px 6px; border: 1px solid color-mix(in oklab, var(--red) 45%, transparent); border-radius: 4px; }

  /* Month sheet */
  .mm-nav { display: flex; align-items: center; justify-content: space-between; margin: 4px -6px 8px; }
  .mm-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
  .mm-dow { text-align: center; font-size: 10.5px; color: var(--text-muted); padding: 4px 0; }
  .mm-day { min-height: 48px; border-radius: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-size: 15px; color: var(--text-primary); }
  .mm-day.out { color: var(--text-faint); }
  .mm-day.today span:first-child { color: var(--accent); font-weight: 600; }
  .mm-day.on { background: var(--accent); color: oklch(0.18 0.01 60); }
  .mm-day.on span:first-child { color: oklch(0.18 0.01 60); }

  /* Booking detail on a phone: readable sizes, 50px actions */
  .bk-detail { padding: 16px 16px 24px !important; }
  .bk-detail-k { font-size: 11px !important; }
  .bk-detail-v { font-size: 15px !important; }
  .bk-detail-artist { font-size: 26px !important; }
  .bk-detail-project { font-size: 15px !important; }
  .bk-detail-label { font-family: var(--font-sans) !important; text-transform: none !important; letter-spacing: 0 !important; font-size: 13.5px !important; color: var(--text-secondary) !important; }
  .bk-detail-status { gap: 10px; flex-wrap: wrap; }
  .bk-detail-section-head { font-size: 11px !important; }
  .bk-detail-notes { font-size: 15px !important; line-height: 1.5; }
  .bk-detail-actions { gap: 8px !important; }
  .bk-detail-actions .tb-btn, .bk-quick .tb-btn { min-height: 50px !important; height: auto !important; font-size: 15px !important; justify-content: center; border-radius: 10px !important; }
  .bk-detail-v a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
  .bk-quick { display: flex; flex-direction: column; gap: 8px; margin: 14px 0 4px; }
  .bk-quick-confirm { background: oklch(0.72 0.14 145) !important; border-color: oklch(0.72 0.14 145) !important; color: oklch(0.16 0.02 145) !important; font-weight: 600; text-transform: none; }
  .bk-conflict-btn { min-height: 36px; padding: 0 10px; border-radius: 18px; border: 1px solid color-mix(in oklab, var(--red) 45%, transparent); background: transparent; font-size: 11px; }
  .bk-conflicts { display: flex; flex-direction: column; gap: 6px; margin: 10px 0 4px; }
  .bk-conflict-row { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-height: 56px; padding: 8px 12px; border-radius: 10px; text-align: left;
    border: 1px solid color-mix(in oklab, var(--red) 40%, var(--border)); background: color-mix(in oklab, var(--red) 6%, transparent); color: var(--text-primary); }
  .bk-conflict-name { font-size: 15px; font-weight: 500; }
  .bk-conflict-meta { font-size: 11px; color: var(--text-secondary); }
  .bk-sheet-row { width: 100%; min-height: 56px !important; text-align: left; border-radius: 10px; }
  .bk-sheet-row::after { content: "›"; margin-left: 8px; color: var(--text-faint); font-size: 18px; }
}
@media (max-width: 760px) { .ms-month-btn { align-items: center; } }
@media (max-width: 760px) {
  .bk-sheet-row { display: flex !important; align-items: center; gap: 12px; padding: 8px 12px !important; }
  .bk-sheet-row .bk-detail-gear-body { flex: 1; min-width: 0; }
  .bk-detail-gear-brand { font-size: 12px !important; }
  .bk-detail-gear-model { font-size: 15px !important; }
}

/* ── Session pass ──────────────────────────────────────────────────────── */
@media (max-width: 760px) {
  .ms-timer.pending { font-size: 26px; color: var(--text-secondary); margin: 12px 0 8px; }
  .ms-time-cell { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; text-align: left; min-height: 56px; padding: 6px 8px; margin: -6px -8px; border-radius: 8px; color: var(--text-primary); font-size: 14px; }
  .ms-time-cell:not(:disabled):active { background: var(--surface-2); }
  .ms-edit { color: var(--accent); margin-left: 4px; font-size: 11px; }
  .ms-unset { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
  .ms-crew-open, .ms-exp-open { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; min-height: 52px; text-align: left; color: var(--text-primary); }
  .ms-exp { padding: 4px 8px 4px 12px; }
  .ms-btn.tiny { min-height: 44px; padding: 0 12px; }
  .ms-link { min-height: 44px; }

  .msh-time-row { display: flex; gap: 8px; }
  .msh-time { flex: 1; border: 1px solid var(--border); background: var(--bg); color: var(--text-primary); font: 500 20px var(--font-mono) !important; }
  .msh-time-row .msh-btn { min-width: 64px; }
  .msh-stepper { display: flex; align-items: center; gap: 12px; }
  .msh-stepper .msh-btn { width: 56px; font-size: 20px; }
  .msh-stepper .mono { min-width: 64px; text-align: center; font-size: 20px; }
  .msh-link { display: block; margin: 22px auto 4px; min-height: 44px; padding: 0 12px; font-size: 14px; }
  .msh-link.danger, .danger-text { color: var(--red) !important; }
  .msh-btn.primary.msh-confirm-like, .msh-stack .msh-btn.primary { width: 100%; }
  .msh-confirm-icon.primary { background: color-mix(in oklab, var(--accent) 22%, transparent); color: var(--accent); font-size: 18px; }
  .msh-opt { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 60px; padding: 6px 4px; border-bottom: 1px solid var(--border); text-align: left; color: var(--text-primary); }
  .msh-opt-body { flex: 1; min-width: 0; font-size: 16px; }
}
@media (max-width: 760px) {
  .sessionlogs:has(> .ms-page) { padding: 0; }
  .sessionlogs .ms-chip { min-height: 44px; }
  .sessionlogs .ms-week-sum { flex-wrap: wrap; row-gap: 6px; }
}

/* ── Gear pass ─────────────────────────────────────────────────────────── */
@media (max-width: 760px) {
  .inventory .inv-search-bar { min-height: 48px; border-radius: 10px; padding: 0 14px; }
  .inventory .inv-search-bar input { min-height: 46px; }
  .inventory .cat-tab { min-height: 44px; }
  .ms-gear-head { gap: 8px; }
  .ms-gear-head .ms-btn { min-height: 44px; }

  .mg-filters { display: flex; gap: 6px; overflow-x: auto; margin: 0 -16px 8px; padding: 2px 16px; scrollbar-width: none; }
  .mg-filters::-webkit-scrollbar { display: none; }
  .mg-filters .ms-chip { min-height: 40px; }
  .mg-n { font-size: 11px; color: var(--text-muted); }
  .mg-count { display: flex; align-items: center; gap: 8px; min-height: 44px; margin-bottom: 6px; font-size: 12px; color: var(--text-secondary); }
  .mg-clear { min-height: 32px; padding: 0 10px; border-radius: 16px; border: 1px solid var(--border-strong); font-size: 12px; color: var(--text-primary); max-width: 140px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mg-sort { min-height: 44px; padding: 0 10px; border-radius: 8px; font-size: 13px; color: var(--accent); white-space: nowrap; }
  .mb-radio { width: 22px; height: 22px; border-radius: 11px; border: 2px solid var(--border-strong); flex-shrink: 0; }
  .mb-radio.on { border-color: var(--accent); background: var(--accent); box-shadow: inset 0 0 0 4px var(--surface); }

  /* Item detail: one header bar (the drawer's own), compact photo row */
  .main[data-mdetail="open"]:has(.inventory) .mb-detail-bar { display: none; }
  .main[data-mdetail="open"] .inventory .drawer:not(.drawer--closed) { top: var(--topbar-h) !important; height: calc(100dvh - var(--topbar-h) - var(--mb-tabs-h) - var(--mb-safe-b)) !important; }
  .main[data-mdetail="open"] .inventory .drawer-close { display: grid !important; width: 44px; height: 44px; font-size: 26px; place-items: center; margin-left: -8px; color: var(--text-primary); }
  .inventory .drawer-head { min-height: 56px; padding: 6px 12px; gap: 6px; }
  .inventory .drawer-id { flex: 1; font-size: 12px; }
  .inventory .drawer-edit-btn { width: auto !important; height: 44px !important; padding: 0 14px; border-radius: 10px; font-size: 14px; }
  .inventory .drawer-head .tb-btn { display: none; } /* edit-mode Save/Cancel live in the pinned footer on phones */
  .inventory .drawer-hero:not(:has(img)) { height: 76px !important; min-height: 0; display: flex; align-items: center; gap: 12px; padding: 0 12px; }
  .inventory .drawer-hero:not(:has(img)) .drawer-hero-glyph { position: static; width: 52px; height: 52px; font-size: 22px; transform: none; flex-shrink: 0; }
  .inventory .drawer-hero:not(:has(img)) .drawer-hero-tag { position: static; flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .drawer-hero-add { position: relative; z-index: 2; display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 22px;
    border: 1px solid var(--border-strong); background: var(--surface); font-size: 13.5px; color: var(--text-primary); white-space: nowrap; cursor: pointer; }
  .inventory .drawer-hero:has(img) .drawer-hero-add { display: none; }
  .inventory .drawer-title-row { flex-direction: column; align-items: flex-start; gap: 10px; }
  .inventory .drawer-model { font-size: 26px; }
  .inventory .drawer-actions { gap: 8px; }
  .inventory .drawer-actions .tb-btn { min-height: 50px !important; height: auto !important; font-size: 15px !important; border-radius: 10px !important; justify-content: center; }
  .inventory .drawer-actions .tb-btn:first-child { flex: 1 1 100%; }
  .inventory .spec-label { font-size: 11px; }
  .inventory .spec-value { font-size: 15px; }

  /* Edit mode: single column, 50px fields, pinned Cancel/Save */
  .inventory .drawer-title-main, .inventory .drawer-title-edit, .inventory .drawer-status, .inventory .drawer-status-edit { width: 100%; }
  .inventory .drawer-title-edit { display: flex; flex-direction: column; gap: 14px; }
  .inventory .drawer-subcat-edit-row { display: grid !important; grid-template-columns: 1fr; gap: 14px; }
  .inventory .drawer-subcat-edit-sep { display: none; }
  .inventory .spec-grid:has(.drawer-inline-input) { grid-template-columns: 1fr !important; gap: 14px; }
  .inventory .drawer-inline-input, .inventory .drawer .cs-wrap.drawer-inline-input { min-height: 50px !important; height: auto !important; font-size: 16px !important; border-radius: 10px !important; padding: 0 14px !important; }
  .inventory .drawer-inline-textarea { padding: 12px 14px !important; min-height: 96px !important; }
  .inventory .drawer-edit-model-input { font-size: 18px !important; font-weight: 600; }
  .drawer-edit-foot { display: flex; gap: 10px; padding: 12px 16px calc(14px + var(--mb-safe-b)); border-top: 1px solid var(--border); background: var(--bg); flex-shrink: 0; }
  .drawer-edit-foot .tb-btn { flex: 1; min-height: 50px; height: auto; font-size: 15px; justify-content: center; border-radius: 10px; }
}
@media (max-width: 760px) {
  .inventory .cat-tabs { scrollbar-width: none; }
  .inventory .cat-tabs::-webkit-scrollbar { display: none; }
}
@media (max-width: 760px) { .inventory .drawer-actions .tb-btn { flex: 1 1 100%; } }
@media (max-width: 760px) {
  .inventory .drawer-subcat-edit-type, .inventory .drawer-subcat-edit-year, .inventory .drawer-subcat-edit-year .drawer-inline-input { width: 100% !important; max-width: none !important; }
}

/* ── Input sheets pass ─────────────────────────────────────────────── */
@media (max-width: 760px) {
  /* Session list */
  :is(.mis-sessions, .mct) .ms-search { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 4px 0 14px; margin: 12px 0 4px;
    border: 1px solid var(--border-strong); border-radius: 10px; background: var(--surface); color: var(--text-muted); }
  :is(.mis-sessions, .mct) .ms-search input { flex: 1; min-width: 0; height: 46px; border: none; background: none; font-size: 16px; color: var(--text-primary); padding: 0; }
  :is(.mis-sessions, .mct) .ms-search input:focus { outline: none; }
  :is(.mis-sessions, .mct) .ms-search:focus-within { border-color: var(--accent); }
  .mis-none { flex-direction: column; align-items: flex-start; gap: 0; padding: 14px; margin-top: 14px; }
  .mis-none .ms-link-inline { min-height: 32px; text-align: left; }
  .mis-sess { min-height: 64px; padding: 8px 10px 8px 14px; }
  .mis-sess-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
  .mis-sess-artist { font-size: 15px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mis-sess-main .ms-meta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mis-sess-r { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; font-size: 11.5px; color: var(--text-secondary); flex-shrink: 0; }
  .mis-sess-r .ms-ok { font-size: 11.5px; }

  /* The desktop scrollport never scrolls here — it only clipped the table and broke the sticky header */
  .inputsheets .is-main-content { overflow: visible; }

  /* Sheet header: 44px chips, Inputs / Sends / Cues segment */
  .inputsheets .ms-chip { min-height: 44px; }
  .inputsheets .ms-chip[aria-label="New sheet"] { min-width: 44px; justify-content: center; font-size: 17px; }
  .ms-seg { display: flex; gap: 2px; padding: 3px; margin: 2px 0 6px; border-radius: 10px; background: var(--surface-2); border: 1px solid var(--border); }
  .ms-seg button { flex: 1; min-height: 44px; border-radius: 8px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
    font-size: 14px; font-weight: 500; color: var(--text-secondary); line-height: 1.15; }
  .ms-seg button.on { background: var(--surface-3); color: var(--text-primary); box-shadow: inset 0 0 0 1px var(--border-strong); }
  .ms-seg-meta { font-size: 9.5px; letter-spacing: 0.04em; color: var(--text-muted); font-weight: 400; }

  /* Presets, section jump, collapse */
  .mis-presets button { min-height: 44px; }
  .mis-meta { gap: 8px; margin: 0 -16px 6px 0; }
  .mis-jump { flex: 1; min-width: 0; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-right: 4px; }
  .mis-jump::-webkit-scrollbar { display: none; }
  .mis-jump button { flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px; border-radius: 22px;
    border: 1px solid var(--border-strong); font: 500 12px var(--font-mono); letter-spacing: 0.06em; color: var(--text-primary); }
  .mis-jump-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--sec); }
  .mis-jump-n { color: var(--text-muted); font-weight: 400; }
  .mis-meta .mis-collapse { flex-shrink: 0; min-height: 44px; padding: 0 16px 0 8px; }
  .mis-anchor { display: block; height: 0; scroll-margin-top: 30px; }

  /* Edit mode: add channel / section */
  .mis-add { display: flex; align-items: center; width: 100%; min-height: 48px; padding: 0 16px 0 46px; border-bottom: 1px solid var(--border);
    color: var(--sec); font-size: 14px; font-weight: 500; text-align: left; }
  .mis-add-sec { margin-top: 14px; min-height: 48px; }
  .mis-swatches { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
  .mis-swatches button { aspect-ratio: 1; min-height: 0; border-radius: 8px; border: 2px solid transparent; }
  .mis-swatches button.on { border-color: var(--text-primary); box-shadow: inset 0 0 0 2px var(--surface); }

  /* Channel card editing */
  .mcs-head .mcs-edit { min-height: 44px; flex-shrink: 0; }
  .mcs-pick { flex: 1; min-width: 0; min-height: 44px; display: flex; align-items: center; gap: 8px; padding: 0 12px; border-radius: 10px;
    border: 1px solid var(--border-strong); background: var(--surface-2); text-align: left; color: var(--text-primary); font-size: 15px; }
  .mcs-pick-v { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mcs-pick-go { color: var(--text-faint); font-size: 18px; }
  .mcs-clear { width: 40px; color: var(--text-muted); font-size: 14px; }
  .mcs-input { flex: 1; min-width: 0; min-height: 44px; border: 1px solid var(--border-strong); background: var(--surface-2); color: var(--text-primary); }
  .mcs-remove { width: 100%; margin: 14px 0 6px; min-height: 48px; }

  /* Gear / tieline picker as a bottom sheet (inventory only on phones — see GearPicker noCustom) */
  .gp-overlay:not(.gp-overlay-popover) { align-items: flex-end; }
  .gp-overlay:not(.gp-overlay-popover) .gp-panel { width: 100%; max-width: none; max-height: 82dvh; border-radius: 16px 16px 0 0; padding-bottom: var(--mb-safe-b); }
  .gp-search { font-size: 16px !important; min-height: 44px; }
  .gp-item { min-height: 56px; }
  .gp-footer { display: none; }

  /* Sends / cues cards */
  .mtb { display: flex; flex-direction: column; gap: 8px; padding-top: 4px; }
  .mtb-card { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 64px; padding: 10px 12px 10px 14px; border-radius: 10px;
    border: 1px solid var(--border); background: var(--surface); text-align: left; color: var(--text-primary); }
  .mtb-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
  .mtb-title { font-size: 15px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mtb-path { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; font-size: 12px; color: var(--text-secondary); }
  .mtb-arrow { color: var(--text-faint); }
  .mtb-ms { font-size: 10px; letter-spacing: 0.06em; padding: 3px 7px; border-radius: 4px; border: 1px solid var(--border-strong); color: var(--text-secondary); flex-shrink: 0; }
  .mtb-ms.st { color: var(--accent); border-color: color-mix(in oklab, var(--accent) 45%, transparent); }
  .mtb-add { min-height: 48px; margin-top: 4px; }
}

/* ── Recall pass ───────────────────────────────────────────────────── */
@media (max-width: 760px) {
  .recall:has(.mis-sessions), .recall:has(.mrc) { padding: 0; }
  .mrc { padding: 12px 16px 32px; }
  .mis-sess:disabled { opacity: 0.5; }
  .mis-sess-r .rc-progress-chip { font-size: 10.5px; }

  /* Header ring */
  .mrc-ring { width: 44px; height: 44px; flex-shrink: 0; border-radius: 50%; display: grid; place-items: center;
    background: conic-gradient(var(--accent) calc(var(--p) * 1%), var(--surface-3) 0); }
  .mrc-ring > span { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--bg); font-size: 10.5px; color: var(--text-primary); }
  .mrc .ms-chip { min-height: 44px; }
  .mrc .ms-chip[aria-label="New song sheet"] { min-width: 44px; justify-content: center; font-size: 17px; }

  /* Sticky section chips */
  .mrc-secs { position: sticky; top: 0; z-index: 4; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none;
    margin: 0 -16px; padding: 8px 16px; background: var(--bg); border-bottom: 1px solid var(--border); }
  .mrc-secs::-webkit-scrollbar { display: none; }
  .mrc-secs button { flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px; border-radius: 22px;
    border: 1px solid var(--border-strong); font-size: 13.5px; color: var(--text-primary); white-space: nowrap; }
  .mrc-secs button.on { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 14%, transparent); }
  .mrc-secs .mono { color: var(--text-secondary); }
  .mrc-n { font-size: 11px; color: var(--text-muted) !important; }
  .mrc-n.ok { color: var(--green) !important; }
  .mrc-stage-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 52px; padding: 4px 0;
    font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
  .mrc-stage-head .tb-btn { min-height: 44px; height: auto; padding: 0 14px; font-size: 14px; text-transform: none; letter-spacing: 0; }

  /* Panels: single column, phone-sized fields */
  .mrc .capture-outboard-grid, .mrc .capture-mics-grid, .mrc .capture-room-photos { grid-template-columns: 1fr; gap: 12px; }
  .mrc .capture-outboard-card, .mrc .capture-mic-card { padding: 12px; border-radius: 10px; gap: 10px; }
  .mrc .capture-mic-body { gap: 8px; padding: 0; }
  .mrc .capture-input { min-height: 44px; font-size: 16px; padding: 0 12px; border-radius: 8px; }
  .mrc .capture-textarea { font-size: 16px; padding: 10px 12px; border-radius: 8px; }
  .mrc .capture-textarea.small { min-height: 88px; font-size: 16px; }
  .mrc .capture-outboard-head { flex-wrap: wrap; }
  .mrc .rc-player-input { flex: 1; min-width: 0; }
  .mrc .rc-card-remove { align-self: stretch; min-height: 44px; margin: 0; border-radius: 8px; font-size: 14px; }
  .mrc .capture-console-import { padding: 12px; border-radius: 10px; }
  .mrc .capture-import-row { min-height: 0 !important; height: auto !important; padding: 0 !important; border: none !important; background: none !important; }
  .mrc .capture-import-icon { display: none; }
  .mrc .capture-import-body { flex: 1; min-width: 0; text-align: left; display: flex; flex-direction: column; gap: 6px; }
  .mrc .capture-import-meta { text-align: left; font-size: 11px; }
  .mrc .capture-import-body .capture-input { width: 100%; font-family: var(--font-sans); font-style: normal; }
  .mrc .capture-empty { padding: 28px 12px; }

  /* Photo slot: camera first */
  .rc-mslot { display: flex; flex-direction: column; gap: 8px; width: 100%; }
  .rc-mslot-take { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; width: 100%; min-height: 150px;
    border: 1.5px dashed var(--border-strong); border-radius: 10px; background: var(--surface-2); color: var(--text-primary); font-size: 15px; font-weight: 500; }
  .rc-mslot-icon { color: var(--accent); }
  .rc-mslot-sub { font-size: 12px; font-weight: 400; color: var(--text-muted); }
  .rc-mslot-img { width: 100%; max-height: 60dvh; object-fit: cover; border-radius: 10px; display: block; }
  .rc-mslot-actions { display: flex; gap: 8px; }
  .rc-mslot-actions .ms-btn { flex: 1; min-height: 44px; }
  .rc-mslot-actions .danger-text { color: var(--red); }
}

/* ── Maintenance pass ──────────────────────────────────────────────── */
@media (max-width: 760px) {
  .maintenance.mmt { padding: 0; }
  .mmt .ms-chip { min-height: 44px; }
  .mmt .ms-chip.warn:not(.on) .ms-meta { color: var(--red); }
  .mmt-over { color: var(--red) !important; }
  .mmt-up { min-height: 60px; padding: 8px 12px 8px 14px; }
  .mmt-up-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
  .mmt-up-label { font-size: 15px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mmt-up-main .ms-meta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mmt-up-r { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; font-size: 11.5px; color: var(--text-secondary); flex-shrink: 0; }
  .mmt-list { border: 1px solid var(--border); border-radius: 10px; background: var(--surface); overflow: hidden; }
  .mmt-row-wrap + .mmt-row-wrap { border-top: 1px solid var(--border); }
  .mmt-list .mt-row { width: 100%; min-height: 72px; border: none; border-radius: 0; }

  /* Detail: quick status + tech contact */
  .mt-detail-actions { display: flex; flex-direction: row !important; flex-wrap: wrap; gap: 8px; }
  .mt-detail-actions .tb-btn { min-width: 0; width: auto; }
  .mt-detail-actions .tb-btn { min-height: 48px; height: auto; flex: 1 1 30%; justify-content: center; font-size: 15px; border-radius: 10px; }
  .mt-detail-actions .tb-btn:first-child { flex: 1 1 100%; }
  .mt-detail-tech-link { width: 44px; height: 44px; display: grid; place-items: center; flex-shrink: 0; font-size: 17px; text-decoration: none; }
  .mt-detail-tech { gap: 8px; }
}

/* ── Rolodex pass ──────────────────────────────────────────────────── */
@media (max-width: 760px) {
  .contacts.mct { padding: 0; }
  .mct .ms-chip { min-height: 44px; }
  .mct-subs { padding-top: 0; }
  .mct .mg-sort { min-height: 44px; }
  .mct-list { border: 1px solid var(--border); border-radius: 10px; background: var(--surface); overflow: hidden; }
  .mct-letter { padding: 6px 14px; font-size: 11px; letter-spacing: 0.1em; color: var(--accent); background: var(--bg-rail); border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 1; }
  .mct .ct-row.mct-row { display: flex !important; align-items: center; gap: 12px; width: 100%; min-height: 64px; padding: 8px 10px 8px 12px;
    border: none; border-bottom: 1px solid var(--border); border-radius: 0; background: none; text-align: left; box-shadow: none; }
  .mct .mct-row:last-child { border-bottom: none; }
  .mct .mct-row.selected { background: color-mix(in oklab, var(--accent) 8%, transparent); }
  .mct-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
  .mct-name { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 500; color: var(--text-primary); white-space: nowrap; overflow: hidden; }
  .mct-name-t { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .mct-flag { font-size: 9.5px; letter-spacing: 0.06em; text-transform: uppercase; flex-shrink: 0; }
  .mct-body .ms-meta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mct-fact { flex-shrink: 0; font-size: 11.5px; color: var(--text-secondary); }
  .mct-fact.accent { color: var(--accent); }
  .mct-fact.warn { color: var(--red); }

  /* Detail */
  .mct-actions { display: flex; gap: 8px; margin: 4px 0 14px; }
  .mct-act { flex: 1; min-height: 60px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; border-radius: 12px;
    border: 1px solid var(--border-strong); background: var(--surface-2); color: var(--text-primary); text-decoration: none; font-size: 13px; font-weight: 500; }
  .mct-act span { font-size: 18px; color: var(--accent); }
  .ct-detail-edit-btn { width: auto; height: auto; min-height: 44px; min-width: 44px; padding: 0 14px; color: var(--text-primary); font-size: 14px; white-space: nowrap; }
  .ct-contact-row { min-height: 44px; }
  .ct-detail-actions { display: flex; flex-direction: column; gap: 8px; }
  .ct-detail-actions .tb-btn { min-height: 48px; height: auto; width: 100%; justify-content: center; font-size: 15px; border-radius: 10px; }

  /* Edit form */
  .ct-kind-btn, .ct-flag-toggle, .ct-edit-add-row { min-height: 44px; }
  .ct-edit-del-row { min-width: 44px; min-height: 44px; }
  .mct-stars { display: flex; gap: 4px; }
  .mct-stars button { width: 44px; height: 44px; font-size: 24px; color: var(--surface-3); display: grid; place-items: center; }
  .mct-stars button.on { color: var(--accent); }
}

/* ── Invoicing pass ────────────────────────────────────────────────── */
@media (max-width: 760px) {
  .invoicing.miv { padding: 0; }
  .miv-money { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 12px 0 4px; }
  .miv-money button { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-height: 60px; padding: 8px 12px; border-radius: 10px;
    border: 1px solid var(--border); background: var(--surface); font-size: 11.5px; color: var(--text-secondary); text-align: left; }
  .miv-money b { font-size: 18px; font-weight: 600; color: var(--text-primary); }
  .miv-money button.on { border-color: var(--accent); }
  .miv-money button.warn b { color: var(--red); }
  .miv .ms-chip { min-height: 44px; }
  .miv-list { border: 1px solid var(--border); border-radius: 10px; background: var(--surface); overflow: hidden; margin-top: 6px; }
  .miv-list:has(> .ms-empty:only-child) { border: none; background: none; }
  .miv .iv-row.miv-row { display: flex !important; align-items: center; gap: 12px; width: 100%; min-height: 64px; padding: 8px 12px 8px 14px; margin: 0;
    border: none; border-bottom: 1px solid var(--border); border-radius: 0; background: none; text-align: left; box-shadow: none; }
  .miv .miv-row:last-child { border-bottom: none; }
  .miv .miv-row.void { opacity: 0.55; }
  .miv-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
  .miv-name { font-size: 15px; font-weight: 500; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .miv-body .ms-meta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .miv-r { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; flex-shrink: 0; }
  .miv-amt { font-size: 14px; color: var(--text-primary); }
  .miv-st { font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; }

  /* Detail actions: one big primary, the rest paired */
  .iv-detail-actions { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px; }
  .iv-detail-actions > .tb-btn { min-height: 48px; height: auto; width: 100%; justify-content: center; font-size: 14.5px; border-radius: 10px; text-decoration: none; display: inline-flex; align-items: center; }
  .iv-detail-actions > .tb-btn:first-child { grid-column: 1 / -1; min-height: 52px; font-size: 16px; }
  .iv-detail-actions > .tb-btn:last-child:nth-child(even) { grid-column: 1 / -1; }

  /* Record payment */
  .ni-quick { display: flex; gap: 8px; flex-wrap: wrap; margin: -2px 0 12px; }
  .ni-pay .ni-grid2 { grid-template-columns: 1fr !important; }
  .ni-foot-actions:has(> :nth-child(2):last-child) > :last-child { grid-column: auto; order: 0; }
}

/* ── Settings pass ─────────────────────────────────────────────────── */
@media (max-width: 760px) {
  .settings-wrap.mst { padding: 12px 16px 32px !important; max-width: none; }
  .mst-head { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
  .mst-head .st-autosave { display: inline-flex; align-items: center; gap: 6px; font-size: 10.5px; color: var(--text-muted); }
  .mst .st-tabs { position: sticky; top: 0; z-index: 5; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; padding: 3px; margin: 0 0 16px;
    border-radius: 10px; background: var(--surface-2); border: 1px solid var(--border); box-shadow: 0 6px 12px -8px var(--bg); }
  .mst .st-tabs .st-tabs-spacer, .mst .st-tabs .st-autosave { display: none; }
  .mst .st-tab { min-height: 44px; justify-content: center; border-radius: 8px; padding: 0 4px; font-size: 13.5px; gap: 5px; border: none; }
  .mst .st-tab.active { background: var(--surface-3); box-shadow: inset 0 0 0 1px var(--border-strong); }

  /* Rows stack; full-width 48px fields with 16px text (no iOS zoom) */
  .mst .st-row { flex-direction: column; align-items: stretch; gap: 8px; }
  .mst .st-input, .mst .st-select, .mst .st-member-name, .mst .st-member-email {
    width: 100% !important; min-height: 48px; height: auto !important; font-size: 16px !important; padding: 0 12px; border-radius: 10px; box-sizing: border-box; }
  .mst .tb-btn.st-sm, .mst label.tb-btn, .mst .st-chip, .mst .settings-del-btn, .mst .st-room-edit { min-height: 44px; min-width: 44px; }
  .mst .st-mpick { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 48px; padding: 0 12px; border-radius: 10px;
    border: 1px solid var(--border-strong); background: var(--surface-2); color: var(--text-primary); font-size: 16px; }

  /* Rooms list: whole row opens the editor */
  .mst .st-room { min-height: 64px; cursor: pointer; }
  .mst .st-room-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mst .st-add { min-height: 48px; width: 100%; justify-content: center; }

  /* Members */
  .mst .st-member { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 8px 10px; align-items: center; padding: 12px; }
  .mst .st-member-id { display: flex; flex-direction: column; gap: 6px; }
  .mst .st-member-status { grid-column: 2; justify-self: start; }
  .mst .st-member .st-role-chips { grid-column: 1 / -1; }
  .mst .st-member .settings-del-btn, .mst .st-member .st-danger { grid-column: 3; grid-row: 1; }
  .mst .st-invite-row { flex-direction: column; align-items: stretch; gap: 10px; }
  .mst .st-invite-row .tb-btn { min-height: 48px; justify-content: center; }
  .st-role-chips { gap: 6px; }
  .st-role-chips .cs-chip { min-height: 40px; padding: 0 12px; }
  .st-role-chips .cs-chip:disabled { opacity: 0.35; }

  /* Roles & access: one role at a time */
  .st-maccess { padding: 12px 12px 4px; }
  .st-maccess .ms-chips { margin: 0 -12px; padding: 0 12px 8px; }
  .st-maccess .ms-chip { min-height: 44px; }
  .st-maccess-note { margin: 4px 0 8px; font-size: 13px; color: var(--text-muted); }
  .st-maccess-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 60px; padding: 8px 0; border-bottom: 1px solid var(--border); }
  .st-maccess-row.sep { border-top: 1px dashed var(--border-strong); }
  .st-maccess-l { min-width: 0; font-size: 15px; }
  .st-maccess .st-seg { flex-shrink: 0; }
  .st-maccess .st-seg-btn { min-width: 52px; min-height: 44px; font-size: 13px; }
  .mst .st-access-foot { flex-direction: column; align-items: stretch; gap: 8px; }

  /* Full-screen room editor */
  .st-mroom { position: fixed; inset: 0; z-index: 85; display: flex; flex-direction: column; background: var(--bg); }
  .st-mroom-head { display: flex; align-items: center; gap: 8px; padding: calc(8px + env(safe-area-inset-top, 0px)) 12px 8px; border-bottom: 1px solid var(--border);
    box-shadow: inset 4px 0 0 var(--room-color); }
  .st-mroom-title { flex: 1; min-width: 0; display: flex; flex-direction: column; }
  .st-mroom-title b { font-size: 18px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .st-mroom-body { flex: 1; overflow-y: auto; padding: 16px 16px calc(32px + var(--mb-safe-b)); }
  .st-mroom-fields { display: flex; flex-direction: column; gap: 8px; margin-bottom: 18px; }
  .st-mroom-fields .st-room-panel-k { margin-top: 6px; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
  .st-mroom .settings-input { min-height: 48px; height: auto !important; font-size: 16px !important; border-radius: 10px; box-sizing: border-box; max-width: 100%; }
  .st-mroom .st-input { width: 100% !important; min-height: 48px; height: auto !important; font-size: 16px !important; padding: 0 12px; border-radius: 10px; box-sizing: border-box; }
  .st-mroom .st-rate-edit { display: flex; align-items: center; gap: 8px; }
  .st-mroom .st-rate-edit-cur { font-size: 16px; color: var(--text-muted); }
  .st-mroom .settings-item-colors { display: flex; flex-wrap: wrap; gap: 10px; }
  .st-mroom .color-swatch { width: 40px !important; height: 40px !important; border-radius: 10px; }
  .st-mroom-del { width: 100%; margin-top: 20px; min-height: 48px; }
  .st-mroom button, .st-mroom .tb-btn { min-height: 44px; }
}

/* ── Settings formatting pass ──────────────────────────────────────── */
@media (max-width: 760px) {
  /* Sticky tab switch: cover what scrolls under it */
  .mst .st-tabs { top: 8px; outline: 8px solid var(--bg); }

  /* Members: real-looking fields */
  .mst .st-member-name, .mst .st-member-email { border: 1px solid var(--border-strong) !important; background: var(--surface-2) !important; color: var(--text-primary); }
  .mst .st-member-email { font-family: var(--font-sans) !important; }
  .mst .st-member { align-items: start; }
  .mst .st-member-avatar { margin-top: 6px; }

  /* Invite: the desktop flex-basis turned into 200px-tall fields in a column */
  .mst .st-invite-row > * { flex: none !important; width: 100% !important; }
  .mst .st-invite-staff { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
  .mst .st-invite-staff-k { flex-basis: 100%; }
  .mst .st-access-foot .tb-btn { min-height: 44px; justify-content: center; }

  /* Room editor */
  .st-mroom .st-io-save { display: none !important; }
  .st-mroom .settings-input:not([type="number"]) { width: 100% !important; }
  .st-mroom .st-tl-head { grid-template-columns: minmax(0, 1fr) auto !important; }
  .st-mroom .st-tl-count { grid-column: 1 / -1; grid-row: 2; }
  .st-mroom .st-tl-count .tb-btn { min-width: 44px; min-height: 44px; justify-content: center; }
  .st-mroom .st-tl-lines { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .st-mroom .st-tl-lines .settings-input { height: 44px !important; font-size: 16px !important; }

  /* Add room wizard */
  .room-ob-steps { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 4px; }
  .room-ob-step { min-width: 0; justify-content: center; padding: 0 4px; font-size: 11.5px; }
  .room-ob-step:not(.active) { font-size: 0; }
  .room-ob-step:not(.active) span { font-size: 12px; }
  .modal .color-swatch { width: 36px !important; height: 36px !important; flex: none !important; border-radius: 50%; }
  .modal .color-swatch + .color-swatch { margin: 0; }
  .modal :has(> .color-swatch) { flex-wrap: wrap; gap: 8px; }
  .room-ob-presets { flex-wrap: wrap; gap: 6px; }
  .room-ob-presets button { min-width: 44px !important; min-height: 44px; font-size: 14px; justify-content: center; }
  .modal .mf-row:has(.room-ob-presets) { grid-template-columns: 1fr !important; }
  .room-ob-lines { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .modal-foot .tb-btn { white-space: nowrap; padding-left: 10px !important; padding-right: 10px !important; }
}

/* ═══ Scan (scan-module.jsx) ═══════════════════════════════════════════ */
@media (max-width: 760px) {
  .msc .ms-hero { padding-bottom: 12px; }
  .msc-inline { display: inline; margin: 0; min-height: 0; }

  /* Viewfinder: square, with a corner frame showing where to aim. */
  .msc-view {
    position: relative; aspect-ratio: 1 / 1; width: 100%; overflow: hidden;
    border-radius: 14px; background: oklch(0.12 0.004 65); border: 1px solid var(--border);
  }
  .msc-view.hidden { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
  .msc-video { width: 100%; height: 100%; object-fit: cover; display: block; }
  .msc-frame { position: absolute; inset: 18%; pointer-events: none; }
  .msc-frame i { position: absolute; width: 28px; height: 28px; border: 3px solid var(--accent); }
  .msc-frame i:nth-child(1) { top: 0; left: 0; border-right: 0; border-bottom: 0; border-top-left-radius: 8px; }
  .msc-frame i:nth-child(2) { top: 0; right: 0; border-left: 0; border-bottom: 0; border-top-right-radius: 8px; }
  .msc-frame i:nth-child(3) { bottom: 0; left: 0; border-right: 0; border-top: 0; border-bottom-left-radius: 8px; }
  .msc-frame i:nth-child(4) { bottom: 0; right: 0; border-left: 0; border-top: 0; border-bottom-right-radius: 8px; }
  .msc-note {
    position: absolute; inset: 0; display: grid; place-items: center; padding: 24px; text-align: center;
    font-size: 14px; line-height: 1.5; color: var(--text-secondary);
  }

  .msc-type { display: flex; gap: 8px; margin-top: 12px; }
  .msc-type-input { flex: 1; min-width: 0; border: 1px solid var(--border); background: var(--surface); font-family: var(--font-mono); text-transform: uppercase; }
  .msc-type-input::placeholder { text-transform: none; font-family: var(--font-sans); }
  .msc-type .ms-btn { min-height: 50px; }

  /* Results */
  .msc-result { display: flex; flex-direction: column; }
  .msc-item { flex-direction: column; overflow: hidden; }
  .msc-photo { width: 100%; max-height: 220px; object-fit: cover; display: block; border-bottom: 1px solid var(--border); }
  .msc-item-body { padding: 14px 16px 16px; }
  .msc-item-name { margin-top: 6px; font-size: 22px; font-weight: 500; letter-spacing: -0.01em; line-height: 1.25; }
  .msc-facts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
  .msc-fact {
    display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 0 10px;
    border-radius: 15px; border: 1px solid var(--border-strong); font-size: 13px; color: var(--text-primary);
  }
  .msc-tickets { margin-top: 10px; }
  .msc-done {
    margin-top: 10px; padding: 10px 14px; border-radius: 10px; font-size: 14px;
    color: var(--green); border: 1px solid color-mix(in oklab, var(--green) 40%, transparent);
    background: color-mix(in oklab, var(--green) 10%, transparent);
  }
  .msc-result .ms-btn-row { margin-top: 12px; }
  .msc-result .ms-btn { min-height: 50px; font-size: 15px; }
  .msc-open { margin-top: 8px; }
  .msc-next { margin-top: 16px; }
  .msc-unknown { flex-direction: column; padding: 16px; gap: 6px; }
  .msc-raw { display: block; padding: 8px 10px; border-radius: 8px; background: var(--bg); font-size: 12px; word-break: break-all; color: var(--text-secondary); }

  .msc-loc-head { padding: 4px 0 4px; }
  .msc-move { flex-direction: column; padding: 14px 16px; margin-top: 12px; border-color: color-mix(in oklab, var(--accent) 50%, var(--border)); }
  .msc-move .ms-btn-row { margin-top: 12px; }
  .msc-here { margin-top: 16px; }

  .msc-scanloc { width: 100%; margin-top: 12px; }
  .msc-or { display: block; margin: 20px 0 4px; }
  .msc-notes { margin-top: 0; border: 1px solid var(--border); background: var(--bg); font-size: 16px; }
  .msc-qr { margin-top: 10px; }
  .msc-result .msc-qr-row { margin-top: 8px; }
  .msc-code { overflow-wrap: anywhere; }
  .msc-code.long { font-size: 15px; line-height: 1.4; }
  .msc-assign-search { margin-top: 12px; border: 1px solid var(--border); background: var(--bg); }
}