/* Lawsonite field kit — truck-first chrome on top of the core app. */

:root {
  --fk-header: #0a0a0a;
  --fk-header-ink: #f6f3ef;
  --fk-header-muted: #b9b3ae;
  --fk-orange: #fb4f14;
  --fk-nav-h: 4.35rem;
  --fk-radius: 16px;
  --fk-shadow: 0 10px 28px #0a0a0a18;
}

@media (prefers-color-scheme: dark) {
  :root {
    --fk-header: #070707;
    --fk-header-ink: #f6f3ef;
    --fk-header-muted: #a8a29e;
    --fk-shadow: 0 12px 32px #00000080;
  }
}

html { scroll-behavior: smooth; }
body {
  background:
    radial-gradient(900px 420px at -10% -20%, var(--hero-glow), transparent 55%),
    radial-gradient(700px 280px at 110% 0%, #fb4f1414, transparent 46%),
    var(--paper);
}

/* ---- App chrome: black tool header, Bengals stripe ---- */
.app-header {
  background: var(--fk-header) !important;
  color: var(--fk-header-ink);
  border-bottom: 3px solid var(--fk-orange) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  gap: 0.75rem;
  padding: 0.65rem 1rem;
}
.brand-link { color: inherit; }
.brand-mark {
  background: linear-gradient(145deg, #ff6a2b, #c4320a 58%, #3a1208);
  box-shadow: inset 0 1px 0 #ffb08a88, 0 0 0 1px #00000055;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 0.8rem;
  font-size: 1.05rem;
}
.brand-text strong { color: #fff !important; letter-spacing: -0.02em; }
.brand-text span,
.brand-by,
.brand-product { color: var(--fk-header-muted) !important; }
.main-nav a {
  color: #d4cfc9;
  border: 1px solid transparent;
}
.main-nav a:hover { color: #fff; background: #ffffff14; }
.main-nav a.active {
  background: var(--fk-orange) !important;
  color: #1a100c !important;
  border-color: transparent;
}

.fk-header-tools {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-left: auto;
}
.fk-search-btn {
  appearance: none;
  border: 1px solid #ffffff22;
  background: #ffffff12;
  color: #fff;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.fk-search-btn:hover { background: #ffffff20; }
.fk-search-btn svg { width: 1.25rem; height: 1.25rem; }

.disclaimer-banner {
  background: #1a140e;
  color: #f0d9a0;
  border-bottom: 1px solid #3a2e18;
  padding: 0.32rem 1rem;
  font-size: 0.75rem;
  letter-spacing: 0.01em;
}
.disclaimer-banner strong { color: #fb4f14; font-weight: 800; }

@media (max-width: 860px) {
  .app-header { flex-direction: row !important; align-items: center !important; }
  .main-nav { display: none !important; }
  .brand-text span.brand-by { display: none; }
  .crumbs { display: none; }
}

/* ---- Home ---- */
.hero-panel {
  background:
    linear-gradient(180deg, #ffffff08, transparent 40%),
    var(--card);
  border-color: var(--line);
  padding: 1.15rem 1.15rem 1.25rem;
  position: relative;
  overflow: hidden;
}
.hero-panel::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: linear-gradient(180deg, var(--fk-orange), #7a1f00);
}
.home-page .hero-panel h1 {
  letter-spacing: -0.03em;
}
.home-page .search-label {
  margin-top: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.72rem;
}
.home-page .search-input {
  min-height: 52px;
  border-radius: 14px;
  border-width: 1.5px;
  font-weight: 600;
  box-shadow: inset 0 1px 0 #fff8, var(--fk-shadow);
}
.home-page .search-input:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 4px var(--hero-glow);
}

.home-page.fk-searching > .section { display: none !important; }
.home-page .tip-panel { display: none !important; }

.fk-hits { display: grid; gap: 0.45rem; }
.fk-hits-meta {
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.fk-hit-list {
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  background: var(--card);
}
.fk-hit {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.72rem 0.9rem;
  min-height: 56px;
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid var(--line);
}
.fk-hit > div { min-width: 0; }
.fk-hit:last-child { border-bottom: 0; }
.fk-hit:hover { background: var(--brand-soft); }
.fk-hit strong { display: block; color: var(--brand-deep); font-size: 0.95rem; }
.fk-hit span {
  display: block;
  color: var(--muted);
  font-size: 0.8rem;
  margin-top: 0.12rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.fk-hit-kind {
  font-style: normal;
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--muted);
  white-space: nowrap;
}
.fk-empty { color: var(--muted); margin: 0.4rem 0 0; }

.fav-root { display: block; }

.fk-dash { display: grid; gap: 1.15rem; }
.fk-block { display: grid; gap: 0.7rem; }
.fk-block-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
}
.fk-block-head h2 {
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 800;
}
.fk-block-head .muted { font-size: 0.8rem; }

.fk-call-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5rem;
}
@media (min-width: 560px) {
  .fk-call-grid { grid-template-columns: 1fr 1fr; }
}

.fk-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.fk-text-chip {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0.3rem 0.8rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--card);
  color: var(--brand-deep);
  font-weight: 750;
  font-size: 0.85rem;
  text-decoration: none;
}
.fk-text-chip:hover { border-color: var(--brand); color: var(--brand); }

.fk-tile {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.7rem;
  align-items: center;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 0.7rem 0.85rem;
  color: inherit;
  text-decoration: none;
  min-height: 58px;
}
.fk-tile:hover { border-color: var(--hover-line); }
.fk-tile-ico {
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 10px;
  background: var(--brand-soft);
  color: var(--brand);
  display: grid;
  place-items: center;
  flex: none;
}
.fk-tile-ico svg { width: 1.35rem; height: 1.35rem; }
.fk-tile strong {
  display: block;
  color: var(--brand-deep);
  font-size: 0.98rem;
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.fk-tile span {
  display: block;
  color: var(--muted);
  font-size: 0.82rem;
  margin-top: 0.18rem;
}

.fk-calc-row {
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
  padding: 0.15rem 0 0.35rem;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}
.fk-calc-chip {
  flex: none;
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  min-width: 7.4rem;
  min-height: 64px;
  padding: 0.55rem 0.8rem;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--card);
  color: inherit;
  text-decoration: none;
  box-shadow: var(--fk-shadow);
}
.fk-calc-chip strong { color: var(--brand-deep); font-size: 0.88rem; }
.fk-calc-chip em {
  font-style: normal;
  color: var(--muted);
  font-size: 0.75rem;
  margin-top: 0.15rem;
}

.fk-list {
  list-style: none;
  margin: 0;
  padding: 0;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--fk-radius);
  overflow: hidden;
  box-shadow: var(--fk-shadow);
}
.fk-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.72rem 0.95rem;
  border-bottom: 1px solid var(--line);
}
.fk-list li:last-child { border-bottom: 0; }
.fk-list a {
  color: inherit;
  font-weight: 650;
  text-decoration: none;
}
.fk-list a:hover { color: var(--brand); }
.fk-list .fk-meta { color: var(--muted); font-size: 0.78rem; white-space: nowrap; }
.fk-progress {
  height: 4px;
  background: var(--brand-soft);
  border-radius: 99px;
  overflow: hidden;
  width: 4.5rem;
  flex: none;
}
.fk-job-row { align-items: center; }
.fk-job-sel {
  flex: 1 1 12rem;
  min-height: 44px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--card);
  color: var(--ink);
  font: inherit;
  font-weight: 700;
  padding: 0.35rem 0.65rem;
}
.fk-job-row button.fk-text-chip {
  appearance: none;
  cursor: pointer;
}
.fk-print-lmark {
  display: none;
  width: 56px;
  height: 56px;
  border-radius: 14px;
  place-items: center;
  background: linear-gradient(145deg, #fb4f14, #000);
  color: #fff;
  font-weight: 800;
  font-size: 1.55rem;
}
@media print {
  .fk-print-lmark { display: grid !important; }
}

.fk-progress > i {
  display: block;
  height: 100%;
  background: var(--brand);
}

.fk-empty {
  color: var(--muted);
  font-size: 0.92rem;
  margin: 0;
}

.fk-browse-all {
  appearance: none;
  width: 100%;
  min-height: 48px;
  border-radius: 14px;
  border: 1px dashed var(--line);
  background: var(--empty-bg);
  color: var(--brand-deep);
  font-weight: 800;
  cursor: pointer;
}
.fk-browse-all:hover { border-color: var(--brand); color: var(--brand); }

.home-page .category-grid { gap: 0.7rem; }
.home-page .category-card {
  min-height: 108px;
  padding: 1rem 1.05rem;
  position: relative;
}
.home-page .category-card::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 3px;
  background: linear-gradient(90deg, var(--brand), transparent);
  opacity: 0.85;
}
.home-page .category-card-top {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}
.home-page .category-card-top h3 { flex: 1; margin: 0; }
.fk-cat-ico {
  width: 2rem;
  height: 2rem;
  color: var(--brand);
  margin: 0;
  flex: none;
}
.fk-cat-ico svg { width: 100%; height: 100%; }

.checklist-card-wrap {
  border-left: 3px solid var(--brand);
}
.checklist-card p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.card-star {
  width: 2.4rem !important;
  height: 2.4rem !important;
  min-width: 44px;
  min-height: 44px;
  border-radius: 10px !important;
  font-size: 1.15rem !important;
}

/* ---- Checklist runner ---- */
.item-tip {
  background: var(--warn-bg);
  border: 1px solid var(--warn-line);
  border-left: 3px solid var(--brand);
  color: var(--ink) !important;
  border-radius: 10px;
  padding: 0.55rem 0.7rem;
  margin-top: 0.5rem !important;
  font-size: 0.9rem !important;
  line-height: 1.4;
}
.item-tip::before {
  content: "Field tip";
  display: block;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--brand);
  margin-bottom: 0.2rem;
}
.item-row { cursor: pointer; }
.item-row .item-actions { cursor: default; }
.item-row.status-checked .item-text { text-decoration: line-through; opacity: 0.78; }

.fk-toc {
  display: flex;
  gap: 0.4rem;
  overflow-x: auto;
  padding: 0.1rem 0 0.15rem;
  -webkit-overflow-scrolling: touch;
}
.fk-toc a {
  flex: none;
  min-height: 40px;
  max-width: 14rem;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--card);
  color: var(--brand-deep);
  font-size: 0.8rem;
  font-weight: 750;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fk-toc a:hover, .fk-toc a.is-here { background: var(--brand-soft); border-color: var(--hover-line); }

.fk-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.fk-filters button {
  appearance: none;
  min-height: 40px;
  padding: 0.35rem 0.8rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--btn-bg);
  color: var(--brand-deep);
  font-weight: 750;
  font-size: 0.82rem;
  cursor: pointer;
}
.fk-filters button.is-on {
  background: var(--brand-deep);
  color: var(--on-brand);
  border-color: var(--brand-deep);
}

body.fk-filter-open .item-row.status-checked,
body.fk-filter-open .item-row.status-na { display: none; }
body.fk-filter-open .checklist-section:not(:has(.item-row:not(.status-checked):not(.status-na))) { display: none; }
body.fk-filter-tips .item-row:not(:has(.item-tip)) { display: none; }
body.fk-filter-tips .checklist-section:not(:has(.item-tip)) { display: none; }

.checklist-section { scroll-margin-top: 8.5rem; }
.runner-toolbar { top: calc(4.35rem + env(safe-area-inset-top, 0px)); }

.fk-star-list {
  min-width: 44px;
  white-space: nowrap;
}

/* ---- Calcs ---- */
.refs-page .calc-jump {
  position: sticky;
  top: var(--lw-header-h, 4.35rem);
  z-index: 9;
  flex-wrap: nowrap !important;
  overflow-x: auto;
  background: color-mix(in srgb, var(--paper) 92%, transparent);
  backdrop-filter: blur(10px);
  padding: 0.45rem 0;
  margin: 0;
  scrollbar-width: thin;
  mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 1.75rem), transparent);
}
.refs-page .calc-jump a { flex: 0 0 auto !important; }
@media (min-width: 861px) {
  .refs-page .calc-jump {
    flex-wrap: wrap !important;
    overflow: visible;
    mask-image: none;
  }
}
.refs-page .calc-card,
.refs-page #cheats {
  scroll-margin-top: calc(var(--lw-header-h, 4.6rem) + var(--lw-jump-h, 3.4rem) + 8px);
}
.refs-page {
  padding-bottom: calc(var(--lw-header-h, 5rem) + var(--lw-jump-h, 3.4rem) + 1.5rem);
}
.calc-card {
  border-left: 3px solid var(--brand);
}
.calc-tag { display: none; }

/* ---- Bottom nav ---- */
.fk-tabbar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 40;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  background: #0a0a0af2;
  color: #c4bfba;
  border-top: 3px solid var(--fk-orange);
  padding: 0.25rem 0.2rem calc(0.3rem + env(safe-area-inset-bottom, 0px));
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.fk-tabbar a {
  color: inherit;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.12rem;
  min-height: 48px;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  border-radius: 12px;
}
.fk-tabbar a svg { width: 1.3rem; height: 1.3rem; }
.fk-tabbar a.is-on { color: #fff; }
.fk-tabbar a.is-on svg { color: var(--fk-orange); }

.app-main {
  padding-bottom: calc(5.8rem + env(safe-area-inset-bottom, 0px)) !important;
}
.app-footer { padding-bottom: calc(6.75rem + env(safe-area-inset-bottom, 0px)) !important; }

@media (min-width: 861px) {
  .fk-tabbar { display: none; }
  .app-main { padding-bottom: calc(2.5rem + env(safe-area-inset-bottom, 0px)) !important; }
  .app-footer { padding-bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px)) !important; }
}

body.fk-kb .fk-tabbar { display: none; }

/* ---- Command palette ---- */
.fk-pal-scrim {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: #00000099;
  display: none;
  padding: max(12px, env(safe-area-inset-top)) 12px 12px;
}
.fk-pal-scrim.is-open { display: grid; align-items: start; justify-items: center; }
.fk-pal {
  width: min(640px, 100%);
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: 0 24px 64px #00000055;
  overflow: hidden;
  margin-top: 8vh;
}
.fk-pal-input {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink);
  font: inherit;
  font-size: 1.05rem;
  font-weight: 650;
  min-height: 56px;
  padding: 0.9rem 1rem;
  outline: none;
}
.fk-pal-list {
  max-height: min(60vh, 420px);
  overflow: auto;
  padding: 0.4rem;
}
.fk-pal-group {
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  padding: 0.55rem 0.7rem 0.25rem;
}
.fk-pal-item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.7rem;
  align-items: start;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: inherit;
  border-radius: 12px;
  padding: 0.65rem 0.7rem;
  cursor: pointer;
  font: inherit;
}
.fk-pal-item:hover, .fk-pal-item.is-active { background: var(--brand-soft); }
.fk-pal-item strong { display: block; color: var(--brand-deep); font-size: 0.95rem; }
.fk-pal-item span { display: block; color: var(--muted); font-size: 0.8rem; margin-top: 0.12rem; }
.fk-pal-item > span:last-child span {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.fk-pal-kind {
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--brand);
  background: var(--brand-soft);
  border-radius: 8px;
  padding: 0.28rem 0.45rem;
  min-width: 4.6rem;
  text-align: center;
}
.fk-pal-empty { color: var(--muted); padding: 1.2rem 0.8rem; text-align: center; }
.fk-pal-hint {
  color: var(--muted);
  font-size: 0.75rem;
  padding: 0.45rem 0.9rem 0.7rem;
  border-top: 1px solid var(--line);
}

/* ---- Job sheets sit under the app header ---- */
.js-root {
  width: min(960px, 100%);
  margin: 0 auto;
  padding: 1rem 1rem calc(5.8rem + env(safe-area-inset-bottom, 0px));
}
body.fk-jobsheets #root,
body.fk-jobsheets .app-shell {
  min-height: 0 !important;
  height: auto !important;
}
body.fk-jobsheets .app-main {
  display: none !important;
  flex: none !important;
}
body.fk-jobsheets .app-footer,
body.fk-jobsheets .disclaimer-banner { display: none !important; }
.js-pick-item,
.js-jobcard,
.js-empty {
  border-left: 3px solid var(--brand);
}
a.js-pick-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.28rem;
}
.js-pick-title { display: block; }
.card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--fk-radius);
  box-shadow: var(--fk-shadow);
}

/* ---- Misc polish ---- */
.page-header, .checklist-section, .calc-card, .category-card {
  box-shadow: var(--fk-shadow);
}
h1 { letter-spacing: -0.03em; }
.pill, .count-badge {
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 0.68rem !important;
}

@media print {
  .fk-tabbar, .fk-pal-scrim, .fk-search-btn, .fk-dash, .fk-toc, .fk-filters, .fk-star-list, .fav-root {
    display: none !important;
  }
  .app-main { padding-bottom: 0 !important; }
  .item-tip::before { color: #9b2c2c; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .fk-tile, .checklist-card-wrap, .category-card { transition: none; }
}

/* runner sticky sits above fk-tabbar on phone */
@media (max-width: 860px) {
  .runner-sticky-bar {
    bottom: calc(var(--fk-nav-h, 4.35rem) + env(safe-area-inset-bottom, 0px)) !important;
    padding-bottom: 0.55rem !important;
  }
  .checklist-runner,
  .page.checklist-runner {
    padding-bottom: calc(11.5rem + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* ===== Round 2 (2026-10-07) ===== */
/* 7: desktop nav contrast. Bundle CSS loads later and sets .main-nav a{color:var(--muted)} (#2f2b27 on the black header, ~1.4:1). */
.app-header .main-nav a:not(.active) { color: #d4cfc9; }
.app-header .main-nav a:not(.active):hover { color: #fff; }

/* 5: tip prints once. The "Field tip" heading stays; the bundle's "Tip" pill is kept for screen readers only. */
.item-tip .item-tip-label {
  position: absolute !important;
  width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.item-tip::before { content: "Field tip" / ""; }
@media print {
  .item-tip::before { content: "Tip"; }
}

/* 1: Job sheet button in the scroll-away toolbar row */
.runner-extras .runner-jobsheet {
  min-height: 44px;
  white-space: nowrap;
  border-color: var(--brand, #fb4f14);
  font-weight: 800;
}

/* 5: "what decides the call" strip on long packs */
details.fk-decides {
  border: 1px solid var(--line, #d9d0c7);
  border-left: 4px solid var(--brand, #fb4f14);
  border-radius: 10px;
  background: var(--card, #fff);
  margin: 0.4rem 0 0.9rem;
  padding: 0 0.8rem;
}
details.fk-decides > summary {
  min-height: 44px;
  display: flex;
  align-items: center;
  cursor: pointer;
  font-weight: 800;
  font-size: 0.95rem;
  list-style: none;
}
details.fk-decides > summary::-webkit-details-marker { display: none; }
details.fk-decides > summary::after { content: "Show \25BE"; margin-left: auto; font-size: 0.82rem; color: var(--brand-deep, #c4320a); }
details.fk-decides[open] > summary::after { content: "Hide \25B4"; }
details.fk-decides ul { margin: 0 0 0.7rem; padding-left: 1.15rem; }
details.fk-decides li { margin: 0.25rem 0; line-height: 1.4; }
@media print {
  details.fk-decides { break-inside: avoid; border-left-width: 2px; }
  details.fk-decides > summary::after { content: none; }
}

/* 8c: phones put Done / N/A right under the step text; the tip follows */
@media (max-width: 640px) {
  .checklist-runner .item-body { display: flex; flex-direction: column; }
  .checklist-runner .item-body .item-text { order: 1; }
  .checklist-runner .item-body .item-actions { order: 2; }
  .checklist-runner .item-body .item-tip { order: 3; }
}

/* 8b: the clamped lede ("… More ▾") gets a 44px tap box without moving anything */
@media (max-width: 640px) {
  .checklist-runner .page-header .lede.fk-clamp {
    border-top: 14px solid transparent;
    border-bottom: 8px solid transparent;
    margin-top: -8.4px;   /* original 0.35rem (5.6px) minus the 14px border */
    margin-bottom: -8px; /* original 0 minus the 8px border (box ends where the notice starts: 14 + 23 + 8 = 45px tap box) */
    background-clip: padding-box;
  }
}

/* 1: job panel on /jobsheets; slim job line on pack / paper / hardware pages */
.js-jobpanel { margin-bottom: 1rem; }
.js-jobpanel-title { margin: 0 0 0.5rem; font-size: 1.05rem; }
.js-jobpanel-row { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.js-jobpanel-row .js-job-sel { flex: 1 1 12rem; min-height: 44px; }
.js-jobpanel-row .btn { min-height: 44px; }
.js-jobpanel-links { display: flex; flex-wrap: wrap; gap: 0.45rem; margin: 0.7rem 0 0.3rem; }
.js-jobpanel-links .js-joblink { min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; }
.js-job-hint { margin: 0.4rem 0 0.2rem; }
.gd-jobline { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.gd-jobline .gd-chip { min-height: 44px; display: inline-flex; align-items: center; }
.gd-showall { min-height: 44px; }
.gd-trade-chips { margin: 0.2rem 0 0.8rem; }
.gd-trade-chips .gd-chip { min-height: 44px; display: inline-flex; align-items: center; }
.gd-trade-docs { margin: 1rem 0; }
.gd-trade-docs .gd-chip { min-height: 44px; display: inline-flex; align-items: center; }

/* 8c: first screen at 360x780 — decides strip folds into a chip, STRONG NOTICE previews 2 lines (tap "More"), tighter rhythm */
.fk-decides-chip { min-height: 44px; white-space: nowrap; }
.fk-decides-chip.is-on { border-color: var(--brand, #fb4f14); }
@media (min-width: 641px) { .runner-extras .fk-decides-chip { display: none; } }
@media (max-width: 640px) {
  .checklist-runner details.fk-decides:not([open]) { display: none; }
  .checklist-runner .page-header .inline-disclaimer.fk-clamp:not(.is-open) { -webkit-line-clamp: 2; }
  .page.checklist-runner { row-gap: 4px !important; }
  .checklist-runner .page-header { padding-top: 8px !important; padding-bottom: 4px !important; }
  .checklist-runner .page-header .inline-disclaimer { margin-bottom: 4px !important; }
  .checklist-runner .checklist-section { padding-top: 2px !important; }
  .checklist-runner .item-list { margin-top: 2px !important; }
  .checklist-runner .item-row { padding-top: 10px !important; padding-bottom: 10px !important; }
  .checklist-runner .item-row .item-actions { margin-top: 6px !important; }
}

/* Desktop: long section-chip rows no longer widen the checklist grid past the viewport (pre-existing overflow on long packs) */
.page.checklist-runner > * { min-width: 0; }

/* Field header stays a tool. Plan choice lives on Company. */
.app-header .plan-switch { display: none !important; }

.plan-toggle-row { position: relative; z-index: 2; }
.portal-page { scroll-padding-bottom: calc(6.5rem + env(safe-area-inset-bottom, 0px)); }

body.fk-miss-on #root { display: none !important; }
.fk-miss { padding: 1.35rem 0.15rem 2rem; }
.fk-miss h1 { margin: 0 0 0.85rem; font-size: 1.45rem; line-height: 1.25; }
.fk-miss-links { display: flex; flex-wrap: wrap; gap: 0.55rem; margin: 0; }
.fk-miss-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0.3rem 0.9rem;
  border-radius: 999px;
  border: 1px solid var(--line, #cfc6bc);
  background: var(--card, #fff);
  color: inherit;
  font-weight: 800;
  text-decoration: none;
}

/* Checklist: primary actions wrap on their own row. Filters, calcs, and section jumps wrap under them. */
.checklist-runner .runner-extras {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  overflow: visible;
}
.checklist-runner .runner-extras > .fk-row-actions,
.checklist-runner .runner-extras > .fk-row-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  flex: 1 1 100%;
  min-width: 0;
}
.checklist-runner .fk-row-tools .fk-toc {
  display: flex;
  flex: 1 1 100%;
  min-width: 0;
  overflow-x: auto;
  padding-bottom: 0.15rem;
}
.checklist-runner .fk-row-tools .fk-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.checklist-runner .runner-extras > .fk-row-lead {
  flex: 1 1 100%;
  min-width: 0;
}
.checklist-runner .fk-how {
  margin: 0;
  color: var(--ink, #1a100c);
  font-size: 0.98rem;
  font-weight: 650;
  line-height: 1.35;
}
.checklist-runner .related-calcs { order: 2; }

@media (min-width: 861px) {
  .page.checklist-runner { gap: 0.55rem; }
  .checklist-runner .runner-extras > .fk-row-actions,
  .checklist-runner .runner-extras > .fk-row-tools {
    flex: 0 1 auto;
  }
}

@media (max-width: 860px) {
  .checklist-runner .runner-extras .pro-badge { display: none; }
  /* Three labeled controls wrap. Section jumps stay one sideways row. */
  .checklist-runner .runner-extras > .fk-row-tools {
    flex-wrap: wrap;
    overflow: visible;
    padding-bottom: 0.15rem;
  }
  .checklist-runner .runner-extras > .fk-row-tools::-webkit-scrollbar { height: 6px; }
  .checklist-runner .runner-extras > .fk-row-tools::-webkit-scrollbar-thumb {
    background: var(--brand, #fb4f14);
    border-radius: 999px;
  }
  .checklist-runner .runner-extras > .fk-row-tools > .fk-toc,
  .checklist-runner .runner-extras > .fk-row-tools > .fk-calc-clone,
  .checklist-runner .runner-extras > .fk-row-tools > .related-calc-chip {
    flex: 0 0 auto;
    flex-wrap: nowrap;
    overflow: visible;
    width: auto;
    max-width: none;
  }
  .checklist-runner .runner-extras > .fk-row-tools > .fk-filters {
    flex: 1 1 100%;
    flex-wrap: wrap;
    max-width: 100%;
  }
  details.fk-decides { margin: 0.2rem 0 0.35rem; }
  details.fk-decides li { margin: 0.08rem 0; }
  .fk-decides-more { margin: 0.1rem 0 0.35rem; }
}

/* Phone: the decision strip stays three lines until the tech asks for the rest. */
.fk-decides-more {
  min-height: 44px;
  margin: 0 0 0.7rem;
  padding: 0.35rem 0.9rem;
  border-radius: 999px;
  border: 1px solid var(--line, #d9d0c7);
  background: var(--card, #fff);
  color: var(--brand-deep, #c4320a);
  font-weight: 800;
  cursor: pointer;
}
@media (min-width: 641px) { .fk-decides-more { display: none; } }
@media (max-width: 640px) {
  details.fk-decides:not(.is-full) li:nth-child(n + 4) { display: none; }
  /* The chip already names this strip. Hiding the summary keeps the Gate on the phone screen. */
  .checklist-runner details.fk-decides[open] > summary { display: none; }
  .checklist-runner details.fk-decides[open] { margin: 0.1rem 0 0.2rem; padding-top: 0.3rem; }
  .checklist-runner details.fk-decides[open] ul { margin: 0 0 0.15rem; }
}
@media print {
  details.fk-decides > summary { display: flex !important; }
  details.fk-decides li { display: list-item !important; }
  .fk-decides-more { display: none !important; }
}

/* Phone home: keep Job sheets and Open pack above the tab bar. */
@media (max-width: 860px) {
  .start-page.has-dash { padding-top: 0.35rem; }
  .start-page h1 { margin-bottom: 0.6rem; }
  .start-page #start-root { margin-top: 0.5rem; }
  .start-page .fk-dash { gap: 0.65rem; }
  .start-page .fk-block { gap: 0.35rem; }
  .start-page .fk-job-row { scroll-margin-bottom: 5.5rem; }
  .start-page.fk-home-tight h1 { margin-bottom: 0.35rem; }
  .start-page.fk-home-tight .fk-dash { gap: 0.4rem; }
  .start-page.fk-home-tight #start-root { margin-top: 0.3rem; }
}

/* Round 4: readable clamps, a decides sheet, separate section row, contrast, and room above the tab bar. */
.start-page .fk-home-card {
  background: var(--card, #fff);
  border: 1px solid var(--line, #d9d0c7);
  border-radius: 14px;
  padding: 0.75rem 0.85rem 0.85rem;
}
.start-page .fk-dash { gap: 0.75rem; }
.fk-quiet-note { display: none !important; }
.refs-page p.calc-note.warn {
  color: var(--muted, #6b6258) !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-weight: 450 !important;
  padding: 0 !important;
}
.refs-page .result-stack p.calc-note.warn {
  color: var(--warn-text, #6a4b00) !important;
  background: var(--warn-bg, #fff7e8) !important;
  border: 1px solid var(--warn-line, #f0d9a0) !important;
  border-left: 4px solid var(--warn, #8a5a00) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  font-weight: 650 !important;
  padding: 0.65rem 0.75rem !important;
}
.refs-page .result-stack p.fk-hot,
.refs-page .result-stack p.fk-fillwarn,
.refs-page .result-stack p.fk-filllegs,
.refs-page .result-stack p.fk-bite {
  margin: 0.7rem 0 0;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--warn-line, #f0d9a0);
  border-radius: 10px;
  background: var(--warn-bg, #fff7e8);
  color: var(--warn-text, #6a4b00);
  line-height: 1.4;
}
.checklist-runner .pro-badge { display: none !important; }
.checklist-runner .reset-quiet {
  color: var(--ink, #1a100c);
  background: var(--card, #fff);
  border-color: var(--line, #d9d0c7);
  font-weight: 750;
}

.checklist-runner .page-header .fk-clamp:not(.is-open)::after,
.checklist-runner .inline-disclaimer.fk-clamp:not(.is-open)::after {
  content: none !important;
  display: none !important;
}
.fk-more {
  display: flex;
  align-items: center;
  width: fit-content;
  min-height: 44px;
  margin: 0.7rem 0 0.15rem;
  padding: 0 0.2rem;
  border: 0;
  background: transparent;
  color: var(--brand-deep, #c4320a);
  font-weight: 800;
  cursor: pointer;
  position: static;
}

.checklist-runner .runner-extras > .fk-row-sections {
  display: flex;
  flex: 1 1 100%;
  min-width: 0;
  overflow: visible;
}
.checklist-runner .fk-row-sections .fk-toc {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: nowrap;
  gap: 0.4rem;
  min-width: 0;
  overflow-x: auto;
  padding-bottom: 0.35rem;
  scrollbar-width: thin;
}
@media (max-width: 860px) {
  .checklist-runner .fk-row-sections .fk-toc {
    mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 1.75rem), transparent);
  }
  body:has(.checklist-runner) .app-header {
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.7rem;
  }
  body:has(.checklist-runner) .brand-text span,
  body:has(.checklist-runner) .brand-by,
  body:has(.checklist-runner) .brand-product { display: none !important; }
  body:has(.checklist-runner .inline-disclaimer) .disclaimer-banner { display: none !important; }
  body:has(.start-page) .fk-search-btn { display: none !important; }
  .app-main { padding-bottom: calc(7.4rem + env(safe-area-inset-bottom, 0px)) !important; }
  .gd-root, .js-root { padding-bottom: calc(6.8rem + env(safe-area-inset-bottom, 0px)); }
  .start-page .fk-home-card {
    background: var(--card, #fff);
    border: 1px solid var(--line, #d9d0c7);
    border-radius: 14px;
    padding: 0.7rem 0.75rem 0.8rem;
  }
  .start-page .fk-dash { gap: 0.7rem; }
}

.fk-decides-scrim { display: none; }
@media (max-width: 640px) {
  body:has(details.fk-decides[open]) .fk-decides-scrim {
    display: block;
    position: fixed;
    inset: 0;
    background: rgba(10, 10, 10, 0.45);
    z-index: 25;
  }
  .checklist-runner details.fk-decides[open] {
    position: fixed;
    left: 0.6rem;
    right: 0.6rem;
    bottom: calc(4.7rem + env(safe-area-inset-bottom, 0px));
    z-index: 30;
    max-height: min(52vh, 22rem);
    overflow: auto;
    margin: 0;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
  }
}
@media print {
  .fk-decides-scrim { display: none !important; }
  details.fk-decides { position: static !important; max-height: none !important; overflow: visible !important; }
  .fk-more { display: none !important; }
}

@media (prefers-color-scheme: dark) {
  .main-nav a.active,
  a.gd-chip.is-on,
  .gd-chip.is-on,
  .chip.active,
  .preset-chip.active,
  .seg-btn.active {
    background: #fb4f14 !important;
    color: #1a100c !important;
    border-color: #c43a0a !important;
  }
  .checklist-runner .page-header h1,
  .refs-page .page-header h1,
  .gd-hero h1,
  .js-page h1,
  .page-header h1 {
    color: var(--ink, #fafafa);
  }
}

/* Fire lists that already have the decision block open on those lines. */
.fk-meter-first {
  margin: 0 0 0.35rem;
  color: var(--ink, #1a100c);
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.4;
}
.fk-meter-first a { color: var(--brand-deep, #c4320a); font-weight: 800; }
.fk-rest-call {
  min-height: 44px;
  margin: 0.15rem 0 0.85rem;
  padding: 0.4rem 0.95rem;
  border-radius: 999px;
  border: 1px solid var(--line, #d9d0c7);
  background: var(--card, #fff);
  color: var(--brand-deep, #c4320a);
  font-weight: 800;
  cursor: pointer;
}
.checklist-runner.fk-fire-fold:not(.fk-fire-open) > .checklist-section { display: none; }
@media (max-width: 640px) {
  .checklist-runner.fk-fire-fold .fk-decides-chip { display: none !important; }
  .checklist-runner.fk-fire-fold .fk-decides-more { display: none !important; }
  .checklist-runner.fk-fire-fold details.fk-decides,
  .checklist-runner.fk-fire-fold details.fk-decides[open] {
    display: block;
    position: static;
    left: auto;
    right: auto;
    bottom: auto;
    z-index: auto;
    max-height: none;
    overflow: visible;
    margin: 0.35rem 0 0.45rem;
    box-shadow: none;
  }
  .checklist-runner.fk-fire-fold details.fk-decides[open] > summary { display: flex; }
  .checklist-runner.fk-fire-fold details.fk-decides li { display: list-item; }
  body:has(.checklist-runner.fk-fire-fold) .fk-decides-scrim { display: none !important; }
}
@media print {
  .checklist-runner.fk-fire-fold > .checklist-section { display: block !important; }
  .fk-rest-call, .fk-meter-first { display: none !important; }
}