:root {
  --ink: #05070d;
  --paper: #ffffff;
  --paper-soft: #f7f8fb;
  --line: #111827;
  --steel: #d8dee8;
  --blue: #174cff;
  --blue-soft: #eef3ff;
  --red: #df3b21;
  --red-soft: #fff0ea;
  --green: #007a4d;
  --green-soft: #e3f7ed;
  --amber: #b76b00;
  --amber-soft: #fff2c9;
  --shadow: 0 22px 54px rgba(5, 7, 13, 0.16);
  --shadow-tight: 0 12px 26px rgba(5, 7, 13, 0.11);
  color-scheme: light;
  font-family:
    "Segoe UI Variable Text", "Aptos", Inter, ui-sans-serif, system-ui, -apple-system,
    BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  background:
    linear-gradient(90deg, rgba(5, 7, 13, 0.045) 1px, transparent 1px),
    linear-gradient(180deg, #ffffff 0%, #f3f6fb 48%, #e8edf5 100%);
  background-size: 56px 56px, auto;
  color: var(--ink);
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select {
  font: inherit;
}

button {
  cursor: pointer;
}

h1,
h2,
p {
  margin: 0;
}

h1 {
  max-width: 820px;
  color: #ffffff;
  font-size: 5.4rem;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 0.92;
}

h2 {
  color: var(--ink);
  font-size: 1.5rem;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1.08;
}

.app-shell {
  width: min(1320px, 100%);
  margin: 0 auto;
  padding: 18px 16px 28px;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 68px;
  border: 1px solid rgba(17, 24, 39, 0.92);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 248, 251, 0.96));
  padding: 11px 12px;
  box-shadow: 0 16px 40px rgba(5, 7, 13, 0.13);
  backdrop-filter: blur(16px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.brand-mark {
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(135deg, transparent 46%, #ffffff 47% 53%, transparent 54%),
    linear-gradient(135deg, var(--red), var(--amber));
}

.brand strong {
  display: block;
  color: var(--ink);
  font-size: 1.02rem;
  font-weight: 950;
  line-height: 1.05;
}

.brand small,
.topnav a,
.eyebrow,
.panel-heading span,
.truth-topline b,
.field span,
.choice-field > span,
.stat-card span,
.token-meter span,
.load-meter span,
.cost-summary span,
.next-card span {
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0;
}

.topnav {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.topnav a,
.nav-more summary {
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 9px 10px;
  transition: background 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}

.topnav a:hover,
.nav-more summary:hover {
  border-color: var(--line);
  background: var(--paper-soft);
  transform: translateY(-1px);
}

.nav-more {
  position: relative;
}

.nav-more summary {
  list-style: none;
  user-select: none;
}

.nav-more summary::-webkit-details-marker {
  display: none;
}

.nav-more summary::after {
  content: "+";
  margin-left: 4px;
}

.nav-more[open] summary {
  border-color: var(--line);
  background: var(--paper-soft);
}

.nav-more[open] summary::after {
  content: "-";
}

.nav-more-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 40;
  display: grid;
  grid-template-columns: repeat(2, minmax(112px, 1fr));
  gap: 6px;
  min-width: 260px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
  padding: 8px;
  box-shadow: var(--shadow-tight);
}

.nav-more-menu a {
  border-color: rgba(17, 24, 39, 0.18);
  background: var(--paper-soft);
}

body.customer-mode .topnav > a[href="#account"],
body.customer-mode .nav-more {
  display: none !important;
}

body.customer-mode #alerts,
body.customer-mode #load,
body.customer-mode #coach,
body.customer-mode #triggers,
body.customer-mode #care,
body.customer-mode #vault,
body.customer-mode #hardday,
body.customer-mode #account,
body.customer-mode #billing,
body.customer-mode .cloud-guard-matrix,
body.customer-mode .cloud-sync-panel,
body.customer-mode .provider-qa-panel,
body.customer-mode .taper-qa-panel,
body.customer-mode .rolling-demo-controls,
body.customer-mode .network-safety-panel,
body.customer-mode .cloud-guard-matrix-list,
body.customer-mode #recoveryNetworkGatePreview,
body.customer-mode #coachSafetyGatePreview,
body.customer-mode #crossHabitGatePreview {
  display: none !important;
}

body.customer-mode #runRecoveryNetworkGateButton,
body.customer-mode #copyRecoveryNetworkGateButton,
body.customer-mode #clearRecoveryNetworkGateButton {
  display: none !important;
}

.truth-stage {
  display: grid;
  grid-template-columns: minmax(0, 1.32fr) minmax(360px, 0.68fr);
  gap: 18px;
  align-items: start;
  padding: 18px 0;
}

.truth-stage > *,
.autopilot-grid > *,
.intel-grid > *,
.support-grid > * {
  min-width: 0;
}

.truth-hero,
.intake-panel,
.daily-command,
.plan-panel,
.notification-panel,
.cost-truth-panel,
.load-panel,
.receipt-panel,
.rescue-panel,
.recovery-network-panel,
.ai-coach-panel,
.trigger-intelligence-panel,
.account-panel,
.progress-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}

.truth-hero {
  position: relative;
  display: grid;
  gap: 18px;
  min-height: 720px;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(223, 59, 33, 0.22) 0 12%, transparent 12% 100%),
    linear-gradient(155deg, rgba(23, 76, 255, 0.18) 0 28%, transparent 28% 100%),
    linear-gradient(180deg, #080b12 0%, #05070d 58%, #111827 100%);
  color: #ffffff;
  padding: 24px;
}

.truth-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
  background-size: 52px 52px;
  pointer-events: none;
}

.truth-hero::after {
  content: "";
  position: absolute;
  right: -12%;
  top: 0;
  width: 42%;
  height: 100%;
  background:
    linear-gradient(160deg, transparent 0 22%, rgba(255, 255, 255, 0.11) 22% 24%, transparent 24% 100%),
    linear-gradient(160deg, transparent 0 46%, rgba(255, 255, 255, 0.08) 46% 48%, transparent 48% 100%);
  pointer-events: none;
}

.truth-hero > * {
  position: relative;
  z-index: 1;
}

.truth-topline,
.inline-heading,
.wizard-topline {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.truth-topline .eyebrow,
.truth-topline b {
  color: #ffffff;
}

.truth-topline b,
.inline-heading b,
#gapPill {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  border: 1px solid currentColor;
  border-radius: 8px;
  padding: 0 10px;
  white-space: nowrap;
}

.truth-headline {
  display: grid;
  gap: 14px;
}

.hero-subcopy {
  max-width: 680px;
  color: #ffffff;
  font-size: 1.12rem;
  font-weight: 750;
  line-height: 1.5;
}

.hero-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.primary-hero-action,
.secondary-hero-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  border-radius: 8px;
  padding: 0 18px;
  font-size: 0.96rem;
  font-weight: 950;
  line-height: 1;
  transition: background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.primary-hero-action {
  border: 1px solid #ffffff;
  background: #ffffff;
  color: var(--ink);
  box-shadow: inset 0 -5px 0 var(--red);
}

.secondary-hero-action {
  border: 1px solid rgba(255, 255, 255, 0.72);
  background: rgba(255, 255, 255, 0.06);
  color: #ffffff;
}

.private-wakeup-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid rgba(255, 255, 255, 0.68);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  padding: 14px;
  color: #ffffff;
}

.private-wakeup-panel[hidden] {
  display: none;
}

.private-wakeup-panel span,
.private-wakeup-panel p {
  color: rgba(255, 255, 255, 0.82);
}

.private-wakeup-panel span {
  display: block;
  font-size: 0.74rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.private-wakeup-panel strong {
  display: block;
  margin-top: 4px;
  font-size: 1.12rem;
  font-weight: 950;
}

.private-wakeup-panel p {
  max-width: 640px;
  margin-top: 6px;
  font-weight: 750;
  line-height: 1.45;
}

.private-wakeup-receipt {
  display: grid;
  gap: 3px;
  max-width: 680px;
  margin-top: 10px;
  border: 1px solid rgba(255, 255, 255, 0.46);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  padding: 9px 11px;
}

.private-wakeup-receipt strong {
  margin-top: 0;
  font-size: 0.95rem;
}

.private-wakeup-receipt p {
  margin-top: 0;
  font-size: 0.9rem;
  line-height: 1.35;
}

.private-wakeup-action {
  flex: 0 0 auto;
  border: 1px solid #ffffff;
  border-radius: 8px;
  background: #ffffff;
  padding: 12px 14px;
  color: var(--ink);
  font-weight: 950;
  white-space: nowrap;
}

.recipient-baseline-note {
  display: grid;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--blue-soft);
  padding: 12px;
}

.recipient-baseline-note[hidden] {
  display: none;
}

.recipient-baseline-note span {
  color: var(--ink);
  font-size: 0.74rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.recipient-baseline-note strong {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.14;
}

.recipient-baseline-note p {
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 750;
  line-height: 1.42;
}

.primary-hero-action:hover,
.secondary-hero-action:hover {
  transform: translateY(-1px);
  box-shadow: inset 0 -5px 0 var(--blue), 0 10px 22px rgba(0, 0, 0, 0.22);
}

.clarity-loop {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.clarity-loop article {
  display: grid;
  grid-template-columns: auto 1fr;
  align-content: start;
  align-items: start;
  gap: 6px 10px;
  min-height: 92px;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.07));
  padding: 12px 14px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.clarity-loop span {
  display: inline-grid;
  place-items: center;
  grid-row: 1 / span 2;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #ffffff;
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 950;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
}

.clarity-loop strong {
  color: #ffffff;
  font-size: 1.05rem;
  font-weight: 950;
  line-height: 1.12;
}

.clarity-loop p {
  color: #ffffff;
  font-size: 0.88rem;
  font-weight: 760;
  line-height: 1.35;
}

.impact-strip {
  display: grid;
  grid-template-columns: 1.18fr repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.stat-card {
  min-width: 0;
  min-height: 104px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.64);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.075));
  padding: 13px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.13);
}

.stat-card span,
.stat-card small {
  color: #ffffff;
}

.stat-card strong {
  display: block;
  margin-top: 9px;
  max-width: 100%;
  color: #ffffff;
  font-size: 2.1rem;
  font-weight: 950;
  line-height: 1.02;
  overflow-wrap: anywhere;
  word-break: normal;
}

#moneyBurned {
  font-size: 1.58rem;
  line-height: 1.08;
}

.stat-card small {
  display: block;
  margin-top: 7px;
  font-size: 0.86rem;
  font-weight: 750;
  line-height: 1.3;
}

.primary-stat {
  border-color: #ffffff;
  background:
    linear-gradient(180deg, #ffffff 0%, #f4f7ff 100%);
  box-shadow: inset 0 -5px 0 var(--red), 0 14px 30px rgba(0, 0, 0, 0.2);
}

.primary-stat span,
.primary-stat strong,
.primary-stat small {
  color: var(--ink);
}

.smoking-timeline-panel {
  display: grid;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.08));
  padding: 14px;
}

.smoking-timeline-head {
  display: grid;
  gap: 5px;
}

.smoking-timeline-head span,
.smoking-timeline-card span {
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.smoking-timeline-head strong {
  color: #ffffff;
  font-size: 1.35rem;
  font-weight: 950;
  line-height: 1.05;
}

.smoking-timeline-head p,
.smoking-timeline-action p {
  color: #ffffff;
  font-size: 0.9rem;
  font-weight: 760;
  line-height: 1.35;
}

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

.smoking-timeline-card {
  display: grid;
  gap: 8px;
  min-height: 150px;
  border: 1px solid rgba(255, 255, 255, 0.64);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  padding: 13px;
}

.smoking-timeline-card.future {
  background: #ffffff;
  box-shadow: inset 0 -5px 0 var(--green);
}

.smoking-timeline-card.future span,
.smoking-timeline-card.future strong,
.smoking-timeline-card.future p,
.smoking-timeline-card.future small {
  color: var(--ink);
}

.smoking-timeline-card strong {
  color: #ffffff;
  font-size: clamp(1.35rem, 2vw, 2rem);
  font-weight: 950;
  line-height: 1;
}

.smoking-timeline-card p,
.smoking-timeline-card small {
  color: #ffffff;
  font-size: 0.95rem;
  font-weight: 830;
  line-height: 1.35;
}

.smoking-timeline-card small {
  font-size: 0.88rem;
  font-weight: 760;
}

.smoking-timeline-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.impact-carousel-controls {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.impact-mode-button {
  display: grid;
  gap: 5px;
  min-height: 66px;
  border: 1px solid rgba(255, 255, 255, 0.58);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.055));
  color: #ffffff;
  padding: 10px 12px;
  text-align: left;
  transition: transform 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
}

.impact-mode-button:hover {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.16);
}

.impact-mode-button span {
  color: #ffffff;
  font-size: 0.75rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.impact-mode-button strong {
  color: #ffffff;
  font-size: 0.94rem;
  font-weight: 950;
  line-height: 1.12;
}

.impact-mode-button[data-active="true"] {
  background: #ffffff;
  box-shadow: inset 0 -5px 0 var(--blue);
}

.impact-mode-button[data-active="true"] span,
.impact-mode-button[data-active="true"] strong {
  color: var(--ink);
}

.impact-stage-meta {
  display: none;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
  border: 1px solid rgba(255, 255, 255, 0.58);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  padding: 12px 14px;
}

.impact-stage-meta span {
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.impact-stage-meta strong {
  color: #ffffff;
  font-size: 1.45rem;
  font-weight: 950;
  line-height: 0.95;
  text-align: right;
}

canvas {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: 8px;
  background: #05070d;
  box-shadow:
    0 24px 60px rgba(0, 0, 0, 0.34),
    0 0 0 1px rgba(255, 255, 255, 0.26);
}

.impact-callout {
  border: 0;
  border-radius: 8px;
  background:
    linear-gradient(180deg, #ffffff 0%, #f5f7fb 100%);
  color: var(--ink);
  padding: 13px 14px;
  font-weight: 950;
  line-height: 1.42;
  box-shadow: inset 0 -5px 0 var(--blue);
}

.impact-scale-grid {
  display: block;
}

.impact-scale-card {
  min-height: 78px;
  border: 1px solid rgba(255, 255, 255, 0.68);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 247, 251, 0.98));
  color: var(--ink);
  padding: 12px;
  box-shadow: inset 0 -4px 0 rgba(23, 76, 255, 0.18);
}

.impact-scale-card:nth-child(n + 2) {
  display: none;
}

.impact-scale-card span {
  display: block;
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  line-height: 1.1;
  text-transform: uppercase;
}

.impact-scale-card strong {
  display: block;
  margin-top: 7px;
  color: var(--ink);
  font-size: 1.08rem;
  font-weight: 950;
  line-height: 1.14;
  overflow-wrap: anywhere;
}

.impact-scale-card p {
  margin-top: 6px;
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 760;
  line-height: 1.34;
}

.route-copy {
  color: #ffffff;
  font-size: 1rem;
  font-weight: 780;
  line-height: 1.5;
}

.first-recovery-move {
  display: grid;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, 0.76);
  border-radius: 8px;
  background:
    linear-gradient(180deg, #ffffff 0%, #eef5ff 100%);
  color: var(--ink);
  padding: 14px;
  box-shadow: inset 0 -5px 0 var(--blue);
}

.first-recovery-move[data-state="rebuild"] {
  box-shadow: inset 0 -5px 0 #ef4444;
}

.first-recovery-move[data-state="rescue"] {
  box-shadow: inset 0 -5px 0 #f59e0b;
}

.first-recovery-move[data-state="good"],
.first-recovery-move[data-state="complete"] {
  box-shadow: inset 0 -5px 0 var(--green);
}

.first-move-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 14px;
}

.first-move-head div {
  display: grid;
  gap: 5px;
}

.first-move-head span,
.first-move-stats span {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.first-move-head strong {
  color: var(--ink);
  font-size: 1.28rem;
  font-weight: 950;
  line-height: 1.14;
}

.first-move-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border: 1px solid var(--ink);
  border-radius: 8px;
  background: var(--ink);
  color: #ffffff;
  padding: 10px 12px;
  font-size: 0.86rem;
  font-weight: 950;
  text-decoration: none;
  white-space: nowrap;
}

.first-recovery-move p {
  margin: 0;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 840;
  line-height: 1.42;
}

.first-move-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.first-move-stats div {
  min-height: 72px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  padding: 10px;
}

.first-move-stats strong {
  display: block;
  margin-top: 7px;
  color: var(--ink);
  font-size: 1.18rem;
  font-weight: 950;
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.return-journey {
  display: grid;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 8px;
  background:
    linear-gradient(180deg, #ffffff 0%, #f7fafc 100%);
  color: var(--ink);
  padding: 14px;
}

.return-journey[data-active="true"] {
  box-shadow: inset 0 -5px 0 var(--green);
}

.return-journey-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: start;
}

.return-journey-head div {
  display: grid;
  gap: 5px;
}

.return-journey-head span,
.return-stats span,
.return-journey small {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.return-journey-head strong {
  color: var(--ink);
  font-size: 1.18rem;
  font-weight: 950;
  line-height: 1.15;
}

.return-journey-head b {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--green-soft);
  color: var(--green);
  padding: 7px 10px;
  font-size: 0.72rem;
  font-weight: 950;
  white-space: nowrap;
  text-transform: uppercase;
}

.return-journey p {
  margin: 0;
  color: var(--ink);
  font-weight: 850;
  line-height: 1.42;
}

.return-meter {
  min-height: 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper-soft);
  overflow: hidden;
}

.return-meter i {
  display: block;
  width: var(--return-progress, 0%);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--green), var(--blue));
  transition: width 0.2s ease;
}

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

.return-stats div {
  min-height: 76px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 10px;
}

.return-stats strong {
  display: block;
  margin-top: 7px;
  color: var(--ink);
  font-size: 1.26rem;
  font-weight: 950;
  line-height: 1;
}

.return-journey small {
  color: var(--ink);
  line-height: 1.35;
  text-transform: none;
}

.share-intent-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  border: 1px solid rgba(255, 255, 255, 0.66);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.07));
  padding: 14px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.share-intent-panel span {
  display: block;
  color: rgba(255, 255, 255, 0.74);
  font-size: 0.73rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.share-intent-panel strong {
  display: block;
  margin-top: 4px;
  color: #ffffff;
  font-size: 1.28rem;
  font-weight: 950;
  line-height: 1.08;
}

.share-intent-panel p {
  max-width: 720px;
  margin-top: 6px;
  color: rgba(255, 255, 255, 0.86);
  font-weight: 750;
  line-height: 1.38;
}

.share-intent-panel ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
  list-style: none;
}

.share-intent-panel li {
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.09);
  color: #ffffff;
  padding: 7px 9px;
  font-size: 0.76rem;
  font-weight: 950;
  white-space: nowrap;
}

.truth-card-variant-panel {
  display: grid;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, 0.66);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.06));
  padding: 14px;
}

.truth-card-variant-panel span {
  display: block;
  color: rgba(255, 255, 255, 0.75);
  font-size: 0.73rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.truth-card-variant-panel strong {
  display: block;
  margin-top: 4px;
  color: #ffffff;
  font-size: 1.14rem;
  font-weight: 950;
  line-height: 1.12;
}

.truth-card-variant-panel p {
  max-width: 760px;
  margin-top: 6px;
  color: rgba(255, 255, 255, 0.86);
  font-weight: 750;
  line-height: 1.38;
}

.truth-card-variant-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.truth-card-variant-button {
  display: grid;
  gap: 4px;
  min-height: 72px;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  padding: 10px;
  text-align: left;
}

.truth-card-variant-button[data-active="true"] {
  border-color: #ffffff;
  background: #ffffff;
  color: var(--ink);
  box-shadow: inset 0 -5px 0 var(--blue);
}

.truth-card-variant-button span {
  color: inherit;
  opacity: 0.82;
}

.truth-card-variant-button strong {
  color: inherit;
  font-size: 1rem;
}

.receiver-preview-panel {
  display: grid;
  gap: 5px;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  padding: 12px 14px;
}

.receiver-preview-panel span {
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.73rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.receiver-preview-panel strong {
  color: #ffffff;
  font-size: 1.08rem;
  font-weight: 950;
  line-height: 1.12;
}

.receiver-preview-panel p {
  max-width: 780px;
  color: rgba(255, 255, 255, 0.86);
  font-weight: 760;
  line-height: 1.38;
}

.private-share-link-receipt {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(230px, 0.65fr);
  gap: 12px;
  align-items: stretch;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 8px;
  background: rgba(8, 14, 20, 0.72);
  padding: 13px 14px;
}

.private-share-link-receipt span {
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.73rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.private-share-link-receipt strong {
  display: block;
  margin-top: 4px;
  color: #ffffff;
  font-size: 1.05rem;
  font-weight: 950;
  line-height: 1.14;
}

.private-share-link-receipt p {
  max-width: 720px;
  margin-top: 6px;
  color: rgba(255, 255, 255, 0.84);
  font-weight: 760;
  line-height: 1.38;
}

.private-share-link-receipt ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.private-share-link-receipt li {
  min-height: 32px;
  border: 1px solid rgba(255, 255, 255, 0.36);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  padding: 7px 9px;
  color: rgba(255, 255, 255, 0.9);
  font-size: 0.85rem;
  font-weight: 850;
  line-height: 1.25;
}

.share-message-preview-panel {
  display: grid;
  gap: 8px;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 8px;
  background: rgba(5, 7, 13, 0.28);
  padding: 12px 14px;
}

.share-message-preview-panel span {
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.73rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.share-message-preview-panel strong {
  display: block;
  margin-top: 4px;
  color: #ffffff;
  font-size: 1.08rem;
  font-weight: 950;
  line-height: 1.12;
}

.share-message-preview-panel p {
  max-width: 860px;
  color: #ffffff;
  font-weight: 820;
  line-height: 1.42;
}

.share-message-preview-panel small {
  color: rgba(255, 255, 255, 0.72);
  font-weight: 760;
  line-height: 1.35;
}

.private-share-safety-checklist {
  display: grid;
  gap: 10px;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.09);
  padding: 12px 14px;
}

.private-share-safety-checklist > div > span {
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.73rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.private-share-safety-checklist > div > strong {
  display: block;
  margin-top: 4px;
  color: #ffffff;
  font-size: 1.08rem;
  font-weight: 950;
  line-height: 1.12;
}

.private-share-safety-checklist ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  list-style: none;
}

.private-share-safety-checklist li {
  display: grid;
  gap: 5px;
  min-height: 86px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 8px;
  background: rgba(5, 7, 13, 0.24);
  padding: 10px;
}

.private-share-safety-checklist li strong {
  color: #ffffff;
  font-size: 0.88rem;
  font-weight: 950;
  line-height: 1.16;
}

.private-share-safety-checklist li span {
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.88rem;
  font-weight: 760;
  line-height: 1.28;
}

.private-share-send-receipt {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(240px, 0.8fr);
  gap: 12px;
  align-items: stretch;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  padding: 12px 14px;
}

.private-share-send-receipt span {
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.73rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.private-share-send-receipt strong {
  display: block;
  margin-top: 4px;
  color: #ffffff;
  font-size: 1.08rem;
  font-weight: 950;
  line-height: 1.12;
}

.private-share-send-receipt p {
  max-width: 760px;
  margin-top: 6px;
  color: rgba(255, 255, 255, 0.84);
  font-weight: 760;
  line-height: 1.38;
}

.private-share-send-receipt ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.private-share-send-receipt li {
  min-height: 32px;
  border: 1px solid rgba(255, 255, 255, 0.36);
  border-radius: 8px;
  background: rgba(5, 7, 13, 0.24);
  padding: 7px 9px;
  color: rgba(255, 255, 255, 0.9);
  font-size: 0.85rem;
  font-weight: 850;
  line-height: 1.25;
}

.share-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: center;
  gap: 8px;
}

.share-button {
  min-height: 46px;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.07);
  color: #ffffff;
  padding: 0 12px;
  font-weight: 950;
}

.share-button:hover {
  background: rgba(255, 255, 255, 0.14);
}

.primary-share {
  background: #ffffff;
  color: var(--ink);
  box-shadow: inset 0 -5px 0 var(--blue);
}

.primary-share:hover {
  background: #ffffff;
}

.truth-math-panel {
  display: grid;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, 0.66);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.075));
  padding: 14px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.truth-math-head {
  display: grid;
  gap: 5px;
}

.truth-math-head span,
.truth-math-card span {
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.73rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.truth-math-head strong {
  color: #ffffff;
  font-size: 1.08rem;
  font-weight: 950;
  line-height: 1.12;
}

.truth-math-head p {
  max-width: 840px;
  color: rgba(255, 255, 255, 0.86);
  font-weight: 750;
  line-height: 1.4;
}

.truth-math-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.truth-math-card {
  display: grid;
  gap: 7px;
  min-height: 128px;
  border: 1px solid rgba(255, 255, 255, 0.54);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.095);
  padding: 11px;
}

.truth-math-card strong {
  color: #ffffff;
  font-size: 0.98rem;
  font-weight: 950;
  line-height: 1.16;
}

.truth-math-card p,
.truth-math-card small {
  color: rgba(255, 255, 255, 0.82);
  font-weight: 750;
  line-height: 1.35;
}

.truth-math-card small {
  font-size: 0.76rem;
}

#shareStatus {
  grid-column: 1 / -1;
  min-height: 42px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.06);
  color: #ffffff;
  font-size: 0.82rem;
  font-weight: 850;
  line-height: 1.3;
  padding: 11px 12px;
  text-align: left;
}

#shareCanvas {
  display: none;
}

.share-preview {
  margin: 0;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.06);
  padding: 10px;
}

.share-preview[hidden] {
  display: none;
}

.share-preview img {
  display: block;
  width: min(520px, 100%);
  border: 1px solid rgba(255, 255, 255, 0.42);
  border-radius: 8px;
}

.intake-panel,
.daily-command,
.plan-panel,
.cost-truth-panel,
.load-panel,
.receipt-panel,
.rescue-panel,
.progress-panel {
  background: #ffffff;
  padding: 18px;
}

.intake-panel {
  position: sticky;
  top: 86px;
  display: grid;
  align-content: start;
  gap: 16px;
  max-height: calc(100vh - 104px);
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.customer-cloud-panel {
  display: grid;
  gap: 12px;
  border: 1px solid #dbe4f0;
  border-radius: 8px;
  background: #f8fbff;
  padding: 14px;
}

.customer-cloud-copy {
  display: grid;
  gap: 4px;
}

.customer-cloud-copy span {
  color: var(--blue);
  font-size: 0.76rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.customer-cloud-copy strong {
  color: var(--ink);
  font-size: 1.02rem;
  line-height: 1.2;
}

.customer-cloud-copy p,
#customerCloudStatus {
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.4;
}

.customer-cloud-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: end;
}

.customer-magic-link-help {
  border-left: 4px solid var(--blue);
  border-radius: 8px;
  background: #eef4ff;
  color: var(--ink);
  padding: 10px 12px;
}

.customer-magic-link-help strong {
  display: block;
  font-size: 0.95rem;
  line-height: 1.25;
}

.customer-magic-link-help ol {
  margin: 8px 0 0 18px;
  padding: 0;
}

.customer-magic-link-help li,
.customer-magic-link-help p {
  color: #20304a;
  font-size: 0.84rem;
  line-height: 1.35;
}

.customer-magic-link-help p {
  margin: 8px 0 0;
}

.customer-cloud-status-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.customer-cloud-status-grid span {
  min-height: 36px;
  border: 1px solid #dbe4f0;
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 8px 10px;
  font-size: 0.78rem;
  font-weight: 850;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.panel-heading {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.inline-heading > div {
  min-width: 0;
}

.panel-heading span,
.eyebrow {
  color: var(--blue);
  text-transform: uppercase;
}

.step-dots {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 24px;
}

.step-dots span {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #cbd5e1;
}

.step-dots span[data-active="true"] {
  width: 24px;
  background: var(--blue);
}

.wizard-step {
  display: none;
  min-height: 168px;
  align-content: start;
  gap: 14px;
}

.wizard-step[data-active="true"] {
  display: grid;
}

.field,
.choice-field {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.field input,
.field select {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 0 12px;
  outline: none;
}

.field input:focus,
.field select:focus {
  box-shadow: 0 0 0 4px rgba(23, 76, 255, 0.15);
}

.segmented,
.number-grid,
.day-grid,
.wizard-actions,
.action-row {
  display: grid;
  gap: 8px;
}

.segmented,
.number-grid,
.wizard-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.day-grid,
.action-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.segmented input,
.mode-list input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.segmented span,
.mode-list span {
  display: grid;
  align-content: center;
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 10px 12px;
  font-weight: 950;
}

.segmented input:checked + span,
.mode-list input:checked + span {
  background: var(--ink);
  color: #ffffff;
  box-shadow: inset 0 -4px 0 var(--blue);
}

.mode-list input:checked + span strong,
.mode-list input:checked + span small {
  color: #ffffff;
}

.helper-copy {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--blue-soft);
  color: var(--ink);
  padding: 12px;
  font-size: 0.93rem;
  font-weight: 850;
  line-height: 1.42;
}

.price-assistant {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}

.price-assistant[hidden] {
  display: none;
}

.price-assistant-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.price-assistant-head span {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.price-assistant-head strong {
  color: var(--ink);
  font-size: 0.98rem;
  font-weight: 950;
  text-align: right;
}

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

.price-assistant-result {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(170px, 0.45fr);
  gap: 8px;
  align-items: stretch;
}

.price-assistant-result p {
  min-height: 46px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  color: var(--ink);
  margin: 0;
  padding: 10px 12px;
  font-size: 0.88rem;
  font-weight: 850;
  line-height: 1.35;
}

.secondary-button,
.primary-button,
.text-button,
.action-button {
  min-height: 46px;
  border-radius: 8px;
  font-weight: 950;
}

.secondary-button {
  border: 1px solid var(--line);
  background: #ffffff;
  color: var(--ink);
}

a.secondary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  text-decoration: none;
}

.primary-button {
  border: 1px solid var(--line);
  background: var(--ink);
  color: #ffffff;
  box-shadow: inset 0 -4px 0 var(--blue);
}

.text-button {
  border: 0;
  background: transparent;
  color: var(--ink);
}

.secondary-button:hover,
.text-button:hover {
  background: var(--paper-soft);
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.62;
}

.premium-gate-copy {
  margin-top: 10px;
  border: 1px solid #f0b65a;
  border-radius: 8px;
  background: var(--amber-soft);
  color: var(--ink);
  padding: 10px 12px;
  font-size: 0.88rem;
  font-weight: 900;
  line-height: 1.35;
}

.premium-gate-copy[hidden] {
  display: none;
}

.premium-locked {
  opacity: 0.74;
}

[data-premium-locked="true"] {
  box-shadow: inset 0 0 0 2px rgba(240, 182, 90, 0.28);
}

.autopilot-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(360px, 0.55fr);
  gap: 16px;
  margin: 0 0 16px;
}

.next-card {
  display: grid;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--blue-soft);
  padding: 15px;
}

.next-card strong {
  color: var(--ink);
  font-size: 3.6rem;
  font-weight: 950;
  line-height: 0.96;
}

.next-card small,
.next-card p {
  color: var(--ink);
  font-weight: 850;
  line-height: 1.42;
}

.next-cigarette-status {
  display: grid;
  gap: 6px;
  border: 1px solid rgba(12, 18, 32, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.74);
  padding: 11px;
}

.next-cigarette-status[data-state="open"] {
  background: var(--green-soft);
}

.next-cigarette-status[data-state="hold"] {
  background: var(--amber-soft);
}

.next-cigarette-status[data-state="closed"] {
  background: #f1f5f9;
}

.next-cigarette-status > span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.next-cigarette-status strong {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.14;
}

.next-cigarette-status p,
.next-cigarette-status small {
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 850;
  line-height: 1.32;
}

.daily-mission-card {
  display: grid;
  gap: 9px;
  border: 2px solid var(--ink);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
  box-shadow: 0 8px 0 rgba(12, 18, 32, 0.08);
}

.daily-mission-card[data-state="watch"],
.daily-mission-card[data-state="rescue"] {
  background: var(--amber-soft);
}

.daily-mission-card[data-state="good"],
.daily-mission-card[data-state="complete"] {
  background: var(--green-soft);
}

.daily-mission-card[data-state="rebuild"] {
  background: var(--red-soft);
}

.daily-mission-card > span {
  color: var(--blue);
  font-size: 0.76rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.daily-mission-card strong {
  color: var(--ink);
  font-size: 1.45rem;
  font-weight: 950;
  line-height: 1.05;
}

.daily-mission-card p {
  margin: 0;
  color: var(--ink);
  font-weight: 850;
  line-height: 1.42;
}

.daily-mission-meta {
  display: grid;
  grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
  gap: 8px;
}

.daily-mission-meta span {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 8px;
  font-size: 0.82rem;
  font-weight: 950;
  line-height: 1.25;
}

.daily-mission-path,
.daily-mission-reason,
.daily-mission-action-receipt {
  display: grid;
  gap: 8px;
  border: 1px solid rgba(12, 18, 32, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.74);
  padding: 11px;
}

.daily-mission-action-receipt[data-state="good"] {
  background: rgba(241, 255, 247, 0.86);
}

.daily-mission-path[data-state="good"] {
  background: rgba(241, 255, 247, 0.86);
}

.daily-mission-path[data-state="pattern"] {
  background: rgba(237, 247, 255, 0.88);
}

.daily-mission-path[data-state="complete"] {
  background: rgba(255, 255, 255, 0.9);
}

.daily-mission-path[data-state="rebuild"],
.daily-mission-path[data-state="rescue"] {
  background: rgba(255, 255, 255, 0.84);
}

.daily-mission-action-receipt[data-state="rebuild"],
.daily-mission-action-receipt[data-state="rescue"] {
  background: rgba(255, 255, 255, 0.84);
}

.daily-mission-path > span,
.daily-mission-reason > span,
.daily-mission-action-receipt > span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.daily-mission-path ol {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: mission-path;
}

.daily-mission-path li {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 900;
  line-height: 1.3;
  counter-increment: mission-path;
}

.daily-mission-path li::before {
  display: inline-grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 999px;
  background: var(--blue);
  color: #ffffff;
  content: counter(mission-path);
  font-size: 0.72rem;
  font-weight: 950;
}

.daily-mission-path small {
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 850;
  line-height: 1.3;
}

.daily-mission-reason strong,
.daily-mission-action-receipt strong {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.14;
}

.daily-mission-reason ul,
.daily-mission-action-receipt ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.daily-mission-reason li,
.daily-mission-action-receipt li {
  position: relative;
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 850;
  line-height: 1.32;
  padding-left: 16px;
}

.daily-mission-reason li::before,
.daily-mission-action-receipt li::before {
  position: absolute;
  top: 0.52em;
  left: 0;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--blue);
  content: "";
}

.token-explainer,
.reality-log {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 13px;
}

.token-explainer {
  display: grid;
  gap: 9px;
}

.token-explainer strong {
  color: var(--ink);
  font-size: 1.08rem;
  font-weight: 950;
}

.token-explainer p {
  color: var(--ink);
  font-weight: 850;
  line-height: 1.42;
}

.token-explainer div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.token-explainer span {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--blue-soft);
  color: var(--blue);
  padding: 8px;
  font-size: 0.75rem;
  font-weight: 950;
  line-height: 1.2;
  text-transform: uppercase;
}

.token-meter,
.cost-summary,
.load-meter {
  display: grid;
  gap: 10px;
}

.token-meter {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.token-meter div,
.cost-summary div,
.load-meter div {
  min-height: 86px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}

.token-meter strong,
.cost-summary strong,
.load-meter strong {
  display: block;
  margin-top: 9px;
  color: var(--ink);
  font-size: 1.55rem;
  font-weight: 950;
}

.taper-intel {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 13px;
}

.taper-intel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.taper-intel-head span,
.quit-clock-grid span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.taper-intel-head b {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue);
  padding: 6px 9px;
  font-size: 0.72rem;
  font-weight: 950;
  white-space: nowrap;
}

.taper-intel-head b[data-state="steady"] {
  background: var(--green-soft);
  color: var(--green);
}

.taper-intel-head b[data-state="recovery"] {
  background: var(--red-soft);
  color: var(--red);
}

.taper-intel p {
  color: var(--ink);
  font-weight: 850;
  line-height: 1.42;
}

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

.quit-clock-grid div {
  min-height: 86px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 10px;
}

.quit-clock-grid strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 1.25rem;
  font-weight: 950;
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.recovery-plan {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--amber-soft);
  padding: 10px;
}

.taper-qa-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 0.5fr);
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbff;
  padding: 12px;
}

.taper-qa-panel span,
.taper-qa-list span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.taper-qa-panel strong {
  display: block;
  margin-top: 7px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.25;
}

.taper-qa-panel p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 780;
  line-height: 1.36;
}

.taper-qa-actions {
  display: grid;
  gap: 8px;
}

.taper-qa-list {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.taper-qa-list article {
  min-height: 104px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 10px;
}

.taper-qa-list article[data-state="good"] {
  background: #f1fff7;
}

.taper-qa-list article[data-state="blocked"] {
  background: #fff1ee;
}

.taper-qa-list strong {
  display: block;
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.98rem;
  font-weight: 950;
}

.taper-qa-list p {
  margin-top: 6px;
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 760;
  line-height: 1.35;
}

.taper-qa-panel pre {
  grid-column: 1 / -1;
  max-height: 240px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #08111f;
  color: #f8fafc;
  padding: 12px;
  font-size: 0.76rem;
  font-weight: 760;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.reality-log {
  display: grid;
  grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr);
  gap: 10px;
}

.reality-log > div {
  display: grid;
  gap: 7px;
}

.reality-log span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.reality-log label {
  display: flex;
  gap: 8px;
}

.reality-log input {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 8px 10px;
  font-weight: 900;
}

.reality-log button {
  min-width: 116px;
}

.catchup-log {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(360px, 1.05fr);
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--blue-soft);
  padding: 12px;
}

.catchup-copy,
.catchup-fields,
.catchup-fields label {
  display: grid;
  gap: 7px;
}

.catchup-copy span,
.catchup-fields span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.catchup-copy strong {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.18;
}

.catchup-copy p {
  margin: 0;
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 820;
  line-height: 1.38;
}

.catchup-fields {
  grid-template-columns: 0.45fr 0.8fr auto;
  align-items: end;
}

.catchup-fields input,
.catchup-fields select {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 8px 10px;
  font-weight: 900;
}

.catchup-fields button {
  min-height: 42px;
  white-space: nowrap;
}

.action-button {
  border: 1px solid var(--line);
  color: #ffffff;
}

.smoke {
  background: var(--ink);
}

.skip {
  background: var(--green);
  box-shadow: inset 0 -4px 0 var(--ink);
}

.crave {
  background: var(--red);
  box-shadow: inset 0 -4px 0 var(--ink);
}

.plan-status {
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 10px 12px;
  font-weight: 950;
}

.schedule-list {
  display: grid;
  gap: 8px;
  max-height: 416px;
  margin: 16px 0 0;
  padding: 0;
  overflow: auto;
  list-style: none;
}

.schedule-list li {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 8px 10px;
}

.schedule-list time,
.schedule-list span {
  color: var(--ink);
  font-weight: 950;
}

.schedule-list b {
  border-radius: 8px;
  background: var(--blue-soft);
  color: var(--blue);
  padding: 6px 8px;
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.schedule-list .done b {
  background: var(--green-soft);
  color: var(--green);
}

.schedule-list .missed b {
  background: var(--red-soft);
  color: var(--red);
}

.schedule-list .extra {
  background: var(--amber-soft);
}

.schedule-list .extra b {
  background: var(--red-soft);
  color: var(--red);
}

.token-row-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.token-row-actions input {
  width: 58px;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 5px 7px;
  font-weight: 900;
}

.token-row-actions button {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--ink);
  color: #ffffff;
  padding: 5px 8px;
  font-size: 0.72rem;
  font-weight: 950;
}

.token-row-actions button:disabled {
  background: var(--paper-soft);
  color: var(--ink);
}

.intel-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(380px, 0.95fr);
  gap: 16px;
  align-items: start;
  margin-bottom: 16px;
}

.cost-grid,
.load-grid {
  display: grid;
  gap: 14px;
}

.cost-grid {
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.74fr);
}

.confidence-engine {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(210px, 0.45fr);
  gap: 10px;
  align-items: stretch;
  margin-top: 14px;
}

.confidence-engine > div:first-child,
.confidence-factors {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}

.confidence-engine > div:first-child span {
  color: var(--blue);
  display: block;
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.confidence-engine > div:first-child strong {
  color: var(--ink);
  display: block;
  margin-top: 8px;
  font-size: 3rem;
  font-weight: 950;
  line-height: 0.95;
}

.confidence-engine > div:first-child p {
  color: var(--ink);
  margin-top: 9px;
  font-weight: 800;
  line-height: 1.42;
}

.confidence-meter {
  display: flex;
  align-items: end;
  min-height: 142px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(23, 76, 255, 0.08) 1px, transparent 1px),
    #ffffff;
  background-size: 20% 100%;
  padding: 12px;
}

.confidence-meter i {
  display: block;
  height: 100%;
  min-width: 5px;
  border-radius: 6px;
  background: linear-gradient(180deg, var(--green), var(--blue));
  transition: width 0.2s ease;
}

.confidence-factors {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.confidence-factors span {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper-soft);
  color: var(--ink);
  padding: 7px 10px;
  font-size: 0.8rem;
  font-weight: 900;
  line-height: 1.1;
}

.cost-trust-ledger {
  display: grid;
  gap: 12px;
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
}

.cost-trust-head {
  display: grid;
  gap: 7px;
}

.cost-trust-head span,
.cost-trust-card span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.cost-trust-head strong {
  color: var(--ink);
  font-size: 1.28rem;
  font-weight: 950;
  line-height: 1.12;
}

.cost-trust-head p,
.cost-trust-card p {
  color: var(--ink);
  font-weight: 800;
  line-height: 1.42;
}

.cost-trust-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.cost-trust-card {
  min-height: 132px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 12px;
}

.cost-trust-card strong {
  display: block;
  color: var(--ink);
  margin-top: 8px;
  font-size: 1.15rem;
  font-weight: 950;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.cost-trust-card p {
  margin-top: 8px;
  font-size: 0.86rem;
}

.cost-trust-card[data-state="verified"] {
  background: var(--green-soft);
}

.cost-trust-card[data-state="adjusted"] {
  background: var(--blue-soft);
}

.cost-trust-card[data-state="action"] {
  background: var(--amber-soft);
}

.cost-method-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.region-field {
  grid-column: 1 / -1;
  margin: 0;
}

.method-card {
  min-height: 86px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}

.method-card span {
  color: var(--ink);
  display: block;
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.method-card strong {
  color: var(--ink);
  display: block;
  font-size: 0.96rem;
  font-weight: 920;
  line-height: 1.35;
  margin-top: 9px;
  overflow-wrap: anywhere;
}

.mode-list {
  display: grid;
  gap: 8px;
}

.mode-list span {
  min-height: 70px;
  gap: 3px;
}

.mode-list strong,
.mode-list small {
  color: var(--ink);
}

.mode-list small {
  font-weight: 760;
  line-height: 1.35;
}

.manual-preview {
  display: grid;
  grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
  gap: 14px;
  margin-top: 14px;
}

.manual-copy,
.year-list {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
}

.manual-copy {
  display: grid;
  align-content: start;
  gap: 8px;
}

.manual-copy strong,
.manual-copy p {
  color: var(--ink);
}

.manual-copy p {
  font-weight: 780;
  line-height: 1.5;
}

.manual-actions {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.year-list {
  display: grid;
  gap: 8px;
  max-height: 390px;
  overflow: auto;
}

.year-list div {
  display: grid;
  grid-template-columns: 90px 1fr 1fr auto;
  align-items: center;
  gap: 9px;
  border-bottom: 1px solid #d6dde7;
  padding-bottom: 8px;
}

.year-list div:last-child {
  border-bottom: 0;
}

.year-list span,
.year-list small,
.year-list b {
  color: var(--ink);
  font-weight: 950;
}

.year-list small {
  font-size: 0.7rem;
  text-transform: uppercase;
}

.year-list input {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 9px;
}

.year-list .verified-row {
  background: var(--green-soft);
}

.load-grid {
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.65fr);
}

.load-inputs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.load-score-card {
  display: grid;
  align-content: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--ink);
  color: #ffffff;
  padding: 16px;
}

.load-score-card span,
.load-score-card small {
  color: #ffffff;
  font-weight: 850;
}

.load-score-card strong {
  color: #ffffff;
  font-size: 4rem;
  font-weight: 950;
  line-height: 0.95;
}

.load-meter {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 14px;
}

.load-meter div {
  position: relative;
  overflow: hidden;
}

.load-meter div::after {
  position: absolute;
  right: 12px;
  bottom: 10px;
  left: 12px;
  height: 5px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--green) var(--load, 0%), #dfe6ef var(--load, 0%));
  content: "";
}

.load-meter div[data-level="medium"]::after {
  background: linear-gradient(90deg, var(--amber) var(--load, 0%), #dfe6ef var(--load, 0%));
}

.load-meter div[data-level="high"]::after {
  background: linear-gradient(90deg, var(--red) var(--load, 0%), #dfe6ef var(--load, 0%));
}

.substitution-card,
.impact-callout,
.route-copy {
  overflow-wrap: anywhere;
}

.substitution-card {
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 13px 14px;
  font-weight: 950;
  line-height: 1.42;
}

.substitution-card[data-level="medium"] {
  background: var(--amber-soft);
}

.substitution-card[data-level="high"] {
  background: var(--red-soft);
}

.substitution-card[data-level="low"] {
  background: var(--green-soft);
}

.substitution-lab {
  display: grid;
  gap: 12px;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
}

.substitution-lab-head {
  display: flex;
  gap: 12px;
  align-items: start;
  justify-content: space-between;
}

.substitution-lab-head div {
  display: grid;
  gap: 4px;
}

.substitution-lab-head span,
.substitution-grid span,
.guardrail-list span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.substitution-lab-head strong {
  color: var(--ink);
  font-size: 1.35rem;
  font-weight: 950;
  line-height: 1.05;
}

.substitution-lab-head b {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--soft);
  color: var(--ink);
  padding: 8px 10px;
  font-size: 0.82rem;
  font-weight: 950;
  white-space: nowrap;
}

.substitution-lab-head b[data-level="low"] {
  background: var(--green-soft);
}

.substitution-lab-head b[data-level="medium"] {
  background: var(--amber-soft);
}

.substitution-lab-head b[data-level="high"] {
  background: var(--red-soft);
}

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

.substitution-grid article {
  min-height: 132px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--soft);
  padding: 12px;
}

.substitution-grid strong {
  display: block;
  margin-top: 10px;
  color: var(--ink);
  font-size: 1.75rem;
  font-weight: 950;
  line-height: 1;
}

.substitution-grid p {
  margin-top: 8px;
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 800;
  line-height: 1.35;
}

.substitution-grid article[data-direction="down"] {
  background: var(--green-soft);
}

.substitution-grid article[data-direction="up"] {
  background: var(--amber-soft);
}

.substitution-grid article[data-direction="danger"] {
  background: var(--red-soft);
}

.guardrail-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.guardrail-list article {
  min-height: 96px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
  padding: 12px;
}

.guardrail-list strong {
  display: block;
  margin-top: 6px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.18;
}

.guardrail-list p {
  margin-top: 6px;
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 780;
  line-height: 1.35;
}

.cross-habit-watch {
  display: grid;
  gap: 12px;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #eefaf6;
  padding: 14px;
}

.cross-habit-head {
  display: flex;
  gap: 12px;
  align-items: start;
  justify-content: space-between;
}

.cross-habit-head div {
  display: grid;
  gap: 5px;
}

.cross-habit-head span,
.cross-habit-grid span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.cross-habit-head strong {
  color: var(--ink);
  font-size: 1.34rem;
  font-weight: 950;
  line-height: 1.08;
}

.cross-habit-head p {
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.4;
}

.cross-habit-head b {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #ffffff;
  color: var(--ink);
  padding: 8px 10px;
  font-size: 0.78rem;
  font-weight: 950;
  white-space: nowrap;
}

.cross-habit-head b[data-level="watch"] {
  background: var(--amber-soft);
}

.cross-habit-head b[data-level="urgent"] {
  background: var(--red-soft);
}

.cross-habit-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.cross-habit-grid article {
  min-height: 138px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}

.cross-habit-grid article[data-level="good"] {
  background: var(--green-soft);
}

.cross-habit-grid article[data-level="watch"] {
  background: var(--amber-soft);
}

.cross-habit-grid article[data-level="urgent"] {
  background: var(--red-soft);
}

.cross-habit-grid strong {
  display: block;
  margin-top: 9px;
  color: var(--ink);
  font-size: 1.2rem;
  font-weight: 950;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.cross-habit-grid p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 790;
  line-height: 1.35;
}

.rolling-load-history {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(260px, 1.1fr);
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}

.rolling-load-history span,
.rolling-load-trend span {
  color: var(--blue);
  font-size: 0.7rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.rolling-load-history strong,
.rolling-load-trend strong {
  display: block;
  margin-top: 6px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  overflow-wrap: anywhere;
}

.rolling-load-history p,
.rolling-load-trend p {
  margin-top: 6px;
  color: var(--ink);
  font-size: 0.82rem;
  font-weight: 760;
  line-height: 1.35;
}

.rolling-load-trend {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.rolling-load-trend article {
  min-width: 0;
  border: 1px solid rgba(17, 24, 39, 0.28);
  border-radius: 8px;
  background: var(--soft);
  padding: 10px;
}

.rolling-load-trend article[data-state="watch"] {
  background: var(--amber-soft);
}

.rolling-load-trend article[data-state="urgent"] {
  background: var(--red-soft);
}

.rolling-demo-controls {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(300px, 1.1fr);
  gap: 10px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #f8fafc;
  padding: 12px;
}

.rolling-demo-controls span {
  color: var(--blue);
  font-size: 0.7rem;
  font-weight: 950;
  text-transform: uppercase;
}

.rolling-demo-controls strong {
  display: block;
  margin-top: 6px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
}

.rolling-demo-controls p {
  margin-top: 6px;
  color: var(--ink);
  font-size: 0.82rem;
  font-weight: 760;
  line-height: 1.35;
}

.rolling-demo-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.rolling-demo-actions button[data-active="true"] {
  background: var(--ink);
  color: #ffffff;
}

.rolling-demo-qa-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.cross-habit-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.cross-habit-watch pre {
  max-height: 260px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #08111f;
  color: #f8fafc;
  padding: 14px;
  font-size: 0.78rem;
  font-weight: 760;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

#confidenceBadge[data-confidence="manually-verified"],
#loadRiskBadge[data-level="low"] {
  background: var(--green-soft);
}

#confidenceBadge[data-confidence="partially-verified"],
#confidenceBadge[data-confidence="user-adjusted"],
#loadRiskBadge[data-level="medium"] {
  background: var(--amber-soft);
}

#loadRiskBadge[data-level="high"] {
  background: var(--red-soft);
}

.support-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  margin-bottom: 16px;
}

.recovery-network-panel {
  display: grid;
  gap: 14px;
  margin-bottom: 16px;
  background:
    linear-gradient(135deg, rgba(23, 76, 255, 0.08), transparent 38%),
    var(--paper);
  padding: 18px;
}

.ai-coach-panel {
  display: grid;
  gap: 14px;
  margin-bottom: 16px;
  background:
    linear-gradient(135deg, rgba(16, 185, 129, 0.12), transparent 42%),
    var(--paper);
  padding: 18px;
}

.trigger-intelligence-panel {
  display: grid;
  gap: 14px;
  margin-bottom: 16px;
  background:
    linear-gradient(135deg, rgba(217, 90, 43, 0.12), transparent 42%),
    var(--paper);
  padding: 18px;
}

.care-circle-panel {
  display: grid;
  gap: 14px;
  margin-bottom: 16px;
  background:
    linear-gradient(135deg, rgba(124, 58, 237, 0.11), transparent 42%),
    var(--paper);
  padding: 18px;
}

.money-vault-panel {
  display: grid;
  gap: 14px;
  margin-bottom: 16px;
  background:
    linear-gradient(135deg, rgba(14, 165, 112, 0.12), transparent 42%),
    var(--paper);
  padding: 18px;
}

.hard-day-panel {
  display: grid;
  gap: 14px;
  margin-bottom: 16px;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.08), transparent 42%),
    var(--paper);
  padding: 18px;
}

.network-promise {
  display: grid;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--blue-soft);
  padding: 14px;
}

.coach-promise {
  display: grid;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--green-soft);
  padding: 14px;
}

.coach-handoff-panel {
  display: grid;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
  padding: 14px;
}

.coach-handoff-panel > div:first-child {
  display: grid;
  gap: 6px;
}

.coach-handoff-panel span {
  color: var(--blue);
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.coach-handoff-panel strong {
  color: var(--ink);
  font-size: 1.12rem;
  font-weight: 950;
  line-height: 1.18;
}

.coach-handoff-panel p {
  color: var(--ink);
  font-size: 0.94rem;
  font-weight: 800;
  line-height: 1.42;
  margin: 0;
}

.coach-handoff-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.trigger-promise {
  display: grid;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--amber-soft);
  padding: 14px;
}

.care-promise {
  display: grid;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f1eafe;
  padding: 14px;
}

.vault-promise {
  display: grid;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--green-soft);
  padding: 14px;
}

.hard-day-promise {
  display: grid;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #eef2ff;
  padding: 14px;
}

.network-promise strong {
  color: var(--ink);
  font-size: 1.12rem;
  font-weight: 950;
  line-height: 1.16;
}

.coach-promise strong {
  color: var(--ink);
  font-size: 1.12rem;
  font-weight: 950;
  line-height: 1.16;
}

.trigger-promise strong {
  color: var(--ink);
  font-size: 1.12rem;
  font-weight: 950;
  line-height: 1.16;
}

.care-promise strong {
  color: var(--ink);
  font-size: 1.12rem;
  font-weight: 950;
  line-height: 1.16;
}

.vault-promise strong {
  color: var(--ink);
  font-size: 1.12rem;
  font-weight: 950;
  line-height: 1.16;
}

.hard-day-promise strong {
  color: var(--ink);
  font-size: 1.12rem;
  font-weight: 950;
  line-height: 1.16;
}

.network-promise p {
  color: var(--ink);
  font-size: 0.94rem;
  font-weight: 800;
  line-height: 1.42;
}

.coach-promise p {
  color: var(--ink);
  font-size: 0.94rem;
  font-weight: 800;
  line-height: 1.42;
}

.trigger-promise p {
  color: var(--ink);
  font-size: 0.94rem;
  font-weight: 800;
  line-height: 1.42;
}

.care-promise p {
  color: var(--ink);
  font-size: 0.94rem;
  font-weight: 800;
  line-height: 1.42;
}

.vault-promise p {
  color: var(--ink);
  font-size: 0.94rem;
  font-weight: 800;
  line-height: 1.42;
}

.hard-day-promise p {
  color: var(--ink);
  font-size: 0.94rem;
  font-weight: 800;
  line-height: 1.42;
}

.network-grid,
.network-pulse,
.coach-grid,
.coach-next-move,
.trigger-grid,
.trigger-arrival,
.care-grid,
.care-checkin,
.vault-grid,
.vault-projection,
.hard-day-grid,
.hard-day-review {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.network-card,
.network-pulse article,
.coach-card,
.coach-next-move article,
.trigger-card,
.trigger-arrival article,
.care-card,
.care-checkin article,
.vault-card,
.vault-projection article,
.hard-day-card,
.hard-day-review article {
  min-height: 156px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 14px;
}

.trigger-card[data-level="watch"],
.trigger-arrival article[data-level="watch"] {
  background: var(--amber-soft);
}

.trigger-card[data-level="good"],
.trigger-arrival article[data-level="good"] {
  background: var(--green-soft);
}

.trigger-card[data-level="urgent"],
.trigger-arrival article[data-level="urgent"] {
  background: var(--red-soft);
}

.coach-card[data-level="watch"],
.coach-next-move article[data-level="watch"] {
  background: var(--amber-soft);
}

.coach-card[data-level="good"],
.coach-next-move article[data-level="good"] {
  background: var(--green-soft);
}

.coach-card[data-level="urgent"],
.coach-next-move article[data-level="urgent"] {
  background: var(--red-soft);
}

.network-card[data-state="locked"] {
  background: var(--amber-soft);
}

.network-card[data-state="active"] {
  background: var(--green-soft);
}

.care-card[data-state="locked"],
.care-checkin article[data-state="locked"] {
  background: var(--amber-soft);
}

.care-card[data-state="active"],
.care-checkin article[data-state="active"] {
  background: var(--green-soft);
}

.care-card[data-state="blocked"],
.care-checkin article[data-state="blocked"] {
  background: var(--red-soft);
}

.vault-card[data-state="locked"],
.vault-projection article[data-state="locked"] {
  background: var(--amber-soft);
}

.vault-card[data-state="active"],
.vault-projection article[data-state="active"] {
  background: var(--green-soft);
}

.vault-card[data-state="blocked"],
.vault-projection article[data-state="blocked"] {
  background: var(--red-soft);
}

.hard-day-card[data-state="locked"],
.hard-day-review article[data-state="locked"] {
  background: var(--amber-soft);
}

.hard-day-card[data-state="active"],
.hard-day-review article[data-state="active"] {
  background: var(--green-soft);
}

.hard-day-card[data-state="watch"],
.hard-day-review article[data-state="watch"] {
  background: var(--amber-soft);
}

.network-card span,
.network-pulse span,
.coach-card span,
.coach-next-move span,
.trigger-card span,
.trigger-arrival span,
.care-card span,
.care-checkin span,
.vault-card span,
.vault-projection span,
.hard-day-card span,
.hard-day-review span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.network-card strong,
.network-pulse strong,
.coach-card strong,
.coach-next-move strong,
.trigger-card strong,
.trigger-arrival strong,
.care-card strong,
.care-checkin strong,
.vault-card strong,
.vault-projection strong,
.hard-day-card strong,
.hard-day-review strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 1.18rem;
  font-weight: 950;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

.network-card p,
.network-pulse p,
.coach-card p,
.coach-next-move p,
.trigger-card p,
.trigger-arrival p,
.care-card p,
.care-checkin p,
.vault-card p,
.vault-projection p,
.hard-day-card p,
.hard-day-review p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 790;
  line-height: 1.36;
}

.network-actions,
.coach-actions,
.trigger-actions,
.care-actions,
.vault-actions,
.hard-day-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.hold-gap-room {
  display: grid;
  grid-template-columns: minmax(220px, 0.9fr) minmax(0, 1.1fr);
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
}

.hold-gap-main {
  display: grid;
  align-content: start;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--ink);
  color: #ffffff;
  padding: 14px;
}

.hold-gap-main span,
.hold-gap-presence-list span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.hold-gap-main strong {
  color: #ffffff;
  font-size: 2.4rem;
  font-weight: 950;
  line-height: 1;
}

.hold-gap-main p,
.hold-gap-outcome {
  margin: 0;
  color: #ffffff;
  font-size: 0.96rem;
  font-weight: 820;
  line-height: 1.36;
}

.hold-gap-presence-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.hold-gap-presence-list article {
  min-height: 116px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--green-soft);
  padding: 12px;
}

.hold-gap-presence-list article[data-state="waiting"] {
  background: var(--blue-soft);
}

.hold-gap-presence-list strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 1.04rem;
  font-weight: 950;
  line-height: 1.12;
}

.hold-gap-presence-list p {
  margin: 7px 0 0;
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.32;
}

.hold-gap-actions {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.hold-gap-outcome {
  grid-column: 1 / -1;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--blue-soft);
  color: var(--ink);
  padding: 12px;
}

.network-safety-panel {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
}

.network-safety-copy {
  display: grid;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--red-soft);
  padding: 12px;
}

.network-safety-copy span,
.network-safety-cards span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.network-safety-copy strong,
.network-safety-cards strong {
  color: var(--ink);
  font-size: 1.08rem;
  font-weight: 950;
  line-height: 1.14;
}

.network-safety-copy p,
.network-safety-cards p {
  margin: 0;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.36;
}

.network-safety-cards,
.network-safety-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.network-safety-cards article {
  min-height: 120px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--blue-soft);
  padding: 12px;
}

.network-safety-cards article[data-state="ready"] {
  background: var(--green-soft);
}

.network-safety-cards article[data-state="blocked"] {
  background: var(--amber-soft);
}

.recovery-network-panel pre,
.ai-coach-panel pre,
.trigger-intelligence-panel pre,
.care-circle-panel pre,
.money-vault-panel pre,
.hard-day-panel pre {
  max-height: 300px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #08111f;
  color: #f8fafc;
  padding: 14px;
  font-size: 0.78rem;
  font-weight: 760;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.receipt-paper {
  margin-top: 16px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 16px;
  font-family: "Courier New", ui-monospace, monospace;
  line-height: 1.55;
}

.receipt-row {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px dotted var(--line);
  padding: 8px 0;
}

.receipt-row:last-child {
  border-bottom: 0;
}

.rescue-box {
  margin-top: 16px;
  min-height: 226px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--red-soft);
  color: var(--ink);
  padding: 16px;
  line-height: 1.58;
}

.rescue-box strong {
  display: block;
  margin-bottom: 8px;
  font-size: 1.08rem;
}

.rescue-focus,
.rescue-outcome {
  margin: 10px 0 0;
  font-weight: 850;
}

.rescue-countdown {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 10px;
  align-items: center;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 10px;
}

.rescue-countdown span,
.rescue-countdown p {
  margin: 0;
}

.rescue-countdown span {
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
  color: var(--muted);
}

.rescue-countdown strong {
  margin: 0;
  font-size: 1.45rem;
}

.rescue-countdown p {
  grid-column: 1 / -1;
  font-weight: 800;
}

.rescue-now-card {
  display: grid;
  gap: 4px;
  margin-top: 12px;
  border: 2px solid var(--ink);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}

.rescue-after-check {
  display: grid;
  gap: 4px;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--blue-soft);
  padding: 10px 12px;
}

.rescue-receipt {
  display: grid;
  gap: 4px;
  margin-bottom: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 10px 12px;
}

.rescue-now-card span,
.rescue-after-check span,
.rescue-receipt span,
.rescue-step span {
  font-size: 0.76rem;
  font-weight: 900;
  text-transform: uppercase;
  color: var(--muted);
}

.rescue-now-card strong,
.rescue-receipt strong,
.rescue-step strong {
  margin: 0;
}

.rescue-now-card p,
.rescue-after-check p,
.rescue-receipt p,
.rescue-step p {
  margin: 0;
  font-weight: 800;
}

.rescue-level {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.rescue-trigger {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.rescue-level span,
.rescue-trigger span {
  font-weight: 900;
}

.rescue-level div,
.rescue-trigger div {
  display: grid;
  gap: 8px;
}

.rescue-level div {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.rescue-trigger div {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.rescue-level button[aria-pressed="true"],
.rescue-trigger button[aria-pressed="true"] {
  background: var(--ink);
  color: #ffffff;
}

.rescue-level-copy {
  margin: 0;
  color: var(--muted);
  font-weight: 800;
}

.rescue-outcome-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.rescue-steps {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.rescue-step {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 10px;
  font-weight: 850;
  display: grid;
  gap: 4px;
}

.rescue-step.is-active {
  border-color: var(--ink);
  box-shadow: inset 0 -4px 0 var(--blue);
}

.trend-bars {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
  min-height: 190px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
}

.eta-trend-panel,
.missing-day-grid,
.missing-day-actions {
  display: grid;
  gap: 10px;
}

.eta-trend-panel {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 12px;
}

.recovery-change-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto);
  align-items: center;
  gap: 14px;
  border: 1px solid rgba(17, 24, 39, 0.32);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
  margin-bottom: 12px;
  box-shadow: 0 14px 30px rgba(17, 24, 39, 0.08);
}

.recovery-change-card[data-level="good"] {
  background: var(--green-soft);
}

.recovery-change-card[data-level="watch"] {
  background: var(--amber-soft);
}

.recovery-change-card[data-level="urgent"] {
  background: var(--red-soft);
}

.recovery-change-card span {
  color: var(--blue);
  font-size: 0.7rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.recovery-change-card strong {
  display: block;
  margin-top: 5px;
  color: var(--ink);
  font-size: 1.28rem;
  font-weight: 950;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

.recovery-change-card p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 780;
  line-height: 1.38;
}

.recovery-change-card b {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(17, 24, 39, 0.32);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 10px 12px;
  font-size: 0.86rem;
  font-weight: 950;
  line-height: 1.2;
  text-align: center;
  overflow-wrap: anywhere;
}

.eta-trend-panel article,
.missing-days-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
}

.eta-trend-panel span,
.missing-days-panel span {
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 950;
  text-transform: uppercase;
}

.eta-trend-panel strong,
.missing-days-panel strong {
  display: block;
  color: var(--ink);
  font-size: 1.35rem;
  font-weight: 950;
  margin-top: 4px;
}

.eta-trend-panel p,
.missing-days-panel p,
.missing-days-panel small {
  color: var(--ink);
  font-weight: 800;
  line-height: 1.45;
}

.missing-days-panel {
  display: grid;
  gap: 12px;
  margin-bottom: 12px;
  background: #fffaf2;
}

.missing-day-grid {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.missing-day-grid label {
  display: grid;
  gap: 6px;
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 900;
}

.missing-day-grid input {
  min-height: 40px;
}

.missing-day-review {
  display: grid;
  gap: 8px;
  border-top: 1px solid rgba(117, 98, 70, 0.24);
  padding-top: 12px;
}

.missing-day-review ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.missing-day-review li {
  min-width: 0;
}

.missing-day-review b {
  display: block;
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 950;
  line-height: 1.25;
}

.missing-day-review small {
  display: block;
  margin-top: 3px;
}

.missing-day-actions {
  grid-template-columns: minmax(180px, 1fr) repeat(4, auto);
  align-items: end;
}

.bar-stack[data-unknown="true"] {
  align-items: center;
}

.bar-stack[data-unknown="true"]::before {
  content: "?";
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px dashed var(--muted);
  border-radius: 50%;
  color: var(--ink);
  font-weight: 950;
}

.trend-bars > div {
  display: grid;
  grid-template-rows: 1fr auto;
  gap: 8px;
  min-width: 0;
  text-align: center;
}

.bar-stack {
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 4px;
  min-height: 132px;
}

.bar-stack i {
  display: block;
  width: min(18px, 42%);
  border-radius: 8px 8px 3px 3px;
}

.bar-smoked {
  background: var(--red);
}

.bar-skipped {
  background: var(--green);
}

.trend-bars small {
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 950;
}

.history-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.history-list div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 11px 12px;
}

.history-list span,
.history-list strong {
  color: var(--ink);
  font-weight: 900;
}

.history-list span {
  display: grid;
  gap: 3px;
}

.history-list small {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
}

.history-list strong {
  text-align: right;
}

.history-edit-button {
  justify-self: end;
  white-space: nowrap;
}

.pattern-check-panel {
  display: grid;
  gap: 12px;
  border: 1px solid rgba(17, 24, 39, 0.18);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
  margin-top: 14px;
}

.pattern-check-copy,
.pattern-insight-copy,
.pattern-choice-panel {
  display: grid;
  gap: 7px;
}

.pattern-check-copy span,
.pattern-insight-copy span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.pattern-check-copy strong,
.pattern-choice-panel strong,
.pattern-insight-copy strong {
  color: var(--ink);
  font-weight: 950;
  line-height: 1.15;
}

.pattern-check-copy strong {
  font-size: 1.08rem;
}

.pattern-check-copy p,
.pattern-insight-copy p,
.pattern-insight-copy small {
  color: var(--ink);
  font-weight: 800;
  line-height: 1.42;
}

.pattern-start-actions,
.pattern-choice-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pattern-choice-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  padding: 12px;
}

.pattern-choice-buttons button {
  min-height: 38px;
  border: 1px solid rgba(17, 24, 39, 0.22);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 8px 10px;
  font-size: 0.82rem;
  font-weight: 900;
}

.pattern-choice-buttons button:hover,
.pattern-choice-buttons button:focus-visible {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.pattern-insight-card {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  border: 1px solid rgba(17, 24, 39, 0.14);
  border-radius: 8px;
  background: #f8fafc;
  padding: 12px;
}

.pattern-donut {
  --pattern-donut-bg: conic-gradient(#dbeafe 0 100%);
  position: relative;
  display: grid;
  place-items: center;
  width: 118px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--pattern-donut-bg);
  box-shadow: inset 0 0 0 1px rgba(17, 24, 39, 0.1);
}

.pattern-donut::after {
  content: "";
  position: absolute;
  inset: 22px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 0 0 1px rgba(17, 24, 39, 0.08);
}

.pattern-donut-center {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 2px;
  color: var(--ink);
  text-align: center;
}

.pattern-donut-center strong {
  max-width: 70px;
  font-size: 0.88rem;
  font-weight: 950;
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.pattern-donut-center span {
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 900;
}

.pattern-breakdown-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.pattern-breakdown-list b {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  border: 1px solid rgba(17, 24, 39, 0.18);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 6px 8px;
  font-size: 0.76rem;
  font-weight: 900;
}

.notification-panel {
  margin-bottom: 16px;
  background: #ffffff;
  padding: 18px;
}

.notification-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}

.notification-controls {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}

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

.push-permission-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(280px, 0.86fr);
  gap: 10px;
  margin-top: 12px;
}

.permission-card {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 152px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 13px;
}

.permission-card[data-state="granted"] {
  background: var(--green-soft);
}

.permission-card[data-state="denied"],
.permission-card[data-state="opted-out"] {
  background: var(--red-soft);
}

.permission-card[data-state="unsupported"] {
  background: var(--amber-soft);
}

.permission-card span,
.permission-actions-card small {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.permission-card strong {
  color: var(--ink);
  font-size: 1.24rem;
  font-weight: 950;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

.permission-card p {
  color: var(--ink);
  font-weight: 800;
  line-height: 1.42;
}

.toggle-line {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 9px 10px;
}

.toggle-line input {
  width: 18px;
  height: 18px;
  accent-color: var(--blue);
}

.toggle-line b {
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 930;
  line-height: 1.18;
}

.permission-actions-card .secondary-button {
  margin-top: 2px;
}

.local-reminder-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.72fr) minmax(220px, 0.7fr);
  gap: 10px;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}

.local-reminder-panel[data-state="ready"] {
  background: var(--green-soft);
}

.local-reminder-panel[data-state="held"],
.local-reminder-panel[data-state="fallback"] {
  background: var(--amber-soft);
}

.local-reminder-panel[data-state="cancelled"],
.local-reminder-panel[data-state="blocked"] {
  background: var(--red-soft);
}

.local-reminder-panel article,
.local-reminder-actions {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 126px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.8);
  padding: 12px;
}

.local-reminder-panel span,
.local-reminder-actions small {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.local-reminder-panel strong {
  color: var(--ink);
  font-size: 1.16rem;
  font-weight: 950;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

.local-reminder-panel p {
  color: var(--ink);
  font-weight: 820;
  line-height: 1.38;
}

.notification-card {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 156px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  color: var(--ink);
  padding: 13px;
}

.notification-card[data-level="urgent"] {
  background: var(--red-soft);
}

.notification-card[data-level="watch"] {
  background: var(--amber-soft);
}

.notification-card[data-level="good"] {
  background: var(--green-soft);
}

.notification-card span,
.notification-note {
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 950;
  text-transform: uppercase;
}

.notification-card strong {
  color: var(--ink);
  font-size: 1.32rem;
  font-weight: 950;
  line-height: 1.08;
  overflow-wrap: anywhere;
}

.notification-card p {
  color: var(--ink);
  font-weight: 800;
  line-height: 1.42;
}

.notification-note {
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 11px 12px;
  line-height: 1.35;
  text-transform: none;
}

.notification-job-board {
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 13px;
}

.notification-job-board h3 {
  margin: 0;
  color: var(--ink);
  font-size: 1.18rem;
  font-weight: 950;
  line-height: 1.12;
}

.worker-rule-strip {
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 11px;
}

.worker-rule-strip > b {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  border-radius: 999px;
  background: var(--ink);
  color: #ffffff;
  padding: 0 10px;
  font-size: 0.78rem;
  font-weight: 950;
}

.worker-rule-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.worker-rule-grid article {
  min-height: 112px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 10px;
}

.worker-rule-grid span,
.notification-job small {
  display: block;
  color: var(--blue);
  font-size: 0.7rem;
  font-weight: 950;
  text-transform: uppercase;
}

.worker-rule-grid strong {
  display: block;
  margin-top: 5px;
  color: var(--ink);
  font-size: 1.05rem;
  font-weight: 950;
  line-height: 1.08;
}

.worker-rule-grid p {
  margin-top: 6px;
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 820;
  line-height: 1.32;
}

.notification-job-list {
  display: grid;
  gap: 9px;
  margin-top: 12px;
}

.notification-job {
  display: grid;
  grid-template-columns: minmax(160px, 0.7fr) minmax(0, 1.1fr) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 11px;
}

.notification-job[data-status="blocked"],
.notification-job[data-status="fallback"],
.notification-job[data-status="held"] {
  background: var(--amber-soft);
}

.notification-job[data-status="cancelled"] {
  background: var(--red-soft);
}

.notification-job[data-status="responded"] {
  background: var(--green-soft);
}

.notification-job span {
  display: block;
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.notification-job strong,
.notification-job p,
.notification-job code {
  color: var(--ink);
}

.notification-job strong {
  display: block;
  margin-top: 5px;
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.18;
}

.notification-job p {
  margin-top: 5px;
  font-size: 0.88rem;
  font-weight: 780;
  line-height: 1.32;
}

.notification-job .job-worker-line {
  font-weight: 920;
}

.notification-job code {
  display: block;
  margin-top: 5px;
  border: 1px solid #d4dae6;
  border-radius: 8px;
  background: #f8fafc;
  padding: 7px;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.28;
  overflow-wrap: anywhere;
  white-space: normal;
}

.job-actions {
  display: grid;
  gap: 6px;
  min-width: 118px;
}

.job-actions button {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 0 9px;
  font-size: 0.82rem;
  font-weight: 950;
}

.job-actions button:hover {
  background: var(--blue-soft);
}

.account-panel {
  margin-bottom: 16px;
  background: #ffffff;
  padding: 18px;
}

.account-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr) minmax(280px, 0.8fr);
  gap: 12px;
  margin-top: 16px;
}

.account-card {
  display: grid;
  align-content: start;
  gap: 9px;
  min-height: 178px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  color: var(--ink);
  padding: 14px;
}

.account-card span,
.sync-checklist span,
.account-actions-card small {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.account-card strong {
  color: var(--ink);
  font-size: 1.34rem;
  font-weight: 950;
  line-height: 1.08;
  overflow-wrap: anywhere;
}

.account-card p {
  color: var(--ink);
  font-weight: 800;
  line-height: 1.45;
}

.identity-card {
  background: var(--ink);
  color: #ffffff;
}

.identity-card span,
.identity-card strong,
.identity-card p {
  color: #ffffff;
}

.account-actions-card .secondary-button {
  margin-top: 4px;
}

.account-actions-card small {
  display: block;
  color: var(--ink);
}

.cloud-sync-panel {
  display: grid;
  gap: 14px;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
}

.cloud-sync-panel h3 {
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 1.18rem;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1.18;
}

.cloud-sync-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.2fr) minmax(260px, 0.7fr);
  gap: 10px;
  align-items: end;
}

.cloud-sync-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.cloud-status-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 0.9fr) minmax(0, 1.4fr);
  gap: 10px;
}

.cloud-status-grid div {
  min-height: 112px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 12px;
}

.cloud-sync-panel span,
.cloud-status-grid span {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.cloud-status-grid strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 0.98rem;
  font-weight: 900;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.auth-readiness-panel,
.migration-preview-panel {
  display: grid;
  gap: 14px;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
}

.auth-readiness-panel h3,
.migration-preview-panel h3 {
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 1.18rem;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1.18;
}

.auth-provider-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) repeat(3, minmax(150px, 0.6fr));
  gap: 10px;
  align-items: end;
}

.auth-action-status {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--blue-soft);
  color: var(--ink);
  padding: 12px;
  font-weight: 850;
  line-height: 1.4;
}

.auth-session-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(220px, 0.7fr);
  gap: 10px;
}

.auth-session-grid article,
.auth-session-actions {
  min-height: 116px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 12px;
}

.auth-session-grid article strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.auth-session-grid article p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 760;
  line-height: 1.36;
  overflow-wrap: anywhere;
}

.auth-session-actions {
  display: grid;
  gap: 8px;
  align-content: center;
}

.provider-signin-sandbox {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 0.5fr);
  gap: 12px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
}

.product-size-helper {
  margin-top: 10px;
  color: var(--ink);
  font-weight: 820;
}

.provider-qa-panel {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 0.5fr);
  gap: 12px;
  align-items: start;
  scroll-margin-top: 150px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbff;
  padding: 14px;
}

.provider-signin-sandbox strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.provider-qa-panel strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.provider-signin-sandbox p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 780;
  line-height: 1.38;
}

.provider-qa-panel p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 780;
  line-height: 1.38;
}

.provider-signin-actions {
  display: grid;
  gap: 8px;
}

.provider-qa-actions {
  display: grid;
  gap: 8px;
}

.provider-qa-help {
  grid-column: 1 / -1;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #eef5ff;
  padding: 10px 12px;
}

.provider-signin-checklist {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.provider-qa-list {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.provider-signin-checklist article {
  min-height: 118px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 11px;
}

.provider-qa-list article {
  min-height: 118px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 11px;
}

.provider-signin-checklist article[data-state="good"] {
  background: #f1fff7;
}

.provider-qa-list article[data-state="good"] {
  background: #f1fff7;
}

.provider-signin-checklist article[data-state="blocked"] {
  background: #fff1ee;
}

.provider-qa-list article[data-state="blocked"] {
  background: #fff1ee;
}

.provider-signin-sandbox pre {
  grid-column: 1 / -1;
  max-height: 300px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #08111f;
  color: #f8fafc;
  padding: 14px;
  font-size: 0.78rem;
  font-weight: 760;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.provider-qa-panel pre {
  grid-column: 1 / -1;
  max-height: 300px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #08111f;
  color: #f8fafc;
  padding: 14px;
  font-size: 0.78rem;
  font-weight: 760;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.provider-qa-panel textarea {
  grid-column: 1 / -1;
  width: 100%;
  min-height: 180px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #ffffff;
  color: var(--ink);
  font: 700 0.9rem/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
}

.migration-preview-list,
.account-control-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.account-control-list {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.migration-preview-list article,
.account-control-list article {
  min-height: 118px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 12px;
}

.migration-preview-list span,
.account-control-list span,
.auth-readiness-panel span,
.auth-session-grid span,
.provider-signin-checklist span,
.provider-qa-panel span,
.provider-qa-list span,
.cloud-upload-guard span,
.cloud-guard-matrix span,
.cloud-guard-matrix-list span,
.backend-integrity-panel span,
.backend-integrity-list span,
.migration-preview-panel span {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.migration-preview-list strong,
.account-control-list strong,
.provider-signin-checklist strong,
.provider-qa-list strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.migration-preview-list p,
.account-control-list p,
.provider-signin-checklist p,
.provider-qa-list p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 760;
  line-height: 1.36;
  overflow-wrap: anywhere;
}

.migration-dry-run {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.58fr);
  gap: 12px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 14px;
}

.migration-dry-run strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.migration-dry-run p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 780;
  line-height: 1.38;
}

.migration-dry-run-actions {
  display: grid;
  gap: 8px;
}

.migration-dry-run pre {
  grid-column: 1 / -1;
  max-height: 340px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #08111f;
  color: #f8fafc;
  padding: 14px;
  font-size: 0.78rem;
  font-weight: 760;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.migration-upload-sandbox {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.58fr);
  gap: 12px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
}

.migration-upload-sandbox strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.migration-upload-sandbox p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 780;
  line-height: 1.38;
}

.migration-upload-actions {
  display: grid;
  gap: 8px;
}

.migration-upload-checklist {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.migration-upload-checklist article {
  min-height: 120px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 11px;
}

.migration-upload-checklist article[data-state="good"] {
  background: #f1fff7;
}

.migration-upload-checklist article[data-state="blocked"] {
  background: #fff1ee;
}

.migration-upload-sandbox pre {
  grid-column: 1 / -1;
  max-height: 340px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #08111f;
  color: #f8fafc;
  padding: 14px;
  font-size: 0.78rem;
  font-weight: 760;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.cloud-upload-guard,
.cloud-guard-matrix,
.backend-integrity-panel {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.5fr);
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 14px;
}

.cloud-upload-guard strong,
.cloud-guard-matrix strong,
.backend-integrity-panel strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.cloud-upload-guard p,
.cloud-guard-matrix p,
.backend-integrity-panel p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 780;
  line-height: 1.38;
}

.cloud-upload-guard-actions,
.cloud-guard-matrix-actions,
.backend-integrity-actions {
  display: grid;
  gap: 8px;
}

.mapbox-token-check {
  display: grid;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}

.mapbox-token-check .field {
  margin: 0;
}

.mapbox-token-check p {
  margin: 0;
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 760;
}

.mapbox-static-preview {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 0.38fr);
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}

.mapbox-static-preview > div:first-child span {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.mapbox-static-preview-frame {
  grid-column: 1 / -1;
  min-height: 220px;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(23, 76, 255, 0.08) 1px, transparent 1px),
    linear-gradient(180deg, #f8fbff 0%, #edf3ff 100%);
  background-size: 34px 34px, auto;
}

.mapbox-static-preview-frame img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 220px;
  object-fit: cover;
}

.mapbox-static-preview-frame figcaption {
  padding: 10px 12px;
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 820;
}

.cloud-guard-matrix-list,
.backend-integrity-list {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.data-rights-action-summary {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.account-safety-hub-summary {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.account-safety-path {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.data-rights-receipt-strip {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.data-rights-next-safe-step {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.data-rights-action-lock {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.account-recovery-readiness-summary {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.account-controls-gate-summary {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.account-controls-customer-receipt {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.cloud-guard-matrix-list article,
.account-safety-hub-summary article,
.account-safety-path article,
.data-rights-action-summary article,
.data-rights-receipt-strip article,
.data-rights-next-safe-step article,
.data-rights-action-lock article,
.account-recovery-readiness-summary article,
.account-controls-gate-summary article,
.account-controls-customer-receipt article,
.backend-integrity-list article {
  min-height: 120px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 11px;
}

.cloud-guard-matrix-list article[data-state="good"],
.account-safety-hub-summary article[data-state="good"],
.account-safety-path article[data-state="good"],
.data-rights-action-summary article[data-state="good"],
.data-rights-receipt-strip article[data-state="good"],
.data-rights-next-safe-step article[data-state="good"],
.data-rights-action-lock article[data-state="good"],
.account-recovery-readiness-summary article[data-state="good"],
.account-controls-gate-summary article[data-state="good"],
.account-controls-customer-receipt article[data-state="good"],
.backend-integrity-list article[data-state="good"] {
  background: #f1fff7;
}

.cloud-guard-matrix-list article[data-state="blocked"],
.account-safety-hub-summary article[data-state="blocked"],
.account-safety-path article[data-state="blocked"],
.data-rights-action-summary article[data-state="blocked"],
.data-rights-receipt-strip article[data-state="blocked"],
.data-rights-next-safe-step article[data-state="blocked"],
.data-rights-action-lock article[data-state="blocked"],
.account-recovery-readiness-summary article[data-state="blocked"],
.account-controls-gate-summary article[data-state="blocked"],
.account-controls-customer-receipt article[data-state="blocked"],
.backend-integrity-list article[data-state="blocked"] {
  background: #fff1ee;
}

.data-rights-action-summary article[data-role="delete-safety"] {
  grid-column: 1 / -1;
}

.data-rights-delete-safety-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
  padding: 0;
  list-style: none;
}

.data-rights-next-safe-step-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
  padding: 0;
  list-style: none;
}

.data-rights-action-lock-grid {
  display: grid;
  grid-template-columns: 0.8fr 1.35fr 1.15fr;
  gap: 8px;
  margin-top: 10px;
}

.data-rights-action-lock-grid section {
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.76);
  padding: 10px;
}

.data-rights-action-lock-grid section > b {
  display: block;
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.data-rights-action-lock-grid ul {
  display: grid;
  gap: 7px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

.data-rights-action-lock-grid li {
  border: 1px solid rgba(29, 78, 216, 0.13);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
  padding: 8px;
  min-height: 62px;
}

.data-rights-delete-safety-list li {
  border: 1px solid rgba(169, 68, 40, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  padding: 9px;
  min-height: 82px;
}

.data-rights-next-safe-step-list li {
  border: 1px solid rgba(29, 78, 216, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
  padding: 9px;
  min-height: 86px;
}

.data-rights-delete-safety-list b,
.data-rights-delete-safety-list em,
.data-rights-next-safe-step-list b,
.data-rights-next-safe-step-list em,
.data-rights-action-lock-grid strong,
.data-rights-action-lock-grid em {
  display: block;
  color: var(--ink);
  font-style: normal;
}

.data-rights-delete-safety-list b,
.data-rights-next-safe-step-list b,
.data-rights-action-lock-grid strong {
  font-size: 0.84rem;
  font-weight: 950;
}

.data-rights-delete-safety-list em,
.data-rights-next-safe-step-list em,
.data-rights-action-lock-grid em {
  margin-top: 5px;
  font-size: 0.8rem;
  font-weight: 760;
  line-height: 1.34;
}

.cloud-guard-matrix-list strong,
.account-safety-hub-summary strong,
.account-safety-path strong,
.data-rights-action-summary strong,
.data-rights-receipt-strip strong,
.data-rights-next-safe-step strong,
.data-rights-action-lock article > strong,
.account-recovery-readiness-summary strong,
.account-controls-gate-summary strong,
.account-controls-customer-receipt strong,
.backend-integrity-list strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 0.98rem;
  font-weight: 950;
  line-height: 1.22;
  overflow-wrap: anywhere;
}

.cloud-guard-matrix-list p,
.account-safety-hub-summary p,
.account-safety-path p,
.data-rights-action-summary p,
.data-rights-receipt-strip p,
.data-rights-next-safe-step p,
.data-rights-action-lock article > p,
.account-recovery-readiness-summary p,
.account-controls-gate-summary p,
.account-controls-customer-receipt p,
.backend-integrity-list p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 760;
  line-height: 1.36;
  overflow-wrap: anywhere;
}

.account-safety-hub-summary span,
.account-safety-path span,
.data-rights-action-summary span,
.data-rights-receipt-strip span,
.data-rights-next-safe-step span,
.data-rights-action-lock span {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.account-safety-hub-steps {
  display: grid;
  gap: 6px;
  margin: 10px 0 0;
  padding-left: 18px;
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 820;
  line-height: 1.32;
}

.account-safety-path-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}

.account-safety-path-steps li {
  border: 1px solid rgba(29, 78, 216, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
  padding: 9px;
  min-height: 82px;
}

.account-safety-path-steps li[data-state="locked"] {
  border-color: rgba(169, 68, 40, 0.2);
  background: rgba(255, 241, 238, 0.78);
}

.account-safety-path-steps b,
.account-safety-path-steps em {
  display: block;
  color: var(--ink);
  font-style: normal;
}

.account-safety-path-steps b {
  font-size: 0.84rem;
  font-weight: 950;
}

.account-safety-path-steps em {
  margin-top: 5px;
  font-size: 0.8rem;
  font-weight: 760;
  line-height: 1.34;
}

.account-recovery-readiness-summary span {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.account-controls-gate-summary span {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.account-controls-customer-receipt span {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.account-controls-receipt-steps {
  display: grid;
  gap: 6px;
  margin: 10px 0 0;
  padding-left: 18px;
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 820;
  line-height: 1.32;
}

.account-recovery-timeline-steps {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.account-recovery-timeline-steps li {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 11px;
}

.account-recovery-timeline-steps li[data-state="good"] {
  background: #f7fffb;
}

.account-recovery-timeline-steps li[data-state="blocked"] {
  background: #fff8f5;
}

.account-controls-action-list {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.account-controls-action-list li {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 10px;
}

.account-controls-action-list li[data-state="good"] {
  background: #f7fffb;
}

.account-controls-action-list li[data-state="blocked"] {
  background: #fff8f5;
}

.cloud-upload-guard pre,
.cloud-guard-matrix pre,
.backend-integrity-panel pre {
  grid-column: 1 / -1;
  max-height: 300px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #08111f;
  color: #f8fafc;
  padding: 14px;
  font-size: 0.78rem;
  font-weight: 760;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.attach-consent-modal {
  grid-column: 1 / -1;
  position: fixed;
  inset: 0;
  z-index: 40;
  display: grid;
  place-items: center;
  background: rgba(8, 17, 31, 0.78);
  padding: 22px;
}

.attach-consent-modal[hidden] {
  display: none;
}

.attach-consent-card {
  display: grid;
  gap: 14px;
  width: min(980px, 100%);
  max-height: min(860px, calc(100vh - 44px));
  overflow: auto;
  border: 1px solid #111827;
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.32);
  padding: 18px;
}

.attach-consent-head {
  display: flex;
  gap: 16px;
  align-items: start;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  padding-bottom: 14px;
}

.attach-consent-head div {
  display: grid;
  gap: 6px;
}

.attach-consent-head strong {
  color: var(--ink);
  font-size: 1.55rem;
  font-weight: 950;
  line-height: 1.05;
}

.attach-consent-head p {
  max-width: 680px;
  color: var(--ink);
  font-size: 0.95rem;
  font-weight: 820;
  line-height: 1.4;
}

.attach-consent-summary,
.attach-consent-list {
  display: grid;
  gap: 10px;
}

.attach-consent-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.attach-consent-list {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.attach-consent-summary article,
.attach-consent-list article {
  min-height: 112px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper-soft);
  padding: 12px;
}

.attach-consent-list article[data-state="blocked"] {
  background: #fff1ee;
}

.attach-consent-list article[data-state="good"] {
  background: #f1fff7;
}

.attach-consent-summary span,
.attach-consent-list span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.attach-consent-summary strong,
.attach-consent-list strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.attach-consent-summary p,
.attach-consent-list p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 780;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.attach-consent-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.attach-consent-card pre {
  max-height: 240px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #08111f;
  color: #f8fafc;
  padding: 14px;
  font-size: 0.78rem;
  font-weight: 760;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.sync-checklist {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.sync-checklist div {
  min-height: 112px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
}

.sync-checklist strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 0.98rem;
  font-weight: 950;
  line-height: 1.22;
}

.sync-checklist p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 760;
  line-height: 1.36;
}

.billing-panel {
  margin-bottom: 16px;
  border: 1px solid rgba(5, 7, 13, 0.16);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(5, 7, 13, 0.04), transparent 38%),
    #ffffff;
  box-shadow: var(--shadow-tight);
  padding: 18px;
}

.billing-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(300px, 1.05fr) minmax(0, 0.95fr);
  gap: 12px;
  margin-top: 16px;
}

.billing-card {
  display: grid;
  align-content: start;
  gap: 11px;
  min-height: 202px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 16px;
}

.billing-price-card {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(140deg, rgba(23, 76, 255, 0.2), transparent 42%),
    var(--ink);
}

.billing-price-card::after {
  position: absolute;
  right: 14px;
  bottom: 12px;
  width: 86px;
  height: 86px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  content: "";
  pointer-events: none;
}

.billing-price-card span,
.billing-price-card strong,
.billing-price-card p {
  color: #ffffff;
}

.billing-card span,
.entitlement-feature-list span {
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.billing-card strong {
  color: var(--ink);
  font-size: 1.38rem;
  font-weight: 950;
  line-height: 1.08;
  overflow-wrap: anywhere;
}

.billing-price-card strong {
  position: relative;
  z-index: 1;
  font-size: clamp(2.05rem, 3.8vw, 4.15rem);
}

.billing-card p {
  color: var(--ink);
  font-weight: 820;
  line-height: 1.42;
}

.billing-price-card p,
.billing-price-card span {
  position: relative;
  z-index: 1;
}

.billing-controls-card {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.billing-controls-card > span {
  grid-column: 1 / -1;
}

.entitlement-feature-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.recovery-offer-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.recovery-offer-grid article {
  position: relative;
  display: grid;
  align-content: start;
  gap: 12px;
  min-height: 190px;
  border: 1px solid rgba(5, 7, 13, 0.24);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  padding: 16px;
  box-shadow: 0 10px 22px rgba(5, 7, 13, 0.07);
}

.recovery-offer-grid article[data-selected="true"] {
  border-color: var(--ink);
  background:
    linear-gradient(180deg, rgba(23, 76, 255, 0.07), rgba(0, 122, 77, 0.07)),
    #ffffff;
  box-shadow:
    inset 0 0 0 1px var(--ink),
    0 16px 34px rgba(5, 7, 13, 0.14);
}

.recovery-offer-grid article[data-cadence="one_time_recovery"] {
  border-color: rgba(0, 122, 77, 0.58);
}

.recovery-offer-grid article[data-tier="premium"] {
  background:
    linear-gradient(180deg, rgba(23, 76, 255, 0.06), transparent 50%),
    #ffffff;
}

.recovery-offer-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.recovery-offer-grid span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.recovery-offer-grid strong {
  display: block;
  color: var(--ink);
  font-size: clamp(1.72rem, 2.5vw, 2.62rem);
  font-weight: 950;
  line-height: 1.04;
  overflow-wrap: anywhere;
}

.recovery-offer-grid p {
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.38;
}

.recovery-offer-grid b {
  align-self: flex-start;
  min-width: 78px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #ffffff;
  color: var(--ink);
  padding: 7px 10px;
  text-align: center;
  font-size: 0.74rem;
  font-weight: 950;
  white-space: nowrap;
}

.recovery-offer-grid article[data-selected="true"] b {
  background: var(--ink);
  color: #ffffff;
}

.entitlement-feature-list article {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  min-height: 132px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 13px;
}

.entitlement-feature-list article[data-status="included"] {
  background: var(--green-soft);
}

.entitlement-feature-list article[data-status="locked"] {
  background: var(--amber-soft);
}

.entitlement-feature-list article[data-status="roadmap"] {
  background: var(--blue-soft);
}

.entitlement-feature-list strong {
  display: block;
  margin-top: 6px;
  color: var(--ink);
  font-size: 1.02rem;
  font-weight: 950;
  line-height: 1.16;
}

.entitlement-feature-list p {
  margin-top: 6px;
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 780;
  line-height: 1.34;
}

.entitlement-feature-list b {
  align-self: flex-start;
  min-width: 88px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #ffffff;
  color: var(--ink);
  padding: 7px 9px;
  text-align: center;
  font-size: 0.76rem;
  font-weight: 950;
}

.recovery-access-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.recovery-access-list article {
  min-height: 118px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  padding: 13px;
}

.recovery-access-list span {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.recovery-access-list strong {
  display: block;
  margin-top: 7px;
  color: var(--ink);
  font-size: 1.08rem;
  font-weight: 950;
  line-height: 1.14;
}

.recovery-access-list p {
  margin-top: 7px;
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 780;
  line-height: 1.36;
}

.policy-draft-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.secondary-link-button,
.legal-back-link {
  align-items: center;
  border: 1px solid var(--ink);
  border-radius: 8px;
  color: var(--ink);
  display: inline-flex;
  font-weight: 800;
  justify-content: center;
  line-height: 1;
  min-height: 44px;
  padding: 12px 16px;
  text-decoration: none;
}

.secondary-link-button:hover,
.legal-back-link:hover {
  background: var(--ink);
  color: var(--paper);
}

.legal-page {
  background:
    linear-gradient(180deg, rgba(248, 250, 252, 0.96), rgba(237, 242, 247, 0.94)),
    var(--paper);
  color: var(--ink);
}

.legal-shell {
  margin: 0 auto;
  max-width: 1100px;
  padding: 28px 18px 56px;
}

.legal-hero,
.legal-section {
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid var(--ink);
  border-radius: 8px;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.08);
  margin-bottom: 18px;
  padding: clamp(18px, 3vw, 32px);
}

.legal-hero {
  display: grid;
  gap: 14px;
}

.legal-kicker {
  color: var(--electric);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  margin: 0;
  text-transform: uppercase;
}

.legal-hero h1,
.legal-section h2,
.legal-section h3 {
  letter-spacing: 0;
  margin: 0;
}

.legal-hero h1 {
  color: var(--ink);
  font-size: clamp(2rem, 5vw, 4.5rem);
  line-height: 0.96;
}

.legal-hero p,
.legal-section p,
.legal-list,
.legal-note {
  color: var(--ink);
  font-weight: 650;
  line-height: 1.6;
}

.legal-status-grid,
.legal-card-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.legal-status-grid {
  margin: 10px 0 0;
}

.legal-status-grid div,
.legal-card-grid article,
.template-stack article {
  background: var(--paper);
  border: 1px solid rgba(15, 23, 42, 0.75);
  border-radius: 8px;
  padding: 14px;
}

.legal-status-grid dt,
.legal-card-grid h3,
.template-stack h3 {
  color: var(--electric);
  font-size: 0.78rem;
  font-weight: 900;
  margin: 0 0 8px;
  text-transform: uppercase;
}

.legal-status-grid dd {
  font-size: 1rem;
  font-weight: 850;
  margin: 0;
}

.legal-section {
  display: grid;
  gap: 12px;
}

.legal-section h2 {
  font-size: clamp(1.35rem, 3vw, 2.1rem);
}

.legal-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 22px;
}

.resource-table {
  border: 1px solid var(--ink);
  border-radius: 8px;
  overflow: hidden;
}

.resource-table > div {
  display: grid;
  gap: 0;
  grid-template-columns: 0.85fr 1.4fr 1fr;
}

.resource-table > div:first-child {
  background: var(--ink);
  color: var(--paper);
}

.resource-table span,
.resource-table strong,
.resource-table a {
  border-bottom: 1px solid rgba(15, 23, 42, 0.28);
  color: inherit;
  font-weight: 800;
  padding: 12px;
  text-decoration-thickness: 2px;
}

.resource-table > div:last-child span,
.resource-table > div:last-child a {
  border-bottom: 0;
}

.template-stack {
  display: grid;
  gap: 12px;
}

@media (max-width: 1120px) {
  .truth-stage,
  .autopilot-grid,
  .clarity-loop,
  .smoking-timeline-grid,
  .intel-grid,
  .cost-grid,
  .confidence-engine,
  .cost-trust-grid,
  .cost-method-grid,
  .manual-preview,
  .taper-qa-panel,
  .taper-qa-list,
  .load-grid,
  .support-grid,
  .notification-controls,
  .worker-controls,
  .push-permission-panel,
  .local-reminder-panel,
  .notification-grid,
  .worker-rule-grid,
  .billing-grid,
  .billing-controls-card,
  .recovery-offer-grid,
  .network-grid,
  .network-pulse,
  .network-actions,
  .hold-gap-room,
  .hold-gap-presence-list,
  .hold-gap-actions,
  .network-safety-cards,
  .network-safety-actions,
  .care-grid,
  .care-checkin,
  .care-actions,
  .vault-grid,
  .vault-projection,
  .vault-actions,
  .hard-day-grid,
  .hard-day-review,
  .hard-day-actions,
  .entitlement-feature-list,
  .recovery-access-list,
  .substitution-grid,
  .guardrail-list,
  .cross-habit-grid,
  .rolling-load-history,
  .rolling-load-trend,
  .rolling-demo-controls,
  .rolling-demo-actions,
  .rolling-demo-qa-actions,
  .cross-habit-actions,
  .cloud-sync-grid,
  .cloud-status-grid,
  .auth-provider-grid,
  .auth-session-grid,
  .provider-qa-panel,
  .provider-qa-list,
  .recovery-change-card,
  .migration-preview-list,
  .account-control-list,
  .migration-dry-run,
  .migration-upload-sandbox,
  .migration-upload-checklist,
  .cloud-guard-matrix,
  .cloud-guard-matrix-list,
  .account-safety-hub-summary,
  .account-safety-path,
  .account-safety-path-steps,
  .data-rights-action-summary,
  .data-rights-receipt-strip,
  .data-rights-delete-safety-list,
  .data-rights-next-safe-step,
  .data-rights-next-safe-step-list,
  .data-rights-action-lock,
  .data-rights-action-lock-grid,
  .account-recovery-readiness-summary,
  .account-controls-gate-summary,
  .account-controls-customer-receipt,
  .account-controls-action-list,
  .backend-integrity-panel,
  .backend-integrity-list,
  .attach-consent-summary,
  .attach-consent-list,
  .account-grid,
  .sync-checklist,
  .notification-job {
    grid-template-columns: 1fr;
  }

  .intake-panel {
    position: static;
  }

  h1 {
    font-size: 4.35rem;
  }
}

@media (max-width: 720px) {
  .app-shell {
    width: 100vw;
    max-width: 100vw;
    padding: 10px;
    overflow: hidden;
  }

  .topbar {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    min-height: 0;
    padding: 10px;
  }

  .topnav {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: 100%;
    gap: 4px;
  }

  .topnav a,
  .nav-more summary {
    display: flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    padding: 6px 4px;
    text-align: center;
    font-size: 0.7rem;
  }

  .nav-more-menu {
    position: static;
    grid-template-columns: 1fr;
    min-width: 0;
    margin-top: 6px;
  }

  .truth-stage {
    padding-top: 10px;
  }

  .truth-hero,
  .intake-panel,
  .daily-command,
  .plan-panel,
  .notification-panel,
  .cost-truth-panel,
  .load-panel,
  .receipt-panel,
  .rescue-panel,
  .recovery-network-panel,
  .ai-coach-panel,
  .trigger-intelligence-panel,
  .care-circle-panel,
  .money-vault-panel,
  .hard-day-panel,
  .account-panel,
  .billing-panel,
  .progress-panel {
    width: 100%;
    max-width: calc(100vw - 20px);
    overflow: hidden;
    padding: 14px;
  }

  .truth-hero {
    padding-right: 24px;
  }

  .truth-headline,
  .hero-actions,
  .private-wakeup-panel,
  .clarity-loop,
  .impact-strip,
  .smoking-timeline-panel,
  .impact-carousel-controls,
  .impact-stage-meta,
  .truth-hero canvas,
  .impact-callout,
  .impact-scale-grid,
  .first-recovery-move,
  .route-copy,
  .return-journey,
  .share-intent-panel,
  .truth-card-variant-panel,
  .private-share-link-receipt,
  .private-share-safety-checklist,
  .private-share-send-receipt,
  .share-actions,
  .share-preview {
    width: calc(100% - 46px);
    max-width: 100%;
  }

  h1 {
    max-width: 100%;
    font-size: 2.56rem;
    line-height: 1.04;
    overflow-wrap: normal;
    text-wrap: balance;
  }

  .hero-subcopy {
    font-size: 1rem;
  }

  .private-wakeup-panel {
    align-items: stretch;
    flex-direction: column;
  }

  .private-wakeup-action {
    justify-content: center;
    text-align: center;
    white-space: normal;
  }

  .rescue-outcome-actions {
    grid-template-columns: 1fr;
  }

  .rescue-level div,
  .rescue-trigger div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hero-subcopy,
  .hero-actions a,
  .private-wakeup-panel strong,
  .private-wakeup-panel p,
  .private-wakeup-receipt strong,
  .private-wakeup-receipt p,
  .smoking-timeline-card strong,
  .smoking-timeline-card p,
  .smoking-timeline-card small,
  .share-intent-panel strong,
    .share-intent-panel p,
    .private-share-link-receipt strong,
    .private-share-link-receipt p,
    .private-share-link-receipt li,
    .private-share-send-receipt strong,
    .private-share-send-receipt p,
    .private-share-send-receipt li,
    .truth-card-variant-panel strong,
  .truth-card-variant-panel p,
  .truth-card-variant-button strong,
  .clarity-loop strong,
  .clarity-loop p,
  .route-copy,
  .impact-callout,
  .first-recovery-move p,
  .first-move-head strong,
  .substitution-card,
  .taper-qa-panel strong,
  .taper-qa-panel p,
  .taper-qa-list strong,
  .taper-qa-list p,
  .next-card p,
  .panel-heading h2,
  .cloud-sync-panel h3,
  .auth-readiness-panel h3,
  .migration-preview-panel h3,
  .account-card strong,
  .account-card p,
  .cloud-status-grid strong,
  .migration-preview-list strong,
  .migration-preview-list p,
  .account-control-list strong,
  .account-control-list p,
  .provider-signin-sandbox strong,
  .provider-signin-sandbox p,
  .provider-qa-panel strong,
  .provider-qa-panel p,
  .migration-dry-run strong,
  .migration-dry-run p,
  .migration-upload-sandbox strong,
  .migration-upload-sandbox p,
  .cloud-upload-guard strong,
  .cloud-upload-guard p,
  .cloud-guard-matrix strong,
  .cloud-guard-matrix p,
  .cloud-guard-matrix-list strong,
  .cloud-guard-matrix-list p,
  .attach-consent-head strong,
  .attach-consent-head p,
  .attach-consent-summary strong,
  .attach-consent-summary p,
  .attach-consent-list strong,
  .attach-consent-list p,
  .backend-integrity-panel strong,
  .backend-integrity-panel p,
  .backend-integrity-list strong,
  .backend-integrity-list p,
  .provider-signin-checklist strong,
  .provider-signin-checklist p,
  .provider-qa-list strong,
  .provider-qa-list p,
  .migration-upload-checklist strong,
  .migration-upload-checklist p,
  .auth-session-grid article strong,
  .auth-session-grid article p,
  .sync-checklist strong,
  .sync-checklist p,
  .recovery-offer-grid strong,
  .recovery-offer-grid p,
  .network-promise strong,
  .network-promise p,
  .network-card strong,
  .network-card p,
  .network-pulse strong,
  .network-pulse p,
  .truth-math-card strong,
  .truth-math-card p,
  .truth-math-card small,
  .coach-promise strong,
  .coach-promise p,
  .coach-card strong,
  .coach-card p,
  .coach-handoff-panel strong,
  .coach-handoff-panel p,
  .coach-next-move strong,
  .coach-next-move p,
  .trigger-promise strong,
  .trigger-promise p,
  .trigger-card strong,
  .trigger-card p,
  .trigger-arrival strong,
  .trigger-arrival p,
  .entitlement-feature-list strong,
  .entitlement-feature-list p,
  .recovery-access-list strong,
  .recovery-access-list p,
  .substitution-grid strong,
  .substitution-grid p,
  .guardrail-list strong,
  .guardrail-list p,
  .auth-action-status,
  .entitlement-card p {
    width: min(100%, 300px);
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .impact-strip,
  .clarity-loop,
  .truth-math-grid,
  .impact-carousel-controls,
  .impact-scale-grid,
  .first-move-stats,
  .return-stats,
  .share-intent-panel,
  .truth-card-variant-grid,
  .private-share-link-receipt,
  .private-share-safety-checklist ul,
  .private-share-send-receipt,
  .share-actions,
  .token-explainer div,
  .token-meter,
  .quit-clock-grid,
  .taper-qa-panel,
  .taper-qa-list,
  .reality-log,
  .catchup-log,
  .catchup-fields,
  .load-meter,
  .load-inputs,
  .notification-controls,
  .worker-controls,
  .worker-rule-grid,
  .billing-grid,
  .billing-controls-card,
  .recovery-offer-grid,
  .network-grid,
  .network-pulse,
  .network-actions,
  .coach-grid,
  .coach-handoff-actions,
  .coach-next-move,
  .coach-actions,
  .trigger-grid,
  .trigger-arrival,
  .trigger-actions,
  .entitlement-feature-list,
  .recovery-access-list,
  .substitution-grid,
  .guardrail-list,
  .cloud-sync-grid,
  .cloud-status-grid,
  .cloud-sync-actions,
  .auth-provider-grid,
  .auth-session-grid,
  .provider-signin-sandbox,
  .provider-signin-checklist,
  .provider-qa-panel,
  .provider-qa-list,
  .migration-preview-list,
  .account-control-list,
  .migration-dry-run,
  .migration-upload-sandbox,
  .cloud-upload-guard,
  .cloud-guard-matrix,
  .cloud-guard-matrix-list,
  .account-safety-hub-summary,
  .data-rights-action-summary,
  .data-rights-receipt-strip,
  .data-rights-delete-safety-list,
  .data-rights-next-safe-step,
  .data-rights-next-safe-step-list,
  .data-rights-action-lock,
  .data-rights-action-lock-grid,
  .account-recovery-readiness-summary,
  .account-controls-gate-summary,
  .account-controls-customer-receipt,
  .account-controls-action-list,
  .backend-integrity-panel,
  .backend-integrity-list,
  .attach-consent-summary,
  .attach-consent-list,
  .migration-upload-checklist,
  .number-grid,
  .day-grid,
  .price-assistant-grid,
  .price-assistant-result,
  .segmented,
  .wizard-actions,
  .action-row,
  .pattern-insight-card {
    grid-template-columns: 1fr;
  }

  .pattern-donut {
    justify-self: center;
  }

  .pattern-start-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .impact-carousel-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .truth-topline,
  .inline-heading,
  .wizard-topline,
  .price-assistant-head,
  .return-journey-head,
  .first-move-head,
  .substitution-lab-head,
  .attach-consent-head,
  .impact-stage-meta,
  .truth-math-head,
  #shareStatus,
  .history-list div {
    align-items: flex-start;
    flex-direction: column;
  }

  .history-edit-button {
    justify-self: start;
  }

  .price-assistant-head strong {
    text-align: left;
  }

  #shareStatus {
    text-align: left;
  }

  .share-intent-panel ul {
    justify-content: flex-start;
  }

  .share-intent-panel li {
    white-space: normal;
  }

  canvas {
    aspect-ratio: 4 / 3;
  }

  .schedule-list li,
  .year-list div,
  .eta-trend-panel,
  .missing-day-review ul,
  .missing-day-actions {
    grid-template-columns: 1fr;
  }

  .token-row-actions,
  .reality-log label {
    align-items: stretch;
    flex-direction: column;
  }

  .schedule-list b {
    width: max-content;
  }

  .account-card,
  .cloud-sync-panel,
  .auth-readiness-panel,
  .migration-preview-panel,
  .cloud-status-grid div,
  .migration-preview-list article,
  .account-control-list article,
  .attach-consent-card,
  .attach-consent-summary article,
  .attach-consent-list article,
  .sync-checklist div {
    width: 100%;
    min-width: 0;
  }

  .cloud-sync-panel .field input {
    min-width: 0;
  }

  .recovery-offer-grid article,
  .entitlement-feature-list article {
    align-items: stretch;
  }

  .recovery-offer-head,
  .entitlement-feature-list article > div {
    min-width: 0;
    width: 100%;
  }

  .recovery-offer-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .recovery-offer-grid b,
  .entitlement-feature-list b {
    align-self: flex-start;
    max-width: 100%;
  }

  .receipt-paper {
    padding: 12px;
    font-size: 0.88rem;
  }

  .receipt-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2px;
  }

  .receipt-row strong {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
}

@media (max-width: 720px) {
  .legal-shell {
    padding: 12px 10px 32px;
  }

  .legal-status-grid,
  .legal-card-grid,
  .resource-table > div {
    grid-template-columns: 1fr;
  }

  .resource-table > div {
    border-bottom: 1px solid rgba(15, 23, 42, 0.28);
  }

  .resource-table > div:last-child {
    border-bottom: 0;
  }

  .resource-table span,
  .resource-table strong,
  .resource-table a {
    border-bottom: 0;
  }

  .policy-draft-links {
    flex-direction: column;
  }
}