.ac-case {
  --ac-ink: #202823;
  --ac-charcoal: #26312b;
  --ac-charcoal-deep: #1d2721;
  --ac-paper: #f5f1e9;
  --ac-cream: #fffdf8;
  --ac-muted: #657067;
  --ac-line: #d3d8cd;
  --ac-sage: #dce7c9;
  --ac-sage-deep: #77936a;
  --ac-orange: #ef6235;
  --ac-orange-soft: #ffe2d5;
  --ac-shadow: rgba(30, 40, 34, .14);
  width: 100%;
  overflow: hidden;
  color: var(--ac-ink);
  background: var(--ac-paper);
  border: 1px solid var(--ac-line);
  border-radius: 8px;
  box-shadow: 0 18px 42px var(--ac-shadow);
  font-family: 'DM Sans', system-ui, sans-serif;
  line-height: 1.45;
}

.ac-case *,
.ac-case *::before,
.ac-case *::after { box-sizing: border-box; }
.ac-case h2,
.ac-case h3,
.ac-case h4,
.ac-case p,
.ac-case ol,
.ac-case blockquote { margin: 0; }
.ac-case h2,
.ac-case h3,
.ac-case h4 { color: var(--ac-ink); letter-spacing: -.035em; }
.ac-case h2 { max-width: 760px; font-size: clamp(32px, 4vw, 56px); line-height: .98; }
.ac-case h3 { font-size: clamp(21px, 2vw, 28px); line-height: 1.05; }
.ac-case h4 { font-size: clamp(20px, 2.25vw, 29px); line-height: 1.02; }
.ac-case p { color: var(--ac-muted); font-size: 15px; }

.ac-case__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 36px;
  padding: clamp(24px, 4vw, 44px);
  background:
    radial-gradient(circle at 96% 2%, rgba(239, 98, 53, .2), transparent 28%),
    var(--ac-sage);
}
.ac-case__intro { min-width: 0; }
.ac-case__intro p { max-width: 650px; margin-top: 17px; color: #47564b; font-size: 17px; }
.ac-eyebrow,
.ac-stage__kicker,
.ac-ui-label,
.ac-message__label {
  display: inline-block;
  color: #667665;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .13em;
  line-height: 1.25;
  text-transform: uppercase;
}
.ac-eyebrow { margin-bottom: 18px; color: #b44020; }
.ac-case__stamp { display: flex; align-items: center; gap: 12px; min-width: 245px; margin-top: 3px; padding: 12px 14px; border: 1px solid rgba(32, 40, 35, .18); border-radius: 4px; background: rgba(255, 253, 248, .58); }
.ac-stamp__mark { display: grid; place-items: center; width: 32px; height: 32px; color: var(--ac-ink); background: var(--ac-orange); font: 800 22px/1 Impact, sans-serif; transform: skewY(-5deg); }
.ac-case__stamp strong,
.ac-case__stamp small { display: block; }
.ac-case__stamp strong { font-size: 12px; }
.ac-case__stamp small { margin-top: 3px; color: #627064; font-size: 10px; }

.ac-stage-rail { display: grid; grid-template-columns: minmax(0, 1fr) 52px minmax(0, 1fr) 52px minmax(0, 1fr); align-items: center; padding: 20px clamp(24px, 4vw, 44px); list-style: none; background: var(--ac-charcoal); color: #eef2e8; }
.ac-stage-rail__item { display: grid; grid-template-columns: 30px minmax(0, 1fr); column-gap: 10px; align-items: center; min-width: 0; }
.ac-stage-rail__item > span { grid-row: span 2; display: grid; place-items: center; width: 28px; height: 28px; color: var(--ac-ink); background: var(--ac-orange); font: 800 13px/1 'Barlow Condensed', sans-serif; }
.ac-stage-rail__item--with > span { background: var(--ac-sage); }
.ac-stage-rail__item--owner > span { color: #f5f1e9; background: #677c62; }
.ac-stage-rail__item strong { font-size: 13px; letter-spacing: -.01em; }
.ac-stage-rail__item small { color: #a9b9a7; font-size: 10px; }
.ac-stage-rail__line { height: 1px; margin: 0 12px; border-top: 1px dashed #7f927b; }

.ac-stage-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding: clamp(20px, 3.7vw, 44px); }
.ac-stage { min-width: 0; overflow: hidden; border: 1px solid var(--ac-line); border-radius: 6px; background: var(--ac-cream); }
.ac-stage--before { border-top: 3px solid #bfc7b8; }
.ac-stage--with { border-top: 3px solid var(--ac-orange); }
.ac-stage--owner { border-top: 3px solid #78916d; }
.ac-stage__header { display: flex; align-items: flex-start; gap: 14px; padding: 21px 20px 18px; border-bottom: 1px solid var(--ac-line); }
.ac-stage__index { display: grid; place-items: center; flex: 0 0 auto; width: 29px; height: 29px; color: #f7f3ea; background: var(--ac-charcoal); font: 800 15px/1 'Barlow Condensed', sans-serif; }
.ac-stage--with .ac-stage__index { color: var(--ac-ink); background: var(--ac-orange); }
.ac-stage--owner .ac-stage__index { color: var(--ac-ink); background: var(--ac-sage); }
.ac-stage__kicker { margin-bottom: 8px; }
.ac-stage__body { display: grid; gap: 14px; padding: 20px; }
.ac-stage__note { display: flex; gap: 8px; min-height: 69px; padding: 15px 20px; border-top: 1px solid var(--ac-line); background: #f0f2e9; font-size: 12px !important; line-height: 1.55; }
.ac-stage__note-mark { flex: 0 0 auto; color: var(--ac-orange); font-size: 17px; font-weight: 800; }

.ac-paper { overflow: hidden; padding: 15px; border: 1px solid #d5d8cf; border-radius: 4px; background: #fffef9; box-shadow: 5px 6px 0 #e4e8db; }
.ac-paper__top { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.ac-paper__brand { color: var(--ac-ink); font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.ac-paper__code { color: #8b9188; font-size: 8px; letter-spacing: .07em; text-align: right; }
.ac-paper__rule { height: 3px; margin: 12px 0 15px; background: var(--ac-orange); }
.ac-paper__customer span,
.ac-paper__customer small { display: block; color: #8a9388; font-size: 9px; }
.ac-paper__customer strong { display: block; margin: 2px 0; font-size: 12px; }
.ac-paper__lines { display: grid; gap: 6px; margin: 16px 0; }
.ac-paper__lines span { display: block; height: 6px; background: #e6e9df; }
.ac-paper__lines .ac-paper__line--short { width: 56%; }
.ac-paper__scope { padding: 11px; border: 1px solid #dce2d7; background: #f0f4ec; }
.ac-paper__scope strong,
.ac-paper__scope small { display: block; }
.ac-paper__scope strong { margin: 4px 0 2px; font-size: 13px; }
.ac-paper__scope small { color: var(--ac-muted); font-size: 10px; }
.ac-paper__question { display: flex; align-items: center; gap: 10px; margin-top: 15px; padding-top: 13px; border-top: 1px dashed #d1d7ca; }
.ac-paper__question span { display: grid; place-items: center; width: 23px; height: 23px; border-radius: 50%; color: #fff5ef; background: var(--ac-orange); font-weight: 800; }
.ac-paper__question p { color: var(--ac-ink); font-size: 12px; font-style: italic; }
.ac-status-row { display: flex; align-items: center; gap: 7px; padding: 10px 11px; border: 1px solid var(--ac-line); border-radius: 4px; color: var(--ac-muted); font-size: 10px; }
.ac-status-row b { margin-left: auto; color: #9a4a30; font-size: 9px; letter-spacing: .04em; text-transform: uppercase; }
.ac-status-row--quiet { background: #f2f2ec; }
.ac-status-dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: #8c9a83; }
.ac-status-dot--orange { background: var(--ac-orange); }

.ac-conversation,
.ac-handoff,
.ac-intake-card,
.ac-request-card { min-width: 0; padding: 15px; border: 1px solid var(--ac-line); border-radius: 5px; background: #fffef9; }
.ac-conversation { background: #f6f5ee; }
.ac-conversation__head,
.ac-handoff__top,
.ac-card-head,
.ac-rule-diff__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.ac-conversation__head strong,
.ac-handoff__top strong,
.ac-card-head strong { display: block; margin-top: 4px; font-size: 13px; letter-spacing: -.02em; }
.ac-chip { display: inline-flex; align-items: center; flex: 0 0 auto; padding: 5px 7px; border: 1px solid #c8d0c4; border-radius: 3px; color: #50614f; font-size: 8px; font-weight: 800; letter-spacing: .07em; line-height: 1.1; text-transform: uppercase; }
.ac-chip--sage { border-color: #b8c9ae; color: #547050; background: #eaf2e4; }
.ac-chip--orange { border-color: #e5ad98; color: #a8492b; background: #fff0e9; }
.ac-message { margin-top: 14px; padding: 12px; border-radius: 4px; }
.ac-message__label { margin-bottom: 7px; font-size: 8px; }
.ac-message p { color: var(--ac-ink); font-size: 12px; line-height: 1.52; }
.ac-message--system { border: 1px solid #cbdac5; background: #edf4e8; }
.ac-message--homeowner { display: flex; align-items: flex-start; gap: 9px; border: 1px solid #efc9b8; background: #fff0e9; }
.ac-avatar { display: inline-grid; place-items: center; flex: 0 0 auto; width: 27px; height: 27px; border-radius: 3px; color: #304032; background: var(--ac-sage); font-size: 9px; font-weight: 800; }
.ac-avatar--owner { color: #fff8f1; background: var(--ac-charcoal); }
.ac-stop { display: grid; grid-template-columns: 23px minmax(0, 1fr); gap: 9px; align-items: center; margin-top: 14px; padding: 10px; border: 1px solid #c7d5bf; border-radius: 4px; background: #eaf3e6; }
.ac-stop__mark { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: #f5fff1; background: #6f9363; font-weight: 800; }
.ac-stop strong,
.ac-stop small { display: block; }
.ac-stop strong { color: #3f5e3e; font-size: 11px; }
.ac-stop small { margin-top: 2px; color: #6b7d69; font-size: 9px; }
.ac-handoff { background: var(--ac-charcoal); border-color: #516155; }
.ac-handoff .ac-ui-label { color: #a6b79f; }
.ac-handoff__top strong { color: #f4f5ed; }
.ac-handoff__source { display: flex; align-items: flex-start; gap: 9px; margin-top: 17px; padding: 10px; border-radius: 4px; background: #f0f4ec; }
.ac-icon { display: grid; place-items: center; width: 27px; height: 27px; flex: 0 0 auto; border-radius: 3px; color: #fff6ef; background: var(--ac-orange); font-weight: 800; }
.ac-handoff__source strong,
.ac-handoff__source small { display: block; }
.ac-handoff__source strong { margin: 3px 0; color: var(--ac-ink); font-size: 12px; }
.ac-handoff__source small { color: var(--ac-muted); font-size: 9px; }
.ac-handoff blockquote { margin-top: 15px; padding: 12px 0; border-top: 1px solid #536357; border-bottom: 1px solid #536357; color: #f3eee6; font-size: 13px; font-style: italic; line-height: 1.45; }
.ac-handoff__task { display: flex; align-items: center; gap: 8px; padding-top: 14px; }
.ac-handoff__task > div { min-width: 0; flex: 1; }
.ac-handoff__task strong,
.ac-handoff__task small { display: block; }
.ac-handoff__task strong { color: #f3f5ec; font-size: 11px; }
.ac-handoff__task small { margin-top: 3px; color: #abb9a7; font-size: 9px; line-height: 1.4; }
.ac-arrow { color: var(--ac-orange); font-size: 19px; }

.ac-owner-command { padding: 15px; border-radius: 5px; color: #f6f2ea; background: var(--ac-charcoal); box-shadow: 5px 6px 0 #dfe6d3; }
.ac-owner-command .ac-message__label { color: #a6b79f; }
.ac-owner-command p { margin-top: 9px; color: #f5f2e9; font-size: 13px; line-height: 1.55; }
.ac-rule-diff { padding: 15px; border: 1px solid #536355; border-radius: 5px; color: #eff3e9; background: #303c33; }
.ac-rule-diff .ac-ui-label { color: #a5b89f; }
.ac-rule-row { display: grid; grid-template-columns: minmax(0, 1fr) 17px minmax(0, 1fr); gap: 7px; align-items: center; padding: 11px 0; border-top: 1px solid #526155; }
.ac-rule-row:first-of-type { margin-top: 13px; }
.ac-rule-row__signal { color: #dbe6d8; font-size: 11px; }
.ac-rule-row b { color: var(--ac-orange); font-size: 14px; text-align: center; }
.ac-rule-row__destination { color: #f4ad90; font-size: 10px; font-weight: 800; text-align: right; }
.ac-test-strip { display: flex; align-items: center; gap: 9px; padding: 11px; border: 1px solid #c7d5bf; border-radius: 4px; background: #edf4e8; }
.ac-test-strip__icon { display: grid; place-items: center; width: 22px; height: 22px; flex: 0 0 auto; color: #4d7149; font-size: 17px; }
.ac-test-strip strong,
.ac-test-strip small { display: block; }
.ac-test-strip strong { color: #405f3f; font-size: 11px; }
.ac-test-strip small { margin-top: 2px; color: #6c7d69; font-size: 9px; line-height: 1.4; }

.ac-inbox { overflow: hidden; border: 1px solid var(--ac-line); border-radius: 5px; background: #f7f6f0; }
.ac-inbox__top,
.ac-inbox__footer { display: flex; justify-content: space-between; align-items: center; gap: 9px; padding: 11px 13px; color: #8a9489; font-size: 9px; }
.ac-inbox__top { border-bottom: 1px solid var(--ac-line); }
.ac-inbox__brand { color: var(--ac-ink); font-size: 11px; font-weight: 800; }
.ac-inbox__brand i { display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: var(--ac-orange); }
.ac-inbox__notice { display: flex; align-items: center; gap: 9px; margin: 13px; padding: 10px; border: 1px solid #e9c8b8; border-radius: 4px; background: #fff0e9; }
.ac-notice-icon { display: grid; place-items: center; width: 23px; height: 23px; border-radius: 50%; color: #fff7f0; background: var(--ac-orange); font-weight: 800; }
.ac-inbox__notice strong,
.ac-inbox__notice small { display: block; }
.ac-inbox__notice strong { color: #83432e; font-size: 11px; }
.ac-inbox__notice small { margin-top: 2px; color: #946c5d; font-size: 9px; }
.ac-inbox__message { margin: 0 13px; padding: 13px; border: 1px solid #d9ddd4; border-radius: 4px; background: var(--ac-cream); }
.ac-inbox__person { display: flex; align-items: center; gap: 8px; }
.ac-inbox__person > div { min-width: 0; flex: 1; }
.ac-inbox__person strong,
.ac-inbox__person small { display: block; }
.ac-inbox__person strong { font-size: 12px; }
.ac-inbox__person small { margin-top: 2px; color: var(--ac-muted); font-size: 9px; }
.ac-inbox__message p { margin-top: 13px; color: var(--ac-ink); font-size: 12px; line-height: 1.5; }
.ac-inbox__footer { margin-top: 12px; border-top: 1px solid var(--ac-line); }

.ac-inquiry-layout { display: grid; gap: 14px; }
.ac-intake-card { background: #f4f5ee; }
.ac-detail-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; margin: 17px 0 2px; border-top: 1px solid var(--ac-line); }
.ac-detail-list div { padding: 10px 0; border-bottom: 1px solid var(--ac-line); }
.ac-detail-list span,
.ac-detail-list strong { display: block; }
.ac-detail-list span { color: var(--ac-muted); font-size: 9px; }
.ac-detail-list strong { margin-top: 3px; font-size: 11px; }
.ac-request-card { background: var(--ac-charcoal); border-color: #526356; }
.ac-request-card .ac-ui-label { color: #a5b79f; }
.ac-request-card .ac-card-head strong { color: #f3f5ec; }
.ac-request-card__slot { display: flex; align-items: center; gap: 10px; margin-top: 17px; padding: 12px; border-radius: 4px; background: #f0f4ec; }
.ac-request-card__calendar { display: grid; place-items: center; width: 34px; height: 34px; color: var(--ac-ink); background: var(--ac-sage); font: 700 17px/1 'Barlow Condensed', sans-serif; }
.ac-request-card__slot strong,
.ac-request-card__slot small { display: block; }
.ac-request-card__slot strong { color: var(--ac-ink); font-size: 12px; }
.ac-request-card__slot small { margin-top: 3px; color: var(--ac-muted); font-size: 9px; }
.ac-request-card__rule { display: flex; justify-content: center; align-items: center; gap: 7px; padding: 15px 0 12px; color: #f3af94; font-size: 9px; font-weight: 800; letter-spacing: .09em; }
.ac-request-card__rule b { color: var(--ac-orange); font-size: 13px; }
.ac-request-card__owner { display: flex; align-items: center; gap: 8px; padding-top: 12px; border-top: 1px solid #526256; }
.ac-request-card__owner > div { min-width: 0; }
.ac-request-card__owner strong,
.ac-request-card__owner small { display: block; }
.ac-request-card__owner strong { color: #eff4e9; font-size: 11px; }
.ac-request-card__owner small { margin-top: 2px; color: #afbdab; font-size: 9px; line-height: 1.4; }

.ac-browser { overflow: hidden; border: 1px solid #cbd1c8; border-radius: 5px; background: #fffef9; box-shadow: 5px 6px 0 #e4e8dc; }
.ac-browser__bar { display: flex; align-items: center; gap: 8px; padding: 10px; border-bottom: 1px solid #d5dad1; background: #eff1eb; }
.ac-browser__dots { display: flex; gap: 4px; }
.ac-browser__dots i { width: 6px; height: 6px; border-radius: 50%; background: #bac2b5; }
.ac-browser__url { min-width: 0; flex: 1; overflow: hidden; padding: 5px 8px; border: 1px solid #d1d7cd; border-radius: 3px; color: #747e75; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.ac-site-nav { display: flex; align-items: center; gap: 14px; padding: 12px; color: #6d786e; font-size: 9px; }
.ac-site-nav strong { margin-right: auto; color: var(--ac-ink); font-size: 10px; letter-spacing: .08em; }
.ac-site-blank { display: flex; align-items: center; gap: 13px; min-height: 168px; padding: 19px; background: #eef1e9; }
.ac-site-blank__mark { display: grid; place-items: center; width: 35px; height: 35px; border: 1px solid #c5cec0; border-radius: 50%; color: #7d897f; font-size: 19px; }
.ac-site-blank strong,
.ac-site-blank p { display: block; }
.ac-site-blank strong { margin: 5px 0; font-size: 18px; }
.ac-site-blank p { font-size: 10px; line-height: 1.45; }
.ac-form-ghost { display: grid; gap: 6px; margin: 13px; padding: 12px; border: 1px solid #d9ddd4; border-radius: 4px; color: #8a9489; font-size: 9px; }
.ac-form-ghost__line { display: block; height: 24px; border: 1px solid #e0e3dc; background: #f8f8f3; }
.ac-form-ghost__button { width: max-content; padding: 6px 8px; color: #f6eee7; background: #7b8779; font-weight: 800; }

.ac-browser--draft { border-color: #abbda5; }
.ac-page-preview { display: grid; grid-template-columns: 1.05fr .95fr; gap: 14px; padding: 18px; background: linear-gradient(135deg, #eef3e7, #f9f6ee 55%); }
.ac-page-preview__copy { padding: 13px 2px 13px 3px; }
.ac-page-preview__copy .ac-ui-label { color: #9d482e; }
.ac-page-preview__copy h4 { margin-top: 12px; }
.ac-page-preview__copy p { margin-top: 10px; font-size: 11px; line-height: 1.5; }
.ac-page-preview__cta { display: inline-flex; align-items: center; gap: 10px; margin-top: 18px; padding: 9px 10px; color: var(--ac-ink); background: var(--ac-orange); font-size: 10px; font-weight: 800; }
.ac-page-preview__cta b { font-size: 15px; }
.ac-page-preview__form { padding: 12px; border: 1px solid #ccd8c6; border-radius: 4px; background: #fffef9; }
.ac-page-preview__form label { display: flex; justify-content: space-between; gap: 7px; margin-top: 10px; padding-bottom: 7px; border-bottom: 1px solid #e0e4dc; color: #7b867b; font-size: 9px; }
.ac-page-preview__form label b { color: var(--ac-ink); font-size: 9px; }
.ac-page-preview__submit { display: block; margin-top: 13px; padding: 8px; color: var(--ac-ink); background: var(--ac-orange); font-size: 9px; font-weight: 800; text-align: center; }
.ac-page-preview__form > small { display: block; margin-top: 8px; color: #a94a2e; font-size: 8px; font-weight: 800; letter-spacing: .08em; text-align: center; }
.ac-connection-row { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; padding: 10px; border: 1px solid #bed0b9; border-radius: 4px; color: #4d654b; background: #edf4e8; font-size: 9px; font-weight: 800; }
.ac-connection-row b { color: var(--ac-orange); font-size: 14px; }
.ac-connection-row em { margin-left: auto; color: #a54c31; font-size: 8px; font-style: normal; letter-spacing: .08em; }

.ac-case__footer { display: flex; justify-content: space-between; gap: 15px; padding: 14px clamp(20px, 3.7vw, 44px); border-top: 1px solid var(--ac-line); color: #798579; font-size: 10px; }
.ac-case__footer span { min-width: 0; }
.ac-case__footer span:last-child { color: #9b6554; text-align: right; }
.ac-case__footer i { display: inline-block; width: 7px; height: 7px; margin-right: 4px; border-radius: 50%; background: var(--ac-orange); }

@media (max-width: 980px) {
  .ac-stage-grid { grid-template-columns: 1fr; }
  .ac-stage__body { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
  .ac-stage__note { min-height: 0; }
}

@media (max-width: 720px) {
  .ac-case__header { display: block; }
  .ac-case__stamp { width: max-content; max-width: 100%; margin-top: 24px; }
  .ac-stage-rail { grid-template-columns: 1fr; gap: 10px; }
  .ac-stage-rail__line { width: 1px; height: 15px; margin: 0 0 0 14px; border-top: 0; border-left: 1px dashed #7f927b; }
  .ac-stage__body { grid-template-columns: 1fr; }
  .ac-page-preview { grid-template-columns: 1fr; }
  .ac-page-preview__copy { padding-bottom: 0; }
  .ac-case__footer { display: block; }
  .ac-case__footer span { display: block; }
  .ac-case__footer span:last-child { margin-top: 6px; text-align: left; }
}

@media (max-width: 430px) {
  .ac-case__header { padding: 22px 17px; }
  .ac-case__intro p { font-size: 15px; }
  .ac-stage-grid { padding: 12px; }
  .ac-stage__header { padding: 18px 15px 15px; }
  .ac-stage__body { padding: 15px; }
  .ac-stage__note { padding: 13px 15px; }
  .ac-site-nav { gap: 8px; }
  .ac-site-nav span { display: none; }
  .ac-inbox__top,
  .ac-inbox__footer { align-items: flex-start; }
  .ac-inbox__person { align-items: flex-start; flex-wrap: wrap; }
  .ac-inbox__person .ac-chip { margin-left: 35px; }
  .ac-rule-row { grid-template-columns: minmax(0, 1fr); gap: 3px; }
  .ac-rule-row b { display: none; }
  .ac-rule-row__destination { text-align: left; }
  .ac-connection-row em { width: 100%; margin-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .ac-case * { scroll-behavior: auto; }
}
