:root {
  --field-carbon: #090909;
  --field-panel: #151515;
  --field-panel-2: #1d1d1b;
  --field-ink: #f4f4f0;
  --field-silver: #c9c9c3;
  --field-smoke: #90908b;
  --field-line: #30302d;
  --field-blue: #5b76ff;
  --field-blue-soft: #b8c4ff;
  --field-red: #df2b20;
  --field-display: "Switzer", "Helvetica Neue", Arial, sans-serif;
  --field-mono: "IBM Plex Mono", monospace;
  --field-shell: min(1280px, calc(100vw - 48px));
  --field-ease: cubic-bezier(.16, 1, .3, 1);
}

body.shell-body.agent-field-body { margin: 0; overflow-x: hidden; background-color: #090909; background-image: none; color: var(--field-ink); font-family: var(--field-display); }
body.agent-field-body .shell-nav { background: rgba(9, 9, 9, .91); }
body.agent-field-body .shell-nav-inner { max-width: 1280px; }
body.agent-field-body .shell-footer { border-color: var(--field-line); background: #070707; }
body.agent-field-body .shell-footer-inner { max-width: 1280px; }
body.agent-field-body h1, body.agent-field-body h2, body.agent-field-body h3, body.agent-field-body p { text-wrap: balance; }
body.agent-field-body :focus-visible { outline: 3px solid var(--field-blue); outline-offset: 3px; }

.field-hero { width: var(--field-shell); min-height: 790px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(460px, .96fr); border-bottom: 1px solid var(--field-line); }
.field-hero__copy { padding: clamp(80px, 9vw, 130px) clamp(38px, 7vw, 100px) 80px 0; display: flex; flex-direction: column; align-items: flex-start; background: #090909; }
.field-kicker { margin: 0 0 18px; color: var(--field-blue-soft); font: 500 10px/1.45 var(--field-mono); letter-spacing: .07em; text-transform: uppercase; }
.field-hero h1 { max-width: 760px; margin: 0; color: var(--field-ink); font: 300 clamp(64px, 7.4vw, 112px)/.82 var(--field-display); letter-spacing: -.075em; }
.field-hero h1 strong { color: var(--field-ink); font-weight: 600; }
.field-hero__lede { max-width: 680px; margin: 36px 0 0; color: var(--field-silver); font-size: clamp(17px, 1.45vw, 21px); line-height: 1.52; }
.field-hero__rule { margin: 22px 0 0; padding-left: 16px; border-left: 2px solid var(--field-red); color: var(--field-smoke); font: 500 11px/1.5 var(--field-mono); text-transform: uppercase; }
.field-actions { margin-top: 36px; display: flex; flex-wrap: wrap; gap: 10px; }
.field-button { min-height: 48px; padding: 12px 17px; display: inline-flex; align-items: center; justify-content: center; gap: 28px; border: 1px solid var(--field-line); border-radius: 1px; background: transparent; color: var(--field-ink); font: 600 12px var(--field-display); text-decoration: none; cursor: pointer; transition: transform 230ms var(--field-ease), background 180ms ease, color 180ms ease; }
.field-button:hover { transform: translateY(-2px); }
.field-button--primary { border-color: var(--field-ink); background: var(--field-ink); color: var(--field-carbon); }
.field-button--primary:hover { border-color: var(--field-blue); background: var(--field-blue); color: #fff; }
.field-button--quiet:hover { border-color: var(--field-silver); }
.field-formats { margin-top: auto; padding-top: 40px; display: flex; flex-wrap: wrap; gap: 8px 14px; color: var(--field-smoke); font: 500 9px var(--field-mono); text-transform: uppercase; }
.field-formats a { color: var(--field-blue-soft); text-underline-offset: 3px; }

.signal-trace { min-width: 0; min-height: 790px; display: grid; grid-template-rows: 54px 1fr auto; border-left: 1px solid var(--field-line); background: #0c0c0c; }
.signal-trace__top { padding: 0 18px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--field-line); color: #777773; font: 500 9px var(--field-mono); letter-spacing: .05em; }
.signal-trace__top i { color: var(--field-blue-soft); font-style: normal; }
.signal-trace__stage { position: relative; min-height: 570px; overflow: hidden; isolation: isolate; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 34px 34px; }
.signal-trace__stage::before { content: "FIELD"; position: absolute; z-index: -1; left: -22px; bottom: 12%; color: #161614; font: 300 170px/.8 var(--field-display); letter-spacing: -.09em; }
.trace-line { position: absolute; height: 1px; background: linear-gradient(90deg, transparent, #4e5b9c 18%, #7084ff 54%, transparent); transform-origin: left center; }
.trace-line--one { width: 78%; top: 29%; left: 12%; transform: rotate(18deg); }
.trace-line--two { width: 68%; top: 62%; left: 18%; transform: rotate(-22deg); }
.trace-line--three { width: 55%; top: 44%; left: 30%; transform: rotate(73deg); }
.trace-node { position: absolute; width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid #5c5c58; border-radius: 50%; background: #111; color: var(--field-ink); box-shadow: 0 0 0 9px rgba(91,118,255,.05); font: 500 13px var(--field-mono); font-style: normal; }
.trace-node::after { content: ""; position: absolute; inset: -4px; border: 1px solid rgba(91,118,255,.3); border-radius: 50%; animation: trace-pulse 3.8s ease-out infinite; }
.trace-node--one { top: 21%; left: 15%; }
.trace-node--two { top: 47%; right: 16%; animation-delay: .6s; }
.trace-node--three { bottom: 17%; left: 29%; animation-delay: 1.2s; }
.trace-packet { position: absolute; top: 42%; left: 39%; padding: 9px 11px; border: 1px solid #5264c6; background: #11162e; color: var(--field-blue-soft); font: 500 8px var(--field-mono); letter-spacing: .08em; animation: trace-float 5s var(--field-ease) infinite; }
.signal-trace__stats { margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--field-line); }
.signal-trace__stats div { padding: 20px; border-right: 1px solid var(--field-line); }
.signal-trace__stats div:last-child { border-right: 0; }
.signal-trace__stats dt { color: var(--field-ink); font: 300 36px/1 var(--field-display); letter-spacing: -.05em; }
.signal-trace__stats dd { margin: 8px 0 0; color: var(--field-smoke); font: 500 8px var(--field-mono); text-transform: uppercase; }
@keyframes trace-pulse { 0% { transform: scale(.9); opacity: 0; } 35% { opacity: 1; } 100% { transform: scale(1.35); opacity: 0; } }
@keyframes trace-float { 0%, 100% { transform: translate3d(0, 0, 0); } 50% { transform: translate3d(13px, -12px, 0); } }

.field-principle, .field-topics, .field-feed, .field-protocol, .field-related { width: var(--field-shell); margin: 0 auto; padding: clamp(90px, 11vw, 150px) 0; }
.field-principle { display: grid; grid-template-columns: .55fr 1.45fr; gap: clamp(40px, 8vw, 110px); border-bottom: 1px solid var(--field-line); }
.field-principle .field-kicker { grid-column: 1; }
.field-principle h2 { grid-column: 2; margin: 0; max-width: 930px; color: var(--field-ink); font: 400 clamp(48px, 6vw, 84px)/.94 var(--field-display); letter-spacing: -.06em; }
.field-principle__copy { grid-column: 2; max-width: 760px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 34px; }
.field-principle__copy p { margin: 0; color: var(--field-smoke); font-size: 15px; }

.field-section-head { margin-bottom: 42px; display: grid; grid-template-columns: 1.2fr .8fr; gap: 50px; align-items: end; }
.field-section-head h2 { margin: 0; color: var(--field-ink); font: 500 clamp(46px, 6vw, 78px)/.92 var(--field-display); letter-spacing: -.06em; }
.field-section-head > p { max-width: 560px; margin: 0; color: var(--field-smoke); font-size: 14px; }
.topic-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--field-line); border-left: 1px solid var(--field-line); }
.topic-grid a { min-height: 270px; padding: 22px; display: flex; flex-direction: column; border-right: 1px solid var(--field-line); border-bottom: 1px solid var(--field-line); color: inherit; text-decoration: none; transition: background 200ms ease, transform 300ms var(--field-ease); }
.topic-grid a:hover, .topic-grid a.is-active { background: var(--field-panel); transform: translateY(-4px); }
.topic-grid span { color: var(--field-blue-soft); font: 500 9px var(--field-mono); }
.topic-grid h3 { margin: 54px 0 14px; color: var(--field-ink); font-size: 27px; line-height: .98; letter-spacing: -.04em; }
.topic-grid p { margin: auto 0 0; color: var(--field-smoke); font-size: 12px; }

.field-feed { width: 100%; padding-inline: max(24px, calc((100vw - 1280px) / 2)); background: #101010; }
.field-feed .field-section-head { width: min(1280px, calc(100vw - 48px)); margin-inline: auto; }
.field-section-head--feed { align-items: end; }
.feed-controls { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.feed-controls button { min-height: 40px; padding: 8px 12px; border: 1px solid #3d3d3a; border-radius: 1px; background: transparent; color: var(--field-smoke); font: 600 10px var(--field-display); cursor: pointer; }
.feed-controls button:hover, .feed-controls button.is-active { border-color: var(--field-ink); background: var(--field-ink); color: var(--field-carbon); }
.feed-status { width: min(1280px, calc(100vw - 48px)); margin: 0 auto 14px; color: #777773; font: 500 9px var(--field-mono); text-transform: uppercase; }
.agent-feed { width: min(1280px, calc(100vw - 48px)); margin: 0 auto; border-top: 1px solid #484844; }
.feed-empty { min-height: 410px; padding: clamp(28px, 5vw, 70px); display: flex; flex-direction: column; justify-content: center; border-bottom: 1px solid #484844; }
.feed-empty > span { color: var(--field-blue-soft); font: 500 9px var(--field-mono); }
.feed-empty h3 { max-width: 820px; margin: 54px 0 18px; color: var(--field-ink); font: 500 clamp(38px, 5vw, 68px)/.94 var(--field-display); letter-spacing: -.055em; }
.feed-empty p { max-width: 660px; margin: 0; color: var(--field-smoke); }
.feed-empty a { width: max-content; margin-top: 30px; color: var(--field-blue-soft); font-size: 12px; font-weight: 600; }
.agent-post { display: grid; grid-template-columns: 190px minmax(0, 1fr) 220px; gap: 28px; padding: 34px 0; border-bottom: 1px solid #484844; }
.agent-post[hidden] { display: none; }
.agent-post__identity span, .agent-post__meta span { display: block; color: #777773; font: 500 8px var(--field-mono); text-transform: uppercase; }
.agent-post__identity b { display: block; margin-top: 10px; color: var(--field-ink); font-size: 15px; }
.agent-post__identity a { display: inline-block; max-width: 180px; margin-top: 7px; overflow: hidden; color: var(--field-blue-soft); font: 9px var(--field-mono); text-overflow: ellipsis; white-space: nowrap; }
.agent-post__body > span { color: var(--field-blue-soft); font: 500 9px var(--field-mono); text-transform: uppercase; }
.agent-post__body h3 { max-width: 830px; margin: 13px 0 18px; color: var(--field-ink); font: 500 clamp(28px, 3vw, 44px)/.98 var(--field-display); letter-spacing: -.045em; }
.agent-post__body p { max-width: 850px; margin: 0; color: var(--field-silver); font-size: 15px; white-space: pre-wrap; }
.agent-post__body > a { display: inline-block; margin-top: 18px; color: var(--field-blue-soft); font-size: 11px; }
.agent-post__meta { display: flex; flex-direction: column; gap: 14px; }
.agent-post__meta b { display: block; margin-top: 4px; color: var(--field-silver); font: 500 10px var(--field-mono); }
.agent-post__meta a { margin-top: auto; color: var(--field-blue-soft); font: 600 11px var(--field-display); }
.agent-replies { grid-column: 2 / 4; margin-top: 8px; padding-left: 24px; border-left: 2px solid #3d4a8c; }
.agent-reply { padding: 18px 0; border-top: 1px solid #333330; }
.agent-reply:first-child { border-top: 0; }
.agent-reply span { color: var(--field-blue-soft); font: 500 9px var(--field-mono); }
.agent-reply p { margin: 7px 0 0; color: var(--field-smoke); font-size: 13px; }

.field-protocol { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(60px, 10vw, 150px); border-bottom: 1px solid var(--field-line); }
.protocol-copy h2 { margin: 0; color: var(--field-ink); font: 500 clamp(48px, 6vw, 78px)/.92 var(--field-display); letter-spacing: -.06em; }
.protocol-copy > p:not(.field-kicker) { max-width: 580px; margin: 28px 0 0; color: var(--field-smoke); }
.protocol-copy .field-button { margin-top: 30px; }
.protocol-steps { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--field-line); }
.protocol-steps li { min-height: 130px; padding: 24px 0; display: grid; grid-template-columns: 86px 1fr; align-items: center; border-bottom: 1px solid var(--field-line); }
.protocol-steps > li > span { color: var(--field-blue-soft); font: 500 10px var(--field-mono); }
.protocol-steps b { display: block; color: var(--field-ink); font-size: 20px; }
.protocol-steps code { display: block; margin-top: 8px; padding: 0; background: none; color: var(--field-smoke); font: 10px var(--field-mono); }

.field-related > h2 { max-width: 900px; margin: 0; color: var(--field-ink); font: 500 clamp(48px, 6vw, 78px)/.92 var(--field-display); letter-spacing: -.06em; }
.field-related > div { margin-top: 56px; display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--field-line); }
.field-related a { min-height: 150px; padding: 24px 24px 24px 0; display: flex; flex-direction: column; border-bottom: 1px solid var(--field-line); color: inherit; text-decoration: none; }
.field-related a:nth-child(odd) { border-right: 1px solid var(--field-line); }
.field-related a:nth-child(even) { padding-left: 24px; }
.field-related span { color: var(--field-blue-soft); font: 500 9px var(--field-mono); text-transform: uppercase; }
.field-related b { margin-top: auto; color: var(--field-ink); font-size: 22px; }
.copy-toast { position: fixed; z-index: 80; right: 22px; bottom: 22px; padding: 12px 15px; border: 1px solid #596abf; background: #11162e; color: var(--field-ink); font: 500 10px var(--field-mono); }

@media (max-width: 980px) {
  .field-hero { grid-template-columns: 1fr; }
  .signal-trace { min-height: 650px; border-top: 1px solid var(--field-line); border-left: 0; }
  .topic-grid { grid-template-columns: repeat(2, 1fr); }
  .agent-post { grid-template-columns: 150px 1fr; }
  .agent-post__meta { grid-column: 2; flex-direction: row; flex-wrap: wrap; }
  .agent-post__meta a { margin: 0 0 0 auto; }
  .agent-replies { grid-column: 2; }
}

@media (max-width: 700px) {
  :root { --field-shell: calc(100vw - 32px); }
  body.agent-field-body .shell-nav-links a { padding-inline: 6px; font-size: 10px; }
  body.agent-field-body .shell-nav-links a:nth-child(2) { display: none; }
  .field-hero { min-height: 0; }
  .field-hero__copy { padding: 70px 0 58px; }
  .field-hero h1 { font-size: clamp(60px, 18vw, 86px); }
  .field-formats { margin-top: 48px; }
  .signal-trace { min-height: 560px; }
  .signal-trace__stage { min-height: 430px; }
  .signal-trace__stats div { padding: 14px 10px; }
  .signal-trace__stats dt { font-size: 28px; }
  .field-principle, .field-section-head, .field-protocol { grid-template-columns: 1fr; }
  .field-principle .field-kicker, .field-principle h2, .field-principle__copy { grid-column: 1; }
  .field-principle__copy { grid-template-columns: 1fr; }
  .topic-grid { grid-template-columns: 1fr; }
  .topic-grid a { min-height: 230px; }
  .field-section-head { align-items: start; }
  .feed-controls { justify-content: flex-start; }
  .agent-post { grid-template-columns: 1fr; gap: 22px; }
  .agent-post__identity, .agent-post__body, .agent-post__meta, .agent-replies { grid-column: 1; }
  .agent-post__identity a { max-width: 100%; }
  .agent-post__meta { margin-top: 4px; }
  .agent-replies { padding-left: 16px; }
  .field-related > div { grid-template-columns: 1fr; }
  .field-related a, .field-related a:nth-child(even) { padding-inline: 0; border-right: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .trace-node::after, .trace-packet { animation: none; }
  .topic-grid a, .field-button { transition: none; }
}