/* chattic.us theme for the Papyrus standard front end.
   Tokens follow content/VOICE.md's sibling, the brand guide: three flat surface steps, no region borders, system
   light/dark. The vendor and component stylesheets load first; everything here wins over them. */

@font-face { font-family: "Newsreader"; src: url("/assets/fonts/newsreader-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("/assets/fonts/newsreader-latin-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("/assets/fonts/newsreader-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("/assets/fonts/newsreader-latin-500-italic.woff2") format("woff2"); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("/assets/fonts/newsreader-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("/assets/fonts/newsreader-latin-600-italic.woff2") format("woff2"); font-weight: 600; font-style: italic; font-display: swap; }
@font-face { font-family: "Manrope"; src: url("/assets/fonts/manrope-latin-wght-normal.woff2") format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("/assets/fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("/assets/fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }

:root {
  --paper: #f2efe7;
  --ink: #11130f;
  --ink-soft: #3f463d;
  --signal: #ffd400;
  --clay: #ef6a47;
  --cobalt: #4f71ff;
  --sea: #73d7c5;
  --amber: #f0bc4d;
  --surface-0: var(--paper);
  --surface-1: #e7e2d5;
  --surface-2: #d9d3c1;
  --surface-foreground: var(--ink);
  --mark-shadow: #cbc4ad;
  --duration-fast: 160ms;
  --ease-out: cubic-bezier(0.22, 0.75, 0.18, 1);
  --font-display: "Newsreader", ui-serif, Georgia, serif;
  --font-body: "Manrope", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --page-pad: 1.25rem;
  --papyrus-focus: var(--cobalt);
  --papyrus-rule: var(--surface-2);
  --papyrus-bg: var(--surface-1);
  --papyrus-ink: var(--ink);
  --papyrus-radius: 1rem;
  --markus-ink: var(--ink);
  --markus-muted: var(--ink-soft);
  --markus-paper: var(--surface-0);
  --markus-card: var(--surface-1);
  --markus-line: var(--surface-2);
  --markus-accent: var(--cobalt);
  --markus-accent-2: var(--clay);
  --markus-quote: var(--ink-soft);
  --markus-note: var(--sea);
  --markus-warning: var(--amber);
  --markus-tip: var(--sea);
  --markus-caution: var(--clay);
  --markus-sans: var(--font-body);
  --markus-serif: var(--font-display);
  --markus-mono: var(--font-mono);
  --markus-pre-bg: var(--surface-2);
  --markus-pre-ink: var(--ink);
  --markus-code-bg: var(--surface-1);
  --markus-aside-bg: var(--surface-1);
  --markus-tab-nav-bg: var(--surface-1);
  --markus-th-bg: var(--surface-2);
}
@media (min-width: 40rem) { :root { --page-pad: 2rem; } }
@media (min-width: 64rem) { :root { --page-pad: 3rem; } }
@media (prefers-color-scheme: dark) {
  :root {
    --surface-0: var(--ink);
    --surface-1: #1d2018;
    --surface-2: #2a2e22;
    --surface-foreground: var(--paper);
    --ink-soft: #b9c0b6;
    --mark-shadow: #373c2c;
  }
}

html { scroll-behavior: smooth; scroll-padding-top: 5rem; }
body.chatticus {
  min-width: 320px;
  margin: 0;
  overflow-x: hidden;
  background: var(--surface-0);
  color: var(--surface-foreground);
  font-family: var(--font-body);
  line-height: 1.5;
  text-rendering: optimizeLegibility;
}
.chatticus *, .chatticus *::before, .chatticus *::after { box-sizing: border-box; }
.chatticus ::selection { background: var(--signal); color: var(--ink); }
.chatticus a, .chatticus button { -webkit-tap-highlight-color: transparent; }
.chatticus :where(a, button, input, select, textarea):focus-visible { outline: none; box-shadow: 0 0 0 4px rgb(79 113 255 / 0.3); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

.chatticus .markus-skip-link {
  position: fixed; top: 0.75rem; left: 0.75rem; z-index: 100;
  transform: translateY(-180%);
  border-radius: 9999px; background: var(--signal); box-shadow: 4px 4px 0 var(--ink);
  padding: 0.75rem 1rem; color: var(--ink); font-weight: 800; text-decoration: none;
  transition: transform var(--duration-fast) ease;
}
.chatticus .markus-skip-link:focus { transform: translateY(0); }

/* ------------------------------------------------------------------ masthead */

.chatticus .markus-site-masthead {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; justify-content: space-between;
  height: 4.6rem; max-width: 92rem; margin: 0 auto; padding: 0 var(--page-pad);
  background: color-mix(in srgb, var(--surface-0) 90%, transparent);
  backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
}
@supports not (position: sticky) { .chatticus .markus-site-masthead { position: relative; } }
.chatticus .markus-site-wordmark { margin: 0; }
.chatticus .markus-site-wordmark a {
  display: inline-flex; border-radius: 9999px; color: var(--ink); text-decoration: none;
  font-weight: 800; font-size: 1.05rem; letter-spacing: -0.055em;
}
.chatticus .chat-wordmark { display: inline-flex; align-items: center; gap: 0.5rem; }
.chatticus .chat-wordmark svg { display: block; }
@media (prefers-color-scheme: dark) { .chatticus .markus-site-wordmark a, .chatticus .chat-footer-mark { color: var(--paper); } }

.chatticus .markus-site-nav { display: contents; font-size: 0.875rem; font-weight: 600; }
.chatticus .markus-site-nav a { color: var(--ink); text-decoration: none; }
.chatticus .markus-site-nav a[aria-current="page"] { text-decoration: none; }
@media (prefers-color-scheme: dark) { .chatticus .markus-site-nav a { color: var(--surface-foreground); } }
/* the six page links: desktop only */
.chatticus .markus-site-nav a:nth-child(-n+6) {
  position: relative; display: none; align-items: center; min-height: 2.75rem; padding-inline: 0.25rem; border-radius: 9999px;
}
.chatticus .markus-site-nav a:nth-child(-n+6)::after {
  content: ""; position: absolute; right: 0.25rem; bottom: 0.45rem; left: 0.25rem; height: 2px;
  background: var(--clay); transform: scaleX(0); transform-origin: right; transition: transform var(--duration-fast) ease;
}
.chatticus .markus-site-nav a:nth-child(-n+6):hover::after, .chatticus .markus-site-nav a:nth-child(-n+6):focus-visible::after { transform: scaleX(1); transform-origin: left; }
/* the two buttons */
.chatticus .markus-site-nav a:nth-child(n+7) {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  height: 2.75rem; padding: 0 1rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 700; letter-spacing: -0.01em;
  transition: background-color 0.2s, color 0.2s;
}
.chatticus .markus-site-nav a:nth-child(7) { display: none; background: var(--surface-2); color: var(--surface-foreground); margin-left: auto; margin-right: 0.75rem; }
.chatticus .markus-site-nav a:nth-child(7):hover { background: var(--ink); color: var(--paper); }
.chatticus .markus-site-nav a:nth-child(8) {
  margin-left: auto; border-radius: 22px 22px 5px 22px; background: var(--mark-shadow); color: var(--surface-foreground);
}
.chatticus .markus-site-nav a:nth-child(8):hover { background: var(--cobalt); color: #fff; }
.chatticus .markus-site-nav a:nth-child(8)::after, .chatticus .chat-read::after, .chatticus .chat-footer-group a::after, .chatticus .chat-arrow::after {
  content: ""; display: inline-block; width: 1em; height: 1em; background: currentColor;
  -webkit-mask: var(--arrow-up-right) center / contain no-repeat; mask: var(--arrow-up-right) center / contain no-repeat;
}
.chatticus { --arrow-up-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7h10v10'/%3E%3Cpath d='M7 17 17 7'/%3E%3C/svg%3E"); }
.chatticus .markus-site-nav a:nth-child(8)::after { width: 1rem; height: 1rem; }

.chatticus .markus-nav-toggle {
  display: none; width: 2.5rem; height: 2.5rem; margin-left: 0.75rem; padding: 0; border: 0; border-radius: 9999px;
  background: var(--surface-1) center / 1.25rem no-repeat; color: transparent; font-size: 0; cursor: pointer; order: 2;
  --menu-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 6h16M4 12h16M4 18h16'/%3E%3C/svg%3E");
  --close-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");
}
.chatticus .markus-nav-toggle::before { content: ""; display: block; width: 100%; height: 100%; background: var(--ink); -webkit-mask: var(--menu-icon) center / 1.25rem no-repeat; mask: var(--menu-icon) center / 1.25rem no-repeat; }
.chatticus .markus-nav-toggle[aria-expanded="true"]::before { -webkit-mask-image: var(--close-icon); mask-image: var(--close-icon); }
@media (prefers-color-scheme: dark) { .chatticus .markus-nav-toggle::before { background: var(--surface-foreground); } }
.chatticus .markus-site-nav { order: 3; }
.chatticus .markus-site-nav > a { order: 3; }
.chatticus .markus-site-wordmark { order: 0; }
.markus-nav-js .chatticus .markus-nav-toggle, html.markus-nav-js .chatticus .markus-nav-toggle { display: inline-block; }

/* narrow: bar shows the wordmark, the toggle and Sign in; the open panel lists everything */
.chatticus .markus-site-nav.is-open, html.markus-nav-js .chatticus .markus-site-nav.is-open {
  display: block; position: absolute; right: var(--page-pad); top: calc(100% + 0.25rem); z-index: 50;
  width: min(18rem, calc(100vw - 2.5rem)); padding: 1rem; border-radius: 1rem; background: var(--surface-1); box-shadow: 4px 4px 0 var(--ink);
}
.chatticus .markus-site-nav.is-open a { display: flex !important; margin: 0 !important; width: 100%; height: auto; min-height: 2.75rem; padding: 0.625rem 0.75rem; border-radius: 0.75rem; justify-content: flex-start; background: none; box-shadow: none; }
.chatticus .markus-site-nav.is-open a::after { display: none; }
.chatticus .markus-site-nav.is-open a:nth-child(7), .chatticus .markus-site-nav.is-open a:nth-child(8) { margin-top: 0.5rem !important; justify-content: center; font-size: 0.75rem; }
.chatticus .markus-site-nav.is-open a:nth-child(7) { background: var(--surface-2); }
.chatticus .markus-site-nav.is-open a:nth-child(8) { background: var(--mark-shadow); border-radius: 22px 22px 5px 22px; }
.chatticus .markus-site-nav.is-open a:nth-child(8)::after { display: inline-block; }
/* closed and narrow: only Sign in (and, from 640px, Join the beta) stay in the bar */
@media (min-width: 40rem) { .chatticus .markus-site-nav:not(.is-open) a:nth-child(7) { display: inline-flex; } }
.markus-nav-js .chatticus .markus-site-nav:not(.is-open) { display: contents; }
html.markus-nav-js .chatticus .markus-site-nav:not(.is-open) { display: contents; }
@media (min-width: 64rem) {
  .chatticus .markus-nav-toggle, html.markus-nav-js .chatticus .markus-nav-toggle { display: none; }
  .chatticus .markus-site-nav:not(.is-open) a:nth-child(-n+6) { display: inline-flex; margin-right: 1.75rem; }
  .chatticus .markus-site-nav:not(.is-open) a:nth-child(1) { margin-left: auto; }
  .chatticus .markus-site-nav:not(.is-open) a:nth-child(6) { margin-right: auto; }
  .chatticus .markus-site-nav:not(.is-open) a:nth-child(7) { margin-left: 0; }
  .chatticus .markus-site-nav:not(.is-open) a:nth-child(8) { margin-left: 0.75rem; }
}

/* ------------------------------------------------------------------ article pages (wiki, desks, features, legal) */

.chatticus main > .markus-document {
  max-width: 92rem; margin: 0 auto; padding: 5rem var(--page-pad); background: transparent; container-type: normal;
}
@media (min-width: 40rem) { .chatticus main > .markus-document { padding-block: 7rem; } }
.chatticus .markus-document > header { margin: 0; }
.chatticus .markus-header h1, .chatticus .markus-document > h1:first-of-type {
  max-width: 56rem; margin: 0; font-family: var(--font-display); font-weight: 400;
  font-size: clamp(2.6rem, 6vw, 4.8rem); line-height: 0.95; letter-spacing: -0.05em; color: var(--ink);
}
@media (prefers-color-scheme: dark) { .chatticus .markus-header h1 { color: var(--paper); } }
.chatticus .chat-kicker, .chatticus .chat-example-label + .chat-kicker {
  margin: 0 0 1.25rem; font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft);
}
.chatticus .markus-header .markus-lede {
  max-width: 48rem; margin: 2rem 0 0; font-size: 1.25rem; line-height: 1.625; color: var(--ink-soft);
}
@media (min-width: 40rem) { .chatticus .markus-header .markus-lede { font-size: 1.5rem; line-height: 2rem; } }
.chatticus .chat-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; margin-bottom: 1.75rem; }
.chatticus .chat-badge, .chatticus .markus-band-eyebrow {
  display: inline-flex; align-items: center; margin: 0; padding: 0.25rem 0.75rem; border-radius: 9999px;
  color: var(--surface-foreground);
  font-family: var(--font-mono); font-size: 0.68rem; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase;
}
.chatticus .chat-chip {
  margin: 0; padding: 0.25rem 0.75rem; border: 1px solid color-mix(in srgb, var(--ink) 20%, transparent); border-radius: 9999px;
  font-family: var(--font-display); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-soft);
}
.chatticus .markus-document > header + *, .chatticus .markus-document > .chat-badges + * { margin-top: 2.5rem; }
.chatticus .markus-document > :not(header) { max-width: 48rem; }
.chatticus .markus-document > :not(header):not(h1) { color: var(--ink-soft); font-size: 1.125rem; line-height: 1.625; }
.chatticus .markus-document > h1:not(:first-child), .chatticus .markus-document h2, .chatticus .markus-document h3, .chatticus .markus-document h4 {
  color: var(--ink); font-family: var(--font-display); letter-spacing: -0.04em;
}
@media (prefers-color-scheme: dark) { .chatticus .markus-document h1, .chatticus .markus-document h2, .chatticus .markus-document h3, .chatticus .markus-document h4 { color: var(--paper); } }
.chatticus .markus-document a { color: var(--ink); font-weight: 600; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.chatticus .markus-document a:hover { color: var(--cobalt); }
@media (prefers-color-scheme: dark) { .chatticus .markus-document a { color: var(--paper); } }
.chatticus .markus-document code { font-family: var(--font-mono); }
.chatticus .markus-document blockquote { margin: 0; padding: 1rem 1.25rem; border: 0; border-radius: 1rem; background: var(--surface-1); }
.chatticus .markus-document pre { border: 0; border-radius: 1rem; }
.chatticus .markus-document th, .chatticus .markus-document td { border: 0; background: var(--surface-1); }
.chatticus .markus-document th { background: var(--surface-2); font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); }
.chatticus .markus-callout, .chatticus .markus-card, .chatticus .markus-details, .chatticus .markus-aside, .chatticus .markus-metric, .chatticus .markus-tabs { border: 0; background: var(--surface-1); }

/* the closing "Related" list of a wiki page or a desk's post */
.chatticus .markus-document h2#related-wiki, .chatticus .markus-document h2#related-posts {
  margin-top: 3.5rem; font-family: var(--font-mono); font-size: 0.62rem; font-weight: 400; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft);
}
.chatticus .markus-document h2#related-wiki + ul, .chatticus .markus-document h2#related-posts + ul { display: grid; gap: 0.75rem; margin: 1.25rem 0 0; padding: 0; list-style: none; }
.chatticus .markus-document h2#related-wiki + ul a, .chatticus .markus-document h2#related-posts + ul a {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 3rem; padding: 1.25rem; border-radius: 1rem;
  background: var(--surface-1); font-family: var(--font-display); font-size: 1.25rem; font-weight: 400; line-height: 1.25; letter-spacing: -0.03em; text-decoration: none;
}
.chatticus .markus-document h2#related-wiki + ul a::after, .chatticus .markus-document h2#related-posts + ul a::after {
  content: ""; flex: none; width: 1rem; height: 1rem; background: currentColor; -webkit-mask: var(--arrow-up-right) center / contain no-repeat; mask: var(--arrow-up-right) center / contain no-repeat;
}

/* ------------------------------------------------------------------ bands (section intros, home, use cases, beta) */

.chatticus .markus-band { padding: 5rem var(--page-pad); background: var(--surface-0); color: var(--surface-foreground); }
.chatticus .markus-band[data-tone="card"] { background: var(--surface-1); }
.chatticus .markus-band[data-tone="muted"] { background: var(--surface-2); }
@media (min-width: 40rem) { .chatticus .markus-band { padding-block: 7rem; } }
.chatticus .markus-band-inner { max-width: 92rem; }
.chatticus .markus-band-eyebrow { margin-bottom: 1.75rem; }
.chatticus .markus-columns { gap: 1rem; }
.chatticus .markus-columns[data-count="1"] { grid-template-columns: minmax(0, 1fr); }
.chatticus .markus-column:empty { display: none; }
.chatticus .markus-column { padding: 0; border: 0; border-radius: 0; background: none; }
.chatticus .markus-column[data-panel="card"] { padding: 1.5rem; border-radius: 1rem; background: var(--surface-1); }
.chatticus .markus-band a { color: var(--ink); font-weight: 600; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.chatticus .markus-band a:hover { color: var(--cobalt); }
@media (prefers-color-scheme: dark) { .chatticus .markus-band a { color: var(--paper); } }
.chatticus .markus-band h1 { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: clamp(3rem, 7vw, 6rem); line-height: 0.9; letter-spacing: -0.06em; max-width: 56rem; }
.chatticus .markus-band h2 { margin: 0; font-family: var(--font-display); font-weight: 400; }
.chatticus .markus-band p:not([class]) { font-size: 1.125rem; line-height: 1.625; color: var(--ink-soft); max-width: 42rem; }
.chatticus .markus-band h1 + p:not([class]) { margin-top: 2rem; }

/* a section's listing */
.chatticus .markus-band .markus-card-grid { display: grid; grid-template-columns: 1fr; gap: 0.75rem; margin-top: 3.5rem; }
.chatticus .markus-band .markus-card { display: block; padding: 1.5rem; border-radius: 1rem; background: var(--surface-1); }
@media (min-width: 40rem) { .chatticus .markus-band .markus-card { padding: 2rem; } }
.chatticus .markus-band .markus-card .chat-kicker { margin: 0; }
.chatticus .markus-band .markus-card-title { margin: 0; font-family: var(--font-display); font-size: 1.875rem; font-weight: 400; line-height: 1; letter-spacing: -0.04em; }
.chatticus .markus-band .markus-card-title { font-weight: 400; }
.chatticus .markus-band .markus-card .chat-kicker + .markus-card-title { margin-top: 0.75rem; }
.chatticus .markus-band .markus-card-title a { color: var(--ink); text-decoration: none; }
.chatticus .markus-band .markus-card-title a:hover { color: var(--cobalt); }
.chatticus .markus-band .markus-card-summary { max-width: 42rem; margin: 1rem 0 0; font-size: 1rem; line-height: 1.625; color: var(--ink-soft); }
.chatticus .chat-read {
  display: inline-flex; align-items: center; gap: 0.375rem; margin-top: 1.25rem; min-height: 2rem;
  font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink);
  text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px;
}
.chatticus .chat-read::after { width: 0.875rem; height: 0.875rem; }
.chatticus .chat-read:hover { color: var(--cobalt); }

/* ------------------------------------------------------------------ footer */

.chatticus .markus-site-footer { background: var(--surface-1); color: var(--surface-foreground); }
.chatticus .chat-footer-inner { max-width: 92rem; margin: 0 auto; padding: 3.5rem var(--page-pad); }
.chatticus .chat-footer-top { display: grid; gap: 3rem; }
@media (min-width: 64rem) { .chatticus .chat-footer-top { grid-template-columns: 1.25fr 1.75fr; } }
.chatticus .chat-footer-mark { display: inline-flex; border-radius: 9999px; color: var(--ink); text-decoration: none; font-weight: 800; font-size: 1.05rem; letter-spacing: -0.055em; }
.chatticus .chat-footer-tagline { max-width: 24rem; margin: 1.5rem 0 0; font-family: var(--font-display); font-size: 1.5rem; line-height: 1.25; letter-spacing: -0.035em; }
.chatticus .chat-footer-note { max-width: 28rem; margin: 1.25rem 0 0; font-size: 0.875rem; line-height: 1.625; color: var(--ink-soft); }
.chatticus .chat-footer-brand nav ul { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; margin: 1.25rem 0 0; padding: 0; list-style: none; font-size: 0.875rem; font-weight: 600; }
.chatticus .chat-footer-brand nav a { color: inherit; text-decoration: none; }
.chatticus .chat-footer-brand nav a:hover { color: var(--cobalt); }
.chatticus .chat-footer-groups { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; align-content: start; }
@media (min-width: 64rem) { .chatticus .chat-footer-groups { grid-template-columns: repeat(4, 1fr); } }
.chatticus .chat-footer-group h2 { margin: 0; font-family: var(--font-mono); font-size: 0.65rem; font-weight: 400; letter-spacing: 0.13em; text-transform: uppercase; color: var(--ink-soft); }
.chatticus .chat-footer-group ul { display: grid; gap: 0.75rem; margin: 1.25rem 0 0; padding: 0; list-style: none; }
.chatticus .chat-footer-group a { display: inline-flex; align-items: center; gap: 0.375rem; min-height: 2rem; color: inherit; font-size: 0.875rem; font-weight: 600; text-decoration: none; }
.chatticus .chat-footer-group a::after { width: 0.875rem; height: 0.875rem; }
.chatticus .chat-footer-group a:hover { color: var(--cobalt); }
.chatticus .chat-footer-bottom {
  display: flex; flex-direction: column; gap: 0.75rem; margin-top: 2.5rem; padding: 1rem 1.25rem; border-radius: 1rem; background: var(--surface-2);
  font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.11em; color: var(--ink-soft);
}
.chatticus .chat-footer-bottom p { margin: 0; }
.chatticus .chat-footer-bottom p:last-child { text-transform: uppercase; }
@media (min-width: 40rem) { .chatticus .chat-footer-bottom { flex-direction: row; align-items: center; justify-content: space-between; } }
@media (prefers-color-scheme: dark) { .chatticus .chat-footer-mark { color: var(--paper); } }
/* lucide icons (ISC license) as masks: the icon takes the colour of the element's background */
:root {
  --icon-brain-circuit: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%205a3%203%200%201%200-5.997.125%204%204%200%200%200-2.526%205.77%204%204%200%200%200%20.556%206.588A4%204%200%201%200%2012%2018Z%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M9%2013a4.5%204.5%200%200%200%203-4%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M6.003%205.125A3%203%200%200%200%206.401%206.5%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M3.477%2010.896a4%204%200%200%201%20.585-.396%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M6%2018a4%204%200%200%201-1.967-.516%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M12%2013h4%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M12%2018h6a2%202%200%200%201%202%202v1%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M12%208h8%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M16%208V5a2%202%200%200%201%202-2%27%3E%3C%2Fpath%3E%3Ccircle%20cx%3D%2716%27%20cy%3D%2713%27%20r%3D%27.5%27%3E%3C%2Fcircle%3E%3Ccircle%20cx%3D%2718%27%20cy%3D%273%27%20r%3D%27.5%27%3E%3C%2Fcircle%3E%3Ccircle%20cx%3D%2720%27%20cy%3D%2721%27%20r%3D%27.5%27%3E%3C%2Fcircle%3E%3Ccircle%20cx%3D%2720%27%20cy%3D%278%27%20r%3D%27.5%27%3E%3C%2Fcircle%3E%3C%2Fsvg%3E");
  --icon-hard-drive: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cline%20x1%3D%2722%27%20x2%3D%272%27%20y1%3D%2712%27%20y2%3D%2712%27%3E%3C%2Fline%3E%3Cpath%20d%3D%27M5.45%205.11%202%2012v6a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2v-6l-3.45-6.89A2%202%200%200%200%2016.76%204H7.24a2%202%200%200%200-1.79%201.11z%27%3E%3C%2Fpath%3E%3Cline%20x1%3D%276%27%20x2%3D%276.01%27%20y1%3D%2716%27%20y2%3D%2716%27%3E%3C%2Fline%3E%3Cline%20x1%3D%2710%27%20x2%3D%2710.01%27%20y1%3D%2716%27%20y2%3D%2716%27%3E%3C%2Fline%3E%3C%2Fsvg%3E");
  --icon-shield-check: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M20%2013c0%205-3.5%207.5-7.66%208.95a1%201%200%200%201-.67-.01C7.5%2020.5%204%2018%204%2013V6a1%201%200%200%201%201-1c2%200%204.5-1.2%206.24-2.72a1.17%201.17%200%200%201%201.52%200C14.51%203.81%2017%205%2019%205a1%201%200%200%201%201%201z%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27m9%2012%202%202%204-4%27%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
  --icon-clock-3: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%2710%27%3E%3C%2Fcircle%3E%3Cpolyline%20points%3D%2712%206%2012%2012%2016.5%2012%27%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
  --icon-users-round: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M18%2021a8%208%200%200%200-16%200%27%3E%3C%2Fpath%3E%3Ccircle%20cx%3D%2710%27%20cy%3D%278%27%20r%3D%275%27%3E%3C%2Fcircle%3E%3Cpath%20d%3D%27M22%2020c0-3.37-2-6.5-4-8a5%205%200%200%200-.45-8.3%27%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
  --icon-wrench: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M14.7%206.3a1%201%200%200%200%200%201.4l1.6%201.6a1%201%200%200%200%201.4%200l3.77-3.77a6%206%200%200%201-7.94%207.94l-6.91%206.91a2.12%202.12%200%200%201-3-3l6.91-6.91a6%206%200%200%201%207.94-7.94l-3.76%203.76z%27%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
  --icon-alarm-clock: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2713%27%20r%3D%278%27%3E%3C%2Fcircle%3E%3Cpath%20d%3D%27M12%209v4l2%202%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M5%203%202%206%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27m22%206-3-3%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M6.38%2018.7%204%2021%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M17.64%2018.67%2020%2021%27%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
  --icon-book-open-check: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2021V7%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27m16%2012%202%202%204-4%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M22%206V4a1%201%200%200%200-1-1h-5a4%204%200%200%200-4%204%204%204%200%200%200-4-4H3a1%201%200%200%200-1%201v13a1%201%200%200%200%201%201h6a3%203%200%200%201%203%203%203%203%200%200%201%203-3h6a1%201%200%200%200%201-1v-1.3%27%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
  --icon-hand: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M18%2011V6a2%202%200%200%200-2-2a2%202%200%200%200-2%202%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M14%2010V4a2%202%200%200%200-2-2a2%202%200%200%200-2%202v2%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M10%2010.5V6a2%202%200%200%200-2-2a2%202%200%200%200-2%202v8%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M18%208a2%202%200%201%201%204%200v6a8%208%200%200%201-8%208h-2c-2.8%200-4.5-.86-5.99-2.34l-3.6-3.6a2%202%200%200%201%202.83-2.82L7%2015%27%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
  --icon-play: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpolygon%20points%3D%276%203%2020%2012%206%2021%206%203%27%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
  --icon-circle-check-big: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M21.801%2010A10%2010%200%201%201%2017%203.335%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27m9%2011%203%203L22%204%27%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
  --icon-git-branch: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cline%20x1%3D%276%27%20x2%3D%276%27%20y1%3D%273%27%20y2%3D%2715%27%3E%3C%2Fline%3E%3Ccircle%20cx%3D%2718%27%20cy%3D%276%27%20r%3D%273%27%3E%3C%2Fcircle%3E%3Ccircle%20cx%3D%276%27%20cy%3D%2718%27%20r%3D%273%27%3E%3C%2Fcircle%3E%3Cpath%20d%3D%27M18%209a9%209%200%200%201-9%209%27%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
  --icon-boxes: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M2.97%2012.92A2%202%200%200%200%202%2014.63v3.24a2%202%200%200%200%20.97%201.71l3%201.8a2%202%200%200%200%202.06%200L12%2019v-5.5l-5-3-4.03%202.42Z%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27m7%2016.5-4.74-2.85%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27m7%2016.5%205-3%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M7%2016.5v5.17%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M12%2013.5V19l3.97%202.38a2%202%200%200%200%202.06%200l3-1.8a2%202%200%200%200%20.97-1.71v-3.24a2%202%200%200%200-.97-1.71L17%2010.5l-5%203Z%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27m17%2016.5-5-3%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27m17%2016.5%204.74-2.85%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M17%2016.5v5.17%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M7.97%204.42A2%202%200%200%200%207%206.13v4.37l5%203%205-3V6.13a2%202%200%200%200-.97-1.71l-3-1.8a2%202%200%200%200-2.06%200l-3%201.8Z%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M12%208%207.26%205.15%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27m12%208%204.74-2.85%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M12%2013.5V8%27%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
  --icon-github: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M15%2022v-4a4.8%204.8%200%200%200-1-3.5c3%200%206-2%206-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35%200-3.5%200%200-1%200-3%201.5-2.64-.5-5.36-.5-8%200C6%202%205%202%205%202c-.3%201.15-.3%202.35%200%203.5A5.403%205.403%200%200%200%204%209c0%203.5%203%205.5%206%205.5-.39.49-.68%201.05-.85%201.65-.17.6-.22%201.23-.15%201.85v4%27%3E%3C%2Fpath%3E%3Cpath%20d%3D%27M9%2018c-4.51%202-5-2-7-2%27%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
}

/* ------------------------------------------------------------------ buttons and shared pieces */

.chatticus .markus-actions { display: flex; flex-direction: column; gap: 0.75rem; margin: 2.25rem 0 0; max-width: none; }
@media (min-width: 40rem) { .chatticus .markus-actions { flex-direction: row; flex-wrap: wrap; } }
.chatticus .markus-button {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 2.75rem; height: 3rem; padding: 0 1.5rem;
  border: 0; border-radius: 9999px; background: var(--signal); color: var(--ink); box-shadow: 4px 4px 0 var(--ink);
  font-size: 0.875rem; font-weight: 700; letter-spacing: -0.01em; text-decoration: none; transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s, color 0.2s;
}
.chatticus .markus-band a.markus-button { color: var(--ink); text-decoration: none; font-weight: 700; }
.chatticus .markus-button:hover { transform: translateY(-2px); box-shadow: 6px 6px 0 var(--ink); color: var(--ink); }
.chatticus .markus-button[data-size="lg"] { height: 3.5rem; padding: 0 2rem; font-size: 1rem; }
.chatticus .markus-button[data-variant="secondary"] { background: var(--surface-2); color: var(--surface-foreground); box-shadow: none; }
.chatticus .markus-band a.markus-button[data-variant="secondary"] { color: var(--surface-foreground); }
.chatticus .markus-button[data-variant="secondary"]:hover { transform: none; background: var(--ink); color: var(--paper); }
.chatticus .markus-band a.markus-button[data-variant="secondary"]:hover { color: var(--paper); }
.chatticus .markus-button[href="/chat"]::after { content: ""; width: 1.25rem; height: 1.25rem; background: currentColor; -webkit-mask: var(--arrow-up-right) center / contain no-repeat; mask: var(--arrow-up-right) center / contain no-repeat; }
.chatticus .markus-button[href^="https://github.com"]::before { content: ""; width: 1.25rem; height: 1.25rem; background: currentColor; -webkit-mask: var(--icon-github) center / contain no-repeat; mask: var(--icon-github) center / contain no-repeat; }
.chatticus .markus-button[href^="https://github.com"][data-variant="secondary"] { background: transparent; }
.chatticus .markus-button[href^="https://github.com"][data-variant="secondary"]:hover { background: color-mix(in srgb, var(--surface-foreground) 10%, transparent); color: var(--surface-foreground); }

.chatticus .markus-band :is(strong, b) { font-weight: inherit; }
/* a chip: <em> alone, or after a label, in a line of its own */
.chatticus .markus-band p em { font-style: normal; }
.chatticus .markus-band h1 em, .chatticus .markus-band h2 em { display: inline; font-style: italic; }
.chatticus .markus-band :is(h1, h2) { color: inherit; }
.chatticus .markus-band h2 { font-size: clamp(3.4rem, 6.4vw, 6.6rem); line-height: 0.87; letter-spacing: -0.065em; margin: 0; max-width: none; }
.chatticus .markus-band h3 { margin: 0; font-family: var(--font-display); font-weight: 400; }
.chatticus .markus-band h3 a { font-weight: inherit; }
.chatticus .markus-band :is(ul, ol) { margin: 0; padding: 0; list-style: none; }

/* head grids: badge and lede on one side, a display heading on the other */
.chatticus .markus-band[data-layout$="-head"], .chatticus .markus-band[data-layout="faq"] { padding-bottom: 0; }
.chatticus .markus-band[data-layout$="-head"] .markus-columns { gap: 2.5rem; align-items: end; }
@media (min-width: 64rem) {
  .chatticus .markus-band[data-layout$="-head"] .markus-columns:not([data-count="1"]) { grid-template-columns: var(--head-columns, 0.8fr 1.2fr); }
}
.chatticus .markus-band[data-layout$="-head"] .markus-column:first-child p:has(> strong:only-child),
.chatticus .markus-band[data-layout="faq"] .markus-column:first-child p:has(> strong:only-child) {
  display: inline-flex; align-items: center; margin: 0; padding: 0.25rem 0.75rem; border-radius: 9999px; background: var(--surface-2);
  font-family: var(--font-mono); font-size: 0.68rem; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--surface-foreground);
}
.chatticus .markus-band[data-layout$="-head"] .markus-column:first-child p:not(:has(> strong:only-child)) { margin-top: 2rem; }
.chatticus .markus-band[data-layout$="-head"] .markus-column:first-child h2 { margin-top: 1.75rem; }
.chatticus .markus-band[data-layout$="-head"] .markus-column p:not([class]) { max-width: 32rem; }

/* ------------------------------------------------------------------ hero */

.chatticus .markus-band[data-layout="hero"] {
  position: relative; overflow: hidden; padding-block: 3.5rem 3.5rem;
  background-color: var(--surface-0);
  background-image:
    linear-gradient(rgb(17 19 15 / 0.033) 1px, transparent 1px), linear-gradient(90deg, rgb(17 19 15 / 0.033) 1px, transparent 1px),
    radial-gradient(circle at 75% 30%, rgb(184 243 74 / 0.108), transparent 28%), radial-gradient(circle at 13% 78%, rgb(79 113 255 / 0.054), transparent 20%);
  background-size: 42px 42px, 42px 42px, 100% 100%, 100% 100%;
}
@media (prefers-color-scheme: dark) { .chatticus .markus-band[data-layout="hero"] { background-image: radial-gradient(circle at 75% 30%, rgb(184 243 74 / 0.108), transparent 28%), radial-gradient(circle at 13% 78%, rgb(79 113 255 / 0.054), transparent 20%); background-size: 100% 100%; } }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="hero"] { padding-block: 4rem; } }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="hero"] { padding-block: 5rem; } }
.chatticus .markus-band[data-layout="hero"] .markus-columns { gap: 3rem; align-items: center; }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="hero"] .markus-columns { grid-template-columns: 1.35fr 0.65fr; gap: 2.5rem; } }
.chatticus .markus-band[data-layout="hero"] .markus-column:first-child { max-width: 64rem; display: grid; grid-template-columns: 1fr; gap: 1rem; align-content: start; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="hero"] .markus-column:first-child { grid-template-columns: auto minmax(0, 1fr); } .chatticus .markus-band[data-layout="hero"] .markus-column:first-child > :not(.papyrus-island) { grid-column: 2; } .chatticus .markus-band[data-layout="hero"] .papyrus-island[data-island="Mark"] { grid-column: 1; grid-row: 1 / span 3; align-self: start; } }
.chatticus .markus-band[data-layout="hero"] .papyrus-island[data-island="Mark"] { margin-top: -29px; }
.chatticus .markus-band[data-layout="hero"] h1 {
  max-width: none; font-weight: 500; font-size: clamp(3.4rem, 7.6vw, 7.2rem); line-height: 0.82; letter-spacing: -0.075em; color: var(--surface-foreground);
}
.chatticus .markus-band[data-layout="hero"] h1 em { color: var(--clay); }
.chatticus .markus-band[data-layout="hero"] h1 em:last-child { position: relative; display: inline-block; }
.chatticus .markus-band[data-layout="hero"] h1 em strong { color: var(--surface-foreground); font-weight: inherit; }
.chatticus .markus-band[data-layout="hero"] h1 em:last-child::after {
  content: ""; position: absolute; left: 0; bottom: -0.75rem; width: 100%; height: 1rem; color: var(--signal); background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 560 24' preserveAspectRatio='none'%3E%3Cpath d='M4 14C123 2 274 23 556 8' fill='none' stroke='black' stroke-width='8' stroke-linecap='round'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 560 24' preserveAspectRatio='none'%3E%3Cpath d='M4 14C123 2 274 23 556 8' fill='none' stroke='black' stroke-width='8' stroke-linecap='round'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
}
.chatticus .markus-band[data-layout="hero"] h1 + p:not([class]) { max-width: 42rem; margin-top: 2.5rem; font-size: 1.125rem; line-height: 1.625; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="hero"] h1 + p:not([class]) { font-size: 1.25rem; line-height: 1.75rem; } }
.chatticus .markus-band[data-layout="hero"] p strong {
  padding: 0 0.125rem; background: linear-gradient(var(--signal), var(--signal)) 0 88% / 100% 88% no-repeat; color: var(--ink);
  animation: chat-sweep 650ms cubic-bezier(0.4, 0, 0.2, 1) both;
}
.chatticus .markus-band[data-layout="hero"] p strong:nth-of-type(1) { animation-delay: 2200ms; }
.chatticus .markus-band[data-layout="hero"] p strong:nth-of-type(2) { animation-delay: 4200ms; }
@keyframes chat-sweep { 0% { background-size: 0% 88%; color: var(--ink-soft); } 100% { background-size: 100% 88%; color: var(--ink); } }
@media (prefers-reduced-motion: reduce) { .chatticus .markus-band[data-layout="hero"] p strong { animation: none; } }
.chatticus .markus-band[data-layout="hero"] .markus-actions { margin-top: 2.25rem; }
.chatticus .markus-band[data-layout="hero"] .markus-column + .markus-column { align-self: center; }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="hero"] .markus-column + .markus-column { padding-left: 0.75rem; } }

/* the proof strip */
.chatticus .markus-band[data-layout="proof"] { padding: 0.75rem var(--page-pad); background: var(--surface-1); }
.chatticus .markus-band[data-layout="proof"] .markus-columns { gap: 0.5rem; }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="proof"] .markus-columns { grid-template-columns: repeat(3, 1fr); } }
.chatticus .markus-band[data-layout="proof"] .markus-column[data-panel="card"] { display: flex; align-items: center; gap: 1rem; padding: 1rem; border-radius: 1rem; background: var(--surface-2); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="proof"] .markus-column[data-panel="card"] { padding-inline: 1.5rem; } }
.chatticus .markus-band[data-layout="proof"] p { margin: 0; }
.chatticus .markus-band[data-layout="proof"] p:first-child { font-family: var(--font-display); font-size: 1.5rem; font-weight: 600; letter-spacing: -0.04em; line-height: 2rem; color: var(--surface-foreground); }
.chatticus .markus-band[data-layout="proof"] p:last-child { font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.1em; line-height: 1.625; text-transform: uppercase; color: var(--ink-soft); max-width: none; }

/* ------------------------------------------------------------------ organization (dark) */

.chatticus .markus-band[data-layout^="organization"] { background: var(--ink); color: var(--paper); }
.chatticus .markus-band[data-layout="organization-head"] { --head-columns: 0.82fr 1.18fr; }
.chatticus .markus-band[data-layout="organization-head"] h2 { font-size: clamp(3.5rem, 7vw, 7.6rem); line-height: 0.88; color: var(--paper); }
.chatticus .markus-band[data-layout="organization-head"] h2 em { display: block; color: var(--signal); }
.chatticus .markus-band[data-layout="organization-head"] .markus-column:first-child p:has(> strong:only-child) { background: var(--signal); color: var(--ink); }
.chatticus .markus-band[data-layout="organization-head"] .markus-column:first-child p:not(:has(> strong:only-child)) {
  max-width: 28rem; font-family: var(--font-mono); font-size: 0.7rem; line-height: 1.625; letter-spacing: 0.15em; text-transform: uppercase; color: rgb(242 239 231 / 0.55);
}
.chatticus .markus-band[data-layout="organization-head"] .markus-columns { padding-bottom: 4rem; }
.chatticus .markus-band[data-layout="organization-cards"] { padding-block: 4rem 0; }
.chatticus .markus-band[data-layout="organization-cards"] .markus-columns { grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 48rem) { .chatticus .markus-band[data-layout="organization-cards"] .markus-columns { grid-template-columns: repeat(2, 1fr); } }
.chatticus .markus-band[data-layout="organization-cards"] .markus-column[data-panel="card"] {
  display: grid; grid-template-columns: 1fr auto; align-content: start; padding: 1.75rem; border-radius: 1.5rem; background: none; color: var(--paper);
}
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="organization-cards"] .markus-column[data-panel="card"] { padding: 2.25rem; } }
@media (min-width: 48rem) { .chatticus .markus-band[data-layout="organization-cards"] .markus-column[data-panel="card"]:is(:nth-child(2), :nth-child(5)) { min-height: 27rem; } }
.chatticus .markus-band[data-layout="organization-cards"] .markus-column > * { grid-column: 1 / -1; }
.chatticus .markus-band[data-layout="organization-cards"] .markus-column > p:first-child { grid-column: 1; margin: 0; font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.15em; text-transform: uppercase; color: rgb(242 239 231 / 0.5); max-width: none; }
.chatticus .markus-band[data-layout="organization-cards"] h3 { grid-column: 1; margin-top: 3.5rem; max-width: 28rem; font-size: 1.875rem; line-height: 2.25rem; letter-spacing: -0.04em; color: var(--paper); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="organization-cards"] h3 { font-size: 2.25rem; line-height: 2.5rem; } }
.chatticus .markus-band[data-layout="organization-cards"] h3 + p { max-width: 32rem; margin: 2rem 0 0; font-size: 1rem; line-height: 1.625; color: rgb(242 239 231 / 0.65); }
.chatticus .markus-column[data-panel="card"]::before, .chatticus .markus-column[data-panel="card"]::after { content: none; }
.chatticus .markus-band[data-layout="organization-cards"] .markus-column[data-panel="card"]::before,
.chatticus .markus-band[data-layout="organization-cards"] .markus-column[data-panel="card"]::after { content: ""; grid-column: 2; grid-row: 1 / span 2; width: 3rem; height: 3rem; justify-self: end; }
.chatticus .markus-band[data-layout="organization-cards"] .markus-column[data-panel="card"]::before { border-radius: 9999px; background: var(--accent); }
.chatticus .markus-band[data-layout="organization-cards"] .markus-column[data-panel="card"]::after { background: var(--ink); -webkit-mask: var(--glyph) center / 1.25rem no-repeat; mask: var(--glyph) center / 1.25rem no-repeat; }
.chatticus .markus-band[data-layout="organization-cards"] .markus-column:nth-child(2) { --accent: var(--cobalt); --glyph: var(--icon-brain-circuit); }
.chatticus .markus-band[data-layout="organization-cards"] .markus-column:nth-child(3) { --accent: var(--sea); --glyph: var(--icon-hard-drive); }
.chatticus .markus-band[data-layout="organization-cards"] .markus-column:nth-child(4) { --accent: var(--clay); --glyph: var(--icon-shield-check); }
.chatticus .markus-band[data-layout="organization-cards"] .markus-column:nth-child(5) { --accent: var(--amber); --glyph: var(--icon-clock-3); }
.chatticus .markus-band[data-layout="organization-cards"] .markus-column > p:last-child {
  display: flex; align-items: center; gap: 0.75rem; margin: 2rem 0 0; max-width: none; font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.12em; line-height: 1rem; text-transform: uppercase; color: rgb(242 239 231 / 0.55);
}
.chatticus .markus-band[data-layout="organization-cards"] .markus-column > p:last-child > em:first-child::before { content: ""; display: inline-block; width: 0.5rem; height: 0.5rem; margin-right: 0.75rem; border-radius: 9999px; background: var(--accent); }
.chatticus .markus-band[data-layout="organization-cards"] .markus-column > p:last-child > em:nth-child(2),
.chatticus .markus-band[data-layout="control-list"] .markus-column > p:nth-child(2) > em:nth-child(2),
.chatticus .markus-band[data-layout="pricing"] .markus-column > p:has(> em:only-child),
.chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:has(> em:only-child),
.chatticus .markus-band[data-layout="ledger"] li em {
  flex: none; padding: 0.25rem 0.75rem; border: 1px solid color-mix(in srgb, var(--ink) 20%, transparent); border-radius: 9999px;
  font-family: var(--font-display); font-size: 0.75rem; font-style: normal; font-weight: 600; letter-spacing: 0.08em; line-height: 1rem; text-transform: uppercase; color: var(--ink-soft);
}
.chatticus .markus-band[data-layout="organization-cards"] .markus-column > p:last-child > em:nth-child(2) { border-color: rgb(242 239 231 / 0.3); color: rgb(242 239 231 / 0.7); }

.chatticus .markus-band[data-layout="organization-room"] { padding-block: 7rem 6rem; }
.chatticus .markus-band[data-layout="organization-room"] .markus-columns { display: grid; gap: 2rem; align-items: center; padding: 3rem 2rem 2rem; border-radius: 1rem; background: transparent; }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="organization-room"] .markus-columns { grid-template-columns: 1fr 1.4fr; } }
.chatticus .markus-band[data-layout="organization-room"] h3 { display: flex; align-items: center; gap: 1rem; font-size: 1.875rem; letter-spacing: -0.04em; line-height: 2.25rem; color: var(--paper); }
.chatticus .markus-band[data-layout="organization-room"] h3::before { content: ""; width: 2rem; height: 2rem; background: var(--signal); -webkit-mask: var(--icon-users-round) center / contain no-repeat; mask: var(--icon-users-round) center / contain no-repeat; }
.chatticus .markus-band[data-layout="organization-room"] p:not([class]) { max-width: 48rem; margin: 0; font-size: 1.125rem; line-height: 1.75rem; color: rgb(242 239 231 / 0.68); }

/* ------------------------------------------------------------------ four controls */

.chatticus .markus-band[data-layout="control-head"] { --head-columns: 0.8fr 1.2fr; }
.chatticus .markus-band[data-layout="control-head"] h2 { font-size: clamp(3.6rem, 7vw, 7.2rem); line-height: 0.87; }
.chatticus .markus-band[data-layout="control-head"] h2 em { display: block; color: var(--clay); }
.chatticus .markus-band[data-layout="control-head"] .markus-column:first-child p:has(> strong:only-child) { background: none; }
.chatticus .markus-band[data-layout="control-head"] .markus-column:first-child p:not(:has(> strong:only-child)) { max-width: 32rem; font-size: 1.125rem; line-height: 1.625; }
.chatticus .markus-band[data-layout="control-list"] { padding-block: 4rem 6rem; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="control-list"] { padding-bottom: 8rem; } }
.chatticus .markus-band[data-layout="control-list"] .markus-columns { grid-template-columns: 1fr; gap: 0.75rem; }
.chatticus .markus-band[data-layout="control-list"] .markus-column[data-panel="card"] {
  display: grid; grid-template-columns: 1fr auto; gap: 1.75rem; align-items: center; padding: 1.5rem; border-radius: 1rem; background: var(--surface-1);
}
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="control-list"] .markus-column[data-panel="card"] { padding: 2rem; } }
@media (min-width: 64rem) {
  .chatticus .markus-band[data-layout="control-list"] .markus-column[data-panel="card"] { grid-template-columns: 7rem 1fr 1.1fr auto; grid-template-rows: auto auto; column-gap: 1.75rem; row-gap: 0.75rem; }
  .chatticus .markus-band[data-layout="control-list"] .markus-column > p:nth-child(1) { grid-column: 1; grid-row: 1; align-self: start; }
  .chatticus .markus-band[data-layout="control-list"] .markus-column[data-panel="card"]::before { grid-column: 1; grid-row: 2; }
  .chatticus .markus-band[data-layout="control-list"] .markus-column > p:nth-child(2) { grid-column: 2; grid-row: 1; align-self: end; }
  .chatticus .markus-band[data-layout="control-list"] .markus-column > h3 { grid-column: 2; grid-row: 2; align-self: start; }
  .chatticus .markus-band[data-layout="control-list"] .markus-column > p:nth-child(4) { grid-column: 3; grid-row: 1 / span 2; }
  .chatticus .markus-band[data-layout="control-list"] .markus-column > p:nth-child(5) { grid-column: 4; grid-row: 1 / span 2; }
}
.chatticus .markus-band[data-layout="control-list"] :where(.markus-column) > p { margin: 0; max-width: none; }
.chatticus .markus-band[data-layout="control-list"] .markus-column > p:nth-child(1) { font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.14em; color: var(--clay); }
.chatticus .markus-band[data-layout="control-list"] .markus-column > p:nth-child(2) { display: flex; align-items: center; gap: 0.75rem; font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="control-list"] .markus-column > p:nth-child(2) > em { font-style: normal; }
.chatticus .markus-band[data-layout="control-list"] .markus-column > h3 { font-size: 1.875rem; line-height: 1; letter-spacing: -0.045em; margin-top: 0.75rem; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="control-list"] .markus-column > h3 { font-size: 2.25rem; } }
.chatticus .markus-band[data-layout="control-list"] .markus-column > p:nth-child(4) { max-width: 36rem; font-size: 1rem; line-height: 1.625; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="control-list"] .markus-column > p:nth-child(5) {
  justify-self: start; display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border-radius: 9999px; background: var(--surface-2);
  font-family: var(--font-mono); font-size: 0.58rem; letter-spacing: 0.1em; line-height: 1rem; text-transform: uppercase; color: var(--surface-foreground);
}
.chatticus .markus-band[data-layout="control-list"] .markus-column > p:nth-child(5) > em { font-style: normal; display: inline-flex; align-items: center; gap: 0.5rem; }
.chatticus .markus-band[data-layout="control-list"] .markus-column > p:nth-child(5) > em::before { content: ""; width: 0.875rem; height: 0.875rem; background: var(--cobalt); -webkit-mask: var(--icon-play) center / contain no-repeat; mask: var(--icon-play) center / contain no-repeat; }
.chatticus .markus-band[data-layout="control-list"] .markus-column:nth-child(5) > p:nth-child(5) > em::before { background: var(--clay); -webkit-mask-image: var(--icon-circle-check-big); mask-image: var(--icon-circle-check-big); }
.chatticus .markus-band[data-layout="control-list"] .markus-column[data-panel="card"]::before { content: ""; width: 1.5rem; height: 1.5rem; background: var(--ink); -webkit-mask: var(--glyph) center / contain no-repeat; mask: var(--glyph) center / contain no-repeat; }
.chatticus .markus-band[data-layout="control-list"] .markus-column:nth-child(2) { --glyph: var(--icon-wrench); }
.chatticus .markus-band[data-layout="control-list"] .markus-column:nth-child(3) { --glyph: var(--icon-alarm-clock); }
.chatticus .markus-band[data-layout="control-list"] .markus-column:nth-child(4) { --glyph: var(--icon-book-open-check); }
.chatticus .markus-band[data-layout="control-list"] .markus-column:nth-child(5) { --glyph: var(--icon-hand); }
@media (prefers-color-scheme: dark) { .chatticus .markus-band[data-layout="control-list"] .markus-column[data-panel="card"]::before { background: var(--paper); } }

/* ------------------------------------------------------------------ worked examples */

.chatticus .markus-band[data-layout="examples-head"] { --head-columns: 0.85fr 1.15fr; background: var(--surface-1); }
.chatticus .markus-band[data-layout="examples-head"] h2 em { display: block; color: var(--clay); }
.chatticus .markus-band[data-layout="examples-head"] h2 { font-size: clamp(3.4rem, 6.6vw, 6.6rem); line-height: 0.88; }
.chatticus .markus-band[data-layout="examples"] { padding-block: 4rem 6rem; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="examples"] { padding-bottom: 8rem; } }
.chatticus .markus-band[data-layout="examples"] .markus-columns { grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="examples"] .markus-columns { grid-template-columns: repeat(3, 1fr); } }
.chatticus .markus-band[data-layout="examples"] .markus-column[data-panel="card"] { position: relative; display: flex; flex-direction: column; padding: 1.75rem; border-radius: 1rem; background: var(--surface-0); transition: background-color 0.2s; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="examples"] .markus-column[data-panel="card"] { padding: 2rem; } }
.chatticus .markus-band[data-layout="examples"] :where(.markus-column) > p { margin: 0; max-width: none; }
.chatticus .markus-band[data-layout="examples"] .markus-column > p:first-child { font-size: 0.875rem; font-weight: 600; line-height: 1.25rem; color: var(--ink); }
.chatticus .markus-band[data-layout="examples"] .markus-column > p:nth-child(2) { margin-top: 0.5rem; font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.14em; line-height: 1rem; text-transform: uppercase; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="examples"] .markus-column > p:nth-child(2) em { font-style: normal; }
.chatticus .markus-band[data-layout="examples"] h3 { margin-top: 3rem; font-size: 1.875rem; line-height: 1; letter-spacing: -0.045em; }
.chatticus .markus-band[data-layout="examples"] h3 a { color: var(--ink); text-decoration: none; }
.chatticus .markus-band[data-layout="examples"] h3 a::after { content: ""; position: absolute; inset: 0; border-radius: 1rem; }
.chatticus .markus-band[data-layout="examples"] h3 a:focus-visible::after { box-shadow: 0 0 0 4px rgb(79 113 255 / 0.25); }
.chatticus .markus-band[data-layout="examples"] h3 + p { flex: 1; margin-top: 1.25rem; font-size: 1rem; line-height: 1.625; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="examples"] ul { display: flex; flex-wrap: wrap; gap: 0.375rem; margin-top: 1.5rem; }
.chatticus .markus-band[data-layout="examples"] li { padding: 0.375rem 0.75rem; border-radius: 9999px; background: var(--surface-2); font-family: var(--font-mono); font-size: 0.58rem; letter-spacing: 0.1em; line-height: 1rem; text-transform: uppercase; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="examples"] ul + p { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: 2rem; font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink); }
.chatticus .markus-band[data-layout="examples"] ul + p::after { content: ""; width: 1rem; height: 1rem; background: currentColor; -webkit-mask: var(--arrow-up-right) center / contain no-repeat; mask: var(--arrow-up-right) center / contain no-repeat; }

/* ------------------------------------------------------------------ control and access */

.chatticus .markus-band[data-layout^="evidence"] { background: var(--clay); color: var(--ink); }
.chatticus .markus-band[data-layout="evidence-head"] { --head-columns: 1.1fr 0.9fr; }
.chatticus .markus-band[data-layout="evidence-head"] h2 { max-width: 56rem; font-size: clamp(4rem, 8vw, 8rem); line-height: 0.84; letter-spacing: -0.07em; color: var(--ink); }
.chatticus .markus-band[data-layout="evidence-head"] .markus-column:first-child p:has(> strong:only-child) { background: var(--ink); color: var(--paper); }
.chatticus .markus-band[data-layout="evidence-head"] .markus-column + .markus-column { max-width: 36rem; justify-self: end; }
.chatticus .markus-band[data-layout="evidence-head"] .markus-column + .markus-column p { max-width: none; margin: 0; color: var(--ink); }
.chatticus .markus-band[data-layout="evidence-head"] .markus-column + .markus-column p:is(:nth-child(1), :nth-child(2)) { font-family: var(--font-display); font-size: 1.875rem; line-height: 1.2; letter-spacing: -0.035em; }
.chatticus .markus-band[data-layout="evidence-head"] .markus-column + .markus-column p:nth-child(1) a { text-decoration-thickness: 2px; }
.chatticus .markus-band[data-layout="evidence-head"] .markus-column + .markus-column p:nth-child(2) { margin-top: 1.25rem; }
.chatticus .markus-band[data-layout="evidence-head"] .markus-column + .markus-column p:nth-child(3) { margin-top: 1.25rem; font-size: 1rem; line-height: 1.625; color: color-mix(in srgb, var(--ink) 75%, transparent); }
.chatticus .markus-band[data-layout="evidence-head"] .markus-column + .markus-column p:nth-child(4) { margin-top: 1.25rem; }
.chatticus .markus-band[data-layout="evidence-head"] .markus-column + .markus-column p:nth-child(4) a, .chatticus .markus-band[data-layout="evidence-cards"] .markus-column > p:last-child a {
  display: inline-flex; align-items: center; gap: 0.5rem; min-height: 2.75rem; font-family: var(--font-mono); font-size: 0.65rem; font-weight: 400; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink);
}
.chatticus .markus-band[data-layout="evidence-head"] .markus-column + .markus-column p:nth-child(4) a::after, .chatticus .markus-band[data-layout="evidence-cards"] .markus-column > p:last-child a::after { content: ""; width: 1rem; height: 1rem; background: currentColor; -webkit-mask: var(--arrow-up-right) center / contain no-repeat; mask: var(--arrow-up-right) center / contain no-repeat; }
.chatticus .markus-band[data-layout="evidence-cards"] { padding-block: 4rem 6rem; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="evidence-cards"] { padding-bottom: 8rem; } }
.chatticus .markus-band[data-layout="evidence-cards"] .markus-columns { grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="evidence-cards"] .markus-columns { grid-template-columns: repeat(3, 1fr); } }
.chatticus .markus-band[data-layout="evidence-cards"] .markus-column[data-panel="card"] {
  position: relative; display: flex; flex-direction: column; padding: 1.75rem; border-radius: 1.5rem; background: var(--paper); color: var(--ink); box-shadow: 5px 5px 0 var(--ink); transition: transform 0.2s, box-shadow 0.2s;
}
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="evidence-cards"] .markus-column[data-panel="card"] { padding: 2rem; } }
.chatticus .markus-band[data-layout="evidence-cards"] .markus-column[data-panel="card"]:hover { transform: translateY(-0.25rem); box-shadow: 8px 8px 0 var(--ink); }
.chatticus .markus-band[data-layout="evidence-cards"] .markus-column > p:first-child { display: flex; align-items: center; justify-content: space-between; margin: 0; max-width: none; }
.chatticus .markus-band[data-layout="evidence-cards"] .markus-column > p:first-child strong { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border-radius: 9999px; background: var(--signal); font-size: 0.875rem; font-weight: 700; color: var(--ink); }
.chatticus .markus-band[data-layout="evidence-cards"] .markus-column > p:first-child::after { content: ""; width: 1.25rem; height: 1.25rem; background: var(--ink); -webkit-mask: var(--glyph) center / contain no-repeat; mask: var(--glyph) center / contain no-repeat; }
.chatticus .markus-band[data-layout="evidence-cards"] .markus-column:nth-child(2) { --glyph: var(--icon-git-branch); }
.chatticus .markus-band[data-layout="evidence-cards"] .markus-column:nth-child(3) { --glyph: var(--icon-boxes); }
.chatticus .markus-band[data-layout="evidence-cards"] .markus-column:nth-child(4) { --glyph: var(--icon-shield-check); }
.chatticus .markus-band[data-layout="evidence-cards"] h3 { margin-top: 3rem; font-size: 1.875rem; line-height: 1; letter-spacing: -0.045em; }
.chatticus .markus-band[data-layout="evidence-cards"] h3 + p { flex: 1; margin: 1.25rem 0 0; max-width: none; font-size: 1rem; line-height: 1.625; color: #3f463d; }
.chatticus .markus-band[data-layout="evidence-cards"] .markus-column > p:last-child { margin: 2rem 0 0; padding-top: 1rem; }

/* ------------------------------------------------------------------ ledger and reading */

.chatticus .markus-band[data-layout="ledger-head"] { --head-columns: 0.85fr 1.15fr; background: var(--surface-1); }
.chatticus .markus-band[data-layout="ledger-head"] h2 { font-size: clamp(3.7rem, 7vw, 7rem); line-height: 0.86; }
.chatticus .markus-band[data-layout="ledger-head"] .markus-column + .markus-column { justify-self: end; }
.chatticus .markus-band[data-layout="ledger-head"] .markus-column + .markus-column p { max-width: 42rem; }
.chatticus .markus-band[data-layout="ledger"], .chatticus .markus-band[data-layout="reading"] { background: var(--surface-1); }
.chatticus .markus-band[data-layout="ledger"] { padding-block: 4rem 0; }
.chatticus .markus-band[data-layout="ledger"] .markus-columns { grid-template-columns: 1fr; gap: 0.75rem; }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="ledger"] .markus-columns { grid-template-columns: repeat(3, 1fr); } }
.chatticus .markus-band[data-layout="ledger"] .markus-column[data-panel="card"] { position: relative; padding: 1.5rem; border-radius: 1rem; background: var(--surface-0); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="ledger"] .markus-column[data-panel="card"] { padding: 2rem; } }
.chatticus .markus-band[data-layout="ledger"] .markus-column > p:first-child { margin: 0; font-family: var(--font-mono); font-size: 0.67rem; letter-spacing: 0.13em; line-height: 1rem; text-transform: uppercase; color: var(--surface-foreground); max-width: none; }
.chatticus .markus-band[data-layout="ledger"] .markus-column > p:first-child em { font-style: normal; }
.chatticus .markus-band[data-layout="ledger"] .markus-column[data-panel="card"]::before, .chatticus .markus-band[data-layout="ledger"] .markus-column[data-panel="card"]::after { content: ""; position: absolute; top: 1.5rem; right: 1.5rem; width: 2.5rem; height: 2.5rem; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="ledger"] .markus-column[data-panel="card"]::before, .chatticus .markus-band[data-layout="ledger"] .markus-column[data-panel="card"]::after { top: 2rem; right: 2rem; } }
.chatticus .markus-band[data-layout="ledger"] .markus-column[data-panel="card"]::before { border-radius: 9999px; background: var(--accent); }
.chatticus .markus-band[data-layout="ledger"] .markus-column[data-panel="card"]::after { background: var(--ink); -webkit-mask: var(--glyph) center / 1rem no-repeat; mask: var(--glyph) center / 1rem no-repeat; }
.chatticus .markus-band[data-layout="ledger"] .markus-column:nth-child(2) { --accent: var(--signal); --glyph: var(--icon-users-round); }
.chatticus .markus-band[data-layout="ledger"] .markus-column:nth-child(3) { --accent: var(--sea); --glyph: var(--icon-hard-drive); }
.chatticus .markus-band[data-layout="ledger"] .markus-column:nth-child(4) { --accent: var(--amber); --glyph: var(--icon-shield-check); }
.chatticus .markus-band[data-layout="ledger"] ul { display: grid; gap: 0.75rem; margin-top: 4rem; }
.chatticus .markus-band[data-layout="ledger"] li { font-size: 0.875rem; line-height: 1.625; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="ledger"] li em { margin-left: 0.5rem; vertical-align: middle; }
.chatticus .markus-band[data-layout="reading"] { padding-block: 5rem 6rem; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="reading"] { padding-bottom: 8rem; } }
.chatticus .markus-band[data-layout="reading"] .markus-columns { gap: 2.5rem; padding: 1.5rem; border-radius: 1rem; background: var(--surface-0); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="reading"] .markus-columns { padding: 2rem; } }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="reading"] .markus-columns { grid-template-columns: 0.7fr 1.3fr; } }
.chatticus .markus-band[data-layout="reading"] .markus-column:first-child p:first-child { margin: 0; font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="reading"] .markus-column:first-child p:first-child em { font-style: normal; }
.chatticus .markus-band[data-layout="reading"] .markus-column:first-child p:nth-child(2) { max-width: 24rem; margin: 1.25rem 0 0; font-family: var(--font-display); font-size: 1.875rem; line-height: 1.25; letter-spacing: -0.04em; color: var(--ink); }
.chatticus .markus-band[data-layout="reading"] .markus-column + .markus-column { display: grid; gap: 0.375rem; align-content: start; }
.chatticus .markus-band[data-layout="reading"] .markus-column + .markus-column p { margin: 0; max-width: none; }
.chatticus .markus-band[data-layout="reading"] .markus-column + .markus-column a {
  display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; min-height: 4rem; padding: 1rem 0.75rem; border-radius: 0.75rem;
  font-family: var(--font-display); font-size: 1.25rem; font-weight: 400; letter-spacing: -0.025em; line-height: 1.75rem; text-decoration: none; color: var(--ink);
}
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="reading"] .markus-column + .markus-column a { font-size: 1.5rem; line-height: 2rem; } }
.chatticus .markus-band[data-layout="reading"] .markus-column + .markus-column a::after { content: ""; flex: none; width: 1.25rem; height: 1.25rem; background: currentColor; -webkit-mask: var(--arrow-up-right) center / contain no-repeat; mask: var(--arrow-up-right) center / contain no-repeat; }

/* ------------------------------------------------------------------ pricing */

.chatticus .markus-band[data-layout="pricing-head"] { --head-columns: 0.8fr 1.2fr; background: var(--surface-1); }
.chatticus .markus-band[data-layout="pricing-head"] h2 { font-size: clamp(3.4rem, 6.4vw, 6.6rem); }
.chatticus .markus-band[data-layout="pricing"] { padding-block: 4rem 6rem; background: var(--surface-1); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="pricing"] { padding-bottom: 8rem; } }
.chatticus .markus-band[data-layout="pricing"] .markus-columns { grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 48rem) { .chatticus .markus-band[data-layout="pricing"] .markus-columns { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="pricing"] .markus-columns { grid-template-columns: repeat(4, 1fr); } }
.chatticus .markus-band[data-layout="pricing"] .markus-column[data-panel="card"], .chatticus .markus-band[data-layout="beta-offers"] .markus-column[data-panel="card"] {
  display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto 1fr; align-content: stretch; align-items: start; padding: 1.5rem; border-radius: 1rem; background: var(--surface-0);
}
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="pricing"] .markus-column[data-panel="card"] { padding: 1.75rem; } }
.chatticus .markus-band[data-layout="pricing"] :where(.markus-column) > *, .chatticus .markus-band[data-layout="beta-offers"] :where(.markus-column) > * { grid-column: 1 / -1; margin: 0; max-width: none; }
.chatticus .markus-band[data-layout="pricing"] .markus-column > h3, .chatticus .markus-band[data-layout="beta-offers"] .markus-column > h3 { grid-column: 1; grid-row: 1; font-size: 1.5rem; line-height: 1; letter-spacing: -0.04em; }
.chatticus .markus-band[data-layout="pricing"] .markus-column > p:has(> em:only-child), .chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:has(> em:only-child) { grid-column: 2; grid-row: 1; justify-self: end; }
.chatticus .markus-band[data-layout="pricing"] .markus-column > p:has(> em:only-child) em, .chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:has(> em:only-child) em { font-style: normal; }
.chatticus .markus-band[data-layout="pricing"] .markus-column > p, .chatticus .markus-band[data-layout="beta-offers"] .markus-column > p { font-size: 0.875rem; line-height: 1.25rem; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="pricing"] h3 + p:not(:has(> em)), .chatticus .markus-band[data-layout="pricing"] h3 + p:has(> em:only-child) + p {
  grid-row: 2; align-self: start; margin-top: 1.25rem; font-size: 1rem; line-height: 1.625;
}
.chatticus .markus-band[data-layout="pricing"] .markus-column > p:has(> strong) { margin-top: 2rem; display: block; font-size: 0.875rem; }
.chatticus .markus-band[data-layout="pricing"] .markus-column > p > strong, .chatticus .markus-band[data-layout="beta-offers"] .markus-column > p > strong:not(:only-child) { font-family: var(--font-display); font-size: 1.5rem; font-weight: 600; letter-spacing: -0.04em; line-height: 2rem; color: var(--surface-foreground); }
.chatticus .markus-band[data-layout="pricing"] .markus-column > p > strong + em, .chatticus .markus-band[data-layout="beta-offers"] .markus-column > p > strong + em { margin-left: 0.5rem; font-size: 0.875rem; font-style: normal; font-weight: 400; }
.chatticus .markus-band[data-layout="pricing"] .markus-column > p:has(> strong) ~ p:not(:has(> a)) { margin-top: 0.25rem; }
.chatticus .markus-band[data-layout="pricing"] .markus-column > p:has(> a) { margin-top: 1rem; }
.chatticus .markus-band[data-layout="pricing"] .markus-column > p > a, .chatticus .markus-band[data-layout="beta-offers"] .markus-column > p > a { color: var(--ink); font-size: 0.875rem; font-weight: 600; text-decoration-color: color-mix(in srgb, var(--ink) 30%, transparent); }
.chatticus .markus-band[data-layout="pricing"] .markus-column > p > a:hover { text-decoration-color: var(--ink); color: var(--ink); }

/* ------------------------------------------------------------------ FAQ */

.chatticus .markus-band[data-layout="faq"] { padding-bottom: 6rem; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="faq"] { padding-bottom: 8rem; } }
.chatticus .markus-band[data-layout="faq"] .markus-columns { gap: 3rem; align-items: start; }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="faq"] .markus-columns { grid-template-columns: 0.7fr 1.3fr; } }
.chatticus .markus-band[data-layout="faq"] .markus-column:first-child h2 { margin-top: 1.75rem; font-size: clamp(3.7rem, 6vw, 6.3rem); line-height: 0.86; }
.chatticus .markus-band[data-layout="faq"] .markus-column:first-child p:nth-of-type(2) { max-width: 28rem; margin: 1.75rem 0 0; font-size: 1rem; line-height: 1.625; }
.chatticus .markus-band[data-layout="faq"] .markus-column:first-child p:nth-of-type(n+3) { margin: 0; }
.chatticus .markus-band[data-layout="faq"] .markus-column:first-child p:nth-of-type(3) { margin-top: 1.5rem; }
.chatticus .markus-band[data-layout="faq"] .markus-column:first-child p a { display: inline-flex; align-items: center; min-height: 2.75rem; font-family: var(--font-mono); font-size: 0.65rem; font-weight: 400; letter-spacing: 0.12em; text-transform: uppercase; }
.chatticus .markus-band[data-layout="faq"] .markus-column + .markus-column { display: grid; gap: 0.5rem; align-content: start; }
.chatticus .markus-band[data-layout="faq"] .markus-details { margin: 0; padding: 0; border: 0; border-radius: 1rem; background: var(--surface-1); }
.chatticus .markus-band[data-layout="faq"] .markus-details > summary {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 5rem; padding: 0 1.25rem; cursor: pointer; list-style: none;
  font-family: var(--font-display); font-size: 1.125rem; font-weight: 400; color: var(--ink); text-align: left;
}
.chatticus .markus-band[data-layout="faq"] .markus-details > summary::-webkit-details-marker { display: none; }
.chatticus .markus-band[data-layout="faq"] .markus-details > summary::after { content: ""; flex: none; width: 1rem; height: 1rem; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 12h14M12 5v14'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 12h14M12 5v14'/%3E%3C/svg%3E") center / contain no-repeat; }
.chatticus .markus-band[data-layout="faq"] .markus-details[open] > summary::after { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E"); }
.chatticus .markus-band[data-layout="faq"] .markus-details-body { padding: 0 1.25rem 1.25rem; }
.chatticus .markus-band[data-layout="faq"] .markus-details-body p { max-width: none; margin: 0; font-size: 0.875rem; line-height: 1.625; color: var(--ink-soft); }

/* ------------------------------------------------------------------ closing call to action */

.chatticus .markus-band[data-layout="final"] { padding: 0.75rem; background: var(--signal); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="final"] { padding: 1.25rem; } }
.chatticus .markus-band[data-layout="final"] .markus-band-inner { position: relative; overflow: hidden; max-width: none; padding: 5rem 1.25rem; border-radius: 1.8rem; background: var(--ink); color: var(--paper); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="final"] .markus-band-inner { padding: 6rem 2.5rem; } }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="final"] .markus-band-inner { padding: 7rem 4rem; } }
.chatticus .markus-band[data-layout="final"] .markus-columns { position: relative; max-width: 82rem; margin: 0 auto; z-index: 1; }
.chatticus .markus-band[data-layout="final"] .markus-band-inner::before, .chatticus .markus-band[data-layout="final"] .markus-band-inner::after {
  content: ""; position: absolute; border-radius: 9999px; animation: chat-orbit 12s ease-in-out infinite alternate;
}
.chatticus .markus-band[data-layout="final"] .markus-band-inner::before { top: -5rem; right: -4rem; width: 20rem; height: 20rem; border: 1px solid rgb(255 212 0 / 0.3); }
.chatticus .markus-band[data-layout="final"] .markus-band-inner::after { bottom: -11rem; left: -5rem; width: 24rem; height: 24rem; border: 1px solid rgb(239 106 71 / 0.4); animation-delay: -2s; }
@keyframes chat-orbit { from { transform: translate3d(-10px, -8px, 0) scale(0.96); } to { transform: translate3d(14px, 12px, 0) scale(1.04); } }
@media (prefers-reduced-motion: reduce) { .chatticus .markus-band[data-layout="final"] .markus-band-inner::before, .chatticus .markus-band[data-layout="final"] .markus-band-inner::after { animation: none; } }
.chatticus .markus-band[data-layout="final"] h1 { max-width: 72rem; margin-top: 3.5rem; font-size: clamp(4.2rem, 9vw, 9rem); line-height: 0.8; letter-spacing: -0.075em; color: var(--paper); }
.chatticus .markus-band[data-layout="final"] h1 em { display: block; color: var(--signal); }
.chatticus .markus-band[data-layout="final"] h1 + p { max-width: 42rem; margin-top: 2.25rem; font-size: 1.125rem; line-height: 1.625; color: rgb(242 239 231 / 0.68); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="final"] h1 + p { font-size: 1.25rem; line-height: 1.75rem; } }
.chatticus .markus-band[data-layout="final"] .markus-button[data-variant="secondary"] { background: transparent; color: var(--paper); }
.chatticus .markus-band[data-layout="final"] a.markus-button[data-variant="secondary"] { color: var(--paper); }
.chatticus .markus-band[data-layout="final"] .markus-button[data-variant="secondary"]:hover, .chatticus .markus-band[data-layout="final"] a.markus-button[data-variant="secondary"]:hover { background: var(--paper); color: var(--ink); }
.chatticus .markus-band[data-layout="final"] .markus-actions + p { margin-top: 4rem; padding: 1rem 1.25rem; max-width: none; font-family: var(--font-mono); font-size: 0.64rem; letter-spacing: 0.12em; line-height: 1.5; text-transform: uppercase; color: rgb(242 239 231 / 0.55); }
.chatticus .chat-wordmark--inverse { color: var(--paper); }
.chatticus .papyrus-island .chat-wordmark { font-size: 1.05rem; font-weight: 800; letter-spacing: -0.055em; }

/* ------------------------------------------------------------------ worked-example pages */

.chatticus .markus-band[data-layout="example-head"], .chatticus .markus-band[data-layout="beta-pricing-head"] { padding-block: 5rem; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="example-head"], .chatticus .markus-band[data-layout="beta-pricing-head"] { padding-block: 7rem; } }
.chatticus .markus-band[data-layout="example-head"] .markus-band-eyebrow { background: var(--surface-2); margin-bottom: 0; }
.chatticus .markus-band[data-layout="example-head"] h1 { margin-top: 1.75rem; }
.chatticus .markus-band[data-layout="example-head"] h1 + p:not([class]) { margin-top: 1.5rem; font-size: 1rem; line-height: 1.5rem; font-weight: 600; color: var(--ink); }
.chatticus .markus-band[data-layout="example-head"] p:nth-of-type(2) { margin: 0.75rem 0 0; font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.14em; line-height: 1rem; text-transform: uppercase; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="example-head"] p:nth-of-type(3) { max-width: 42rem; margin: 2rem 0 0; font-size: 1.125rem; line-height: 1.625; }
.chatticus .markus-band[data-layout="roster"], .chatticus .markus-band[data-layout="beats"], .chatticus .markus-band[data-layout="human"], .chatticus .markus-band[data-layout="more"] { padding-block: 5rem; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="roster"], .chatticus .markus-band[data-layout="beats"], .chatticus .markus-band[data-layout="human"] { padding-block: 7rem; } }
.chatticus .markus-band[data-layout="more"] { padding-block: 4rem; }
.chatticus .markus-band[data-layout="roster"] .markus-band-eyebrow { margin-bottom: 1.75rem; }
.chatticus .markus-band[data-layout="roster"] h2, .chatticus .markus-band[data-layout="beats"] h2 { max-width: 42rem; font-size: clamp(2.4rem, 5vw, 4rem); line-height: 0.95; letter-spacing: -0.05em; }
.chatticus .markus-band[data-layout="roster"] .markus-columns, .chatticus .markus-band[data-layout="beats"] .markus-columns { grid-template-columns: 1fr; gap: 0.75rem; counter-reset: desk; }
.chatticus .markus-band[data-layout="roster"] .markus-column:first-child, .chatticus .markus-band[data-layout="beats"] .markus-column:first-child { margin-bottom: 1.25rem; }
@media (min-width: 48rem) { .chatticus .markus-band[data-layout="beats"] .markus-columns { grid-template-columns: repeat(2, 1fr); } .chatticus .markus-band[data-layout="beats"] .markus-column:first-child { grid-column: 1 / -1; } }
.chatticus .markus-band[data-layout="roster"] .markus-column[data-panel="card"] { display: grid; gap: 1.25rem; align-items: center; padding: 1.5rem; border-radius: 1rem; background: var(--surface-0); counter-increment: desk; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="roster"] .markus-column[data-panel="card"] { padding: 2rem; } }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="roster"] .markus-column[data-panel="card"] { grid-template-columns: 5rem 1fr 1.4fr; } }
.chatticus .markus-band[data-layout="roster"] .markus-column[data-panel="card"]::before { content: "0" counter(desk); font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--clay); }
.chatticus .markus-band[data-layout="roster"] .markus-column h3 { font-size: 1.5rem; line-height: 1; letter-spacing: -0.04em; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="roster"] .markus-column h3 { font-size: 1.875rem; } }
.chatticus .markus-band[data-layout="roster"] .markus-column p { max-width: 36rem; margin: 0; font-size: 1rem; line-height: 1.625; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="beats"] .markus-column[data-panel="card"] { padding: 1.5rem; border-radius: 1rem; background: var(--surface-1); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="beats"] .markus-column[data-panel="card"] { padding: 2rem; } }
.chatticus .markus-band[data-layout="beats"] .markus-column p:first-child { margin: 0; font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.14em; line-height: 1rem; text-transform: uppercase; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="beats"] .markus-column p:nth-child(2) { margin: 1.25rem 0 0; max-width: none; font-size: 1rem; line-height: 1.625; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="human"] { background: var(--ink); color: var(--paper); }
.chatticus .markus-band[data-layout="human"] .markus-band-eyebrow { margin-bottom: 2rem; padding: 0.25rem 0.75rem; border-radius: 9999px; background: var(--signal); color: var(--ink); }
.chatticus .markus-band[data-layout="human"] p:not([class]) { max-width: 48rem; margin: 0; font-family: var(--font-display); font-size: 1.875rem; line-height: 1.25; letter-spacing: -0.04em; color: var(--paper); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="human"] p:not([class]) { font-size: 2.25rem; line-height: 2.5rem; } }
.chatticus .markus-band[data-layout="human"] .markus-actions { margin-top: 2.5rem; }
.chatticus .markus-band[data-layout="human"] .markus-button[data-variant="secondary"] { background: transparent; color: var(--paper); }
.chatticus .markus-band[data-layout="human"] a.markus-button[data-variant="secondary"] { color: var(--paper); }
.chatticus .markus-band[data-layout="human"] a.markus-button[data-variant="secondary"]:hover { background: var(--paper); color: var(--ink); }
.chatticus .markus-band[data-layout="more"] p:first-child { margin: 0; font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); max-width: none; }
.chatticus .markus-band[data-layout="more"] p:first-child em { font-style: normal; }
.chatticus .markus-band[data-layout="more"] p:not(:first-child) { margin: 0.375rem 0 0; max-width: none; }
.chatticus .markus-band[data-layout="more"] p:nth-child(2) { margin-top: 1.5rem; }
.chatticus .markus-band[data-layout="more"] a { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; min-height: 4rem; padding: 1rem 0.75rem; border-radius: 0.75rem; font-family: var(--font-display); font-size: 1.25rem; font-weight: 400; letter-spacing: -0.025em; text-decoration: none; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="more"] a { font-size: 1.5rem; } }
.chatticus .markus-band[data-layout="more"] a::after { content: ""; flex: none; width: 1.25rem; height: 1.25rem; background: currentColor; -webkit-mask: var(--arrow-up-right) center / contain no-repeat; mask: var(--arrow-up-right) center / contain no-repeat; }

/* ------------------------------------------------------------------ beta */

.chatticus .markus-band[data-layout="beta-head"] { padding-block: 5rem; background: var(--clay); color: var(--ink); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="beta-head"] { padding-block: 8rem; } }
.chatticus .markus-band[data-layout="beta-head"] h1 { font-size: clamp(3rem, 6vw, 5rem); line-height: 0.9; letter-spacing: -0.06em; color: var(--ink); }
.chatticus .markus-band[data-layout="beta-head"] h1 + p:not([class]) { max-width: 48rem; margin-top: 2rem; font-family: var(--font-display); font-size: 1.875rem; line-height: 1.25; letter-spacing: -0.035em; color: var(--ink); }
.chatticus .markus-band[data-layout="beta-head"] a { color: var(--ink); text-decoration-thickness: 2px; }
.chatticus .markus-band[data-layout="beta-head"] a:hover { color: var(--paper); }
.chatticus .markus-band[data-layout="beta-pricing-head"] { padding-block: 4rem 0; background: var(--surface-0); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="beta-pricing-head"] { padding-block: 4rem 0; } }
.chatticus .markus-band[data-layout="beta-pricing-head"] h2 { max-width: 56rem; font-size: clamp(2.2rem, 4.5vw, 3.6rem); line-height: 0.95; letter-spacing: -0.05em; }
.chatticus .markus-band[data-layout="beta-pricing-head"] h2 + p:not([class]) { max-width: 48rem; margin-top: 1.5rem; font-size: 1.125rem; line-height: 1.75rem; }
.chatticus .markus-band[data-layout="beta-pricing-head"] p:not([class]) + p:not([class]) { max-width: 48rem; margin-top: 1.5rem; font-size: 1rem; line-height: 1.625; }
.chatticus .markus-band[data-layout="beta-offers"], .chatticus .markus-band[data-layout="beta-footnote"] { padding-block: 2.5rem 0; background: var(--surface-0); }
.chatticus .markus-band[data-layout="beta-offers"] .markus-columns { grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 48rem) { .chatticus .markus-band[data-layout="beta-offers"] .markus-columns { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 80rem) { .chatticus .markus-band[data-layout="beta-offers"] .markus-columns { grid-template-columns: repeat(4, 1fr); } }
.chatticus .markus-band[data-layout="beta-offers"] .markus-column[data-panel="card"] { padding: 1.5rem; border-radius: 1.6rem; background: var(--surface-1); grid-template-rows: auto auto 1fr; }
.chatticus .markus-band[data-layout="beta-offers"] .markus-column > h3 { font-weight: 600; }
.chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:has(> strong:only-child):not(:has(+ p > strong)) { }
.chatticus .markus-band[data-layout="beta-offers"] h3 + p:has(> strong:only-child) { grid-column: 1; grid-row: 2; margin-top: 0.25rem; }
.chatticus .markus-band[data-layout="beta-offers"] h3 + p:has(> strong:only-child) strong { font-family: var(--font-display); font-size: 0.875rem; font-weight: 600; letter-spacing: 0.08em; line-height: 1.25rem; text-transform: uppercase; color: var(--ink-soft); }
.chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:has(> em:only-child) { grid-row: 1 / span 2; }
.chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:not(:has(> strong)):not(:has(> em:only-child)):not(:has(> a)) { margin-top: 1rem; font-size: 0.875rem; line-height: 1.625; }
.chatticus .markus-band[data-layout="beta-offers"] .markus-column > p > strong:not(:only-child), .chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:not(h3 + p) > strong { font-size: 1.875rem; line-height: 2.25rem; }
.chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:has(> a) { margin-top: 1.5rem; }
.chatticus .markus-band[data-layout="beta-footnote"] .markus-columns { grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="beta-footnote"] .markus-columns { grid-template-columns: repeat(3, 1fr); } .chatticus .markus-band[data-layout="beta-footnote"] .markus-column:first-child, .chatticus .markus-band[data-layout="beta-footnote"] .markus-column:last-child { grid-column: 1 / -1; } }
.chatticus .markus-band[data-layout="beta-footnote"] .markus-column:first-child p { margin: -1.5rem 0 0; font-size: 0.875rem; line-height: 1.25rem; }
.chatticus .markus-band[data-layout="beta-footnote"] .markus-column[data-panel="card"] { padding: 2rem; border-radius: 1.6rem; background: var(--surface-1); }
.chatticus .markus-band[data-layout="beta-footnote"] .markus-column[data-panel="card"] h3 { font-size: 1.25rem; font-weight: 600; letter-spacing: -0.04em; line-height: 1.75rem; }
.chatticus .markus-band[data-layout="beta-footnote"] .markus-column[data-panel="card"] p { max-width: none; margin: 1rem 0 0; font-size: 1rem; line-height: 1.625; }
.chatticus .markus-band[data-layout="beta-footnote"] .markus-column:last-child { display: flex; flex-wrap: wrap; gap: 0.75rem 2rem; padding-bottom: 0; }
.chatticus .markus-band[data-layout="beta-footnote"] .markus-column:last-child p { margin: 0; max-width: none; }
.chatticus .markus-band[data-layout="beta-footnote"] .markus-column:last-child a { font-size: 0.875rem; font-weight: 600; color: var(--ink); text-decoration-color: color-mix(in srgb, var(--ink) 30%, transparent); }
.chatticus .markus-band[data-layout="beta-footnote"] { padding-bottom: 4rem; }
.chatticus .markus-band[data-layout="beta-panel"] { padding-block: 5rem; background: var(--surface-1); }
.chatticus .markus-band[data-layout="beta-panel"]#survey-section { background: var(--surface-0); }
.chatticus .markus-band[data-layout="beta-panel"] .markus-column[data-panel="card"] { max-width: 48rem; padding: 2rem; border-radius: 1rem; background: var(--surface-0); }
.chatticus .markus-band[data-layout="beta-panel"]#survey-section .markus-column[data-panel="card"] { background: var(--surface-1); }
.chatticus .markus-band[data-layout="beta-panel"] h2 { font-size: 1.875rem; line-height: 2.25rem; letter-spacing: -0.04em; }
.chatticus .markus-band[data-layout="beta-panel"] ul { margin: 1.5rem 0 0; padding-left: 1.25rem; list-style: disc; display: grid; gap: 0.75rem; font-size: 1.125rem; line-height: 1.75rem; }
.chatticus .markus-band[data-layout="form"], .chatticus .markus-band[data-layout="notice"] { padding-block: 5rem; background: var(--surface-0); }
.chatticus .markus-band[data-layout="notice"] .papyrus-island { max-width: 42rem; }

/* ------------------------------------------------------------------ use cases index */

.chatticus .markus-band[data-layout="usecases-head"] { padding-block: 5rem; }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="usecases-head"] { padding-block: 7rem; } }
.chatticus .markus-band[data-layout="usecases-head"] .markus-band-eyebrow { margin-bottom: 0; background: var(--surface-2); }
.chatticus .markus-band[data-layout="usecases-head"] h1 { margin-top: 1.75rem; }
.chatticus .markus-band[data-layout="usecases-head"] h1 + p:not([class]) { max-width: 42rem; margin-top: 2rem; }
.chatticus .markus-band[data-layout="usecases-list"] { padding-block: 5rem; background: var(--surface-1); }
@media (min-width: 40rem) { .chatticus .markus-band[data-layout="usecases-list"] { padding-block: 7rem; } }
.chatticus .markus-band[data-layout="usecases-list"] .markus-card-grid { grid-template-columns: 1fr; gap: 1rem; margin-top: 0; }
@media (min-width: 64rem) { .chatticus .markus-band[data-layout="usecases-list"] .markus-card-grid { grid-template-columns: repeat(3, 1fr); } }
.chatticus .markus-card.chat-example { position: relative; display: flex; flex-direction: column; padding: 1.75rem; border-radius: 1rem; background: var(--surface-0); }
@media (min-width: 40rem) { .chatticus .markus-card.chat-example { padding: 2rem; } }
.chatticus .markus-card.chat-example .chat-example-label { margin: 0; font-size: 0.875rem; font-weight: 600; line-height: 1.25rem; color: var(--ink); max-width: none; }
.chatticus .markus-card.chat-example .chat-kicker { margin: 0.5rem 0 0; font-size: 0.62rem; line-height: 1rem; }
.chatticus .markus-card.chat-example .markus-card-title { margin-top: 3rem; }
.chatticus .markus-card.chat-example .markus-card-title a::after { content: ""; position: absolute; inset: 0; border-radius: 1rem; }
.chatticus .markus-card.chat-example .markus-card-summary { flex: 1; margin-top: 1.25rem; }
.chatticus .chat-desks { display: inline-flex; align-items: center; gap: 0.5rem; margin: 2rem 0 0; font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.12em; line-height: 1rem; text-transform: uppercase; color: var(--ink); max-width: none; }
.chatticus .chat-desks::after { content: ""; width: 1rem; height: 1rem; background: currentColor; -webkit-mask: var(--arrow-up-right) center / contain no-repeat; mask: var(--arrow-up-right) center / contain no-repeat; }
.chatticus .markus-card-title a { font-weight: inherit; }

.chatticus .markus-document.chat-feature > h1, .chatticus .markus-document.chat-feature .markus-header h1, .chatticus .markus-document.chat-legal .markus-header h1 { font-size: clamp(3rem, 7vw, 6rem); line-height: 0.9; letter-spacing: -0.06em; }
.chatticus .chat-legal .markus-header h1 { font-size: clamp(3rem, 7vw, 5.5rem); }
.chatticus .chat-legal .markus-header .markus-lede { font-size: 1.125rem; line-height: 1.75rem; margin-top: 1.5rem; max-width: 42rem; }
.chatticus .chat-post > header + *, .chatticus .chat-feature > header + h1 + *, .chatticus .chat-legal > header + * { margin-top: 3rem; }
.chatticus .chat-wiki > header + * { margin-top: 2.5rem; }
.chatticus .markus-document.chat-feature > header + h1 { margin-top: 1.75rem; }

.chatticus .markus-card-grid > .chat-group-heading { grid-column: 1 / -1; margin: 2.5rem 0 0.25rem; font-family: var(--font-mono); font-size: 0.65rem; font-weight: 400; letter-spacing: 0.13em; line-height: 1rem; text-transform: uppercase; color: var(--ink-soft); }
.chatticus .markus-card-grid > .chat-group-heading:first-child { margin-top: 0; }

/* offer cards (home pricing and the beta page): a column whose price block sits at the bottom of every card */
.chatticus .markus-band:is([data-layout="pricing"], [data-layout="beta-offers"]) .markus-column[data-panel="card"] { position: relative; display: flex; flex-direction: column; }
.chatticus .markus-band:is([data-layout="pricing"], [data-layout="beta-offers"]) .markus-column > * { grid-column: auto; grid-row: auto; }
.chatticus .markus-band:is([data-layout="pricing"], [data-layout="beta-offers"]) .markus-column > h3 { padding-right: 7rem; }
.chatticus .markus-band:is([data-layout="pricing"], [data-layout="beta-offers"]) .markus-column > p:has(> em:only-child) { position: absolute; top: 1.5rem; right: 1.5rem; margin: 0; }
@media (min-width: 40rem) { .chatticus .markus-band:is([data-layout="pricing"], [data-layout="beta-offers"]) .markus-column > p:has(> em:only-child) { top: 1.75rem; right: 1.75rem; } }
.chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:has(> em:only-child) { top: 1.5rem; right: 1.5rem; }
.chatticus .markus-band:is([data-layout="pricing"], [data-layout="beta-offers"]) .markus-column > p:has(> strong):not(h3 + p) { margin-top: auto; padding-top: 2rem; }
.chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:has(> strong):not(h3 + p) { padding-top: 1.5rem; }
.chatticus .markus-band:is([data-layout="pricing"], [data-layout="beta-offers"]) .markus-column > p > strong:not(h3 + p > strong) { font-family: var(--font-display); font-weight: 600; letter-spacing: -0.04em; color: var(--surface-foreground); }
.chatticus .markus-band[data-layout="pricing"] .markus-column > p > strong:not(h3 + p > strong) { font-size: 1.5rem; line-height: 2rem; }
.chatticus .markus-band[data-layout="beta-offers"] .markus-column > p > strong:not(h3 + p > strong) { font-size: 1.875rem; line-height: 2.25rem; }
.chatticus .markus-band:is([data-layout="pricing"], [data-layout="beta-offers"]) .markus-column > p:has(> strong):not(h3 + p) > em { margin-left: 0.5rem; font-family: var(--font-body); font-size: 0.875rem; font-weight: 400; letter-spacing: 0; line-height: 1.25rem; }
.chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:has(> strong):not(h3 + p) + p, .chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:has(> strong):not(h3 + p) ~ p { margin-top: 0.25rem; }
.chatticus .markus-band[data-layout="beta-offers"] .markus-column > p:has(> a) { margin-top: 1.5rem; }