/* Mira on a phone (handoff 01/11/2026 "Dev · Mobile (390px)", Figma 234:10048 … 236:10157). Loaded after style.css.
   Components only mobile code opens (sheet, cards, contact page parts) are styled unconditionally; overrides of desktop
   screens sit inside @media (max-width: 767px). Colours, type and radii come from the tokens in style.css. */

/* ---- bottom sheet (ui.js sheet()) --------------------------------------------------------------------------------- */
dialog.m-sheet { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0;
  background: rgba(29, 33, 41, .4); color: var(--text-primary); }
dialog.m-sheet::backdrop { background: transparent; }
.m-sheet-panel { position: absolute; left: 0; right: 0; bottom: 0; max-height: 90vh; max-height: 90dvh; display: flex; flex-direction: column;
  background: var(--bg-surface); border-radius: 12px 12px 0 0; box-shadow: var(--shadow-dialog); animation: m-up .2s ease-out; transition: transform .1s; }
dialog.m-sheet.full .m-sheet-panel { top: env(safe-area-inset-top); max-height: none; border-radius: 0; }
@keyframes m-up { from { transform: translateY(40px); opacity: .6; } }
.m-sheet-head { flex: none; padding: 8px 16px 4px; touch-action: none; }
.m-sheet-grip { display: block; width: 36px; height: 4px; margin: 0 auto 8px; border-radius: 2px; background: var(--border-strong); }
.m-sheet-title { gap: 8px; flex-wrap: nowrap; } .m-sheet-title b { font-size: var(--fs-lg); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-sheet-x { border: 0; background: none; width: 40px; height: 40px; padding: 0; font-size: 16px; color: var(--text-secondary); flex: none; }
.m-sheet-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 8px 16px 16px; display: flex; flex-direction: column; gap: 12px; }
.m-sheet-foot { flex: none; display: flex; flex-direction: column; gap: 8px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--border-default); }
.m-sheet-body .card { border: 0; padding: 0; }
.m-sheet-label { font-size: var(--fs-xs); font-weight: 600; color: var(--text-tertiary); text-transform: uppercase; letter-spacing: .02em; }
.m-opts { display: flex; flex-wrap: wrap; gap: 8px; }
.m-opt { border-radius: 999px; padding: 0 14px; background: var(--bg-surface); }
.m-opt.on { border-color: var(--brand); background: var(--brand-soft); color: var(--brand); font-weight: 500; }
.m-wide { width: 100%; justify-content: center; text-align: center; }
.m-offscreen { position: fixed; left: -9999px; opacity: 0; }
.m-search-input { width: 100%; padding: 10px 12px; border: 1px solid var(--border-default); border-radius: 20px; background: var(--bg-subtle); font: inherit; font-size: 16px; color: var(--text-primary); }

/* ---- "Thêm" (the sidebar items that are not tabs) ------------------------------------------------------------------ */
.m-more { display: flex; flex-direction: column; }
.m-more-row { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 4px; border: 0; border-bottom: 1px solid var(--border-default); border-radius: 0; background: none; text-align: left; color: var(--text-primary); }
.m-more-row .ico { width: 20px; height: 20px; } .m-more-row.on { color: var(--brand); font-weight: 500; } .m-more-row.on .ico { background: var(--brand); }
.m-more-user { gap: 12px; padding-top: 16px; flex-wrap: nowrap; }

/* ---- Hôm nay -------------------------------------------------------------------------------------------------------- */
.m-today { display: flex; flex-direction: column; gap: 12px; }
.m-today-title { margin: -8px 0 4px; font-size: var(--fs-xl); }
.m-todo { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border-radius: 8px; }
.m-todo-title { font-size: var(--fs-lg); }
.m-todo-row { gap: 10px; flex-wrap: nowrap; align-items: center; min-height: 52px; cursor: pointer; } .m-todo-row .grow { min-width: 0; }
.m-todo-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-todo-check { width: 18px; height: 18px; margin: 0; flex: none; }
.m-late { color: var(--danger); white-space: nowrap; }
.m-todo-link { padding: 8px 0 2px; }

/* ---- Prospect cards ------------------------------------------------------------------------------------------------- */
.m-pl { gap: 12px; }
.m-pl .m-search { flex: none; width: 100%; min-height: 44px; border-radius: var(--r-md); }
.m-pl .m-search input { min-height: 0; }
.m-chips { display: flex; gap: 8px; overflow-x: auto; margin: 0 -16px; padding: 0 16px; scrollbar-width: none; }
.m-chips::-webkit-scrollbar { display: none; }
.m-chips button { flex: none; border-radius: 999px; padding: 0 14px; white-space: nowrap; background: var(--bg-surface); border-color: var(--border-default); }
.m-chips button.on { background: var(--brand); border-color: var(--brand); color: #fff; } .m-chips button.on .pl-n { color: rgba(255, 255, 255, .85); }
.m-pl-meta { gap: 8px; flex-wrap: nowrap; }
.m-filter-btn { white-space: nowrap; font-weight: 500; text-decoration: none; } .m-filter-btn.on { color: var(--brand); }
.m-cards { display: flex; flex-direction: column; gap: 12px; }
.m-card { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: 8px; cursor: pointer;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.m-card.picked { border-color: var(--brand); background: var(--brand-soft); }
.m-card-top { gap: 10px; flex-wrap: nowrap; align-items: flex-start; } .m-card-top .grow { min-width: 0; }
.m-card-top .db-avatar { width: 36px; height: 36px; }
.m-card-name { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-card-sub { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-card-more { width: 40px; height: 40px; margin: -8px -8px 0 0; border: 0; background: none; font-size: 18px; color: var(--text-tertiary); flex: none; }
.m-card-chips { gap: 8px; align-items: center; flex-wrap: wrap; }
.m-card-line { padding: 6px 10px; background: var(--bg-subtle); border-radius: var(--r-md); font-size: var(--fs-xs); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-card-line.warn { background: var(--warning-soft); color: var(--warning); font-weight: 500; }
.m-more-sentinel, .m-hint { text-align: center; padding: 4px 0; }
.m-bulk { position: fixed; left: 8px; right: 8px; bottom: calc(72px + env(safe-area-inset-bottom)); z-index: 30; display: flex; align-items: center; gap: 8px;
  padding: 8px 12px; background: var(--bg-surface); border: 1px solid var(--brand); border-radius: 8px; box-shadow: var(--shadow-dialog); }

/* ---- contact page (235:10097) ---------------------------------------------------------------------------------------- */
.pd-m { gap: 12px; }
.m-top { position: sticky; top: 0; z-index: 8; gap: 8px; flex-wrap: nowrap; height: 56px; margin: -12px -16px 0; padding: 0 8px; background: var(--bg-surface); border-bottom: 1px solid var(--border-default); }
.m-top .grow { min-width: 0; }
.m-top-name { font-weight: 700; font-size: var(--fs-lg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.3; }
.m-top-btn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border: 0; background: none; font-size: 20px; color: var(--text-primary); flex: none; }
.m-top-btn:hover { text-decoration: none; }
.m-pd-id { display: flex; flex-direction: column; gap: 10px; margin: 0 -16px; padding: 4px 16px 12px; background: var(--bg-surface); border-bottom: 1px solid var(--border-default); }
.m-pd-who { gap: 12px; flex-wrap: nowrap; align-items: flex-start; } .m-pd-who .grow { min-width: 0; }
.m-pd-av { width: 48px; height: 48px; font-size: var(--fs-md); }
.m-pd-name { font-size: var(--fs-xl); font-weight: 700; line-height: 1.3; }
.m-pd-sub { color: var(--text-secondary); }
.m-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.m-pill { display: inline-flex; align-items: center; min-height: 36px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--border-default); background: var(--bg-surface); font-size: var(--fs-xs); font-weight: 500; color: var(--text-primary); }
.m-pill.ro { color: var(--text-secondary); cursor: default; }
.m-caret { color: var(--text-tertiary); font-size: 10px; margin-left: 2px; }
.m-next { display: flex; flex-direction: row; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 8px; }
.m-next .grow { min-width: 0; } .m-next-text { font-weight: 500; }
.m-tabs { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid var(--border-default); }
.m-tabs button { min-height: 44px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: none; color: var(--text-secondary); }
.m-tabs button.on { border-bottom-color: var(--brand); color: var(--brand); font-weight: 600; }
.m-pane > .card, .m-co { border: 0; background: none; padding: 0; }
.m-co { display: flex; flex-direction: column; gap: 8px; }
.m-fold { background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: 8px; }
.m-fold > summary { list-style: none; display: flex; align-items: center; min-height: 44px; padding: 0 14px; font-weight: 600; cursor: pointer; }
.m-fold > summary::after { content: "▾"; margin-left: auto; color: var(--text-tertiary); }
.m-fold[open] > summary::after { content: "▴"; }
.m-fold > summary::-webkit-details-marker { display: none; }
.m-fold > .card { border: 0; border-top: 1px solid var(--border-default); border-radius: 0 0 8px 8px; }
.m-actbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; display: flex; gap: 8px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
  background: var(--bg-surface); border-top: 1px solid var(--border-default); }
.m-actbar .primary { flex: 1; min-height: 44px; }
.m-act-li { display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border: 1px solid var(--border-strong); border-radius: var(--r-sm); color: var(--text-primary); white-space: nowrap; }

/* ---- Ghi nhanh (235:10194) ---------------------------------------------------------------------------------------------- */
.pd-quick-m { display: flex; flex-direction: column; gap: 12px; }
.pd-quick-m .pd-quick-seg { display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; }
.pd-quick-m .pd-quick-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) 96px; gap: 8px; }
.pd-quick-m .pd-quick-top .dr-input { width: 100%; min-width: 0; padding: 0 10px; border-radius: 999px; }
.pd-quick-m .row > button { flex: none; white-space: nowrap; }
.pd-quick-m textarea { min-height: 132px; }
.pd-quick-m .row { gap: 8px; flex-wrap: nowrap; align-items: center; }

@media (max-width: 767px) {
  /* ---- frame: navbar 56px (logo · title · ⌕ · ? · bell), no sidebar, bottom tab bar ----------------------------------- */
  html, body { overflow-x: hidden; }
  body { font-size: 14px; -webkit-text-size-adjust: 100%; }
  .navbar { height: auto; min-height: 56px; flex-wrap: wrap; gap: 4px; padding: 0 8px 0 16px; padding-top: env(safe-area-inset-top); }
  .nav-logo { height: 56px; }
  .nav-name, .nav-sub, .nav-sync, .nav-search { display: none; }
  .nav-logo { gap: 8px; } .nav-logo img { width: 28px; height: 28px; }
  .nav-title { flex: 1; min-width: 0; font-size: var(--fs-lg); font-weight: 700; display: flex; align-items: center; overflow: hidden; white-space: nowrap; }
  .nav-icon { display: inline-flex; align-items: center; justify-content: center; width: 40px; padding: 0; border: 0; background: none; }
  .nav-icon, .nav-bell { height: 40px; }
  .nav-help { flex: none; margin: 0 4px; }
  .nav-bell { display: inline-flex; align-items: center; justify-content: center; width: 40px; flex: none; }
  .nav-bell img { width: 28px; height: 28px; }
  .shell, .shell.side-collapsed { display: block; min-height: 0; }
  .sidebar { display: none; }
  main { padding: 12px 16px calc(84px + env(safe-area-inset-bottom)); overflow-x: hidden; }
  .content > footer { display: none; }
  .tabbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 25; display: grid; grid-template-columns: repeat(4, 1fr);
    height: calc(64px + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); background: var(--bg-surface); border-top: 1px solid var(--border-default); }
  .tabbar > a, .tabbar > button { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; border: 0; border-radius: 0;
    background: none; padding: 0; font-size: var(--fs-xs); color: var(--text-tertiary); text-decoration: none; }
  .tabbar .ico { width: 20px; height: 20px; background: var(--text-tertiary); }
  .tabbar .on { color: var(--brand); font-weight: 700; } .tabbar .on .ico { background: var(--brand); }
  .ico-menu { --ico: url(/icons/menu.svg); }
  .tab-badge { position: absolute; top: 6px; left: calc(50% + 4px); min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--danger); color: #fff;
    font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }
  body[data-page="detail"] .navbar, body[data-page="detail"] .tabbar, body[data-page="detail"] .ptabs { display: none; }
  body[data-page="detail"] main { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }

  /* touch targets ≥ 40px; 16px text in fields so iOS does not zoom in */
  button, a.button, select, input:not([type=checkbox]):not([type=radio]):not([type=range]) { min-height: 40px; }
  input, select, textarea, .dr-input { font-size: 16px !important; }
  input[type=checkbox], input[type=radio] { width: 20px; height: 20px; }
  .link-button { min-height: 40px; display: inline-flex; align-items: center; }
  .pl-chip button, .cw-x, .coach-copy { min-height: 0; }

  /* ---- cleanup warning: a strip under the navbar (§4) ---------------------------------------------------------------- */
  .cw-slot { order: 10; flex: 0 0 auto; width: calc(100% + 24px); margin: 0 -8px 0 -16px; padding: 0; display: block; }
  .cleanup-warn { display: flex; width: 100%; height: 40px; max-width: none; padding: 0 4px 0 16px; gap: 8px; border: 0; border-top: 1px solid var(--border-default);
    border-bottom: 1px solid var(--warning); border-radius: 0; background: var(--warning-soft); }
  .cleanup-warn .cw-ico { width: 18px; height: 18px; font-size: 11px; }
  .cw-text { flex: 0 1 auto; min-width: 0; min-height: 40px; border: 0; background: none; padding: 0; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-primary); }
  .cleanup-warn .cw-why { display: inline-flex; min-height: 40px; align-items: center; }
  .cw-x { width: 40px; height: 40px; font-size: 15px; }
  .cw-sheet .cw-reason { gap: 12px; } .cw-sheet .cw-reason b { font-size: var(--fs-md); }

  /* ---- drawers and dialogs → bottom sheets; the detail dialog → full screen -------------------------------------------- */
  dialog.drawer .dr-panel { top: auto; left: 0; right: 0; width: 100%; max-height: 94vh; max-height: 94dvh; border-radius: 12px 12px 0 0; animation: m-up .2s ease-out; }
  dialog.drawer .dr-panel::before { content: ""; display: block; flex: none; width: 36px; height: 4px; margin: 8px auto 0; border-radius: 2px; background: var(--border-strong); }
  .dr-head { padding: 10px 16px; } .dr-scroll { flex: 1 1 auto; min-height: 0; padding: 16px; gap: 16px; }
  .dr-close { width: 40px; height: 40px; }
  .dr-row { flex-direction: column; } .dr-row > * { width: 100%; }
  dialog.detail { width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; margin: 0; border-radius: 0; }
  .detail-head { flex-wrap: wrap; } .detail-body { grid-template-columns: 1fr !important; }
  .pd-modal, dialog.pb-meet-dlg { position: fixed; inset: auto 0 0 0; width: 100%; max-width: none; margin: 0; border-radius: 12px 12px 0 0; max-height: 90dvh; overflow-y: auto;
    padding-bottom: env(safe-area-inset-bottom); animation: m-up .2s ease-out; }
  .pd-modal-foot { flex-wrap: wrap; } .pd-modal-foot .primary { flex: 1; }
  .pl-menu { position: fixed !important; left: 0 !important; right: 0 !important; top: auto !important; bottom: 0 !important; width: auto !important; max-width: none !important;
    max-height: 70vh; overflow-y: auto; border-radius: 12px 12px 0 0 !important; padding: 8px 0 calc(8px + env(safe-area-inset-bottom)) !important; z-index: 960;
    box-shadow: 0 0 0 100vmax rgba(29, 33, 41, .4) !important; }
  .pl-menu > button { min-height: 48px; padding: 0 20px; font-size: var(--fs-md); }
  .toast { bottom: calc(80px + env(safe-area-inset-bottom)); max-width: calc(100vw - 32px); }
  body[data-page="detail"] .toast { bottom: calc(84px + env(safe-area-inset-bottom)); }

  /* ---- Prospect: the person picker only for admins; no Kanban toolbar ---------------------------------------------------- */
  .ptabs { margin: -12px -16px 12px; padding: 0 16px; height: 48px; }
  body[data-route="prospects"] .ptabs > a { display: none; }
  body[data-route="prospects"] .ptabs:has(select:disabled) { display: none; }
  .ptabs { overflow-x: auto; scrollbar-width: none; } .ptabs > a { flex: none; white-space: nowrap; }
  .ptabs .owner-select { flex: 1; } .ptabs .owner-select > span { display: none; } .ptabs .owner-select select { flex: 1; min-height: 32px; }
  .pl-header { flex-wrap: wrap; gap: 8px; }
  .pl-search { width: 100%; }

  /* ---- Hôm nay: the priority block (Figma 234:10048) ------------------------------------------------------------------ */
  .db-pri { padding: 14px; border-radius: 8px; gap: 12px; }
  .db-pri-head .db-chev { display: none; }
  .db-pri-ico { width: 28px; height: 28px; }
  .db-pri-item { padding: 14px; border-radius: 8px; gap: 10px; }
  .db-pri-top .pl-chip { flex: none; }
  .db-pri-item .row > .spacer { display: none; }
  .db-pri-item .row:last-child { flex-wrap: nowrap; gap: 8px; }
  .db-pri-ask { flex: 1; justify-content: center; min-height: 40px; color: var(--text-primary); }
  .db-pri-item .pl-more { width: 40px; height: 40px; padding: 0; flex: none; }
  .db-pri-next { align-self: center; border: 0; background: none; color: var(--text-secondary); }
  .db-pri-list { grid-template-columns: 1fr; }
  .db-row { grid-template-columns: 1fr; }

  /* ---- contact page ---------------------------------------------------------------------------------------------------- */
  .pd-m .pd-adv { border-radius: 8px; background: var(--brand-soft); }
  .pd-m .pd-card { padding: 12px 14px; }
  .pd-chat-card { border: 0; background: none; padding: 0 !important; }
  .pd-chat-card .pd-card-head { display: none; }
  .pd-chat .pd-msg-col { max-width: 290px; }
  .pd-chat .pd-av { display: none; }

  /* ---- AI coach: full screen (236:10116) -------------------------------------------------------------------------------- */
  .coach-launcher { right: 16px; bottom: calc(80px + env(safe-area-inset-bottom)); }
  body[data-page="detail"] .coach-launcher { bottom: calc(84px + env(safe-area-inset-bottom)); }
  body.coach-on { overflow: hidden; }
  body.coach-on .coach-launcher { display: none; }
  .coach-panel, .coach-panel.wide { top: 0; left: 0; right: 0; bottom: auto; width: 100%; height: 100vh; height: 100dvh; max-height: none; border: 0; border-radius: 0; z-index: 970; }
  .coach-panel .coach-head { padding: calc(8px + env(safe-area-inset-top)) 12px 8px 4px; gap: 8px; }
  .coach-panel .coach-hbtn[aria-label="Mở rộng"], .coach-panel .coach-hbtn[aria-label="Thu nhỏ"] { display: none; }
  .coach-panel .coach-hbtn { width: 40px; height: 40px; }
  .coach-panel .coach-body { padding: 8px 16px; background: var(--bg-canvas); }
  .coach-panel .coach-privacy { display: none; }
  .coach-panel .coach-quick { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px; padding: 0 16px; scrollbar-width: none; }
  .coach-panel .coach-quick button { flex: none; white-space: nowrap; min-height: 32px; border: 0; background: var(--brand-soft); border-radius: var(--r-sm); }
  .coach-panel .coach-foot { padding: 8px 16px calc(8px + env(safe-area-inset-bottom)); }
  .coach-panel .coach-compose { align-items: center; gap: 8px; }
  .coach-panel .coach-input { border-radius: 20px; padding: 9px 16px; min-height: 40px; max-height: 120px; }
  .coach-panel .coach-send { width: 40px; height: 40px; border-radius: 50%; padding: 0; border: 0; background: var(--brand); color: #fff; flex: none; }
  .coach-panel .coach-msg { max-width: 100%; }
  .coach-panel .coach-msg.me { max-width: 85%; }
  .coach-panel .coach-msg.ai .coach-bubble { padding: 12px; }

  /* ---- other screens: nothing wider than the screen; grids to one column, wide tables scroll in their own box ---------- */
  .two, .cards, .ov-tiles, .ov-bottom, .help-3, .help-topics, .help-lists, .lim-cards, .td-hots, .ts-kpis, .db-kpis, .ov-team-tiles, .mp-perf, .po-detail { grid-template-columns: 1fr !important; }
  .ov-steps, .ov-stages { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  table { display: block; max-width: 100%; overflow-x: auto; }
  .pl-table, .ov-mtable, .srch-table, .wl-table, .mw-table, .mp-table, .td-table, .act-table, .seg-table { max-width: 100%; overflow-x: auto; }
  .filters { flex-wrap: wrap; }
  .filters input[type=search] { min-width: 0; width: 100%; }
}
@media (max-width: 767px) {
  .pd-m .pd-adv > .row:first-child { flex-wrap: wrap; gap: 0 12px; } .pd-m .pd-adv > .row:first-child > .spacer { display: none; }
  .pd-m .pd-adv .link-button { min-height: 36px; text-decoration: none; }
  .m-next .grow { flex: 1; } .m-next .link-button { text-decoration: none; font-weight: 500; }
  .m-fold > .card > .row:first-child > b:first-child { display: none; }
  .m-fold > .card > b:first-child { display: none; }
}
@media (max-width: 767px) {
  .srch-row { grid-template-columns: 64px minmax(0, 1fr) 16px !important; row-gap: 2px; }
  .srch-row > :nth-child(3), .srch-row > :nth-child(4) { grid-column: 2; }
  .card, .ov-tile { min-width: 0; max-width: 100%; }
  .ov-tile { overflow: hidden; }
  .mp-perf { overflow-x: auto; }
  .mp-perf > * { min-width: 0; }
}
@media (max-width: 767px) {
  .ov-table, .subtabs { max-width: 100%; overflow-x: auto; }
  .subtabs > a { flex: none; white-space: nowrap; }
  .multi-menu { left: 0 !important; right: auto !important; max-width: calc(100vw - 32px); }
}
@media (max-width: 767px) {
  details.multi[open] > .multi-menu { position: fixed; left: 0 !important; right: 0 !important; top: auto; bottom: 0; max-width: none; max-height: 70vh; border-radius: 12px 12px 0 0;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); z-index: 960; box-shadow: 0 0 0 100vmax rgba(29, 33, 41, .4); }
  .multi-menu label { white-space: normal; min-height: 40px; display: flex; align-items: center; gap: 8px; }
  .ov-bottom > *, .ov-section > * { min-width: 0; }
  .ov-section { flex-wrap: wrap; }
  dl.kv { grid-template-columns: minmax(0, auto) minmax(0, 1fr); } dl.kv dd { overflow-wrap: anywhere; min-width: 0; }
  .pl-seg { max-width: 100%; overflow-x: auto; }
}