.autopilot-page {
  --ap-radius: 1.25rem;
  max-inline-size: 1440px;
  margin-inline: auto;
  padding-block-end: 3rem;
  color: var(--color-text);
}

.autopilot-page :is(h1, h2, h3, p, dl, ol) { margin-block-start: 0; }
.autopilot-page :is(input, select, button, a) { -webkit-tap-highlight-color: transparent; }
.autopilot-page [hidden] { display: none !important; }
.autopilot-page :is(button, a, input, select, summary):focus-visible {
  outline: 2px solid var(--color-control-border-focus);
  outline-offset: 4px;
}
.autopilot-page :is(input, select, button):disabled { opacity: .48; cursor: not-allowed; }
.autopilot-page :is(input, select) { min-inline-size: 0; }
.autopilot-page :is(p, small) { line-height: 1.65; }
.autopilot-page .button { white-space: normal; text-align: center; line-height: 1.4; }

.autopilot-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(290px, .8fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
  padding-block: clamp(1.5rem, 4vw, 4.5rem) 2.75rem;
}
.autopilot-eyebrow {
  margin-block-end: .75rem;
  color: var(--color-text-muted);
  font-family: var(--font-mono);
  font-size: .67rem;
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.autopilot-hero h1 {
  margin-block-end: 1.4rem;
  font-family: var(--font-display);
  font-size: clamp(2.1rem, 3.65vw, 4rem);
  line-height: 1.09;
  letter-spacing: -.055em;
  font-weight: 650;
  text-wrap: balance;
}
.autopilot-hero h1 span { color: var(--color-text-muted); }
.autopilot-hero__copy > p:not(.autopilot-eyebrow) {
  max-inline-size: 42rem;
  margin-block-end: 1.4rem;
  color: var(--color-text-secondary);
  font-size: 1rem;
}
.autopilot-text-link, .autopilot-text-button {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  min-block-size: 44px;
  padding: .4rem 0;
  border: 0;
  background: transparent;
  color: var(--color-text);
  font-size: .82rem;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: .3em;
  cursor: pointer;
}
.autopilot-text-link:hover, .autopilot-text-button:hover { color: var(--color-text-muted); }
.autopilot-flow {
  padding: 1.4rem;
  background: var(--surface-card);
  border: 1px solid var(--color-border);
  border-radius: var(--ap-radius);
  box-shadow: var(--shadow-sm);
}
.autopilot-flow__head, .autopilot-flow__funds, .autopilot-flow__reserve, .autopilot-flow__arrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.autopilot-flow__head { font-size: .82rem; font-weight: 600; }
.autopilot-pill {
  display: inline-flex;
  align-items: center;
  padding: .3rem .6rem;
  border: 1px solid var(--color-border);
  border-radius: 99px;
  color: var(--color-text-secondary);
  font-size: .65rem;
  font-weight: 600;
  line-height: 1.4;
}
.autopilot-pill--ready { background: var(--color-success-soft); border-color: var(--color-success-border); color: var(--color-success); }
.autopilot-flow__funds { padding: 1.65rem .7rem 1rem; font-size: .82rem; color: var(--color-text-secondary); }
.autopilot-flow__reserve { justify-content: flex-start; padding: 1rem; border: 1px solid var(--color-border-strong); border-radius: .7rem; background: var(--surface-well); }
.autopilot-flow__reserve > span { font-size: 2rem; color: var(--color-text-muted); }
.autopilot-flow strong { font-size: .87rem; }
.autopilot-flow small { display: block; color: var(--color-text-muted); font-size: .7rem; margin-block-start: .2rem; }
.autopilot-flow__arrow { padding: 1rem .7rem; color: var(--color-text-muted); font-size: .72rem; }
.autopilot-flow__output { padding: 1rem; border-radius: .7rem; border: 1px solid var(--color-border); background: var(--color-surface-elevated); }
.autopilot-flow__output span { display: block; margin-block-start: .25rem; font-size: .7rem; color: var(--color-text-muted); }

.autopilot-disclosure { padding: 1.2rem 1.5rem; border: 1px solid var(--color-warning-border); border-inline-start-width: 3px; border-radius: .7rem; background: var(--color-warning-soft); }
.autopilot-disclosure > strong { font-size: .85rem; color: var(--color-text); }
.autopilot-disclosure p { margin-block: .5rem 0; font-size: .78rem; color: var(--color-text-secondary); }
.autopilot-disclosure b { font-weight: 650; color: var(--color-text); }
.autopilot-network { padding-block: 1rem .35rem; font-family: var(--font-mono); font-size: .66rem; line-height: 1.8; color: var(--color-text-muted); overflow-wrap: anywhere; }
.autopilot-address { color: inherit; text-decoration: underline; text-underline-offset: .2em; overflow-wrap: anywhere; }
.autopilot-wallet-note:not([hidden]) { padding: 1rem; margin-block: .7rem; border: 1px solid var(--color-border); border-radius: .65rem; background: var(--color-surface); font-size: .8rem; }
.autopilot-wallet-note p { margin-block-end: .75rem; }
.autopilot-notice { color: var(--color-text-muted); font-size: .74rem; line-height: 1.7; margin-block: .5rem 1.5rem; }
.autopilot-error { color: var(--color-error); }

.autopilot-workspace { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, 1fr); gap: 1.5rem; align-items: start; scroll-margin-block-start: 6rem; }
.autopilot-card { padding: clamp(1.1rem, 2.3vw, 2rem); border: 1px solid var(--color-border); border-radius: var(--ap-radius); background: var(--surface-card); min-inline-size: 0; }
.autopilot-section-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-block-end: 1.5rem; }
.autopilot-section-heading h2, .autopilot-quote h2 { margin-block-end: 0; font-family: var(--font-display); font-size: clamp(1.25rem, 1.7vw, 1.6rem); letter-spacing: -.035em; line-height: 1.25; }
.autopilot-section-heading h3 { font-size: 1.1rem; letter-spacing: -.02em; margin: 0; }
.autopilot-section-heading .autopilot-eyebrow { margin-block-end: .4rem; }
.autopilot-step { flex-shrink: 0; color: var(--color-text-subtle); font-family: var(--font-mono); font-size: .75rem; }
.autopilot-step-group { min-inline-size: 0; margin: 0; padding: 1.5rem 0; border: 0; border-block-start: 1px solid var(--color-divider); }
.autopilot-step-group:last-child { padding-block-end: 0; }
.autopilot-step-group legend { padding: 0 .5rem 0 0; color: var(--color-text); font-size: .85rem; font-weight: 600; }
.autopilot-step-group legend > span { color: var(--color-text-muted); font-family: var(--font-mono); font-size: .65rem; margin-inline-end: .5rem; }
.autopilot-step-group > p { font-size: .77rem; color: var(--color-text-muted); margin-block: .2rem 1rem; }
.autopilot-field { display: flex; flex-direction: column; gap: .5rem; margin-block-end: 1rem; min-inline-size: 0; }
.autopilot-field > span { color: var(--color-text-secondary); font-size: .75rem; line-height: 1.5; font-weight: 550; }
.autopilot-field input, .autopilot-field select {
  width: 100%;
  min-block-size: 46px;
  padding: .75rem .85rem;
  border: 1px solid var(--color-control-border);
  border-radius: .6rem;
  background: var(--color-control-bg);
  color: var(--color-control-text);
  caret-color: var(--color-control-caret);
  font: inherit;
  font-size: .87rem;
  line-height: 1.4;
  text-overflow: ellipsis;
}
.autopilot-field select { padding-inline-end: 1.8rem; }
.autopilot-field input::placeholder { color: var(--color-control-placeholder); }
.autopilot-field input:hover, .autopilot-field select:hover { border-color: var(--color-control-border-hover); }
.autopilot-field small { font-size: .69rem; color: var(--color-text-muted); }
.autopilot-field-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
.autopilot-inline-action { display: flex; align-items: flex-start; flex-wrap: wrap; gap: .8rem; }
.autopilot-inline-action > .autopilot-field { flex: 1 1 180px; }
.autopilot-inline-action > button { margin-block-start: 1.65rem; max-inline-size: 100%; }
.autopilot-token-note { font-family: var(--font-mono); font-size: .66rem !important; overflow-wrap: anywhere; }
.autopilot-data-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; padding: 1rem; margin-block: 1rem; border: 1px solid var(--color-border-subtle); border-radius: .65rem; background: var(--surface-well); }
.autopilot-data-grid dt { color: var(--color-text-muted); font-size: .67rem; line-height: 1.6; }
.autopilot-data-grid dd { margin: .25rem 0 0; font-size: .76rem; line-height: 1.6; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.autopilot-wrap { padding: 1rem; border-radius: .6rem; border: 1px solid var(--color-border); margin-block-start: 1rem; }
.autopilot-wrap summary, .autopilot-route-bytes summary { cursor: pointer; font-size: .75rem; font-weight: 600; min-block-size: 30px; line-height: 1.6; }
.autopilot-wrap p { margin-block: .75rem; font-size: .75rem; color: var(--color-text-muted); }
.autopilot-wrap > small { font-size: .68rem; color: var(--color-text-muted); overflow-wrap: anywhere; }
.autopilot-wrap .autopilot-field { margin-block-end: .5rem; }
.autopilot-allowance { padding-block: 1.5rem; margin-block: 1.5rem 0; border-block: 1px solid var(--color-divider); }
.autopilot-allowance > p { font-size: .74rem; color: var(--color-text-muted); margin-block-end: .7rem; }
.autopilot-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; }
.autopilot-checkbox { display: flex; align-items: flex-start; gap: .75rem; padding-block: 1.3rem; cursor: pointer; }
.autopilot-checkbox input { flex: 0 0 18px; inline-size: 18px; block-size: 18px; margin-block-start: .15rem; accent-color: var(--native-control-accent-color); }
.autopilot-checkbox > span { font-size: .75rem; line-height: 1.7; color: var(--color-text-secondary); }
.autopilot-enroll { inline-size: 100%; min-block-size: 50px; }
.autopilot-side { position: sticky; inset-block-start: 6rem; min-inline-size: 0; }
.autopilot-quote h2 { margin-block-end: 1.2rem; }
.autopilot-empty { color: var(--color-text-muted); font-size: .8rem; line-height: 1.8; margin: 0; }
.autopilot-quote-rows, .autopilot-review-rows { margin-block: 1.3rem; }
.autopilot-quote-rows > div, .autopilot-review-rows > div { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: start; gap: 1rem; padding-block: .8rem; border-block-end: 1px solid var(--color-divider); font-size: .73rem; line-height: 1.6; }
.autopilot-quote-rows dt, .autopilot-review-rows dt { color: var(--color-text-muted); }
.autopilot-quote-rows dd, .autopilot-review-rows dd { margin: 0; text-align: end; color: var(--color-text); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.autopilot-quote-rows > div:last-child dd { font-weight: 650; }
.autopilot-route { list-style: none; padding: 0; margin-block-end: 1rem; }
.autopilot-route li { border-inline-start: 2px solid var(--color-border-strong); padding: .5rem .75rem; font-size: .8rem; line-height: 1.7; }
.autopilot-route li + li { margin-block-start: .4rem; }
.autopilot-route small { display: block; font-size: .65rem; color: var(--color-text-muted); }
.autopilot-observed { font-size: .68rem; color: var(--color-text-muted); line-height: 1.75; overflow-wrap: anywhere; }
.autopilot-route-bytes code, .autopilot-review-rows code { display: block; font-family: var(--font-mono); font-size: .65rem; line-height: 1.8; overflow-wrap: anywhere; white-space: normal; }
.autopilot-route-bytes { margin-block-start: .8rem; }
.autopilot-principles { padding: 1.5rem .5rem; }
.autopilot-principles > div + div { margin-block-start: 1.25rem; }
.autopilot-principles strong { font-size: .8rem; }
.autopilot-principles p { margin-block: .4rem 0; font-size: .73rem; color: var(--color-text-muted); }

.autopilot-transactions { margin-block: 1.5rem 3rem; scroll-margin-block-start: 6rem; }
.autopilot-transactions h3 { font-size: 1.1rem; line-height: 1.5; }
.autopilot-transactions [data-ap-review] > p { color: var(--color-text-muted); font-size: .75rem; }
.autopilot-review-rows > div { grid-template-columns: minmax(0, .6fr) minmax(0, 1.4fr); }
.autopilot-review-rows dd { text-align: start; }
.autopilot-tx-status { margin-block-start: 1rem; font-size: .82rem; line-height: 1.75; overflow-wrap: anywhere; }
.autopilot-tx-status a { text-decoration: underline; text-underline-offset: .2em; }
.autopilot-recovery { padding: 1.2rem; margin-block-start: 1rem; background: var(--color-warning-soft); border: 1px solid var(--color-warning-border); border-radius: .75rem; }
.autopilot-recovery > p { color: var(--color-text-secondary); font-size: .77rem; }
.autopilot-recovery input { font-family: var(--font-mono); font-size: .75rem; }
.autopilot-totals { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: .8rem; margin-block: 1rem 1.5rem; }
.autopilot-totals > div { padding: 1rem; border: 1px solid var(--color-border); border-radius: .8rem; background: var(--surface-card); }
.autopilot-totals span, .autopilot-totals small { display: block; font-size: .66rem; line-height: 1.6; color: var(--color-text-muted); }
.autopilot-totals strong { display: block; margin-block: .6rem; font-size: 1rem; font-weight: 550; line-height: 1.5; overflow-wrap: anywhere; }
.autopilot-plan-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 1rem; }
.autopilot-plan-card { padding: 1.2rem; background: var(--surface-card); border: 1px solid var(--color-border); border-radius: 1rem; min-inline-size: 0; }
.autopilot-plan-card > div { display: flex; justify-content: space-between; align-items: center; gap: .6rem; }
.autopilot-plan-card .autopilot-eyebrow { margin: 0; }
.autopilot-plan-card h3 { margin-block: 1rem .5rem; font-size: 1.3rem; letter-spacing: -.025em; }
.autopilot-plan-card h3 span { color: var(--color-text-muted); margin-inline: .25rem; }
.autopilot-plan-card p { font-size: .77rem; color: var(--color-text-secondary); margin-block-end: .25rem; overflow-wrap: anywhere; }
.autopilot-empty-state { padding: 2rem; border: 1px dashed var(--color-border-strong); border-radius: 1rem; }
.autopilot-empty-state h3 { margin-block: 1rem .5rem; font-size: 1.2rem; }
.autopilot-empty-state p { font-size: .82rem; color: var(--color-text-muted); margin-block-end: 0; max-inline-size: 40rem; }
.autopilot-manager { margin-block-start: 1.5rem; scroll-margin-block-start: 6rem; }
.autopilot-manager > .autopilot-section-heading > label { margin: 0; min-inline-size: 13rem; }
.autopilot-manager [data-ap-plan-detail] > p { font-size: .83rem; }
.autopilot-manage-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; margin-block-start: 2rem; }
.autopilot-manage-grid fieldset { min-inline-size: 0; padding: 0; margin: 0; border: 0; }
.autopilot-manage-grid legend { color: var(--color-text); font-size: .84rem; font-weight: 600; padding: 0; margin-block-end: 1.25rem; }
.autopilot-manage-grid .autopilot-field-pair { grid-template-columns: minmax(0, 1fr); gap: 0; }
.autopilot-revoke { margin-block-start: .7rem; color: var(--color-error); text-align: start; }
.autopilot-footer { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 2rem; margin-block-start: 2.5rem; padding-block-start: 1.5rem; border-block-start: 1px solid var(--color-divider); }
.autopilot-footer p { font-size: .68rem; line-height: 1.9; color: var(--color-text-muted); overflow-wrap: anywhere; }
.autopilot-entry { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: clamp(1.25rem, 3vw, 2.25rem); margin-block: 1.5rem 2rem; border: 1px solid var(--color-border-strong); border-radius: 1.2rem; background: var(--surface-card); }
.autopilot-entry h2 { margin-block: 0 .6rem; font-size: clamp(1.4rem, 2vw, 2rem); line-height: 1.2; letter-spacing: -.035em; }
.autopilot-entry p:not(.autopilot-eyebrow) { max-inline-size: 44rem; font-size: .85rem; line-height: 1.7; color: var(--color-text-muted); margin: 0; }
.autopilot-entry > a { flex-shrink: 0; }

@media (max-width: 75rem) {
  .autopilot-hero { gap: 2rem; }
  .autopilot-workspace { grid-template-columns: minmax(0, 1.35fr) minmax(255px, 1fr); gap: 1rem; }
  .autopilot-setup .autopilot-field-pair { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .autopilot-inline-action > button { margin-block-start: 0; }
  .autopilot-inline-action > .autopilot-field { flex-basis: 100%; }
  .autopilot-manage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .autopilot-manage-grid > fieldset:last-child { grid-column: 1 / -1; padding-block-start: 1.5rem; border-block-start: 1px solid var(--color-divider); }
}

@media (max-width: 58rem) {
  .autopilot-hero { grid-template-columns: minmax(0, 1fr); padding-block-start: 1.5rem; }
  .autopilot-hero h1 { font-size: clamp(2.2rem, 6vw, 3.5rem); }
  .autopilot-flow { max-inline-size: 34rem; inline-size: 100%; }
  .autopilot-workspace { grid-template-columns: minmax(0, 1fr); }
  .autopilot-side { position: static; }
  .autopilot-setup .autopilot-field-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .autopilot-principles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; }
  .autopilot-principles > div + div { margin-block-start: 0; }
  .autopilot-entry { align-items: flex-start; flex-direction: column; gap: 1rem; }
}

@media (max-width: 48rem) {
  /* Preserve readable, reachable navigation now that the product list exceeds a single row. */
  .mobile-nav__list { grid-auto-columns: minmax(4.5rem, 1fr); overflow-x: auto; scrollbar-width: thin; overscroll-behavior-inline: contain; }
  .autopilot-section-heading { flex-wrap: wrap; }
  .autopilot-transactions { margin-block-end: 2rem; }
  .autopilot-footer { grid-template-columns: minmax(0, 1fr); gap: .5rem; }
}

@media (max-width: 35rem) {
  .autopilot-hero { gap: 1.5rem; padding-block-end: 1.75rem; }
  .autopilot-hero h1 { font-size: clamp(2rem, 8.5vw, 2.7rem); }
  .autopilot-hero__copy > p:not(.autopilot-eyebrow) { font-size: .9rem; }
  .autopilot-disclosure { padding: 1rem; }
  .autopilot-flow { padding: 1rem; }
  .autopilot-card { border-radius: .9rem; padding: 1rem; }
  .autopilot-setup .autopilot-field-pair, .autopilot-data-grid, .autopilot-manage-grid { grid-template-columns: minmax(0, 1fr); }
  .autopilot-data-grid { gap: .8rem; }
  .autopilot-field-pair { gap: 0 !important; }
  .autopilot-principles { grid-template-columns: minmax(0, 1fr); padding-inline: .25rem; }
  .autopilot-quote-rows > div { gap: .65rem; }
  .autopilot-review-rows > div { grid-template-columns: minmax(0, 1fr); gap: .25rem; }
  .autopilot-review-rows dd { font-size: .79rem; }
  .autopilot-manager > .autopilot-section-heading > label { inline-size: 100%; min-inline-size: 0; }
  .autopilot-manage-grid > fieldset + fieldset { padding-block-start: 1.5rem; border-block-start: 1px solid var(--color-divider); }
  .autopilot-actions { gap: .6rem; }
  .autopilot-actions > .button { flex: 1 1 160px; }
  .autopilot-field :is(input, select) { font-size: 1rem; }
  .autopilot-totals { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .autopilot-page, .autopilot-page * { scroll-behavior: auto !important; }
}