@font-face{font-family:EAArchivo;src:url('../assets/archivo-regular.ttf') format('truetype');font-display:swap;font-weight:400}
@font-face{font-family:EAArchivo;src:url('../assets/archivo-medium.ttf') format('truetype');font-display:swap;font-weight:500 700}
@font-face{font-family:EAPlex;src:url('../assets/plex-mono.ttf') format('truetype');font-display:swap}
.ea-agent{--ea-ink:#1e4059;--ea-cyan:#48b9ce;--ea-light:#b7e2de;--ea-teal:var(--ea-ink);--ea-paper:#fff8e9;--ea-muted:color-mix(in srgb,var(--ea-ink) 76%,var(--ea-paper));--ea-rule:color-mix(in srgb,var(--ea-ink) 23%,var(--ea-paper));box-sizing:border-box;background:var(--ea-paper);color:var(--ea-ink);padding:38px max(28px,calc((100vw - 1180px)/2)) 26px;font:400 16px/1.45 EAArchivo,Arial,sans-serif;isolation:isolate}
.ea-agent *{box-sizing:border-box}.ea-agent p,.ea-agent h2,.ea-agent figure{margin:0}.ea-agent button,.ea-agent a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ea-agent button{font:inherit;color:inherit;cursor:pointer}.ea-agent button:focus-visible,.ea-agent a:focus-visible{outline:3px solid var(--ea-teal);outline-offset:4px}.ea-eyebrow{display:flex;justify-content:space-between;font:12px/1.4 EAPlex,monospace;letter-spacing:.025em}.ea-eyebrow span{color:var(--ea-muted)}.ea-heading h2{font-size:clamp(38px,4.8vw,68px);line-height:1.03;letter-spacing:-.055em;font-weight:500;margin-top:22px}.ea-heading h2 br{display:none}.ea-intro{font-size:17px;margin-top:15px!important;color:var(--ea-muted)}
/* The scene and the state copy each own a real grid cell. */
.ea-theatre{display:grid;grid-template-columns:minmax(270px,.72fr) minmax(0,1.28fr);grid-template-areas:'tabs tabs' 'copy scene';gap:20px 36px;margin-top:28px;align-items:center}.ea-states{grid-area:tabs;display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px}.ea-states button{min-height:48px;text-align:left;font-size:14px;padding:12px 0;border:0;border-top:1px solid var(--ea-rule);background:transparent;color:var(--ea-muted)}.ea-states button[aria-pressed="true"]{border-top:2px solid var(--ea-ink);padding-top:11px;color:var(--ea-ink);font-weight:500}.ea-visual{grid-area:scene;min-width:0;width:100%}.ea-scene{position:relative;width:100%;height:clamp(330px,30vw,410px);pointer-events:none;overflow:hidden}.ea-scene canvas{display:block;width:100%;height:100%}.ea-fallback-mark{position:absolute;width:110px;height:110px;object-fit:contain;inset:0;margin:auto}.ea-scene[data-renderer="webgl"] .ea-fallback-mark{display:none}.ea-agent-caption{min-height:40px;display:flex;justify-content:center;align-items:center;gap:10px;font:12px/1.45 EAPlex,monospace;color:var(--ea-muted);padding:6px 0 14px}.ea-caption-rule{flex:0 0 24px;height:1px;background:var(--ea-teal)}.ea-evidence{grid-area:copy;min-width:0;padding-bottom:32px}.ea-sheet[hidden]{display:none}.ea-sheet-label{font:12px/1.5 EAPlex,monospace;color:var(--ea-muted);display:flex;gap:8px;align-items:center}.ea-status-dot{flex:0 0 6px;width:6px;height:6px;background:var(--ea-teal);border-radius:50%}.ea-message{font-size:clamp(30px,3.05vw,44px);line-height:1.12;letter-spacing:-.045em;font-weight:500;margin-top:17px!important;max-width:360px}.ea-support{font-size:15px;line-height:1.65;color:var(--ea-muted);margin-top:20px!important}.ea-progress{display:flex;gap:7px;margin-top:23px;max-width:144px}.ea-progress span{height:3px;flex:1;background:var(--ea-light)}.ea-progress span[data-current="true"],.ea-progress span[data-complete="true"]{background:var(--ea-teal)}.ea-after .ea-sheet-label{color:var(--ea-ink)}
.ea-foot{border-top:1px solid var(--ea-rule);padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:16px}.ea-foot>p{font:12px/1.4 EAPlex,monospace;color:var(--ea-muted)}.ea-playback{display:flex;gap:10px;align-items:center;min-width:0}.ea-play,.ea-reset{min-height:46px;border:1px solid var(--ea-ink);border-radius:30px;background:transparent;display:flex;align-items:center;justify-content:center;gap:11px;padding:9px 20px;font-size:14px!important}.ea-play{background:var(--ea-ink);color:var(--ea-paper)!important;min-width:224px}.ea-reset{flex:0 0 46px;width:46px;padding:0;font-size:23px!important}.ea-details{min-height:46px;display:flex;align-items:center;gap:14px;padding:6px 0;color:var(--ea-ink);font-size:14px;text-decoration:none}.ea-play:active,.ea-reset:active{transform:scale(.98)}.ea-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-agent[data-reduced="true"] *,html.reduce-motion .ea-agent *{transition:none!important;animation:none!important}.ea-agent[data-reduced="true"] .ea-play:active,.ea-agent[data-reduced="true"] .ea-reset:active{transform:none}
@media(hover:hover) and (pointer:fine){.ea-play:hover{background:var(--ea-teal);border-color:var(--ea-teal)}.ea-reset:hover{background:var(--ea-light)}.ea-states button:hover{color:var(--ea-ink)}.ea-details:hover{text-decoration:underline;text-underline-offset:5px}}
@media(max-width:760px){.ea-agent{padding:25px 24px 20px}.ea-heading h2{font-size:clamp(37px,10.6vw,49px);line-height:1.04;margin-top:20px}.ea-heading h2 br{display:block}.ea-intro{font-size:15px;line-height:1.5;margin-top:14px!important;max-width:330px}.ea-theatre{grid-template-columns:minmax(0,1fr);grid-template-areas:'tabs' 'scene' 'copy';gap:0;margin-top:24px}.ea-states{grid-template-columns:1fr 1.6fr 1fr;gap:14px}.ea-states button{font-size:13px;min-height:48px;white-space:nowrap}.ea-scene{height:clamp(300px,89vw,430px);margin-top:4px}.ea-agent-caption{min-height:33px;padding:0 0 11px;font-size:12px}.ea-evidence{min-height:161px;padding:16px 0 23px;border-top:1px solid var(--ea-rule)}.ea-sheet-label{font-size:12px}.ea-message{font-size:30px;margin-top:10px!important;max-width:100%}.ea-message br{display:none}.ea-support{font-size:14px;margin-top:12px!important;line-height:1.55}.ea-progress{margin-top:15px}.ea-foot{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding-top:17px}.ea-playback{grid-row:1;grid-column:1/-1;justify-content:space-between;margin-bottom:5px}.ea-play{flex:1;min-width:0;padding-inline:12px}.ea-foot>p{font-size:12px}.ea-details{font-size:13px}.ea-reset{flex-basis:46px}}
@media(max-width:360px){.ea-agent{padding-inline:18px}.ea-states{gap:9px}.ea-states button{font-size:12px}.ea-heading h2{font-size:37px}.ea-message{font-size:28px}.ea-support{font-size:13px}.ea-play{font-size:13px!important}.ea-details{font-size:12px}}
@media(prefers-reduced-motion:reduce){.ea-agent *{animation:none!important;transition:none!important}.ea-play:active,.ea-reset:active{transform:none}}
/* R3.1: playback remains in normal flow immediately before the visible action. */
.ea-theatre{grid-template-areas:'tabs tabs' 'controls controls' 'copy scene';row-gap:12px}.ea-playback{grid-area:controls;justify-content:flex-end;margin-bottom:0}.ea-play{min-width:136px}.ea-foot{margin-top:12px}
@media(max-width:760px){.ea-theatre{grid-template-areas:'tabs' 'controls' 'scene' 'copy';row-gap:0}.ea-playback{grid-area:controls;justify-content:space-between;margin:7px 0 8px}.ea-play{flex:1;min-width:0}.ea-foot{grid-template-columns:1fr auto;margin-top:0}.ea-details{grid-column:2}}
/* Framing fix: one desktop command row; stable canvas and no programmatic scroll. */
@media(min-width:761px){
  .ea-agent{padding-top:20px;padding-bottom:16px}
  .ea-heading h2{font-size:clamp(40px,4vw,50px);margin-top:14px}
  .ea-intro{font-size:16px;margin-top:10px!important}
  .ea-theatre{grid-template-areas:'tabs controls' 'copy scene';margin-top:18px;row-gap:10px}
  .ea-states{grid-template-columns:1fr 1.6fr 1fr;gap:12px}
  .ea-states button{white-space:nowrap}
  .ea-playback{align-self:start;min-height:48px}
  .ea-scene{height:clamp(320px,47.2vh,360px)}
  .ea-agent-caption{min-height:24px;padding:0;font-size:12px}
  .ea-evidence{padding-bottom:0}
  .ea-foot{margin-top:0;padding-top:10px}
}
@media(max-width:760px){
  .ea-agent{padding-top:18px;padding-bottom:16px}
  .ea-heading h2{margin-top:14px}
  .ea-intro{margin-top:10px!important}
  .ea-theatre{margin-top:16px}
  .ea-playback{margin:4px 0 6px}
  .ea-agent-caption{min-height:28px;padding-bottom:6px}
  .ea-evidence{padding-top:14px;padding-bottom:17px}
  .ea-foot{padding-top:10px}
}

/* Cinematic R1: the colour accents follow the official Echoes board. */
.ea-agent .ea-progress span[data-current="true"]{background:var(--ea-cyan)}
.ea-agent .ea-status-dot,.ea-agent .ea-caption-rule{background:var(--ea-cyan)}
.ea-agent[data-state="after"] .ea-after .ea-sheet-label{font-weight:500;color:var(--ea-ink)}
@media(hover:hover) and (pointer:fine){.ea-agent .ea-play:hover{background:var(--ea-cyan);border-color:var(--ea-ink);color:var(--ea-ink)!important}}
