.warden-section{background:#193e36;color:#f5f7ee;padding:76px 0 44px}.warden-intro{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:38px}.warden-intro .eyebrow{color:#a9c5ad;margin-bottom:16px}.warden-intro h2{font-size:48px}.warden-intro h2 em{font-style:normal;color:#c7d9bd}.warden-intro>p{color:#ccdace;font-size:14px;line-height:1.9;padding-bottom:4px}.warden-demo{background:var(--paper);color:var(--ink);border-radius:18px;overflow:hidden}.demo-top{display:flex;justify-content:space-between;padding:23px 30px 20px;font-size:9px;letter-spacing:.13em;color:#64806a}.demo-top>span:first-child{display:flex;align-items:center;gap:9px}.demo-top>span:last-child{letter-spacing:0;color:#8c9787;font-size:10px}.scenario-tabs{display:flex;margin:0 30px;border-bottom:1px solid #dce5d7;gap:30px}.scenario-tabs button{position:relative;display:flex;align-items:center;gap:9px;padding:9px 0 17px;background:none;border:0;color:#748170;font-size:12px;white-space:nowrap}.scenario-tabs button[aria-pressed=true]{color:#285b46}.scenario-tabs button[aria-pressed=true]:after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#285b46}.tab-mark{font-size:16px}.scenario-tabs small{font-size:9px;color:#8d9885;margin-left:4px}.warden-stage{position:relative;overflow:hidden;padding-top:75px}.stage-decision{position:absolute;top:25px;left:20px;right:20px;text-align:center}.stage-decision>span{font:25px Georgia,serif;letter-spacing:-.5px;color:#285b46}.stage-decision p{font-size:11px;color:#7a8774;margin-top:5px}.warden-map{width:100%;height:auto;max-height:310px}.request-detail{margin:0 30px;padding:17px 0;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dce5d7;gap:10px}.request-detail>div{display:flex;align-items:center;gap:17px}.detail-label{font-size:8px;color:#82917d;letter-spacing:.12em}.request-detail code{font-size:12px}.request-scope{font-size:10px;color:#7b8774}.outcome{font-size:10px;color:#6a7e65;background:#eaf0e5;border-radius:20px;padding:4px 12px;white-space:nowrap}.warden-demo[data-phase=denied] .outcome{color:#965b48;background:#f2e5dd}.warden-demo[data-phase=waiting] .outcome{color:#8a6c36;background:#f3ecd9}.warden-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:14px 30px 20px}.warden-bottom p{font-size:10px;color:#798773}.warden-bottom button{border:0;background:none;color:#476d50;font-size:11px;padding:4px}.warden-bottom button span{font-size:16px;margin-left:7px}.warden-footnote{text-align:center;color:#9db7a4;font-size:11px;margin-top:24px}.human-approval{margin:15px 30px 0;padding:16px 18px;background:#f2eedf;border:1px solid #e3dcc6;border-radius:9px;display:flex;justify-content:space-between;align-items:center;gap:15px}.human-approval>div{display:flex;align-items:center;gap:12px}.approval-avatar{width:32px;height:32px;display:grid;place-items:center;background:#e5ddc6;color:#7c6b42;border-radius:50%;font-family:Georgia,serif}.human-approval strong{display:block;font-size:12px;font-weight:500}.human-approval p>span{display:block;font-size:10px;color:#857b5e;margin-top:3px}.human-approval button{background:#285b46;color:#f9faf7;border:0;border-radius:30px;padding:10px 16px;font-size:11px}.human-approval button>span{margin-left:12px}@media(min-width:1400px){.warden-map{max-height:350px}}
@media(max-width:760px){.warden-section{padding:50px 0 30px}.warden-intro{display:block;margin-bottom:28px}.warden-intro h2{font-size:36px}.warden-intro>p{font-size:13px;margin-top:20px}.warden-intro>p br{display:none}.warden-demo{border-radius:12px}.demo-top{padding:19px 18px 15px;font-size:8px}.demo-top>span:last-child{font-size:8px}.scenario-tabs{margin:0 18px;gap:0;justify-content:space-between}.scenario-tabs button{font-size:10px;display:flex;flex-wrap:wrap;justify-content:center;gap:4px;padding:8px 2px 12px}.scenario-tabs small{flex-basis:100%;font-size:8px;margin:0}.tab-mark{font-size:12px}.warden-stage{padding-top:85px}.stage-decision{top:22px;left:12px;right:12px}.stage-decision>span{font-size:23px}.stage-decision p{font-size:10px;max-width:240px;margin:5px auto 0}.warden-map{width:155%;max-width:none;margin-left:-27.5%}.warden-map text{font-size:18px}.warden-map g>g text{font-size:14px}.warden-map .tool-building{transform:translateX(-112px)}.warden-map text[x="840"]{transform:translateX(-112px)}.destination-check{transform:translateX(-112px)}.request-detail{margin:0 18px;padding:15px 0}.request-detail>div{gap:4px;align-items:start;flex-direction:column}.request-detail code{font-size:11px}.request-scope{font-size:9px}.detail-label{font-size:7px}.outcome{font-size:9px;padding:4px 9px}.warden-bottom{padding:12px 18px 17px;gap:12px}.warden-bottom p{font-size:9px;max-width:220px}.warden-bottom button{font-size:10px;white-space:nowrap}.human-approval{margin:12px 18px 0;padding:12px;flex-direction:column;align-items:stretch}.human-approval strong{font-size:11px}.human-approval p>span{font-size:9px}.human-approval button{align-self:flex-end;font-size:10px}.warden-footnote{font-size:10px;margin-top:19px}}
@media(prefers-reduced-motion:reduce){.request-packet,.portcullis,.stop-mark,.destination-check{transition:none!important}}
/* Character-led story: the agent stays inside the sandbox. */
.scene-agent{transform:translate(242px,239px);transition:transform 1.6s ease-in-out}.agent-body{transform-origin:0 -10px}.agent-leg{transform-origin:0 -7px}.agent-hand{transform-origin:18px -29px;transition:transform .4s}.carried-letter,.guard-paper{opacity:0;transition:opacity .3s}.guard-arm{transform-origin:-20px -48px;transition:transform .5s}.guard-shield{transform-origin:20px -46px;transition:transform .5s}.guard-bubble,.stop-mark,.destination-check{opacity:0;transition:opacity .3s}.shield-cross{opacity:0}.request-packet{opacity:0;transform:translate(380px,205px);transition:transform 1.5s ease-in-out,opacity .3s}.motion-controls{display:flex;gap:15px;align-items:center}.guard-paper{display:none}.warden-character .guard-paper{display:block}.warden-map .guard-bubble text{font-size:12px}.warden-map .sandbox-enclosure text{font-size:12px}.warden-map .sandbox-enclosure text:last-child{font-size:10px}
.warden-demo[data-phase=working] .agent-hand{animation:typing .35s ease-in-out 5 alternate}.warden-demo[data-phase=working] .terminal-screen{animation:terminal-glow .7s 3 alternate}
.warden-demo[data-phase=travel] .scene-agent,.warden-demo[data-phase=checking] .scene-agent,.warden-demo[data-phase=waiting] .scene-agent,.warden-demo[data-phase=passing] .scene-agent,.warden-demo[data-phase=denied] .scene-agent{transform:translate(350px,239px)}
.warden-demo[data-phase=travel] .agent-body,.warden-demo[data-phase=returning] .agent-body{animation:agent-walk .28s infinite alternate}.warden-demo[data-phase=travel] .left-leg,.warden-demo[data-phase=returning] .left-leg{animation:leg-step .28s infinite alternate}.warden-demo[data-phase=travel] .right-leg,.warden-demo[data-phase=returning] .right-leg{animation:leg-step .28s infinite alternate-reverse}
.warden-demo[data-phase=travel] .carried-letter{opacity:1}.warden-demo[data-phase=checking] .agent-hand{transform:rotate(-14deg)}.warden-demo[data-phase=checking] .request-packet{opacity:1;transform:translate(421px,198px);transition-duration:.65s}.warden-demo[data-phase=checking] .guard-arm{transform:rotate(12deg)}.warden-demo[data-phase=checking] .guard-paper{opacity:1;transition-delay:.6s}.warden-demo[data-phase=checking] .guard-body{animation:guard-read .7s ease-in-out 2 alternate}
.warden-demo[data-phase=checking] .guard-bubble,.warden-demo[data-phase=waiting] .guard-bubble,.warden-demo[data-phase=passing] .guard-bubble,.warden-demo[data-phase=denied] .guard-bubble,.warden-demo[data-phase=returning] .guard-bubble,.warden-demo[data-phase=complete] .guard-bubble{opacity:1}
.warden-demo[data-phase=waiting] .guard-paper{opacity:1}.warden-demo[data-phase=waiting] .guard-bubble rect,.warden-demo[data-phase=waiting] .guard-bubble>path{fill:#8c723d}
.warden-demo[data-phase=passing] .guard-arm{transform:rotate(-34deg)}.warden-demo[data-phase=passing] .guard-body{animation:guard-nod .7s ease-in-out}.warden-demo[data-phase=passing] .request-packet{transform:translate(810px,205px);opacity:1;transition-delay:.35s,0s}.warden-demo[data-result=allow][data-phase=complete] .destination-check,.warden-demo[data-result=allow][data-phase=returning] .destination-check{opacity:1}.warden-demo[data-result=allow][data-phase=returning] .tool-light,.warden-demo[data-result=allow][data-phase=complete] .tool-light{fill:#285b46}
.warden-demo[data-phase=denied] .guard-shield,.warden-demo[data-result=deny][data-phase=returning] .guard-shield,.warden-demo[data-result=deny][data-phase=complete] .guard-shield{transform:translate(-36px,-8px) rotate(-12deg)}.warden-demo[data-result=deny] .shield-check{opacity:0}.warden-demo[data-result=deny] .shield-cross{opacity:1}.warden-demo[data-result=deny] .guard-bubble rect,.warden-demo[data-result=deny] .guard-bubble>path{fill:#97644f}.warden-demo[data-result=deny] .stage-decision>span{color:#97644f}.warden-demo[data-result=deny] .outcome{color:#97644f;background:#f2e5dd}.warden-demo[data-phase=denied] .request-packet{transform:translate(382px,205px);opacity:1;transition-duration:.6s}.warden-demo[data-phase=denied] .agent-body{animation:agent-recoil .5s ease-out}.warden-demo[data-result=deny][data-phase=returning] .carried-letter,.warden-demo[data-result=deny][data-phase=complete] .carried-letter{opacity:1}.warden-demo[data-phase=returning] .agent-facing{transform:scaleX(-1)}.warden-demo[data-phase=waiting] .outcome{background:#f3ecd9;color:#8a6c36}.warden-demo[data-phase=waiting] .stage-decision>span{color:#8a6c36}
.warden-demo[data-paused=true] *{animation-play-state:paused!important}
@keyframes agent-walk{to{transform:translateY(-3px) rotate(2deg)}}@keyframes leg-step{to{transform:rotate(22deg)}}@keyframes typing{to{transform:rotate(14deg)}}@keyframes terminal-glow{to{fill:#668f65}}@keyframes guard-read{to{transform:rotate(-3deg);transform-origin:0 0}}@keyframes guard-nod{50%{transform:translateY(3px)}}@keyframes agent-recoil{50%{transform:translateX(-8px) rotate(-5deg)}}
@media(max-width:760px){.warden-map{width:155%;margin-left:-25%}.warden-map .sandbox-enclosure text{font-size:14px}.warden-map .sandbox-enclosure text:last-child{font-size:11px}.warden-demo[data-phase=passing] .request-packet{transform:translate(707px,205px)}.warden-map text[x="250"]{transform:none}.warden-map text[x="470"]{transform:translateX(18px)}.warden-map .guard-bubble text{font-size:15px}.motion-controls{gap:9px}}
@media(prefers-reduced-motion:reduce){.scene-agent,.agent-hand,.guard-arm,.guard-shield,.request-packet{transition:none!important}}