/* Integration only: original AMA Work stylesheet and screenshots are preserved. */
body[data-atc-page="ama-work"] {
  --bg: var(--navy); --text: var(--ink); --fg: var(--text); --border: var(--line); --accent: var(--orange);
  --surface: oklch(1 0 0); --surface-2: oklch(.972 .007 273.504);
  --atc-hue: 273.504; --atc-color-a: var(--orange); --atc-color-b: var(--orange-2); --atc-link-base: var(--orange);
  --atc-link: oklch(from var(--orange) .43 .10 h);
  --shadow: 0 22px 64px oklch(.14 .04 var(--atc-hue) / .25);
}
body[data-atc-page="ama-work"] header.atc-site-header { position: sticky; z-index: 100; }
body[data-atc-page="ama-work"] .hero { padding-top: 0; min-height: 707px; }
body[data-atc-page="ama-work"] .atc-header-row { font-family: var(--font-body); }
body[data-atc-page="ama-work"] .atc-section-label { line-height: 1.4; }
body[data-atc-page="ama-work"] :is(.hero, .roles, .final-cta, .site-footer) {
  --text: oklch(.97 .012 273.504); --muted: oklch(.80 .028 273.504);
}
body[data-atc-page="ama-work"] .brand .atc-brand-name { margin-bottom: 0; font-size: 21px; }
body[data-atc-page="ama-work"] .atc-site-header .brand .atc-brand-name { font-family: var(--font-display); }
body[data-atc-page="ama-work"] .atc-site-header .btn.secondary { border-color: var(--line); color: var(--text); }
body[data-atc-page="ama-work"] .button { min-height: 44px; max-width: 100%; white-space: normal; text-align: center; }
body[data-atc-page="ama-work"] .button--orange { color: oklch(.2222 .049565 271.673); }
body[data-atc-page="ama-work"] :is(.screen-tabs button, .screen-theme-switch button, .faq-list summary) { min-height: 44px; }
body[data-atc-page="ama-work"] :is(h1, h2, h3) { text-wrap: balance; }
body[data-atc-page="ama-work"] p { text-wrap: pretty; }
body[data-atc-page="ama-work"] :is(.hero-copy, .hero-grid > *, .intro-grid > *, .roles-grid > *, .faq-grid > *) { min-width: 0; }
body[data-atc-page="ama-work"] .text-link,
body[data-atc-page="ama-work"] .feature-card:not(.feature-card--accent) > a,
body[data-atc-page="ama-work"] .journey-card:not(.journey-card--featured) > a,
body[data-atc-page="ama-work"] .screen-source a { color: var(--atc-link); border-color: currentColor; }
body[data-atc-page="ama-work"] .screen-tabs button:hover { color: oklch(from var(--orange) .40 .09 h); border-color: currentColor; }
body[data-atc-page="ama-work"] .screen-tabs button[aria-selected="true"]:hover { color: oklch(from var(--orange) .40 .09 h); }
body[data-atc-page="ama-work"] :is(a, button, summary):focus-visible { outline: 3px solid currentColor; outline-offset: 4px; }
body[data-atc-page="ama-work"] :is(.feature-card > a, .journey-card > a, .screen-source a):hover { text-decoration: underline; text-underline-offset: 4px; }
/* The Light setting retains the source's white sections and dark hero/role bands. */
html[data-atc-theme="light"] body[data-atc-page="ama-work"] {
  --bg: oklch(1 0 0); --text: var(--ink); --muted: oklch(.512498 .039374 270.536);
  --line: oklch(.93225 .009469 279.683); color: var(--text); background: var(--bg);
}
html[data-atc-theme="light"] body[data-atc-page="ama-work"] :is(.section-kicker, .journey-number, .pillar-row > div > span) { color: oklch(from var(--orange) .48 .115 h); }
html[data-atc-theme="light"] body[data-atc-page="ama-work"] :is(.hero, .roles, .final-cta) .section-kicker,
html[data-atc-theme="light"] body[data-atc-page="ama-work"] .journey-card--featured .journey-number { color: var(--orange-2); }
html[data-atc-theme="light"] body[data-atc-page="ama-work"] :is(.intro, .interface, .features) h2 em { color: oklch(from var(--orange) .60 .14 h); }
/* Dark counterpart, derived from the supplied navy and orange. */
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] {
  --bg: var(--navy); --ink: oklch(.97 .012 273.504); --text: var(--ink);
  --surface: oklch(.275 .058 273.504); --surface-2: oklch(.25 .062 273.504);
  --muted: oklch(.79 .027 273.504); --line: oklch(.43 .047 273.504);
  --atc-link: var(--orange-2); color: var(--text); background: var(--bg);
}
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] :is(.intro, .interface, .faq) { background: var(--bg); }
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] :is(.workflow, .features) { background: var(--surface-2); }
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] :is(.journey-card, .feature-card) { color: var(--text); background: var(--surface); border-color: var(--line); }
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] :is(.journey-card--featured, .feature-card--accent) { background: var(--navy); border-color: color-mix(in oklch, var(--orange) 50%, var(--line)); }
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] :is(.intro-right, .pillar-row small, .section-heading > p, .section-heading--center p, .journey-card p, .journey-card li, .feature-card p, .faq-grid > div:first-child > p, .faq-list p, .screen-source) { color: var(--muted); }
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] :is(.pillar-row, .pillar-row > div, .faq-list, .faq-list details) { border-color: var(--line); }
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] :is(.section-kicker, .journey-number, .pillar-row > div > span) { color: var(--orange-2); }
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] .screen-theme-switch { background: var(--surface); }
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] .screen-theme-switch button { color: var(--text); }
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] .screen-theme-switch button[aria-pressed="true"] { background: var(--orange-2); color: oklch(.2222 .049565 271.673); }
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] .screen-tabs button { color: var(--text); background: var(--surface); border-color: var(--line); }
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] .screen-tabs button[aria-selected="true"] { color: oklch(.2222 .049565 271.673); background: var(--orange-2); border-color: var(--orange-2); }
html:not([data-atc-theme="light"]) body[data-atc-page="ama-work"] .screen-tabs button:hover { border-color: currentColor; }
@media (max-width: 760px) {
  body[data-atc-page="ama-work"] .atc-site-header .brand .atc-brand-name { font-size: 18px; }
}
/* The supplied mobile screen belongs with the team roles, beside the existing copy. */
body[data-atc-page="ama-work"] #roles .roles-grid {
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  grid-template-areas: "copy phone" "roles phone";
  column-gap: clamp(40px, 7vw, 90px);
  row-gap: 28px;
  align-items: start;
}
body[data-atc-page="ama-work"] #roles .ama-roles-copy { grid-area: copy; min-width: 0; }
body[data-atc-page="ama-work"] #roles .role-stack { grid-area: roles; min-width: 0; }
body[data-atc-page="ama-work"] #roles .ama-phone-visual {
  grid-area: phone;
  width: min(100%, 306px);
  min-width: 0;
  margin: 0;
  justify-self: center;
  align-self: center;
}
body[data-atc-page="ama-work"] #roles .ama-phone-frame {
  position: relative;
  padding: 6px;
  background: var(--ui-bg);
  border: 1px solid var(--ui-control-border);
  border-radius: 26px;
  box-shadow: inset 0 1px 0 var(--ui-highlight), var(--ui-shadow);
}
body[data-atc-page="ama-work"] #roles .ama-phone-frame img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  aspect-ratio: 1080 / 2340;
  object-fit: contain;
  border-radius: 19px;
}
/* Keep the viewer's zoom mark away from the screenshot's bottom navigation. */
body.atc-responsive.atc-visual-enhanced.atc-unified#top #roles .ama-phone-frame .atc-image-hotspot::before,
body.atc-responsive.atc-visual-enhanced.atc-unified#top #roles .ama-phone-frame .atc-image-hotspot::after { display: none; }
@media (max-width: 1199px) {
  body[data-atc-page="ama-work"] #roles .roles-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "copy" "phone" "roles";
  }
}
@media (max-width: 600px) {
  body[data-atc-page="ama-work"] #roles .ama-phone-visual { width: min(100%, 290px); }
  body[data-atc-page="ama-work"] #roles .role-stack article { grid-template-columns: 28px minmax(0, 1fr) 16px; gap: 12px; padding: 18px 16px; }
}
/* Original mobile cashbook walkthroughs, kept separate from the desktop theme tabs. */
body[data-atc-page="ama-work"] .ama-cashbook-showcase { margin-top: 56px; }
body[data-atc-page="ama-work"] .ama-cashbook-heading { margin-bottom: 24px; }
body[data-atc-page="ama-work"] .ama-cashbook-heading h3 { margin: 0 0 8px; }
body[data-atc-page="ama-work"] .ama-cashbook-heading p { margin: 0; color: var(--ui-muted); }
body[data-atc-page="ama-work"] .ama-cashbook-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
body[data-atc-page="ama-work"] .ama-cashbook-figure { min-width: 0; margin: 0; }
body[data-atc-page="ama-work"] .ama-cashbook-frame {
  position: relative; padding: 6px; border: 1px solid var(--ui-control-border); border-radius: 18px;
  background: var(--ui-bg); box-shadow: inset 0 1px 0 var(--ui-highlight), var(--ui-shadow);
}
body[data-atc-page="ama-work"] .ama-cashbook-frame img {
  display: block; width: 100%; height: auto; max-width: 100%; aspect-ratio: 4 / 3; object-fit: contain; border-radius: 11px;
}
body[data-atc-page="ama-work"] .ama-cashbook-figure figcaption {
  margin-top: 14px; padding: 0; color: var(--ui-fg); font: 500 16px/1.6 var(--atc-body); text-wrap: pretty;
}
@media (max-width: 920px) {
  body[data-atc-page="ama-work"] .ama-cashbook-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  body[data-atc-page="ama-work"] .ama-cashbook-showcase { margin-top: 40px; }
}
