:root{--bg:#07101b;--panel:#0c1827;--panel2:#101f31;--line:#26394e;--text:#f4f7fb;--muted:#99a9bb;--aws:#ff9900;--k8s:#4d8ff7;--gitops:#a982ff;--secure:#39d98a;--danger:#ff5f69;--active:#f6b94b}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;color:var(--text);background:var(--bg);font:400 16px/1.6 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}button,a{font:inherit}button{color:inherit}.skip-link{position:fixed;z-index:100;top:.7rem;left:.7rem;padding:.5rem .8rem;color:#07101b;background:var(--secure);transform:translateY(-180%)}.skip-link:focus{transform:none}.site-bar{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:.9rem 5vw;border-bottom:1px solid var(--line);background:rgba(7,16,27,.94);backdrop-filter:blur(12px)}.site-bar a{color:var(--muted);font-weight:700;text-decoration:none}.site-bar span{color:var(--muted);font:700 .68rem/1 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.08em}.site-bar i{display:inline-block;width:7px;height:7px;margin-right:.4rem;border-radius:50%;background:var(--secure);box-shadow:0 0 12px var(--secure)}main{width:min(1320px,92vw);margin:auto}.project-header{padding:clamp(4rem,8vw,7rem) 0 3.2rem}.kicker{margin:0 0 .65rem;color:var(--secure);font:800 .7rem/1.2 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.12em}.project-header h1{max-width:950px;margin:0;font-size:clamp(2.2rem,5vw,4.8rem);line-height:1.03;letter-spacing:-.05em}.lede{max-width:760px;margin:1.4rem 0;color:var(--muted);font-size:clamp(1rem,2vw,1.2rem)}.header-meta{display:flex;flex-wrap:wrap;gap:.5rem}.header-meta span,.detail-tags span{padding:.3rem .55rem;border:1px solid var(--line);border-radius:4px;color:#c8d2dd;background:var(--panel);font:700 .68rem/1.3 ui-monospace,monospace}.summary-strip,.workflow-section,.guardrails,.project-action{margin-bottom:1.3rem;padding:clamp(1.1rem,2.7vw,2rem);border:1px solid var(--line);border-radius:12px;background:var(--panel)}.section-intro{display:flex;align-items:baseline;gap:1rem}.section-intro h2,.workflow-head h2,.project-action h2{margin:0;font-size:clamp(1.4rem,2.4vw,2rem)}.summary-strip ol{display:flex;align-items:center;gap:.5rem;margin:1.2rem 0 0;padding:0;overflow-x:auto;list-style:none;scrollbar-width:thin}.summary-strip li{display:flex;align-items:center;white-space:nowrap;padding:.45rem .65rem;border:1px solid var(--line);border-radius:5px;background:var(--bg);font:700 .68rem/1.2 ui-monospace,monospace}.summary-strip li:not(:last-child)::after{content:"→";margin-left:1.15rem;color:var(--secure)}.workflow-head{display:flex;justify-content:space-between;gap:2rem}.workflow-head>div>p:last-child{margin:.35rem 0;color:var(--muted)}.workflow-controls{display:flex;flex-direction:column;align-items:flex-end;gap:.7rem}.workflow-controls fieldset{display:flex;gap:.35rem;margin:0;padding:0;border:0}.workflow-controls legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.workflow-controls label input{position:absolute;opacity:0}.workflow-controls label span{display:block;padding:.42rem .65rem;border:1px solid var(--line);border-radius:5px;color:var(--muted);cursor:pointer;font-size:.72rem;font-weight:750}.workflow-controls input:checked+span{color:var(--text);border-color:var(--secure);background:rgba(57,217,138,.1)}.workflow-controls input[value=failure]:checked+span{border-color:var(--danger);background:rgba(255,95,105,.09)}.button-row{display:flex;gap:.45rem}.run-button,.reset-button{padding:.5rem .8rem;border:1px solid var(--line);border-radius:5px;background:var(--bg);cursor:pointer;font-size:.76rem;font-weight:800}.run-button{color:#06130c;border-color:var(--secure);background:var(--secure)}button:disabled{cursor:wait;opacity:.6}.progress{height:3px;margin-top:1.2rem;overflow:hidden;background:var(--line)}.progress span{display:block;width:0;height:100%;background:var(--secure);transition:width .35s}.run-status{margin:.45rem 0 1.2rem;color:var(--muted);font:700 .67rem/1.2 ui-monospace,monospace;text-align:right}.pipeline{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(230px,1fr);gap:2rem;overflow-x:auto;padding:.25rem .15rem 1rem;scroll-snap-type:x proximity}.stage-card{position:relative;min-height:245px;padding:1rem;border:1px solid var(--line);border-radius:9px;text-align:left;background:var(--bg);cursor:pointer;scroll-snap-align:start;opacity:0;transform:translateY(12px);transition:border-color .2s,transform .2s,box-shadow .2s,opacity .45s}.stage-card.revealed{opacity:1;transform:none}.stage-card::after{content:"→";position:absolute;left:calc(100% + .72rem);top:50%;color:#50647a;font:800 1rem/1 ui-monospace,monospace}.stage-card:last-child::after{display:none}.stage-card:hover,.stage-card:focus-visible,.stage-card.selected{border-color:var(--accent,var(--secure));transform:translateY(-3px);outline:none;box-shadow:0 10px 25px rgba(0,0,0,.25)}.stage-card.running{border-color:var(--active);box-shadow:0 0 0 3px rgba(246,185,75,.13)}.stage-card.passed{border-color:var(--secure);background:#091d19}.stage-card.failed{border-color:var(--danger);background:#211218;animation:shake .3s}.stage-top{display:flex;justify-content:space-between;align-items:center}.stage-number{color:var(--accent,var(--secure));font:800 .65rem/1 ui-monospace,monospace}.stage-state{padding:.2rem .4rem;border-radius:3px;color:var(--muted);background:var(--panel2);font:800 .58rem/1 ui-monospace,monospace;text-transform:uppercase}.stage-card.running .stage-state{color:#1b1303;background:var(--active)}.stage-card.passed .stage-state{color:#04150c;background:var(--secure)}.stage-card.failed .stage-state{color:#210408;background:var(--danger)}.stage-icon{display:grid;place-items:center;width:43px;height:43px;margin:1rem 0;color:var(--accent,var(--secure));border:1px solid color-mix(in srgb,var(--accent,var(--secure)) 45%,transparent);border-radius:8px;background:color-mix(in srgb,var(--accent,var(--secure)) 10%,transparent);font:800 .9rem/1 ui-monospace,monospace}.stage-card h3{margin:0;font-size:1rem;line-height:1.25}.stage-card>p{margin:.45rem 0 .85rem;color:var(--muted);font-size:.78rem}.tag-list{display:flex;flex-wrap:wrap;gap:.3rem}.tech-tag{position:relative;padding:.24rem .4rem;border:1px solid var(--line);border-radius:3px;color:#b9c6d4;background:var(--panel);font:700 .6rem/1.2 ui-monospace,monospace}.tech-tag:focus-visible{outline:2px solid var(--accent,var(--secure));outline-offset:2px}.tech-tag:hover::after,.tech-tag:focus-visible::after{content:attr(data-tooltip);position:absolute;z-index:10;left:0;bottom:calc(100% + .45rem);width:190px;padding:.5rem;color:var(--text);border:1px solid var(--line);border-radius:4px;background:#030913;font:600 .65rem/1.4 system-ui;box-shadow:0 8px 20px #000}.guardrail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin-top:1.2rem}.guardrail-grid article{padding:1rem;border-left:2px solid var(--secure);background:var(--bg)}.guardrail-grid span{color:var(--secure);font:800 .65rem/1 ui-monospace,monospace}.guardrail-grid h3{margin:.8rem 0 .3rem;font-size:.9rem}.guardrail-grid p{margin:0;color:var(--muted);font-size:.76rem}.project-action{display:flex;justify-content:space-between;align-items:center;gap:2rem;margin-bottom:5rem}.project-action p:last-child{margin:.4rem 0 0;color:var(--muted)}.project-action a{flex:none;padding:.7rem 1rem;color:#08111d;border-radius:5px;background:var(--aws);font-weight:850;text-decoration:none}.detail-panel{position:fixed;z-index:50;top:0;right:0;width:min(460px,100%);height:100dvh;padding:1.5rem;overflow-y:auto;border-left:1px solid var(--line);background:#091522;box-shadow:-25px 0 60px #0008;transform:translateX(105%);visibility:hidden;transition:.25s}.detail-panel.open{transform:none;visibility:visible}.detail-head{display:flex;justify-content:space-between;align-items:center;color:var(--secure);font:800 .68rem/1 ui-monospace,monospace}.detail-head button{width:38px;height:38px;border:1px solid var(--line);border-radius:5px;background:transparent;cursor:pointer;font-size:1.4rem}.detail-symbol{display:grid;place-items:center;width:62px;height:62px;margin:3rem 0 1.4rem;border:1px solid var(--secure);border-radius:10px;color:var(--secure);background:#0c2820;font:800 1rem/1 ui-monospace,monospace}.detail-phase{color:var(--secure);font:800 .68rem/1 ui-monospace,monospace}.detail-panel h2{margin:.4rem 0;font-size:1.8rem}.detail-panel>p:not(.detail-phase){color:var(--muted)}.detail-panel h3{margin:1.6rem 0 .5rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.08em}.detail-panel ul{padding-left:1.1rem;color:#c4ced8;font-size:.84rem}.detail-tags{display:flex;flex-wrap:wrap;gap:.35rem}.backdrop{position:fixed;z-index:40;inset:0;background:#000b}.backdrop[hidden]{display:none}@keyframes shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
@media(max-width:900px){.workflow-head{flex-direction:column}.workflow-controls{align-items:flex-start}.guardrail-grid{grid-template-columns:1fr 1fr}.project-action{align-items:flex-start;flex-direction:column}.pipeline{grid-auto-flow:row;grid-auto-columns:auto;overflow:visible}.stage-card{min-height:auto}.stage-card::after{content:"↓";left:50%;top:calc(100% + .65rem);transform:translateX(-50%)}}
@media(max-width:560px){main{width:94vw}.site-bar span{display:none}.project-header{padding-top:3rem}.summary-strip li:not(:last-child)::after{margin-left:.85rem}.workflow-controls fieldset{flex-direction:column}.guardrail-grid{grid-template-columns:1fr}.section-intro{display:block}.project-action a{width:100%;text-align:center}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}.stage-card{opacity:1;transform:none}}
