/* Phones (≤ 767 px wide, iPhone SE … Pro Max): one column, the organism first, controls within thumb
   reach, touch targets ≥ 44 px, no horizontal scrolling. Never applies to the 1080-px film render. */

.shell { grid-template-columns: minmax(0, 1fr); }

@media (max-width: 767px) {
  html, body { font-size: 14px; height: auto; }
  .shell { display: block; height: auto; min-height: 100vh; }
  .main { overflow: visible; }

  /* top bar: wordmark + shadow-mode chip, then a swipeable navigation row */
  .topbar { position: static; display: flex; flex-wrap: wrap; align-items: center; gap: 0 10px; height: auto; padding: 12px 14px 0; background: #1f081c; }
  .topbar::after { left: 14px; }
  .wordmark { gap: 5px; }
  .wordmark .wm-cf { font-size: 15px; }
  .wordmark .wm-by { font-size: 10px; }
  .wordmark .wm-k { font-size: 10px; letter-spacing: 0.13em; }
  .tb-right { display: flex; margin-left: auto; gap: 8px; }
  .tb-right .chip { height: 18px; font-size: 8.5px; padding: 0 5px; }
  .tb-ctx, .tb-clock { display: none; }
  .nav {
    order: 3; flex: 0 0 calc(100% + 28px); margin: 6px -14px 0; padding: 0 14px; height: 44px; gap: 20px;
    overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .nav::-webkit-scrollbar { display: none; }
  .nav-i { white-space: nowrap; font-size: 10.5px; flex: 0 0 auto; }

  /* bottom bar: truth labels stay, chips go, links get touch room */
  .bottombar { display: flex; flex-wrap: wrap; gap: 6px 14px; padding: 12px 14px calc(12px + env(safe-area-inset-bottom)); }
  .bb-disc, .bb-mode { white-space: normal; font-size: 10.5px; line-height: 1.5; }
  .bb-chips { display: none; }
  .bb-links { order: 3; width: 100%; flex-wrap: wrap; gap: 4px 18px; }
  .bb-links a { display: inline-flex; align-items: center; min-height: 44px; font-size: 12px; }

  /* touch targets */
  .btn, .btn-s { min-height: 44px; height: auto; padding: 0 14px; font-size: 10.5px; }
  .btn-speed { font-size: 13px; }
  .info { position: relative; width: 30px; height: 30px; flex-basis: 30px; font-size: 12px; }
  .info::after { content: ''; position: absolute; inset: -7px; } /* 44 px touch area around the 30 px circle */
  .panel-code { display: none; }
  .panel-h .info { margin-left: auto; }
  .panel-h { height: 38px; flex-basis: 38px; }
  .pop { width: calc(100vw - 24px); }

  /* ---- organism control: organism first, then chain, controls, panels in chain order ---- */
  .org-view { display: flex; flex-direction: column; gap: 10px; padding: 10px 10px calc(84px + env(safe-area-inset-bottom)); height: auto; min-height: 0; }
  .org-view > .col, .org-view > .row-b { display: contents; }
  .org-view .p-organism { order: 1; flex: none; height: min(100vw, 540px); min-height: 0; }
  .org-view .chain-map { order: 2; }
  .org-view .operator { order: 3; }
  .org-view .p-control { order: 4; }
  .org-view .p-market { order: 5; }
  .org-view .p-quant { order: 6; }
  .org-view .p-evidence { order: 7; }
  .org-view .p-validation { order: 8; }
  .org-view .p-risk { order: 9; }
  .org-view .p-permit { order: 10; }
  .org-view .p-shadow { order: 11; }
  .org-view .p-proof { order: 12; }
  .org-view .panel { flex: none; }
  .org-tele, .org-legend { display: none; }
  .org-caption { font-size: 10.5px; }
  .org-outcome { font-size: 12px; }

  .chain-map { flex-wrap: wrap; gap: 6px; padding: 0; }
  .chain-map .cm-arrow { display: none; }
  .chain-map .cm-info { display: none; }
  .chain-map .cm-cell { flex: 1 1 calc(25% - 6px); min-width: 0; padding: 6px; }
  .cm-label { font-size: 9px; }

  .operator .oc-row { gap: 8px; }
  .operator .oc-sep { display: none; }
  .oc-whatif .btn { flex: 1 1 calc(50% - 8px); }
  .oc-meta { flex-direction: column; align-items: flex-start; gap: 4px; }

  .org-dock {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; gap: 8px; align-items: center;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
    background: #180615; border-top: 1px solid var(--c-line-hi); box-shadow: 0 -10px 24px rgba(10, 2, 9, 0.6);
  }
  .org-dock .btn { flex: 1 1 0; min-height: 48px; }
  .dock-state { flex: 1.2 1 0; font-size: 10px; color: var(--c-gold); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; }

  /* panels on a narrow screen */
  .kv-list.kv-2 { grid-template-columns: 1fr; }
  .ck { grid-template-columns: 10px minmax(0, 1.3fr) minmax(0, 1fr) 54px; }
  .ck-lim { display: none; }
  .cc-ladder li { font-size: 7.5px; }

  /* ---- farm overview ---- */
  .farm-view { display: flex; flex-direction: column; gap: 10px; padding: 10px; height: auto; min-height: 0; }
  .fv-top { display: flex; flex-direction: column; gap: 10px; }
  .pub-intro { grid-template-columns: 1fr; gap: 14px; padding: 16px 14px; }
  .pi-title { font-size: 17px; }
  .pi-p { font-size: 13.5px; }
  .pi-links { grid-template-columns: 1fr 1fr; }
  .pi-link { min-height: 48px; font-size: 10px; letter-spacing: 0.08em; }
  .p-eco .panel-b { display: flex; flex-direction: column; min-height: 0; }
  .eco-counters { position: static; order: 1; flex-direction: row; flex-wrap: wrap; gap: 10px 18px; padding: 12px 14px 0; }
  .eco-c b { font-size: 22px; }
  .eco-ctl { position: static; order: 2; flex-wrap: wrap; padding: 10px 14px 0; }
  .eco-canvas { position: relative; order: 3; inset: auto; height: 104vw; max-height: 560px; }
  .eco-hint { position: static; order: 4; padding: 0 14px 12px; text-align: left; }
  .fc-bar { grid-template-columns: 84px 1fr 46px; }

  /* ---- tables: keep the essential columns, one line per row ---- */
  .rg-table td, .rg-table th { white-space: nowrap; padding: 10px 8px; }
  .reg-view .rg-table th:nth-child(5), .reg-view .rg-table td:nth-child(5),
  .reg-view .rg-table th:nth-child(6), .reg-view .rg-table td:nth-child(6),
  .reg-view .rg-table th:nth-child(8), .reg-view .rg-table td:nth-child(8),
  .reg-view .rg-table th:nth-child(9), .reg-view .rg-table td:nth-child(9) { display: none; }
  .ft-table th:nth-child(2), .ft-table td:nth-child(2),
  .ft-table th:nth-child(3), .ft-table td:nth-child(3),
  .ft-table th:nth-child(6), .ft-table td:nth-child(6),
  .ft-table th:nth-child(9), .ft-table td:nth-child(9),
  .ft-table th:nth-child(10), .ft-table td:nth-child(10) { display: none; }
  .ft-table td { padding: 8px; }

  /* ---- registry ---- */
  .reg-view { height: auto; }
  .p-registry { height: auto; }
  .rg-wrap { display: flex; flex-direction: column; }
  .rg-table-wrap { overflow-x: auto; }
  .rg-name { font-size: 15px; }

  /* ---- live film preview ---- */
  .film-host { height: auto; padding: 10px; }
  .fs-controls { width: 100%; }
  .fs-scrub { width: 100%; }

  /* ---- public pages ---- */
  .pub-view { padding: 10px; }
  .pub-card { padding: 20px 16px 16px; }
  .pub-h1 { font-size: 19px; }
  .pub-p, .pub-list { font-size: 14.5px; }
  .pub-link { display: inline-block; padding: 8px 0; }
  .pub-film { flex-direction: column; gap: 14px; }
  .pf-frame { width: 100%; }
  .pf-video { width: 100%; height: auto; min-height: 0; }
  .pf-side { flex: none; padding: 0 4px; }
}
