/* Encoded Brands design system — GENERATED FILE, DO NOT EDIT.
   Source: design-system/. Rebuild with: node scripts/build-design-system.mjs */

/* ==== resources.css ==== */
/* Documentation and connection guide share the marketing page system. */
.nav .nav-inner { max-width: none; padding: 0; margin: 0; }
.nav .nav-link { display: inline-flex; }
.resource-hero, .mcp-guide .guide-hero {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; flex-direction: column; justify-content: center;
  min-height: 410px; margin: 24px 12px 12px; padding: 64px 52px;
  border-radius: var(--ec-radius-xl);
  background: linear-gradient(90deg, #1a1a1a 0%, #1a1a1a 47%, rgba(26,26,26,.84) 73%, rgba(26,26,26,.42) 100%), url('/ds/img/gradient-dawn.png') right center / auto 100% no-repeat, var(--ec-neutral-800);
  color: var(--ec-text-inverse);
}
.resource-hero::after, .mcp-guide .guide-hero::after {
  content: ""; position: absolute; z-index: -1; width: 190px; height: 220px;
  right: 9%; top: calc(50% - 110px);
  background: url('/ds/logo/logomark-white.svg') center / contain no-repeat;
  opacity: .16; pointer-events: none;
}
.resource-hero > *, .mcp-guide .guide-hero .guide-shell { position: relative; z-index: 1; }
.resource-hero h1, .mcp-guide .guide-hero h1 {
  margin: 0 0 24px; max-width: 1000px;
  font: 500 clamp(44px, 5vw, 72px)/1.04 var(--ec-font-display);
  letter-spacing: -.04em; color: inherit;
}
.resource-hero h1 em, .mcp-guide .guide-hero h1 span { font-style: normal; color: inherit; }
.resource-hero .lede, .mcp-guide .guide-lede {
  max-width: 680px; margin: 0; font: 300 18px/1.55 var(--ec-font-body);
  color: var(--ec-text-inverse-muted);
}
.resource-hero .hero-sub, .mcp-guide .guide-hero .guide-label {
  display: flex; align-items: center; gap: 16px; max-width: 650px;
  margin: 0 0 24px; color: var(--ec-text-inverse-muted);
  font: 400 11px/1.5 var(--ec-font-mono); letter-spacing: 1px; text-transform: uppercase;
}
.resource-hero .hero-sub::before, .mcp-guide .guide-hero .guide-label::before {
  content: ""; display: block; flex: none; width: 22px; height: 26px;
  background: url('/ds/logo/logomark-white.svg') center / contain no-repeat;
}
.resource-hero .hero-sub::after, .mcp-guide .guide-hero .guide-label::after {
  content: ""; display: block; flex: 1; height: 1px; background: rgba(255,255,255,.32);
}
/* The header already carries the upright mark. Let approved Dawn artwork
   carry the docs panel without repeating the mark in a decorative eyebrow. */
.resource-hero {
  background: url('/ds/img/gradient-dawn.png') center / cover no-repeat, var(--ec-surface-muted);
  color: var(--ec-text-primary);
}
.resource-hero::after { content: none; }
.resource-hero .lede, .resource-hero .hero-sub { color: var(--ec-text-secondary); }
.resource-hero .hero-sub::before { content: none; }
.resource-hero .hero-sub::after { background: var(--ec-divider); }
.docs-layout {
  max-width: none; margin: 12px; padding: 48px 52px;
  grid-template-columns: 220px minmax(0, 1fr); gap: 48px;
  background: var(--ec-surface-muted); border-radius: var(--ec-radius-xl);
}
.docs-layout .toc { top: 24px; padding: 24px; border: 0; border-radius: var(--ec-radius-md); background: var(--ec-surface); box-shadow: var(--ec-ring-subtle); }
.docs-layout .toc a { padding: 5px 0; color: var(--ec-text-secondary); }
.docs-layout .toc a.active, .docs-layout .toc a:hover { color: var(--ec-text-primary); text-decoration: underline; text-underline-offset: 4px; }
.docs-body { max-width: 900px; width: 100%; }
.docs-body :is(code, a) { overflow-wrap: anywhere; }
.docs-body h2 { margin: 48px 0 20px; padding-top: 32px; font-size: clamp(28px, 3vw, 43px); line-height: 1.1; letter-spacing: -.04em; border-color: var(--ec-border-strong); }
.docs-body h2 em, .docs-body .canon-block .headline em { color: inherit; }
.docs-body h3 { font-weight: 500; }
.docs-body p, .docs-body ul, .docs-body ol { font-size: 16px; line-height: 1.6; font-weight: 300; }
.docs-body a:not(.btn) { color: var(--ec-text-primary); }
.docs-body a:not(.btn):hover { color: var(--ec-action-primary); }
.docs-body .callout, .docs-body .canon-block { margin: 24px 0; padding: 24px; border: 0; border-radius: var(--ec-radius-md); background: var(--ec-surface); box-shadow: var(--ec-ring-subtle); }
.docs-body .callout .tag, .docs-body .canon-block .tag { color: var(--ec-text-secondary); }
.docs-body .canon-block .headline { font: 500 28px/1.15 var(--ec-font-display); letter-spacing: -.03em; }
.docs-body pre { margin: 24px 0; padding: 58px 24px 24px; border: 0; border-radius: var(--ec-radius-md); background: var(--ec-neutral-900); color: var(--ec-code-fg); box-shadow: var(--ec-ring-inverse); white-space: pre-wrap; overflow-wrap: anywhere; font: 12px/1.65 var(--ec-font-mono); }
.docs-body pre::before { background: transparent; border-bottom: 1px solid var(--ec-code-punct); font: 11px var(--ec-font-mono); font-weight: 400; padding: 0 24px; color: var(--ec-text-inverse-muted); }
.docs-body pre::after { content: none; }
.docs-body pre .k { color: var(--ec-code-key); }
.docs-body pre .s, .docs-body pre .h { color: var(--ec-code-string); }
.docs-body pre .c { color: var(--ec-neutral-400); }
.docs-body table { display: block; max-width: 100%; overflow-x: auto; }
.docs-body td:first-child { white-space: normal; overflow-wrap: anywhere; }

.mcp-guide { margin: 0 12px; color: var(--ec-text-primary); font: 300 16px/1.6 var(--ec-font-body); background: var(--ec-surface-muted); border-radius: var(--ec-radius-xl); }
.mcp-guide .guide-hero { margin: 24px 0 12px; }
.mcp-guide .guide-shell { width: 100%; max-width: 1320px; margin: 0 auto; padding: 0 40px; }
.mcp-guide .guide-hero .guide-shell { max-width: none; padding: 0; }
.mcp-guide .guide-section { padding: 40px 12px; }
.mcp-guide .guide-grid { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 40px; }
.mcp-guide .guide-content { min-width: 0; }
.mcp-guide .guide-rail, .mcp-guide .guide-label, .mcp-guide .code-label { font: 400 11px/1.6 var(--ec-font-mono); letter-spacing: 1px; text-transform: uppercase; color: var(--ec-text-secondary); }
.mcp-guide .guide-rail { padding-top: 12px; }
.mcp-guide .guide-rail span:first-child { display: none; }
.mcp-guide .guide-label { margin: 0 0 16px; }
.mcp-guide h2 { margin: 0 0 24px; font: 500 clamp(32px, 3.4vw, 48px)/1.1 var(--ec-font-display); letter-spacing: -.04em; }
.mcp-guide h3 { font: 500 22px/1.2 var(--ec-font-display); letter-spacing: -.02em; }
.mcp-guide .section-intro { max-width: 760px; margin: 0; color: var(--ec-text-secondary); }
.mcp-guide .connection-builder { margin-top: 32px; padding: 28px; background: var(--ec-surface); border-radius: var(--ec-radius-md); box-shadow: var(--ec-ring-subtle); }
.mcp-guide label { display: block; margin-bottom: 10px; font: 11px/1.5 var(--ec-font-mono); text-transform: uppercase; }
.mcp-guide .handle-row, .mcp-guide .url-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; border-radius: var(--ec-radius-md); overflow: hidden; box-shadow: var(--ec-ring-default); }
.mcp-guide input, .mcp-guide select { min-width: 0; width: 100%; height: 51px; padding: 0 16px; border: 1px solid var(--ec-border-default); border-radius: var(--ec-radius-xs); background: var(--ec-surface); color: var(--ec-text-primary); font: 14px var(--ec-font-mono); }
.mcp-guide button, .mcp-guide .guide-jump, .mcp-guide .primary-action, .mcp-guide .secondary-action { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 44px; padding: 12px 18px; border: 0; border-radius: var(--ec-radius-xs); background: var(--ec-action-secondary); color: var(--ec-text-primary); font: 11px/1.5 var(--ec-font-mono); text-transform: uppercase; text-decoration: none; cursor: pointer; }
.mcp-guide button:hover, .mcp-guide .secondary-action:hover { background: var(--ec-action-secondary-hover); }
.mcp-guide :is(input, select, button, a):focus-visible { outline: 2px solid var(--ec-focus-ring); outline-offset: 3px; }
.mcp-guide .guide-jump, .mcp-guide .primary-action { background: var(--ec-action-primary); color: var(--ec-text-on-accent); }
.mcp-guide .guide-jump { margin-top: 28px; }
.mcp-guide .guide-jump:hover, .mcp-guide .primary-action:hover { background: var(--ec-action-primary-hover); }
.mcp-guide .field-help, .mcp-guide .plain-note, .mcp-guide .boundary-note { font-size: 14px; color: var(--ec-text-secondary); margin: 16px 0; }
.mcp-guide code { font-family: var(--ec-font-mono); overflow-wrap: anywhere; }
.mcp-guide .url-card { margin: 24px 0; background: var(--ec-neutral-900); color: var(--ec-text-inverse); box-shadow: none; }
.mcp-guide .url-card > div { min-width: 0; padding: 24px; }
.mcp-guide .url-card .code-label { display: block; margin-bottom: 12px; color: var(--ec-text-inverse-muted); }
.mcp-guide .url-card code { font-size: 13px; }
.mcp-guide .copy-button { background: var(--ec-neutral-700); color: var(--ec-text-inverse); border-radius: 0; }
.mcp-guide .copy-button:hover { background: var(--ec-action-primary); }
.mcp-guide .guide-section-dark { margin: 12px 28px; padding: 40px 24px; background: var(--ec-neutral-800); color: var(--ec-text-inverse); border-radius: var(--ec-radius-xl); }
.mcp-guide .guide-section-dark :is(.guide-label,.guide-rail,.tool-footnote) { color: var(--ec-text-inverse-muted); }
.mcp-guide .steps-grid, .mcp-guide .capability-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin-top: 28px; }
.mcp-guide .steps-grid article { padding: 24px; background: var(--ec-neutral-700); border-radius: var(--ec-radius-md); }
.mcp-guide .step-number { font: 11px var(--ec-font-mono); color: var(--ec-text-inverse-muted); }
.mcp-guide .steps-grid h3 { margin: 24px 0 12px; }
.mcp-guide .steps-grid p { margin: 0; color: var(--ec-text-inverse-muted); font-size: 14px; }
.mcp-guide .tool-panel { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: 24px; margin-top: 24px; padding: 24px; box-shadow: var(--ec-ring-inverse); border-radius: var(--ec-radius-md); }
.mcp-guide .tool-instructions h3 { margin: 0 0 16px; }
.mcp-guide .tool-instructions ol { padding-left: 20px; }
.mcp-guide .tool-instructions li { padding: 4px 0; }
.mcp-guide .tool-footnote { margin-top: 20px; font-size: 12px; }
.mcp-guide a { color: inherit; text-underline-offset: 3px; }
.mcp-guide .access-table, .mcp-guide .prompt-list { display: grid; gap: 12px; margin-top: 28px; }
.mcp-guide .access-table article, .mcp-guide .prompt-list article, .mcp-guide .capability-grid > div { padding: 24px; background: var(--ec-surface); box-shadow: var(--ec-ring-subtle); border-radius: var(--ec-radius-md); }
.mcp-guide .access-table article { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: 24px; }
.mcp-guide .access-heading { display: flex; flex-direction: column; gap: 8px; }
.mcp-guide .access-heading span, .mcp-guide .capability-grid span { font: 11px/1.5 var(--ec-font-mono); text-transform: uppercase; color: var(--ec-text-secondary); }
.mcp-guide .access-heading strong { font: 500 22px/1.2 var(--ec-font-display); }
.mcp-guide .access-table p, .mcp-guide .prompt-list p { margin: 0; }
.mcp-guide .prompt-list article { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 24px; }
.mcp-guide .capability-grid p { margin: 20px 0 0; }
.mcp-guide .technical-details { margin-top: 24px; padding: 20px 24px; border-radius: var(--ec-radius-md); background: var(--ec-surface); box-shadow: var(--ec-ring-subtle); }
.mcp-guide .technical-details summary { cursor: pointer; font: 12px var(--ec-font-mono); }
.mcp-guide .technical-details > div { margin-top: 20px; }
.mcp-guide .guide-cta { margin: 12px; padding: 48px 40px; border-radius: var(--ec-radius-xl); background: var(--ec-neutral-800); color: var(--ec-text-inverse); }
.mcp-guide .guide-cta .guide-label { color: var(--ec-text-inverse-muted); }
.mcp-guide .guide-cta p { max-width: 720px; }
.mcp-guide .cta-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 24px; }

@media(max-width: 1000px) {
  .docs-layout { padding: 32px; grid-template-columns: 180px minmax(0,1fr); gap: 28px; }
  .mcp-guide .guide-grid { grid-template-columns: minmax(0,1fr); gap: 16px; }
  .mcp-guide .guide-shell { padding: 0 24px; }
}
@media(max-width: 640px) {
  .resource-hero, .mcp-guide .guide-hero { min-height: 360px; padding: 36px 24px; background: linear-gradient(100deg, #1a1a1a 0%, rgba(26,26,26,.94) 70%, rgba(26,26,26,.78) 100%), url('/ds/img/gradient-dawn.png') right center / auto 100% no-repeat, var(--ec-neutral-800); }
  .resource-hero::after, .mcp-guide .guide-hero::after { width: 110px; height: 130px; right: -20px; top: 26px; opacity: .09; }
  .resource-hero { background: url('/ds/img/gradient-dawn.png') center / cover no-repeat, var(--ec-surface-muted); }
  .resource-hero h1, .mcp-guide .guide-hero h1 { font-size: 40px; }
  .resource-hero .lede, .mcp-guide .guide-lede { font-size: 16px; }
  .docs-layout { padding: 24px 16px; grid-template-columns: minmax(0,1fr); gap: 32px; }
  .docs-layout .toc { position: static; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px 16px; }
  .docs-layout .toc-label { grid-column: 1/-1; }
  .docs-body pre { padding-left: 16px; padding-right: 16px; }
  .mcp-guide .guide-shell { padding: 0 12px; }
  .mcp-guide .guide-section { padding: 28px 12px; }
  .mcp-guide .guide-section-dark { margin: 8px 12px; padding: 28px 12px; }
  .mcp-guide .connection-builder { padding: 20px; }
  .mcp-guide .handle-row, .mcp-guide .url-card, .mcp-guide .steps-grid, .mcp-guide .tool-panel, .mcp-guide .access-table article, .mcp-guide .prompt-list article, .mcp-guide .capability-grid { grid-template-columns: minmax(0,1fr); }
  .mcp-guide .guide-cta { padding: 32px 12px; }
  .mcp-guide .prompt-copy { justify-self: start; }
}
/* The MCP guide follows the restrained Dawn hero, without a decorative
   eyebrow or second mark. The functional owner CTA label remains below. */
.mcp-guide .guide-hero {
  background: url('/ds/img/gradient-dawn.png') center / cover no-repeat, var(--ec-surface-muted);
  color: var(--ec-text-primary);
}
.mcp-guide .guide-hero::after { content: none; }
.mcp-guide .guide-hero .guide-lede { color: var(--ec-text-secondary); }
