.agentic-stack{--stack-top:#e9e3ee;--stack-front:#b9aec6;--stack-side:#9789a6;--stack-ink:#34263e;--stack-wire:#887099;position:relative;width:100%;aspect-ratio:1;border-radius:8px;overflow:hidden;container-type:inline-size;background:radial-gradient(ellipse at 56% 41%,#f7f3fa,#e3dce9 72%);isolation:isolate;perspective:1000px}
[data-theme=dark] .agentic-stack{--stack-top:#73647f;--stack-front:#493d55;--stack-side:#302637;--stack-ink:#f1e9f7;--stack-wire:#ac91c0;background:radial-gradient(ellipse at 55% 42%,#32283d,#19171f 75%)}
.stack-topline{position:absolute;left:7%;right:7%;top:7%;display:flex;justify-content:space-between;font-size:1.6cqw;letter-spacing:.15em;color:var(--stack-ink);opacity:.7}
.stack-stage{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--stack-rx,0deg)) rotateY(var(--stack-ry,0deg));transition:transform .35s ease-out}
.stack-network{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transform:translateZ(-1px)}
.stack-base{fill:#24212d;opacity:.07}.stack-base-edge{fill:#201d29;opacity:.1}[data-theme=dark] .stack-base{fill:#aa7ed3;opacity:.08}[data-theme=dark] .stack-base-edge{fill:#aa7ed3;opacity:.12}
.stack-wire{stroke:var(--stack-wire);stroke-width:1.8;opacity:.65;stroke-linejoin:round}
.stack-trace,.stack-signal,.stack-packet{stroke:#AA7ED3;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.stack-trace{stroke-width:4;stroke-dasharray:100;stroke-dashoffset:100}
.stack-signal{stroke:#f1daff;stroke-width:7;stroke-dasharray:1 99;stroke-dashoffset:100}
.stack-packet{stroke-width:4;stroke-dasharray:1 99;stroke-dashoffset:100}
.is-flowing .stack-trace{animation:stack-trace .8s ease-out both}.is-flowing .stack-signal{animation:stack-packet .55s linear both}.is-flowing .stack-packet{animation:stack-packet .55s linear both}.is-flowing .packet-1{animation-delay:.07s}.is-flowing .packet-2{animation-delay:.14s}.is-flowing .packet-3{animation-delay:.21s}
[data-stream=action] .stack-trace{stroke-width:6}[data-stream=action] .stack-signal{stroke-width:9}
[data-phase=complete] .wire-action{stroke:#AA7ED3;stroke-width:5;opacity:1}
.stack-node{position:absolute;width:14%;height:14%;transform-style:flat;transition:transform .3s ease;--thickness:10cqw;--mark:var(--stack-ink)}
.stack-intent{left:16%;top:73%;width:13%;height:13%;--thickness:9cqw}.stack-context{left:40%;top:72%;width:17%;height:17%;--thickness:11cqw}.stack-memory{left:18%;top:54%;width:13%;height:13%;--thickness:9cqw}.stack-llm{left:38%;top:44%;width:24%;height:24%;--thickness:16cqw}
.stack-api{left:12%;top:34%}.stack-tools{left:77%;top:34%}.stack-data{left:76%;top:65%}.stack-action{left:52%;top:20%;width:15%;height:15%;--thickness:11cqw}
.stack-solid{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(55deg) rotateZ(-35deg);z-index:0}
.stack-face{position:absolute;backface-visibility:hidden;border:1px solid #ffffff40;transition:background-color .3s ease,border-color .3s ease,box-shadow .3s ease}
.stack-top{inset:0;background:var(--stack-top);transform:translateZ(var(--thickness));border-radius:3px;display:grid;place-items:center}
.stack-front{left:0;top:100%;width:100%;height:var(--thickness);background:var(--stack-front);transform-origin:top;transform:translateZ(var(--thickness)) rotateX(-90deg)}
.stack-side{right:100%;top:0;width:var(--thickness);height:100%;background:var(--stack-side);transform-origin:right;transform:translateZ(var(--thickness)) rotateY(-90deg)}
.stack-mark{font-size:4cqw;color:var(--mark);display:flex;gap:.7cqw;align-items:center;justify-content:center}.stack-mark i{display:block;width:.65cqw;height:3cqw;border-radius:.4cqw;background:currentColor;transform:scaleY(.5);opacity:.8}.stack-mark i:nth-child(2){height:5cqw}.stack-mark i:nth-child(3){height:4cqw}.stack-mark i:nth-child(4){height:2.5cqw}
.stack-node-label{position:absolute;left:-35%;right:-35%;top:99%;text-align:center;font-size:2cqw;line-height:1.3;letter-spacing:.06em;font-weight:700;color:var(--stack-ink);pointer-events:none;z-index:2;transition:color .3s ease}
.stack-node-label small{display:block;font-size:1.25cqw;font-weight:400;letter-spacing:.13em;margin-top:.5cqw;opacity:.85}.stack-llm .stack-node-label{top:60%;font-size:3.2cqw;letter-spacing:-.03em}.stack-llm .stack-node-label small{font-size:1.4cqw;letter-spacing:.2em;opacity:1}
.stack-layer{position:absolute;inset:0;border:1px solid #aa7ed380;border-radius:3px;pointer-events:none;opacity:0;background:#aa7ed30a;transition:transform .3s ease,opacity .3s ease;transform:translateZ(16cqw)}.stack-layer span{position:absolute;right:5%;top:6%;font-size:1.1cqw;letter-spacing:.1em;color:#34213f}
.stack-internal{position:absolute;inset:0;transform:translateZ(17cqw);pointer-events:none}.stack-internal i{position:absolute;width:.8cqw;height:.8cqw;background:#f2dfff;border-radius:50%;opacity:0;left:22%;top:50%}
.stack-hint{position:absolute;bottom:160%;left:50%;transform:translate(-50%,5px);opacity:0;white-space:nowrap;background:#27212e;color:#f4ebfa;border:1px solid #aa7ed366;padding:1cqw 1.6cqw;border-radius:4px;font-size:1.5cqw;letter-spacing:.08em;transition:opacity .2s,transform .2s;pointer-events:none;z-index:3}
@media(hover:hover) and (pointer:fine){.stack-node:hover .stack-hint{opacity:1;transform:translate(-50%,0)}}
.stack-legend{position:absolute;bottom:3.4%;left:7%;display:flex;align-items:center;gap:1.4cqw;font-size:1.5cqw;letter-spacing:.12em;color:var(--stack-ink);opacity:.8}.stack-status-dot{width:.8cqw;height:.8cqw;border-radius:50%;background:#AA7ED3}
.stack-node:is(.is-active,.is-reasoning,.is-executing){transform:translateY(-1cqw);--mark:#302039}
.stack-node:is(.is-active,.is-reasoning,.is-executing) .stack-top{background:#c4a1e3;border-color:#ead4ff;box-shadow:0 0 2cqw #aa7ed350}
.stack-node:is(.is-active,.is-reasoning,.is-executing) .stack-front{background:#AA7ED3;border-color:#dab5f6}
.stack-node:is(.is-active,.is-reasoning,.is-executing) .stack-side{background:#785098;border-color:#b48bd1}
.stack-node:is(.is-active,.is-executing) .stack-node-label{color:#654078}[data-theme=dark] .stack-node:is(.is-active,.is-executing) .stack-node-label{color:#e0b9ff}
.stack-llm.is-reasoning .stack-node-label{color:#291a33}.stack-llm.is-reasoning .layer-one{transform:translateZ(17cqw);opacity:.8}.stack-llm.is-reasoning .layer-two{transform:translateZ(19cqw);opacity:.75}
.stack-llm.is-reasoning .stack-mark i{animation:stack-reason .6s ease-in-out infinite alternate}.stack-llm.is-reasoning .stack-mark i:nth-child(2){animation-delay:-.15s}.stack-llm.is-reasoning .stack-mark i:nth-child(3){animation-delay:-.3s}
.stack-llm.is-reasoning .stack-internal i{animation:stack-internal .7s ease-in-out infinite}.stack-llm.is-reasoning .stack-internal i:nth-child(2){animation-delay:.15s}.stack-llm.is-reasoning .stack-internal i:nth-child(3){animation-delay:.3s}
.stack-action.is-executing{transform:translateY(-1.5cqw)}[data-phase=action] .stack-action.is-executing .stack-top{animation:stack-completion .5s ease-out 1}
@keyframes stack-trace{0%{stroke-dashoffset:100;opacity:.3}68%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:.85}}
@keyframes stack-packet{0%{stroke-dashoffset:100;opacity:0}8%,92%{opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes stack-reason{from{transform:scaleY(.45);opacity:.5}to{transform:scaleY(1);opacity:1}}
@keyframes stack-internal{0%{transform:translate3d(0,0,0);opacity:0}20%{opacity:1}80%{opacity:1}100%{transform:translate3d(10cqw,-2cqw,2cqw);opacity:0}}
@keyframes stack-completion{0%,100%{box-shadow:0 0 2cqw #aa7ed350}50%{box-shadow:0 0 4cqw #aa7ed399}}
@media(max-width:767px){.stack-stage{transform:none}}
@media(prefers-reduced-motion:reduce){.agentic-stack *{animation:none!important;transition:none!important}.stack-stage{transform:none!important}.stack-wire{opacity:.8}.stack-stream{display:none}.stack-node{transform:none!important}.stack-layer{opacity:0}}
.stack-node:not(.stack-llm) .stack-node-label small{display:none}
.stack-action .stack-node-label{top:62%}.stack-action.is-executing .stack-node-label,[data-theme=dark] .stack-action.is-executing .stack-node-label{color:#291a33}
.stack-stream-network{z-index:3;transform:none;pointer-events:none}
[data-phase=complete] [data-stream=action] .stack-trace{opacity:1;stroke-dashoffset:0}
/* Expanded architecture: original face geometry retained. */
.agentic-stack,[data-theme=dark] .agentic-stack{--stack-top:#42354e;--stack-front:#2c2334;--stack-side:#1d1725;--stack-ink:#e9dff2;--stack-wire:#aa7ed3;aspect-ratio:auto;background:radial-gradient(ellipse at 52% 35%,#251c30,#100e15 74%);overflow:visible}
.stack-stage{position:relative;inset:auto;aspect-ratio:1;transform:none!important}
.stack-topline{top:4%;z-index:4;font-size:clamp(8px,1.6cqw,11px);pointer-events:none}
.stack-node{left:var(--node-x)!important;top:var(--node-y)!important;width:var(--node-size)!important;height:var(--node-size)!important;padding:0;background:none;border:0;border-radius:3px;--thickness:8cqw;min-height:0;z-index:4;transition:opacity .2s,transform .3s}
.stack-intent{--node-x:16%;--node-y:80%;--node-size:12%}.stack-agent{--node-x:42%;--node-y:48%;--node-size:22%;--thickness:15cqw}.stack-context{--node-x:25%;--node-y:62%;--node-size:14%}.stack-memory{--node-x:9%;--node-y:47%;--node-size:12%}.stack-rag{--node-x:23%;--node-y:31%;--node-size:14%}.stack-embeddings{--node-x:8%;--node-y:18%;--node-size:9%;--thickness:6cqw}.stack-vector{--node-x:39%;--node-y:16%;--node-size:10%;--thickness:6cqw}.stack-tools{--node-x:78%;--node-y:36%;--node-size:14%}.stack-mcp{--node-x:77%;--node-y:53%;--node-size:9%;--thickness:6cqw}.stack-api{--node-x:81%;--node-y:70%;--node-size:9%;--thickness:6cqw}.stack-data{--node-x:55%;--node-y:77%;--node-size:10%;--thickness:6cqw}.stack-action{--node-x:67%;--node-y:17%;--node-size:13%;--thickness:9cqw}
.stack-solid,.stack-node-label{pointer-events:none}.stack-node-label{top:100%!important;left:-45%;right:-45%;font-size:clamp(10px,1.95cqw,13px);letter-spacing:.03em;color:#e9dff2!important;text-shadow:0 1px 3px #000;white-space:nowrap}.stack-agent .stack-node-label{top:61%!important;font-size:clamp(19px,4cqw,27px);left:-30%;right:-30%}.stack-agent .stack-node-label small{display:block;font-size:clamp(8px,1.3cqw,10px);letter-spacing:.035em;white-space:normal;max-width:150px;margin:3px auto 0}.stack-action .stack-node-label{top:65%!important}.stack-layer span{color:#e9dff2}.stack-wire{opacity:.12;stroke-width:1.1}.stack-wire.is-related{opacity:.9;stroke-width:2.6;filter:drop-shadow(0 0 3px #aa7ed355)}.stack-base{fill:#aa7ed3;opacity:.065;pointer-events:all;cursor:pointer}.stack-base-edge{fill:#aa7ed3;opacity:.1}.stack-governance-perimeter{fill:#aa7ed309;stroke:#aa7ed3;stroke-width:1;stroke-dasharray:4 8;opacity:.3;pointer-events:all;cursor:pointer}.stack-network{z-index:0}.stack-stream-network{z-index:3;pointer-events:none}.stack-signal{stroke-width:5}.stack-packet{stroke-width:3}.stack-trace{stroke-width:3}
.stack-node.is-selected{--mark:#302039;transform:translateY(-1cqw)}.stack-node.is-selected .stack-top{background:#c4a1e3;border-color:#ead4ff;box-shadow:0 0 2cqw #aa7ed350}.stack-node.is-selected .stack-front{background:#AA7ED3}.stack-node.is-selected .stack-side{background:#785098}.stack-node.is-dimmed{opacity:.24}.stack-layer-control{position:absolute;z-index:4;background:transparent;color:#b9a7cb;font-size:clamp(8px,1.4cqw,10px);letter-spacing:.08em;padding:5px 2px;border-radius:3px;min-height:28px}.stack-governance{right:4%;top:86%;max-width:48%;font-size:clamp(8px,1.2cqw,9px)}.stack-observability{left:6%;top:94%}.stack-layer-control.is-selected{color:#f3dfff;background:#aa7ed322}.stack-policy{position:absolute;top:27%;left:62%;font:600 clamp(8px,1.3cqw,10px)/1 Arial;color:#e1b9ff;opacity:0;pointer-events:none}.stack-telemetry{position:absolute;top:95.8%;right:6%;font-size:clamp(7px,1.25cqw,9px);letter-spacing:.03em;color:#9e8ead;pointer-events:none}
[data-phase=authorize] .stack-policy,[data-phase=action] .stack-policy{opacity:1}[data-phase=authorize] .stack-governance-perimeter,[data-phase=action] .stack-governance-perimeter,[data-selected=governance] .stack-governance-perimeter{opacity:.9;stroke-width:2}[data-selected=observability] .stack-base{opacity:.22}[data-selected]:not([data-selected=""]) .stack-policy{opacity:0}
.stack-info{position:relative;margin:0 5% 0;padding:15px 28px 15px 0;min-height:143px;border-top:1px solid #aa7ed32e;color:#ddd1e7;background:linear-gradient(120deg,#ffffff04,transparent);border-radius:0 0 8px 8px}.stack-info strong{display:block;font-size:12px;letter-spacing:.06em;color:#e9d6fb}.stack-info [data-info-subtitle]{display:block;margin-top:4px;font-size:9px;letter-spacing:.08em;color:#b6a3c6}.stack-info p{font-size:12px;line-height:1.5;margin:8px 0 6px;letter-spacing:0;max-width:none}.stack-info [data-info-relation]{font-size:9px;line-height:1.5;letter-spacing:.03em;color:#bf9bda;display:block}.stack-info button{position:absolute;right:0;top:8px;width:28px;height:28px;background:#ffffff0a;color:#e9d6fb;border:1px solid #aa7ed340;border-radius:4px}.stack-node:focus-visible,.stack-layer-control:focus-visible,.stack-info button:focus-visible{outline:2px solid #ddb7fa;outline-offset:5px}.stack-hint{display:none}
@media(max-width:767px){.stack-info{min-height:162px}.stack-topline{font-size:8px}.stack-info p{font-size:12px}.stack-node-label{font-size:10px}.stack-agent .stack-node-label{font-size:20px}.stack-telemetry{font-size:7px}.stack-governance{font-size:8px}.stack-observability{font-size:8px}}
@media(prefers-reduced-motion:reduce){.stack-wire{opacity:.18}.stack-wire.is-related{opacity:1}.stack-policy{display:none}.stack-node.is-selected{transform:none}.stack-stream{display:none!important}}
.stack-solid{pointer-events:auto}
.stack-tools{--node-y:30%}.stack-governance{right:3%;width:32%;max-width:none;top:87%;line-height:1.4}.stack-info{height:155px;min-height:155px}.stack-info p{line-height:1.4}@media(max-width:767px){.stack-info{height:170px;min-height:170px}}
@media(max-width:359px){.stack-context{--node-x:22%;--node-y:65%}.stack-agent .stack-node-label{left:-38%;right:-38%;font-size:19px}}
