/* =========================================================
   CoordOS — design tokens & primitives
   ========================================================= */

:root {
  /* canvas / surfaces */
  --canvas:        #F6F2EA;
  --paper:         #FBFAF6;
  --paper-2:       #EEE8DB;
  --white:         #FFFFFF;
  --rail:          #121417;
  --rail-2:        #1A1D21;
  --rail-3:        #252930;

  /* ink */
  --ink:           #1B1F2A;
  --ink-2:         #45423A;
  --ink-3:         #736C5E;
  --ink-4:         #9B9384;
  --ink-on-rail:   #FBF8F2;
  --ink-on-rail-2: #8B93A8;
  --ink-on-rail-3: #5B6276;

  /* borders */
  --line:          #E5DECF;
  --line-2:        #D8CFB8;
  --line-3:        #C2B89F;
  --line-rail:     #2A3041;

  /* accents */
  --green:         #52654C;
  --green-2:       #5D6F54;
  --green-soft:    #E5E9DC;
  --amber:         #8F6E33;
  --amber-2:       #A77C35;
  --amber-soft:    #EFE5D0;
  --rust:          #7B4B38;
  --rust-soft:     #E9DCD4;
  --navy:          #34414F;
  --navy-soft:     #E0E5EA;

  /* shadows — paperlike, low */
  --shadow-1: 0 1px 0 rgba(27,31,42,.04), 0 1px 2px rgba(27,31,42,.04);
  --shadow-2: 0 1px 0 rgba(27,31,42,.04), 0 6px 18px -8px rgba(27,31,42,.18);
  --shadow-3: 0 2px 0 rgba(27,31,42,.05), 0 24px 50px -22px rgba(27,31,42,.28);
  --shadow-inset: inset 0 0 0 1px var(--line);

  /* radii */
  --r-1: 4px;
  --r-2: 8px;
  --r-3: 12px;
  --r-4: 16px;

  /* fonts */
  --f-sans: "Geist", "Söhne", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
  --f-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --f-serif: "Geist", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--f-sans);
  font-size: 14px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

button { font-family: inherit; cursor: pointer; }

/* utility */
.mono { font-family: var(--f-mono); font-feature-settings: "tnum" 1, "ss01" 1; }
.serif { font-family: var(--f-serif); }
.tnum { font-variant-numeric: tabular-nums; }

/* ------------- stage / layout ------------- */
.stage {
  width: 100%;
  max-width: none;
  min-height: 100vh;
  margin: 0;
  background: var(--canvas);
  display: grid;
  grid-template-columns: 232px 1fr;
  grid-template-rows: 1fr;
}

/* ------------- left rail (department directory) ------------- */
.rail {
  grid-row: 1 / 4;
  background: var(--rail);
  color: var(--ink-on-rail);
  padding: 22px 0 18px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  border-right: 1px solid #0F121A;
}

.rail-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 22px 18px;
  border-bottom: 1px solid var(--line-rail);
}
.rail-brand .mark { width: 36px; height: 36px; }
.rail-brand .wordmark {
  font-family: var(--f-sans);
  font-weight: 600;
  font-size: 17px;
  letter-spacing: 0.01em;
}
.rail-brand .sub {
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-on-rail-2);
  margin-top: 2px;
}

.rail-section-label {
  font-family: var(--f-sans);
  font-size: 11px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink-on-rail-2);
  padding: 0 22px 4px;
}

.rail-list { display: flex; flex-direction: column; gap: 1px; padding: 0 12px; }

.rail-item {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 13.5px;
  letter-spacing: -0.005em;
  color: #C2C8D6;
  border: 0;
  background: transparent;
  text-align: left;
  width: 100%;
  position: relative;
  transition: background 120ms ease, color 120ms ease;
  white-space: nowrap;
}
.rail-item:hover { background: var(--rail-2); color: var(--ink-on-rail); }
.rail-item.is-active {
  background: var(--rail-2);
  color: var(--ink-on-rail);
}
.rail-item.is-active::before {
  content: "";
  position: absolute;
  left: -12px;
  top: 8px; bottom: 8px;
  width: 2px;
  background: var(--amber-2);
  border-radius: 0 2px 2px 0;
}
.rail-item .icon { width: 16px; height: 16px; opacity: .8; flex: 0 0 auto; }
.rail-item .count {
  margin-left: auto;
  font-family: var(--f-mono);
  font-size: 10.5px;
  color: var(--ink-on-rail-2);
  background: var(--rail-3);
  padding: 1px 6px;
  border-radius: 999px;
}
.rail-item.is-active .count { color: var(--ink-on-rail); background: #3A4258; }
.rail-item .dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--green-2);
  box-shadow: 0 0 0 3px rgba(94,128,73,.18);
  margin-left: auto;
}

.rail-foot {
  margin-top: auto;
  padding: 16px 22px 4px;
  border-top: 1px solid var(--line-rail);
  display: flex;
  align-items: center;
  gap: 10px;
}
.rail-foot .avatar {
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--amber-soft);
  border: 1px solid rgba(251,248,242,.16);
  display: grid; place-items: center;
  font-family: var(--f-mono);
  font-size: 11px;
  color: #1B1F2A;
  font-weight: 600;
}
.rail-foot .who { font-size: 12.5px; color: var(--ink-on-rail); }
.rail-foot .who small {
  display: block;
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-on-rail-3);
  margin-top: 1px;
}

/* ------------- top bar ------------- */
.topbar {
  grid-column: 2 / 3;
  height: 56px;
  padding: 0 28px;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: 16px;
  white-space: nowrap;
}
.topbar .crumbs {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--f-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
  white-space: nowrap;
}
.topbar .crumbs strong { color: var(--ink); font-weight: 500; }
.topbar .crumbs .sep { color: var(--line-3); }
.topbar .now {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  color: var(--ink-3);
}
.topbar .now b { color: var(--ink); font-weight: 500; }
.topbar .now .pulse {
  display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: var(--green-2); margin-right: 6px;
  box-shadow: 0 0 0 3px rgba(94,128,73,.18);
  animation: pulse 2.6s ease-in-out infinite;
}
@keyframes pulse {
  0%,100% { box-shadow: 0 0 0 3px rgba(94,128,73,.18); }
  50%     { box-shadow: 0 0 0 6px rgba(94,128,73,.05); }
}
.topbar .spacer { flex: 1; }
.topbar .search {
  width: 240px;
  height: 32px;
  border-radius: 6px;
  border: 1px solid var(--line);
  background: var(--white);
  padding: 0 10px 0 30px;
  font: inherit; font-size: 12.5px; color: var(--ink-2);
  position: relative;
}
.topbar .search-wrap { position: relative; }
.topbar .search-wrap svg { position: absolute; left: 9px; top: 50%; transform: translateY(-50%); width: 14px; height: 14px; color: var(--ink-3); }
.topbar .icon-btn {
  width: 32px; height: 32px;
  display: grid; place-items: center;
  border-radius: 6px;
  border: 1px solid var(--line);
  background: var(--white);
  color: var(--ink-2);
}
.topbar .icon-btn:hover { background: var(--paper-2); }

/* ------------- main ------------- */
.main {
  grid-column: 2 / 3;
  grid-row: 1 / 2;
  padding: 28px 32px 40px;
  background: var(--canvas);
  position: relative;
  overflow: hidden;
}

.screen { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 24px; }

/* ------------- common headings ------------- */
.screen-eyebrow {
  font-family: var(--f-sans);
  font-size: 11.5px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink-3);
  line-height: 1.4;
}
.screen-title {
  font-family: var(--f-sans);
  font-size: 28px;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0;
  line-height: 1.15;
}
.screen-sub {
  color: var(--ink-2);
  font-size: 13.5px;
  margin: 4px 0 0;
}

/* ------------- card primitives ------------- */
.card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-3);
  box-shadow: none;
}
.card.elev { background: var(--white); box-shadow: var(--shadow-2); }
.card.flush { padding: 0; }
.card.pad   { padding: 20px; }
.card-head {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 18px 20px 14px;
  border-bottom: 0;
}
.card-head h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.005em;
  line-height: 1.3;
  color: var(--ink);
}
.card-head .eyebrow {
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-4);
  line-height: 1.3;
  display: block;
  margin-bottom: 4px;
}
.card-head .heading-stack { flex: 1; min-width: 0; }
.card-head .right { margin-left: auto; flex: 0 0 auto; }

/* pill / badge — soft, mostly borderless */
.pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--f-sans);
  font-size: 11.5px;
  letter-spacing: 0;
  text-transform: none;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--ink-3);
  white-space: nowrap;
  font-weight: 500;
}
.pill .pip { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.pill.green { color: var(--green); }
.pill.amber { color: var(--amber); }
.pill.rust  { color: var(--rust); }
.pill.navy  { color: var(--navy); }
.pill.ink   { color: var(--paper); background: var(--ink); }
.pill.solid-green { color: var(--green); background: var(--green-soft); }
.pill.solid-amber { color: var(--amber); background: var(--amber-soft); }
.pill.solid-rust  { color: var(--rust);  background: var(--rust-soft);  }
.pill.ghost { background: var(--paper-2); color: var(--ink-3); }

/* buttons */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  height: 32px;
  padding: 0 12px;
  border-radius: 7px;
  border: 1px solid var(--line-2);
  background: var(--white);
  color: var(--ink);
  font-size: 12.5px;
  font-weight: 500;
  letter-spacing: -0.005em;
  white-space: nowrap;
  box-shadow: var(--shadow-1);
  transition: transform 80ms ease, background 120ms ease, border-color 120ms ease;
}
.btn:hover { background: var(--paper-2); }
.btn:active { transform: translateY(1px); }
.btn .kbd {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  color: var(--ink-3);
  border: 1px solid var(--line);
  padding: 0 4px;
  border-radius: 3px;
  background: var(--paper);
}
.btn.primary {
  background: var(--ink);
  color: var(--paper);
  border-color: var(--ink);
}
.btn.primary:hover { background: #2A3041; }
.btn.green {
  background: var(--green);
  color: #FBF8F2;
  border-color: #3F5732;
}
.btn.green:hover { background: var(--green-2); }
.btn.amber {
  background: var(--amber);
  color: #FBF8F2;
  border-color: #946317;
}
.btn.ghost {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  color: var(--ink-2);
}
.btn.ghost:hover { background: var(--paper-2); }
.btn.sm { height: 26px; padding: 0 9px; font-size: 11.5px; border-radius: 5px; }
.btn.lg { height: 38px; padding: 0 16px; font-size: 13.5px; }
.btn.block { width: 100%; justify-content: center; }
.btn.danger { color: var(--rust); border-color: #DDB6A8; }

/* ------------- agent chip ------------- */
.agent-chip {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 4px 10px 4px 4px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 12px;
  color: var(--ink-2);
}
.agent-chip .avatar {
  width: 22px; height: 22px;
  border-radius: 50%;
  display: grid; place-items: center;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--f-mono);
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
}
.agent-chip.green .avatar { background: var(--green); }
.agent-chip.amber .avatar { background: var(--amber); }
.agent-chip.navy  .avatar { background: var(--navy); }
.agent-chip.rust  .avatar { background: var(--rust); }
.agent-chip .dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--green-2);
  box-shadow: 0 0 0 3px rgba(94,128,73,.18);
}
.agent-chip.idle .dot { background: var(--ink-4); box-shadow: none; }

/* ------------- evidence tile ------------- */
.evidence {
  display: flex;
  gap: 10px;
  padding: 10px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
}
.evidence .thumb {
  width: 44px; height: 44px;
  border-radius: 6px;
  background: var(--paper-2);
  border: 1px solid var(--line);
  display: grid; place-items: center;
  color: var(--ink-3);
  flex: 0 0 auto;
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
}
.evidence .title { font-size: 12.5px; color: var(--ink); font-weight: 500; }
.evidence .meta {
  font-family: var(--f-mono);
  font-size: 10.5px;
  color: var(--ink-3);
  letter-spacing: 0.04em;
  margin-top: 2px;
  display: flex; gap: 8px; flex-wrap: wrap;
}

/* ------------- key/value table ------------- */
.kv {
  display: grid;
  grid-template-columns: 130px 1fr;
  border-top: 1px solid var(--line);
}
.kv > div {
  padding: 9px 14px;
  border-bottom: 1px solid var(--line);
  font-size: 12.5px;
}
.kv > div:nth-child(odd) {
  font-family: var(--f-mono);
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-3);
  background: var(--paper-2);
}
.kv > div:nth-child(even) { color: var(--ink); background: var(--paper); }

/* ------------- receipt ledger row ------------- */
.ledger-row {
  display: grid;
  grid-template-columns: 110px 1fr 220px 150px 80px;
  align-items: center;
  gap: 18px;
  padding: 14px 20px;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
  background: var(--paper);
}
.ledger-row:hover { background: var(--paper-2); }
.ledger-row:last-child { border-bottom: 0; }
.ledger-row.head {
  background: transparent;
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-4);
  padding-top: 6px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line-2);
}
.ledger-row .ts { font-family: var(--f-mono); font-size: 11px; color: var(--ink-3); }
.ledger-row .ev { color: var(--ink); }
.ledger-row .ev small { display: block; color: var(--ink-3); font-size: 11.5px; margin-top: 2px; }

/* ------------- divider ------------- */
.hr-soft { height: 1px; background: var(--line); border: 0; margin: 0; }
.hr-dashed { height: 0; border: 0; border-top: 1px dashed var(--line-2); margin: 0; }

/* ------------- screen-specific layouts -------------- */
.grid-3-1 { display: grid; grid-template-columns: 1fr 340px; gap: 24px; align-items: start; }
.grid-2   { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.grid-3   { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }
.grid-4   { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 14px; }

.row { display: flex; gap: 12px; align-items: center; }
.col { display: flex; flex-direction: column; gap: 12px; }
.between { display: flex; align-items: center; justify-content: space-between; }
.muted { color: var(--ink-3); }
.muted-2 { color: var(--ink-4); }

/* annotation note that looks like a stamp */
.stamp {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 4px 10px;
  border: 1.5px solid currentColor;
  border-radius: 4px;
  color: var(--green);
  transform: rotate(-1.2deg);
  background: rgba(255,255,255,.4);
}
.stamp.amber { color: var(--amber); }
.stamp.rust  { color: var(--rust); }

/* checkbox bullet (decision tick) */
.tickbox {
  width: 18px; height: 18px;
  border-radius: 4px;
  border: 1.5px solid var(--line-3);
  background: var(--white);
  display: grid; place-items: center;
  flex: 0 0 auto;
}
.tickbox.checked {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}

/* tag chip — small, quiet */
.tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--f-sans);
  font-size: 11px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink-3);
  background: transparent;
  padding: 1px 0;
  border-radius: 4px;
  border: 0;
}

/* confidence meter */
.meter {
  width: 60px; height: 4px;
  border-radius: 2px;
  background: var(--line);
  overflow: hidden;
  position: relative;
}
.meter > span {
  display: block;
  height: 100%;
  background: var(--green-2);
}
.meter.amber > span { background: var(--amber-2); }
.meter.rust > span { background: var(--rust); }

/* photo thumb grid */
.photo {
  aspect-ratio: 4 / 3;
  border-radius: 6px;
  background: var(--paper-2);
  border: 1px solid var(--line);
  position: relative;
  overflow: hidden;
  display: grid; place-items: center;
  color: var(--ink-3);
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
}
.photo .tag-bl {
  position: absolute; bottom: 6px; left: 6px;
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.06em;
  background: rgba(27,31,42,.78);
  color: var(--paper);
  padding: 2px 6px;
  border-radius: 3px;
}

/* construction-photo style fills (no real images — use gradient stand-ins
   that read as site materials: wood, concrete, sky, dirt) */
.ph-wood    { background: linear-gradient(135deg, #B07A3B 0%, #8A5A24 40%, #C5894A 100%); color: rgba(255,255,255,.6); }
.ph-concrete{ background: linear-gradient(135deg, #C9C2B5 0%, #9A9282 50%, #B4AB99 100%); color: rgba(27,31,42,.45); }
.ph-sky     { background: linear-gradient(180deg, #A9BBC9 0%, #7C92A6 70%, #5E7588 100%); color: rgba(255,255,255,.65); }
.ph-dirt    { background: linear-gradient(135deg, #8D6E4B 0%, #5E4528 60%, #75583A 100%); color: rgba(255,255,255,.6); }
.ph-roof    { background: linear-gradient(170deg, #6B5544 0%, #4A3A2C 50%, #5A4636 100%); color: rgba(255,255,255,.5); }
.ph-drywall { background: linear-gradient(135deg, #E8E2D5 0%, #C9C0AB 50%, #DDD3BF 100%); color: rgba(27,31,42,.4); }

/* timeline rail (for receipts / sessions) */
.tline { position: relative; padding-left: 18px; }
.tline::before {
  content: ""; position: absolute; left: 5px; top: 4px; bottom: 4px;
  width: 1px; background: var(--line-2);
}
.tline-item { position: relative; padding: 6px 0; }
.tline-item::before {
  content: ""; position: absolute; left: -16px; top: 11px;
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--paper); border: 1.5px solid var(--ink-3);
}
.tline-item.green::before { border-color: var(--green); background: var(--green-soft); }
.tline-item.amber::before { border-color: var(--amber); background: var(--amber-soft); }
.tline-item.rust::before  { border-color: var(--rust);  background: var(--rust-soft); }

/* whatsapp-like bubble */
.wa-bubble {
  background: var(--white);
  border-radius: 10px;
  padding: 9px 12px;
  font-size: 13px;
  color: var(--ink);
  max-width: 88%;
  box-shadow: var(--shadow-1);
  position: relative;
}
.wa-bubble.them { background: #E7EBDC; }
.wa-bubble .who {
  font-size: 11px;
  font-weight: 600;
  color: var(--green);
  margin-bottom: 2px;
}
.wa-bubble .ts {
  font-family: var(--f-mono);
  font-size: 9.5px;
  color: var(--ink-3);
  margin-top: 4px;
}

/* mini drawing — used in estimate packet to suggest a floor plan */
.plan-mini {
  background:
    linear-gradient(var(--line) 1px, transparent 1px) 0 0/20px 20px,
    linear-gradient(90deg, var(--line) 1px, transparent 1px) 0 0/20px 20px,
    var(--paper);
  border: 1px solid var(--line-2);
  border-radius: 8px;
  position: relative;
  overflow: hidden;
}

/* keyboard hint */
.kbd-line {
  font-family: var(--f-mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  color: var(--ink-3);
  display: inline-flex; gap: 6px; align-items: center;
}

/* =========================================================
   SCENE FRAME & REPLAY DOCK — guided product-video mode
   ========================================================= */
.stage.replay .main { padding-bottom: 96px; }

/* --- focus the eye on the replay path -------- */
.stage.replay .rail {
  filter: saturate(0.6);
  opacity: 0.55;
  transition: opacity 240ms ease;
}
.stage.replay .rail:hover { opacity: 1; }

/* --- thin storyline ribbon during replay --- */
.storyline--thin {
  padding: 8px 28px;
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 16px;
  background: var(--rail) !important;
}
.storyline-thin-eyebrow {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-on-rail-3);
  white-space: nowrap;
}
.storyline-thin-bar {
  flex: 1;
  height: 3px;
  background: rgba(255,255,255,0.07);
  border-radius: 2px;
  overflow: hidden;
}
.storyline-thin-fill {
  height: 100%;
  background: var(--amber-2);
  transition: width 280ms cubic-bezier(.4,.0,.2,1);
}
.storyline-thin-counter {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  color: var(--ink-on-rail-2);
  white-space: nowrap;
}

/* --- scene-specific focus: hide non-essentials -------- */
.stage.replay[data-scene="bookkeeping"] .replay-only-accounting,
.stage.replay[data-scene="accounting"]  .replay-only-bookkeeping,
.stage.replay[data-scene="client"]      .replay-hide-in-client {
  display: none !important;
}

.scene-frame {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 20px 24px 22px;
  margin-bottom: 20px;
  position: relative;
  box-shadow: var(--shadow-1);
}
.scene-frame-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
  flex-wrap: wrap;
}
.scene-frame-counter {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: none;
  color: var(--ink-3);
}
.scene-frame-counter b { color: var(--amber); font-weight: 600; }
.scene-frame-chapter {
  font-family: var(--f-sans);
  font-size: 12px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink-3);
}
.scene-frame-title {
  margin: 0;
  font-family: var(--f-sans);
  font-style: normal;
  font-weight: 500;
  font-size: 24px;
  color: var(--ink);
  letter-spacing: -0.012em;
  flex-basis: 100%;
  margin-top: 4px;
  line-height: 1.1;
}
.scene-frame-body {
  display: grid;
  grid-template-columns: 1fr 1.15fr 1fr;
  gap: 28px;
  align-items: start;
}
.scene-frame-col { display: flex; flex-direction: column; }
.scene-frame-col.is-action {
  background: var(--white);
  border: 1px solid var(--line-2);
  border-radius: 8px;
  padding: 14px 16px;
  box-shadow: none;
}
.scene-frame-eyebrow {
  font-family: var(--f-sans);
  font-size: 11.5px;
  letter-spacing: 0;
  text-transform: none;
  margin-bottom: 8px;
  position: relative;
  padding-left: 0;
}
.scene-frame-eyebrow.did     { color: var(--green); }
.scene-frame-eyebrow.approve { color: var(--amber); }
.scene-frame-eyebrow.receipt { color: var(--ink-2); }
.scene-frame-text {
  font-size: 13.5px;
  color: var(--ink-2);
  line-height: 1.55;
  text-wrap: pretty;
}
.scene-frame-col.is-action .scene-frame-text {
  color: var(--ink);
  font-size: 14px;
}
.scene-frame-cta {
  margin-top: 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 18px;
  border-radius: 9px;
  background: var(--ink);
  color: var(--paper);
  border: 1px solid var(--ink);
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: -0.005em;
  cursor: pointer;
  box-shadow: 0 6px 16px -8px rgba(27,31,42,0.6);
}
.scene-frame-cta:hover { background: #2A3041; }

.replay-dock {
  position: fixed;
  left: 50%;
  bottom: 16px;
  transform: translateX(-50%);
  width: 920px;
  max-width: calc(100vw - 60px);
  background: rgba(20, 24, 31, 0.96);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: var(--paper);
  border-radius: 12px;
  box-shadow: 0 12px 36px -14px rgba(0,0,0,0.5);
  border: 1px solid rgba(255,255,255,0.06);
  z-index: 1000;
  overflow: hidden;
}
.replay-dock-progress {
  display: flex;
  gap: 3px;
  padding: 7px 14px 0;
}
.replay-dot {
  flex: 1;
  height: 3px;
  border: 0;
  background: rgba(255,255,255,0.08);
  border-radius: 2px;
  padding: 0;
  cursor: pointer;
  transition: background 120ms ease;
}
.replay-dot.is-done    { background: rgba(94,128,73,0.7); }
.replay-dot.is-current { background: var(--amber-2); }
.replay-dot:hover      { background: rgba(255,255,255,0.2); }

.replay-dock-body {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 9px 16px 11px;
}
.replay-dock-where {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
  flex: 1;
}
.replay-dock-where .screen-eyebrow {
  font-size: 9px !important;
}
.replay-dock-title {
  font-family: var(--f-sans);
  font-style: normal;
  font-size: 15px;
  color: var(--paper);
  letter-spacing: -0.005em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.replay-dock-controls {
  display: flex;
  align-items: center;
  gap: 6px;
}
.replay-dock-count {
  font-family: var(--f-mono);
  font-size: 10.5px;
  color: var(--ink-on-rail-3);
  letter-spacing: 0.06em;
  padding: 0 2px;
  white-space: nowrap;
}
.replay-btn {
  height: 28px;
  padding: 0 12px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  font-family: var(--f-sans);
  cursor: pointer;
  border: 1px solid transparent;
  white-space: nowrap;
  letter-spacing: -0.005em;
  transition: background 120ms ease, border-color 120ms ease;
}
.replay-btn.primary {
  background: var(--amber-2);
  color: var(--ink);
  border-color: var(--amber-2);
}
.replay-btn.primary:hover { background: #D6A24B; }
.replay-btn.ghost {
  background: transparent;
  color: var(--ink-on-rail-2);
  border-color: rgba(255,255,255,0.10);
}
.replay-btn.ghost:hover {
  color: var(--paper);
  background: rgba(255,255,255,0.04);
}
.replay-btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

/* =========================================================
   STORYLINE STRIP — the persistent job ribbon across all screens
   ========================================================= */
.storyline {
  grid-column: 2 / 3;
  background: linear-gradient(180deg, #14181F 0%, #1B1F2A 100%);
  color: var(--paper);
  border-bottom: 1px solid #0F121A;
  padding: 10px 28px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.storyline-head {
  display: flex;
  align-items: center;
  gap: 16px;
}
.storyline-head .screen-eyebrow {
  color: var(--ink-on-rail-3);
}
.storyline-job {
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
  flex-shrink: 0;
  white-space: nowrap;
}
.storyline-job .muted-on-rail {
  font-family: var(--f-mono);
  font-size: 10.5px;
  color: var(--ink-on-rail-3);
  letterSpacing: 0.04em;
}
.muted-on-rail {
  font-family: var(--f-mono);
  font-size: 10.5px;
  color: var(--ink-on-rail-3);
  letter-spacing: 0.04em;
}
.storyline-meta {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--ink-on-rail-2);
  flex-shrink: 0;
  white-space: nowrap;
}
.storyline-meta .now-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--amber-2);
  box-shadow: 0 0 0 3px rgba(201, 145, 47, 0.18);
  animation: pulse-amber 2.4s ease-in-out infinite;
}
@keyframes pulse-amber {
  0%,100% { box-shadow: 0 0 0 3px rgba(201, 145, 47, 0.18); }
  50%     { box-shadow: 0 0 0 7px rgba(201, 145, 47, 0.04); }
}

.storyline-track {
  display: flex;
  align-items: stretch;
  gap: 0;
}
.storyline-step {
  flex: 1;
  background: transparent;
  border: 0;
  padding: 6px 8px 4px;
  display: flex;
  align-items: center;
  gap: 9px;
  text-align: left;
  color: var(--ink-on-rail);
  border-radius: 6px;
  transition: background 120ms ease;
  cursor: pointer;
  min-width: 0;
}
.storyline-step:hover { background: rgba(255,255,255,0.04); }
.storyline-step.is-active { background: rgba(201,145,47,0.10); }
.storyline-step .step-mark {
  width: 18px; height: 18px;
  border-radius: 50%;
  display: grid; place-items: center;
  flex: 0 0 auto;
  position: relative;
}
.storyline-step .step-mark .now-pulse {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--ink);
}
.storyline-step .step-body {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.storyline-step .step-label {
  font-size: 12.5px;
  color: var(--paper);
  font-weight: 500;
  letter-spacing: -0.005em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.storyline-step .step-sub {
  font-family: var(--f-mono);
  font-size: 10px;
  color: var(--ink-on-rail-3);
  letter-spacing: 0.04em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 2px;
}
.storyline-step.state-now .step-label,
.storyline-step.state-incoming .step-label { color: var(--amber-2); }
.storyline-step.state-done .step-label { color: var(--paper); }

.storyline-conn {
  width: 22px;
  height: 1px;
  align-self: center;
  margin-top: 4px;
  background: linear-gradient(90deg, rgba(255,255,255,0.18), rgba(255,255,255,0.05));
  flex: 0 0 auto;
}

/* =========================================================
   RESTYLE v2 — Staff-as-employees home
   ========================================================= */

/* slimmer topbar */
.topbar.v2 {
  height: 52px;
  background: var(--canvas);
  border-bottom: 1px solid var(--line);
  padding: 0 32px;
}
.topbar.v2 .now {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 5px 10px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 11px;
}
.topbar.v2 .date {
  margin-left: auto;
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--ink-3);
  letter-spacing: 0.04em;
}

/* ---- Home v2 layout ---- */
.home2 { display: flex; flex-direction: column; gap: 28px; padding: 8px 4px 0; }

.home2-hero {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--line);
}
.home2-hero h1 {
  margin: 0;
  font-size: 40px;
  font-weight: 500;
  letter-spacing: -0.028em;
  line-height: 1.05;
  color: var(--ink);
}
.home2-hero h1 b {
  font-weight: 500;
  color: var(--amber);
}
.home2-hero .lede {
  margin-top: 10px;
  color: var(--ink-2);
  font-size: 15px;
  max-width: 620px;
  line-height: 1.5;
}
.home2-hero .eyebrow {
  font-family: var(--f-mono);
  font-size: 10.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-bottom: 12px;
}

/* big primary replay CTA */
.replay-cta {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 14px 18px;
  background: var(--ink);
  color: var(--paper);
  border: 0;
  border-radius: 10px;
  font-size: 13.5px;
  font-weight: 500;
  letter-spacing: -0.005em;
  box-shadow: var(--shadow-2);
  transition: transform 80ms ease, background 120ms ease;
}
.replay-cta:hover { background: #000; transform: translateY(-1px); }
.replay-cta .play {
  width: 26px; height: 26px;
  border-radius: 999px;
  background: var(--amber-2);
  color: var(--ink);
  display: grid; place-items: center;
  font-size: 10px;
}
.replay-cta .play::before { content: "▶"; margin-left: 2px; }
.replay-cta .sub {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(251,248,242,.55);
}

/* ---- section header ---- */
.home2-section-head {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-bottom: 14px;
}
.home2-section-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: -0.012em;
  color: var(--ink);
}
.home2-section-head .meta {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  color: var(--ink-3);
}

/* ---- Staff roster grid ---- */
.staff-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
@media (max-width: 1200px) {
  .staff-grid { grid-template-columns: repeat(2, 1fr); }
}

.staff-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px 20px 16px;
  display: flex; flex-direction: column; gap: 12px;
  transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
  cursor: pointer;
  text-align: left;
}
.staff-card:hover {
  border-color: var(--line-3);
  box-shadow: var(--shadow-2);
  transform: translateY(-1px);
}

.staff-head { display: flex; align-items: center; gap: 12px; }
.staff-badge {
  width: 44px; height: 44px;
  border-radius: 12px;
  display: grid; place-items: center;
  font-family: var(--f-mono);
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.02em;
  color: var(--paper);
  flex: 0 0 auto;
  position: relative;
}
.staff-badge.t-green { background: var(--green); }
.staff-badge.t-ink   { background: var(--ink); }
.staff-badge.t-amber { background: var(--amber-soft); color:#1B1F2A; border:1px solid var(--line-2); }
.staff-badge.t-navy  { background: var(--navy); }
.staff-badge.t-rust  { background: var(--rust); }
.staff-badge.t-slate { background: #4A5160; }

.staff-status {
  position: absolute;
  right: -2px; bottom: -2px;
  width: 12px; height: 12px;
  border-radius: 50%;
  background: var(--green-2);
  box-shadow: 0 0 0 2.5px var(--paper);
}
.staff-status.is-idle { background: var(--ink-4); }
.staff-status.is-busy {
  background: var(--green-2);
  animation: pulse 2.6s ease-in-out infinite;
}
.staff-status.is-wait { background: var(--amber-2); }

.staff-name {
  font-size: 15px;
  font-weight: 500;
  color: var(--ink);
  letter-spacing: -0.005em;
}
.staff-role {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-top: 2px;
}

.staff-now {
  font-size: 13.5px;
  color: var(--ink-2);
  line-height: 1.45;
  min-height: 38px;
}
.staff-now b { color: var(--ink); font-weight: 500; }

.staff-foot {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  font-family: var(--f-mono);
  font-size: 10.5px;
  letter-spacing: 0.06em;
  color: var(--ink-3);
}
.staff-foot .needs {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--amber);
}
.staff-foot .needs .pill {
  background: var(--amber-soft);
  color: var(--amber);
  padding: 2px 8px;
  border-radius: 999px;
  font-weight: 600;
}
.staff-foot .needs.is-clear { color: var(--green); }
.staff-foot .needs.is-clear .pill { background: var(--green-soft); color: var(--green); }

/* ---- Decisions strip ---- */
.decisions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
@media (max-width: 1200px) {
  .decisions { grid-template-columns: 1fr 1fr; }
}

.decision-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-left: 3px solid var(--amber-2);
  border-radius: 12px;
  padding: 16px 18px 14px;
  display: flex; flex-direction: column; gap: 10px;
  box-shadow: var(--shadow-1);
}
.decision-card.is-green { border-left-color: var(--green-2); }
.decision-card.is-rust  { border-left-color: var(--rust); }

.decision-from {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
}
.decision-from .who {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--ink-2);
}
.decision-from .mini-badge {
  width: 16px; height: 16px;
  border-radius: 4px;
  background: var(--ink);
  color: var(--paper);
  font-size: 8.5px;
  display: grid; place-items: center;
  font-family: var(--f-mono);
}
.decision-title {
  font-size: 15px;
  font-weight: 500;
  color: var(--ink);
  letter-spacing: -0.008em;
  line-height: 1.35;
}
.decision-sub {
  font-size: 13px;
  color: var(--ink-3);
  line-height: 1.45;
}
.decision-actions {
  display: flex; gap: 6px; margin-top: 4px;
  padding-top: 10px;
  border-top: 1px dashed var(--line);
}
.decision-actions .approve {
  flex: 1;
  background: var(--ink);
  color: var(--paper);
  border: 0;
  border-radius: 8px;
  padding: 9px 12px;
  font-size: 12.5px;
  font-weight: 500;
  letter-spacing: -0.005em;
}
.decision-actions .approve:hover { background: #000; }
.decision-actions .secondary {
  background: transparent;
  color: var(--ink-2);
  border: 1px solid var(--line-2);
  border-radius: 8px;
  padding: 9px 10px;
  font-size: 12px;
}
.decision-actions .secondary:hover { background: var(--paper-2); }

/* ---- Trust line ---- */
.trust-line {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  background: var(--paper-2);
  border: 1px dashed var(--line-2);
  border-radius: 12px;
  color: var(--ink-2);
  font-size: 13px;
}
.trust-line b { color: var(--ink); font-weight: 500; }
.trust-line .link {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
  border-bottom: 1px solid var(--ink);
  padding-bottom: 1px;
}

/* =========================================================
   RESTYLE v2 — Estimating Desk pipeline workspace
   ========================================================= */

.est { display: flex; flex-direction: column; gap: 24px; padding: 8px 4px 0; }

/* project header — the plan file is the hero */
.est-head {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--line);
}
.est-head .eyebrow {
  font-family: var(--f-mono);
  font-size: 10.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-bottom: 12px;
}
.est-head h1 {
  margin: 0;
  font-size: 34px;
  font-weight: 500;
  letter-spacing: -0.024em;
  line-height: 1.1;
  color: var(--ink);
}
.est-head h1 .project { color: var(--ink); }
.est-head h1 .sep { color: var(--ink-4); margin: 0 12px; font-weight: 300; }
.est-head h1 .stage-name { color: var(--amber); font-weight: 500; }
.est-head .lede {
  margin-top: 10px;
  color: var(--ink-2);
  font-size: 14px;
  max-width: 640px;
}

.est-upload {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 12px 16px;
  background: var(--paper);
  border: 1px dashed var(--line-3);
  border-radius: 12px;
  color: var(--ink-2);
  font-size: 13px;
}
.est-upload .upload-btn {
  background: var(--ink);
  color: var(--paper);
  border: 0;
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 12.5px;
  font-weight: 500;
  letter-spacing: -0.005em;
  display: inline-flex; align-items: center; gap: 8px;
}
.est-upload .upload-btn:hover { background: #000; }
.est-upload .upload-btn::before { content: "↑"; font-size: 13px; }

/* ---- pipeline ---- */
.est-pipe {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 4px;
  overflow: hidden;
}
.est-pipe-step {
  position: relative;
  padding: 14px 16px 14px 18px;
  background: transparent;
  border: 0;
  border-radius: 10px;
  text-align: left;
  cursor: pointer;
  transition: background 120ms ease;
  display: flex; flex-direction: column; gap: 4px;
  min-width: 0;
}
.est-pipe-step + .est-pipe-step::before {
  content: "";
  position: absolute;
  left: 0; top: 14px; bottom: 14px;
  width: 1px;
  background: var(--line);
}
.est-pipe-step:hover { background: var(--paper-2); }
.est-pipe-step.is-active {
  background: var(--ink);
  color: var(--paper);
}
.est-pipe-step.is-active + .est-pipe-step::before,
.est-pipe-step.is-active::before { display: none; }

.est-pipe-step .num {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--ink-4);
  display: flex; align-items: center; gap: 8px;
}
.est-pipe-step.is-active .num { color: rgba(251,250,246,.55); }
.est-pipe-step .num .marker {
  width: 14px; height: 14px;
  border-radius: 50%;
  display: grid; place-items: center;
  font-size: 8px;
  background: var(--paper-2);
  color: var(--ink-3);
  border: 1px solid var(--line-2);
}
.est-pipe-step.s-done .num .marker { background: var(--green); color: var(--paper); border-color: var(--green); }
.est-pipe-step.s-done .num .marker::before { content: "✓"; }
.est-pipe-step.s-active .num .marker { background: var(--amber-2); color: var(--ink); border-color: var(--amber-2); }
.est-pipe-step.s-active .num .marker::before { content: "●"; }
.est-pipe-step.s-locked .num .marker { background: transparent; color: var(--ink-4); }
.est-pipe-step.s-locked .num .marker::before { content: "○"; }

.est-pipe-step .label {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.008em;
  color: var(--ink);
  margin-top: 2px;
}
.est-pipe-step.is-active .label { color: var(--paper); }
.est-pipe-step .meta {
  font-size: 12px;
  color: var(--ink-3);
}
.est-pipe-step.is-active .meta { color: rgba(251,250,246,.65); }
.est-pipe-step.s-locked .label,
.est-pipe-step.s-locked .meta { color: var(--ink-4); }

/* ---- stage workspace ---- */
.est-stage {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 20px;
  align-items: start;
}

.stage-panel {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}
.stage-panel-head {
  padding: 18px 22px 14px;
  border-bottom: 1px solid var(--line);
  display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
}
.stage-panel-head .title {
  font-size: 17px;
  font-weight: 500;
  letter-spacing: -0.012em;
  color: var(--ink);
}
.stage-panel-head .sub {
  font-family: var(--f-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-top: 4px;
}
.stage-panel-head .right {
  display: flex; gap: 8px;
}
.stage-btn {
  background: var(--ink);
  color: var(--paper);
  border: 0;
  border-radius: 8px;
  padding: 9px 14px;
  font-size: 12.5px;
  font-weight: 500;
}
.stage-btn:hover { background: #000; }
.stage-btn.ghost {
  background: transparent;
  color: var(--ink-2);
  border: 1px solid var(--line-2);
}
.stage-btn.ghost:hover { background: var(--paper-2); }

.stage-panel-body { padding: 20px 22px 22px; }

/* ---- budget table ---- */
.budget-table {
  display: grid;
  grid-template-columns: 1fr 96px 1fr 110px 90px;
  gap: 0;
  font-size: 13px;
}
.budget-table .bh {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
  padding: 0 10px 10px;
  border-bottom: 1px solid var(--line);
}
.budget-table .br {
  padding: 11px 10px;
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center;
  color: var(--ink-2);
}
.budget-table .br.row-end { border-bottom: 0; }
.budget-table .name { color: var(--ink); font-weight: 500; }
.budget-table .num {
  font-family: var(--f-mono);
  font-variant-numeric: tabular-nums;
  justify-content: flex-end;
  color: var(--ink);
}
.budget-table .src {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--ink-3);
}
.budget-table .src .tag {
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--paper-2);
  color: var(--ink-2);
  border: 1px solid var(--line);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.budget-table .src .tag.is-firm   { background: var(--green-soft); color: var(--green); border-color: transparent; }
.budget-table .src .tag.is-quote  { background: var(--amber-soft); color: var(--amber); border-color: transparent; }
.budget-table .src .tag.is-allow  { background: var(--navy-soft);  color: var(--navy);  border-color: transparent; }
.budget-table .delta {
  font-family: var(--f-mono);
  font-size: 11.5px;
  justify-content: flex-end;
  color: var(--ink-3);
}
.budget-table .delta.is-up   { color: var(--rust); }
.budget-table .delta.is-down { color: var(--green); }

.budget-total {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  padding: 16px 12px 4px;
  border-top: 2px solid var(--ink);
  margin-top: 6px;
}
.budget-total .label {
  font-size: 13px;
  font-family: var(--f-mono);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--ink-3);
}
.budget-total .label b { display:block; color: var(--ink); font-size: 14px; margin-top: 4px; letter-spacing: -0.005em; text-transform: none; font-family: var(--f-sans); }
.budget-total .amt {
  font-family: var(--f-sans);
  font-weight: 500;
  font-size: 32px;
  letter-spacing: -0.022em;
  color: var(--ink);
}
.budget-total .amt small {
  display:block;
  font-family: var(--f-mono);
  font-size: 11px;
  font-weight: 400;
  color: var(--ink-3);
  letter-spacing: 0.1em;
  text-align: right;
  margin-top: 2px;
}

/* ---- estimator side panel ---- */
.est-side {
  display: flex; flex-direction: column; gap: 14px;
  position: sticky; top: 24px;
}

.est-agent {
  background: var(--ink);
  color: var(--paper);
  border-radius: 14px;
  padding: 18px;
}
.est-agent-head {
  display: flex; align-items: center; gap: 12px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.est-agent-head .badge {
  width: 40px; height: 40px; border-radius: 11px;
  background: var(--green);
  display: grid; place-items: center;
  font-family: var(--f-mono);
  font-weight: 600;
  color: var(--paper);
  position: relative;
}
.est-agent-head .badge::after {
  content: ""; position: absolute; right: -2px; bottom: -2px;
  width: 11px; height: 11px; border-radius: 50%;
  background: var(--green-2);
  box-shadow: 0 0 0 2.5px var(--ink);
  animation: pulse 2.6s ease-in-out infinite;
}
.est-agent-head .name { font-size: 14px; font-weight: 500; }
.est-agent-head .role {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(251,250,246,.55);
  margin-top: 2px;
}
.est-agent-now {
  padding: 14px 0 4px;
  font-size: 13.5px;
  color: rgba(251,250,246,.85);
  line-height: 1.5;
}
.est-agent-now b { color: var(--paper); font-weight: 500; }

.est-actions {
  display: grid; grid-template-columns: 1fr 1fr; gap: 6px;
  margin-top: 12px;
}
.est-actions button {
  background: rgba(255,255,255,.08);
  color: var(--paper);
  border: 0;
  border-radius: 8px;
  padding: 10px;
  font-size: 12px;
  font-weight: 500;
}
.est-actions button:hover { background: rgba(255,255,255,.14); }
.est-actions button.primary { background: var(--amber-2); color: var(--ink); }
.est-actions button.primary:hover { background: #d9a13e; }

/* questions card */
.est-questions {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px 18px;
}
.est-questions h4 {
  margin: 0 0 12px;
  font-family: var(--f-mono);
  font-size: 10.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-3);
}
.est-q {
  padding: 12px 0;
  border-top: 1px solid var(--line);
}
.est-q:first-of-type { border-top: 0; padding-top: 4px; }
.est-q .q { font-size: 13px; color: var(--ink); line-height: 1.4; }
.est-q .ctx { font-size: 12px; color: var(--ink-3); margin-top: 4px; line-height: 1.45; }
.est-q .qa { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.est-q .qa button {
  background: transparent;
  border: 1px solid var(--line-2);
  color: var(--ink-2);
  padding: 6px 10px;
  border-radius: 7px;
  font-size: 11.5px;
}
.est-q .qa button.primary {
  background: var(--ink); color: var(--paper); border-color: var(--ink);
}

/* source files list */
.est-sources {
  display: flex; flex-direction: column; gap: 8px;
}
.est-source {
  display: grid;
  grid-template-columns: 36px 1fr auto;
  gap: 12px;
  padding: 12px 14px;
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-radius: 10px;
  align-items: center;
}
.est-source .kind {
  width: 36px; height: 36px;
  border-radius: 8px;
  background: var(--ink);
  color: var(--paper);
  display: grid; place-items: center;
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.1em;
  font-weight: 600;
}
.est-source .kind.k-pdf { background: var(--rust); }
.est-source .kind.k-doc { background: var(--navy); }
.est-source .kind.k-img { background: var(--green); }
.est-source .kind.k-rules { background: var(--amber-2); color: var(--ink); }
.est-source .title { font-size: 13.5px; font-weight: 500; color: var(--ink); }
.est-source .meta { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; font-family: var(--f-mono); letter-spacing: 0.04em; }
.est-source .pages {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--ink-3);
}

/* trades quotes panel */
.trades {
  display: flex; flex-direction: column; gap: 0;
}
.trade {
  display: grid;
  grid-template-columns: 1fr 130px 100px 120px;
  gap: 12px;
  padding: 14px 4px;
  border-top: 1px solid var(--line);
  align-items: center;
}
.trade:first-child { border-top: 0; }
.trade .vendor {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--ink);
}
.trade .scope {
  font-size: 12px;
  color: var(--ink-3);
  margin-top: 2px;
}
.trade .amt {
  font-family: var(--f-mono);
  font-variant-numeric: tabular-nums;
  text-align: right;
  font-size: 13px;
  color: var(--ink);
}
.trade .amt small { display: block; color: var(--ink-4); font-size: 10px; letter-spacing: 0.06em; margin-top: 2px; }
.trade .status {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 4px 9px;
  border-radius: 999px;
  width: max-content;
  background: var(--paper-2);
  color: var(--ink-3);
}
.trade .status.is-sent    { background: var(--navy-soft); color: var(--navy); }
.trade .status.is-replied { background: var(--green-soft); color: var(--green); }
.trade .status.is-draft   { background: var(--amber-soft); color: var(--amber); }
.trade .status.is-late    { background: var(--rust-soft); color: var(--rust); }
.trade .act button {
  background: transparent;
  border: 1px solid var(--line-2);
  color: var(--ink-2);
  padding: 7px 11px;
  border-radius: 7px;
  font-size: 11.5px;
  width: 100%;
}
.trade .act button.primary { background: var(--ink); color: var(--paper); border-color: var(--ink); }

/* =========================================================
   ESTIMATOR v3 — multi-house office packet
   ========================================================= */
.est2 { gap: 18px; }
.est-flow-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.est-flow-step {
  display: grid;
  grid-template-columns: 26px 1fr;
  gap: 10px;
  padding: 13px 14px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  min-width: 0;
}
.est-flow-num {
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: var(--ink);
  color: var(--paper);
  display: grid;
  place-items: center;
  font-family: var(--f-mono);
  font-size: 11px;
}
.est-flow-title {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
}
.est-flow-body {
  margin-top: 3px;
  font-size: 11.8px;
  line-height: 1.35;
  color: var(--ink-3);
}
.est-project-head,
.est-packet-head,
.est-table-head,
.quote-queue-head,
.portal-map-head {
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}
.est-project-title,
.portal-map-head b {
  display: block;
  margin-top: 3px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
}
.est-project-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
}
.est-project-tile {
  text-align: left;
  background: var(--paper);
  border: 0;
  border-right: 1px solid var(--line);
  padding: 15px 16px;
  display: grid;
  grid-template-columns: 10px 1fr;
  gap: 9px;
  min-height: 116px;
}
.est-project-tile:last-child { border-right: 0; }
.est-project-tile.is-active { background: var(--white); box-shadow: inset 0 -2px 0 var(--green); }
.est-project-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-top: 5px;
  background: var(--green);
}
.est-project-tile.t-amber .est-project-dot { background: var(--amber); }
.est-project-tile.t-navy .est-project-dot { background: var(--navy); }
.est-project-tile.t-rust .est-project-dot { background: var(--rust); }
.est-project-name { font-size: 13.5px; color: var(--ink); font-weight: 600; }
.est-project-source { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }
.est-project-state {
  grid-column: 2;
  margin-top: 8px;
  font-size: 12.5px;
  color: var(--ink-2);
}
.est-project-note {
  grid-column: 2;
  font-size: 11.5px;
  color: var(--amber);
}
.est-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 18px;
  align-items: start;
}
.est-packet-head h2,
.est-table-head h3 {
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 22px;
  letter-spacing: -0.018em;
}
.est-packet-head p {
  margin: 7px 0 0;
  color: var(--ink-2);
  max-width: 650px;
}
.est-packet-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.est-source-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 14px 18px 18px;
}
.est-source-chip {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 10px;
  align-items: center;
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
}
.est-source-chip > span {
  height: 34px;
  border-radius: 7px;
  background: var(--rail);
  color: var(--paper);
  display: grid;
  place-items: center;
  font-family: var(--f-mono);
  font-size: 9px;
}
.est-source-chip b {
  display: block;
  color: var(--ink);
  font-size: 12.5px;
}
.est-source-chip small {
  display: block;
  margin-top: 2px;
  color: var(--ink-3);
  font-size: 11px;
  line-height: 1.3;
}
.est-tabs {
  display: flex;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-2);
}
.est-tabs span {
  padding: 6px 9px;
  border-radius: 6px;
  font-size: 11.5px;
  color: var(--ink-3);
}
.est-tabs span.is-active { background: var(--paper); color: var(--ink); box-shadow: var(--shadow-1); }
.est-budget-grid {
  display: grid;
  grid-template-columns: 150px 66px minmax(190px, 1fr) 120px 150px 110px 110px;
  overflow: auto;
  font-size: 12.5px;
}
.est-th {
  padding: 10px 12px;
  background: var(--paper-2);
  border-bottom: 1px solid var(--line);
  color: var(--ink-3);
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  white-space: nowrap;
}
.est-td {
  padding: 11px 12px;
  border-bottom: 1px solid var(--line);
  color: var(--ink-2);
  min-width: 0;
}
.est-td.group {
  color: var(--ink-3);
  font-family: var(--f-mono);
  font-size: 10.5px;
  letter-spacing: 0.04em;
}
.est-td.code,
.est-td.money {
  font-family: var(--f-mono);
  font-variant-numeric: tabular-nums;
  color: var(--ink);
}
.est-td.desc {
  color: var(--ink);
  font-weight: 500;
}
.est-td.desc small {
  display: block;
  margin-top: 2px;
  color: var(--ink-4);
  font-weight: 400;
  font-size: 10.8px;
}
.est-td.variance { color: var(--ink-3); }
.est-td.variance.is-waiting { color: var(--amber); }
.est-td.variance.is-good { color: var(--green); }
.est-schedule-list { display: flex; flex-direction: column; }
.est-schedule-row {
  display: grid;
  grid-template-columns: 1fr 160px;
  gap: 16px;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px dashed var(--line);
}
.est-schedule-row:last-child { border-bottom: 0; }
.est-schedule-row b { display: block; color: var(--ink); font-size: 13px; }
.est-schedule-row small { display: block; margin-top: 2px; color: var(--ink-3); font-size: 11.5px; }
.est-schedule-row > span {
  justify-self: end;
  font-family: var(--f-mono);
  font-size: 11.5px;
  color: var(--green);
}
.est-schedule-row.is-placeholder > span { color: var(--amber); }
.est2-side { position: sticky; top: 18px; }
.est-trade-mini { display: flex; flex-direction: column; }
.est-trade-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px dashed var(--line);
  align-items: center;
}
.est-trade-row:last-child { border-bottom: 0; }
.est-trade-title { font-size: 12.8px; color: var(--ink); font-weight: 600; }
.est-trade-sub { font-size: 11.2px; color: var(--ink-3); margin-top: 1px; }
.est-trade-row > span,
.quote-status {
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 3px 7px;
  border-radius: 999px;
  background: var(--paper-2);
  color: var(--ink-3);
}
.est-trade-row.is-replied > span,
.quote-status.is-replied { background: var(--green-soft); color: var(--green); }
.est-trade-row.is-waiting > span,
.quote-status.is-waiting { background: var(--amber-soft); color: var(--amber); }
.est-trade-row.is-draft > span,
.quote-status.is-draft { background: var(--navy-soft); color: var(--navy); }
.est-trade-row.is-held > span,
.quote-status.is-held { background: var(--rust-soft); color: var(--rust); }
.est-portal-list { display: grid; gap: 10px; }
.est-portal-list div {
  padding-bottom: 9px;
  border-bottom: 1px dashed var(--line);
}
.est-portal-list div:last-child { border-bottom: 0; padding-bottom: 0; }
.est-portal-list b { display: block; color: var(--ink); font-size: 12.8px; }
.est-portal-list span { display: block; margin-top: 2px; color: var(--ink-3); font-size: 11.8px; line-height: 1.35; }

/* =========================================================
   QUOTE QUEUE v2
   ========================================================= */
.quotes2 { gap: 18px; }
.safety-note {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: var(--rail);
  color: var(--paper);
  border-radius: 8px;
  font-size: 13px;
}
.safety-note span { color: rgba(251,250,246,.72); }
.safety-note b { color: var(--paper); font-weight: 600; }
.quote-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.quote-summary-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px 16px;
}
.quote-summary-card b {
  display: block;
  font-size: 28px;
  line-height: 1;
  color: var(--ink);
  font-weight: 600;
}
.quote-summary-card span {
  display: block;
  margin-top: 5px;
  color: var(--ink-3);
  font-size: 12.5px;
}
.quote-queue-table {
  display: grid;
  grid-template-columns: 210px minmax(280px, 1fr) 150px 110px 160px;
  overflow: auto;
}
.quote-th {
  padding: 10px 14px;
  background: var(--paper-2);
  border-bottom: 1px solid var(--line);
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: var(--ink-3);
}
.quote-td {
  padding: 13px 14px;
  border-bottom: 1px solid var(--line);
  color: var(--ink-2);
  font-size: 12.8px;
}
.quote-td.main b { display: block; color: var(--ink); font-size: 13.5px; }
.quote-td small { display: block; margin-top: 3px; color: var(--ink-4); font-size: 11px; }
.quote-td.code {
  font-family: var(--f-mono);
  color: var(--ink);
}
.quote-td.action {
  color: var(--ink);
  font-weight: 500;
}
.quote-work-grid {
  display: grid;
  grid-template-columns: 1.25fr .85fr;
  gap: 18px;
}
.quote-draft { display: grid; gap: 12px; }
.quote-line {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 14px;
  align-items: baseline;
}
.quote-line b {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-3);
}
.quote-line span { color: var(--ink-2); font-size: 13px; }
.quote-email {
  margin-top: 4px;
  padding: 14px 16px;
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink-2);
  font-size: 13.2px;
  line-height: 1.55;
}
.quote-reply-list { display: grid; gap: 10px; }
.quote-reply {
  border: 1px solid var(--line);
  border-left: 3px solid var(--amber);
  border-radius: 8px;
  padding: 11px 12px;
  background: var(--paper-2);
}
.quote-reply.is-good { border-left-color: var(--green); }
.quote-reply b { display: block; color: var(--ink); font-size: 13px; }
.quote-reply span { display: block; margin-top: 3px; color: var(--ink-3); font-size: 12px; line-height: 1.4; }

/* =========================================================
   FIELD + PROJECT PORTAL ALIGNMENT
   ========================================================= */
.field-lane-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.field-lane-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 3px solid var(--green);
  border-radius: 8px;
  padding: 13px 14px;
}
.field-lane-card.t-amber { border-left-color: var(--amber); }
.field-lane-card.t-rust { border-left-color: var(--rust); }
.field-lane-card.t-navy { border-left-color: var(--navy); }
.field-lane-card b {
  display: block;
  margin-top: 5px;
  color: var(--ink);
  font-size: 13.5px;
}
.field-lane-card span {
  display: block;
  margin-top: 4px;
  color: var(--ink-3);
  font-size: 12.2px;
  line-height: 1.35;
}
.portal-map-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
}
.portal-map-item {
  padding: 13px 15px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  min-height: 82px;
}
.portal-map-item:nth-child(4n) { border-right: 0; }
.portal-map-item:nth-child(n+5) { border-bottom: 0; }
.portal-map-item b {
  display: block;
  color: var(--ink);
  font-size: 13px;
}
.portal-map-item span {
  display: block;
  margin-top: 4px;
  color: var(--ink-3);
  font-size: 11.8px;
  line-height: 1.35;
}
.project-flow-grid {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 18px;
  align-items: start;
}
.project-schedule-list,
.project-proof-list {
  display: flex;
  flex-direction: column;
}
.project-row {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr) 170px;
  gap: 14px;
  padding: 10px 0;
  border-bottom: 1px dashed var(--line);
  align-items: baseline;
}
.project-row:last-child { border-bottom: 0; }
.project-row > span {
  color: var(--ink-3);
  font-size: 11px;
}
.project-row b {
  color: var(--ink);
  font-size: 13.2px;
}
.project-row small {
  display: block;
  margin-top: 2px;
  color: var(--ink-3);
  font-size: 11.5px;
}
.project-row em {
  justify-self: end;
  font-style: normal;
  font-family: var(--f-mono);
  color: var(--amber);
  font-size: 11px;
}
.project-budget-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.project-budget-cards > div {
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 13px 14px;
}
.project-budget-cards span,
.project-budget-cards small {
  display: block;
  color: var(--ink-3);
  font-size: 11.5px;
}
.project-budget-cards b {
  display: block;
  margin: 4px 0 2px;
  color: var(--ink);
  font-size: 22px;
  line-height: 1;
}
.proof-item {
  padding: 11px 0;
  border-bottom: 1px dashed var(--line);
}
.proof-item:last-child { border-bottom: 0; }
.proof-item b {
  display: block;
  color: var(--ink);
  font-size: 13px;
}
.proof-item span {
  display: block;
  margin-top: 3px;
  color: var(--ink-3);
  font-size: 12px;
  line-height: 1.4;
}

/* =========================================================
   EMPLOYEE PAGES — plain work-packet rhythm
   ========================================================= */
.employee-flow-card {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}
.employee-flow-step {
  padding: 15px 16px;
  border-right: 1px solid var(--line);
}
.employee-flow-step:last-child { border-right: 0; }
.employee-flow-step > span {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--f-mono);
  font-size: 10.5px;
  margin-bottom: 9px;
}
.employee-flow-step b {
  display: block;
  color: var(--ink);
  font-size: 13.5px;
}
.employee-flow-step p {
  margin: 5px 0 0;
  color: var(--ink-3);
  font-size: 12px;
  line-height: 1.4;
}

/* =========================================================
   BOOKKEEPING v2 — simple approval surface
   ========================================================= */
.books2 { gap: 18px; }
.books-action-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.book-packet {
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 3px solid var(--green);
  border-radius: 8px;
  padding: 14px;
}
.book-packet.t-amber { border-left-color: var(--amber); }
.book-packet > div {
  display: flex;
  align-items: baseline;
  gap: 9px;
}
.book-packet span {
  font-size: 28px;
  line-height: 1;
  color: var(--ink);
  font-weight: 600;
}
.book-packet b {
  color: var(--ink);
  font-size: 13.5px;
}
.book-packet p {
  margin: 9px 0 12px;
  color: var(--ink-3);
  font-size: 12.3px;
  line-height: 1.4;
}
.book-packet button {
  height: 32px;
  border: 1px solid var(--line-2);
  border-radius: 7px;
  background: var(--white);
  color: var(--ink);
  padding: 0 11px;
  font-size: 12px;
  font-weight: 500;
}
.books-main-grid {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 18px;
  align-items: start;
}
.simple-table { display: flex; flex-direction: column; }
.simple-money-row,
.simple-hours-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 110px auto;
  gap: 14px;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px dashed var(--line);
}
.simple-money-row:last-child,
.simple-hours-row:last-child { border-bottom: 0; }
.simple-money-row b,
.simple-hours-row b {
  display: block;
  color: var(--ink);
  font-size: 13px;
}
.simple-money-row small,
.simple-hours-row small {
  display: block;
  margin-top: 2px;
  color: var(--ink-3);
  font-size: 11.5px;
}
.simple-money-row > span,
.simple-hours-row > span {
  font-family: var(--f-mono);
  color: var(--ink);
  font-size: 12px;
  justify-self: end;
}
.held-list { display: grid; gap: 9px; }
.held-item {
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-left: 3px solid var(--amber);
  border-radius: 8px;
  padding: 10px 12px;
}
.held-item b {
  display: block;
  color: var(--ink);
  font-size: 12.8px;
}
.held-item span {
  display: block;
  margin-top: 3px;
  color: var(--ink-3);
  font-size: 11.8px;
  line-height: 1.35;
}
.accounting-answer {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ask-bubble,
.answer-bubble {
  border-radius: 8px;
  padding: 12px 14px;
  font-size: 13px;
  line-height: 1.45;
}
.ask-bubble {
  align-self: flex-start;
  background: var(--white);
  border: 1px solid var(--line);
  color: var(--ink);
}
.answer-bubble {
  background: var(--paper-2);
  border: 1px solid var(--line);
  color: var(--ink-2);
}
.answer-bubble b {
  display: block;
  color: var(--ink);
  margin-bottom: 4px;
}
.answer-bubble span { color: var(--ink-2); }

/* =========================================================
   SIDEBAR v3 — grouped: OFFICE · EMPLOYEES · ROOMS
   ========================================================= */
.rail {
  gap: 14px;
  padding-top: 18px;
  overflow-y: auto;
  position: sticky;
  top: 0;
  height: 100vh;
  align-self: start;
}
.rail-group { display: flex; flex-direction: column; gap: 6px; }
.rail-section-label {
  display: flex; align-items: center; justify-content: space-between;
  padding: 4px 22px 2px;
}
.rail-section-meta {
  font-family: var(--f-sans);
  font-size: 10px;
  letter-spacing: 0;
  color: var(--ink-on-rail-3);
  text-transform: none;
}

/* Team rows — sidebar "office floor" */
.rail-team-list {
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 0 12px;
}
.rail-team {
  padding: 7px 6px 6px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 8px;
  background: rgba(255,255,255,.025);
}
.rail-team-toggle,
.rail-staff-toggle-v4 {
  width: 100%;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  gap: 6px;
  align-items: start;
  border: 0;
  background: transparent;
  color: inherit;
  padding: 0 4px 5px;
  text-align: left;
}
.rail-caret {
  width: 16px;
  height: 16px;
  margin-top: 1px;
  border-radius: 4px;
  display: grid;
  place-items: center;
  background: var(--rail-2);
  color: var(--ink-on-rail-2);
  font-family: var(--f-mono);
  font-size: 10px;
}
.rail-team-copy { min-width: 0; }
.rail-team-copy > span {
  display: block;
  color: var(--ink-on-rail);
  font-size: 11.5px;
  font-weight: 500;
}
.rail-team-copy small {
  display: block;
  margin-top: 1px;
  color: var(--ink-on-rail-3);
  font-size: 10px;
  line-height: 1.25;
}
.rail-team-toggle em,
.rail-staff-toggle-v4 em {
  min-width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--amber-2);
  color: #1B1F2A;
  font-family: var(--f-mono);
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
}
.rail-team.is-collapsed { padding-bottom: 7px; }
.rail-team .rail-emp-list { padding: 0; }

.rail-staff-groups {
  display: flex;
  flex-direction: column;
  gap: 7px;
  overflow-y: auto;
  min-height: 0;
  padding-bottom: 8px;
}

.rail-staff-group {
  padding: 7px 6px 6px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 8px;
  background: rgba(255,255,255,.025);
  margin: 0 12px;
}

.rail-staff-group .rail-list {
  padding: 6px 0 0;
}

/* Employee rows — sidebar "roster" */
.rail-emp-list { display: flex; flex-direction: column; gap: 1px; padding: 0 12px; }
.rail-emp {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 7px;
  border-radius: 6px;
  border: 0; background: transparent;
  color: #C2C8D6;
  text-align: left; width: 100%;
  font-size: 12.8px;
  position: relative;
  transition: background 120ms ease, color 120ms ease;
}
.rail-emp:hover { background: var(--rail-2); color: var(--ink-on-rail); }
.rail-emp.is-active { background: var(--rail-2); color: var(--ink-on-rail); }
.rail-emp.is-active::before {
  content:""; position:absolute; left:-12px; top:6px; bottom:6px;
  width:2px; background: var(--amber-2); border-radius: 0 2px 2px 0;
}
.rail-emp .emp-copy { flex: 1; min-width: 0; display: block; }
.rail-emp .emp-name { display:block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.15; }
.rail-emp .emp-role {
  display:block;
  margin-top: 1px;
  color: var(--ink-on-rail-3);
  font-size: 10.3px;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rail-emp.is-active .emp-role,
.rail-emp:hover .emp-role { color: var(--ink-on-rail-2); }
.rail-emp .emp-needs {
  font-family: var(--f-mono);
  font-size: 10px;
  min-width: 18px; height: 18px;
  display: grid; place-items: center;
  border-radius: 999px;
  background: var(--amber-2);
  color: #1B1F2A;
  font-weight: 600;
}
.rail-emp .emp-needs.is-clear {
  background: transparent;
  color: var(--ink-on-rail-3);
}

/* Avatar badge with status pip — used in sidebar AND in the briefing card */
.emp-badge {
  position: relative;
  width: 24px; height: 24px;
  border-radius: 50%;
  display: grid; place-items: center;
  font-family: var(--f-mono);
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
  flex: 0 0 auto;
  color: #FBF8F2;
  background: var(--ink);
}
.emp-badge.t-ink    { background: var(--ink);   }
.emp-badge.t-navy   { background: var(--navy);  }
.emp-badge.t-green  { background: var(--green); }
.emp-badge.t-amber  { background: var(--amber); }
.emp-badge.t-rust   { background: var(--rust);  }
.emp-badge.t-slate  { background: #475569; }
.emp-status {
  position: absolute;
  right: -2px; bottom: -2px;
  width: 8px; height: 8px;
  border-radius: 50%;
  border: 2px solid var(--rail);
  background: var(--ink-4);
}
.rail-emp.is-active .emp-status,
.om-badge .emp-status { border-color: var(--paper); }
.emp-status.is-busy { background: var(--green-2); }
.emp-status.is-wait { background: var(--amber-2); }
.emp-status.is-idle { background: var(--ink-4); }

/* =========================================================
   OFFICE TODAY v3 — briefing + flow ribbon + decision stack
   ========================================================= */
.today3 { gap: 22px; max-width: 1100px; }

/* Office Manager briefing card */
.om-brief {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-3);
  padding: 22px 26px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 22px;
  align-items: start;
}
.om-badge { display: flex; align-items: center; gap: 12px; }
.om-badge .emp-badge { width: 38px; height: 38px; font-size: 12px; }
.om-name { font-size: 14px; font-weight: 500; color: var(--ink); }
.om-role {
  font-family: var(--f-sans);
  font-size: 12px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink-3);
  margin-top: 2px;
}
.om-summary {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.om-headline h1 {
  margin: 0;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: -0.018em;
  color: var(--ink);
}
.om-headline p {
  margin: 5px 0 0;
  font-size: 14px;
  color: var(--ink-2);
}
.om-panels {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
  gap: 12px;
}
.om-panel {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-2);
  padding: 13px 14px;
}
.om-panel.is-decision {
  background: var(--amber-soft);
  border-color: var(--line-2);
}
.om-kicker {
  font-size: 11.5px;
  color: var(--ink-3);
  margin-bottom: 8px;
}
.om-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 7px;
}
.om-list li {
  font-size: 13px;
  color: var(--ink);
  line-height: 1.35;
}
.om-list li::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--green-2);
  margin-right: 8px;
  transform: translateY(-1px);
}
.om-decision-count {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 8px;
}
.om-decision-count b {
  font-size: 30px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--ink);
}
.om-decision-count span {
  font-size: 13px;
  color: var(--ink-2);
}
.om-decision-list {
  display: grid;
  gap: 5px;
  margin-bottom: 12px;
}
.om-decision-list span {
  font-size: 12.5px;
  color: var(--ink-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.om-review {
  height: 32px;
  padding: 0 12px;
  border-radius: 7px;
  border: 1px solid var(--ink);
  background: var(--ink);
  color: var(--paper);
  font-size: 12px;
  font-weight: 500;
}
.om-review:hover { background: var(--rail-2); }
.om-replay {
  grid-column: 2 / 3;
  justify-self: start;
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--rail);
  color: var(--ink-on-rail);
  border: 0;
  border-radius: var(--r-2);
  padding: 10px 14px;
  font-size: 12.5px;
  font-weight: 500;
  white-space: nowrap;
  box-shadow: var(--shadow-2);
}
.om-replay .play {
  width: 0; height: 0;
  border-left: 7px solid var(--amber-2);
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  margin-left: 1px;
}
.om-replay:hover { background: var(--rail-2); }

/* Section heads */
.today-section { display: flex; flex-direction: column; gap: 12px; }
.today-section-head {
  display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
}
.today-section-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.today-section-head .meta {
  font-family: var(--f-sans);
  font-size: 12px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink-3);
}

/* Decision stack — one row per pending approval */
.d-stack {
  display: flex; flex-direction: column;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-3);
  overflow: hidden;
}
.d-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 14px 18px;
  border-top: 1px solid var(--line);
  position: relative;
  cursor: pointer;
}
.d-row:first-child { border-top: 0; }
.d-row:hover { background: rgba(255,255,255,.58); }
.d-row:focus-visible {
  outline: 2px solid var(--amber-2);
  outline-offset: -2px;
}
.d-row::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0;
  width: 3px; background: var(--ink-4);
}
.d-row.t-green::before { background: var(--green-2); }
.d-row.t-amber::before { background: var(--amber-2); }
.d-row.t-navy::before  { background: var(--navy); }
.d-row.t-rust::before  { background: var(--rust); }
.d-row.t-ink::before   { background: var(--ink); }

.d-badge {
  width: 28px; height: 28px;
  border-radius: 50%;
  display: grid; place-items: center;
  font-family: var(--f-mono);
  font-size: 10px;
  font-weight: 600;
  color: #FBF8F2;
  background: var(--ink);
  flex: 0 0 auto;
}
.d-badge.t-green { background: var(--green); }
.d-badge.t-amber { background: var(--amber); }
.d-badge.t-navy  { background: var(--navy);  }
.d-badge.t-rust  { background: var(--rust);  }
.d-badge.t-ink   { background: var(--ink);   }

.d-main { min-width: 0; }
.d-title {
  font-size: 14px;
  font-weight: 500;
  color: var(--ink);
  letter-spacing: -0.005em;
}
.d-sub {
  font-size: 12.5px;
  color: var(--ink-3);
  margin-top: 3px;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px;
}
.d-sub .d-who { color: var(--ink-2); font-weight: 500; }
.d-sub .d-dot { color: var(--line-3); }
.d-sub .d-age { font-family: var(--f-mono); font-size: 11px; color: var(--ink-4); }

.d-actions { display: flex; align-items: center; gap: 6px; }
.d-approve {
  height: 32px;
  padding: 0 14px;
  border-radius: 7px;
  border: 1px solid var(--rail);
  background: var(--rail);
  color: var(--ink-on-rail);
  font-size: 12.5px;
  font-weight: 500;
  white-space: nowrap;
}
.d-approve:hover { background: var(--rail-2); }
.d-ghost {
  height: 32px;
  padding: 0 10px;
  border-radius: 7px;
  border: 1px solid var(--line-2);
  background: var(--white);
  color: var(--ink-2);
  font-size: 12px;
}
.d-ghost:hover { background: var(--paper-2); }

/* Decision packet modal */
.packet-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2000;
  background: rgba(18, 20, 23, .46);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px;
}
.packet-modal {
  width: min(1080px, calc(100vw - 56px));
  max-height: calc(100vh - 56px);
  overflow: auto;
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: 12px;
  box-shadow: 0 28px 70px -28px rgba(0,0,0,.5);
}
.packet-modal-head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 24px 18px;
  border-bottom: 1px solid var(--line);
}
.packet-modal-head h2 {
  margin: 3px 0 5px;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: -0.015em;
  color: var(--ink);
}
.packet-modal-head p {
  margin: 0;
  max-width: 720px;
  color: var(--ink-2);
  font-size: 13.5px;
}
.packet-kicker {
  color: var(--ink-3);
  font-size: 12px;
}
.packet-close {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  color: var(--ink-2);
}
.packet-close:hover { background: var(--paper-2); }
.packet-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  padding: 16px 24px;
  border-bottom: 1px solid var(--line);
}
.packet-summary div {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 14px;
}
.packet-summary div.is-warn {
  background: var(--amber-soft);
  border-color: var(--line-2);
}
.packet-summary b {
  display: block;
  font-size: 22px;
  font-weight: 500;
  color: var(--ink);
  letter-spacing: -0.018em;
  line-height: 1;
}
.packet-summary span {
  display: block;
  margin-top: 5px;
  color: var(--ink-3);
  font-size: 12px;
}
.bill-review-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(320px, .9fr);
  gap: 0;
  border-bottom: 1px solid var(--line);
}
.bill-ready {
  padding: 18px 24px 20px;
  border-right: 1px solid var(--line);
}
.bill-uncertain {
  padding: 18px 20px 20px;
  background: rgba(238,232,219,.42);
}
.packet-section-head {
  margin-bottom: 12px;
}
.packet-section-head h3 {
  margin: 0;
  font-size: 15px;
  font-weight: 500;
  color: var(--ink);
}
.packet-section-head span {
  display: block;
  margin-top: 3px;
  color: var(--ink-3);
  font-size: 12px;
}
.bill-table {
  border: 1px solid var(--line);
  border-radius: 9px;
  overflow: hidden;
  background: var(--white);
}
.bill-table-head,
.bill-row {
  display: grid;
  grid-template-columns: 1.25fr 1.35fr 110px 92px;
  gap: 12px;
  align-items: center;
}
.bill-table-head {
  padding: 9px 14px;
  background: var(--paper-2);
  color: var(--ink-3);
  font-size: 11px;
}
.bill-row {
  padding: 11px 14px;
  border-top: 1px solid var(--line);
  font-size: 12.5px;
}
.bill-row b,
.bill-row span {
  color: var(--ink);
  font-weight: 500;
}
.bill-row small {
  display: block;
  margin-top: 2px;
  color: var(--ink-3);
  font-size: 11px;
}
.bill-issue-list {
  display: grid;
  gap: 10px;
}
.bill-issue-card {
  padding: 12px 13px;
  border-radius: 8px;
  border: 1px solid var(--line-2);
  background: var(--white);
}
.bill-issue-card.t-amber {
  background: var(--amber-soft);
  border-color: #D5BF91;
}
.bill-issue-card.t-rust {
  background: var(--rust-soft);
  border-color: #D7B6A8;
}
.bill-issue-card b {
  color: var(--ink);
  font-size: 13px;
}
.bill-issue-meta {
  margin-top: 5px;
  color: var(--ink-3);
  font-size: 11.5px;
}
.bill-issue-card p {
  margin: 7px 0 0;
  color: var(--ink-2);
  font-size: 12.5px;
  line-height: 1.42;
}
.packet-safety {
  padding: 12px 24px;
  border-bottom: 1px solid var(--line);
  color: var(--ink-2);
  font-size: 13px;
  background: var(--green-soft);
}
.packet-actions {
  position: sticky;
  bottom: 0;
  z-index: 1;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 16px 24px 20px;
  background: var(--paper);
  border-top: 1px solid var(--line);
  box-shadow: 0 -10px 22px -20px rgba(27,31,42,.35);
}
.packet-primary,
.packet-secondary {
  height: 36px;
  padding: 0 14px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
}
.packet-primary {
  border: 1px solid var(--rail);
  background: var(--rail);
  color: var(--ink-on-rail);
}
.packet-primary:hover { background: var(--rail-2); }
.packet-secondary {
  border: 1px solid var(--line-2);
  background: var(--white);
  color: var(--ink-2);
}
.packet-secondary:hover { background: var(--paper-2); }
.generic-packet {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  padding: 18px 24px 2px;
}
.generic-packet-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 14px 15px;
}
.generic-packet-card h3 {
  margin: 5px 0 6px;
  font-size: 15px;
  font-weight: 500;
  color: var(--ink);
}
.generic-packet-card p {
  margin: 0;
  color: var(--ink-2);
  font-size: 12.5px;
  line-height: 1.45;
}

/* Ask the office */
.ask-office {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-3);
  padding: 18px 20px;
}
.ask-eyebrow {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-4);
  margin-bottom: 10px;
}
.ask-row { display: flex; gap: 8px; }
.ask-input {
  flex: 1;
  height: 40px;
  padding: 0 14px;
  border-radius: 8px;
  border: 1px solid var(--line-2);
  background: var(--white);
  font: inherit;
  font-size: 13.5px;
  color: var(--ink);
}
.ask-input::placeholder { color: var(--ink-4); font-style: italic; }
.ask-input:focus { outline: none; border-color: var(--ink-3); }
.ask-go {
  height: 40px;
  padding: 0 22px;
  border-radius: 8px;
  border: 0;
  background: var(--rail);
  color: var(--ink-on-rail);
  font-size: 13px;
  font-weight: 500;
}
.ask-go:hover { background: var(--rail-2); }
.ask-hint {
  margin-top: 8px;
  font-size: 12px;
  color: var(--ink-3);
}

/* =========================================================
   Decision desk — every employee page starts here
   ========================================================= */
.decision-desk {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.decision-hero {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-start;
}
.decision-hero p {
  margin: 6px 0 0;
  max-width: 760px;
  color: var(--ink-2);
  font-size: 13.5px;
  line-height: 1.45;
}
.decision-hero-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.decision-columns {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 14px;
}
.decision-panel {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}
.decision-panel-title {
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
  font-size: 15px;
  color: var(--ink);
  font-weight: 600;
}
.decision-panel.is-approve .decision-panel-title { border-left: 3px solid var(--green); }
.decision-panel.is-questions .decision-panel-title { border-left: 3px solid var(--amber); }
.decision-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border-bottom: 1px dashed var(--line);
}
.decision-action:last-child { border-bottom: 0; }
.decision-action b {
  display: block;
  color: var(--ink);
  font-size: 13.5px;
}
.decision-action span {
  display: block;
  margin-top: 3px;
  color: var(--ink-3);
  font-size: 12.2px;
  line-height: 1.35;
}
.decision-action em {
  font-style: normal;
  font-family: var(--f-mono);
  font-size: 10.5px;
  color: var(--ink-3);
  white-space: nowrap;
}
.decision-action button {
  height: 32px;
  border: 1px solid var(--ink);
  background: var(--ink);
  color: var(--paper);
  border-radius: 7px;
  padding: 0 11px;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}
.decision-action.is-question button {
  background: var(--white);
  color: var(--ink);
  border-color: var(--line-2);
}
.decision-empty {
  padding: 18px 16px;
  color: var(--ink-3);
  font-size: 13px;
}
.decision-handled {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 12px;
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 14px;
}
.decision-handled > div:last-child {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}
.decision-handled span {
  background: var(--paper-2);
  border: 1px solid var(--line);
  color: var(--ink-2);
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 11.5px;
}
.simple-support-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.compact-list {
  display: flex;
  flex-direction: column;
}
.compact-row {
  display: grid;
  grid-template-columns: minmax(0, 190px) minmax(0, 1fr) auto;
  gap: 12px;
  align-items: baseline;
  padding: 10px 0;
  border-bottom: 1px dashed var(--line);
}
.compact-row:last-child { border-bottom: 0; }
.compact-row b {
  color: var(--ink);
  font-size: 13px;
}
.compact-row span {
  color: var(--ink-3);
  font-size: 12.2px;
}
.compact-row em {
  font-style: normal;
  font-family: var(--f-mono);
  color: var(--amber);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.client-preview-note {
  padding: 12px 0 2px;
}
.client-preview-note b {
  display: block;
  color: var(--ink);
  font-size: 18px;
  margin-bottom: 5px;
}
.client-preview-note span {
  color: var(--ink-2);
  font-size: 13px;
  line-height: 1.45;
}

/* Simple office pages — one command surface, less noise */
.simple-office-page {
  max-width: 1180px;
  gap: 16px;
}
.simple-office-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: start;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-3);
  padding: 18px 20px;
}
.simple-office-hero p {
  max-width: 720px;
  margin: 8px 0 0;
  color: var(--ink-2);
  font-size: 13.5px;
  line-height: 1.45;
}
.simple-hero-counts {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.simple-hero-counts span {
  min-width: 92px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  padding: 9px 10px;
  color: var(--ink-3);
  font-size: 11.5px;
}
.simple-hero-counts b {
  display: block;
  color: var(--ink);
  font-size: 20px;
  line-height: 1;
}
.simple-office-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 14px;
  align-items: start;
}
.simple-main-panel,
.simple-chat-panel,
.simple-watch-panel,
.simple-done-strip {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-3);
  overflow: hidden;
}
.simple-section-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  padding: 15px 18px;
  border-bottom: 1px solid var(--line);
}
.simple-section-head h2,
.simple-section-head h3 {
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 18px;
  font-weight: 500;
  line-height: 1.25;
}
.simple-action-list {
  display: flex;
  flex-direction: column;
}
.simple-action-row {
  display: grid;
  gap: 10px;
  align-items: center;
  padding: 13px 14px;
  border-bottom: 1px solid var(--line);
  border-left: 3px solid var(--ink);
  background: var(--paper);
}
.simple-action-row.has-badge {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
}
.simple-action-row.no-badge {
  grid-template-columns: minmax(0, 1fr) auto auto;
}
.simple-action-row:last-child { border-bottom: 0; }
.simple-action-row.t-green { border-left-color: var(--green); }
.simple-action-row.t-amber { border-left-color: var(--amber); }
.simple-action-row.t-navy { border-left-color: var(--navy); }
.simple-action-row.t-rust { border-left-color: var(--rust); }
.simple-action-row b {
  display: block;
  color: var(--ink);
  font-size: 13.5px;
  line-height: 1.25;
}
.simple-action-row span {
  display: block;
  margin-top: 3px;
  color: var(--ink-3);
  font-size: 12.2px;
  line-height: 1.35;
}
.simple-primary,
.simple-secondary {
  height: 30px;
  padding: 0 10px;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 500;
  justify-self: end;
  white-space: nowrap;
}
.simple-primary {
  border: 1px solid var(--ink);
  background: var(--ink);
  color: var(--paper);
  min-width: 96px;
}
.simple-secondary {
  border: 1px solid var(--line-2);
  background: var(--white);
  color: var(--ink-2);
  min-width: 78px;
}
.simple-side-stack {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.simple-chat-panel {
  padding: 16px;
}
.simple-chat-box {
  display: flex;
  gap: 8px;
  margin-top: 9px;
}
.simple-chat-box input {
  flex: 1;
  height: 39px;
  border: 1px solid var(--line-2);
  border-radius: 8px;
  background: var(--white);
  padding: 0 12px;
  color: var(--ink);
  font: inherit;
  font-size: 13px;
}
.simple-chat-box input::placeholder { color: var(--ink-4); }
.simple-chat-box button {
  height: 39px;
  border: 1px solid var(--ink);
  border-radius: 8px;
  background: var(--ink);
  color: var(--paper);
  padding: 0 13px;
  font-size: 12px;
  font-weight: 500;
}
.simple-quick-asks {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 11px;
}
.simple-quick-asks button {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper-2);
  color: var(--ink-2);
  padding: 5px 8px;
  font-size: 11.5px;
}
.simple-watch-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px;
}
.simple-watch-list .alert-card {
  padding: 10px;
}
.simple-watch-list .alert-card span {
  font-size: 11.7px;
}
.simple-done-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.simple-done-item {
  padding: 12px 14px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.simple-done-item:nth-child(3n) { border-right: 0; }
.simple-done-item span {
  display: block;
  color: var(--ink-3);
  font-size: 11px;
}
.simple-done-item b {
  display: block;
  margin-top: 3px;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.3;
}

/* Office cockpit — Office Today is the operating surface */
.cockpit-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.cockpit-stat {
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 3px solid var(--ink);
  border-radius: 8px;
  padding: 13px 14px;
}
.cockpit-stat.t-green { border-left-color: var(--green); }
.cockpit-stat.t-amber { border-left-color: var(--amber); }
.cockpit-stat.t-rust { border-left-color: var(--rust); }
.cockpit-stat span,
.cockpit-stat small {
  display: block;
  color: var(--ink-3);
  font-size: 11.5px;
}
.cockpit-stat b {
  display: block;
  margin: 3px 0 2px;
  color: var(--ink);
  font-size: 28px;
  font-weight: 500;
  line-height: 1;
}
.cockpit-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 370px;
  gap: 14px;
  align-items: start;
}
.owner-desk {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-3);
  overflow: hidden;
}
.owner-desk-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
}
.owner-desk-head h2 {
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: -0.01em;
}
.owner-desk-head > span {
  margin-top: 18px;
  color: var(--ink-3);
  font-size: 13px;
}
.owner-desk-grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
}
.owner-desk-panel {
  min-width: 0;
  padding: 14px;
}
.owner-desk-panel + .owner-desk-panel {
  border-left: 1px solid var(--line);
  background: var(--white);
}
.owner-panel-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  padding: 0 2px;
}
.owner-panel-title b {
  color: var(--ink);
  font-size: 15px;
}
.owner-panel-title span {
  color: var(--ink-3);
  font-size: 12px;
}
.owner-desk-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 3px solid var(--ink);
  border-radius: 8px;
  margin-bottom: 9px;
  overflow: hidden;
}
.owner-desk-card.t-green { border-left-color: var(--green); }
.owner-desk-card.t-amber { border-left-color: var(--amber); }
.owner-desk-card.t-navy { border-left-color: var(--navy); }
.owner-desk-card.t-rust { border-left-color: var(--rust); }
.owner-desk-main {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 11px;
  padding: 13px 14px 11px;
  cursor: pointer;
}
.owner-desk-main:hover { background: var(--white); }
.owner-desk-main b {
  display: block;
  color: var(--ink);
  font-size: 13.5px;
  line-height: 1.25;
}
.owner-desk-main span:last-child {
  display: block;
  margin-top: 4px;
  color: var(--ink-3);
  font-size: 12.2px;
  line-height: 1.4;
}
.owner-desk-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  padding: 10px 12px;
  border-top: 1px solid var(--line);
  background: var(--paper-2);
}
.owner-primary,
.owner-secondary {
  height: 30px;
  padding: 0 11px;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 500;
}
.owner-primary {
  border: 1px solid var(--ink);
  background: var(--ink);
  color: var(--paper);
}
.owner-secondary {
  border: 1px solid var(--line-2);
  background: var(--white);
  color: var(--ink-2);
}
.cockpit-alerts,
.project-watch,
.completed-panel {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-3);
  overflow: hidden;
}
.cockpit-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  padding: 15px 18px;
  border-bottom: 1px solid var(--line);
}
.cockpit-panel-head h3 {
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 17px;
  font-weight: 500;
  line-height: 1.25;
}
.cockpit-panel-head > span {
  color: var(--ink-3);
  font-size: 12px;
  margin-top: 16px;
}
.cockpit-panel-head button {
  height: 30px;
  border: 1px solid var(--line-2);
  border-radius: 7px;
  background: var(--white);
  color: var(--ink-2);
  padding: 0 11px;
  font-size: 12px;
  font-weight: 500;
}
.alert-list {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 12px;
}
.alert-card {
  border: 1px solid var(--line);
  border-left: 3px solid var(--ink);
  border-radius: 8px;
  background: var(--white);
  padding: 12px;
}
.alert-card.t-amber { border-left-color: var(--amber); }
.alert-card.t-rust { border-left-color: var(--rust); }
.alert-card.t-navy { border-left-color: var(--navy); }
.alert-project {
  color: var(--ink-3);
  font-size: 11px;
  margin-bottom: 3px;
}
.alert-card b {
  display: block;
  color: var(--ink);
  font-size: 13.5px;
}
.alert-card span {
  display: block;
  margin-top: 4px;
  color: var(--ink-3);
  font-size: 12px;
  line-height: 1.4;
}
.alert-card button {
  height: 28px;
  margin-top: 10px;
  border: 1px solid var(--line-2);
  border-radius: 7px;
  background: var(--paper);
  color: var(--ink-2);
  padding: 0 10px;
  font-size: 11.5px;
  font-weight: 500;
}
.project-watch-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
}
.project-watch-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-top: 3px solid var(--ink);
  border-radius: 8px;
  padding: 12px;
  min-height: 150px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.project-watch-card.t-green { border-top-color: var(--green); }
.project-watch-card.t-amber { border-top-color: var(--amber); }
.project-watch-card.t-rust { border-top-color: var(--rust); }
.watch-top {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
}
.watch-top b {
  display: block;
  color: var(--ink);
  font-size: 14px;
}
.watch-top span {
  display: block;
  margin-top: 2px;
  color: var(--ink-3);
  font-size: 11.5px;
}
.watch-top em {
  font-style: normal;
  color: var(--amber);
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: right;
}
.watch-alert {
  color: var(--ink-2);
  font-size: 12.5px;
  line-height: 1.35;
}
.watch-bottom {
  margin-top: auto;
  border-top: 1px dashed var(--line);
  padding-top: 9px;
}
.watch-bottom span {
  display: block;
  color: var(--ink-3);
  font-size: 11.5px;
  line-height: 1.35;
}
.watch-bottom button {
  height: 28px;
  margin-top: 8px;
  border: 1px solid var(--line-2);
  border-radius: 7px;
  background: var(--paper);
  color: var(--ink-2);
  padding: 0 9px;
  font-size: 11.5px;
  font-weight: 500;
}
.cockpit-lower-grid {
  display: grid;
  grid-template-columns: 360px minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
}
.is-cockpit-chat {
  min-height: 100%;
}
.completed-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
}
.completed-item {
  padding: 13px 16px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.completed-item:nth-child(2n) { border-right: 0; }
.completed-item span {
  display: block;
  color: var(--ink-3);
  font-size: 11px;
}
.completed-item b {
  display: block;
  margin-top: 3px;
  color: var(--ink);
  font-size: 13.5px;
}
.completed-item small {
  display: block;
  margin-top: 4px;
  color: var(--ink-3);
  font-size: 11.5px;
  line-height: 1.35;
}
.office-running-line {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 14px;
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 14px;
}
.office-running-line > div:last-child {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.office-running-line span {
  border: 1px solid var(--line);
  background: var(--paper-2);
  border-radius: 999px;
  padding: 4px 8px;
  color: var(--ink-2);
  font-size: 11.5px;
}

.drilldown-note {
  display: inline-flex;
  max-width: 760px;
  margin-top: 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper);
  color: var(--ink-3);
  padding: 5px 9px;
  font-size: 12px;
  line-height: 1.25;
}

/* Functional Backoffice Today pages */
.backoffice-today {
  max-width: 1220px;
}
.backoffice-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 18px;
  align-items: start;
}
.backoffice-hero p {
  max-width: 760px;
  margin: 8px 0 0;
  color: var(--ink-2);
  font-size: 13.5px;
  line-height: 1.45;
}
.backoffice-hero-note {
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 3px solid var(--green);
  border-radius: 8px;
  padding: 12px 13px;
}
.backoffice-hero-note b {
  display: block;
  color: var(--ink);
  font-size: 13px;
}
.backoffice-hero-note span {
  display: block;
  margin-top: 4px;
  color: var(--ink-3);
  font-size: 12px;
  line-height: 1.35;
}
.backoffice-command-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 14px;
  align-items: start;
}
.backoffice-card,
.backoffice-chat {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-3);
  overflow: hidden;
}
.backoffice-action-list {
  display: flex;
  flex-direction: column;
}
.backoffice-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
  border-left: 3px solid var(--ink);
}
.backoffice-action:last-child { border-bottom: 0; }
.backoffice-action.t-green { border-left-color: var(--green); }
.backoffice-action.t-amber { border-left-color: var(--amber); }
.backoffice-action.t-rust { border-left-color: var(--rust); }
.backoffice-action b {
  display: block;
  color: var(--ink);
  font-size: 13.5px;
}
.backoffice-action span {
  display: block;
  margin-top: 3px;
  color: var(--ink-3);
  font-size: 12.2px;
  line-height: 1.35;
}
.backoffice-action button {
  height: 31px;
  border: 1px solid var(--ink);
  border-radius: 7px;
  background: var(--ink);
  color: var(--paper);
  padding: 0 11px;
  font-size: 12px;
  font-weight: 500;
}
.backoffice-action button.is-ghost {
  border-color: var(--line-2);
  background: var(--white);
  color: var(--ink-2);
}
.backoffice-chat {
  padding: 17px;
}
.backoffice-chat h3 {
  margin: 4px 0 12px;
  color: var(--ink);
  font-size: 18px;
  font-weight: 500;
}
.office-chat-box {
  display: flex;
  gap: 8px;
}
.office-chat-box input {
  flex: 1;
  height: 40px;
  border: 1px solid var(--line-2);
  border-radius: 8px;
  background: var(--white);
  padding: 0 12px;
  color: var(--ink);
  font: inherit;
  font-size: 13px;
}
.office-chat-box input::placeholder { color: var(--ink-4); }
.office-chat-box button {
  height: 40px;
  border: 1px solid var(--ink);
  border-radius: 8px;
  background: var(--ink);
  color: var(--paper);
  padding: 0 14px;
  font-size: 12.5px;
  font-weight: 500;
}
.quick-asks {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
}
.quick-asks button {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper-2);
  color: var(--ink-2);
  padding: 5px 9px;
  font-size: 11.5px;
}
.backoffice-bottom-grid {
  display: grid;
  grid-template-columns: 380px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

/* =========================================================
   Project filter — one clear house selector across the office
   ========================================================= */
.project-filter-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 14px;
  margin-bottom: 18px;
}
.project-filter-bar b {
  display: block;
  margin-top: 2px;
  color: var(--ink);
  font-size: 14px;
}
.project-filter-bar span {
  display: block;
  color: var(--ink-3);
  font-size: 12px;
}
.project-filter-pills {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.project-filter-pills button {
  height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid var(--line-2);
  background: var(--white);
  color: var(--ink-2);
  font-size: 12px;
}
.project-filter-pills button:hover { background: var(--paper-2); }
.project-filter-pills button.is-active {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}

/* =========================================================
   Trade Coordinator — budget snapshot by project
   ========================================================= */
.trade-budget-card { overflow: hidden; }
.trade-budget-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
}
.trade-budget-head h3 {
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 18px;
  font-weight: 500;
}
.trade-budget-counts {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.trade-budget-counts span {
  border: 1px solid var(--line);
  background: var(--paper-2);
  border-radius: 999px;
  padding: 5px 8px;
  color: var(--ink-3);
  font-size: 11.5px;
}
.trade-budget-counts b { color: var(--ink); }
.trade-budget-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
}
.trade-budget-table {
  border-right: 1px solid var(--line);
}
.trade-budget-row {
  width: 100%;
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr) 130px 100px;
  gap: 12px;
  align-items: center;
  padding: 11px 14px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: var(--paper);
  text-align: left;
  color: var(--ink-2);
}
.trade-budget-row.is-head {
  background: var(--paper-2);
  color: var(--ink-3);
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  pointer-events: none;
}
.trade-budget-row:hover { background: var(--white); }
.trade-budget-row.is-selected {
  background: var(--white);
  box-shadow: inset 3px 0 0 var(--amber);
}
.trade-budget-row b {
  display: block;
  color: var(--ink);
  font-size: 12.8px;
}
.trade-budget-row small {
  display: block;
  margin-top: 2px;
  color: var(--ink-3);
  font-size: 11px;
}
.trade-budget-row > span:last-child {
  width: max-content;
  padding: 3px 7px;
  border-radius: 999px;
  background: var(--paper-2);
  color: var(--ink-3);
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.trade-budget-row.is-actual > span:last-child { background: var(--green-soft); color: var(--green); }
.trade-budget-row.is-estimated > span:last-child { background: var(--amber-soft); color: var(--amber); }
.trade-budget-row.is-missing > span:last-child { background: var(--rust-soft); color: var(--rust); }
.trade-budget-row.is-question > span:last-child { background: var(--navy-soft); color: var(--navy); }
.trade-budget-detail {
  padding: 18px;
  background: var(--white);
  border-left: 3px solid var(--amber);
}
.trade-budget-detail.is-actual { border-left-color: var(--green); }
.trade-budget-detail.is-missing { border-left-color: var(--rust); }
.trade-budget-detail.is-question { border-left-color: var(--navy); }
.trade-budget-detail h4 {
  margin: 5px 0 12px;
  color: var(--ink);
  font-size: 17px;
  font-weight: 500;
}
.trade-detail-money {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 12px;
}
.trade-detail-money div {
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
}
.trade-detail-money span {
  display: block;
  color: var(--ink-3);
  font-size: 11px;
}
.trade-detail-money b {
  display: block;
  margin-top: 3px;
  color: var(--ink);
  font-size: 14px;
}
.trade-budget-detail p {
  margin: 0 0 14px;
  color: var(--ink-2);
  font-size: 13px;
  line-height: 1.45;
}
.trade-budget-detail button {
  height: 34px;
  padding: 0 12px;
  border: 1px solid var(--ink);
  border-radius: 7px;
  background: var(--ink);
  color: var(--paper);
  font-size: 12px;
  font-weight: 500;
}

/* =========================================================
   Scheduler — simple approval view for dates
   ========================================================= */
.schedule2 { max-width: 1180px; }
.scheduler-handoff-card,
.scheduler-table-card,
.scheduler-detail-card { overflow: hidden; }
.scheduler-card-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
}
.scheduler-card-head h3 {
  max-width: 720px;
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 17px;
  font-weight: 500;
  line-height: 1.35;
}
.scheduler-counts {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.scheduler-counts span {
  border: 1px solid var(--line);
  background: var(--paper-2);
  border-radius: 999px;
  padding: 5px 8px;
  color: var(--ink-3);
  font-size: 11.5px;
}
.scheduler-counts b { color: var(--ink); }
.handoff-flow {
  display: grid;
  grid-template-columns: 1fr 24px 1fr 24px 1fr;
  gap: 10px;
  padding: 16px 18px 18px;
  align-items: stretch;
}
.handoff-step {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 13px;
}
.handoff-step small {
  display: block;
  color: var(--ink-3);
  font-size: 11px;
}
.handoff-step b {
  display: block;
  margin-top: 4px;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.3;
}
.handoff-step span {
  display: block;
  margin-top: 7px;
  color: var(--amber);
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.handoff-arrow {
  display: grid;
  place-items: center;
  color: var(--ink-4);
  font-family: var(--f-mono);
  font-size: 14px;
}
.scheduler-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 14px;
  align-items: start;
}
.scheduler-table-head,
.scheduler-row {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr) 96px 116px;
  gap: 12px;
  align-items: center;
}
.scheduler-table-head {
  padding: 11px 14px;
  background: var(--paper-2);
  border-bottom: 1px solid var(--line);
  color: var(--ink-3);
  font-family: var(--f-mono);
  font-size: 9.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.scheduler-row {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: var(--paper);
  padding: 12px 14px;
  text-align: left;
  color: var(--ink-2);
}
.scheduler-row:hover { background: var(--white); }
.scheduler-row.is-selected {
  background: var(--white);
  box-shadow: inset 3px 0 0 var(--amber);
}
.scheduler-row b {
  display: block;
  color: var(--ink);
  font-size: 13px;
}
.scheduler-row small {
  display: block;
  margin-top: 2px;
  color: var(--ink-3);
  font-size: 11px;
  line-height: 1.3;
}
.scheduler-row > span:nth-child(3) {
  color: var(--ink);
  font-family: var(--f-mono);
  font-size: 11px;
}
.scheduler-row > span:last-child {
  width: max-content;
  padding: 3px 7px;
  border-radius: 999px;
  background: var(--paper-2);
  color: var(--ink-3);
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.scheduler-row.is-ready > span:last-child { background: var(--green-soft); color: var(--green); }
.scheduler-row.is-soft,
.scheduler-row.is-question { box-shadow: inset 2px 0 0 var(--amber-soft); }
.scheduler-row.is-soft > span:last-child,
.scheduler-row.is-question > span:last-child { background: var(--amber-soft); color: var(--amber); }
.scheduler-row.is-missing > span:last-child { background: var(--rust-soft); color: var(--rust); }
.scheduler-detail {
  padding: 18px;
  background: var(--white);
  border-left: 3px solid var(--amber);
}
.scheduler-detail-card.is-ready .scheduler-detail { border-left-color: var(--green); }
.scheduler-detail-card.is-missing .scheduler-detail { border-left-color: var(--rust); }
.scheduler-detail h3 {
  margin: 5px 0 12px;
  color: var(--ink);
  font-size: 18px;
  font-weight: 500;
}
.scheduler-detail-facts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 12px;
}
.scheduler-detail-facts div {
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
}
.scheduler-detail-facts span {
  display: block;
  color: var(--ink-3);
  font-size: 11px;
}
.scheduler-detail-facts b {
  display: block;
  margin-top: 3px;
  color: var(--ink);
  font-size: 13px;
}
.scheduler-detail p {
  margin: 0 0 14px;
  color: var(--ink-2);
  font-size: 13px;
  line-height: 1.45;
}
.scheduler-detail button {
  height: 34px;
  padding: 0 12px;
  border: 1px solid var(--ink);
  border-radius: 7px;
  background: var(--ink);
  color: var(--paper);
  font-size: 12px;
  font-weight: 500;
}

/* =========================================================
   V2 simplified GC interface
   ========================================================= */

.v2-screen {
  max-width: 1040px;
  margin: 0 auto;
  padding-bottom: 44px;
}

.promise-line {
  margin: 0 0 18px;
  padding: 12px 14px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink-2);
  font-size: 15px;
  line-height: 1.45;
  box-shadow: var(--shadow-1);
}

.today-hero-v2,
.plain-head-v2,
.staff-head-v2 {
  background: transparent;
  border-bottom: 1px solid var(--line);
  padding: 8px 0 20px;
  margin-bottom: 18px;
}

.today-hero-v2 {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
}

.today-hero-v2 h1,
.plain-head-v2 h1,
.staff-head-v2 h1 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(30px, 4vw, 46px);
  line-height: 1.05;
  font-weight: 600;
  letter-spacing: 0;
}

.today-hero-v2 p,
.plain-head-v2 p,
.staff-head-v2 p {
  margin: 10px 0 0;
  max-width: 760px;
  color: var(--ink-2);
  font-size: 18px;
  line-height: 1.5;
}

.today-hero-v2 button,
.tour-link-v2 button,
.ask-input-v2 button,
.need-actions-v2 button,
.details-actions-v2 button,
.staff-strip-v2 button,
.upload-zone-v2 button,
.job-list-v2 button,
.incoming-card-v2 button,
.history-table-v2 button,
.done-v2 button {
  min-height: 44px;
  border: 1px solid var(--line-2);
  border-radius: 8px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 16px;
  font-weight: 600;
}

.ask-bar-v2 {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  box-shadow: var(--shadow-1);
  margin: 0 0 22px;
}

.ask-input-v2 {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.ask-input-v2 input {
  min-height: 48px;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-size: 18px;
  outline: 0;
}

.ask-input-v2 button,
.need-actions-v2 button.is-primary,
.details-actions-v2 button.is-primary {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}

.ask-examples-v2 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.ask-examples-v2 button {
  border: 0;
  background: transparent;
  color: var(--ink-3);
  padding: 6px 2px;
  font-size: 14px;
  text-align: left;
}

.today-list-v2,
.staff-needs-v2,
.job-list-v2,
.incoming-list-v2,
.history-table-v2,
.tour-steps-v2 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.today-group-v2 {
  display: grid;
  gap: 8px;
}

.today-group-head-v2 {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--ink);
}

.today-group-head-v2 h2,
.staff-block-v2 h2,
.job-section-v2 h2,
.staff-index-group-v2 h2,
.tour-link-v2 h2,
.done-v2 h2 {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0;
}

.today-count-v2 {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--ink);
  color: var(--paper);
  font-weight: 600;
}

.need-card-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 4px solid var(--ink);
  border-radius: 8px;
  padding: 18px;
  box-shadow: var(--shadow-1);
}

.need-card-v2.t-green { border-left-color: var(--green); }
.need-card-v2.t-amber { border-left-color: var(--amber); }
.need-card-v2.t-rust { border-left-color: var(--rust); }
.need-card-v2.t-navy { border-left-color: var(--navy); }

.need-card-v2 h3 {
  margin: 0;
  font-size: 20px;
  line-height: 1.25;
  font-weight: 600;
  letter-spacing: 0;
  color: var(--ink);
}

.need-card-v2 p {
  margin: 8px 0 0;
  color: var(--ink-2);
  font-size: 16px;
  line-height: 1.5;
}

.need-facts-v2 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.need-facts-v2 span {
  display: block;
  background: rgba(255,255,255,.58);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  color: var(--ink-2);
  font-size: 14px;
  line-height: 1.35;
}

.need-facts-v2 b {
  display: block;
  color: var(--ink-3);
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 4px;
}

.need-source-v2 {
  margin-top: 12px;
  color: var(--ink-3);
  font-size: 14px;
}

.need-actions-v2,
.details-actions-v2 {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.done-v2,
.staff-block-v2,
.staff-strip-v2,
.staff-banner-v2,
.upload-zone-v2,
.mini-list-v2,
.counter-row-v2,
.filtered-v2,
.qa-log-v2,
.tag-table-v2,
.job-section-v2,
.tour-link-v2 {
  margin-top: 20px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  box-shadow: var(--shadow-1);
}

.done-v2 div,
.done-lines-v2,
.bullet-grid-v2,
.mini-list-v2,
.filtered-v2,
.qa-log-v2 {
  display: grid;
  gap: 8px;
}

.done-v2 p,
.done-lines-v2 p,
.bullet-grid-v2 p,
.mini-list-v2 p,
.filtered-v2 p,
.qa-log-v2 p {
  margin: 0;
  color: var(--ink-2);
  font-size: 16px;
  line-height: 1.5;
}

.done-v2 button {
  margin-top: 14px;
}

.details-backdrop-v2 {
  position: fixed;
  inset: 0;
  z-index: 60;
  background: rgba(18,20,23,.46);
  display: grid;
  align-items: end;
}

.details-sheet-v2 {
  width: min(920px, calc(100vw - 28px));
  max-height: calc(100vh - 32px);
  overflow: auto;
  margin: 0 auto 16px;
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: 12px;
  padding: 22px;
  position: relative;
  box-shadow: var(--shadow-3);
}

.details-close-v2 {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--paper);
  display: grid;
  place-items: center;
}

.details-head-v2 span,
.staff-head-v2 > span {
  color: var(--ink-3);
  font-size: 14px;
  font-weight: 600;
}

.details-head-v2 h2 {
  margin: 4px 44px 0 0;
  font-size: 28px;
  line-height: 1.15;
  letter-spacing: 0;
}

.details-head-v2 p {
  margin: 10px 44px 0 0;
  color: var(--ink-2);
  font-size: 17px;
  line-height: 1.5;
}

.details-facts-v2 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.details-facts-v2 b,
.line-tag-v2 {
  border: 1px solid var(--line);
  background: var(--paper-2);
  border-radius: 999px;
  color: var(--ink);
  padding: 6px 10px;
  font-size: 13px;
  font-weight: 600;
}

.details-columns-v2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-top: 18px;
}

.details-columns-v2 > div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
}

.details-columns-v2 h3,
.filtered-v2 h3,
.upload-zone-v2 h3 {
  margin: 0 0 10px;
  font-size: 18px;
}

.details-columns-v2 p {
  margin: 8px 0 0;
  color: var(--ink-2);
  font-size: 15px;
}

.outside-note-v2 {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-top: 14px;
  padding: 12px;
  background: var(--amber-soft);
  border-radius: 8px;
  color: var(--ink-2);
  font-size: 15px;
}

.details-actions-v2 {
  margin-top: 16px;
}

.staff-sentence-v2 {
  color: var(--ink) !important;
  font-weight: 600;
}

.staff-strip-v2 {
  border-left: 4px solid var(--amber);
}

.staff-strip-v2 h3,
.staff-strip-v2 p,
.upload-zone-v2 p,
.tour-link-v2 p {
  margin: 0 0 10px;
  color: var(--ink-2);
  font-size: 16px;
}

.staff-strip-v2 h3 {
  color: var(--ink);
  font-size: 20px;
}

.staff-banner-v2 {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--navy-soft);
  color: var(--ink);
}

.counter-row-v2 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.counter-row-v2 div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: rgba(255,255,255,.5);
}

.counter-row-v2 b {
  display: block;
  font-size: 30px;
  line-height: 1;
}

.counter-row-v2 span {
  display: block;
  margin-top: 6px;
  color: var(--ink-3);
}

.upload-zone-v2 {
  border: 2px dashed var(--line-2);
  text-align: center;
}

.tag-table-v2 {
  display: grid;
  gap: 8px;
}

.tag-table-v2 div {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) auto minmax(170px, 1fr);
  gap: 10px;
  align-items: center;
  border-bottom: 1px solid var(--line);
  padding: 10px 0;
}

.tag-table-v2 div:last-child { border-bottom: 0; }

.tag-table-v2 small {
  grid-column: 1 / -1;
  color: var(--ink-3);
  font-size: 13px;
}

.staff-index-group-v2 {
  margin-top: 18px;
}

.staff-index-group-v2 > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.staff-index-group-v2 button,
.job-tabs-v2 button {
  min-height: 54px;
  border: 1px solid var(--line);
  background: var(--paper);
  border-radius: 8px;
  padding: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--ink);
}

.job-tabs-v2 {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 8px;
  margin-bottom: 12px;
}

.job-tabs-v2 button {
  white-space: nowrap;
  min-width: max-content;
}

.job-tabs-v2 button.is-active {
  background: var(--ink);
  color: var(--paper);
  border-color: var(--ink);
}

.job-list-v2 article,
.incoming-card-v2,
.history-table-v2 article,
.tour-steps-v2 article {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
}

.job-list-v2 h3,
.incoming-card-v2 h2,
.history-table-v2 h2,
.tour-steps-v2 h2 {
  margin: 0;
  font-size: 20px;
}

.job-list-v2 p,
.incoming-card-v2 p,
.history-table-v2 p,
.tour-steps-v2 p {
  margin: 8px 0 0;
  color: var(--ink-2);
  font-size: 16px;
}

.job-list-v2 small,
.incoming-card-v2 small,
.history-table-v2 small {
  display: block;
  margin-top: 10px;
  color: var(--ink-3);
  font-size: 14px;
}

.job-list-v2 button,
.incoming-card-v2 button,
.history-table-v2 button {
  margin-top: 12px;
}

.incoming-card-v2 > span,
.history-table-v2 article > span,
.tour-steps-v2 article > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  min-height: 28px;
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--paper-2);
  color: var(--ink);
  font-weight: 600;
  margin-bottom: 10px;
}

.tour-steps-v2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.estimator-start-v2,
.estimator-grid-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
  gap: 16px;
  align-items: stretch;
  margin-top: 20px;
}

.estimator-current-v2,
.estimator-grid-v2 > article,
.estimator-flow-v2 article {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  box-shadow: var(--shadow-1);
}

.estimator-current-v2 > span {
  color: var(--ink-3);
  font-size: 14px;
  font-weight: 600;
}

.estimator-current-v2 h2,
.estimator-grid-v2 h2 {
  margin: 6px 0 8px;
  color: var(--ink);
  font-size: 22px;
  line-height: 1.2;
  letter-spacing: 0;
}

.estimator-current-v2 p {
  margin: 0;
  color: var(--ink-2);
  font-size: 16px;
  line-height: 1.5;
}

.estimator-current-v2 div {
  margin-top: 18px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.55);
}

.estimator-current-v2 b {
  display: block;
  color: var(--ink);
  font-size: 34px;
  line-height: 1;
}

.estimator-current-v2 small {
  display: block;
  margin-top: 6px;
  color: var(--ink-3);
}

.estimator-current-v2 button,
.estimate-list-v2 button {
  min-height: 44px;
  margin-top: 14px;
  border: 1px solid var(--line-2);
  border-radius: 8px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 16px;
  font-weight: 600;
}

.estimator-flow-v2 {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin-top: 20px;
}

.estimator-flow-v2 article {
  padding: 14px;
}

.estimator-flow-v2 span {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--ink);
  color: var(--paper);
  font-weight: 600;
}

.estimator-flow-v2 h2 {
  margin: 12px 0 6px;
  font-size: 16px;
  line-height: 1.25;
}

.estimator-flow-v2 p,
.estimate-list-v2 p {
  margin: 0;
  color: var(--ink-2);
  font-size: 14px;
  line-height: 1.45;
}

.estimate-table-v2,
.estimate-list-v2,
.estimate-budget-v2 {
  display: grid;
  gap: 8px;
}

.estimate-table-v2 div,
.estimate-list-v2 div,
.estimate-budget-v2 div {
  display: grid;
  gap: 6px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}

.estimate-table-v2 div {
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
}

.estimate-table-v2 div:last-child,
.estimate-list-v2 div:last-child,
.estimate-budget-v2 div:last-child {
  border-bottom: 0;
}

.estimate-table-v2 b,
.estimate-list-v2 b,
.estimate-budget-v2 b {
  color: var(--ink);
  font-size: 15px;
}

.estimate-table-v2 span,
.estimate-list-v2 span {
  color: var(--ink-2);
  font-size: 14px;
}

.estimate-table-v2 em,
.estimate-list-v2 em,
.estimate-budget-v2 em {
  width: max-content;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper-2);
  color: var(--ink);
  padding: 4px 8px;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
}

.estimate-budget-v2 div {
  grid-template-columns: 70px minmax(0, 1fr) auto auto;
  align-items: center;
}

.estimate-budget-v2 strong {
  color: var(--ink);
  font-size: 15px;
  text-align: right;
}

.estimate-budget-v2 small {
  grid-column: 2 / -1;
  color: var(--ink-3);
  font-size: 13px;
}

@media (max-width: 860px) {
  html, body { font-size: 20px; }
  .stage {
    grid-template-columns: 1fr;
  }
  .rail {
    display: contents;
  }
  .rail-brand,
  .rail-group,
  .rail-staff-groups,
  .rail-foot { display: none; }
  .main {
    padding: 18px 18px 96px;
  }
  .today-hero-v2 {
    display: block;
  }
  .today-hero-v2 button {
    margin-top: 14px;
  }
  .need-card-v2 {
    grid-template-columns: 1fr;
  }
  .need-facts-v2,
  .details-columns-v2,
  .counter-row-v2,
  .estimator-start-v2,
  .estimator-grid-v2,
  .estimator-flow-v2,
  .staff-index-group-v2 > div,
  .tour-steps-v2,
  .estimate-budget-v2 div,
  .estimate-table-v2 div,
  .tag-table-v2 div {
    grid-template-columns: 1fr;
  }
  .need-actions-v2,
  .details-actions-v2 {
    justify-content: stretch;
  }
  .need-actions-v2 button,
  .details-actions-v2 button {
    flex: 1 1 120px;
  }
  .ask-input-v2 {
    grid-template-columns: auto 1fr;
  }
  .ask-input-v2 button {
    grid-column: 1 / -1;
  }
}

.mobile-tabbar-v6 {
  display: none;
}

/* Round 2 tightening */
.today-v2 {
  max-width: 900px;
}

.today-v2 .today-hero-v2 {
  padding-bottom: 14px;
  margin-bottom: 14px;
}

.today-v2 .today-hero-v2 h1 {
  font-size: clamp(28px, 3.3vw, 42px);
}

.today-v2 .today-hero-v2 p {
  font-size: 17px;
}

.today-v2 .ask-bar-v2 {
  margin-bottom: 14px;
}

.today-list-v2 {
  gap: 8px;
}

.need-card-v2 {
  display: block;
  padding: 0;
  cursor: pointer;
}

.need-line-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 13px 14px;
}

.need-line-copy-v2 {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}

.need-line-copy-v2 h3 {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  margin: 0;
  font-size: 17px;
  line-height: 1.25;
}

.need-line-copy-v2 p {
  margin: 0;
  color: var(--ink-3);
  font-size: 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.need-count-pill-v2 {
  display: inline-grid;
  min-width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 999px;
  background: var(--paper-2);
  color: var(--ink-2);
  font-size: 12px;
}

.need-expanded-v2 {
  border-top: 1px solid var(--line);
  padding: 14px;
  background: rgba(255,255,255,.38);
}

.need-expanded-v2 > p {
  margin: 0;
  color: var(--ink-2);
  font-size: 15px;
  line-height: 1.45;
}

.done-collapsed-v2 {
  padding: 13px 14px;
  cursor: pointer;
}

.done-collapsed-v2 h2 {
  font-size: 17px;
}

.done-collapsed-v2 > p {
  margin: 6px 0 0;
  color: var(--ink-3);
  font-size: 15px;
}

.done-collapsed-v2 > div {
  margin-top: 12px;
}

.estimator-v2 {
  max-width: 1040px;
}

.estimator-header-v2 {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  box-shadow: var(--shadow-1);
}

.estimator-header-top-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
}

.estimator-header-top-v2 span {
  color: var(--ink-3);
  font-size: 14px;
  font-weight: 600;
}

.estimator-header-top-v2 h1 {
  margin: 4px 0 6px;
  color: var(--ink);
  font-size: clamp(30px, 4vw, 44px);
  line-height: 1.05;
  letter-spacing: 0;
}

.estimator-header-top-v2 p,
.estimator-next-v2 p {
  margin: 0;
  color: var(--ink-2);
  font-size: 17px;
  line-height: 1.45;
}

.estimator-header-top-v2 button,
.estimator-next-v2 button {
  min-height: 44px;
  border: 1px solid var(--line-2);
  border-radius: 8px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 14px;
  font-weight: 600;
}

.estimator-header-actions-v2 {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: flex-end;
  gap: 10px;
}

.job-select-v2 {
  display: grid;
  gap: 5px;
  min-width: 250px;
}

.job-select-v2 span {
  color: var(--ink-3);
  font-size: 13px;
  font-weight: 700;
}

.job-select-v2 select {
  min-height: 44px;
  border: 1px solid var(--line-2);
  border-radius: 8px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 34px 0 12px;
  font: inherit;
  font-weight: 650;
}

.job-select-v2 select:focus {
  outline: 2px solid rgba(37, 78, 63, .25);
  outline-offset: 2px;
}

.budget-state-v2 {
  margin-top: 16px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.45);
}

.budget-state-v2 b {
  display: block;
  margin-bottom: 10px;
  color: var(--ink);
}

.budget-state-v2 div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.budget-state-v2 span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 10px;
  background: var(--paper);
  color: var(--ink-2);
  font-size: 13px;
  font-weight: 600;
}

.budget-state-v2 span::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 7px;
  background: var(--ink-4);
}

.budget-state-v2 .is-done::before { background: var(--green); }
.budget-state-v2 .is-working::before { background: var(--amber); }
.budget-state-v2 .is-waiting::before { background: var(--ink-4); }

.estimator-next-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-top: 14px;
}

.estimator-next-v2 button {
  background: var(--ink);
  color: var(--paper);
  border-color: var(--ink);
}

.estimator-tabs-card-v2 {
  margin-top: 20px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  box-shadow: var(--shadow-1);
}

.estimator-tabs-card-v2 .job-tabs-v2 {
  margin-bottom: 12px;
}

.estimator-tabs-card-v2 .job-tabs-v2 span {
  color: inherit;
  opacity: .7;
  margin-left: 4px;
}

.estimator-tab-panel-v2 {
  display: grid;
  gap: 10px;
}

.linked-row-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: rgba(255,255,255,.42);
}

.linked-row-v2 h3 {
  margin: 0;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.25;
}

.linked-row-v2 p {
  margin: 7px 0 0;
  color: var(--ink-2);
  font-size: 15px;
}

.linked-row-v2 small {
  display: block;
  margin-top: 6px;
  color: var(--ink-3);
  font-size: 14px;
  line-height: 1.4;
}

.staff-group-title-v2 {
  width: 100%;
  min-height: 44px;
  border: 0;
  background: transparent;
  padding: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--ink);
}

.staff-group-title-v2 span {
  color: var(--ink-3);
  font-weight: 600;
}

.staff-index-group-v2.is-collapsed {
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.tour-overlay-v2 {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  background: rgba(18,20,23,.48);
  padding: 22px;
}

.tour-card-v2 {
  width: min(680px, 100%);
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: 12px;
  padding: 24px;
  box-shadow: var(--shadow-3);
}

.tour-card-v2 h1 {
  margin: 10px 0 8px;
  color: var(--ink);
  font-size: 34px;
  line-height: 1.1;
}

.tour-card-v2 p {
  margin: 0;
  color: var(--ink-2);
  font-size: 18px;
  line-height: 1.5;
}

.tour-progress-v2 {
  display: flex;
  gap: 6px;
  margin-top: 20px;
}

.tour-progress-v2 span {
  height: 4px;
  flex: 1;
  border-radius: 999px;
  background: var(--line);
}

.tour-progress-v2 span.is-active {
  background: var(--ink);
}

.tour-actions-v2 {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 22px;
}

.tour-actions-v2 button {
  min-height: 44px;
  border: 1px solid var(--line-2);
  border-radius: 8px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 16px;
  font-weight: 600;
}

.tour-actions-v2 button.is-primary {
  background: var(--ink);
  color: var(--paper);
  border-color: var(--ink);
}

/* Round 3 background-office model */
.rail-foot .who button {
  display: inline-flex;
  width: max-content;
  min-height: 28px;
  margin-top: 6px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 7px;
  background: transparent;
  color: rgba(255,255,255,.72);
  padding: 0 8px;
  font-size: 11px;
}

.today-hero-v2 small {
  display: block;
  margin-top: 8px;
  color: var(--ink-3);
  font-size: 14px;
  line-height: 1.4;
}

.see-all-v3,
.background-strip-v3 button,
.staff-controls-v3 button,
.channels-head-v3 button,
.channel-filters-v3 button,
.channel-row-v3 button,
.nudge-templates-v3 button,
.approval-sentences-v3 button,
.quiet-hours-v3 button,
.estimator-flow-v3 button {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 12px;
  font-weight: 600;
}

.see-all-v3 {
  white-space: nowrap;
  align-self: start;
}

.background-strip-v3 {
  margin: 0 0 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.5);
}

.background-strip-v3 > button {
  width: 100%;
  min-height: 48px;
  border: 0;
  background: transparent;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  text-align: left;
}

.background-strip-v3 span {
  color: var(--ink-3);
  font-weight: 600;
}

.background-strip-v3 b {
  color: var(--ink-2);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.background-strip-v3 > div {
  border-top: 1px solid var(--line);
  padding: 12px;
}

.background-strip-v3 p {
  margin: 0 0 10px;
  color: var(--ink-2);
  font-size: 15px;
}

/* Today inbox refresh */
.today-inbox-page-v4 {
  max-width: 980px;
}

.today-inbox-page-v4 .today-hero-v2 {
  border-bottom: 0;
  margin-bottom: 10px;
  padding-bottom: 0;
}

.today-inbox-page-v4 .today-hero-v2 h1 {
  font-size: clamp(30px, 3.4vw, 42px);
}

.today-inbox-page-v4 .today-hero-v2 p {
  max-width: 650px;
  color: var(--ink-2);
  font-size: 16px;
  line-height: 1.42;
}

.today-inbox-page-v4 .background-strip-v3 {
  margin-bottom: 14px;
  background: rgba(255,255,255,.58);
  box-shadow: 0 1px 0 rgba(18,20,23,.03);
}

.today-workspace-v4 {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.today-inbox-v4,
.today-chat-v4 {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.7);
  box-shadow: 0 16px 42px rgba(34, 30, 24, .07);
}

.today-inbox-v4 {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.today-inbox-head-v4 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 0 4px 8px;
}

.today-inbox-head-v4 span,
.today-chat-v4 > span {
  color: var(--ink-3);
  font-size: 13px;
  font-weight: 750;
}

.today-inbox-head-v4 h2,
.today-chat-v4 h2 {
  margin: 2px 0 4px;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.15;
}

.today-inbox-head-v4 p,
.today-chat-v4 p {
  margin: 0;
  color: var(--ink-3);
  font-size: 14px;
  line-height: 1.45;
}

.today-inbox-page-v4 .today-list-v2 {
  gap: 12px;
}

.today-inbox-page-v4 .inline-row-v5 {
  position: relative;
  overflow: hidden;
  border-color: rgba(27, 31, 42, .14);
  background:
    linear-gradient(90deg, rgba(82, 101, 76, .16), rgba(82, 101, 76, .16)) 0 0 / 5px 100% no-repeat,
    linear-gradient(180deg, #FFFFFF 0%, #F7F2E7 100%);
  box-shadow:
    0 1px 0 rgba(255,255,255,.8) inset,
    0 1px 0 rgba(27,31,42,.04),
    0 14px 32px rgba(34, 30, 24, .075);
}

.today-inbox-page-v4 .inline-row-v5.t-amber {
  background:
    linear-gradient(90deg, rgba(167, 124, 53, .22), rgba(167, 124, 53, .22)) 0 0 / 5px 100% no-repeat,
    linear-gradient(180deg, #FFFFFF 0%, #F7F2E7 100%);
}

.today-inbox-page-v4 .inline-row-v5.t-green {
  background:
    linear-gradient(90deg, rgba(82, 101, 76, .22), rgba(82, 101, 76, .22)) 0 0 / 5px 100% no-repeat,
    linear-gradient(180deg, #FFFFFF 0%, #F7F2E7 100%);
}

.today-inbox-page-v4 .inline-row-v5.t-navy {
  background:
    linear-gradient(90deg, rgba(52, 65, 79, .22), rgba(52, 65, 79, .22)) 0 0 / 5px 100% no-repeat,
    linear-gradient(180deg, #FFFFFF 0%, #F7F2E7 100%);
}

.today-inbox-page-v4 .inline-row-v5:hover {
  border-color: rgba(27, 31, 42, .22);
  box-shadow:
    0 1px 0 rgba(255,255,255,.85) inset,
    0 1px 0 rgba(27,31,42,.05),
    0 18px 38px rgba(34, 30, 24, .105);
}

.today-inbox-page-v4 .need-card-v2 {
  border: 1px solid rgba(31,34,38,.1);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(250,247,240,.92));
  box-shadow: 0 10px 24px rgba(34, 30, 24, .055);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.today-inbox-page-v4 .need-card-v2:hover {
  border-color: rgba(31,34,38,.18);
  box-shadow: 0 14px 34px rgba(34, 30, 24, .09);
  transform: translateY(-1px);
}

.today-inbox-page-v4 .need-line-v2 {
  padding: 9px 10px;
  align-items: center;
}

.today-inbox-page-v4 .need-line-copy-v2 {
  display: block;
}

.need-inbox-meta-v4 {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-bottom: 5px;
  color: var(--ink-3);
  font-size: 12px;
  font-weight: 700;
}

.need-inbox-meta-v4 span,
.need-inbox-meta-v4 em {
  display: inline-flex;
  min-height: 22px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper);
  padding: 0 8px;
  color: var(--ink-2);
  font-style: normal;
}

.need-inbox-meta-v4 b {
  color: var(--ink-3);
  font-weight: 700;
}

.today-inbox-page-v4 .need-line-copy-v2 h3 {
  margin: 0;
  font-size: 15.5px;
}

.today-inbox-page-v4 .need-line-copy-v2 p {
  margin-top: 3px;
  color: var(--ink-2);
  font-size: 13.5px;
  line-height: 1.32;
  white-space: normal;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

.need-row-meta-v4 {
  display: block;
  margin-top: 3px;
  color: var(--ink-3);
  font-size: 12px;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.today-inbox-page-v4 .need-actions-v2 {
  align-self: start;
}

.today-inbox-page-v4 .need-actions-v2 button {
  min-height: 32px;
  border-radius: 9px;
  padding-inline: 10px;
}

.inline-row-v5 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 190px;
  gap: 16px;
  align-items: start;
  border: 1px solid rgba(31,34,38,.1);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(250,247,240,.92));
  box-shadow: 0 10px 24px rgba(34, 30, 24, .055);
  padding: 14px;
}

.inline-row-v5.is-done {
  opacity: .72;
}

.inline-row-head-v5 h3 {
  margin: 0;
  color: var(--ink);
  font-size: 16.5px;
  line-height: 1.25;
  font-weight: 750;
}

.inline-row-head-v5 p,
.inline-answer-v5 p {
  margin: 4px 0 0;
  color: var(--ink-2);
  font-size: 15px;
  line-height: 1.38;
}

.inline-row-head-v5 small {
  display: block;
  margin-top: 4px;
  color: var(--ink-3);
  font-size: 12px;
}

.inline-question-stack-v5 {
  display: grid;
  gap: 12px;
  margin-top: 12px;
}

.inline-question-v5 p,
.inline-draft-v5 > p {
  margin: 0 0 8px;
  color: var(--ink-2);
  font-size: 15px;
  line-height: 1.38;
}

.inline-chip-row-v5,
.inline-secondary-v5 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.inline-chip-row-v5 button,
.inline-secondary-v5 button {
  min-height: 44px;
  border: 1px solid var(--line-2);
  border-radius: 999px;
  background: transparent;
  color: var(--ink);
  padding: 0 14px;
  font-weight: 750;
}

.inline-chip-row-v5 button.is-selected {
  background: var(--ink);
  color: var(--paper);
  border-color: var(--ink);
}

.inline-draft-v5 {
  margin-top: 12px;
}

.inline-draft-v5 blockquote {
  margin: 0;
  border-left: 3px solid var(--line-3);
  padding: 8px 0 8px 12px;
  color: var(--ink-2);
  font-size: 14.5px;
  line-height: 1.42;
  font-style: italic;
  background: rgba(255,255,255,.34);
}

.inline-draft-v5 small {
  display: block;
  margin-top: 8px;
  color: var(--ink-3);
  font-size: 13px;
}

.inline-draft-edit-v5 {
  display: grid;
  gap: 8px;
}

.inline-draft-edit-v5 textarea {
  min-height: 96px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
  color: var(--ink);
  padding: 10px;
  font: inherit;
  font-size: 14px;
  line-height: 1.42;
}

.inline-draft-edit-v5 div {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.inline-draft-edit-v5 button {
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 12px;
  font-weight: 750;
}

.inline-answer-v5 {
  margin-top: 10px;
  border-left: 3px solid var(--line-3);
  padding-left: 12px;
}

.inline-secondary-v5 {
  margin-top: 12px;
}

.inline-row-side-v5 {
  display: grid;
  gap: 7px;
  justify-items: stretch;
  position: sticky;
  top: 16px;
}

.inline-primary-v5 {
  min-height: 44px;
  border: 1px solid var(--ink);
  border-radius: 11px;
  background: var(--ink);
  color: var(--paper);
  padding: 0 12px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  font-weight: 800;
}

.inline-primary-v5:disabled {
  border-color: var(--line-2);
  background: var(--paper-2);
  color: var(--ink-3);
  cursor: not-allowed;
}

.inline-primary-v5 span {
  font-size: 18px;
  line-height: 1;
}

.inline-row-side-v5 small {
  color: var(--ink-3);
  font-size: 12px;
  line-height: 1.3;
  text-align: center;
}

.inline-audit-v5 {
  min-height: 36px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--ink-3);
  padding: 0 8px;
  font-size: 12px;
  font-weight: 750;
}

.confirm-pop-v5 {
  position: fixed;
  inset: 0;
  z-index: 95;
  display: grid;
  place-items: center;
  background: rgba(18,20,23,.24);
  padding: 20px;
}

.confirm-pop-v5 section {
  width: min(360px, calc(100vw - 40px));
  border: 1px solid var(--line-2);
  border-radius: 14px;
  background: var(--paper);
  box-shadow: 0 22px 60px rgba(18,20,23,.22);
  padding: 16px;
}

.confirm-pop-v5 p {
  margin: 0;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.35;
}

.confirm-pop-v5 div {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 14px;
}

.confirm-pop-v5 button {
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 14px;
  font-weight: 750;
}

.confirm-pop-v5 button.is-primary {
  border-color: var(--ink);
  background: var(--ink);
  color: var(--paper);
}

.today-chat-v4 {
  position: sticky;
  top: 18px;
  padding: 16px;
}

.today-chat-box-v4 {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.today-chat-box-v4 textarea {
  min-height: 132px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--paper);
  color: var(--ink);
  padding: 12px;
  font: inherit;
  line-height: 1.45;
}

.today-chat-box-v4 button {
  min-height: 44px;
  border: 1px solid var(--ink);
  border-radius: 10px;
  background: var(--ink);
  color: var(--paper);
  font-weight: 700;
}

.today-chat-examples-v4 {
  display: grid;
  gap: 7px;
  margin-top: 12px;
}

.today-chat-examples-v4 button {
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255,255,255,.58);
  color: var(--ink-2);
  padding: 0 10px;
  text-align: left;
  font-weight: 650;
}

.today-chat-note-v4 {
  margin-top: 14px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.today-chat-note-v4 b {
  color: var(--ink);
}

.today-inbox-page-v4 .done-collapsed-v2 {
  margin-top: 14px;
  border-radius: 14px;
}

.channel-story-v3 {
  margin-top: 14px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

.channel-story-v3 h4 {
  margin: 0 0 8px;
  color: var(--ink);
  font-size: 14px;
  font-weight: 700;
}

.channel-history-v3 {
  display: grid;
  gap: 6px;
  margin-bottom: 12px;
}

.channel-history-v3 p,
.why-you-v3 {
  margin: 0;
  color: var(--ink-2);
  font-size: 14px;
  line-height: 1.45;
}

.channel-history-v3 span {
  display: inline-flex;
  min-width: 72px;
  color: var(--ink);
  font-weight: 700;
}

.channel-history-v3 b {
  margin-right: 8px;
  color: var(--ink-3);
}

.need-chat-v4 {
  display: grid;
  grid-template-columns: minmax(180px, .75fr) minmax(0, 1.25fr);
  gap: 12px;
  margin-top: 14px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

.need-chat-v4 h4 {
  margin: 0;
  color: var(--ink);
  font-size: 14px;
  font-weight: 750;
}

.need-chat-v4 p {
  margin: 5px 0 0;
  color: var(--ink-3);
  font-size: 13.5px;
  line-height: 1.42;
}

.need-chat-box-v4 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.need-chat-box-v4 textarea {
  min-height: 78px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
  color: var(--ink);
  padding: 10px;
  font: inherit;
  font-size: 14px;
  line-height: 1.4;
}

.need-chat-box-v4 button {
  align-self: end;
  min-height: 40px;
  border: 1px solid var(--ink);
  border-radius: 10px;
  background: var(--ink);
  color: var(--paper);
  padding: 0 14px;
  font-weight: 750;
}

.need-simple-v4 {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.need-simple-summary-v4 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.need-simple-summary-v4 b {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.55);
  color: var(--ink);
  padding: 0 10px;
  font-size: 13px;
}

.need-simple-v4 section {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255,255,255,.42);
  padding: 10px;
}

.need-simple-v4 h4 {
  margin: 0 0 6px;
  color: var(--ink);
  font-size: 14px;
  font-weight: 750;
}

.need-simple-v4 p {
  margin: 4px 0 0;
  color: var(--ink-2);
  font-size: 14px;
  line-height: 1.35;
}

.global-ask-v4 {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 80;
  display: grid;
  justify-items: end;
  gap: 10px;
}

.global-ask-dot-v4 {
  width: 58px;
  height: 58px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: var(--ink);
  color: var(--paper);
  box-shadow: 0 18px 42px rgba(18,20,23,.28);
  font-weight: 800;
}

.global-ask-panel-v4 {
  width: min(360px, calc(100vw - 40px));
  border: 1px solid var(--line-2);
  border-radius: 16px;
  background: var(--paper);
  box-shadow: 0 24px 64px rgba(18,20,23,.24);
  padding: 14px;
}

.global-ask-panel-v4 > div:first-child {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  margin-bottom: 10px;
}

.global-ask-panel-v4 span {
  color: var(--ink);
  font-size: 15px;
  font-weight: 800;
}

.global-ask-panel-v4 > div:first-child button {
  border: 0;
  background: transparent;
  color: var(--ink-3);
  font-weight: 700;
}

.global-ask-panel-v4 textarea {
  width: 100%;
  min-height: 110px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,255,255,.55);
  color: var(--ink);
  padding: 11px;
  font: inherit;
  font-size: 14px;
  line-height: 1.4;
}

.global-ask-panel-v4 > div:last-child {
  display: grid;
  gap: 7px;
  margin-top: 10px;
}

.global-ask-panel-v4 > div:last-child button {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: rgba(255,255,255,.6);
  color: var(--ink-2);
  padding: 0 10px;
  text-align: left;
  font-weight: 700;
}

.staff-history-v4 > div {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.staff-history-v4 article {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255,255,255,.5);
  padding: 10px;
}

.staff-history-v4 article > span {
  color: var(--ink-3);
  font-size: 13px;
  font-weight: 700;
}

.staff-history-v4 h3 {
  margin: 0;
  color: var(--ink);
  font-size: 15px;
}

.staff-history-v4 p {
  margin: 3px 0 0;
  color: var(--ink-2);
  font-size: 14px;
  line-height: 1.35;
}

.staff-history-v4 small {
  display: block;
  margin-top: 3px;
  color: var(--ink-3);
}

.staff-history-v4 button {
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 12px;
  font-weight: 700;
}

.staff-history-note-v4 {
  margin: 10px 0 0;
  color: var(--ink-3);
  font-size: 13px;
}

.staff-page-v5 {
  max-width: 1120px;
}

.staff-page-v5 .staff-head-v2 {
  margin-bottom: 14px;
}

.staff-page-v5 .staff-head-v2 > div > p:last-child {
  max-width: 780px;
  color: var(--ink-3);
  font-size: 14px;
  line-height: 1.45;
}

.staff-inline-rows-v5 {
  display: grid;
  gap: 10px;
}

.staff-inline-rows-v5 .inline-row-v5 {
  grid-template-columns: minmax(0, 1fr) 170px;
  box-shadow: none;
}

.staff-inline-rows-v5 .inline-row-head-v5 h3 {
  font-size: 16px;
}

.dated-log-v5 > p {
  margin: 0 0 12px;
  color: var(--ink-3);
  font-size: 14px;
  line-height: 1.45;
}

.dated-day-v5 {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,255,255,.56);
  overflow: hidden;
}

.dated-day-v5 + .dated-day-v5 {
  margin-top: 8px;
}

.dated-day-v5 > button {
  width: 100%;
  min-height: 50px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 0;
  background: transparent;
  color: var(--ink);
  padding: 0 14px;
  text-align: left;
}

.dated-day-v5 > button b {
  font-size: 15px;
}

.dated-day-v5 > button span {
  color: var(--ink-3);
  font-size: 13px;
}

.dated-day-v5 > div {
  display: grid;
  gap: 0;
  border-top: 1px solid var(--line);
}

.dated-day-v5 section,
.site-session-thread-v5 section {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-top: 1px solid rgba(31,34,38,.08);
}

.dated-day-v5 section:first-child,
.site-session-thread-v5 section:first-child {
  border-top: 0;
}

.dated-day-v5 section > span,
.site-session-thread-v5 section > span {
  color: var(--ink-3);
  font-size: 12px;
  font-weight: 750;
}

.dated-day-v5 h3,
.site-session-thread-v5 h3 {
  margin: 0;
  color: var(--ink);
  font-size: 15px;
}

.dated-day-v5 p,
.site-session-thread-v5 p {
  margin: 3px 0 0;
  color: var(--ink-2);
  font-size: 14px;
  line-height: 1.35;
}

.dated-day-v5 small,
.site-session-thread-v5 small {
  display: block;
  margin-top: 3px;
  color: var(--ink-3);
  font-size: 12px;
}

.dated-day-v5 nav {
  display: flex;
  gap: 6px;
}

.dated-day-v5 nav button,
.site-session-thread-v5 button {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 10px;
  font-size: 13px;
  font-weight: 750;
}

.site-sessions-v5 {
  display: grid;
  gap: 8px;
}

.site-sessions-v5 h2 {
  margin-bottom: 2px;
}

.site-sessions-v5 article {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,255,255,.58);
  overflow: hidden;
}

.site-sessions-v5 article.is-open {
  background: var(--paper);
  box-shadow: 0 12px 28px rgba(34,30,24,.055);
}

.site-sessions-v5 article > button {
  width: 100%;
  min-height: 62px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, auto);
  gap: 12px;
  align-items: center;
  border: 0;
  background: transparent;
  color: var(--ink);
  padding: 12px 14px;
  text-align: left;
}

.site-sessions-v5 article > button b {
  display: block;
  font-size: 16px;
}

.site-sessions-v5 article > button span {
  display: block;
  margin-top: 3px;
  color: var(--ink-3);
  font-size: 13px;
}

.site-sessions-v5 article > button em {
  justify-self: end;
  color: var(--ink-2);
  font-style: normal;
  font-size: 13px;
  line-height: 1.35;
  text-align: right;
}

.site-session-thread-v5 {
  border-top: 1px solid var(--line);
}

.takeoff-import-v5 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(246,241,232,.78));
  padding: 16px;
  box-shadow: 0 12px 28px rgba(34,30,24,.055);
}

.takeoff-import-v5 h2 {
  margin: 0;
  color: var(--ink);
  font-size: 20px;
}

.takeoff-import-v5 p {
  margin: 5px 0 0;
  color: var(--ink-2);
  font-size: 14.5px;
  line-height: 1.45;
}

.takeoff-import-v5 button,
.onboarding-active-v5 nav button {
  min-height: 42px;
  border: 1px solid var(--ink);
  border-radius: 10px;
  background: var(--ink);
  color: var(--paper);
  padding: 0 14px;
  font-weight: 800;
}

.takeoff-import-v5 button + button,
.onboarding-active-v5 nav button:not(:first-child) {
  border-color: var(--line);
  background: var(--paper);
  color: var(--ink);
}

.onboarding-active-v5 article {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,255,255,.56);
  padding: 14px;
}

.onboarding-active-v5 h3 {
  margin: 0;
  color: var(--ink);
  font-size: 18px;
}

.onboarding-active-v5 p {
  margin: 5px 0 12px;
  color: var(--ink-2);
  font-size: 14.5px;
}

.onboarding-active-v5 article > div {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 12px;
}

.onboarding-active-v5 article > div span {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(69,111,82,.24);
  border-radius: 999px;
  background: rgba(69,111,82,.09);
  color: var(--green);
  padding: 0 10px;
  font-size: 13px;
  font-weight: 750;
}

.onboarding-active-v5 nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.quote-status-v5,
.schedule-status-v5 {
  display: grid;
  gap: 8px;
}

.quote-status-v5 article {
  display: grid;
  grid-template-columns: minmax(120px, .6fr) minmax(140px, .7fr) minmax(130px, auto) minmax(0, 1.2fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,255,255,.56);
  padding: 12px;
}

.quote-status-v5 article b,
.quote-status-v5 article span {
  color: var(--ink);
  font-size: 14px;
}

.quote-status-v5 article em {
  justify-self: start;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.6);
  color: var(--ink-2);
  padding: 5px 9px;
  font-size: 12px;
  font-style: normal;
  font-weight: 750;
}

.quote-status-v5 article p {
  margin: 0;
  color: var(--ink-2);
  font-size: 13.5px;
  line-height: 1.35;
}

.quote-status-v5 article button {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 10px;
  font-weight: 750;
}

.workflow-steps-v3.is-five {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.history-page-v4 {
  max-width: 1120px;
}

.history-filters-v4 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.history-filter-v4 {
  display: grid;
  gap: 5px;
  color: var(--ink-3);
  font-size: 12px;
  font-weight: 750;
}

.history-filter-v4 select {
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 10px;
  font: inherit;
}

.history-workspace-v4 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
  gap: 14px;
  align-items: start;
}

.history-feed-v4 {
  display: grid;
  gap: 8px;
}

.history-feed-v4 article {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,255,255,.68);
  padding: 12px;
  box-shadow: 0 10px 24px rgba(34, 30, 24, .045);
}

.history-feed-v4 article.is-active {
  border-color: rgba(27,31,42,.35);
  background: var(--paper);
}

.history-feed-v4 article > span {
  color: var(--ink-3);
  font-size: 13px;
  font-weight: 750;
}

.history-feed-v4 h2,
.history-detail-v4 h2 {
  margin: 0;
  color: var(--ink);
  font-size: 17px;
  line-height: 1.2;
}

.history-feed-v4 p {
  margin: 4px 0 0;
  color: var(--ink-2);
  font-size: 14px;
  line-height: 1.35;
}

.history-feed-v4 small {
  display: block;
  margin-top: 4px;
  color: var(--ink-3);
  font-size: 12.5px;
}

.history-row-actions-v4 {
  display: flex;
  gap: 6px;
}

.history-row-actions-v4 button,
.history-chat-v4 button {
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 12px;
  font-weight: 700;
}

.history-detail-v4 {
  position: sticky;
  top: 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 16px 42px rgba(34, 30, 24, .07);
  padding: 16px;
}

.history-detail-v4 > span {
  color: var(--ink-3);
  font-size: 13px;
  font-weight: 750;
}

.history-detail-v4 > p {
  margin: 8px 0 0;
  color: var(--ink-2);
  font-size: 15px;
  line-height: 1.45;
}

.history-detail-v4 dl {
  display: grid;
  gap: 8px;
  margin: 14px 0;
}

.history-detail-v4 dl div {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 10px;
  border-top: 1px solid var(--line);
  padding-top: 8px;
}

.history-detail-v4 dt {
  color: var(--ink-3);
  font-size: 12px;
  font-weight: 750;
}

.history-detail-v4 dd {
  margin: 0;
  color: var(--ink);
  font-size: 13.5px;
}

.history-chat-v4 {
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

.history-chat-v4 h3 {
  margin: 0 0 8px;
  color: var(--ink);
  font-size: 15px;
}

.history-chat-v4 textarea {
  width: 100%;
  min-height: 92px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
  color: var(--ink);
  padding: 10px;
  font: inherit;
  font-size: 14px;
}

.history-chat-v4 button {
  width: 100%;
  margin-top: 8px;
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}

.empty-v4 {
  border: 1px dashed var(--line-2);
  border-radius: 12px;
  color: var(--ink-3);
  padding: 16px;
}

.staff-head-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
}

.staff-controls-v3 {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.staff-controls-v3 button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.estimator-flow-v3 {
  margin-top: 14px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.45);
}

.estimator-flow-v3 > div:first-child {
  display: grid;
  gap: 4px;
  margin-bottom: 10px;
}

.estimator-flow-v3 b {
  color: var(--ink);
}

.estimator-flow-v3 span,
.estimator-flow-v3 small {
  color: var(--ink-3);
}

.workflow-steps-v3 {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

.workflow-steps-v3 button {
  min-height: 58px;
  display: grid;
  gap: 3px;
  align-content: center;
  text-align: left;
}

.workflow-steps-v3 button span {
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
}

.workflow-steps-v3 button small {
  color: var(--ink-3);
  font-size: 12px;
}

.channels-v3,
.settings-v3 {
  max-width: 1040px;
}

.channels-head-v3 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  border-bottom: 1px solid var(--line);
  padding-bottom: 18px;
  margin-bottom: 16px;
}

.channels-head-v3 h1 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(30px, 4vw, 46px);
  line-height: 1.05;
}

.channels-head-v3 p {
  margin: 8px 0 4px;
  color: var(--ink-2);
  font-size: 18px;
}

.channels-head-v3 small {
  color: var(--ink-3);
  font-size: 15px;
}

.channels-head-v3 button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.channel-filters-v3 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) repeat(3, auto);
  gap: 8px;
  margin-bottom: 14px;
}

.channel-filters-v3 input {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
  color: var(--ink);
  padding: 0 12px;
  font: inherit;
}

.channels-live-v3,
.nudge-templates-v3,
.approval-sentences-v3,
.quiet-hours-v3 {
  display: grid;
  gap: 14px;
}

.channels-live-v3 section,
.nudge-templates-v3,
.approval-sentences-v3 article,
.quiet-hours-v3 {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  box-shadow: var(--shadow-1);
}

.channels-live-v3 h2,
.nudge-templates-v3 h2,
.approval-sentences-v3 h2,
.quiet-hours-v3 h2 {
  margin: 0 0 10px;
  color: var(--ink);
  font-size: 20px;
}

.channel-row-v3 {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border-top: 1px solid var(--line);
  padding: 12px 0;
}

.channel-row-v3:first-of-type {
  border-top: 0;
}

.channel-row-icon-v3 {
  min-width: 78px;
  min-height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
}

.channel-row-v3 h3 {
  margin: 0;
  color: var(--ink);
  font-size: 18px;
}

.channel-row-v3 p,
.section-title-row-v3 p,
.nudge-grid-v3 p,
.quiet-hours-v3 p {
  margin: 6px 0 0;
  color: var(--ink-2);
  font-size: 15px;
  line-height: 1.45;
}

.channel-row-v3 em {
  color: var(--ink-3);
  font-style: normal;
}

.channel-row-v3 small,
.nudge-grid-v3 small {
  display: block;
  margin-top: 6px;
  color: var(--ink-3);
  font-size: 13px;
}

.expected-row-v3 {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr) minmax(180px, auto);
  gap: 10px;
  align-items: center;
  border-top: 1px solid var(--line);
  padding: 10px 0;
}

.expected-row-v3:first-of-type {
  border-top: 0;
}

.expected-row-v3 small {
  color: var(--ink-3);
}

.nudge-templates-v3 {
  margin-top: 18px;
}

.section-title-row-v3 {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.nudge-grid-v3 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.nudge-grid-v3 article {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: rgba(255,255,255,.45);
}

.nudge-grid-v3 span {
  color: var(--ink-3);
  font-size: 13px;
  font-weight: 700;
}

.approval-sentences-v3 article {
  margin-bottom: 10px;
}

.approval-sentences-v3 h2 span {
  color: var(--ink-3);
  font-weight: 600;
}

.approval-sentences-v3 p {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 0;
}

.approval-sentences-v3 button,
.quiet-hours-v3 p button {
  min-height: 34px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.quiet-hours-v3 {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  margin-top: 12px;
}

@media (max-width: 860px) {
  .mobile-tabbar-v6 {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: max(10px, env(safe-area-inset-bottom));
    z-index: 1000;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    padding: 8px;
    border: 1px solid rgba(251,248,242,.16);
    border-radius: 18px;
    background: rgba(18,20,23,.96);
    box-shadow: 0 18px 48px rgba(18,20,23,.28);
    color: var(--ink-on-rail);
  }
  .mobile-tabbar-v6 > button {
    min-height: 54px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #C2C8D6;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 12px;
    line-height: 1;
  }
  .mobile-tabbar-v6 > button.is-active {
    background: var(--paper);
    color: var(--ink);
  }
  .mobile-dot-v6 {
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: var(--amber-2);
    color: #1B1F2A;
    font-family: var(--f-mono);
    font-size: 10px;
    font-weight: 700;
  }
  .mobile-tab-sheet-v6 {
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(100% + 8px);
    display: grid;
    gap: 6px;
    padding: 12px;
    border: 1px solid rgba(251,248,242,.14);
    border-radius: 18px;
    background: rgba(18,20,23,.98);
    box-shadow: 0 18px 48px rgba(18,20,23,.3);
  }
  .mobile-tab-sheet-v6 > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 0 2px 4px;
  }
  .mobile-tab-sheet-v6 > div b {
    font-size: 13px;
    color: var(--ink-on-rail);
  }
  .mobile-tab-sheet-v6 > div button {
    min-height: 34px;
    border: 1px solid var(--line-rail);
    border-radius: 999px;
    background: var(--rail-2);
    color: var(--ink-on-rail-2);
    padding: 0 12px;
  }
  .mobile-tab-sheet-v6 > button {
    min-height: 58px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #C2C8D6;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    text-align: left;
    padding: 8px;
  }
  .mobile-tab-sheet-v6 > button.is-active {
    background: var(--rail-2);
    color: var(--ink-on-rail);
  }
  .mobile-tab-sheet-v6 > button span:nth-child(2) {
    min-width: 0;
  }
  .mobile-tab-sheet-v6 b,
  .mobile-tab-sheet-v6 small {
    display: block;
  }
  .mobile-tab-sheet-v6 small {
    margin-top: 2px;
    color: var(--ink-on-rail-3);
    font-size: 11px;
  }
  .mobile-tab-sheet-v6 em {
    min-width: 20px;
    height: 20px;
    border-radius: 999px;
    background: var(--amber-2);
    color: #1B1F2A;
    display: grid;
    place-items: center;
    font-family: var(--f-mono);
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
  }
  .need-line-v2,
  .estimator-header-top-v2,
  .estimator-next-v2,
  .linked-row-v2,
  .staff-head-v2,
  .channels-head-v3,
  .channel-filters-v3,
  .channel-row-v3,
  .expected-row-v3,
  .inline-row-v5,
  .quiet-hours-v3 {
    grid-template-columns: 1fr;
  }
  .need-line-copy-v2 {
    display: block;
  }
  .need-line-copy-v2 p {
    margin-top: 4px;
    white-space: normal;
  }
  .estimator-header-top-v2 button,
  .estimator-next-v2 button,
  .linked-row-v2 .need-actions-v2 button,
  .see-all-v3,
  .channels-head-v3 button,
  .channel-row-v3 button {
    width: 100%;
  }
  .estimator-header-actions-v2 {
    justify-content: stretch;
  }
  .job-select-v2 {
    width: 100%;
  }
  .background-strip-v3 > button,
  .need-chat-v4,
  .need-chat-box-v4,
  .staff-history-v4 article,
  .staff-inline-rows-v5 .inline-row-v5,
  .dated-day-v5 section,
  .site-session-thread-v5 section,
  .site-sessions-v5 article > button,
  .takeoff-import-v5,
  .quote-status-v5 article,
  .history-filters-v4,
  .history-workspace-v4,
  .history-feed-v4 article,
  .workflow-steps-v3,
  .nudge-grid-v3,
  .today-workspace-v4,
  .today-inbox-head-v4 {
    grid-template-columns: 1fr;
  }
  .background-strip-v3 b {
    white-space: normal;
  }
  .staff-controls-v3 {
    justify-content: stretch;
  }
  .staff-controls-v3 button {
    flex: 1 1 100%;
  }
  .today-chat-v4 {
    position: static;
  }
  .history-detail-v4 {
    position: static;
  }
  .inline-row-side-v5 {
    position: static;
  }
  .inline-chip-row-v5,
  .inline-secondary-v5,
  .inline-draft-edit-v5 div {
    display: grid;
    grid-template-columns: 1fr;
  }
  .inline-chip-row-v5 button,
  .inline-secondary-v5 button {
    width: 100%;
    border-radius: 12px;
  }
}